.page-indicator {
    font-size: 1rem;
    font-weight: 500;
    color: #333; /* Change to white if your background is dark */
    background-color: transparent;
}


#variations {
    transition: transform 0.3s ease;
    overflow-x: hidden; /* keep horizontal scrolling hidden */
    display: flex; /* Flexbox to arrange items horizontally */
    flex-wrap: nowrap; /* Ensure items don't wrap to a new line */
    height: auto; /* Allow height to adjust based on content */
}

@keyframes rock {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(-15deg); }
  50% { transform: rotate(15deg); }
  75% { transform: rotate(-10deg); }
  100% { transform: rotate(0deg); }
}

.rocking-icon {
  animation: rock 1.5s infinite ease-in-out;
  display: inline-block;
}


#zoomImageBtn {
        position:relative !important;
        top:10px !important;
    width: 20% !important;  /* Increase width to 50% for mobile screens */
    height: 50px !important; /* Reduce height for mobile screens */
    font-size: 0.8rem !important; /* Adjust font size for mobile */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Hide text overflow */
    text-overflow: ellipsis; /* Add ellipsis for overflowed text */
    white-space: nowrap; /* Prevent text from wrapping */
    text-align: center; /* Ensure text is centered */
}

/* Shared wrapper for ALL thumbs */
.thumbnail-wrapper {
  width: 120px;               /* desktop thumb width */
  height: 100px;              /* desktop thumb height */
  border: 1px solid #ccc;
  border-radius: 8px;
  overflow: hidden;
  background: #f7f7f7;
  position: relative;
  cursor: pointer;
}

/* Fill the wrapper with image or video */
.thumbnail-wrapper img,
.thumbnail-wrapper video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Play icon overlay for video */
.play-icon-overlay {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
  font-size: 2rem;
  color: white;
}

button.more-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.2rem;
}

#mainImage
{
    width:600px !important;
}

.main-image {
    border: 1px solid #ccc;
    border-radius: 8px;
    width: 100%;
    height: auto;
    max-height: 350px;
    object-fit: contain;
    position: relative; /* Needed for left to work */
}

/* Desktop offset */
.media-shift {
    left: 20px !important;
}


#product-title {
    font-size: 20px;         /* Smaller size (adjust as needed) */
    font-weight: 500;        /* Less bold than 700 (normal is 400) */
    font-family: 'Helvetica', 'Arial', sans-serif; /* Optional: cleaner font */
    margin: 10px 0;          /* Optional spacing */
}


#mainMediaContainer {
    position: relative;  /* Make sure the container is positioned */
    left:-20px !important;
    z-index: 10;         /* Give it a stacking context (higher number = on top) */
    width: 100%;
    max-width: 700px;
    height: auto;
    max-height: 500px;
    margin: 0 auto;
}



#col-md-6_product-page h2,
#col-md-6_product-page h5,
#col-md-6_product-page p,
#col-md-6_product-page label,
#col-md-6_product-page select,
#col-md-6_product-page button,
#col-md-6_product-page ul {
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
}

#productDetailsSection {
    gap: 0.15rem;
}

#productDetails {
    width: 100% !important;
    position: relative;
    left: -1%;
    height: auto !important;
    min-height: 900px;
}

#productDetailsSection button,
#productDetailsSection select {
    margin-bottom: 0.2rem !important;
}

#product-stars {
    position:relative;
    top:10px;
    margin-bottom: 0.2rem !important;
}

.product-details {
    margin-top: 0.2rem !important;
}

#description-wrapper,
#product-extra-info,
#soldQuantityDisplay,
.product-quantity {
    margin-bottom: 0.2rem !important;
}



 #mainMediaContainer img {
    width: 85% !important;
    height: auto;
    max-height: 500px;
    object-fit: contain;
  }

.thumbnail-container {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 10px;
}

#thumbnailContainer {
  display: flex;
  flex-wrap: wrap; /* Allows wrapping for mobiles  */
  gap: 8px;
  overflow-x: auto; /* Enable horizontal scroll only if needed */
  overflow-y: hidden;
         z-index: 9999 !important; /* Make it appear above other content */
  padding: 8px 0;
  height: 170px; /* Height for desktop */
}

  /* Zoom icon responsive size */
  .bi-zoom-in {
    font-size: 1.8rem;
  }


  #shareDropdownWrapper {
      position: relative !important;
      top:-280px !important;
      left:-18% !important;
  max-width: 550px;
  margin: 0 auto;
}

#image-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  max-width: 1400px;   /* Wider container */
  margin: 20px auto;
  padding: 0 10px;
}

.image-item img {
  width: 100%;
  height: 700px;       /* Bigger height */
  object-fit: contain;
  border-radius: 12px;
}

#footer-placeholder
{
    margin-top:3%;
}


 #videoThumbnailContainer {
    width: 40% !important;  /* You can adjust this based on your design */
    height: 70px !important;  /* Adjust this height for mobile */
  }

 .small-breadcrumb {
  font-size: 0.75rem; /* Smaller than default */
}


 .animated-handshake {
  animation: handshake 1.5s infinite ease-in-out;
  transform-origin: center;
}

/* Handshake animation */
@keyframes handshake {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(8deg); }
  50% { transform: rotate(-8deg); }
  75% { transform: rotate(4deg); }
}



 #thumbLeftBtn, #thumbRightBtn {
 background: grey !important;
 }

#thumbLeftBtn {
  position: absolute !important;
  left: 4px !important;
  z-index: 10 !important;
  border-top-left-radius: 5px !important;
  border-bottom-left-radius: 5px !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

#thumbRightBtn {
  position: absolute !important;
  right: 12px !important;
  z-index: 10 !important;
  border-top-right-radius: 5px !important;
  border-bottom-right-radius: 5px !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}






.ads-container {
    position:relative;
    left:-2%;
  text-align: center;
  margin: 20px auto;
}

.ads-heading {
    position:relative !important;
    left:-22% !important;
  font-size: 14px;
  font-weight: bold;
  color: #666;
  text-align: center;
  margin-bottom: 8px;
  text-transform: uppercase;
}

/* Desktop ad: push slightly to the right */
.desktop-ad {
  display: inline-block;
  position: relative;
  left: 10px; /* move right by 50px */
}

/* Mobile ad: hidden by default */
.mobile-ad {
  display: none !important;
}

.mobile-heading
{
    display: none !important;
}

.ads-separator {
    border:0.5px solid grey;/* remove default styling */
  border-top: 1px solid #ccc; /* simple thin gray line */
  height: 1px;                /* ensure it's visible */
  margin: 20px auto;          /* vertical spacing, centered */
  width: 62%;                 /* line width, adjust as needed */
}


#productPrice {
  text-align: left !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  font-size: 1.6rem; /* 🔥 increase here */
}

#productPrice p {
  margin: 0;
}




/* Bigger dropdown button */
.variation-dropdown-wrapper .dropdown button {
  min-width: 220px !important;
  height: 50px !important;
  font-size: 1rem !important;
  padding: 8px 10px !important;
}

/* Bigger image inside button */
.variation-dropdown-wrapper .dropdown button img {
  width: 28px !important;
  height: 28px !important;
  margin-right: 6px !important;
}

/* Bigger dropdown items */
.variation-dropdown-wrapper .dropdown-item {
  font-size: 0.95rem !important;
  padding: 6px 8px !important;
}

/* Bigger images inside dropdown list */
.variation-dropdown-wrapper .dropdown-item img {
  width: 28px !important;
  height: 28px !important;
  margin-right: 6px !important;
}


@media (min-width: 768px) {

  #productPrice p span:nth-child(1),
  #productPrice p span:nth-child(2) {
    position: relative;
    top: 8px;   /* 🔥 only desktop moves */
  }

}

@media (max-width: 520px) {

  #productPrice p {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    align-items: flex-end !important;
  }




  /* 🔥 SAME size for % OFF + countdown */
  #productPrice p span,
  #productPrice #countdownTimer {
    font-size: 0.85rem !important;
    line-height: 1.1 !important;
  }

  /* Sale price slightly bigger */
  #productPrice p span:nth-child(2) {
    font-size: 1rem !important;
  }

  /* % OFF badge */
  #productPrice p span:nth-child(3) {
    font-size: 0.85rem !important;
    padding: 3px 7px !important;
  }


 #productPrice span#countdownTimer {

    font-size: 1.2rem !important;   /* 🔥 slightly larger */

    /* keep your existing styles */
    border: 1px solid rgba(40,167,69,0.15) !important;
    padding: 1px 4px !important;
    border-radius: 4px !important;

    position: relative;
    top: -8px;
  }


  .variation-dropdown-wrapper .dropdown button {
    width: 100% !important;
    height: 48px !important;
    font-size: 0.95rem !important;
  }

  .variation-dropdown-wrapper .dropdown button img {
    width: 24px !important;
    height: 24px !important;
  }

  .variation-dropdown-wrapper .dropdown-item {
    font-size: 0.9rem !important;
  }



    .variation-card {
    flex: 0 0 calc(100% - 20px); /* full width (one at a time) */
  }

 #productPrice {
  font-size: 1.4rem !important; /* 🔥 increase overall size */
     margin-top: -10px; /* 🔥 moves it up */
}

#productPrice span {
  font-size: 1.0em !important; /* slightly bigger than base */
}


         .ads-separator {
    border:0.5px solid grey;/* remove default styling */
  border-top: -1px solid #ccc; /* simple thin gray line */
  height: 1px;                /* ensure it's visible */
  margin: 20px auto;          /* vertical spacing, centered */
  width: 100% !important;                 /* line width, adjust as needed */
}

         .ads-heading
         {
             position:relative !important;
             left:-32% !important;
         }


   .desktop-heading, .desktop-ad { display: none !important; }

  /* Show mobile ad and heading */
  .mobile-heading, .mobile-ad {
    display: block !important;
  }

  /* Mobile heading position */
 .mobile-heading {
    text-align: left;           /* align text left */
    margin-left: 5%;            /* adjust left offset */
    font-size: 13px;
    position: relative;         /* allows left adjustment */
    left: -3% !important;                    /* you can increase negative value to shift more left */
  }

 .mobile-ad {
    display: inline-block !important;
    width: 95% !important;   /* nearly full width of screen */
    max-width: 95% !important;
    height: 150px !important; /* taller height */
    margin: 0;               /* no auto centering */
    padding-left: 0;         /* flush with left edge */
  }

  #variations-container {
    flex-wrap: wrap !important; /* allow wrapping */
    flex-direction: column !important; /* stack vertically */
    overflow-x: visible !important; /* disable horizontal scroll */
    padding: 10px 0 !important;
  }



    .small-breadcrumb {
    font-size: 0.85rem; /* Slightly larger for touch readability troy*/
    padding-left: 10px;
    padding-right: 10px;
    word-break: break-word;
        width:100% !important;
  }


   #breadcrumbNav {
  width:100%;                 /* Responsive width */
  max-width: 600px;           /* Prevents it from stretching too wide on large screens */
   margin: 0;
  text-align: left;           /* Align breadcrumb text to the left */
  position: relative;
  left: 0;                    /* No offset */
  overflow-wrap: break-word;  /* Wrap long breadcrumb content */
}

    #mainVideo {
        position:relative;
        left:-5% !important;
   height:290px !important;
    width: 85% !important;
  }




    #footer-placeholder
{
    margin-top:7% !important;
}

    .main-image {
        max-width: 100% !important; /* make video/image take full container width */
        max-height: none; /* optional: allow taller height */
    }




    #product-stars-rating {
        font-size: 1.6rem;
    }
    #product-stars small {
        font-size: 0.95rem;
    }

    .media-shift {
        left: -1px !important;
    }

     #image-gallery {
    grid-template-columns: 1fr;  /* single column */
    gap: 0 !important;           /* no gap between images */
    padding: 2px !important;     /* minimal padding */
  }

  .image-item {
    margin: 0 !important;
  }

  .image-item img {
    width: 100% !important;
    margin: 0 !important;
    display: block !important;
  }


#product-title {
    margin-top: -30px !important;   /* 🔥 correct way */

    font-size: 16px;
    font-weight: normal;
    font-family: 'Helvetica', 'Arial', sans-serif;

    margin-bottom: 10px;
    width: 95%;

    min-height: 50px;
    overflow: hidden;
    word-wrap: break-word;
    white-space: normal;
}

    #product-stars
    {
        position:relative !important;
        top:20px !important;
    }



    #zoomImageBtn {
        position:relative !important;
        top:-2px !important;
    width: 50% !important;  /* Increase width to 50% for mobile screens */
    height: 100px !important; /* Reduce height for mobile screens */
    font-size: 0.8rem !important; /* Adjust font size for mobile */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Hide text overflow */
    text-overflow: ellipsis; /* Add ellipsis for overflowed text */
    white-space: nowrap; /* Prevent text from wrapping */
    text-align: center; /* Ensure text is centered */
}

#zoomImageBtn span {
    max-width: 100%; /* Ensure span takes full available width */
    display: block; /* Make span block-level to allow proper overflow behavior */
}
     #variationPrev,
  #variationNext {
    display: none;        /* Hide arrows on mobile */
  }

  .variation-item.me-3 {
    min-width: auto !important; /* reset fixed width */
    width: 100% !important;     /* full width */
    margin-right: 0 !important;
    margin-bottom: 1rem !important;
  }

 #mainMediaContainer {
    max-width: 90% !important;
    padding: 5px;
    left: 45px !important;
  }

 #mainMediaContainer img,
#mainMediaContainer video {
  max-height: 260px; /* Smaller for mobile */
  margin-left: 10px !important; /* or 15px, 20px depending on your spacing needs */
}


  .carousel-item video {
    width: 100% !important;
    border-radius: 8px;
  }

 #videoThumbnailContainer {
    width: 60% !important;  /* You can adjust this based on your design */
    height: 80px !important;  /* Adjust this height for mobile */
  }


    #thumbnailContainer { height: 40px; }
  .thumbnail-wrapper {
    width: 80px;            /* mobile thumb width */
    height: 60px;           /* mobile thumb height */
  }



    /* Adjust Zoom Button Position */

    /* Navigation Arrows for Mobile */
    #thumbLeftBtn, #thumbRightBtn {
        top: 50% !important;
        font-size: 1.5rem !important;
        padding: 0.5rem;
        background: grey !important;
    }

    /* Hide unnecessary elements on mobile */
    #variationPrev, #variationNext {
        display: none !important;  /* Hide arrows on mobile */
    }

    /* Adjust "Add to Cart" and "Buy Now" Buttons for Mobile */#addToCartBtn,
#addToCartBtn{
    font-size: 1.1rem !important;
    height: 45px !important;
    border-radius: 20px !important;
    margin-top: -40px !important; /* move up slightly */
}

 #buyNowBtn
{
     position:relative;
     margin-top:1px !important;

}


 #feedback-col-md-12 h5 {
    margin-bottom: 2px;
  }

  #feedback-col-md-12 .mt-1 {
    margin-top: 0 !important;
  }

  #customer-review-link {
    display: inline-block;
    margin-top: 2px !important; /* tighten gap */
  }
}


  /* Position navigation buttons to corners */
  #thumbRightBtn,
  #thumbLeftBtn {
    z-index: 10;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.7);
    border: none;
  }

  @media (min-width: 1200px) and (max-width: 1250px) {
      #col-md-6
      {
          position:relative;
          left:30%;
      }
  }
/* Scoped review overview; existing product layout stays intact. */
#reviewOverview { padding:18px 20px; margin:0 0 20px; border:1px solid #d8e6f5; border-radius:14px; background:linear-gradient(135deg,#eef5ff,#f4fbfa); color:#16324f; min-width:0; overflow-wrap:anywhere; }
#reviewOverview .review-overview-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
#reviewOverview h5 { margin:0; font-size:18px; font-weight:700; }
#review-overview-count { font-size:12px; color:#416482; }
#reviewOverview #feedback-summary { position:static!important; inset:auto!important; margin:0 0 12px!important; width:auto!important; font-weight:400!important; line-height:1.6; }
#reviewOverview blockquote { margin:8px 0; padding:8px 12px; border-left:3px solid #659ce8; font-size:14px; line-height:1.55; background:#ffffff99; border-radius:0 6px 6px 0; }
#reviewOverview small { display:block; margin-top:10px; color:#5d7188; font-size:12px; }
@media(max-width:520px) { #reviewOverview { padding:15px; margin-bottom:16px; } #reviewOverview h5 { font-size:17px; } }

/* Laptop antivirus add-on should only occupy the height of its content. */
#computerServiceAddons,
#computerServiceAddons > .card-body {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
#computerServiceAddons { margin-bottom: 10px !important; }
#computerServiceAddons > .card-body { padding-bottom: 12px !important; }
#computerServiceAddons + #addToCartContainer:empty {
  display: none !important;
}
#computerServiceAddons + #addToCartContainer {
  height: auto !important;
  min-height: 0 !important;
  margin: 0 0 8px !important;
}
#computerServiceAddons ~ #addToCartBtn { margin-top: 0 !important; }

/* Image-backed variation cards wrap naturally on every screen size. */
#variationDropDown.variation-cards {
  display: flex !important;
  flex-direction: column;
  align-items: stretch;
  gap: 18px !important;
  width: 100% !important;
  max-width: 100%;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 18px 0 !important;
  overflow: visible !important;
}
#variationDropDown .variation-card-group {
  width: 100% !important;
  max-width: 100%;
  height: auto !important;
  min-height: 0 !important;
  flex: none !important;
  margin: 0 !important;
}
.variation-group-label { margin-bottom: 8px; color: #637083; font-size: 14px; }
.variation-selected-label { color: #182b42; }
.variation-card-options { display: flex; flex-wrap: wrap; gap: 9px; }
#variationDropDown .variation-option-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  width: 112px;
  max-width: 100%;
  min-width: 0 !important;
  height: auto !important;
  padding: 6px !important;
  border: 1px solid #c9d1dc;
  border-radius: 10px;
  background: #fff;
  color: #1c2d42;
  text-align: left;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
#variationDropDown .variation-option-card img {
  width: 100%;
  height: 52px;
  object-fit: contain;
  border-radius: 5px;
}
.variation-option-name { font-size: 12px; line-height: 1.35; font-weight: 500; overflow-wrap: anywhere; }
.variation-option-price { font-size: 13px; }
.variation-option-card s { font-size: 11px; color: #738092; }
#variationDropDown .variation-option-card:hover { border-color: #3983df; }
#variationDropDown .variation-option-card.is-selected {
  border-color: #176bd1;
  box-shadow: 0 0 0 2px #176bd1;
  background: #f5f9ff;
}
#variationDropDown .variation-option-card:focus-visible { outline: 3px solid #84b8ff; outline-offset: 3px; }
@media (max-width: 575px) {
  #variationDropDown .variation-option-card { width: calc((100% - 18px) / 3); }
  #variationDropDown .variation-option-card img { height: 48px; }
}

/* Initial loading view is replaced by the full product layout. */
.product-loading-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 36px 16px;
  color: #61738b;
  font-size: 14px;
}

/* Product sharing: compact blue action and a soft, readable menu. */
#shareDropdownWrapper #shareDropdown {
  width: auto !important;
  max-width: 100%;
  min-height: 44px;
  padding: 11px 20px !important;
  border: 1px solid #c8dcff !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #edf5ff, #ffffff) !important;
  color: #1859b8 !important;
  font-size: 14px !important;
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(30, 95, 180, .08);
  transition: background .18s, box-shadow .18s;
}
#shareDropdownWrapper #shareDropdown:hover,
#shareDropdownWrapper #shareDropdown[aria-expanded="true"] {
  background: #e4efff !important;
  box-shadow: 0 6px 16px rgba(30, 95, 180, .14);
}
#shareDropdownWrapper #shareDropdown:focus-visible {
  outline: 3px solid #85b5ff;
  outline-offset: 3px;
}
#shareDropdownWrapper #shareDropdownMenu {
  width: 240px !important;
  min-width: 0;
  max-width: calc(100vw - 32px);
  padding: 8px;
  border: 1px solid #dce5f0;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(19, 45, 80, .15);
}
#shareDropdownMenu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 9px;
  color: #20334c;
  font-size: 14px;
}
#shareDropdownMenu .dropdown-item i {
  width: 24px;
  text-align: center;
  font-size: 17px;
}
#shareDropdownMenu .dropdown-item:hover,
#shareDropdownMenu .dropdown-item:focus {
  background: #edf4ff;
  color: #1859b8;
}
#shareDropdownMenu #facebookShare i { color: #1877f2; }
#shareDropdownMenu #instagramShare i { color: #c13584; }
#shareDropdownMenu #copyShare { font-weight: 600; }

/* Product details: shared .col-md-6 height must not reserve blank space. */
#productContainer > .row > #specificationsSection,
#productContainer > .row > #returnShippingSection {
    height: auto !important;
    min-height: 0 !important;
}
#productContainer #hrLineBeforeFeedback {
    margin: 16px 0 !important;
}

/* Let the overview grow with its options instead of clipping its purchase panel. */
#productOverview,
#productOverview #productDetails,
#productOverview .product-overview-row,
#productOverview .product-overview-row > .col-md-6 {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}
#productOverview { margin-bottom: 0 !important; }
#productOverview #productDetails { margin-bottom: 0 !important; }
#productOverview #productDetailsSection { min-height: 0 !important; }
#productOverview #shareDropdownWrapper {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 12px 0 0 !important;
  padding: 0 !important;
}
#hrAfterShareButton { display: none !important; }
#productOverviewDivider {
  display: block !important;
  position: static !important;
  inset: auto !important;
  width: 90% !important;
  margin: 24px auto !important;
}
#extraDetailsSpacer { display: none !important; }
#extraDetails {
  position: relative !important;
  top: auto !important;
  margin-top: 0 !important;
}
#extraDetails #productContainer { margin-top: 0 !important; }
@media (min-width: 768px) {
  #productOverviewDivider {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  #productOverviewDivider { max-width: 960px; }
}
@media (min-width: 1200px) {
  #productOverviewDivider { max-width: 1140px; }
}
@media (min-width: 1400px) {
  #productOverviewDivider { max-width: 1320px; }
}

#productOverview #shareDropdownWrapper {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}
#productOverview #shareDropdown {
  display: inline-flex !important;
  align-items: center;
  position: relative !important;
  inset: auto !important;
  margin: 0 !important;
  transform: none !important;
}
#productOverview .product-thumbnail-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
  margin: 12px 0 8px;
  width: 100%;
  min-width: 0;
}
#productOverview .product-thumbnail-nav button {
  width: 36px;
  height: 32px;
  border: 1px solid #d3dce8;
  border-radius: 8px;
  color: #1859b8;
  background: #fff;
  font-size: 23px;
  line-height: 1;
  flex: 0 0 36px;
}
#productOverview .product-thumbnail-nav #thumbnailContainer {
  flex: 1 1 0;
  min-width: 0;
  width: auto !important;
  margin: 0 !important;
}
#productOverview #shareDropdownWrapper {
  text-align: left !important;
  display: block !important;
}
#productOverview #shareDropdownWrapper #shareDropdown {
  left: 0 !important;
  right: auto !important;
  margin-left: 0 !important;
  float: none !important;
}
body #extraDetails {
  margin: 0 !important;
  padding-top: 0 !important;
  inset: auto !important;
  transform: none !important;
  min-height: 0 !important;
}
body #extraDetails #productContainer {
  margin-top: 0 !important;
  top: auto !important;
  transform: none !important;
}
/* The description has its own legacy percentage margin inside extraDetails. */
body #extraDetails #extraDescriptionSection {
  position: relative !important;
  inset: auto !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}
body #extraDescriptionSection > .mt-5 {
  margin-top: 0 !important;
}
/* Desktop gallery stays compact even when the purchase column is taller. */
@media (min-width: 992px) {
  #variationDropDown .variation-option-card img {
    width: 56px !important;
    height: 38px !important;
    align-self: center;
  }
  #productOverview #productImage {
    height: auto !important;
    min-height: 0 !important;
  }
  #productOverview #mainMediaContainer { height: auto !important; }
  #productOverview #thumbnailContainer {
    position: relative !important;
    top: auto !important;
    margin-top: 12px !important;
    height: 92px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }
  #productOverview #thumbLeftBtn,
  #productOverview #thumbRightBtn {
    top: calc(50% - 16px) !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
  }
}

@media (max-width: 991px) {
  #productContainer #feedback-col-md-12 {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin-top: 20px !important;
    clear: both !important;
    width: 100% !important;
  }
  #productContainer #returnShippingSection {
    position: static !important;
    height: auto !important;
    min-height: 0 !important;
  }
}

/* Phone and landscape-phone layout: remove legacy positional offsets. */
@media (max-width: 991px) {
  #productOverview { width: 100% !important; padding: 0 16px !important; }
  #productOverview #productDetails { left: 0 !important; width: 100% !important; }
  #productOverview .product-overview-row { margin: 0 !important; gap: 20px; }
  #productOverview .product-overview-row > .col-md-6 {
    width: 100% !important;
    padding: 0 !important;
    margin-top: 0 !important;
    left: 0 !important;
    top: auto !important;
  }
  #productOverview #productImage {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: auto !important;
    padding: 0 !important;
  }
  #productOverview #mainMediaContainer {
    position: relative !important;
    left: 0 !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  #productOverview #mainMediaContainer img,
  #productOverview #mainMediaContainer video {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(240px, 65vw, 380px) !important;
    max-height: none !important;
    margin: 0 !important;
    object-fit: contain;
  }
  #productOverview #thumbnailContainer {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 84px !important;
    margin: 12px 0 0 !important;
    padding: 4px 0 !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
  #productOverview #thumbnailContainer > * { flex-shrink: 0; }
  #productOverview #shareDropdownWrapper { height: auto !important; min-height: 0 !important; }
  #productOverview #shareDropdown {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
  }
  #productOverview #product-title {
    position: static !important;
    margin: 0 0 12px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    font-size: 18px !important;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
  #productOverview #product-stars,
  #productOverview #productDetailsSection {
    position: static !important;
    margin-top: 12px !important;
    min-height: 0 !important;
  }
  #productOverview #addToCartBtn,
  #productOverview #buyNowBtn {
    position: static !important;
    width: 100% !important;
    margin-top: 0 !important;
  }
  #productOverview .payment-icons { flex-wrap: wrap !important; overflow: visible !important; gap: 10px 14px; }
  #productOverviewDivider { width: calc(100% - 32px) !important; margin: 16px auto !important; }
  #extraDetails { left: 0 !important; width: 100% !important; }
  #extraDetails #productContainer { width: calc(100% - 24px) !important; padding: 12px !important; }
}



/* Desktop carousels: remove the legacy left shift and center on the review width. */
@media(min-width:992px){
 body #desktopRelatedProductsSection,body #desktopBrowsingHistorySection{position:relative!important;left:0!important;right:auto!important;transform:none!important;width:90%!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box;}
}

/* Mobile: give item details and specifications matching outer edges and a gap. */
@media(max-width:991px){
 body #extraDetails #extraDescriptionSection,body #extraDetails #productContainer{position:static!important;inset:auto!important;transform:none!important;width:calc(100% - 24px)!important;max-width:none!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box;}
 body #extraDetails #extraDescriptionSection{padding-left:0!important;padding-right:0!important;margin-bottom:20px!important;}
 body #extraDetails #productContainer{margin-top:0!important;}
}

/* Specifications are nested inside extraDescriptionSection; space the inner box. */
@media(max-width:991px){
 body #extraDetails #extraDescriptionSection{display:flow-root;}
 body #extraDetails #extraDescriptionSection #productContainer{width:100%!important;max-width:100%!important;margin-top:24px!important;margin-left:0!important;margin-right:0!important;position:static!important;transform:none!important;box-sizing:border-box;}
}