
/* ========== BASE STYLES (No Media Query) ========== */
/* Site logo – 100px height hatao (inline style override) */
#header .site-logo,
body.ecommerce .header .site-logo {
  height: auto !important;
  min-height: 0 !important;
}
#header .site-logo img,
body.ecommerce .header .site-logo img {
  height: auto !important;
}

/* Sale product carousel - arrows don't get cut off */


/* Owl carousel overflow */
.owl-carousel {
  overflow: visible !important;
}

/* Owl prev/next button styling */
.owl-prev, .owl-next {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 2px 10px;
  border: 2px solid #969696dd;
  border-radius: 50% !important;
  margin: 0 3px;
  min-width: 36px;
  min-height: 36px;
  box-sizing: border-box;
}

/* CLEARANCE: Owl carousel inline display:none override - all screen sizes */
.sale-product .owl-prev[style*="display: none"],
.sale-product .owl-next[style*="display: none"],
.col-md-12.sale-product .owl-prev[style*="display: none"],
.col-md-12.sale-product .owl-next[style*="display: none"],
.owl-carousel2 .owl-prev[style*="display: none"],
.owl-carousel2 .owl-next[style*="display: none"],
.owl-carousel3 .owl-prev[style*="display: none"],
.owl-carousel3 .owl-next[style*="display: none"] {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* ========== TABLET: 769px - 1024px (header overlap fix) ========== */
@media (min-width: 769px) and (max-width: 1024px) {
  /* Header row 1 - negative margins hatao, nav ke saath overlap na ho */
  body.ecommerce .header .container-fluid > .row:first-of-type > [class*="col-lg-2"],
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-sm-4 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  /* Header first row container - neeche space do taaki nav overlap na kare */
  body.ecommerce .header .container-fluid > .row:first-of-type {
    padding-bottom: 8px !important;
    margin-bottom: 0 !important;
    row-gap: 8px !important;
  }
  body.ecommerce .header {
    padding-bottom: 4px !important;
  }
  /* Search form row - overlap na ho */
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form {
    margin-top: 4px !important;
  }
  /* Nav bar ko header ke neeche clear space */
  body.ecommerce .header .row.dynamicMenu,
  body.ecommerce .header .header-navigation,
  body.ecommerce .header nav {
    margin-top: 0 !important;
    clear: both !important;
    position: relative !important;
    z-index: 5 !important;
  }
}

/* ========== PRE-HEADER – kam words (WELCOME!/FREE PICKUP) bigad na, zyada words pe adjust ========== */
/* Sirf double-div wale structure pe inline override; .container (single line) ko chhedo mat */
.pre-header {
  overflow: hidden;
  padding: 10px 16px;
  box-sizing: border-box;
}
/* Double-div wrapper only (inline style wala) – .container ko mat lo */
.pre-header > div:not(.container),
.pre-header > div[style*="flex"],
.pre-header > div[style*="justify-content"] {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px 16px !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
.pre-header > .container {
  padding: 0 15px !important;
  max-width: 100% !important;
}
/* Pehla div – left text */
.pre-header > div:not(.container) > div:first-child {
  text-align: left !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  margin: 0 !important;
}
/* Doosra div – margin-left -150px / flex:1 override */
.pre-header > div:not(.container) > div:last-child,
.pre-header > div > div[style*="margin-left"],
.pre-header > div > div[style*="flex:1"] {
  text-align: right !important;
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
.pre-header > div > div {
  white-space: normal !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}
/* Fallback: .container / .row wala structure (default layout) */
.pre-header > .container {
  max-width: 100%;
}
.pre-header > .container > .row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 3px;
  margin: 0 !important;
}
.pre-header .row > [class*="col-"]:first-child,
.pre-header .row > div:first-child {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.pre-header .row > [class*="col-"]:last-child:not(:first-child),
.pre-header .row > div:last-child:not(:first-child) {
  flex: 0 0 auto !important;
  text-align: right !important;
}
.pre-header h4,
.pre-header p {
  margin: 0 !important;
  white-space: normal !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* Responsive: zyada words – dono line ek ke neeche, font chota, section neeche; kam words wala .container bigad na */
@media (max-width: 1024px) {
  /* Sirf double-div wrapper (inline style) – stack; .container (WELCOME!/FREE PICKUP) ko mat chhedo */
  .pre-header > div:not(.container),
  .pre-header > div[style*="padding"]:not(.container) {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
    padding: 0 !important;
  }
  .pre-header > div:not(.container) > div,
  .pre-header > div > div[style*="margin-left"],
  .pre-header > div > div[style*="flex"] {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    flex: none !important;
    box-sizing: border-box !important;
  }
  .pre-header > div:not(.container) > div:first-child {
    text-align: left !important;
  }
  .pre-header > div:not(.container) > div:last-child {
    text-align: left !important;
  }
  .pre-header > .container > .row {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .pre-header .row > [class*="col-"],
  .pre-header .row > div {
    max-width: 100% !important;
    width: 100% !important;
    flex: none !important;
  }
  /* Pre-header ke baad header hamesha neeche – overlap na, section adjust */
  body.ecommerce .pre-header + .header,
  .pre-header + .header,
  .pre-header + #header {
    margin-top: 0 !important;
  }
  body.ecommerce .pre-header + .header .container-fluid > .row:first-of-type > [class*="col-lg-2"],
  body.ecommerce .pre-header + .header .container-fluid > .row:first-of-type > .col-sm-4,
  .pre-header + #header .container-fluid > .row:first-of-type > [class*="col-lg-2"],
  .pre-header + #header .container-fluid > .row:first-of-type > .col-sm-4 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}
@media (max-width: 768px) {
  /* Zyada words: padding thoda rakhna taaki neeche section sahi, bigad na */
  .pre-header {
    padding: 6px 12px 8px !important;
    margin-bottom: 0 !important;
  }
  .pre-header > div:not(.container) {
    padding: 4px 0 !important;
  }
  /* Pre-header ke baad header hamesha neeche – overlap na, section neeche shift */
  body.ecommerce .pre-header + .header,
  .pre-header + .header,
  .pre-header + #header {
    margin-top: 0 !important;
    padding-top: 8px !important;
  }
  body.ecommerce .pre-header + .header .container-fluid > .row:first-of-type,
  .pre-header + #header .container-fluid > .row:first-of-type {
    margin-top: 0 !important;
  }
  body.ecommerce .pre-header + .header .container-fluid > .row:first-of-type > [class*="col-lg-2"],
  body.ecommerce .pre-header + .header .container-fluid > .row:first-of-type > .col-sm-4,
  .pre-header + #header .container-fluid > .row:first-of-type > [class*="col-lg-2"],
  .pre-header + #header .container-fluid > .row:first-of-type > .col-sm-4 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Zyada words: word chota, line neeche – bigadna nahi; kam words (WELCOME!) ko chhedo mat */
  .pre-header > div:not(.container) > div,
  .pre-header > div:not(.container) h4,
  .pre-header > div:not(.container) p {
    font-size: 11px !important;
    line-height: 1.25 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}
@media (max-width: 480px) {
  /* Mobile: right side gap fix – full width */
  html body.ecommerce,
  body.ecommerce {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    zoom: 1 !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  body.ecommerce .container-fluid,
  body.ecommerce .container,
  body.ecommerce [class*="container"] {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
  body.ecommerce .row,
  body.ecommerce .two-items-bottom-items,
  body.ecommerce .sale-product,
  body.ecommerce .col-md-12.sale-product,
  body.ecommerce .owl-carousel,
  body.ecommerce .owl-carousel2,
  body.ecommerce .owl-carousel3,
  body.ecommerce [class*="col-"] {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
  .pre-header {
    padding: 5px 10px 6px !important;
    max-width: 100% !important;
  }
  /* Sirf zyada words (double div) – word chota, section neeche */
  .pre-header > div:not(.container) > div,
  .pre-header > div:not(.container) h4,
  .pre-header > div:not(.container) p {
    font-size: 10px !important;
    line-height: 1.2 !important;
  }
}
@media (max-width: 360px) {
  .pre-header {
    padding: 4px 8px 6px !important;
  }
  .pre-header > div:not(.container) > div,
  .pre-header > div:not(.container) h4,
  .pre-header > div:not(.container) p {
    font-size: 9px !important;
    line-height: 1.2 !important;
  }
}

/* ========== LARGE SCREEN: 1025px+ (header stable) ========== */
/* ========== LARGE SCREEN: 1025px+ (header stable) ========== */
@media (min-width: 1025px) {
  body.ecommerce .header,
  body.ecommerce .header .container-fluid {
    overflow: visible !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type {
    flex-wrap: wrap !important;
  }
  /* Logo size limit – large screen pe zyada bada na ho */
  body.ecommerce .header .site-logo,
  #header .site-logo {
    max-height: 125px !important;
    max-width: 300px !important;
  }
  body.ecommerce .header .site-logo img,
  #header .site-logo img {
    max-height: 125px !important;
    max-width: 300px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }
}

/* ========== Header row columns - width auto (logo + search overlap fix) ========== */
@media (min-width: 992px) {
  body.ecommerce .header .container-fluid > .row:first-of-type {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-lg-1,
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-lg-2,
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-lg-3,
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-lg-6,
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-md-6,
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-sm-6,
  body.ecommerce .header .container-fluid > .row:first-of-type > [class*="col-lg-"],
  body.ecommerce .header .container-fluid > .row:first-of-type > [class*="col-md-"],
  body.ecommerce .header .container-fluid > .row:first-of-type > [class*="col-sm-"] {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    float: none !important;
  }
  /* Logo column - content ke hisaab se */
  body.ecommerce .header .container-fluid > .row:first-of-type > [class*="col-lg-2"],
  body.ecommerce .header .container-fluid > .row:first-of-type > .col-sm-4 {
    flex: 0 0 auto !important;
    min-width: 180px !important;
  }
  /* Search column - bachi hui jagah le */
  body.ecommerce .header .container-fluid > .row:first-of-type > [class*="col-lg-6"] {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form,
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .twitter-typeahead,
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form #txtSearch {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* ========== MEDIA QUERY: max-width 1024px ========== */
@media (max-width: 1024px) {
  /* sidebarToggle button - responsive view me hide */
  button#sidebarToggle,
  .btn#sidebarToggle,
  #sidebarToggle {
    display: none !important;
    visibility: hidden !important;
  }

  /* Right side gap fix – full width, no right margin/padding */
  html {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }
  body,
  html body {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
  }
  body.ecommerce {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    zoom: 1 !important;
  }
  body.ecommerce .header .container-fluid,
  body.ecommerce .pre-header .container,
  body.ecommerce .pre-footer .container,
  body.ecommerce .footer .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  body.ecommerce #container-fluid,
  body.ecommerce .container-fluid,
  body.ecommerce .container,
  body.ecommerce [class*="container"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
  }
  body.ecommerce .row,
  body.ecommerce .two-items-bottom-items,
  body.ecommerce .sale-product,
  body.ecommerce .col-md-12.sale-product,
  body.ecommerce .owl-carousel,
  body.ecommerce .owl-carousel2,
  body.ecommerce .owl-carousel3,
  body.ecommerce [class*="col-"] {
    padding-right: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Header spacing kam – zyada gap na ho */
  body.ecommerce .header .container-fluid > .row:first-of-type {
    gap: 2px 6px !important;
    row-gap: 2px !important;
  }

  /* Banner/slider/hero – full width, side se kharab na ho */
  body.ecommerce .container-fluid,
  body.ecommerce .container,
  body.ecommerce .row,
  body.ecommerce [class*="banner"],
  body.ecommerce [class*="slider"],
  body.ecommerce .slick-slider,
  body.ecommerce .owl-carousel,
  body.ecommerce .steps-block,
  body.ecommerce .steps-block-red {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  body.ecommerce .slick-list,
  body.ecommerce .slick-track,
  body.ecommerce .owl-stage-outer,
  body.ecommerce .owl-stage {
    overflow: hidden !important;
  }
  /* Sale product - overflow hidden, doosre card ka data na dikhe */
  .col-md-12.sale-product,
  .sale-product {
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .sale-product .owl-carousel,
  .col-md-12.sale-product .owl-carousel {
    overflow: hidden !important;
    width: 100% !important;
  }
  .sale-product .owl-stage-outer,
  .col-md-12.sale-product .owl-stage-outer {
    overflow: hidden !important;
  }
  .sale-product .owl-stage,
  .col-md-12.sale-product .owl-stage {
    display: flex !important;
  }

  /* CLEARANCE section: sale-product prev/next buttons - neeche position */
  .sale-product .owl-controls,
  .col-md-12.sale-product .owl-controls {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: auto !important;
    bottom: -42px !important;
    right: 50% !important;
    transform: translateX(50%) !important;
    left: auto !important;
    z-index: 10 !important;
  }
  .sale-product .owl-prev,
  .sale-product .owl-next,
  .col-md-12.sale-product .owl-prev,
  .col-md-12.sale-product .owl-next {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .sale-product .owl-controls .owl-prev[style],
  .sale-product .owl-controls .owl-next[style],
  .col-md-12.sale-product .owl-controls .owl-prev[style],
  .col-md-12.sale-product .owl-controls .owl-next[style],
  .sale-product .owl-nav .owl-prev,
  .sale-product .owl-nav .owl-next,
  .col-md-12.sale-product .owl-nav .owl-prev,
  .col-md-12.sale-product .owl-nav .owl-next {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .sale-product .owl-controls .owl-nav,
  .col-md-12.sale-product .owl-controls .owl-nav {
    display: block !important;
    visibility: visible !important;
  }
  .sale-product,
  .col-md-12.sale-product {
    padding-bottom: 0 !important;
  }

  /* two-items-bottom-items se margin-bottom hatao - responsive me */
  .two-items-bottom-items {
    margin-bottom: 0 !important;
  }

  /* margin-bottom-20 class se margin hatao - responsive me */
  .margin-bottom-20,
  .row.margin-bottom-20,
  div.margin-bottom-20,
  body.ecommerce .margin-bottom-20,
  body.ecommerce .row.margin-bottom-20,
  .container-fluid .margin-bottom-20,
  .container-fluid .row.margin-bottom-20,
  body.ecommerce .container-fluid .margin-bottom-20,
  body.ecommerce .container-fluid .row.margin-bottom-20 {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Homepage CLEARANCE (Section 3): owl-carousel2/3 - prev/next CLEARANCE bar ke right me */
  .two-items-bottom-items {
    position: relative !important;
    overflow: visible !important;
  }
  .two-items-bottom-items h2#h3 {
    position: relative !important;
    padding-right: 140px !important;
    z-index: 1 !important;
  }
  .owl-carousel2,
  .owl-carousel3 {
    position: relative !important;
  }
  .owl-carousel2 .owl-controls,
  .owl-carousel3 .owl-controls,
  .two-items-bottom-items .owl-controls,
  .owl-carousel2 .owl-nav {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 0 !important;
    bottom: auto !important;
    right: 10px !important;
    left: auto !important;
    transform: translateY(-100%) !important;
    margin-top: -5px !important;
    z-index: 20 !important;
    width: auto !important;
    height: auto !important;
  }
  .owl-carousel2 .owl-prev,
  .owl-carousel2 .owl-next,
  .owl-carousel3 .owl-prev,
  .owl-carousel3 .owl-next {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .owl-carousel2 .owl-controls .owl-prev[style],
  .owl-carousel2 .owl-controls .owl-next[style],
  .owl-carousel3 .owl-controls .owl-prev[style],
  .owl-carousel3 .owl-controls .owl-next[style],
  .owl-carousel2 .owl-nav .owl-prev,
  .owl-carousel2 .owl-nav .owl-next,
  .owl-carousel3 .owl-nav .owl-prev,
  .owl-carousel3 .owl-nav .owl-next {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .owl-carousel2 .owl-controls .owl-nav,
  .owl-carousel3 .owl-controls .owl-nav {
    display: block !important;
    visibility: visible !important;
  }

  /* Owl carousel buttons: modals/dropdowns me neeche */
  .top-cart-content-wrapper .owl-controls,
  .top-cart-content .owl-controls,
  .quick-order .owl-controls,
  body.ecommerce .header .top-cart-block .owl-controls,
  .top-cart-content-wrapper .owl-carousel .owl-controls,
  .top-cart-content .owl-carousel .owl-controls {
    top: auto !important;
    bottom: -40px !important;
    right: 50% !important;
    transform: translateX(50%) !important;
    left: auto !important;
  }

  /* Slick slider z-index - modal ke neeche */
  body.ecommerce .slick-slider {
    z-index: 1 !important;
    position: relative !important;
  }
  body.ecommerce .slick-prev,
  body.ecommerce .slick-next {
    z-index: 1 !important;
  }

  /* Slider ke upar neeche space khatam - responsive me */
  .slick-slider,
  .slick-slider .slick-list,
  .slick-slider .slick-track,
  .slick-slider-wrapper,
  .container .slick-slider,
  .row .slick-slider,
  body.ecommerce .slick-slider {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Slider ke container/parent elements se bhi space hatao */
  .container .slick-slider,
  .row .slick-slider,
  body.ecommerce .container .slick-slider,
  body.ecommerce .row .slick-slider {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Slider ke just upar wale element se space hatao */
  .header ~ .container .slick-slider,
  .header ~ .row .slick-slider,
  body.ecommerce .header ~ .container .slick-slider,
  body.ecommerce .header ~ .row .slick-slider {
    margin-top: 0 !important;
  }
  /* Slider ke neeche wale element se space hatao */
  .slick-slider ~ .container,
  .slick-slider ~ .row,
  .slick-slider ~ .steps-block,
  body.ecommerce .slick-slider ~ .container,
  body.ecommerce .slick-slider ~ .row,
  body.ecommerce .slick-slider ~ .steps-block {
    margin-top: 0 !important;
  }
  /* margin-bottom-20 wale row ke neeche space hatao */
  .row.margin-bottom-20 + *,
  .margin-bottom-20 + *,
  .row.margin-bottom-20 ~ *,
  .margin-bottom-20 ~ * {
    margin-top: 0 !important;
  }

  /* Category/Brand page - SHOW dropdown ke neeche kuch chup rha hai uska fix */
  .list-view-sorting,
  .row.list-view-sorting,
  .list-view-sorting .col-md-10,
  .list-view-sorting .col-sm-10 {
    overflow: visible !important;
    position: relative !important;
  }
  /* SHOW dropdown ke neeche wale hidden elements ko hide */
  .list-view-sorting .pull-right {
    overflow: visible !important;
    position: relative !important;
    z-index: 10 !important;
  }
  .list-view-sorting select,
  .list-view-sorting .form-control {
    overflow: visible !important;
    z-index: 10 !important;
  }
  /* Dropdown ke neeche wale content ko hide */
  .list-view-sorting::after {
    display: none !important;
    content: none !important;
  }

  /* Logo sizing */
  body.ecommerce .header .container-fluid > .row:first-of-type .site-logo {
    max-width: 50% !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .site-logo img {
    max-width: 150px !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .site-logo {
    max-width: 120px !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .site-logo img {
    max-width: 120px !important;
  }

  /* Search button positioning */
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .twitter-typeahead {
    position: relative !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .searchBtn,
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .btn.searchBtn {
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  /* Icon alignment */
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block i.fa,
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .fa-user,
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .fa-shopping-cart,
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .fa-truck {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-self: center !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block.header-quickorder-block {
    margin-top: 0 !important;
    padding-top: 0 !important;
    align-self: center !important;
  }

  /* Cart/Account/Quick Order modal - icons ke just neeche khule */
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .top-cart-content-wrapper,
  body.ecommerce .header .top-cart-block .top-cart-content-wrapper {
    top: 140px !important;
  }
}

/* ========== MEDIA QUERY: max-width 768px ========== */
@media (max-width: 768px) {
  /* Quick chat button chota + chat window full viewport me */
  .floating-message-button {
    width: 44px !important;
    height: 44px !important;
    bottom: 80px !important;
    right: 12px !important;
  }
  .floating-message-button img {
    width: 32px !important;
    height: 32px !important;
  }
  .chatbox {
    width: calc(100vw - 24px) !important;
    right: 12px !important;
    bottom: 70px !important;
    height: 70vh !important;
    max-height: 70vh !important;
  }
  /* Floating button overlap fix - product items se overlap na ho */
  .floating-message-button,
  #ai-chat-container {
    z-index: 999 !important;
    pointer-events: auto !important;
  }
  /* Cart/Account/Quick Order modal - icons ke just neeche khule (tablet) */
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .top-cart-content-wrapper,
  body.ecommerce .header .top-cart-block .top-cart-content-wrapper {
    top: 150px !important;
  }

  /* two-items-bottom-items se margin-bottom hatao - tablet me */
  .two-items-bottom-items {
    margin-bottom: 0 !important;
  }

  /* margin-bottom-20 class se margin hatao - tablet me */
  .margin-bottom-20,
  .row.margin-bottom-20,
  div.margin-bottom-20,
  body.ecommerce .margin-bottom-20,
  body.ecommerce .row.margin-bottom-20,
  .container-fluid .margin-bottom-20,
  .container-fluid .row.margin-bottom-20,
  body.ecommerce .container-fluid .margin-bottom-20,
  body.ecommerce .container-fluid .row.margin-bottom-20 {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* sale-product padding-bottom hatao - tablet me */
  .sale-product,
  .col-md-12.sale-product {
    padding-bottom: 0 !important;
  }

  /* Category/Brand page - SHOW dropdown ke neeche kuch chup rha hai uska fix (tablet) */
  .list-view-sorting,
  .row.list-view-sorting {
    overflow: visible !important;
    position: relative !important;
  }
  .list-view-sorting .pull-right,
  .list-view-sorting select {
    overflow: visible !important;
    z-index: 10 !important;
  }
}

/* ========== MEDIA QUERY: max-width 480px ========== */
@media (max-width: 480px) {
  /* Product cards full width */
  body.ecommerce .product-item,
  body.ecommerce .product-list .product-item,
  body.ecommerce .pi-img-wrapper,
  body.ecommerce .product-info {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Floating button overlap fix - mobile me button ko neeche aur right me shift */
  .floating-message-button,
  #ai-chat-container {
    bottom: 80px !important;
    right: 12px !important;
    z-index: 999 !important;
  }
  /* Product image wrapper se button overlap na ho */
  .pi-img-wrapper,
  .product-item .pi-img-wrapper,
  body.ecommerce .pi-img-wrapper {
    padding-right: 0 !important;
    margin-right: 0 !important;
    position: relative !important;
  }
  /* Red question mark button ya koi bhi fixed button overlap fix */
  [class*="help"],
  [class*="support"],
  [class*="question"],
  [id*="help"],
  [id*="support"],
  button[style*="position: fixed"],
  a[style*="position: fixed"] {
    bottom: 80px !important;
    right: 12px !important;
    z-index: 999 !important;
  }

  /* Sale product - overflow visible for buttons */
  .col-md-12.sale-product,
  .sale-product {
    overflow: visible !important;
    padding-right: 0 !important;
  }
  .sale-product .owl-stage-outer,
  .col-md-12.sale-product .owl-stage-outer {
    overflow: hidden !important;
  }
  .sale-product .owl-nav .owl-prev,
  .sale-product .owl-nav .owl-next,
  .col-md-12.sale-product .owl-nav .owl-prev,
  .col-md-12.sale-product .owl-nav .owl-next {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .sale-product .owl-controls .owl-nav,
  .col-md-12.sale-product .owl-controls .owl-nav {
    display: block !important;
  }

  /* CLEARANCE owl-carousel2 buttons - h2 ke saamne */
  .two-items-bottom-items {
    position: relative !important;
    overflow: visible !important;
  }
  .two-items-bottom-items h2#h3 {
    position: relative !important;
    padding-right: 140px !important;
    z-index: 1 !important;
  }
  .owl-carousel2 {
    position: relative !important;
  }
  .owl-carousel2 .owl-controls,
  .owl-carousel2 .owl-nav,
  .two-items-bottom-items .owl-carousel2 .owl-controls {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    top: 0 !important;
    right: 10px !important;
    left: auto !important;
    bottom: auto !important;
    transform: translateY(-100%) !important;
    margin-top: -5px !important;
    z-index: 20 !important;
    width: auto !important;
    height: auto !important;
  }
  .owl-carousel2 .owl-prev,
  .owl-carousel2 .owl-next {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
  }
  .row.margin-bottom-35 {
    overflow: visible !important;
  }
  .col-md-8.two-items-bottom-items {
    overflow: visible !important;
    position: relative !important;
  }

  /* Logo sizing */
  body.ecommerce .header .container-fluid > .row:first-of-type .site-logo img {
    max-width: 120px !important;
  }

  /* Search button center align */
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .twitter-typeahead {
    position: relative !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .searchBtn,
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .btn.searchBtn {
    position: absolute !important;
    right: 13px !important;
    top: 47% !important;
    transform: translateY(-50%) !important;
  }

  /* Icon alignment */
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block.header-quickorder-block {
    margin-top: 0 !important;
    padding-top: 0 !important;
    align-self: center !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block.header-quickorder-block .fa-truck,
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block.header-quickorder-block i.fa-truck {
    margin-top: 13px !important;
    align-self: center !important;
    vertical-align: middle !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .fa,
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block i.fa {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-self: center !important;
  }

  /* Owl carousel buttons: modals/dropdowns me neeche */
  .top-cart-content-wrapper .owl-controls,
  .top-cart-content .owl-controls,
  .quick-order .owl-controls,
  body.ecommerce .header .top-cart-block .owl-controls,
  .top-cart-content-wrapper .owl-carousel .owl-controls,
  .top-cart-content .owl-carousel .owl-controls {
    top: auto !important;
    bottom: -40px !important;
    right: 50% !important;
    transform: translateX(50%) !important;
    left: auto !important;
  }
  body.ecommerce .slick-prev,
  body.ecommerce .slick-next {
    z-index: 1 !important;
  }

  /* Cart/Account/Quick Order modal - icons ke just neeche khule (mobile) */
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block .top-cart-content-wrapper,
  body.ecommerce .header .top-cart-block .top-cart-content-wrapper {
    top: 160px !important;
  }

  /* Slider ke upar neeche space khatam - mobile me */
  .slick-slider,
  .slick-slider .slick-list,
  .slick-slider .slick-track {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .container .slick-slider,
  .row .slick-slider,
  .container-fluid .slick-slider {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Slider ke neeche wale elements se bhi space hatao */
  .slick-slider + *,
  .slick-slider ~ *,
  .row.margin-bottom-20 + *,
  .margin-bottom-20 + * {
    margin-top: 0 !important;
  }

  /* two-items-bottom-items se margin-bottom hatao - mobile me */
  .two-items-bottom-items {
    margin-bottom: 0 !important;
  }

  /* margin-bottom-20 class se margin hatao - mobile me */
  .margin-bottom-20,
  .row.margin-bottom-20,
  div.margin-bottom-20,
  body.ecommerce .margin-bottom-20,
  body.ecommerce .row.margin-bottom-20,
  .container-fluid .margin-bottom-20,
  .container-fluid .row.margin-bottom-20,
  body.ecommerce .container-fluid .margin-bottom-20,
  body.ecommerce .container-fluid .row.margin-bottom-20,
  body.ecommerce .container-fluid .row.margin-bottom-20 .sale-product,
  body.ecommerce .row.margin-bottom-20 .sale-product,
  body.ecommerce .row.margin-bottom-20 .col-md-12,
  body.ecommerce .row.margin-bottom-20 .col-sm-12 {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Slider ke container row se bhi space hatao - child elements ke saath */
  .row.margin-bottom-20 .slick-slider,
  .margin-bottom-20 .slick-slider,
  .row.margin-bottom-20 .sale-product,
  .margin-bottom-20 .sale-product {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* sale-product padding-bottom hatao - mobile me */
  .sale-product,
  .col-md-12.sale-product {
    padding-bottom: 0 !important;
  }

  /* Category/Brand page - SHOW dropdown ke neeche kuch chup rha hai uska fix */
  .list-view-sorting,
  .row.list-view-sorting,
  .list-view-sorting .col-md-10,
  .list-view-sorting .col-sm-10 {
    overflow: visible !important;
    position: relative !important;
  }
  /* SHOW dropdown ke neeche wale elements hide karo */
  .list-view-sorting + *,
  .list-view-sorting ~ *,
  .navbar + .container-fluid,
  nav.navbar + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  /* SHOW dropdown ke container se overflow hide */
  .list-view-sorting .pull-right,
  .list-view-sorting select,
  .list-view-sorting .form-control {
    overflow: visible !important;
    position: relative !important;
    z-index: 10 !important;
  }
  /* Dropdown ke neeche wale hidden content ko hide */
  .list-view-sorting::after,
  .list-view-sorting .pull-right::after {
    display: none !important;
  }
  #header #search-form .searchBtn {
  margin-top: -17px !important;
}
input#poNumber {
  width: 170px !important;
  margin-bottom: 10px;
}
#processCheckout{
  margin-bottom: 8px;
}

}


#addToCartBtnItem{
  height: 34px;
}
.top-cart-block>.fa-boxes{
  top: -32px;
  right: -11px;
}
#registerModal .modal-content{
      /* width: 405px !important; */
    font-size: 14px;
}
.ecommerce h2{
  margin-left: 10px;
}


/* ========== Mobile: search box + button same line, spacing kam, side overflow na ========== */
@media (max-width: 480px) {
  body.ecommerce .header .container-fluid > .row:first-of-type .site-logo img {
    margin-left: 0 !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type {
    gap: 2px 4px !important;
    row-gap: 2px !important;
  }
  body.ecommerce .header #search-form {
    position: relative !important;
  }
  /* Search button input ke saath same line (row 2) – sirf CSS me */
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .searchBtn,
  body.ecommerce .header .container-fluid > .row:first-of-type #search-form .btn.searchBtn {
    grid-column: 4 !important;
    grid-row: 2 !important;
    justify-self: end !important;
    align-self: center !important;
  }
   .owl-carousel.owl-carousel3.owl-theme.owl-loaded {
    margin-left: 10px !important;
  }
  body.ecommerce .header #search-form .tt-menu, body.ecommerce .header #search-form .tt-dropdown-menu {
    top: 36px !important;
  }
  body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    border-radius: 20px;
    background-color: #f2f2f2; /* change color if needed */
    border: 1px solid #ddd;
}

body.ecommerce .header .container-fluid > .row:first-of-type .top-cart-block > i.fa.fa-user::after {
    content: " Login";
    font-size: 12px;
    margin-left: 6px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 500;
}
body.ecommerce .top-cart-block:has(.fa-shopping-cart)::after {
    content: " Cart";
    font-size: 12px;
    margin-left: 6px;
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
     font-weight: bold;
}
body.ecommerce .top-cart-block:has(.fa-truck)::after {
    content: " Q-Order";
    font-size: 12px;
    margin-left: 8px;
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
     font-weight: bold;
}
}

/* ========== Right side gap fix – high specificity (theme override) ========== */
@media (max-width: 1024px) {
  html {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  html body.ecommerce {
    zoom: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
    overflow-x: hidden !important;
  }
  body.ecommerce > #container-fluid,
  html body.ecommerce #container-fluid,
  html body.ecommerce div#container-fluid.container-fluid,
  html body.ecommerce .container-fluid,
  html body.ecommerce .container,
  html body.ecommerce [class*="container"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    box-sizing: border-box !important;
  }
  html body.ecommerce .row,
  html body.ecommerce [class*="col-"] {
    padding-right: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
  }
  html body.ecommerce .sale-product,
  html body.ecommerce .col-md-12.sale-product {
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
 
}