:root{
  --bg: #fbfbfc;
  --text: #0f172a;
  --primary: #ff6f61;
  --hover: #ff9a8f;
  --card: #ffffff;
  --muted: rgba(15,23,42,0.68);
  --border: rgba(15,23,42,0.10);
}

body{
  background: var(--bg);
  color: var(--text);
}

/* Global mobile safety */
*{
  box-sizing: border-box;
}

html, body{
  max-width: 100%;
  overflow-x: hidden;
}

img, svg, video, canvas{
  max-width: 100%;
  height: auto;
}

/* Make taps easier on small screens */
@media (max-width: 575.98px){
  button, a, input, select, textarea, label{
    -webkit-tap-highlight-color: transparent;
  }

  .btn{
    padding-left: 12px;
    padding-right: 12px;
  }
}


/* Override a few bootstrap light backgrounds used in markup */
.bg-white,
.border-top.bg-white,
#categories.bg-white{
  background: transparent !important;
  border-color: var(--border) !important;
}

.navbar{
  background: rgba(255,255,255,0.98) !important;
  border-bottom: 1px solid var(--border) !important;
}

.navbar-brand{
  color: var(--text) !important;
  display: flex;
  align-items: center;
}

.navbar-brand img{
  width: 100%;
  max-width: 200px;
  height: auto;
  border-radius: 10px;
}

.bg-gradient{
  background: linear-gradient(90deg, rgba(255,111,97,0.18), rgba(25,211,230,0.12)) !important;
}

.hero-card{
  background: rgba(255,255,255,0.95) !important;
  border: 1px solid var(--border) !important;
  box-shadow: 0 10px 30px rgba(20,20,20,0.04);
}

.hero-icon{
  background: rgba(255,111,97,0.14);
}

.text-muted,
.form-text,
.small.text-muted,
.text-muted small{
  color: var(--muted) !important;
}

.category-row{
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  gap: 20px;
  padding-bottom: 6px;
}

.category-chip{
  border: 1px solid var(--border);
  background: #fff;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 13px;
  color: var(--text);
  cursor: pointer;
  transition: transform .08s ease, border-color .2s ease, background .2s ease;
  white-space: nowrap;
}

.category-chip:hover{
  transform: translateY(-1px);
  border-color: rgba(255,111,97,0.55);
  background: rgba(255,111,97,0.08);
}

.category-chip[data-active="true"]{
  border-color: rgba(255,111,97,0.8);
  background: rgba(255,111,97,0.12);
}

.filters-card{
  background: var(--card) !important;
  border-radius: 16px;
  border: 1px solid var(--border) !important;
  box-shadow: 0 10px 30px rgba(20,20,20,0.03);
}

.product-card{
  /*border-radius: 16px;*/
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--card);
}

.product-img{
  height: 300px;
  /*object-fit: cover;*/
  background: #f3f3f6;
}

/* Wishlist button clipping fix (mobile) */
.product-card .btn[aria-label="Wishlist"]{
  line-height: 1;
}

@media (max-width: 575.98px){
  .product-img{ height: 250px; }
  /*.product-img{ height: 160px; }*/

  .product-card .p-3{
    padding-left: 12px;
    padding-right: 12px;
  }

  .product-card .btn[aria-label="Wishlist"]{
    flex: 0 0 auto;
    min-width: 42px;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
  }
}


.product-title{
  font-size: 14px;
  min-height: 36px;
  color: var(--text);
}

.badge-off{
  background: rgba(255,111,97,0.12);
  color: #b33b31;
  border: 1px solid rgba(255,111,97,0.35);
}

.cart-item-img{
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
  background: #f3f3f6;
}

/* Inputs/selects */
.form-control,
.form-select{
  background: #fff !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

.form-control::placeholder{
  color: rgba(15,23,42,0.38) !important;
}

/* Buttons */
.btn-primary{
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active{
  background: var(--hover) !important;
  border-color: var(--hover) !important;
}

.btn-outline-primary{
  border-color: rgba(255,111,97,0.55) !important;
  color: var(--primary) !important;
}

.btn-outline-primary:hover{
  background: rgba(255,111,97,0.10) !important;
  border-color: rgba(255,111,97,0.85) !important;
  color: var(--primary) !important;
}

.btn-outline-dark{
  border-color: rgba(15,23,42,0.15) !important;
  color: var(--text) !important;
}

.btn-outline-dark:hover{
  border-color: rgba(255,111,97,0.85) !important;
  color: var(--primary) !important;
}

/* Footer */
footer{
  border-top: 1px solid var(--border) !important;
}

.modal-content{
  background: var(--card) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
}

.modal-header,
.modal-footer{
  border-color: var(--border) !important;
}

.table{
  color: var(--text);
}

.table th,
.table td{
  border-color: var(--border) !important;
}

.gsk-header{
    width:100%;
    background:#fff;
    box-shadow:0 2px 10px rgba(0,0,0,0.08);
    position:relative;
    z-index:999;
}

.gsk-container{
    width:95%;
    margin:auto;
}

/* NAVBAR */
.gsk-navbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:15px 0;
}

/* Sticky header (Desktop + Mobile) */
/* .site-header-sticky{
  top: 0;
  position: sticky !important;
  z-index: 1050;
  background: rgba(255,255,255,0.98);
} */

/* Mobile search row should stick just below top navbar */
/* .site-header-sticky-mobile{
  position: sticky !important;
  top: 0;
  z-index: 1049;
  background: rgba(255,255,255,0.98);
} */

/* Sticky header (Desktop + Mobile) */
.site-header-sticky{
  position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99999 !important;
    background: #fff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}

/* Mobile search row should stick just below top navbar */
.site-header-sticky-mobile{
  position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99999 !important;
    background: #fff !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);  
}

/* Prevent fixed header overlap */
body{
  padding-top: 80px; /* desktop header height approximation */
}

@media (max-width: 991px){
  body{
    padding-top: 120px; /* desktop+mobile search row approximation */
  }

  /* Mobile search row sticky */
  #searchInput,
  .container.d-lg-none.mt-2.mb-2{
    /* no-op: placeholder to keep specificity stable */
  }

  .container.d-lg-none.mt-2.mb-2{
    position: fixed;
    left: 0;
    right: 0;
    top: 55px; 
    z-index: 99998;
    background: #fff;
    padding-top: 25px;
    padding-bottom: 8px;
  }
}



/* MENU */
.gsk-menu{
    display:flex;
    align-items:center;
    gap:30px;
    list-style:none;
}

.gsk-menu > li{
    position:relative;
}

.gsk-menu > li > a{
    text-decoration:none;
    color:#222;
    font-size:15px;
    font-weight:600;
    padding:10px 0;
    display:flex;
    align-items:center;
    gap:6px;
    transition:.3s;
}

.gsk-menu > li > a:hover{
    color:#7c3aed;
}

/* MEGA MENU */
.gsk-mega-menu{
    position:absolute;
    top:120%;
    left:0;
    width:950px;
    background:#fff;
    border-radius:16px;
    box-shadow:0 15px 40px rgba(0,0,0,0.12);
    padding:25px;
    display:flex;
    gap:20px;
    opacity:0;
    visibility:hidden;
    transition:.3s ease;
}

/* SHOW MEGA MENU */
.gsk-menu li:hover .gsk-mega-menu{
    opacity:1;
    visibility:visible;
    top:100%;
}

/* LEFT MENU */
.gsk-mega-left{
    width:240px;
    border-right:1px solid #eee;
}

.gsk-category{
    position:relative;
}

.gsk-category > a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:13px 15px;
    text-decoration:none;
    color:#333;
    border-radius:10px;
    transition:.3s;
    font-size:14px;
    font-weight:600;
}

.gsk-category > a:hover{
    background:#f4efff;
    color:#7c3aed;
}

/* SUBMENU */
.gsk-submenu{
    position:absolute;
    left:100%;
    top:0;
    width:650px;
    background:#fff;
    padding:10px 25px;
    display:none;
    min-height:100%;
}

.gsk-category:hover .gsk-submenu{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}

/* SUBMENU COLUMN */
.gsk-sub-column h4{
    color:#7c3aed;
    margin-bottom:12px;
    font-size:15px;
}

.gsk-sub-column ul{
    list-style:none;
}

.gsk-sub-column ul li{
    margin-bottom:10px;
}

.gsk-sub-column ul li a{
    text-decoration:none;
    color:#555;
    font-size:14px;
    transition:.3s;
}

.gsk-sub-column ul li a:hover{
    color:#7c3aed;
    padding-left:4px;
}

/* RIGHT BANNER */
.gsk-offer{
    background:linear-gradient(135deg,#7c3aed,#9333ea);
    color:#fff;
    padding:20px;
    border-radius:14px;
    margin-top:20px;
}

.gsk-offer h3{
    font-size:22px;
    margin-bottom:10px;
}

.gsk-offer p{
    font-size:14px;
    line-height:1.6;
}

/* Hero banner */
.gsk-hero-banner{
  /* padding: 16px 0; */
}

.gsk-hero-banner__inner{
  /* max-width: 1200px; */
  margin: 0 auto;
  /* padding: 0 12px; */
}

.gsk-hero-banner__img{
  width: 100%;
  height: auto;
  display: block;
  /* border-radius: 16px;  */
  object-fit: cover;
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}

@media (max-width: 575.98px){
  .gsk-hero-banner{ padding: 10px 0; }
  .gsk-hero-banner__img{ border-radius: 0; }
}


/* RESPONSIVE */
@media(max-width:991px){

    .gsk-navbar{
        flex-direction:column;
        align-items:flex-start;
    }

    .gsk-menu{
        flex-direction:column;
        width:100%;
        gap:0;
    }

    .gsk-menu > li{
        width:100%;
    }

    .gsk-menu > li > a{
        padding:14px;
        border-bottom:1px solid #eee;
    }

    .gsk-mega-menu{
        position:static;
        width:100%;
        flex-direction:row;
        gap:14px;
        opacity:1;
        visibility:visible;
        display:none;
        box-shadow:none;
        padding:15px;
    }


    .gsk-menu li:hover .gsk-mega-menu{
        display:flex;
    }

    .gsk-mega-menu{
        max-height: calc(100vh - 120px);
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .gsk-submenu{
        position:static;
        width:100%;
        display:none;
        padding:15px 0;
        max-height: 55vh;
        overflow-y:auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Mobile: hover not reliable; toggle via .is-open */
    .gsk-category.is-open .gsk-submenu{
        display:block;
    }

    .gsk-category{
        border-bottom:1px solid #eee;
    }

}

/* SECTION */
.fashion-category-section{
    padding:60px 0;
    overflow:hidden;
}


.fashion-title{
    font-size:48px;
    font-weight:700;
    color:#111;
    margin-bottom:10px;
}

.fashion-subtitle{
    color:#777;
    font-size:17px;
    margin-bottom:55px;
}


.fashion-card{
    position:relative;
    border-radius:30px;
    overflow:hidden;
    height:420px;
    transition:0.5s;
    cursor:pointer;
    background:#000;
}

.fashion-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:0.7s;
}


.fashion-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(to top, rgba(0,0,0,0.75), rgba(0,0,0,0.1));
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    padding:30px;
}

.fashion-overlay span{
    color:#fff;
    font-size:14px;
    letter-spacing:2px;
    text-transform:uppercase;
    opacity:0.8;
}

.fashion-overlay h3{
    color:#fff;
    font-size:34px;
    font-weight:700;
    margin-top:8px;
}

.fashion-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-top:18px;
    color:#fff;
    text-decoration:none;
    font-size:15px;
    font-weight:500;
    transition:0.3s;
}

.fashion-btn i{
    width:38px;
    height:38px;
    border-radius:50%;
    background:#fff;
    color:#000;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:0.4s;
}


.fashion-card:hover{
    transform:translateY(-10px);
}

.fashion-card:hover img{
    transform:scale(1.1);
}

.fashion-card:hover .fashion-btn i{
    transform:translateX(6px);
}


.big-card{
    height:520px;
}

.small-card{
    height:250px;
}


@media(max-width:991px){

    .fashion-title{
        font-size:36px;
    }

    .big-card,
    .fashion-card{
        height:400px;
    }

    .small-card{
        height:280px;
    }
}

@media(max-width:576px){

    .fashion-title{
        font-size:28px;
    }

    .fashion-overlay h3{
        font-size:26px;
    }

    .fashion-card,
    .big-card,
    .small-card{
        height:320px;
    }
}


.brand-section{
    padding:80px 0;
    background:#fff;
    overflow:hidden;
}

/* TITLE */
.brand-title{
    text-align:center;
    margin-bottom:50px;
}

.brand-title span{
    color:#ff3f6c;
    font-weight:600;
    letter-spacing:2px;
    text-transform:uppercase;
    font-size:14px;
}

.brand-title h2{
    font-size:42px;
    font-weight:700;
    margin-top:10px;
    color:#111;
}

/* SLIDER */
.brand-slider{
    position:relative;
    overflow:hidden;
}

/* TRACK */
.brand-track{
    display:flex;
    width:calc(250px * 12);
    animation:scroll 25s linear infinite;
}

/* CARD */
.brand-card{
    width:220px;
    height:130px;
    background:#fff;
    margin:0 15px;
    border-radius:25px;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 8px 25px rgba(0,0,0,0.06);
    transition:0.4s;
    flex-shrink:0;
    border:1px solid #f1f1f1;
}

.brand-card img{
    width:120px;
    object-fit:contain;
    filter:grayscale(100%);
    transition:0.4s;
}

.brand-card:hover{
    transform:translateY(-8px);
    box-shadow:0 15px 35px rgba(0,0,0,0.12);
}

.brand-card:hover img{
    filter:grayscale(0%);
    transform:scale(1.05);
}

/* ANIMATION */
@keyframes scroll{

    0%{
        transform:translateX(0);
    }

    100%{
        transform:translateX(calc(-250px * 6));
    }
}

/* RESPONSIVE */
@media(max-width:768px){

    .brand-title h2{
        font-size:30px;
    }

    .brand-card{
        width:170px;
        height:110px;
    }

    .brand-card img{
        width:90px;
    }
}

/* CATEGORY SECTION */
.gsk-category-section{
    padding:35px 0;
    background:#faf7fb;
    overflow:hidden;
}

/* Advertisement Section (index.php) */
.gsk-ad-section{
    padding: 0 0 70px 0;
    background: #fff;
}

.gsk-ad-card{
  background: linear-gradient(135deg, rgba(255,111,97,0.16), rgba(25,211,230,0.10));
  border: 1px solid var(--border);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(20,20,20,0.04);
  padding: 15px;
}

.gsk-ad-badge{
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,111,97,0.12);
  border: 1px solid rgba(255,111,97,0.25);
  color: rgba(179,59,49,1);
  font-weight: 800;
  font-size: 12px;
  margin-bottom: 10px;
}

.gsk-ad-title{
  font-size: 28px;
  font-weight: 900;
  margin-bottom: 10px;
}

.gsk-ad-text{
  color: rgba(15,23,42,0.72);
  font-weight: 600;
}

.gsk-ad-btn{
  font-weight: 900;
  padding: 12px 18px;
  border-radius: 14px;
}


/* SLIDER */
.gsk-category-scroll{
    display:flex;
    gap:22px;
    overflow-x:auto;
    overflow-y:hidden;
    flex-wrap:nowrap;
    width:100%;
    scrollbar-width:none;
}

.gsk-category-scroll::-webkit-scrollbar{
    display:none;
}


/* ITEM */
.gsk-category-item{
    flex:0 0 auto;
    min-width:115px;
    text-align:center;
    cursor:pointer;
    flex-shrink:0;
    transition:.3s;
}


.gsk-category-item:hover{
    transform:translateY(-6px);
}

/* IMAGE BOX */
.gsk-category-img{
    width:115px;
    height:115px;
    /* border-radius:40px 40px 10px 10px; */
    border-radius: 50%;;
    background:#f5e8f2;
    overflow:hidden;
    margin-bottom:14px;
    position:relative;
}

.gsk-category-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.4s;
}

.gsk-category-item:hover img{
    transform:scale(1.08);
}

/* TITLE */
.gsk-category-item h4{
    font-size:15px;
    font-weight:600;
    color:#333;
    margin:0;
}

/* MOBILE */
@media(max-width:768px){

    .gsk-category-item{
        min-width:90px;
    }

    .gsk-category-img{
        width:90px;
        height:90px;
    }

    .gsk-category-item h4{
        font-size:10px;
    }

    .gsk-hero-banner__item{
        height: 250px;
    }

}

/* HERO BANNER */
.gsk-hero-banner{
    position:relative;
    width:100%;
    overflow:hidden;
}

/* SLIDER */
.gsk-hero-banner__slider{
  position:relative;
  width:100%;
  height:420px; /* increased */
}

/* Make hero banner responsive */
.gsk-hero-banner__item{
  touch-action: manipulation;
}

@media (max-width: 768px){
  .gsk-hero-banner__slider{ height: 300px; }
}

@media (max-width: 575.98px){
  .gsk-hero-banner__slider{ height: 240px; }
  .gsk-hero-dots{ bottom: 14px; }
  .gsk-prev{ left: 10px; }
  .gsk-next{ right: 10px; }
  .gsk-hero-btn{ backdrop-filter: blur(8px); }
}



/* ITEM */
.gsk-hero-banner__item{
    position:absolute;
    inset:0;
    opacity:0;
    transition:1s ease;
}

.gsk-hero-banner__item.active{
    opacity:1;
    position:relative;
}

/* IMAGE */
.gsk-hero-banner__img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
}

/* DOTS */
.gsk-hero-dots{
    position:absolute;
    bottom:20px;
    left:50%;
    transform:translateX(-50%);
    display:flex;
    gap:10px;
}

.gsk-hero-dots span{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#ffffff80;
    cursor:pointer;
    transition:.3s;
}

.gsk-hero-dots span.active{
    background:#fff;
    width:28px;
    border-radius:20px;
}
/* PREV NEXT BUTTON */
.gsk-hero-btn{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    background:#ffffffc7;
    backdrop-filter:blur(10px);
    color:#333;
    font-size:18px;
    cursor:pointer;
    z-index:10;
    transition:.3s;
}

.gsk-hero-btn:hover{
    background:#fff;
}

.gsk-prev{
    left:20px;
}

.gsk-next{
    right:20px;
}

/*#thumbsWrap{*/
/*    overflow:auto; max-height: 550px;*/
    /* Firefox */
/*    scrollbar-width: none;*/

    /* IE & Edge */
/*    -ms-overflow-style: none;*/
/*}*/

#thumbsWrap,
#thumbsWrap1 {
    order: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;

    width: 100%;
    max-width: 100%;

    overflow-x: auto;
    overflow-y: hidden;

    gap: 10px;
    padding: 5px 0 10px;
    margin-bottom: 10px;

    box-sizing: border-box;

    scrollbar-width: thin;
    -ms-overflow-style: auto;
}

#thumbsWrap img {
    width: 100px;
    min-width: 100px;
    max-width: 100px;

    height: 92px;
    min-height: 92px;

    object-fit: contain;

    flex: 0 0 100px;

    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 4px;
    background: #fff;
    cursor: pointer;
}

/* MOBILE */
@media(max-width:768px){

    .gsk-hero-btn{
        width:40px;
        height:40px;
        font-size:15px;
    }

  /* Product detail page thumbnails -> bottom (all sizes) */
  /*.filters-card .row.g-3{*/
  /*  flex-direction: row;*/
  /*}*/

  /* Thumbs -> bottom: desktop + mobile */
  /* thumnbsWrap ko order dene ke liye parent row (g-3) ko flex column banana zaroori hai */
  .filters-card .row.g-3{
    flex-direction: row;
    display: flex;
  }

  #thumbsWrap{
    order: 1;

    flex: 0 0 auto;
    /*max-height: unset !important;*/
    overflow:auto;
    max-height: 400px;
    width: 100%;
    /*overflow-x: auto;*/
    /*overflow-y: hidden;*/
    display: flex;
    /*gap: 10px;*/
    /*flex-direction: column;*/
    padding-bottom: 4px;
    margin-bottom: 10px;
  }

  #thumbsWrap button{
    margin-bottom: 0 !important;
    max-width: 120px;
    min-width: 120px;
    height: auto;
  }

  #thumbsWrap img{
    height: 92px;
    width: 100px;
  }

  .filters-card .col-12.col-md-10{
    order: 1;
  }




}

/* FEATURES SECTION */
.gsk-features-section{
    padding:50px 0;
    background:#faf7fb;
}

/* BOX */
.gsk-feature-box{
    background:#fff;
    border-radius:22px;
    padding:30px 25px;
    display:flex;
    align-items:center;
    gap:18px;
    height:100%;
    transition:.4s;
    box-shadow:0 5px 20px rgba(0,0,0,0.05);
    border:1px solid #f1e4ee;
}

.gsk-feature-box:hover{
    transform:translateY(-8px);
    box-shadow:0 12px 35px rgba(159,32,137,0.12);
}

/* ICON */
.gsk-feature-icon{
    width:70px;
    height:70px;
    min-width:70px;
    border-radius:18px;
    background:linear-gradient(135deg, rgb(80 27 30), rgb(241 233 224));
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:28px;
}

/* CONTENT */
.gsk-feature-content h4{
    font-size:20px;
    font-weight:700;
    color:#222;
    margin-bottom:6px;
}

.gsk-feature-content p{
    margin:0;
    color:#777;
    font-size:15px;
    line-height:1.5;
    display: block;
}

/* MOBILE */
@media(max-width:768px){

    .gsk-features-section{
        padding:30px 0;
    }

    .gsk-feature-box{
        padding:22px 18px;
    }

    .gsk-feature-icon{
        width:60px;
        height:60px;
        min-width:60px;
        font-size:24px;
    }

    .gsk-feature-content h4{
        font-size:14px;
    }

    /*.gsk-feature-content p{*/
    /*  display: none;*/
    /*}*/

}

/* Minimal baseline to avoid broken styling while cart CSS is applied.
   Replace/extend once original styles.css is restored. */

body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;}

/* =====================
   Cart (fc-*) styles
   ===================== */

.fc-pageBg{ background: #f5f5f5; }

.fc-checkoutHeader{
  background:#fff;
  border-bottom:1px solid rgba(15,23,42,0.08);
}

.fc-brandLogo{
  width:120px;
  height:auto;
  border-radius:12px;
}

.fc-stepper{ gap: 14px; }
.fc-step{ display:flex; align-items:center; gap:10px; }
.fc-stepDot{
  width:34px; height:34px;
  border-radius:50%;
  border:2px solid rgba(159,32,137,0.25);
  color: var(--primary);
  display:flex; align-items:center; justify-content:center;
  font-weight:700;
  background:#fff;
  font-size:12px;
}
.fc-stepLabel{ font-size:13px; font-weight:600; color: rgba(15,23,42,0.65); }

.fc-step.is-active .fc-stepDot{ background: rgba(159,32,137,0.12); border-color: var(--primary); }
.fc-step.is-active .fc-stepLabel{ color: var(--primary); }

.fc-pageTitle{ font-size:20px; font-weight:800; }
.fc-muted{ color: rgba(15,23,42,0.6) !important; }

.fc-primaryBtn{
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color:#fff !important;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight:700;
}
.fc-primaryBtn:hover{ filter: brightness(0.98); opacity:0.96; }

.fc-clearBtn{
  border-radius: 12px;
}

.fc-leftStack{ min-height: 260px; }

.fc-emptyState{
  border:1px dashed rgba(159,32,137,0.25);
  border-radius: 18px;
  background: rgba(159,32,137,0.04);
}
.fc-emptyIcon{ font-size:48px; }

.fc-summarySticky{ position:static; }
@media(min-width:992px){
  .fc-summarySticky{ position: sticky; top: 22px; }
}

.fc-summaryCard{
  background:#fff;
  border-radius:18px;
  box-shadow: 0 12px 30px rgba(15,23,42,0.08);
  border:1px solid rgba(15,23,42,0.08);
}

.fc-divider{ border-top:1px solid rgba(15,23,42,0.08); }
.fc-discountTotal{ color:#1f8f3a; }
.fc-successBox{
  background: rgba(25,135,84,0.10);
  border:1px solid rgba(25,135,84,0.25);
  border-radius: 14px;
  padding: 12px 12px;
}
.fc-successSub{ color: rgba(15,23,42,0.62) !important; }

.fc-secureWrap{
  border-top:1px solid rgba(15,23,42,0.08);
  padding-top:16px;
}
.fc-secureIcon{
  width:44px; height:44px;
  background: rgba(159,32,137,0.10);
  display:flex; align-items:center; justify-content:center;
  color: var(--primary);
}
.fc-secureRow{ display:flex; gap:10px; flex-wrap:wrap; }
.fc-secureChip{
  background: rgba(159,32,137,0.07);
  border:1px solid rgba(159,32,137,0.20);
  color: rgba(15,23,42,0.82);
  border-radius: 999px;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 600;
}

/* Item card */
.fc-itemsStack{ display:flex; flex-direction:column; gap:14px; }

.fc-itemCard{
  background: #faf3f1;
  border-radius:18px;
  /*border:1px solid rgba(159,32,137,0.14);*/
  border:1px solid #ff6f6175;
  box-shadow: 0 12px 26px rgba(159,32,137,0.08);
  overflow:hidden;
  transition: transform .15s ease;
}
.fc-itemCard:hover{ transform: translateY(-2px); }

.fc-itemCardInner{ padding:14px; position:relative; }
.fc-itemEditCol{ position:absolute;     top: 13px;
    right: 50px; }

.fc-editBtn{
  border-radius: 12px;
  background: rgba(159,32,137,0.10) !important;
  border:1px solid rgba(159,32,137,0.25) !important;
  color: var(--primary) !important;
  padding: 6px 8px !important;
}
.fc-removeBtn{
  border-radius: 12px;
  background: rgba(15,23,42,0.06) !important;
  border:1px solid rgba(15,23,42,0.10) !important;
  color: rgba(15,23,42,0.7) !important;
  padding: 6px 8px !important;
}
.fc-removeBtn:hover{ background: rgba(15,23,42,0.10) !important; }

.fc-itemImageWrap{
  width:90px; height:90px;
  border-radius: 16px;
  background: rgba(255,255,255,0.7);
  border:1px solid rgba(15,23,42,0.08);
  overflow:hidden;
}
.fc-itemImage{ width:100%; height:100%; object-fit:cover; }

.fc-itemTitle{ font-size:14px; font-weight:900; color: rgba(15,23,42,0.92); max-width: 320px; }
.fc-itemMeta{ margin-top:4px; }
.fc-pill{
  display:inline-block;
  background: rgba(159,32,137,0.10);
  color: rgba(159,32,137,0.95);
  border:1px solid rgba(159,32,137,0.22);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 10px;
}

.fc-itemPricing{ line-height:1.2; }
.fc-sellingPrice{ font-size:16px; font-weight:900; }
.fc-mrpRow{ display:flex; align-items:center; gap:10px; margin-top:4px; flex-wrap:wrap; }
.fc-oldPrice{ text-decoration: line-through; color: rgba(15,23,42,0.45); font-weight:700; font-size:13px; }
.fc-saveTag{ color: #1f8f3a; font-weight:800; font-size:12px; }

.fc-smallText{ font-size:12px; font-weight:700; color: rgba(15,23,42,0.65); }

.fc-qtyRow{ display:flex; align-items:center; gap:10px; }
.fc-qtyBtn{
  width:34px; height:34px;
  border-radius: 12px;
  border:1px solid rgba(159,32,137,0.22);
  background: rgba(255,255,255,0.7) !important;
  color: var(--primary);
  font-weight:900;
}
.fc-qtyNum{ min-width: 26px; text-align:center; font-weight:900; }

.fc-sizeSelect{
  border-radius: 14px;
  border:1px solid rgba(15,23,42,0.12) !important;
  background:#fff !important;
}

.fc-sellerRow{ margin-top: 2px; }

/* Remove animation */
.fc-removeAnimating{
  opacity: 0;
  transform: translateX(-12px) scale(0.98);
  transition: opacity .28s ease, transform .28s ease;
}

@media(max-width:767.98px){
  .fc-stepperWrap{ width:100%; }
  .fc-stepLabel{ font-size:12px; }
  .fc-itemTitle{ max-width: 210px; }
}

.nav-item{
    margin-right: 10px;
}


.gsk-category-item a{
    text-decoration: none;
}

/* Bottom nav needs spacing on mobile pages */
@media (max-width: 991px){
  body{ padding-bottom: 78px; }
}


/*search suggestions*/

.search-suggestions{
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    background:#fff;
    box-shadow:0 4px 15px rgba(0,0,0,.1);
    border-radius:0 0 10px 10px;
    display:none;
    z-index:9999;
}

.search-suggestion-item{
    display:flex;
    gap:12px;
    align-items:center;
    padding:10px;
    text-decoration:none;
    color:#333;
}

.search-suggestion-item:hover{
    background:#f5f7fa;
}

.search-suggestion-item img{
    width:40px;
    height:40px;
    object-fit:cover;
    border-radius:4px;
}

.search-suggestion-category{
    font-size:12px;
    color:#2874f0;
}

/*profile*/

.profile-image-wrapper{
    position: relative;
    width: 88px;
    height: 88px;
}

.profile-image{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.1);
}

.profile-upload-btn{
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--bs-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 12px;
}

.profile-upload-btn:hover{
    opacity: 0.9;
}

.order-card{
    display:flex;
    gap:15px;
    padding:15px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:16px;
    margin-bottom:15px;
}

.order-image{
    width:110px;
    flex-shrink:0;
}

.order-image img{
    width:100%;
    height:110px;
    object-fit:cover;
    border-radius:12px;
}

.order-content{
    flex:1;
}

.order-product-name{
    font-size:16px;
    font-weight:600;
    text-decoration:none;
}

.order-category{
    color:#888;
    font-size:13px;
    margin-top:4px;
}

.order-details{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
    font-size:14px;
}

@media(max-width:576px){

    .order-card{
        flex-direction:column;
    }

    .order-image{
        width:100%;
    }

    .order-image img{
        width:100%;
        height:180px;
    }
}


        .terms-header{
            background: linear-gradient(135deg, rgba(255,111,97,0.16), rgba(25,211,230,0.10));
            color:#282828;
            padding:70px 0;
        }

        .terms-card{
            background:#fff;
            border-radius:15px;
            padding:40px;
            margin-top:-40px;
            box-shadow:0 5px 25px rgba(0,0,0,.08);
        }

        .terms-card h4{
            color:#0d6efd;
            margin-top:30px;
            margin-bottom:15px;
        }

        .terms-card p,
        .terms-card li{
            color:#555;
            line-height:1.8;
        }

        .last-updated{
            font-size:14px;
            opacity:.9;
        }

        @media(max-width:768px){
            .terms-card{
                padding:25px;
            }

            .terms-header{
                padding:50px 0;
            }
        }
        
        .success-card{
            max-width:600px;
            width:100%;
            background:#fff;
            border-radius:20px;
            padding:40px 30px;
            text-align:center;
            box-shadow:0 10px 30px rgba(0,0,0,0.08);
        }

        .success-icon{
            width:100px;
            height:100px;
            background:#d1e7dd;
            color:#198754;
            border-radius:50%;
            display:flex;
            align-items:center;
            justify-content:center;
            margin:0 auto 25px;
            font-size:50px;
        }

        .order-box{
            background:#f8f9fa;
            border:1px solid #e9ecef;
            border-radius:12px;
            padding:20px;
            margin-top:25px;
            text-align:left;
        }

        .btn-custom{
            min-width:180px;
        }

        @media(max-width:576px){
            .success-card{
                padding:30px 20px;
            }

            .btn-custom{
                width:100%;
                margin-bottom:10px;
            }
        }
        
        .cancel-card{
            max-width:600px;
            width:100%;
            background:#fff;
            border-radius:20px;
            padding:40px 30px;
            text-align:center;
            box-shadow:0 10px 30px rgba(0,0,0,0.08);
        }

        .cancel-icon{
            width:100px;
            height:100px;
            margin:0 auto 25px;
            border-radius:50%;
            background:#f8d7da;
            color:#dc3545;
            display:flex;
            justify-content:center;
            align-items:center;
            font-size:50px;
        }

        .info-box{
            background:#fff3cd;
            border:1px solid #ffe69c;
            border-radius:12px;
            padding:15px;
            margin-top:20px;
            color:#856404;
        }

        .btn-custom{
            min-width:180px;
        }

        @media(max-width:576px){
            .btn-custom{
                width:100%;
                margin-bottom:10px;
            }
        }
        
        .cancel-payment{
            display:flex;
            justify-content:center;
            align-items:center;

        }
        
        .faq-header{
            background: linear-gradient(135deg, rgba(255, 111, 97, 0.16), rgba(25, 211, 230, 0.10));
            color: #282828;
            padding: 70px 0;
        }

        .faq-section{
            margin-top:-40px;
            margin-bottom:50px;
        }

        .faq-card{
            background:#fff;
            border-radius:15px;
            box-shadow:0 5px 20px rgba(0,0,0,0.08);
            padding:30px;
        }

        .accordion-button{
            font-weight:600;
        }

        .contact-box{
            background:#eef5ff;
            border-radius:12px;
            padding:25px;
            text-align:center;
            margin-top:30px;
        }   
        
        
        /* TOP BANNER */

.contact-banner{
    background:#000;
    padding:80px 0;
}

.contact-banner h1{
    font-size:55px;
    font-weight:800;

    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.contact-banner p{
    color:#ccc;
    font-size:18px;
}

/* MAIN SECTION */

.contact-section{
    padding:80px 0;
}

/* FORM CARD */

.form-box{
    background:#fff;
    padding:40px;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.form-title{
    font-size:28px;
    font-weight:700;
    margin-bottom:25px;
}

.form-control{
    padding:14px;
    border-radius:12px;
}

.form-control:focus{
    border-color:#d9877b;
    box-shadow:0 0 0 .2rem rgba(30,199,230,.15);
}

.btn-contact{

    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);
    color:#000;
    border:none;
    font-weight:700;
    padding:14px 35px;
    border-radius:12px;
}

/* INFO PANEL */

.info-box-cont{
    background:#000;
    color:#fff;
    border-radius:20px;
    padding:40px;
    height:100%;
}

.info-box-cont h3{
    margin-bottom:30px;
}

.info-item{
    display:flex;
    gap:15px;
    margin-bottom:25px;
}

.info-item i{
    width:50px;
    height:50px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);

    color:#000;
}

/* SOCIAL */

.social-links a{
    width:45px;
    height:45px;
    display:inline-flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:#fff;
    color:#000;

    text-decoration:none;
    margin-right:10px;
}

/* SUPPORT CARDS */

.support-section{
    padding-bottom:80px;
}

.support-card{
    background:#fff;
    border-radius:20px;
    padding:30px;
    text-align:center;
    box-shadow:0 8px 20px rgba(0,0,0,.08);
    height:100%;
}

.support-card i{
    font-size:40px;
    margin-bottom:15px;

    background:linear-gradient(90deg, #c77066, #e09083, #5c312c);

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* MAP */

.map-box{
    overflow:hidden;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

/* MOBILE */

@media(max-width:768px){

.contact-banner h1{
    font-size:38px;
}

.form-box,
.info-box-cont{
    padding:25px;
}

.info-box-cont{
    margin-top:25px;
}

}

/*footer*/

.footer-section{

    background:##ffffff;
    color:#00000;
    padding:70px 0 25px;
}

.footer-brand h3{

    font-weight:800;

    background:linear-gradient(
        90deg,
        #d9877b,
        #8ED8B5,
        #E7DB67
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.footer-brand p{
    color:#000000;
    margin-top:15px;
}

.footer-section h5{
    margin-bottom:20px;
    font-weight:700;
}

.footer-links{
    list-style:none;
    padding:0;
    margin:0;
}

.footer-links li{
    margin-bottom:12px;
}

.footer-links a{

    color:#000000;
    text-decoration:none;
    transition:.3s;
}

.footer-links a:hover{

    color:#d9877b;
    padding-left:5px;
}

.footer-social{
    margin-top:20px;
}

.footer-social a{

    width:40px;
    height:40px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    text-decoration:none;

    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);

    color:#000;

    margin-right:10px;
}

.footer-social a:hover{
    transform:translateY(-4px);
}

.form-control{

    /*border:none;*/
    min-height:48px;
}

.btn-subscribe{

    background:linear-gradient(90deg, #c77066, #e09083, #5c312c);

    color:#000;
    border:none;
}

.footer-divider{

    border-color:rgba(255,255,255,.12);
    margin:40px 0 25px;
}

.copyright{
    color:#000000;
}

.payment-icons{
    /*max-height:32px;*/
}


.pay-success-section{
    display: flex;
    justify-content: center;
    align-items: center;
}

/*------------- ABOUT PAGE--------------*/

/* HERO */

.about-hero{
    background:#000;
    padding:100px 0;
    text-align:center;
}

.about-hero h1{
    font-size:60px;
    font-weight:800;
    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.about-hero p{
    color:#ccc;
    max-width:700px;
    margin:auto;
    font-size:18px;
}

/* STORY */

.story-section{
    padding:80px 0;
}

.story-img{
    border-radius:20px;
    overflow:hidden;
}

.story-img img{
    width:100%;
    border-radius:20px;
}

.story-content h2{
    font-weight:700;
    margin-bottom:20px;
}

.story-content p{
    color:#666;
    line-height:1.8;
}

/* MISSION */

.mission-box{
    background:#000;
    color:#fff;
    border-radius:20px;
    padding:50px;
}

.mission-box h2{
    margin-bottom:20px;
}

/* FEATURES */

.features{
    padding:80px 0;
}

.feature-card{
    background:#fff;
    border-radius:20px;
    padding:35px;
    text-align:center;
    height:100%;
    box-shadow:0 10px 25px rgba(0,0,0,.08);
    transition:.3s;
}

.feature-card:hover{
    transform:translateY(-8px);
}

.feature-card i{
    font-size:45px;
    margin-bottom:20px;

    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* STATS */

.stats{
    background:#000;
    padding:80px 0;
}

.stat-box{
    text-align:center;
    color:#fff;
}

.stat-box h2{
    font-size:50px;
    font-weight:800;

    background:linear-gradient(135deg, #c77066, #e09083, #5c312c);

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* CTA */

.cta{
    padding:80px 0;
}

.cta-box{
    background:linear-gradient(135deg, #c7706633, #e0908366, #5c312c5c);
    padding:60px;
    border-radius:25px;
    text-align:center;
}

.cta-box h2{
    color:#000;
    font-weight:800;
}

.btn-shop{
    background:#000;
    color:#fff;
    padding:14px 35px;
    border-radius:10px;
    text-decoration:none;
    display:inline-block;
    margin-top:15px;
}

.btn-shop:hover{
    color:#fff;
}

@media(max-width:768px){

.about-hero h1{
    font-size:40px;
}

.mission-box,
.cta-box{
    padding:30px;
}

}


/*--------- 404 ----------------*/

.error-section{
    text-align:center;
    color:#fff;
    padding:20px;
    position:relative;
    z-index:2;
}

.error-code{

    font-size:180px;
    font-weight:900;
    line-height:1;

    background:linear-gradient(
        90deg,
        #d9877b,
        #8ED8B5,
        #E7DB67
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.error-title{
    font-size:40px;
    font-weight:700;
    margin-bottom:15px;
}

.error-text{
    color:#bdbdbd;
    max-width:600px;
    margin:auto;
    margin-bottom:35px;
}

.btn-home{

    background:linear-gradient(
        90deg,
        #d9877b,
        #8ED8B5,
        #E7DB67
    );

    color:#000;
    font-weight:700;
    border:none;
    padding:14px 30px;
    border-radius:12px;
    text-decoration:none;
    display:inline-block;
    margin:5px;
}

.btn-home:hover{
    color:#000;
}

.btn-shop{

    border:2px solid #d9877b;
    color:#fff;
    font-weight:600;
    padding:12px 28px;
    border-radius:12px;
    text-decoration:none;
    display:inline-block;
    margin:5px;
}

.btn-shop:hover{
    background:#d9877b;
    color:#000;
}

.bg-circle1{
    width:350px;
    height:350px;
    background:rgba(30,199,230,.15);
    position:absolute;
    top:-100px;
    left:-100px;
    border-radius:50%;
}

.bg-circle2{
    width:400px;
    height:400px;
    background:rgba(231,219,103,.15);
    position:absolute;
    bottom:-150px;
    right:-100px;
    border-radius:50%;
}

.shopping-icon{
    font-size:70px;
    margin-bottom:20px;

    background:linear-gradient(
        90deg,
        #d9877b,
        #8ED8B5,
        #E7DB67
    );

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

@media(max-width:768px){

.error-code{
    font-size:110px;
}

.error-title{
    font-size:28px;
}

.shopping-icon{
    font-size:50px;
}

}

#searchInputDesktop:focus{
    box-shadow: none !important;
}

#categorySelect:focus{
    box-shadow: none !important;
}

/* Remove Bootstrap Focus Shadow Globally */

.form-control:focus,
.form-select:focus,
.form-check-input:focus,
textarea:focus,
input:focus,
select:focus,
button:focus {
    box-shadow: none !important;
    outline: none !important;
}

/* Optional: Border color same rahe focus par */
.form-control:focus,
.form-select:focus {
    border-color: #dee2e6 !important;
}

/* Input Group ke around aane wala shadow bhi remove */
.input-group:focus-within {
    box-shadow: none !important;
}

/*----------------------------------------*/

.product-info-card{
    border:1px solid #e5e7eb;
    background:#f8f9fa;
    transition:all .3s ease;
    height: 93px;
    margin-bottom: 20px;
    
}

.product-info-card:hover{
    transform:translateY(-2px);
    box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.product-info-card i{
    color:#ff6f61; /* Brand Color */
}

.product-info-heading{
    font-weight:600;
    margin-bottom:4px;
    color:#212529;
}

.rate-font{
   font-size: 12px;
}
/*-------------------------------------------------*/

/* MOBILE HEADER */

.fs-mobile-header{
    position: sticky;
    top: 0;
    z-index: 1030;
    height: 60px;
    background: #fff;
    border-bottom: 1px solid #ececec;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 15px;
}

.fs-menu-btn{
    border: none;
    background: transparent;
    font-size: 22px;
    color: #222;
}

.fs-logo{
    text-decoration: none;
    font-size: 22px;
    font-weight: 700;
    color: #111;
}

.fs-header-icon{
    color: #222;
    font-size: 20px;
    text-decoration: none;
}

.fs-cart-badge{
    position: absolute;
    top: -6px;
    right: -10px;

    width: 18px;
    height: 18px;

    border-radius: 50%;
    background: #ff4d4f;
    color: #fff;

    font-size: 10px;
    font-weight: 600;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* OFFCANVAS */

#fsCategoryMenu{
    width: 290px;
}

#fsCategoryMenu .list-group-item{
    border: none;
    border-bottom: 1px solid #f2f2f2;
    padding: 14px 18px;
    font-size: 15px;
}

#fsCategoryMenu .list-group-item:hover{
    background: #f8f8f8;
}

#fsCategoryMenu{
    width:280px;
}

#fsCategoryMenu .list-group-item{
    border:0;
    border-bottom:1px solid #f2f2f2;
    padding:14px 18px;
}

/*---------------------------------*/
.offcanvas-start{
    top: 0 !important;
    width: 320px !important;
    /*height: 93vh !important;*/
    height: 100% !important;

    border-right: none;

    display: flex;
    flex-direction: column;

    overflow: hidden;
}

.offcanvas{
    z-index: 999999 !important;
}

.site-header-sticky{
    z-index: 1030;
}

/* BANNER */

.mobile-menu-banner{
    position: relative;
    flex-shrink: 0;
    background: #fff;
}

.mobile-menu-banner img{
    width:100%;
    display:block;
}

/* SCROLL AREA */

.mobile-menu-scroll{
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* MENU */

.mobile-menu-list{
    list-style:none;
    padding:0;
    margin:0;
}

.mobile-menu-list li{
    border-bottom:1px solid #f1f1f1;
}

.mobile-menu-list a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px 20px;
    color:#282c3f;
    text-decoration:none;
    font-size:15px;
    font-weight:600;
}

/* BOTTOM LINKS */

.mobile-menu-bottom a{
    display:block;
    padding:14px 20px;
    text-decoration:none;
    color:#535766;
    border-bottom:1px solid #f5f5f6;
}

/* CLOSE BUTTON */

.mobile-menu-close{
    position:absolute;
    top:12px;
    right:12px;

    width:25px;
    height:25px;

    border:none;
    border-radius:50%;

    background:#fff;
    color:#111;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:20px;

    box-shadow:0 2px 10px rgba(0,0,0,0.08);

    z-index:50;
}  

/*------------------------------------*/

    .gsk-hero-banner{
        position:relative;
        overflow:hidden;
        background:#f5f5f5;
        min-height:420px;
        /*border-radius:20px;*/
    }
    
    .gsk-hero-banner__slider{
        position:relative;
    }
    
    .gsk-hero-banner__item{
        display:none;
        width:100%;
    }
    
    .gsk-hero-banner__item.active{
        display:block;
    }
    
    .gsk-hero-banner__img{
        width:100%;
        height:520px;
        object-fit:cover;
        display:block;
    }
    
    /* NAV BUTTONS */
    
    .gsk-hero-btn{
        position:absolute;
        top:50%;
        transform:translateY(-50%);
        width:46px;
        height:46px;
        border:none;
        border-radius:50%;
        background:rgba(255,255,255,0.9);
        color:#111;
        z-index:5;
        display:flex;
        align-items:center;
        justify-content:center;
        cursor:pointer;
    }
    
    .gsk-prev{
        left:20px;
    }
    
    .gsk-next{
        right:20px;
    }
    
    /* DOTS */
    
    .gsk-hero-dots{
        position:absolute;
        left:50%;
        bottom:20px;
        transform:translateX(-50%);
        display:flex;
        gap:10px;
        z-index:5;
    }
    
    .gsk-hero-dots span{
        width:10px;
        height:10px;
        border-radius:50%;
        background:rgba(255,255,255,0.5);
        cursor:pointer;
    }
    
    .gsk-hero-dots span.active{
        background:#fff;
        width:28px;
        border-radius:20px;
    }
    
    /* =========================
    TABLET
    ========================= */
    
    @media (max-width: 991px){
    
        .gsk-hero-banner{
            min-height:auto;
            border-radius:16px;
        }
    
        .gsk-hero-banner__img{
            height:380px;
        }
    
        .gsk-hero-btn{
            width:40px;
            height:40px;
        }
    
    }
    
    /* =========================
    MOBILE
    ========================= */
    
    @media (max-width: 576px){
    
        .gsk-hero-banner{
            border-radius:12px;
        }
    
        .gsk-hero-banner__img{
            height:220px;
            object-fit:cover;
        }
    
        .gsk-hero-btn{
            width:34px;
            height:34px;
            font-size:12px;
        }
    
        .gsk-prev{
            left:10px;
        }
    
        .gsk-next{
            right:10px;
        }
    
        .gsk-hero-dots{
            bottom:12px;
            gap:7px;
        }
    
        .gsk-hero-dots span{
            width:8px;
            height:8px;
        }
    
        .gsk-hero-dots span.active{
            width:22px;
        }
    
    }
    
    @media (max-width:991px){

    .gsk-sidebar-area{
        display:flex;
        flex-direction:column;
         order:3;
    }

    /*.gsk-sidebar-area .row.g-3.align-items-stretch.mt-2{*/
    /*    order:1;*/
    /*}*/

    .gsk-mobile-filter-btn{
        order:1;
    }
    
    .pro-order{
            order: 2;
    }

}

#products1 .col{
    display:flex;
}

.product-card{
    background:#fff;
    /*border-radius:22px;*/
    overflow:hidden;
    border:1px solid rgba(0,0,0,0.06);
    transition:0.35s ease;
    width:100%;
    position:relative;
    box-shadow:0 4px 18px rgba(0,0,0,0.05);
}

.product-card:hover{
    transform:translateY(-6px);
    box-shadow:0 18px 40px rgba(0,0,0,0.12);
}

.product-card .position-relative{
    overflow:hidden;
    background:#f7f7f7;
}

.product-img{
    aspect-ratio:1/1.15;
    object-fit:contain;
    transition:0.5s ease;
}

.product-card:hover .product-img{
    transform:scale(1.06);
}

.product-card .p-3{
    padding:18px !important;
}

.product-card .fw-semibold{
    font-size:16px;
    line-height:1.4;
    margin-bottom:4px;
    color:#111827;
    
    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    overflow:hidden;
    /*min-height:45px;*/
}

.product-card .text-muted.small{
    font-size:12px;
    color:#6b7280 !important;

    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.product-card .fw-bold{
    font-size:18px;
    color:#ff6f61;
}

.product-card .text-decoration-line-through{
    font-size:12px;
    color:#9ca3af !important;
}

.rate-font{
    font-size:13px;
    font-weight:500;
    color:#f59e0b;
    margin-top:10px !important;
}

.product-card .d-flex.gap-2.mt-2{
    margin-top:16px !important;
}

.product-card .btn-outline-dark{
    border-radius:12px;
    font-size:14px;
    font-weight:600;
    padding:10px 14px;
    border:1px solid #111827;
    transition:0.3s ease;
}

.product-card .btn-outline-dark:hover{
    background:#111827;
    color:#fff;
}

.wishlist-btn{
    width:36px;
    min-width:36px;
    height:36px;
    border-radius:14px !important;
    font-size:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:0.3s ease;
}

.wishlist-btn:hover{
    transform:scale(1.08);
}

@media (max-width:767px){

    .product-card{
        /*border-radius:18px;*/
    }

    .product-card .p-3{
        padding:14px !important;
    }

    .product-card .fw-semibold{ 
        font-size:14px;
        /*min-height:40px;*/
    }

    .product-card .fw-bold{
        font-size:16px;
    }

    .product-card .btn-outline-dark{
        font-size:13px;
        padding:9px 10px;
    }

    .wishlist-btn{
        width:42px;
        min-width:38px;
        height:42px;
        font-size:18px;
    }
    

}

/*---------------------------------*/

@media(max-width:767px){

    #wishTableWrap table{
        min-width: 600px;
    }

    .table-responsive{
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .cart-item-img{
        width:70px;
        height:85px;
        object-fit:cover;
        border-radius:10px;
    }

    #wishTableWrap td{
        padding:12px 10px;
        vertical-align:middle;
    }

    #wishTableWrap .fw-semibold{
        font-size:14px;
        line-height:1.4;
    }

    .remove-wish{
        white-space:nowrap;
        font-size:13px;
        padding:6px 12px;
    }

    #wishTableWrap th{
        white-space:nowrap;
        font-size:13px;
    }
}

/*-----------------------------------------*/

/* SIDEBAR */

.gsk-sidebar-area{
    position: sticky;
    top: 90px;
}

/* FILTER CARD */

.filters-card{
    background:#fff;
    border:1px solid #f1f1f1;
    border-radius:18px;
    box-shadow:0 2px 10px rgba(0,0,0,0.03);
}

/* FILTER TITLE */

.filters-card h5{
    font-size:18px;
    font-weight:700;
    margin-bottom:20px !important;
    padding-bottom:14px;
    border-bottom:1px solid #f3f3f3;
}

/* LABELS */

.filters-card .form-label{
    font-size:13px;
    font-weight:700;
    color:#282c3f !important;
    margin-bottom:10px;
    text-transform:uppercase;
    letter-spacing:0.4px;
}

/* SELECT + INPUT */

.filters-card .form-select,
.filters-card .form-control{
    height:48px;
    border-radius:12px;
    border:1px solid #e5e5e5;
    font-size:14px;
    box-shadow:none !important;
    transition:0.2s ease;
}

.filters-card .form-select:focus,
.filters-card .form-control:focus{
    border-color:#ff3f6c;
}

/* PRICE INPUTS */

.filters-card .d-flex.gap-2 input{
    text-align:center;
}

/* FORM TEXT */

.filters-card .form-text{
    font-size:12px;
    color:#94969f;
    margin-top:8px;
}

/* BUTTONS */

#applyFiltersBtn{
    height:48px;
    border:none;
    border-radius:14px;
    background:#ff3f6c;
    font-weight:700;
    font-size:15px;
}

#applyFiltersBtn:hover{
    background:#ff527b;
}

#clearFiltersBtn{
    height:46px;
    border-radius:14px;
    font-weight:600;
    border:1px solid #ddd;
}

/* SECTION SPACING */

.filters-card .mb-3{
    margin-bottom:24px !important;
}

/* ADS */

.gsk-ad-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:6px 12px;
    border-radius:999px;

    font-size:12px;
    font-weight:700;
}

.gsk-ad-title{
    font-size:22px;
    font-weight:700;
    line-height:1.3;
}

.gsk-ad-text{
    color:#666;
    font-size:14px;
    line-height:1.6;
}

/* ICON BOX */

.fc-secureIcon{
    display:flex;
    align-items:center;
    justify-content:center;

    background:rgba(255,63,108,0.08);
    color:#ff3f6c;

    font-size:22px;
}

/* =========================
FILTER SIDEBAR
========================= */

.mf-sidebar{
    background:#fff;
    border:1px solid #eaeaec;
    border-radius:12px;
    padding:20px;
    width:280px;
    height:fit-content;
}

.mf-flex{
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.mf-top-actions{
    display:flex;
    align-items:center;
    gap:12px;
}

.mf-sidebar-title{
    font-size:18px;
    font-weight:700;
}

.mf-clear-btn{
    border:none;
    background:none;
    color:red;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
}

.mf-close-btn{
    display:none;
    border:none;
    background:none;
    font-size:20px;
    cursor:pointer;
}

.mf-filter-block{
    border-bottom:1px solid #eaeaec;
    padding-bottom:18px;
    margin-bottom:18px;
}

.mf-filter-block:last-child{
    border-bottom:none;
    margin-bottom:0;
    padding-bottom:0;
}

.mf-filter-heading{
    font-size:14px;
    font-weight:700;
    margin-bottom:14px;
}

.mf-option{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:10px;
    font-size:14px;
    cursor:pointer;
}

.mf-option input{
    width:16px;
    height:16px;
}

.mf-brand-search{
    width:100%;
    border:1px solid #eaeaec;
    border-radius:8px;
    padding:10px;
    margin-bottom:15px;
    outline:none;
}

.mf-brand-search:focus{
    border-color:#ff3f6c;
}

#mfPrice{
    width:100%;
}

/* MOBILE FILTER BUTTON */

.mf-mobile-filter-btn{
    display: none;
    width: 75%;
    padding: 12px;
    border: none;
    border-radius: 10px;
    background: #ff6f61;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    margin-bottom: 15px;
}

/* OVERLAY */

.mf-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.5);
    opacity:0;
    visibility:hidden;
    transition:0.3s;
    z-index:999;
}

/* Tablet */

@media (max-width: 991px){

    .fsho-product-images{
        height:550px;
    }

    .product-detail-main{
        height:480px;
    }

}

/* Mobile */

@media (max-width: 768px){

    .mf-mobile-filter-btn{
        display:block;
    }

    .mf-sidebar{
        position: fixed;
        top: 120px;
        left: -100%;
        width: 300px;
        height: 75vh;
        overflow-y: auto;
        border-radius: 0;
        z-index: 1000;
        transition: 0.3s;
    }

    .mf-sidebar.active{
        left:0;
    }

    .mf-overlay.active{
        opacity:1;
        visibility:visible;
    }

    .mf-close-btn{
        display:block;
    }

}

@media (max-width: 576px){

    .fsho-product-images{
        height:auto;
        /*height:420px;*/
    }

    .product-detail-main{
        height:350px;
    }

}

@media (max-width:768px){

    .mf-sidebar{
        position: fixed;
        top: 120px;
        left: -100%;
        width: 300px;

        height: calc(100vh - 120px);
        /*height: 320px;*/

        overflow-y: auto;
        overflow-x: hidden;

        -webkit-overflow-scrolling: touch;

        border-radius: 0;
        z-index: 999999;
        transition: left .3s ease;
    }

    .mf-sidebar.active{
        left:0;
    }

}

.mf-sidebar{
    padding-bottom:60px;
}

.product-detail-main{
    width:100%;
    height:550px;
    background:#fff;
    border:1px solid #e9e9e9;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    padding:20px;
}

.product-detail-main img{
    width:100%;
    height:100%;
    object-fit:contain;
    transition:.3s ease;
}

.product-detail-main:hover img{
    transform:scale(1.05);
}

/* Tablet */
@media (max-width:991px){
    .product-detail-main{
        height:450px;
    }
}

/* Mobile */
@media (max-width:767px){
    .product-detail-main{
        height:350px;
        padding:15px;
    }
}

/* Small Mobile */
@media (max-width:480px){
    .product-detail-main{
        height:400px;
        padding:10px;
    }
}
/* =========================
FSHO PRODUCT TABS
========================= */

.fsho-product-tabs-card{
    border-radius:20px;
    background:#fff;
    border:1px solid #eee;
}

.fsho-product-tabs-nav{
    gap:10px;
}

.fsho-product-tabs-nav .nav-link{
    border:none;
    background:#f5f5f5;
    color:#333;
    border-radius:50px;
    padding:10px 18px;
    font-weight:600;
    transition:.3s;
}

.fsho-product-tabs-nav .nav-link.active{
    background:#ff6f61;
    color:#fff;
}

.fsho-product-desc-content{
    color:#666;
    line-height:1.8;
    font-size:15px;
}

/* =========================
FEATURES
========================= */

.fsho-feature-box{
    border:1px solid #eee;
    border-radius:14px;
    padding:15px;
    font-weight:500;
    background:#fafafa;
    display:flex;
    align-items:center;
    gap:12px;
}

.fsho-feature-box i{
    color:#0d6efd;
    font-size:18px;
}

/* =========================
REVIEWS
========================= */

.fsho-review-summary{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
    border-bottom:1px solid #eee;
    padding-bottom:20px;
}

.fsho-review-rating-box{
    display:flex;
    flex-direction:column;
    gap:4px;
}

.fsho-review-rating-value{
    font-size:38px;
    font-weight:700;
    line-height:1;
}

.fsho-review-stars{
    color:#f5a623;
    font-size:18px;
}

.fsho-review-count{
    color:#777;
    font-size:14px;
}

.fsho-review-btn{
    background:#111;
    color:#fff;
    border-radius:50px;
    padding:10px 20px;
    font-weight:600;
    border:none;
}

.fsho-review-btn:hover{
    background:#000;
    color:#fff;
}

.fsho-review-list{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.fsho-review-item{
    border-bottom:1px solid #eee;
    padding-bottom:20px;
}

.fsho-review-user{
    font-weight:700;
    font-size:15px;
}

.fsho-review-stars-sm{
    color:#f5a623;
    font-size:14px;
    margin-top:3px;
}

.fsho-review-date{
    color:#888;
    font-size:13px;
}

.fsho-review-title{
    font-weight:600;
    margin-top:12px;
    margin-bottom:8px;
}

.fsho-review-text{
    color:#666;
    line-height:1.7;
    font-size:14px;
}

/* =========================
MOBILE
========================= */

@media(max-width:576px){

    .fsho-product-tabs-nav{
        flex-wrap:nowrap;
        overflow:auto;
        white-space:nowrap;
    }

    .fsho-product-tabs-nav::-webkit-scrollbar{
        display:none;
    }

    .fsho-product-tabs-nav .nav-link{
        font-size:13px;
        padding:9px 14px;
    }

    .fsho-review-rating-value{
        font-size:30px;
    }

}


/* =========================
REVIEW MODAL
========================= */

.fsho-review-modal{
    border:none;
    border-radius:20px;
    overflow:hidden;
}

.fsho-rating-stars{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:24px;
    color:#d1d5db;
}

.fsho-rating-stars i.active{
    color:#f5a623;
}

.fsho-rating-stars i{
    cursor:pointer;
    transition:.3s;
}

.fsho-review-input{
    border-radius:12px;
    min-height:48px;
    box-shadow:none !important;
    border:1px solid #ddd;
}

.fsho-review-input:focus{
    border-color:#111;
}

.fsho-submit-review-btn{
    background:#111;
    color:#fff;
    border-radius:50px;
    padding:12px;
    font-weight:600;
}

.fsho-submit-review-btn:hover{
    background:#000;
    color:#fff;
}

/* =========================
REVIEW MODAL
========================= */

.fsho-review-modal{
    border:none;
    border-radius:22px;
    overflow:hidden;
}

.fsho-review-user-avatar{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#111;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:20px;
}

.fsho-rating-title{
    font-size:15px;
    font-weight:600;
    color:#666;
}

.fsho-rating-stars{
    display:flex;
    justify-content:center;
    gap:10px;
    font-size:32px;
}

.fsho-rating-stars i{
    color:#d1d5db;
    cursor:pointer;
    transition:.3s;
}

.fsho-rating-stars i.active{
    color:#f5a623;
    transform:scale(1.08);
}

.fsho-review-input{
    border-radius:16px;
    border:1px solid #ddd;
    padding:14px;
    resize:none;
    box-shadow:none !important;
}

.fsho-review-input:focus{
    border-color:#111;
}

.fsho-submit-review-btn{
    background:#111;
    color:#fff; 
    border:none;
    border-radius:50px;
    padding:12px;
    font-weight:600;
    transition:.3s;
}

.fsho-submit-review-btn:hover{
    background:#000;
    color:#fff;
}


/*----------------------------*/

.mf-price-box{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:6px;
    flex-wrap:wrap;
}

.mf-sale-price{
    font-size:16px;
    font-weight:700;
    color:#282c3f;
}

.mf-original-price{
    font-size:14px;
    color:#7e818c;
    text-decoration:line-through;
}

.mf-discount{
    font-size:14px;
    font-weight:600;
    color:#ff905a;
}

/*------------------------------------------------*/

/* =========================
SLIM OFFER BANNER
========================= */

.mf-offer-banner{
    width:100%;
    margin:30px 0;
    /*border-radius:14px;*/
    overflow:hidden;
}

.mf-offer-banner img{
    width: 100%;
    height: 250px;
    /* object-fit: cover; */
    display: block;
    border-radius: 0;
}

/* Tablet */

@media (max-width:991px){

    .mf-offer-banner img{
        height:140px;
    }

}

/* Mobile */

@media (max-width:576px){

    .mf-offer-banner img{
        height:90px;
        object-fit:cover;
        border-radius:10px;
    }

}
.gsk-category-section{
    position: relative;
    width: 100%;
}

.gsk-category-scroll{
    display: flex;
    gap: 22px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    justify-content: center;
    padding: 0 50px; /* arrows ke liye space */
}

.gsk-category-scroll::-webkit-scrollbar{
    display: none;
}

.cat-arrow{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);

    width: 30px;
    height: 30px;

    border: none;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
    z-index: 100;

    font-size: 15px;
    font-weight: 700;
    transition: 0.3s;
}

.cat-arrow:hover{
    transform: translateY(-50%) scale(1.05);
}

.cat-arrow.left{
    left: 10px;
}

.cat-arrow.right{
    right: 10px;
}

@media (max-width: 768px){
    .cat-arrow{
        display: none;
    }

    .gsk-category-scroll{
        padding: 0;
        justify-content: flex-start;
    }
}

.row > * {
    padding-right: calc(var(--bs-gutter-x) * 0.3) !important;
    padding-left: calc(var(--bs-gutter-x) * 0.3) !important;
}

.fsho-product-images .row{
    overflow: hidden;
}

                 /* 🔲 Filter Box */
            .price-filter-box {
                background: #fff;
                padding: 15px;
                border-radius: 10px;
                box-shadow: 0 2px 10px rgba(0,0,0,0.06);
                border: 1px solid #eee;
            }
            
            /* 🔥 Heading */
            .mf-filter-heading {
                font-size: 14px;
                font-weight: 600;
                color: #333;
                margin-bottom: 15px;
                letter-spacing: 0.5px;
            }
            
            /* 🎚 Slider spacing */
            #priceSlider,#mobilePriceSlider {
                margin: 10px 5px 20px;
            }
            
            /* 🎯 Range Text */
            .price-range {
                display: flex;
                justify-content: center;
                align-items: center;
                gap: 10px;
                font-weight: 600;
                color: #111;
                background: #f8f9fa;
                padding: 8px 12px;
                border-radius: 6px;
                font-size: 14px;
            }
            
            .price-range .dash {
                color: #999;
            }
            
         
            
            /* 🎯 Responsive */
            @media (max-width: 768px) {
                .price-filter-box {
                    padding: 12px;
                }
            
                .price-range {
                    font-size: 13px;
                }
            }
            
            /* 🎚 Slider Base */
            .noUi-target {
                height: 6px;
                border-radius: 10px;
                background: #e4e4e4;
                border: none;
            }
            
            /* 🎯 Active Range */
            .noUi-connect {
                background: linear-gradient(90deg, #2874f0, #4facfe);
            }
            
            /* 🔵 PERFECT CIRCLE HANDLE */
            .noUi-handle {
                width: 20px;
                height: 20px;
                border-radius: 50% !important;  /* ✅ circle */
                background: #fff;
                border: 3px solid #2874f0;
                top: -8px;   /* center align */
                cursor: pointer;
                box-shadow: 0 3px 8px rgba(0,0,0,0.2);
                transition: all 0.2s ease;
            }
            
            /* 🟢 Hover Effect */
            .noUi-handle:hover {
                transform: scale(1.2);
                border-color: #0d47a1;
            }
            
            /* 🔥 Active (Click) Effect */
            .noUi-handle:active {
                transform: scale(1.1);
                box-shadow: 0 4px 12px rgba(0,0,0,0.3);
            }
            
            /* ❌ Remove default lines */
            .noUi-handle:before,
            .noUi-handle:after {
                display: none;
            }
            
            .noUi-connect {
                background: #d7938a !important;
            }
            
            .noUi-horizontal .noUi-handle {
                width: 28px !important;
                height: 28px !important;
                right: -17px;
                top: -6px;
            }
            
            .noUi-handle:before {
                    left: 12px !important; 
            }
            .noUi-handle:after {
                    left: 15px !important; 
            }
            
            
            /* that css for Advertisement */
            .gsk-ad-banner {
            width: 100%;
            margin: 40px 0;
            }
            
            .gsk-ad-banner .carousel-item img {
            height: 350px;
            object-fit: cover;
            border-radius: 12px;
            }
            
            .ad-overlay {
            position: absolute;
            top: 50%;
            left: 8%;
            transform: translateY(-50%);
            color: #fff;
            max-width: 400px;
            }
            
            .ad-overlay h2 {
            font-size: 32px;
            font-weight: 700;
            }
            
            .ad-overlay p {
            margin: 10px 0;
            font-size: 16px;
            }
            
            .ad-btn {
            display: inline-block;
            padding: 10px 20px;
            background: #000;
            color: #fff;
            border-radius: 6px;
            text-decoration: none;
            }
            
            .ad-btn:hover {
            background: #333;
            }
            
            /* Responsive */
            @media (max-width: 768px) {
            .gsk-ad-banner .carousel-item img {
                height: 200px;
            }
            
            .ad-overlay h2 {
                font-size: 20px;
            }
            
            .ad-overlay {
                left: 5%;
            }
            }



/*----------------- mobile submenu---------------*/

/* Main Menu */

.mobile-menu-list{
    list-style:none;
    padding:0;
    margin:0;
}

.mobile-menu-list > li{
    border-bottom:1px solid #eee;
}

.mobile-menu-list > li > a{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:14px 18px;
    text-decoration:none;
    color:#222;
    font-weight:500;
}

.mobile-menu-list > li > a i{
    transition:.3s;
}

/* Submenu */

.submenu{
    display:none;
    list-style:none;
    margin:0;
    padding:0;
    background:#f8f8f8;
}

.submenu li a{
    display:block;
    padding:12px 18px 12px 40px;
    color:#555;
    text-decoration:none;
    font-size:14px;
    border-top:1px solid #e9e9e9;
    transition:.3s;
}

.submenu li a:hover{
    background:#fff;
    color:#000;
}

/* Open */

.has-submenu.active .submenu{
    display:block;
}

.has-submenu.active > a i{
    transform:rotate(180deg);
}

/*=========================================
        FULL WIDTH ADVERTISEMENT
==========================================*/

.ad-banner-full{
    padding:40px 0;
}

.ad-banner-full a{
    display:block;
    overflow:hidden;
    border-radius:16px;
}

.ad-banner-full img{
    width:100%;
    height:200px !important;
    display:block;
    border-radius:16px;
    transition:transform .4s ease;
    object-fit: cover;
}

.ad-banner-full:hover img{
    transform:scale(1.03);
}

/* Mobile */

@media (max-width:768px){

    .ad-banner-full{
        padding:20px 0;
    }

    .ad-banner-full a,
    .ad-banner-full img{
        border-radius:10px;
        height: 70px !important;
    }

}

/*=========================================
    CATEGORY BOTTOM SHEET
=========================================*/

.modal-dialog-bottom{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    max-width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
}

.modal-dialog-bottom .modal-content{
    width: 100%;
    height: 85vh;
    border: 0;
    border-radius: 22px 22px 0 0;
    overflow: hidden;
    animation: slideUp .3s ease;
}

@keyframes slideUp{
    from{
        transform: translateY(100%);
    }
    to{
        transform: translateY(0);
    }
}

/*=========================================
    HEADER
=========================================*/

.modal-header{
    height:40px;
    padding:0 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    border-bottom:1px solid #ececec;
    background:#fff;
}

.modal-title{
    font-size:14px;
    font-weight:700;
    color:#222;
}

.btn-close{
    box-shadow:none !important;
    font-size:8px;
}

/*=========================================
    BODY
=========================================*/

.modal-body{
    padding:0;
    background:#fff;
}

.cat-layout{
    display:flex;
    height:calc(85vh - 60px);
}

/*=========================================
    LEFT SIDEBAR
=========================================*/

.cat-sidebar{
    width:110px;
    background:#f7f7f7;
    border-right:1px solid #e9e9e9;
    overflow-y:auto;
    overflow-x:hidden;
}

.cat-sidebar::-webkit-scrollbar{
    width:4px;
}

.cat-sidebar::-webkit-scrollbar-thumb{
    background:#d0d0d0;
    border-radius:10px;
}

.cat-menu-item{
    width:100%;
    border:0;
    background:transparent;
    padding:12px 8px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:.25s;
    border-bottom:1px solid #ececec;
}

.cat-menu-item img{
    width:48px;
    height:48px;
    border-radius:50%;
    object-fit:cover;
    background:#fff;
    border:1px solid #eee;
}

.cat-menu-item span{
    margin-top:8px;
    font-size:12px;
    font-weight:600;
    line-height:1.3;
    color:#555;

    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.cat-menu-item.active{
    background:#fff;
    border-left:4px solid #ff6b00;
}

.cat-menu-item.active span{
    color:#ff6b00;
    font-weight:700;
}

.cat-menu-item:hover{
    background:#fff;
}

/*=========================================
    RIGHT CONTENT
=========================================*/

.cat-content{
    flex:1;
    overflow-y:auto;
    padding:18px;
    background:#fff;
}

.cat-content::-webkit-scrollbar{
    width:5px;
}

.cat-content::-webkit-scrollbar-thumb{
    background:#ccc;
    border-radius:20px;
}

/*=========================================
    GRID
=========================================*/

.cat-content{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px 18px;
    align-content:flex-start;
}

.cat-content-panel{
    display: none;
}

.cat-content-panel.active{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap:10px;
}
/*=========================================
    CARD
=========================================*/

.cat-card{
    text-decoration:none;
    text-align:center;
    color:#333;
    transition:.25s;
}

.cat-card:hover{
    text-decoration:none;
}

.cat-card-img{
    width:82px;
    height:82px;
    margin:auto;
    border-radius:50%;
    overflow:hidden;
    background:#fff;
    border:1px solid #eee;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 3px 12px rgba(0,0,0,.08);
    transition:.25s;
}

.cat-card-img img{
    width:72px;
    height:72px;
    object-fit:contain;
    transition:.25s;
}

.cat-card-title{
    margin-top:10px;
    font-size:13px;
    font-weight:600;
    color:#444;
    line-height:1.35;

    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.cat-card:hover .cat-card-img{
    transform:translateY(-4px);
    border-color:#ff6b00;
}

.cat-card:hover img{
    transform:scale(1.06);
}

.cat-card:hover .cat-card-title{
    color:#ff6b00;
}

/*=========================================
    MOBILE
=========================================*/

@media(max-width:576px){

    .modal-dialog-bottom .modal-content{
        height:88vh;
        border-radius:20px 20px 0 0;
    }

    .cat-layout{
        height:calc(88vh - 60px);
    }

    .cat-sidebar{
        width:95px;
    }

    .cat-menu-item{
        padding:10px 6px;
    }

    .cat-menu-item img{
        width:42px;
        height:42px;
    }

    .cat-menu-item span{
        font-size:11px;
    }

    .cat-content{
        grid-template-columns:repeat(3,1fr);
        gap:18px 12px;
        padding:15px;
    }

    .cat-card-img{
        width:70px;
        height:70px;
    }

    .cat-card-img img{
        width:60px;
        height:60px;
    }

    .cat-card-title{
        font-size:11px;
    }

}

@media(max-width:360px){

    .cat-sidebar{
        width:88px;
    }

    .cat-content{
        grid-template-columns:repeat(2,1fr);
    }

}

/*---------------------------------*/

.cart-item-img{
    width:70px;
    height:70px;
    object-fit:cover;
    border-radius:8px;
    border:1px solid #eee;
    flex-shrink:0;
}

.cart-title{
    display:block;
    font-size:15px;
    font-weight:600;
    line-height:1.4;
    margin-bottom:6px;
    color:#222;
    text-decoration:none;
}

.cart-attr{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:3px 10px;
    background:#f4f4f4;
    border-radius:30px;
    font-size:12px;
    color:#666;
    margin:2px 4px 2px 0;
    flex-wrap:wrap;
}

.cart-color{
    width:14px;
    height:14px;
    border-radius:50%;
    display:inline-block;
    border:1px solid #ddd;
}

/* Tablet */
@media (max-width:768px){

    .cart-item-img{
        width:60px;
        height:60px;
    }

    .cart-title{
        font-size:14px;
        line-height:1.3;
        margin-bottom:4px;
    }

    .cart-attr{
        font-size:11px;
        padding:3px 8px;
    }

    .cart-color{
        width:12px;
        height:12px;
    }

}

/* Mobile */
@media (max-width:576px){

    .cart-item-img{
        width:55px;
        height:55px;
    }

    .cart-title{
        font-size:13px;
        line-height:1.3;
    }

    .cart-attr{
        font-size:10px;
        padding:2px 7px;
        border-radius:20px;
    }

    .cart-color{
        width:10px;
        height:10px;
    }

}

/* Small Mobile */
@media (max-width:400px){

    .cart-item-img{
        width:50px;
        height:50px;
    }

    .cart-title{
        font-size:12px;
    }

    .cart-attr{
        font-size:9px;
        padding:2px 6px;
    }

}

.rating-stars{
    display:flex;
    gap:8px;
    font-size:30px;
    cursor:pointer;
}

.rating-stars i{
    color:#d5d5d5;
    transition:.2s;
        font-size: 16px;
}

.rating-stars i.active{
    color:#ffc107;
}

.rating-stars i:hover{
    transform:scale(1.1);
}

.review-box{
    background:#fafafa;
    border:1px solid #eee;
    border-radius:10px;
    padding:15px;
    margin-top:15px;
}
.return-btn{
          background: #000;
          color: #fff;
        }
        .return-btn:hover{
          border: 2px solid #000;
          color: #000;
        }
        
        /* ===========================
   Return / Exchange Modal
=========================== */

.return-modal{
    border:0;
    border-radius:14px;
    overflow:hidden;
    margin-top: 60px;
    padding: 20px 0px;
    height: 400px;
    overflow-y: scroll;
}

#returnExchangeModal .modal-dialog{
    max-width:500px;
}

#returnExchangeModal .modal-header{
    padding:18px 20px 10px;
}

#returnExchangeModal .modal-title{
    font-size:20px;
    font-weight:600;
    color:#222;
}

#returnExchangeModal .modal-body{
    padding:0 20px 20px;
}

#returnExchangeModal .modal-footer{
    padding:15px 20px;
}

/* ===========================
   Product Card
=========================== */

.return-product-card{

    display:flex;

    align-items:center;

    gap:15px;

    background:#f8f9fa;

    border:1px solid #ececec;

    border-radius:10px;

    padding:12px;

    margin-bottom:20px;

}

.return-product-card img{

    width:70px;

    height:70px;

    object-fit:cover;

    border-radius:8px;

    border:1px solid #ddd;

}

.return-product-info{

    flex:1;

}

.return-product-info h6{

    margin:0;

    font-size:15px;

    font-weight:600;

    color:#222;

}

.return-product-info small{

    color:#777;

}

.return-product-info p{

    color:#0d6efd;

    font-size:16px;

}

/* ===========================
   Label
=========================== */

.form-label{

    font-size:14px;

    font-weight:600;

    color:#444;

    margin-bottom:8px;

}

/* ===========================
   Return / Exchange
=========================== */

.return-type{

    display:flex;

    gap:10px;

}

.return-radio{

    flex:1;

    cursor:pointer;

}

.return-radio input{

    display:none;

}

.return-radio span{

    display:block;

    text-align:center;

    padding:10px;

    border:1px solid #ddd;

    border-radius:8px;

    transition:.3s;

    font-size:14px;

    font-weight:500;

}

.return-radio input:checked+span{

    background:#0d6efd;

    color:#fff;

    border-color:#0d6efd;

}

/* ===========================
   Inputs
=========================== */

.form-select,
.form-control{

    border-radius:8px;

    border:1px solid #ddd;

    font-size:14px;

}

.form-select{

    height:42px;

}

.form-control{

    padding:10px;

}

textarea.form-control{

    resize:none;

}

/* ===========================
   File Upload
=========================== */

input[type=file]{

    font-size:13px;

}

/* ===========================
   Footer Buttons
=========================== */

.modal-footer .btn{

    min-width:110px;

    border-radius:8px;

    font-size:14px;

    font-weight:500;

}

/* ===========================
   Mobile
=========================== */

@media(max-width:576px){

    #returnExchangeModal .modal-dialog{

        margin:12px;

    }

    .return-product-card{

        align-items:flex-start;

    }

}

/*--------------------------------*/

                /* Modal */
#cancelOrderModal .modal-content{
    border: 0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(0,0,0,.15);
    margin-top: 60px;
    height: 400px;
    overflow-y: scroll;
    padding: 20px 0px;
}

/* Header */
#cancelOrderModal .modal-header{
    background:#fff5f5;
    border-bottom:1px solid #f1f1f1;
    padding:18px 22px;
}

#cancelOrderModal .modal-title{
    font-size:20px;
    font-weight:700;
    color:#dc3545;
    margin: 0 !important;
    padding: 0!important;
}

/* Body */
#cancelOrderModal .modal-body{
    padding:22px;
}

#cancelOrderModal .modal-body p{
    font-size:15px;
    font-weight:600;
    color:#333;
    margin-bottom:18px;
}

/* Radio Box */
#cancelOrderModal .form-check{
    padding:12px 15px 12px 40px;
    border:1px solid #ececec;
    border-radius:12px;
    margin-bottom:12px;
    transition:.3s;
    cursor:pointer;
    background:#fff;
}

#cancelOrderModal .form-check:hover{
    border-color:#dc3545;
    background:#fff8f8;
}

#cancelOrderModal .form-check-input{
    margin-top:4px;
}

#cancelOrderModal .form-check-input:checked{
    background-color:#dc3545;
    border-color:#dc3545;
}

#cancelOrderModal .form-check-label{
    font-size:14px;
    font-weight:500;
    color:#444;
    cursor:pointer;
}

/* Other textarea */
#otherReason{
    margin-top:15px;
    border-radius:10px;
    border:1px solid #ddd;
    resize:none;
}

#otherReason:focus{
    border-color:#dc3545;
    box-shadow:0 0 0 .2rem rgba(220,53,69,.15);
}

/* Footer */
#cancelOrderModal .modal-footer{
    border-top:1px solid #f1f1f1;
    padding:18px 22px;
}

/* Buttons */
#cancelOrderModal .btn-light{
    border-radius:10px;
    padding:10px 24px;
}

#cancelOrderModal .btn-danger{
    border-radius:10px;
    padding:10px 24px;
    font-weight:600;
}

/* Mobile */
@media(max-width:576px){

    #cancelOrderModal .modal-dialog{
        margin:12px;
    }

    #cancelOrderModal .modal-content{
        border-radius:16px;
    }

    #cancelOrderModal .modal-body{
        padding:18px;
    }

}