:root{
  --brand:#0d6efd;
}
body{
  font-family: Lato, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  /* background: #f6f6f6; */
  color: #212529;
  overflow-x: hidden;
}
.container{
  max-width:1340px;
  margin:auto;
  padding:0 15px;
}
.main-container{
 
  padding:0 40px;
}
.navbar-brand{ color:var(--brand); }
.card img{ object-fit:cover; height:200px; }

/* Hero / Carousel styles */
.hero-carousel .carousel-inner, .hero-carousel .carousel-item { height:auto; }
.hero-carousel .carousel-item img { object-fit:contain; width:100%; height:100%; }
.hero-carousel .carousel-caption { top:50%; transform:translateY(-50%); bottom:auto; }
.hero-carousel .carousel-caption h2, .hero-carousel .carousel-caption p { text-shadow: 0 6px 20px rgba(0,0,0,0.45); }


/* Category cards */
.category-card{ position:relative; overflow:hidden; border-radius:8px; }
.category-card img{ width:100%; height:220px; object-fit:cover; display:block; transition:transform .4s ease; }
.category-card:hover img{ transform:scale(1.05); }
.category-label{ position:absolute; left:16px; bottom:16px; color:white; font-weight:600; text-shadow:0 2px 6px rgba(0,0,0,0.4); }

/* Products */
.product_section_heading{text-transform: uppercase;}
.product-card{ border:1px solid #ccc; padding: 12px;border-radius: 0px;}
.product-img-wrap{ overflow:hidden; }
.product-img-wrap img{ width:100%; height:100%; object-fit:cover; transition:transform .3s ease;border-radius: 0; }
.product-card:hover .product-img-wrap img{ transform:scale(1.05); }
.card-body{padding-left: 0;padding-right: 0;padding-bottom: 0;}
.card-title{text-transform: uppercase;}

/* New arrivals horizontal track */
.new-arrivals-track{ scroll-behavior:smooth; padding-bottom:6px; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; touch-action: pan-x; }
.new-arrivals-track::-webkit-scrollbar{ height:0; background:transparent; }
.new-arrivals-track::-webkit-scrollbar-thumb{ background:transparent; }
.new-arrivals-track .card{ min-width:200px; flex:0 0 auto; }

.newsletter{background-color: #f18f9f1a;}
.newsletter h5{font-weight: 600;color: #f18f9f;font-size: 15px;letter-spacing: 1px;}
.newsletter input{border-radius: 0;border: 1px solid #ccc;height: 45px;    background: #fff;
    border: 1px solid #f18f9f;}
.newsletter .btn{background-color: #f18f9f;border-radius: 0;height: 45px;border: 1px solid #f18f9f;text-transform: uppercase;letter-spacing: 1px;font-weight: 600;padding: 0 25px;}
@media (min-width:1200px){
  .new-arrivals-track .card{ width: 18%; }
}

/* Category track (image-only) */
.category-track{ scroll-behavior:smooth; -ms-overflow-style: none; scrollbar-width: none; padding-bottom:6px; }
.category-track::-webkit-scrollbar{ height:0; background:transparent; }
/* .category-track .cat-item{ min-width:260px; } */
.category-track .cat-item img{ height:160px; object-fit:cover; display:block; }

@media (min-width:768px){ .category-track .cat-item img{ height:auto; } }
@media (min-width:1200px){ .category-track .cat-item{ width:100%; } }

/* Footer */
.footer {
  font-size: 14px;
  color: #222;
}

  /* Footer social icons */
  .social-icons{ display:flex; gap:8px; margin-top:8px; }
  .social-link{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; background:#f1f1f1; border-radius:50%; color:#333; text-decoration:none; transition:all .15s ease; }
  .social-link:hover{ transform:translateY(-3px); background:#e9ecef; color:var(--brand); }
  .social-link .bi{ font-size:18px; }
.footer-title {
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 6px;
}

.footer-links a {
  text-decoration: none;
  color: #000;
}

.footer-links a:hover {
  text-decoration: underline;
}

.footer-text {
  font-size: 13px;
  line-height: 1.6;
}

.footer-phone {
  color: #ff6f6f;
  text-decoration: none;
}

.app-links img {
  height: 42px;
  margin-right: 10px;
  margin-top: 10px;
}

.social-icons a {
  display: inline-flex;
  width: 36px;
  height: 36px;
  background: #222;
  color: #fff;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-right: 8px;
  text-decoration: none;
  font-weight: bold;
}

.help-btn {
  display: inline-block;
  background: #ff8f9c;
  color: #fff;
  padding: 6px 12px;
  font-size: 12px;
  border-radius: 4px;
  text-decoration: none;
  margin-top: 5px;
}

.footer-bottom {
  font-size: 13px;
  color: #000;
}


/* TOP BAR */
.top-bar {
  background: #f7f7f7;
  text-align: center;
  font-size: 13px;
  padding: 20px 10px;
}

/* HEADER */
.site-header {
  background: #fff;
  border-bottom: 1px solid #eee;
  position: relative;
  z-index: 1000;
  padding: 15px 0;
}

.logo {
  font-size: 22px;
  font-weight: 700;
  color: #000;
  text-decoration: none;
}

/* NAV */
.main-nav {
  list-style: none;
  display: flex;
  align-items: start;
  gap: 28px;
  margin: 0;
  padding: 0;
}

.main-nav li {
  position: static;
}

.main-nav a {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  text-decoration: none;
  line-height: 1.2;
}

.main-nav small {
  font-size: 12px;
  color: #777;
}

.main-nav li:hover > a {
  color: #ff2f92;
}

/* ICONS */
.header-icons i {
  font-size: 18px;
  margin-left: 18px;
  cursor: pointer;
  color: #000;
}

/* MEGA MENU */
.has-mega {
  position: static;
}

/* .mega-menu {
  position: absolute;
  left: 10px;
  top: 80%;
  width: 70%;
  background: #fff;
  padding: 40px 20px;
  border-top: 1px solid #eee;
  display: none;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
} */


.mega-menu {
  position: absolute;
  left: 18%;
  top: 70%;
  width: 20%;
  background: #fff;
  padding: 30px 20px 20px;
  border-top: 1px solid #eee;
  display: none;
  -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.mega-menu-2{left: 30%;}

@media (min-width: 992px) {
  .has-mega:hover .mega-menu {
    display: block;
  }
}

.mega-menu h6 {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 12px;
}

.mega-menu ul {
  list-style: none;
  padding: 0;
}

.mega-menu ul li {
  margin-bottom: 6px;
}

.mega-menu ul a {
  font-size: 13px;
  color: #555;
  text-decoration: none;
}

.mega-menu ul a:hover {
  text-decoration: underline;
}

/* MOBILE SAFETY */
@media (max-width: 991px) {
  .main-nav {
    display: none;
  }
}


@media (max-width:576px){
  .hero{ min-height:300px; padding:3rem 0; }
  .category-card img{ height:140px; }
}