/* RC Responsive Final v6 (2026-04-20)
   COMPREHENSIVE responsive fix.
   v6 changes:
     - FORCE Font Awesome 4.7 render (override theme bundle FA5 family)
     - Inject ::before content for all icons used (PurgeCSS-proof)
     - Touch targets >= 44px
     - Footer 1-column enforcement all mobile breakpoints
     - Hero responsive constraints
*/

/* ============================================================
   FORCE FONT AWESOME 4.7 SUBSET (override theme bundle FA5 family)
   Theme bundle defines `.fa { font-family: "Font Awesome 5 Free" }`
   but only FA4 subset is loaded via font-awesome-preload.css.
   We force ALL .fa selectors to use FontAwesome (FA4) and inject
   ::before content (PurgeCSS may have stripped them from bundle).
   ============================================================ */
.fa, .fas, .far, .fal, .fab,
.fa-solid, .fa-regular, .fa-brands,
[class^="fa-"], [class*=" fa-"] {
  font-family: "FontAwesome" !important;
  font-weight: normal !important;
  font-style: normal !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  display: inline-block;
  text-rendering: auto;
}

/* Icon glyphs (FA 4.7 codepoints) — explicit to survive PurgeCSS */
.fa-bars::before, .fa-navicon::before, .fa-reorder::before { content: "\f0c9" !important; font-family: FontAwesome !important; }
.fa-search::before { content: "\f002" !important; font-family: FontAwesome !important; }
.fa-user::before { content: "\f007" !important; font-family: FontAwesome !important; }
.fa-user-o::before { content: "\f2c0" !important; font-family: FontAwesome !important; }
.fa-shopping-bag::before { content: "\f290" !important; font-family: FontAwesome !important; }
.fa-shopping-cart::before, .fa-shopping-basket::before { content: "\f07a" !important; font-family: FontAwesome !important; }
.fa-cart-plus::before { content: "\f217" !important; font-family: FontAwesome !important; }
.fa-times::before, .fa-close::before, .fa-remove::before { content: "\f00d" !important; font-family: FontAwesome !important; }
.fa-angle-down::before { content: "\f107" !important; font-family: FontAwesome !important; }
.fa-angle-up::before { content: "\f106" !important; font-family: FontAwesome !important; }
.fa-angle-left::before { content: "\f104" !important; font-family: FontAwesome !important; }
.fa-angle-right::before { content: "\f105" !important; font-family: FontAwesome !important; }
.fa-chevron-down::before { content: "\f078" !important; font-family: FontAwesome !important; }
.fa-chevron-up::before { content: "\f077" !important; font-family: FontAwesome !important; }
.fa-chevron-left::before { content: "\f053" !important; font-family: FontAwesome !important; }
.fa-chevron-right::before { content: "\f054" !important; font-family: FontAwesome !important; }
.fa-arrow-up::before { content: "\f062" !important; font-family: FontAwesome !important; }
.fa-arrow-down::before { content: "\f063" !important; font-family: FontAwesome !important; }
.fa-arrow-left::before { content: "\f060" !important; font-family: FontAwesome !important; }
.fa-arrow-right::before { content: "\f061" !important; font-family: FontAwesome !important; }
.fa-phone::before { content: "\f095" !important; font-family: FontAwesome !important; }
.fa-mobile::before, .fa-mobile-phone::before { content: "\f10b" !important; font-family: FontAwesome !important; }
.fa-envelope::before { content: "\f0e0" !important; font-family: FontAwesome !important; }
.fa-envelope-o::before { content: "\f003" !important; font-family: FontAwesome !important; }
.fa-map-marker::before { content: "\f041" !important; font-family: FontAwesome !important; }
.fa-clock::before, .fa-clock-o::before { content: "\f017" !important; font-family: FontAwesome !important; }
.fa-heart::before { content: "\f004" !important; font-family: FontAwesome !important; }
.fa-heart-o::before { content: "\f08a" !important; font-family: FontAwesome !important; }
.fa-eye::before { content: "\f06e" !important; font-family: FontAwesome !important; }
.fa-eye-slash::before { content: "\f070" !important; font-family: FontAwesome !important; }
.fa-check::before { content: "\f00c" !important; font-family: FontAwesome !important; }
.fa-check-circle::before, .fa-check-circle-o::before { content: "\f058" !important; font-family: FontAwesome !important; }
.fa-plus::before { content: "\f067" !important; font-family: FontAwesome !important; }
.fa-minus::before { content: "\f068" !important; font-family: FontAwesome !important; }
.fa-info::before { content: "\f129" !important; font-family: FontAwesome !important; }
.fa-info-circle::before { content: "\f05a" !important; font-family: FontAwesome !important; }
.fa-question::before { content: "\f128" !important; font-family: FontAwesome !important; }
.fa-question-circle::before { content: "\f059" !important; font-family: FontAwesome !important; }
.fa-exclamation::before { content: "\f12a" !important; font-family: FontAwesome !important; }
.fa-exclamation-triangle::before, .fa-warning::before { content: "\f071" !important; font-family: FontAwesome !important; }
.fa-facebook::before, .fa-facebook-f::before { content: "\f09a" !important; font-family: FontAwesome !important; }
.fa-twitter::before { content: "\f099" !important; font-family: FontAwesome !important; }
.fa-instagram::before { content: "\f16d" !important; font-family: FontAwesome !important; }
.fa-whatsapp::before { content: "\f232" !important; font-family: FontAwesome !important; }
.fa-youtube::before, .fa-youtube-play::before { content: "\f167" !important; font-family: FontAwesome !important; }
.fa-linkedin::before, .fa-linkedin-square::before { content: "\f0e1" !important; font-family: FontAwesome !important; }
.mobile-bag-icon::before { content: "\f290" !important; font-family: FontAwesome !important; }
.fa-list::before { content: "\f03a" !important; font-family: FontAwesome !important; }
.fa-th::before { content: "\f00a" !important; font-family: FontAwesome !important; }
.fa-th-large::before { content: "\f009" !important; font-family: FontAwesome !important; }
.fa-filter::before { content: "\f0b0" !important; font-family: FontAwesome !important; }
.fa-sort::before { content: "\f0dc" !important; font-family: FontAwesome !important; }
.fa-sort-down::before, .fa-sort-desc::before { content: "\f0dd" !important; font-family: FontAwesome !important; }
.fa-sort-up::before, .fa-sort-asc::before { content: "\f0de" !important; font-family: FontAwesome !important; }
.fa-star::before { content: "\f005" !important; font-family: FontAwesome !important; }
.fa-star-o::before { content: "\f006" !important; font-family: FontAwesome !important; }
.fa-star-half-o::before, .fa-star-half-empty::before { content: "\f123" !important; font-family: FontAwesome !important; }
.fa-trash::before, .fa-trash-o::before { content: "\f014" !important; font-family: FontAwesome !important; }
.fa-edit::before, .fa-pencil::before, .fa-pencil-square-o::before { content: "\f040" !important; font-family: FontAwesome !important; }
.fa-cog::before, .fa-gear::before { content: "\f013" !important; font-family: FontAwesome !important; }
.fa-spinner::before { content: "\f110" !important; font-family: FontAwesome !important; }
.fa-circle-o-notch::before { content: "\f1ce" !important; font-family: FontAwesome !important; }
.fa-refresh::before { content: "\f021" !important; font-family: FontAwesome !important; }
.fa-bars-staggered::before, .fa-align-justify::before { content: "\f039" !important; font-family: FontAwesome !important; }
.fa-home::before { content: "\f015" !important; font-family: FontAwesome !important; }
.fa-truck::before { content: "\f0d1" !important; font-family: FontAwesome !important; }
.fa-credit-card::before { content: "\f09d" !important; font-family: FontAwesome !important; }
.fa-shield::before { content: "\f132" !important; font-family: FontAwesome !important; }
.fa-tag::before { content: "\f02b" !important; font-family: FontAwesome !important; }
.fa-tags::before { content: "\f02c" !important; font-family: FontAwesome !important; }
.fa-percent::before { content: "\f295" !important; font-family: FontAwesome !important; }
.fa-share::before, .fa-share-alt::before { content: "\f1e0" !important; font-family: FontAwesome !important; }
.fa-print::before { content: "\f02f" !important; font-family: FontAwesome !important; }
.fa-download::before { content: "\f019" !important; font-family: FontAwesome !important; }
.fa-external-link::before { content: "\f08e" !important; font-family: FontAwesome !important; }
.fa-bookmark::before, .fa-bookmark-o::before { content: "\f02e" !important; font-family: FontAwesome !important; }
.fa-comment::before, .fa-comment-o::before { content: "\f0e5" !important; font-family: FontAwesome !important; }
.fa-comments::before, .fa-comments-o::before { content: "\f0e6" !important; font-family: FontAwesome !important; }
.fa-thumbs-up::before, .fa-thumbs-o-up::before { content: "\f164" !important; font-family: FontAwesome !important; }
.fa-thumbs-down::before, .fa-thumbs-o-down::before { content: "\f165" !important; font-family: FontAwesome !important; }
.fa-cube::before { content: "\f1b2" !important; font-family: FontAwesome !important; }
.fa-cubes::before { content: "\f1b3" !important; font-family: FontAwesome !important; }
.fa-wrench::before { content: "\f0ad" !important; font-family: FontAwesome !important; }
.fa-fire::before { content: "\f06d" !important; font-family: FontAwesome !important; }
.fa-bolt::before { content: "\f0e7" !important; font-family: FontAwesome !important; }

/* ============================================================
   FONT AWESOME @font-face — ABSOLUTE URL fallback
   (in case preload CSS doesn't load OR has CORS issues)
   Use absolute URL so path is correct regardless of CSS file location.
   ============================================================ */
@font-face {
  font-family: "FontAwesome";
  src: url("/themes/warehouse/assets/css/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"),
       url("/themes/warehouse/assets/css/font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ============================================================
   GLOBAL — touch-friendly, no horizontal overflow
   ============================================================ */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
}
img, video, iframe, embed, object {
  max-width: 100% !important;
  height: auto;
}

/* ============================================================
   CLS PREVENTION — reserve space for images without explicit dimensions
   Targets CMS images, banners, hero blocks where Smarty doesn't emit width/height
   ============================================================ */
img[src*="/img/cms/"]:not([width]):not([height]),
img[src*="/img/p/"]:not([width]):not([height]),
.iqitelementor-block img:not([width]):not([height]),
.elementor-image img:not([width]):not([height]),
.elementor-widget-image img:not([width]):not([height]),
.banner img:not([width]):not([height]) {
  aspect-ratio: 16 / 9;
  object-fit: contain;
  background: rgba(0,0,0,0.02);
}
/* Hero banners typically wider */
.rc-hero img:not([width]):not([height]),
.layerslider img:not([width]):not([height]),
.banner-home img:not([width]):not([height]) {
  aspect-ratio: 21 / 9;
}
/* Product card images square-ish */
.product-miniature img:not([width]):not([height]),
.thumbnail-container img:not([width]):not([height]) {
  aspect-ratio: 1 / 1;
}

/* ============================================================
   ACCESSIBILITY — restore focus indicator (WCAG 2.4.7)
   Theme suppressed all focus rings. We restore via :focus-visible
   so mouse users don't see ring but keyboard users do.
   ============================================================ */
*:focus-visible {
  outline: 2px solid #1d4ed8 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px rgba(29,78,216,0.12) !important;
  border-radius: 3px !important;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible,
.btn:focus-visible {
  outline: 2px solid #1d4ed8 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px rgba(29,78,216,0.12) !important;
}
/* Skip link visible on focus */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 99999;
  background: #1d4ed8;
  color: #fff;
  padding: 12px 20px;
  border-radius: 0 0 6px 0;
  text-decoration: none;
  font-weight: 600;
}

/* ============================================================
   HERO + CAROUSEL pagination dots — minimum 44px touch target (WCAG 2.5.5)
   Visible dot stays small (8px), but invisible padding extends hit area.
   ============================================================ */
.rc-hero-dot,
.swiper-pagination-bullet,
.layerslider-pagination .ls-bullet,
[class*="hero"] [class*="dot"],
[class*="carousel"] [data-slide-to],
.tablist [role="tab"] {
  position: relative;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  background-clip: content-box !important;
  cursor: pointer;
}
.rc-hero-dot::after,
.swiper-pagination-bullet::after,
.layerslider-pagination .ls-bullet::after,
[class*="hero"] [class*="dot"]::after,
[class*="carousel"] [data-slide-to]::after,
.tablist [role="tab"]::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.35);
  transition: background 0.2s ease, transform 0.2s ease;
}
.rc-hero-dot[aria-current="true"]::after,
.swiper-pagination-bullet-active::after,
.layerslider-pagination .ls-bullet.ls-bullet-active::after,
[role="tab"][aria-selected="true"]::after {
  background: #d11326;
  transform: translate(-50%, -50%) scale(1.3);
}
.skip-link:focus {
  left: 0;
}

@media (max-width: 991px) {
  /* Touch targets minimum 44x44 (WCAG / iOS HIG) */
  a, button, [role="button"], .btn, input[type="submit"], input[type="button"] {
    min-height: 44px;
  }
  button, .btn {
    min-width: 44px;
  }

  /* ============================================================
     1. HEADER MOBILE — logo + iconos uniformes
     ============================================================ */
  #mobile-header .col-mobile-logo img.logo,
  #mobile-header .col-mobile-logo img {
    max-height: 50px !important;
    max-width: 160px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }
  #mobile-header .col-mobile-logo,
  #mobile-header .col-mobile-logo a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 50px !important;
  }
  #mobile-header .col-mobile-btn .fa,
  #mobile-header .col-mobile-btn i.fa,
  #mobile-header .col-mobile-btn i[class^="fa-"],
  #mobile-header .col-mobile-btn i[class*=" fa-"] {
    font-size: 22px !important;
    line-height: 22px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    color: #1d1d1b !important;
  }
  #mobile-header .col-mobile-btn {
    min-height: 50px !important;
    min-width: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #mobile-header .col-mobile-btn .m-nav-btn,
  #mobile-header .col-mobile-btn > a,
  #mobile-header .col-mobile-btn > div > a {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: #1d1d1b !important;
    padding: 4px 8px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
  /* Hide text labels in header (keep cart count visible) */
  #mobile-header .col-mobile-btn .m-nav-btn > span:not(.cart-products-count):not(.cart-products-count-btn),
  #mobile-header .col-mobile-btn > a > span:not(.cart-products-count):not(.cart-products-count-btn),
  #mobile-header .col-mobile-btn > div > a > span:not(.cart-products-count):not(.cart-products-count-btn) {
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  /* Cart badge */
  #mobile-header .col-mobile-btn-cart .cart-products-count,
  #mobile-header .col-mobile-btn-cart .cart-products-count-btn {
    font-size: 10px !important;
    line-height: 1 !important;
    color: #fff !important;
    height: 16px !important;
    overflow: visible !important;
    position: absolute !important;
    top: 4px !important;
    right: 4px !important;
    background: #d11326 !important;
    min-width: 16px !important;
    border-radius: 8px !important;
    padding: 0 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    border: 1.5px solid #fff !important;
  }

  /* ============================================================
     2. MOBILE MENU DRAWER — TODO TEXTO BLANCO
     ============================================================ */
  #_mobile_iqitmegamenu-mobile,
  #iqitmegamenu-mobile,
  #_mobile_iqitmegamenu-mobile *,
  #iqitmegamenu-mobile *,
  .mobile-menu__tab,
  .mobile-menu__tab *,
  .mobile-menu__link,
  .mobile-menu__title,
  .js-mobile-menu__tab-title,
  .mobile-menu__submenu,
  .mobile-menu__submenu *,
  .mobile-menu__row,
  .mobile-menu__row *,
  .mobile-menu__column,
  .mobile-menu__column *,
  .mobile-menu__links-list,
  .mobile-menu__links-list-li,
  .mobile-menu__links-list-li * {
    color: #ffffff !important;
  }
  .mobile-menu__tab .fa.expand-icon,
  .mobile-menu__arrow,
  .mobile-menu__back-btn .fa {
    color: rgba(255,255,255,0.7) !important;
  }

  /* link width 100% (no 70%) */
  html body .mobile-menu .mobile-menu__link,
  html body #iqitmegamenu-mobile .mobile-menu__link,
  html body .mobile-menu__tab .mobile-menu__link {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Tienda align-left + Servicios + Contacto */
  html body .mobile-menu__tab.mobile-menu__tab--id-6 > a.mobile-menu__link,
  html body .mobile-menu__tab.mobile-menu__tab--id-6 > .mobile-menu__link,
  html body .mobile-menu__tab.mobile-menu__tab--has-submenu > a,
  html body .mobile-menu__tab.mobile-menu__tab--has-submenu > .mobile-menu__link,
  html body .mobile-menu__tab > .js-mobile-menu__link--has-submenu {
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 16px !important;
  }
  .mobile-menu__tab.mobile-menu__tab--has-submenu {
    align-items: stretch !important;
  }

  /* Contacto envelope icon */
  html body .mobile-menu__tab.mobile-menu__tab--id-18 > a.mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-18 > a::before {
    content: "" !important;
    display: inline-block !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
    background-color: rgba(29,78,216,0.12) !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/><polyline points='22,6 12,13 2,6'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 16px !important;
    border: 1px solid rgba(29,78,216,0.2) !important;
    flex-shrink: 0 !important;
    margin-right: 12px !important;
    vertical-align: middle !important;
  }
  /* Tienda cart icon */
  html body .mobile-menu__tab.mobile-menu__tab--id-6 > a.mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-6 > a::before {
    content: "" !important;
    display: inline-block !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
    background-color: rgba(29,78,216,0.12) !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><circle cx='9' cy='21' r='1'/><circle cx='20' cy='21' r='1'/><path d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 16px !important;
    border: 1px solid rgba(29,78,216,0.2) !important;
    flex-shrink: 0 !important;
    margin-right: 12px !important;
    vertical-align: middle !important;
  }

  /* Tienda submenu 3-col stacked */
  html body .mobile-menu__row {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow-x: hidden !important;
  }
  html body .mobile-menu__column {
    width: 100% !important;
    max-width: 100% !important;
    border-top: 1px solid rgba(255,255,255,0.08) !important;
    padding: 12px 0 4px 0 !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
  }
  html body .mobile-menu__column:first-child {
    border-top: 0 !important;
    padding-top: 4px !important;
  }
  html body .mobile-menu__column .mobile-menu__links-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  html body .mobile-menu__column .mobile-menu__links-list-li {
    list-style: none !important;
    padding: 0 !important;
    margin: 2px 0 !important;
  }
  html body .mobile-menu__column .mobile-menu__links-list-li > a {
    color: #ffffff !important;
    padding: 12px 16px 12px 28px !important;
    display: block !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-radius: 6px !important;
    transition: background 0.15s !important;
    width: 100% !important;
    min-height: 44px !important;
  }
  html body .mobile-menu__column .mobile-menu__links-list-li > a:hover,
  html body .mobile-menu__column .mobile-menu__links-list-li > a:active {
    background: rgba(255,255,255,0.06) !important;
  }
  html body .mobile-menu__submenu {
    background: transparent !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-shadow: none !important;
    padding: 8px 12px !important;
  }

  /* Elementor overflow protection — exclude sliders */
  html body .elementor-element:not(.elementor-widget-image-carousel):not([class*="slider"]):not([class*="swiper"]):not([class*="layerslider"]):not([class*="gallery"]) {
    max-width: 100vw !important;
  }

  /* ============================================================
     HERO + CONTENT MOBILE — prevent overflow
     ============================================================ */
  .rc-hero, .rc-hero * {
    max-width: 100% !important;
  }
  .rc-hero img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  /* Clip hero/slider sections at viewport edge to prevent prev/next spill on mobile */
  .elementor-section[class*="slider-section"],
  .elementor-widget[class*="slider-widget"],
  .elementor-image-carousel.swiper-container,
  .layerslider-wrapper,
  .ls-wrapper,
  .rc-hero-container {
    overflow: hidden !important;
    max-width: 100% !important;
    width: 100% !important;
  }
  /* Swiper: ensure wrapper doesn't exceed viewport */
  .elementor-image-carousel.swiper-container .swiper-wrapper {
    max-width: 100vw !important;
  }

  /* ============================================================
     PRODUCT GRID — 2 columns mobile (better than 1)
     ============================================================ */
  .products .product-miniature,
  .featured-products .product-miniature,
  #products .product-miniature {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  @media (max-width: 480px) {
    .products .product-miniature,
    .featured-products .product-miniature,
    #products .product-miniature {
      flex: 0 0 100% !important;
      max-width: 100% !important;
    }
  }

  /* ============================================================
     COOKIE BANNER — prevent it eating viewport
     ============================================================ */
  #cookieplus-popup,
  .cookieplus-popup,
  [id*="cookieplus"],
  .cookies-banner {
    max-height: 50vh !important;
    overflow-y: auto !important;
  }

  /* ============================================================
     QTY INPUT mobile — restore visibility on product page
     (theme bundle hides with `display:none !important` on <768px)
     ============================================================ */
  body#product .product-add-to-cart .qty,
  body#product .product-quantity .qty,
  body#product .product-add-to-cart .input-group.bootstrap-touchspin,
  body#product .product-quantity .input-group.bootstrap-touchspin,
  body#product .product-add-to-cart .input-group-btn-vertical,
  body#product .product-quantity .input-group-btn-vertical,
  body#product .product-add-to-cart .col-add-qty,
  body#product .product-quantity .col-add-qty {
    display: flex !important;
    width: auto !important;
    height: auto !important;
    align-items: center !important;
  }
  body#product .product-add-to-cart .input-group.bootstrap-touchspin {
    width: 100px !important;
    margin-right: 12px !important;
  }
  body#product .product-add-to-cart .input-group.bootstrap-touchspin input {
    width: 40px !important;
    height: 44px !important;
    text-align: center !important;
    border: 1px solid #d1d5db !important;
    border-radius: 0 !important;
    padding: 0 4px !important;
  }
  body#product .product-add-to-cart .bootstrap-touchspin-up,
  body#product .product-add-to-cart .bootstrap-touchspin-down {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 30px !important;
    height: 44px !important;
    background: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
    color: #1f2937 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
  }
  body#product .product-add-to-cart .bootstrap-touchspin-up {
    border-radius: 0 4px 4px 0 !important;
  }
  body#product .product-add-to-cart .bootstrap-touchspin-down {
    border-radius: 4px 0 0 4px !important;
  }
  /* Layout container: qty + add-to-cart side by side */
  body#product .product-add-to-cart .input-group-add-cart,
  body#product .product-add-to-cart .product-add-cart {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
  }

  /* ============================================================
     PRODUCT CARD — fix add-to-cart button overflow on 2-col mobile
     ============================================================ */
  .product-miniature .mini-action-row,
  .product-miniature .product-add-cart,
  .product-miniature .input-group-add-cart {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    width: 100% !important;
    align-items: center !important;
  }
  .product-miniature .btn.add-to-cart,
  .product-miniature .mini-cart-btn,
  .product-miniature .btn-product-list.add-to-cart {
    font-size: 11px !important;
    padding: 8px 4px !important;
    white-space: normal !important;
    line-height: 1.2 !important;
    word-break: keep-all !important;
    text-align: center !important;
    flex: 1 1 100% !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
  /* Related products carousel buttons: prevent text clipping */
  .product-accessories .product-miniature .btn.add-to-cart,
  .related-products .product-miniature .btn.add-to-cart,
  .js-product-accessories .btn.add-to-cart,
  .swiper-slide .btn.add-to-cart {
    font-size: 10px !important;
    padding: 6px 2px !important;
    letter-spacing: -0.2px !important;
  }
  /* Hide share button on mobile (frees space for AÑADIR button) */
  html body .product-miniature .btn-mini-share,
  html body .product-miniature button.btn-mini-share,
  html body .mini-action-row .btn-mini-share {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  /* Force mini-action-row + add-to-cart to use full card width */
  .product-miniature .mini-action-row {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 8px !important;
  }
  .product-miniature .btn.add-to-cart,
  .product-miniature .mini-cart-btn {
    width: 100% !important;
    min-width: 100% !important;
    flex: 1 1 100% !important;
    border-radius: 24px !important;
  }
  /* On very narrow viewports (<360px) shrink button text */
  @media (max-width: 360px) {
    .product-miniature .btn.add-to-cart,
    .product-miniature .mini-cart-btn {
      font-size: 10px !important;
      padding: 8px 4px !important;
    }
    /* Header: shrink logo + icons to keep all in one row at 320 */
    #mobile-header .col-mobile-logo img.logo,
    #mobile-header .col-mobile-logo img {
      max-width: 100px !important;
      max-height: 40px !important;
    }
    #mobile-header .col-mobile-btn .fa,
    #mobile-header .col-mobile-btn i.fa {
      font-size: 18px !important;
    }
    #mobile-header .col-mobile-btn,
    #mobile-header .col-mobile-btn .m-nav-btn,
    #mobile-header .col-mobile-btn > a {
      padding: 4px 4px !important;
      min-width: 36px !important;
    }
    #mobile-header .row {
      flex-wrap: nowrap !important;
    }
  }
  /* Product name: truncate to 2 lines max */
  .product-miniature .product-title,
  .product-miniature h3,
  .product-miniature .h3 {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-height: 2.6em !important;
    line-height: 1.3 !important;
    font-size: 13px !important;
  }
}

/* Tablet refinement */
@media (min-width: 576px) and (max-width: 991px) {
  #mobile-header .col-mobile-logo img.logo,
  #mobile-header .col-mobile-logo img {
    max-width: 180px !important;
    max-height: 54px !important;
  }
}

/* ============================================================
   FOOTER MOBILE: una sección por salto de línea (stacked)
   Aplica en TODAS las pantallas mobile + tablet
   ============================================================ */
@media (max-width: 991px) {
  footer .footer-container .row,
  footer #footer-container .row,
  .footer-container .row,
  footer .container > .row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    margin: 0 !important;
    gap: 0 !important;
  }
  footer .footer-container .col,
  footer #footer-container .col,
  footer .footer-container [class*="col-"],
  footer #footer-container [class*="col-"],
  .footer-container [class*="col-"],
  footer .container > .row > [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    text-align: left !important;
    padding: 16px 16px !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  }
  footer .footer-container [class*="col-"]:last-child,
  footer #footer-container [class*="col-"]:last-child {
    border-bottom: 0 !important;
  }
  footer .footer-container .block,
  footer .footer-container .block-content,
  footer .footer-container p,
  footer .footer-container .part,
  .footer-container .block,
  .footer-container .block-content,
  .footer-container p {
    text-align: left !important;
  }
  footer ul, footer ol,
  .footer-container ul, .footer-container ol {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }
  footer ul li, footer ol li,
  .footer-container ul li, .footer-container ol li {
    text-align: left !important;
    padding: 4px 0 !important;
    margin: 0 !important;
  }
  footer ul li a,
  footer ol li a,
  .footer-container a {
    text-align: left !important;
    display: inline-block !important;
    min-height: 36px;
    padding: 6px 0;
  }
  footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
  .footer-container h1, .footer-container h2, .footer-container h3,
  .footer-container h4, .footer-container h5, .footer-container h6,
  footer .block-title,
  footer .h4 {
    text-align: left !important;
    margin-bottom: 12px !important;
  }
  footer .footer-before .row > [class*="col-"],
  footer .footer-after .row > [class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    text-align: left !important;
    padding: 12px 16px !important;
  }
  footer .social-icons,
  footer .followus,
  footer [class*="social"] {
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 0 !important;
  }
  /* Maps embed: limit height, keep aspect */
  footer iframe, footer .map-container {
    max-height: 240px !important;
    width: 100% !important;
  }
  /* Payment icons row: scrollable horizontal */
  footer .footer-after,
  .footer-after,
  .payment-methods {
    text-align: left !important;
    padding-left: 16px !important;
  }
  footer .payment-list,
  .payment-list,
  .footer-after [class*="payment"] {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
  }
}

/* ============================================================
   COPYRIGHT row — single line, no 2-col split
   ============================================================ */
@media (max-width: 991px) {
  .copyright,
  .footer-copyright,
  footer .copyright-row {
    text-align: left !important;
    padding: 12px 16px !important;
    font-size: 12px !important;
  }
  .copyright > *,
  .footer-copyright > * {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
    margin: 4px 0 !important;
  }
}

/* ============================================================
   FOOTER MOBILE — COMPACT + LEFT-ALIGNED (estilo Uniclima)
   ============================================================ */
@media (max-width: 991px) {
  /* Reduce footer total height */
  #footer.js-footer {
    font-size: 13px !important;
  }
  /* Each accordion section: compact padding */
  #footer .footer-container .block,
  #footer .footer-container .block-toggle,
  #footer .footer-container [class*="block-iqit"] {
    padding: 14px 18px !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    text-align: left !important;
  }
  #footer .footer-container .block:last-child,
  #footer .footer-container .block-toggle:last-child {
    border-bottom: 0 !important;
  }
  /* Accordion title: small, uppercase, left-aligned */
  #footer .block-toggle .block-title,
  #footer .block-toggle h4,
  #footer .block-toggle .h4,
  #footer .block-toggle .block-title-iqit,
  #footer .footer-container h4,
  #footer .footer-container .h4 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    text-align: left !important;
    color: #ffffff !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }
  /* Accordion arrow: clean position right */
  #footer .block-toggle .block-title::after,
  #footer .block-toggle h4::after,
  #footer .block-toggle .h4::after,
  #footer .block-toggle [class*="title"] .fa,
  #footer .block-toggle .toggle-icon {
    float: none !important;
    margin-left: auto !important;
    font-size: 12px !important;
    color: rgba(255,255,255,0.5) !important;
  }
  /* Block content: when expanded, compact */
  #footer .block-content,
  #footer .block-toggle .block-content {
    padding: 12px 0 0 0 !important;
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  #footer .block-content ul,
  #footer .block-content ol {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }
  #footer .block-content li,
  #footer .block-content li a {
    padding: 6px 0 !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    min-height: 32px !important;
    text-align: left !important;
  }
  /* Hide Google Maps iframe in elementor section (huge on mobile) */
  iframe[src*="google.com/maps"],
  iframe[src*="maps.google"],
  .elementor-custom-embed iframe[src*="maps"],
  #footer iframe[src*="google.com/maps"],
  #footer iframe[src*="maps.google"],
  #footer .google-map,
  #footer [class*="google-map"] {
    max-height: 180px !important;
    margin: 8px 0 !important;
    border-radius: 8px !important;
    width: 100% !important;
  }
  /* Hide the elementor section that contains the map (frees ~350px) */
  .elementor-custom-embed:has(iframe[src*="maps"]) {
    max-height: 200px !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    margin: 16px !important;
  }
  /* Contact block: icons + text inline */
  #footer .block-iqitcontactpage .contact-rich,
  #footer .contact-rich {
    text-align: left !important;
  }
  #footer .contact-rich .data,
  #footer .contact-rich p {
    margin: 6px 0 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
  #footer .contact-rich .icon,
  #footer .contact-rich .fa {
    margin-right: 8px !important;
    color: rgba(255,255,255,0.7) !important;
  }

  /* Copyright + payment row: compact, left-aligned, single column */
  #footer-copyrights,
  ._footer-copyrights-1 {
    padding: 14px 0 !important;
    text-align: left !important;
  }
  #footer-copyrights .container,
  ._footer-copyrights-1 .container {
    padding: 0 18px !important;
  }
  #footer-copyrights .row {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 0 !important;
  }
  #footer-copyrights [class*="copyright"],
  #footer-copyrights .copyright-img,
  #footer-copyrights .copyright-txt,
  ._footer-copyrights-1 [class*="copyright"] {
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
    padding: 0 !important;
    flex: 0 0 100% !important;
  }
  #footer-copyrights .copyright-img {
    text-align: left !important;
  }
  #footer-copyrights .copyright-img img {
    max-height: 28px !important;
    width: auto !important;
    margin: 0 !important;
  }
  #footer-copyrights .copyright-txt span,
  #footer-copyrights .copyright-txt {
    font-size: 11px !important;
    line-height: 1.4 !important;
    text-align: left !important;
    color: rgba(255,255,255,0.5) !important;
    display: block !important;
  }
  /* Cancel push/pull bootstrap classes that flip order on mobile */
  #footer-copyrights .push-sm-6,
  #footer-copyrights .pull-sm-6 {
    left: 0 !important;
    right: 0 !important;
  }
  /* Block separator dividers cleaner */
  #footer hr,
  #footer .divider {
    margin: 8px 0 !important;
    border-color: rgba(255,255,255,0.08) !important;
  }
}

/* ============================================================
   REMOVE GRAY BACKGROUND from FAQ + Servicios sections
   (originally #f5f5f5 inline — override to transparent)
   ============================================================ */
.rc-faq,
.rc-servicios,
.rc-faq.rc-faq,
div.rc-faq,
div.rc-servicios {
  background: transparent !important;
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ============================================================
   FAQ — REDESIGN estético + responsive
   ============================================================ */
.rc-faq {
  padding: 32px 0 !important;
}
.rc-faq h2,
.rc-faq #faq-title-custom {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: #1a2b4a !important;
  text-align: center !important;
  margin: 0 0 28px 0 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.2 !important;
}
.rc-faq .faq-container {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 14px !important;
  align-items: start !important;
}
.rc-faq .faq-item {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.03) !important;
  overflow: hidden !important;
  transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.2s ease !important;
}
.rc-faq .faq-item:hover {
  box-shadow: 0 4px 16px rgba(29,78,216,0.10), 0 2px 6px rgba(29,78,216,0.06) !important;
  border-color: rgba(29,78,216,0.22) !important;
  transform: translateY(-1px) !important;
}
.rc-faq .faq-item.active,
.rc-faq .faq-item.open,
.rc-faq .faq-item[aria-expanded="true"] {
  border-color: rgba(29,78,216,0.30) !important;
  box-shadow: 0 6px 20px rgba(29,78,216,0.12), 0 2px 6px rgba(29,78,216,0.08) !important;
  background: linear-gradient(180deg, #f8faff 0%, #ffffff 100%) !important;
}
.rc-faq .faq-question {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 18px 20px !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1a2b4a !important;
  letter-spacing: -0.01em !important;
  line-height: 1.4 !important;
  user-select: none !important;
  background: transparent !important;
  border: none !important;
  width: 100% !important;
  text-align: left !important;
  transition: color 0.2s ease !important;
}
.rc-faq .faq-question:hover {
  color: #1d4ed8 !important;
}
.rc-faq .faq-question span:first-child {
  flex: 1 !important;
  min-width: 0 !important;
  white-space: normal !important;
  word-wrap: break-word !important;
}
.rc-faq .faq-arrow {
  font-size: 11px !important;
  color: #1d4ed8 !important;
  flex-shrink: 0 !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: rgba(29,78,216,0.08) !important;
  border: none !important;
}
.rc-faq .faq-item.active .faq-arrow,
.rc-faq .faq-item.open .faq-arrow,
.rc-faq .faq-item[aria-expanded="true"] .faq-arrow {
  transform: rotate(90deg) !important;
  background: rgba(29,78,216,0.18) !important;
}
.rc-faq .faq-answer {
  padding: 0 20px 20px 20px !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  color: #4b5563 !important;
  border-top: 1px solid rgba(0,0,0,0.04) !important;
  margin-top: -1px !important;
  padding-top: 16px !important;
  animation: faqSlideDown 0.3s ease !important;
}
.rc-faq .faq-answer p,
.rc-faq .faq-answer * {
  color: #4b5563 !important;
  margin: 0 0 10px 0 !important;
  background: transparent !important;
}
.rc-faq .faq-answer p:last-child,
.rc-faq .faq-answer *:last-child {
  margin-bottom: 0 !important;
}
@keyframes faqSlideDown {
  from { opacity: 0; transform: translateY(-4px); max-height: 0; }
  to { opacity: 1; transform: translateY(0); max-height: 600px; }
}

/* FAQ — Mobile single column */
@media (max-width: 991px) {
  .rc-faq {
    padding: 24px 0 !important;
  }
  .rc-faq h2,
  .rc-faq #faq-title-custom {
    font-size: 22px !important;
    margin: 0 0 20px 0 !important;
    padding: 0 16px !important;
  }
  .rc-faq .faq-container {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 0 12px !important;
    max-width: 100% !important;
  }
  .rc-faq .faq-question {
    padding: 16px 14px !important;
    font-size: 14px !important;
  }
  .rc-faq .faq-arrow {
    width: 24px !important;
    height: 24px !important;
    font-size: 10px !important;
  }
  .rc-faq .faq-answer {
    padding: 14px 14px 16px 14px !important;
    font-size: 13px !important;
  }
}

/* ============================================================
   SERVICIOS section — also remove gray + improve cards
   ============================================================ */
.rc-servicios {
  padding: 32px 0 !important;
}
.rc-servicios .service-card,
.rc-servicios [class*="service"] > div,
.rc-servicios .col {
  border-radius: 14px !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.03) !important;
  transition: box-shadow 0.25s ease, transform 0.2s ease, border-color 0.25s ease !important;
  background: #ffffff !important;
}
.rc-servicios .service-card:hover,
.rc-servicios [class*="service"] > div:hover {
  box-shadow: 0 8px 24px rgba(29,78,216,0.10), 0 2px 6px rgba(29,78,216,0.06) !important;
  border-color: rgba(29,78,216,0.20) !important;
  transform: translateY(-2px) !important;
}
@media (max-width: 991px) {
  .rc-servicios {
    padding: 20px 0 !important;
  }
}

/* ============================================================
   RC FIX-13 2026-04-20: Drawer close X + back btn + submenu panel polish
   ============================================================ */
@media (max-width: 991.98px) {
  /* Close X: visible on dark drawer bg, 44x44 tap target, above panels */
  html body #iqitmegamenu-mobile .js-mobile-menu__close,
  html body .mobile-menu .mobile-menu__close {
    color: #ffffff !important;
    background: rgba(255,255,255,0.08) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    border-radius: 50% !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    z-index: 50 !important;
    cursor: pointer !important;
    opacity: 1 !important;
  }
  html body #iqitmegamenu-mobile .js-mobile-menu__close:active,
  html body #iqitmegamenu-mobile .js-mobile-menu__close:focus {
    background: rgba(255,255,255,0.18) !important;
    outline: 2px solid #60a5fa !important;
    outline-offset: 2px !important;
  }
  html body #iqitmegamenu-mobile .js-mobile-menu__close .fa,
  html body #iqitmegamenu-mobile .js-mobile-menu__close .fa-times {
    color: #ffffff !important;
    font-size: 18px !important;
    line-height: 1 !important;
    opacity: 1 !important;
  }

  /* Back button: only visible when a submenu is active; 44px tap target */
  html body #iqitmegamenu-mobile .js-mobile-menu__back-btn {
    display: none !important;
    align-items: center !important;
    color: #ffffff !important;
    background: transparent !important;
    border: 0 !important;
    min-height: 44px !important;
    padding: 6px 10px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
  }
  html body #iqitmegamenu-mobile .js-mobile-menu__header.mobile-menu__header--active .js-mobile-menu__back-btn,
  html body #iqitmegamenu-mobile.mobile-menu--active .js-mobile-menu__back-btn {
    display: inline-flex !important;
  }
  html body #iqitmegamenu-mobile .js-mobile-menu__back-btn .fa,
  html body #iqitmegamenu-mobile .js-mobile-menu__title {
    color: #ffffff !important;
  }

  /* Active submenu panel: override theme's white bg with dark drawer-matching bg.
     Leave positioning to theme's native CSS (absolute, top:0, w-100, h-100 on parent ul). */
  html body #iqitmegamenu-mobile .mobile-menu__submenu.mobile-menu__submenu--panel,
  html body #iqitmegamenu-mobile .js-mobile-menu__submenu {
    background: transparent !important;
  }
  html body #iqitmegamenu-mobile .mobile-menu__submenu.mobile-menu__submenu--active {
    background-color: #0b1326 !important;
    background-image: linear-gradient(180deg, #0b1326 0%, #071022 100%) !important;
    z-index: 1050 !important;
  }

  /* Submenu items: proper tap targets + white text + subtle row spacing */
  html body #iqitmegamenu-mobile .mobile-menu__submenu .mobile-menu__links-list-li {
    min-height: 44px !important;
    list-style: none !important;
  }
  html body #iqitmegamenu-mobile .mobile-menu__submenu a,
  html body #iqitmegamenu-mobile .mobile-menu__submenu .mobile-menu__links-list-li > a {
    color: #ffffff !important;
    display: block !important;
    padding: 12px 10px !important;
    min-height: 44px !important;
    border-radius: 8px !important;
  }
  html body #iqitmegamenu-mobile .mobile-menu__submenu a:hover,
  html body #iqitmegamenu-mobile .mobile-menu__submenu a:active {
    background: rgba(255,255,255,0.08) !important;
    text-decoration: none !important;
  }
}

/* RC FIX-20 REVERTED 2026-04-20: was breaking /tienda product miniatures with
   default placeholder (visibility:hidden cascaded to product images too).
   Left PS default "Imagen no disponible" placeholder as-is. */

/* ============================================================
   RC FIX-28 2026-04-20: Hero CTA no longer hidden by pagination dots
   — Move .rc-hero-nav dots OUT of absolute overlap with CTA button
   ============================================================ */
.rc-hero {
  position: relative !important;
  padding-bottom: 70px !important; /* space for dots BELOW the card */
}
.rc-hero-nav {
  position: absolute !important;
  bottom: 10px !important;
  top: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  display: inline-flex !important;
  gap: 4px !important;
  z-index: 2 !important;
}
.rc-hero-cta {
  position: relative !important;
  z-index: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 12px 24px !important;
  background: #dc2626 !important;
  color: #ffffff !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background 0.2s ease, transform 0.15s ease !important;
  min-height: 48px !important;
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25) !important;
}
.rc-hero-cta:hover,
.rc-hero-cta:focus-visible {
  background: #b91c1c !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
  color: #ffffff !important;
}

/* Hero typography consistency — match sans-serif site font */
.rc-hero-title,
.rc-hero-price,
.rc-hero-subtitle,
.rc-hero-badge {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Google verification badge on review avatars — stop overlapping the name */
.review-verification-badge,
[class*="review"] [class*="google"],
.review-avatar img[alt*="Google"],
.review-author > svg.google-icon {
  position: absolute !important;
  right: 2px !important;
  bottom: 2px !important;
  top: auto !important;
  left: auto !important;
  width: 18px !important;
  height: 18px !important;
  z-index: 2 !important;
}
.review-author,
[class*="review-author"] {
  position: relative !important;
  display: block !important;
  text-align: center !important;
  margin-top: 6px !important;
}

/* ============================================================
   RC FIX-29 2026-04-20: Product page polish mobile
   ============================================================ */
@media (max-width: 991.98px) {
  /* Product thumbnails: horizontal row below main image (no vertical column) */
  body#product .product-images,
  body#product .js-qv-product-images,
  body#product .product-images.js-qv-product-images {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: flex-start !important;
    margin-top: 10px !important;
    padding: 0 !important;
    width: 100% !important;
  }
  body#product .product-images .thumb-container,
  body#product .js-qv-product-images .thumb,
  body#product .product-images-layout .thumb {
    flex: 0 0 64px !important;
    width: 64px !important;
    height: 64px !important;
    margin: 0 !important;
  }
  body#product .product-images img.thumb,
  body#product .product-images .thumb-container img {
    width: 64px !important;
    height: 64px !important;
    object-fit: contain !important;
    border-radius: 6px !important;
  }

  /* Product title: smaller on mobile, better breaking */
  body#product h1.page-title,
  body#product h1.product-title,
  body#product main h1 {
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    hyphens: auto !important;
  }
}

/* ============================================================
   RC FIX-30 2026-04-20: Brand badges on home — remove faded/opaque look
   ============================================================ */
.brand-box,
.brand-item,
[class*="brand-list"] .brand,
.manufacturers .manufacturer-item {
  opacity: 1 !important;
  filter: none !important;
}
.brand-box img,
.brand-item img,
[class*="brand-list"] img,
.manufacturers img {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

/* ============================================================
   RC FIX-23 2026-04-20: Lighthouse color-contrast — text-muted ≥4.5:1
   ============================================================ */
html body .text-muted,
html body .product-reference.text-muted,
html body .product-brand.text-muted,
html body .product-description-short.text-muted,
html body .product-category-name.text-muted,
html body small.text-muted {
  /* gray-600 #4b5563 = 7.56:1 on white (AAA) */
  color: #4b5563 !important;
}
html body .product-reference,
html body .product-reference.text-muted {
  /* SKU references need high contrast */
  color: #374151 !important; /* gray-700 = 10.3:1 on white */
}
/* Dark-bg contexts (drawer/footer dark): inherit white */
html body .drawer .text-muted,
html body footer.dark .text-muted,
html body [class*="dark"] .text-muted,
html body .bg-dark .text-muted {
  color: #d1d5db !important; /* gray-300 on dark */
}
/* Sort-by / current-sort controls */
html body .sort-by-row .sort-by,
html body .sort-by-row .current-sort,
html body .sort-by-btn {
  color: #374151 !important;
}
/* Placeholder text */
html body ::placeholder,
html body ::-webkit-input-placeholder {
  color: #6b7280 !important; /* gray-500 = 4.83:1 */
  opacity: 1 !important;
}
/* Secondary buttons */
html body .btn-secondary,
html body .btn-outline-secondary {
  color: #1f2937 !important; /* gray-800 */
}
html body .btn-secondary:not(:hover):not(:active) {
  background-color: #f3f4f6 !important;
  border-color: #d1d5db !important;
}

/* ============================================================
   RC FIX-27 2026-04-20: Final Lighthouse color-contrast fixes
   Darken reds to meet AA 4.5:1 on white/dark backgrounds.
   ============================================================ */
/* #d8412d → #b02a18 (~5.1:1 on white) */
html body .sc-item-price,
html body .product-price:not(.regular-price),
html body [class*="price-discount"],
html body .price.price-red {
  color: #b02a18 !important;
}
/* Hero badge: white on red #ed2711 (4.28:1) → darken bg to #b81d08 (~5.6:1) */
html body .rc-hero-badge,
html body [class*="hero-badge"] {
  background-color: #b81d08 !important;
  color: #ffffff !important;
}
/* .ti-read-more-active #808080 → #595959 (7.0:1) */
html body .ti-read-more-active,
html body .ti-read-more,
html body [class*="read-more-active"] {
  color: #595959 !important;
}
/* Any remaining gray-500 text used as body text — boost */
html body [style*="color: #808080"],
html body [style*="color:#808080"],
html body [style*="color: gray"] {
  color: #595959 !important;
}

/* ============================================================
   RC FIX-29 v2 2026-04-20: Thumbnails row mobile (specificity boost)
   Root cause: inline <style> (19KB) injects rule
     `html body#product #main .js-qv-mask #product-images-thumbs {max-width:100px!important}`
   — uses 3 IDs (#product, #main, #product-images-thumbs) + 1 class.
   Fix: match the exact chain and override with 3-ID selector AFTER + column layout.
   Also chain .images-container.js-images-container for extra specificity on parent rule.
   ============================================================ */
@media (max-width: 767px) {
  html body#product #main .images-container.js-images-container .js-qv-mask,
  html body#product #main .images-container.js-images-container .js-qv-mask.mask {
    width: 100% !important;
    max-width: 100% !important;
    flex-shrink: 1 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    order: 2 !important;
  }
  html body#product #main .js-qv-mask.mask #product-images-thumbs.swiper-container,
  html body#product #main .js-qv-mask.mask #product-images-thumbs.product-images,
  html body#product #main .images-container.js-images-container #product-images-thumbs.swiper-container {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
  html body#product #main .js-qv-mask.mask #product-images-thumbs.swiper-container .swiper-wrapper,
  html body#product #main .images-container.js-images-container #product-images-thumbs.swiper-container .swiper-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    gap: 8px !important;
    width: max-content !important;
    max-width: none !important;
    min-width: 100% !important;
    transform: none !important;
    height: auto !important;
    padding: 8px 0 !important;
  }
  html body#product #main .js-qv-mask.mask #product-images-thumbs.swiper-container .swiper-slide,
  html body#product #main .images-container.js-images-container #product-images-thumbs.swiper-container .swiper-slide {
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
    height: 72px !important;
    min-height: 72px !important;
    flex: 0 0 72px !important;
    margin: 0 !important;
  }
  html body#product #main .js-qv-mask.mask #product-images-thumbs.swiper-container .thumb-container,
  html body#product #main .images-container.js-images-container #product-images-thumbs.swiper-container .thumb-container {
    width: 72px !important;
    height: 72px !important;
    max-width: 72px !important;
    max-height: 72px !important;
  }
  html body#product #main .js-qv-mask.mask #product-images-thumbs.swiper-container .swiper-slide img,
  html body#product #main .js-qv-mask.mask #product-images-thumbs.swiper-container img.thumb,
  html body#product #main .images-container.js-images-container #product-images-thumbs.swiper-container img {
    width: 72px !important;
    height: 72px !important;
    max-width: 72px !important;
    max-height: 72px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
  }
}

/* ============================================================
   RC FIX-31 2026-04-20: Tablet /tienda vertical explosion
   Root cause: .product-list-subcategories renders 56 subcategory tiles
   at 2 per row on tablet (col-md-6 = 50%) => 28 rows × 314px = 8785px,
   making docH = 14604px. Product grid was OK (already 2 cols via col-md-6).
   Fix: show 4 subcategory tiles per row on tablet (768-991) to halve height.
   ============================================================ */
@media (min-width: 768px) and (max-width: 991.98px) {
  html body#category .product-list-subcategories .row > [class*="col-"],
  html body.category .product-list-subcategories .row > [class*="col-"],
  html body#index .product-list-subcategories .row > [class*="col-"] {
    flex: 0 0 25% !important;
    max-width: 25% !important;
    width: 25% !important;
  }
  html body#category .product-list-subcategories .subcategory-image,
  html body.category .product-list-subcategories .subcategory-image {
    width: 100% !important;
    height: auto !important;
    max-height: 160px !important;
    aspect-ratio: 1 / 1 !important;
  }
  html body#category .product-list-subcategories .subcategory-image img,
  html body.category .product-list-subcategories .subcategory-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
  /* Product miniature grid — keep 3 per row on tablet (col-md-6 currently gives 2) */
  html body#category .products.products-grid > .js-product-miniature-wrapper,
  html body.category .products.products-grid > .js-product-miniature-wrapper {
    flex: 0 0 33.333% !important;
    max-width: 33.333% !important;
    width: 33.333% !important;
  }
}

/* ============================================================
   POLISH-6 — Card aspect ratio (MAYOR IMPACTO)
   Root cause: imagen 60x77px en card 247x373px = solo 16% ocupado
   Hace que las cards se vean "vacías"
   ============================================================ */
.product-miniature .thumbnail-container,
article.product-miniature .thumbnail-container {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  min-height: 140px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff;
  overflow: hidden;
}
.product-miniature .thumbnail-container img,
article.product-miniature .thumbnail-container img {
  max-width: 85% !important;
  max-height: 85% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}
.products-grid .js-product-miniature-wrapper,
.products .js-product-miniature-wrapper {
  margin-bottom: 12px !important;
}

/* ============================================================
   POLISH-5 — Carousel button text clipping
   Root cause: .product-accessories cards tienen clientWidth 73px
   pero scrollWidth 100px → "AÑADIR 54,00 €" se corta a "IR 68,"
   ============================================================ */
.product-accessories .product-miniature .btn.add-to-cart,
.product-accessories .product-miniature .btn-add-to-cart,
.swiper-slide .product-miniature .btn.add-to-cart,
.swiper-slide .product-miniature .btn-add-to-cart {
  font-size: 10px !important;
  padding: 6px 4px !important;
  letter-spacing: -0.2px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  min-width: 0 !important;
}
.product-accessories .product-miniature .btn-price-inline,
.swiper-slide .product-miniature .btn-price-inline {
  font-size: 11px !important;
  padding-left: 3px !important;
}
/* Mobile: agrandar toda la card del carousel para que el texto quepa */
@media (max-width: 767px) {
  .product-accessories .product-miniature .btn.add-to-cart,
  .swiper-slide .product-miniature .btn.add-to-cart {
    font-size: 11px !important;
    padding: 8px 6px !important;
  }
}

/* ============================================================
   POLISH-4 — Trustindex avatar G icon overlap
   Root cause: .ti-platform-icon (26x26) cubre 15x3px del avatar (40x40)
   Trustindex CDN stylesheet loads after ours; usa IMG[class] con mayor
   especificidad para ganar al preset "36-light-background".
   ============================================================ */
html body img.ti-platform-icon,
html body .ti-widget img.ti-platform-icon,
html body .ti-review-header img.ti-platform-icon {
  width: 16px !important;
  height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  bottom: -2px !important;
  right: -2px !important;
  border: 2px solid #fff !important;
  border-radius: 50% !important;
  background: #fff !important;
  padding: 1px !important;
  box-sizing: border-box !important;
}
html body .ti-widget .ti-profile-img,
html body .ti-review-header .ti-profile-img {
  position: relative !important;
}

/* ============================================================
   RC FIX-32 2026-04-20: CLS regression fix /tienda (era 0.24 → target <0.1)
   Diagnóstico real via trace CLSCulprits: los shifts NO vienen de
   thumbnails — vienen del MOBILE HEADER redimensionándose tras load.
   El <img class="logo"> tiene HTML attrs width=1308 height=497.
   El browser reserva (ancho_contenedor * 497/1308) ≈ 187px antes de
   que CSS aplique max-height:50px → al colapsar la altura, todo el
   layout de la página se desplaza hacia arriba ~12px → CLS 0.24.
   Estrategia:
   - Reservar altura fija del mobile-header y su .row desde primer paint
     para que el browser no use el aspect intrinsic del logo (1308/497).
   - Fijar aspect-ratio explícito del logo via CSS → browser respeta
     el slot reservado aún antes de aplicar max-height.
   - contain: layout en header aisla el pipeline de layout.
   - Bonus defensive: thumbnail-container también con contain: layout
     paint + aspect-ratio del img para aislar re-layouts de producto.
   ============================================================ */
/* --- Mobile header: altura estable pre-load para cortar CLS masivo
   ÁMBITO LIMITADO a body.category / body#category y body#index para NO
   afectar home (home usa Elementor y contain/height fijo rompe su layout). --- */
@media (max-width: 991.98px) {
  html body.category #mobile-header,
  html body#category #mobile-header {
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    overflow: hidden;
    contain: layout style;
  }
  html body.category #mobile-header .row-mobile-header,
  html body.category #mobile-header > .container > .row,
  html body.category #mobile-header > .row,
  html body#category #mobile-header .row-mobile-header,
  html body#category #mobile-header > .container > .row,
  html body#category #mobile-header > .row {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  html body.category #mobile-header > .container,
  html body#category #mobile-header > .container {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
  }
  /* Logo: reservar slot 50px desde render 1 (aspect-ratio gana a los attrs 1308/497) */
  html body.category #mobile-header .col-mobile-logo img.logo,
  html body.category #mobile-header .col-mobile-logo img,
  html body#category #mobile-header .col-mobile-logo img.logo,
  html body#category #mobile-header .col-mobile-logo img {
    height: 50px !important;
    max-height: 50px !important;
    max-width: 160px !important;
    width: auto !important;
    aspect-ratio: 1308 / 497;
  }
  /* Botones: altura fija */
  html body.category #mobile-header .col-mobile-btn,
  html body#category #mobile-header .col-mobile-btn {
    height: 50px !important;
    min-height: 50px !important;
    max-height: 50px !important;
  }
}
/* --- Thumbnails: aislar shifts internos del layout global --- */
.product-miniature .thumbnail-container,
article.product-miniature .thumbnail-container {
  contain: layout paint;
}
.product-miniature .thumbnail-container img.product-thumbnail-first,
.product-miniature .thumbnail-container img.product-thumbnail-second,
article.product-miniature .thumbnail-container img.product-thumbnail-first,
article.product-miniature .thumbnail-container img.product-thumbnail-second {
  aspect-ratio: 236 / 305;
}

/* ============================================================
   RC FIX-33 2026-04-20: Tablet /tienda sidebar squeeze
   Root cause: en viewport tablet portrait (768-991px) el #left-column
   con col-md-3 ocupa ~191px y deja 572px para el content → las cards
   producto quedan ~190px cada una en 3 columnas, truncando títulos
   ("Bo...", "Circ..."). Decisión de producto: ocultar sidebar en
   tablet y liberar ancho completo, cards a 2 columnas más cómodas.
   Ámbito limitado a body#category / body.category (catálogo).
   ============================================================ */
@media (min-width: 768px) and (max-width: 991px) {
  body#category #left-column,
  body.category #left-column,
  body#category #amazzing_filter,
  body.category #amazzing_filter {
    display: none !important;
  }
  body#category #content-wrapper,
  body.category #content-wrapper,
  body#category #center_column,
  body.category #center_column {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }
  /* Cards 2-col para ganar ancho y evitar truncado de títulos */
  body#category .products .js-product-miniature-wrapper,
  body.category .products .js-product-miniature-wrapper,
  body#category #js-product-list .products > .product,
  body.category #js-product-list .products > .product {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  /* Evitar truncado de títulos en cards */
  body#category .product-miniature .product-title a,
  body.category .product-miniature .product-title a,
  body#category .product-miniature h3.product-title,
  body.category .product-miniature h3.product-title {
    -webkit-line-clamp: 3 !important;
    overflow: visible !important;
    text-overflow: unset !important;
    white-space: normal !important;
  }
}

/* ============================================================
   FIX-34 — Lighthouse color-contrast edge cases
   Esperado: Home 96→100, /tienda 91→96+, Product 79→82
   ============================================================ */

/* [1] sc-item-price sidecart — beat theme-a286c4688 specificity */
html body #blockcart-content .cart-products .sc-item-price,
html body .cart-products .sc-item-price {
  color: #b02a18 !important;   /* was #d8412d (4.45:1), now 6.58:1 on white */
}

/* [2] ti-read-more-active — win over Trustindex inline style */
html body [class*="ti-read-more"][class],
html body .ti-read-more-active[class] {
  color: #595959 !important;   /* was #acacac (2.27:1), now 7.00:1 on white */
}

/* [3] custom-accordion-body p — darken gray on accordion near-white bg */
html body .custom-accordion-body p,
html body .custom-accordion-body {
  color: #595959 !important;   /* was #888 (3.37:1), now 6.65:1 on #f9f9f9 */
}


/* ============================================================
   RESPONSIVE AUDIT PATCH · 2026-04-20 (appended)
   Hotfixes for bugs found during atomic audit at 320/375/414/768/1024/1440/1920
   ============================================================ */

/* ---------- FIX 1 · Product card AÑADIR overlap ---------- */
/* Specificity boosted (html body + btn.add-to-cart.mini-cart-btn) to beat
   existing .product-miniature .btn.add-to-cart (0,3,0) rule.
   Hide literal "AÑADIR" text node on <=480, keep icon + price only. */
@media (max-width: 480px) {
  html body .product-miniature .btn.add-to-cart.mini-cart-btn {
    font-size: 0 !important;
    letter-spacing: 0 !important;
    gap: 6px !important;
    justify-content: center !important;
    padding: 8px 8px !important;
  }
  html body .product-miniature .btn.add-to-cart.mini-cart-btn .bag-icon,
  html body .product-miniature .btn.add-to-cart.mini-cart-btn .fa-shopping-bag,
  html body .product-miniature .btn.add-to-cart.mini-cart-btn .fa-shopping-cart {
    font-size: 14px !important;
  }
  html body .product-miniature .btn.add-to-cart.mini-cart-btn .btn-price-inline {
    font-size: 13px !important;
    margin-left: 0 !important;
    padding-left: 4px !important;
    font-weight: 700 !important;
    color: #fff !important;
  }
  html body .product-miniature .btn.add-to-cart.mini-cart-btn .spinner-icon {
    font-size: 12px !important;
  }
}

/* At >=481px cards widen enough for full text */
@media (min-width: 481px) and (max-width: 991px) {
  html body .product-miniature .btn.add-to-cart.mini-cart-btn {
    font-size: 11px !important;
    letter-spacing: 0 !important;
    padding: 8px 10px !important;
  }
  html body .product-miniature .btn.add-to-cart.mini-cart-btn .btn-price-inline {
    font-size: 12px !important;
  }
}

/* ---------- FIX 2 · Cookie banner: compact floating (desktop) ---------- */
@media (min-width: 992px) {
  html body .cookiesplus-banner,
  html body .cookiesplus-banner.cookiesplus-bottom {
    max-width: 420px !important;
    width: calc(100% - 40px) !important;
    right: 20px !important;
    left: auto !important;
    bottom: 20px !important;
    top: auto !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.18) !important;
    padding: 16px 20px !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    z-index: 1060 !important;
  }
  html body .cookiesplus-banner .cookiesplus-btn {
    padding: 8px 14px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
  }
}
@media (min-width: 576px) and (max-width: 991px) {
  html body .cookiesplus-banner,
  html body .cookiesplus-banner.cookiesplus-bottom {
    max-width: 480px !important;
    width: calc(100% - 32px) !important;
    left: 16px !important;
    right: 16px !important;
    bottom: 16px !important;
    margin: 0 auto !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.18) !important;
  }
}

/* ---------- FIX 3 · Hero yellow offer card word-break (1024–1440) ---------- */
@media (min-width: 992px) and (max-width: 1600px) {
  .rc-hero .rc-hero-offer,
  .rc-hero [class*="promo"],
  .rc-hero-yellow,
  .rc-hero .rc-hero-card-yellow {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }
  .rc-hero .rc-hero-offer h2,
  .rc-hero .rc-hero-offer h3,
  .rc-hero .rc-hero-offer .title,
  .rc-hero [class*="promo"] h2,
  .rc-hero [class*="promo"] h3 {
    font-size: clamp(1.1rem, 1.4vw, 1.75rem) !important;
    line-height: 1.15 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }
  #layerslider_4 h2,
  #layerslider_4 h3,
  #layerslider_4 .ls-layer {
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }
}

/* ---------- FIX 4 · Header vertical gap at 992–1199 ---------- */
@media (min-width: 992px) and (max-width: 1199px) {
  html body #header .row-header-bottom,
  html body #header .header-menu-row,
  html body #_desktop_top_menu {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  html body #header #iqitmegamenu-horizontal > ul.nav,
  html body #header .cbp-hrmenu ul {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  html body #header .row.row-header-bottom {
    min-height: 48px !important;
  }
}

/* ---------- FIX 5 · Brand carousel mobile sizing ---------- */
@media (max-width: 767px) {
  html body .manufacturers-slider .swiper-slide img,
  html body .iqit-manufacturers-slider .swiper-slide img,
  html body [class*="manufacturer"] .swiper-slide img,
  html body [class*="brand"] .swiper-slide img {
    max-height: 44px !important;
    width: auto !important;
    max-width: 80% !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
  }
  html body .manufacturers-slider .swiper-slide,
  html body [class*="manufacturer"] .swiper-slide,
  html body [class*="brand"] .swiper-slide {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 60px !important;
    padding: 0 8px !important;
  }
}

/* ---------- FIX 6 · Testimonial avatar & stray thumbnail ---------- */
@media (max-width: 767px) {
  html body [class*="testimonial"] img.avatar,
  html body .trustindex-widget img.avatar,
  html body .trustindex-widget .ti-avatar,
  html body .trustindex-widget [class*="avatar"] img {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    flex-shrink: 0 !important;
  }
  /* Kill stray non-avatar imgs inside testimonial cards */
  html body .trustindex-widget .ti-name-block ~ img:not([class*="star"]):not(.avatar),
  html body [class*="testimonial"] .ti-review img:not([class*="star"]):not(.avatar) {
    display: none !important;
  }
}

/* ---------- FIX 7 · Overflow-x safety net ---------- */
html body { overflow-x: hidden !important; }
img, video, iframe { max-width: 100% !important; height: auto; }

/* ---------- FIX 8 · Product detail mobile reorder: price first ---------- */
@media (max-width: 767px) {
  body#product .product-information {
    display: flex !important;
    flex-direction: column !important;
  }
  body#product .current-price,
  body#product .product-prices,
  body#product .product-price {
    order: 1 !important;
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    margin: 8px 0 12px 0 !important;
  }
  body#product .product-quantity,
  body#product .product-add-to-cart .col-add-qty {
    order: 2 !important;
  }
  body#product .add-to-cart,
  body#product .btn-add-to-cart,
  body#product .product-add-to-cart button[data-button-action="add-to-cart"] {
    order: 3 !important;
    margin-top: 10px !important;
  }
}

/* ---------- FIX 9 · Category card: avoid zero-width price inside add-to-cart visible ---------- */
html body .product-miniature .product-price-and-shipping[style*="display: none"] + .mini-action-row {
  margin-top: 0 !important;
}

/* ============================================================
   FIX 13 · Mobile burger menu icons (semantically correct)
   Using unique tab--id-N classes instead of :nth-child (resilient)
   Tab IDs: 15=Inicio, 17=Servicios, 16=CalderasOcasion, 6=Tienda, 18=Contacto
   2026-04-20 patch
   ============================================================ */
@media (max-width: 991px) {
  /* Inicio (id=15) → Home — double-class combined to beat :nth-child(N) = (0,3,1) */
  html body .mobile-menu__tab.mobile-menu__tab--id-15 > .mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-15 > a::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E") !important;
  }
  /* Servicios (id=17) → Wrench */
  html body .mobile-menu__tab.mobile-menu__tab--id-17 > .mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-17 > a::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z'/%3E%3C/svg%3E") !important;
  }
  /* Calderas Ocasion (id=16) → Package */
  html body .mobile-menu__tab.mobile-menu__tab--id-16 > .mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-16 > a::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpolyline points='3.27 6.96 12 12.01 20.73 6.96'/%3E%3Cline x1='12' y1='22.08' x2='12' y2='12'/%3E%3C/svg%3E") !important;
  }
  /* Tienda (id=6) → Shopping Bag */
  html body .mobile-menu__tab.mobile-menu__tab--id-6 > .mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-6 > a::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E") !important;
  }
  /* Contacto (id=18) → Envelope */
  html body .mobile-menu__tab.mobile-menu__tab--id-18 > .mobile-menu__link::before,
  html body .mobile-menu__tab.mobile-menu__tab--id-18 > a::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z'/%3E%3Cpolyline points='22,6 12,13 2,6'/%3E%3C/svg%3E") !important;
  }

  /* ============================================================
     FIX 14 · Chevron indicator for has-submenu items
     Matches Tienda which already shows a chevron.
     ============================================================ */
  html body .mobile-menu__tab--has-submenu > .mobile-menu__link::after,
  html body .mobile-menu__tab--has-submenu > a::after,
  html body .js-mobile-menu__tab--has-submenu > .mobile-menu__link::after,
  html body .js-mobile-menu__tab--has-submenu > a::after {
    content: '' !important;
    display: inline-block !important;
    width: 8px !important;
    height: 8px !important;
    margin-left: auto !important;
    border-right: 2px solid rgba(255, 255, 255, 0.55) !important;
    border-bottom: 2px solid rgba(255, 255, 255, 0.55) !important;
    transform: rotate(-45deg) !important;
    flex-shrink: 0 !important;
    transition: transform 200ms ease !important;
  }
  html body .mobile-menu__tab.is-open.mobile-menu__tab--has-submenu > .mobile-menu__link::after,
  html body .mobile-menu__tab[aria-expanded="true"] > .mobile-menu__link::after {
    transform: rotate(45deg) !important;
  }

  /* ============================================================
     FIX 15 · Menu links: ensure flex layout so chevron sits right
     ============================================================ */
  html body .mobile-menu__tab > .mobile-menu__link {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
  }
}

/* ============================================================
   PHASE 3 CONSOLIDATED PATCH · 2026-04-20
   Based on multi-agent audit feedback
   ============================================================ */

/* ---------- FIX 16 · Footer 4-column overflow at 1440 ---------- */
@media (min-width: 992px) and (max-width: 1440px) {
  html body .footer-container .footer-row,
  html body footer .row {
    flex-wrap: wrap !important;
  }
  html body .footer-container [class*="col-"] {
    min-width: 0 !important;
    max-width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }
  html body .footer-container [class*="block-contact"],
  html body .footer-container .block-contact-content {
    word-break: break-word !important;
  }
}

/* ---------- FIX 17 · Carousel dots better spacing + touch target ---------- */
html body .rc-hero-dots,
html body .swiper-pagination,
html body .slick-dots {
  display: flex !important;
  gap: 10px !important;
  justify-content: center !important;
  padding: 12px 0 !important;
}
html body .rc-hero-dot,
html body .swiper-pagination-bullet,
html body .slick-dots li button {
  min-width: 12px !important;
  min-height: 12px !important;
  /* Invisible hit area 44x44 */
  position: relative !important;
}
html body .rc-hero-dot::before,
html body .swiper-pagination-bullet::before,
html body .slick-dots li button::before {
  content: "" !important;
  position: absolute !important;
  inset: -16px !important;
  background: transparent !important;
}

/* ---------- FIX 18 · Sticky floating WhatsApp/Call CTA (mobile) ---------- */
.rc-float-cta {
  position: fixed !important;
  right: 16px !important;
  bottom: 16px !important;
  z-index: 999 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  pointer-events: none !important;
}
.rc-float-cta a {
  pointer-events: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25) !important;
  text-decoration: none !important;
  color: #fff !important;
  transition: transform 200ms ease !important;
}
.rc-float-cta a:hover {
  transform: scale(1.06) !important;
}
.rc-float-cta .rc-float-wa { background: #25D366 !important; }
.rc-float-cta .rc-float-call { background: #C1272D !important; }
.rc-float-cta svg { width: 28px !important; height: 28px !important; fill: #fff !important; }

/* Hide on scroll top to reduce clutter on initial hero */
@media (min-width: 1200px) {
  .rc-float-cta { right: 24px !important; bottom: 24px !important; }
}

/* ---------- FIX 19 · Trust bar under hero (desktop) ---------- */
.rc-trust-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  justify-content: center !important;
  padding: 14px 20px !important;
  margin: 16px auto 24px !important;
  max-width: 1100px !important;
  background: linear-gradient(135deg, #f8fafc, #f1f5f9) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
}
.rc-trust-bar .rc-trust-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 13px !important;
  color: #1e293b !important;
  font-weight: 600 !important;
}
.rc-trust-bar .rc-trust-item svg {
  width: 20px !important;
  height: 20px !important;
  stroke: #C1272D !important;
  stroke-width: 2 !important;
  fill: none !important;
  flex-shrink: 0 !important;
}
@media (max-width: 575px) {
  .rc-trust-bar {
    margin: 12px 10px 20px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
  }
  .rc-trust-bar .rc-trust-item { font-size: 11.5px !important; }
  .rc-trust-bar .rc-trust-item svg { width: 16px !important; height: 16px !important; }
}

/* ---------- FIX 20 · Unify CTA button styling across site ---------- */
html body .btn.btn-primary:not(.close):not(.mini-cart-btn),
html body .btn.add-to-cart-lg,
html body .btn-product-primary {
  background: #C1272D !important;
  border-color: #C1272D !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  text-transform: uppercase !important;
  border-radius: 10px !important;
  transition: all 200ms ease !important;
}
html body .btn.btn-primary:not(.close):not(.mini-cart-btn):hover,
html body .btn.add-to-cart-lg:hover {
  background: #A01F24 !important;
  border-color: #A01F24 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px rgba(193, 39, 45, 0.35) !important;
}

/* ---------- FIX 21 · Categories grid density fix (1440) ---------- */
@media (min-width: 992px) and (max-width: 1600px) {
  html body .home-categories,
  html body [class*="categories-grid"] {
    gap: 14px !important;
    padding: 20px 0 !important;
  }
  html body .home-categories .category-item,
  html body [class*="categories-grid"] > * {
    transition: transform 200ms ease !important;
  }
  html body .home-categories .category-item:hover,
  html body [class*="categories-grid"] > *:hover {
    transform: translateY(-3px) !important;
  }
}

/* ---------- FIX 22 · Focus indicators visibles (A11y) ---------- */
html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body [tabindex]:focus-visible {
  outline: 3px solid #C1272D !important;
  outline-offset: 2px !important;
  border-radius: 4px !important;
}

/* ---------- FIX 23 · Form fields: visible labels (accessibility) ---------- */
html body .form-group label,
html body label[for] {
  display: block !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  margin-bottom: 4px !important;
}

/* ============================================================
   PHASE 4 SYSTEMIC PATCH · 2026-04-20
   Based on 4-agent audit: iqit bloat, nav bugs, redundancies, forms
   ============================================================ */

/* ---------- FIX 24 · Font-size floor (legibility) ---------- */
/* 1188 elements <12px detected → clamp to minimum 12px */
html body .description,
html body .product-desc,
html body [class*="small-text"],
html body .text-xs,
html body small {
  font-size: clamp(12px, 1.6vw, 14px) !important;
  line-height: 1.5 !important;
}
@media (max-width: 767px) {
  html body,
  html body p,
  html body li,
  html body span:not([class*="icon"]):not([class*="badge"]) {
    font-size: max(12px, 1em);
  }
}

/* ---------- FIX 25 · Free shipping bar scope (only in cart/checkout) ---------- */
@media screen {
  html body:not([data-page="cart"]):not([data-page="checkout"]):not(#checkout):not(#cart) .sc-free-shipping-bar,
  html body:not([data-page="cart"]):not([data-page="checkout"]):not(#checkout):not(#cart) [class*="free-shipping-progress"]:not(.sidecart-only) {
    display: none !important;
  }
  /* Show only in sidecart */
  .blockcart-modal .sc-free-shipping-bar,
  .js-cart-modal .sc-free-shipping-bar,
  #blockcart-modal .sc-free-shipping-bar {
    display: flex !important;
  }
}

/* ---------- FIX 26 · Sidecart "Finalizar compra" sticky bottom (mobile) ---------- */
@media (max-width: 767px) {
  html body .cart-modal,
  html body .js-cart-modal,
  html body #blockcart-modal,
  html body .blockcart-modal {
    display: flex !important;
    flex-direction: column !important;
  }
  html body .cart-modal .modal-body,
  html body .js-cart-modal .modal-body {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
  }
  html body .cart-modal .modal-footer,
  html body .js-cart-modal .modal-footer,
  html body .cart-modal [class*="checkout-btn"],
  html body .js-cart-modal [class*="checkout-btn"] {
    position: sticky !important;
    bottom: 0 !important;
    background: #fff !important;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1) !important;
    padding: 12px !important;
    z-index: 10 !important;
  }
  html body .cart-modal a[href*="/order"],
  html body .cart-modal a[href*="/checkout"],
  html body .js-cart-modal a[href*="/order"],
  html body .js-cart-modal a[href*="/checkout"] {
    width: 100% !important;
    min-height: 52px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
  }
}

/* ---------- FIX 27 · Z-index normalized scale (kills chaos) ---------- */
/* Scale: tooltip=100, dropdown=200, sticky-header=300, mobile-menu=400,
   modal=500, backdrop=499, sidecart=550, cookie-banner=600, float-cta=700 */
html body #header.sticky,
html body .sticky-header,
html body [class*="header-sticky"] {
  z-index: 300 !important;
}
html body .mobile-menu,
html body #_mobile_iqitmegamenu-mobile.show,
html body .mobile-menu.show {
  z-index: 400 !important;
}
html body .modal,
html body .modal-dialog {
  z-index: 500 !important;
}
html body .modal-backdrop {
  z-index: 499 !important;
}
html body #blockcart-modal,
html body .blockcart-modal,
html body .js-cart-modal {
  z-index: 550 !important;
}
html body .cookiesplus-banner,
html body .cookiesplus-banner-container {
  z-index: 600 !important;
}
html body .rc-float-cta {
  z-index: 700 !important;
}

/* ---------- FIX 28 · Empty link (a[href="#"] / a[href=""]) visual defang ---------- */
/* Prevent useless clicks on empty/placeholder links */
html body a[href="#"],
html body a[href=""]:not([role="button"]):not([onclick]) {
  cursor: default;
}

/* ---------- FIX 29 · iqit empty node collapse (229 unused nodes) ---------- */
html body [class*="iqit"]:empty:not(img):not(input):not(br):not(hr):not([aria-label]):not([style*="background"]):not(.js-slot) {
  display: none !important;
}

/* ---------- FIX 30 · Consistent border-radius hierarchy ---------- */
html body .btn,
html body button.btn,
html body input[type="submit"],
html body input[type="button"] {
  border-radius: 10px !important;
}
html body .card,
html body .product-miniature,
html body [class*="card-"] {
  border-radius: 12px !important;
}
html body .rc-hero,
html body .rc-hero-card,
html body .home-service-card {
  border-radius: 16px !important;
}
html body input[type="text"],
html body input[type="email"],
html body input[type="tel"],
html body input[type="password"],
html body input[type="search"],
html body textarea,
html body select {
  border-radius: 8px !important;
}

/* ---------- FIX 31 · Consistent button padding ---------- */
html body .btn:not(.btn-icon):not(.mini-cart-btn) {
  padding: 10px 20px !important;
  min-height: 40px !important;
}
html body .btn-lg {
  padding: 14px 28px !important;
  min-height: 52px !important;
}
html body .btn-sm {
  padding: 6px 14px !important;
  min-height: 32px !important;
}

/* ---------- FIX 32 · Trust bar dedup (hide duplicates via JS but also CSS fallback) ---------- */
html body .rc-trust-bar + .rc-trust-bar,
html body .rc-trust-bar ~ [class*="trust-"]:has(.rc-trust-item) {
  display: none !important;
}

/* ---------- FIX 33 · Mobile menu: overlay that blocks click fix ---------- */
@media (max-width: 991px) {
  /* Kill any rogue invisible overlay that blocks taps */
  html body body.mobile-menu-open > :not(.mobile-menu):not(#_mobile_iqitmegamenu-mobile):not(#mobile-header):not(script):not(style)::before,
  html body body.mobile-menu-open > :not(.mobile-menu):not(#_mobile_iqitmegamenu-mobile):not(#mobile-header):not(script):not(style)::after {
    pointer-events: none !important;
  }
  /* Make sure link elements always receive tap */
  html body .mobile-menu__link,
  html body .mobile-menu__tab a {
    pointer-events: auto !important;
    position: relative !important;
    z-index: 2 !important;
  }
}

/* ---------- FIX 34 · Image aspect-ratio to prevent CLS ---------- */
html body img:not([width]):not([height]) {
  aspect-ratio: attr(data-aspect, 1/1);
}
html body .product-miniature img,
html body .product-thumbnail img {
  aspect-ratio: 1 / 1 !important;
  object-fit: contain !important;
}

/* ---------- FIX 35 · Focus ring consistency (A11y) ---------- */
html body *:focus {
  outline: none;
}
html body *:focus-visible {
  outline: 3px solid #C1272D !important;
  outline-offset: 2px !important;
}

/* ============================================================
   PHASE 5 · UNHIDE ELEMENTOR SECTIONS ON MOBILE
   Sections were hidden by .elementor-hidden-phone.
   We force them visible + adapt to mobile layout.
   2026-04-20
   ============================================================ */

@media (max-width: 767px) {
  /* Override Elementor hidden-phone → visible on mobile */
  html body .elementor .elementor-hidden-phone:not([data-permanent-hide]) {
    display: block !important;
  }
  html body .elementor .elementor-column.elementor-hidden-phone:not([data-permanent-hide]),
  html body .elementor .elementor-hidden-phone.elementor-column {
    display: flex !important;
  }
  html body .elementor .elementor-widget.elementor-hidden-phone:not([data-permanent-hide]) {
    display: block !important;
  }
  html body .elementor .elementor-section.elementor-hidden-phone:not([data-permanent-hide]) {
    display: block !important;
  }

  /* Adapt elementor grid columns to full-width on mobile */
  html body .elementor-section .elementor-container,
  html body .elementor-column-wrap,
  html body .elementor-col-50,
  html body .elementor-col-33,
  html body .elementor-col-25,
  html body .elementor-col-20,
  html body .elementor-col-16 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 0 100% !important;
  }

  /* Elementor image carousel responsive */
  html body .elementor-image-carousel-wrapper .swiper-slide {
    max-width: 100% !important;
  }
  html body .elementor-image-carousel .swiper-container {
    padding: 0 8px !important;
  }

  /* ProductsListTabs widget (Más Vendidos / Nuevos / Ofertas): show as tabs fluid */
  html body .elementor-widget-prestashop-widget-ProductsListTabs .nav-tabs {
    flex-wrap: wrap !important;
    gap: 4px !important;
    padding: 0 8px !important;
    border-bottom: 2px solid #eee !important;
  }
  html body .elementor-widget-prestashop-widget-ProductsListTabs .nav-tabs .nav-link {
    font-size: 13px !important;
    padding: 8px 12px !important;
    white-space: nowrap !important;
  }
  html body .elementor-widget-prestashop-widget-ProductsListTabs .products {
    padding: 12px 8px !important;
  }

  /* Category grid in Elementor: force 2-col on mobile */
  html body .elementor-element-6hdn71c .elementor-image-carousel .swiper-slide,
  html body [class*="categorias"] .swiper-slide {
    width: 50% !important;
  }

  /* Service widgets (knawvlh) spacing on mobile */
  html body .rc-servicios,
  html body [class*="rc-servicios"] {
    padding: 12px !important;
    margin: 8px 0 !important;
  }

  /* Hero text/image overflow protection */
  html body .elementor-section:not(.elementor-hidden-phone) .elementor-widget-wrap {
    overflow: hidden !important;
    padding: 0 4px !important;
  }

  /* Section spacing consistency */
  html body .elementor-section {
    padding: 16px 0 !important;
    margin: 0 !important;
  }
  html body .elementor-top-section {
    padding: 20px 0 !important;
  }
}

/* ============================================================
   FIX 36 · Trustindex/testimonials widget skeleton loader
   The widget often shows only title when data not loaded.
   Add graceful fallback styling.
   ============================================================ */
html body .trustindex-widget:empty,
html body [class*="testimonial"]:empty {
  display: none !important;
}
html body .trustindex-widget[data-loaded="false"],
html body [class*="trustindex"].is-loading {
  min-height: 200px !important;
  background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%) !important;
  background-size: 200% 100% !important;
  animation: rc-skeleton 1.5s infinite !important;
  border-radius: 12px !important;
}
@keyframes rc-skeleton {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   FIX 37 · Prevent horizontal scroll from wide elements
   ============================================================ */
html body .elementor-section-stretched,
html body .elementor-section-full_width {
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

/* ============================================================
   FIX 38 · Touch-friendly spacing between clickable elements
   (Prevents mis-taps on mobile 320-414)
   ============================================================ */
@media (max-width: 480px) {
  html body .navigation-wrap,
  html body .footer-container a {
    min-height: 40px !important;
    padding: 6px 4px !important;
  }
  html body .breadcrumb a,
  html body .breadcrumb span {
    padding: 4px 2px !important;
  }
}

/* ============================================================
   PHASE 6 · Fix hero visibility gaps + Swiper defensive
   2026-04-20
   ============================================================ */

/* ---------- FIX 39 · LayerSlider visible in all viewports ---------- */
/* Bug: layerslider_4 gets display:none via ls-device-is-desktop class in 1024 */
html body #layerslider_4,
html body #layerslider_4.ls-device-is-desktop,
html body #layerslider_4.ls-device-is-desk,
html body #layerslider_4.ls-device-is-tablet,
html body #layerslider_4.ls-device-is-mobile,
html body .ls-wp-container#layerslider_4 {
  display: block !important;
  visibility: visible !important;
  min-height: 1px !important;
}

/* Ensure rc-hero is available as mobile fallback */
@media (max-width: 991px) {
  html body .rc-hero {
    display: block !important;
  }
}

/* ---------- FIX 40 · Header height consistency 992-1199 ---------- */
@media (min-width: 992px) and (max-width: 1199px) {
  html body #header {
    max-height: 100px !important;
  }
  html body #header .header-top {
    padding: 8px 0 !important;
  }
  html body #header .header-nav,
  html body #header .row-header-bottom {
    padding: 4px 0 !important;
    min-height: 40px !important;
  }
  /* Compact logo in 1024 */
  html body #header img.logo {
    max-height: 42px !important;
    width: auto !important;
  }
  /* Compact search input */
  html body #header .search-widget {
    max-height: 44px !important;
  }
  html body #header .search-widget input {
    min-height: 44px !important;
    padding: 10px 14px !important;
  }
}

/* ---------- FIX 41 · Remove excessive padding below header at 1024 ---------- */
@media (min-width: 992px) and (max-width: 1199px) {
  html body #main,
  html body #wrapper,
  html body #content-wrapper {
    padding-top: 0 !important;
  }
  html body #layerslider_4,
  html body .elementor-section:first-of-type {
    margin-top: 0 !important;
  }
}

/* ---------- FIX 42 · Logo + search alignment fix ---------- */
@media (min-width: 992px) {
  html body #header .header-top .col-logo,
  html body #header .header-top ._desktop_logo {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    padding-right: 12px !important;
  }
  html body #header .header-top ._desktop_search,
  html body #header .header-top .col-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  html body #header img.logo {
    display: block !important;
    max-width: 100% !important;
    object-fit: contain !important;
  }
}

/* ---------- FIX 43 · Gap eliminate between header + hero ---------- */
html body #header + section,
html body #header + main,
html body #header + div {
  margin-top: 0 !important;
}

/* ============================================================
   PHASE 7 · Final polish
   2026-04-20
   ============================================================ */

/* ---------- FIX 44 · Hide empty "No hay errores/compatibilidades" placeholders ---------- */
/* Uses :has() which is widely supported since 2023 */
html body .custom-accordion:has(.custom-accordion-body > p:only-child:not(:has(*))) {
  display: none !important;
}
/* Fallback for browsers without :has() — hide if specific text */
html body .custom-accordion.custom-accordion-errores .custom-accordion-body p:only-child,
html body .custom-accordion.custom-accordion-compat .custom-accordion-body p:only-child {
  color: #94a3b8 !important;
  font-style: italic !important;
  font-size: 13px !important;
  padding: 12px !important;
  text-align: center !important;
}

/* ---------- FIX 45 · Product page "Volver" button polish ---------- */
html body .rc-back-to-listing {
  margin: 12px 0 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #C1272D !important;
  background: #fff5f5 !important;
  border: 1px solid #fecaca !important;
  text-decoration: none !important;
  transition: all 200ms ease !important;
}
html body .rc-back-to-listing:hover {
  background: #C1272D !important;
  color: #fff !important;
  transform: translateX(-2px) !important;
}

/* ---------- FIX 46 · Product image zoom icon polish ---------- */
html body .zoom-icon-v30 {
  position: absolute !important;
  bottom: 12px !important;
  right: 12px !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: none !important;
  z-index: 3 !important;
}
html body .zoom-icon-v30 svg {
  width: 20px !important;
  height: 20px !important;
  stroke: #1e40af !important;
  stroke-width: 2 !important;
  fill: none !important;
}

/* ---------- FIX 47 · Category cross-sell card consistency ---------- */
@media (max-width: 767px) {
  html body .product-accessories .product-miniature,
  html body .related-products .product-miniature {
    padding: 10px !important;
    min-height: 200px !important;
  }
  html body .product-accessories .product-miniature .product-description,
  html body .related-products .product-miniature .product-description {
    padding: 8px 0 !important;
  }
}

/* ---------- FIX 48 · Trust bar in product detail: 3 items only ---------- */
html body body#product .trust-bar-product {
  display: flex !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  padding: 12px 14px !important;
  margin: 12px 0 16px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  font-size: 13px !important;
}
html body body#product .trust-bar-product .trust-item {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #1e293b !important;
}
html body body#product .trust-bar-product .trust-item svg {
  width: 18px !important;
  height: 18px !important;
  stroke: #C1272D !important;
  stroke-width: 2 !important;
  fill: none !important;
}

/* ---------- FIX 49 · "Marca" / "Repuestos" info rows alignment ---------- */
html body body#product .product-features,
html body body#product [class*="product-meta"] {
  display: grid !important;
  grid-template-columns: 120px 1fr !important;
  gap: 8px !important;
  align-items: center !important;
  margin: 8px 0 !important;
  padding: 10px 14px !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
}
@media (max-width: 480px) {
  html body body#product .product-features,
  html body body#product [class*="product-meta"] {
    grid-template-columns: 90px 1fr !important;
    font-size: 13px !important;
  }
}

/* ---------- FIX 50 · Kill free shipping bar on homepage dropdown ---------- */
/* Only show in sidecart modal or cart page */
html body:not(#cart):not(#checkout) .dropdown-menu-custom .sc-free-shipping-bar {
  display: none !important;
}

/* ---------- FIX 51 · Remove floating CTA (user request 2026-04-20) ---------- */
html body .rc-float-cta,
html body .rc-float-cta *,
html body .rc-float-wa,
html body .rc-float-call {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* ============================================================
   RC FIX-28 2026-04-20: Footer 4-col alignment + hover zoom + responsive
   ============================================================ */

/* Desktop (>=992px): 4 equal columns, enforced */
@media (min-width: 992px) {
  footer #footer-container-main .row,
  footer .footer-container .row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 20px !important;
    margin: 0 !important;
    align-items: stretch !important;
  }
  footer #footer-container-main .row > .col,
  footer #footer-container-main .row > [class*="col-"],
  footer .footer-container .row > .col,
  footer .footer-container .row > [class*="col-"] {
    flex: 1 1 0 !important;
    max-width: calc(25% - 15px) !important;
    width: calc(25% - 15px) !important;
    padding: 18px 16px !important;
    border-radius: 10px !important;
    border-bottom: 0 !important;
    transition: transform .35s cubic-bezier(.25,.46,.45,.94), box-shadow .35s ease, background-color .35s ease !important;
    transform-origin: center center !important;
    will-change: transform !important;
  }
}

/* Hover zoom — solo punteros precisos (evita hover sticky en touch) */
@media (hover: hover) and (pointer: fine) and (min-width: 992px) {
  footer #footer-container-main .row > .col:hover,
  footer #footer-container-main .row > [class*="col-"]:hover,
  footer .footer-container .row > .col:hover,
  footer .footer-container .row > [class*="col-"]:hover {
    transform: scale(1.035) !important;
    background-color: rgba(255,255,255,0.045) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,0.22) !important;
    position: relative !important;
    z-index: 2 !important;
  }
}

/* Tablet (576-991.98px): 2 columnas — override al stacking existente */
@media (min-width: 576px) and (max-width: 991.98px) {
  footer #footer-container-main .row,
  footer .footer-container .row {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    flex-direction: unset !important;
    flex-wrap: unset !important;
    gap: 4px 18px !important;
    margin: 0 !important;
  }
  footer #footer-container-main .row > .col,
  footer #footer-container-main .row > [class*="col-"],
  footer .footer-container .row > .col,
  footer .footer-container .row > [class*="col-"] {
    flex: unset !important;
    max-width: 100% !important;
    width: auto !important;
    padding: 14px 16px !important;
  }
  /* Sin border-bottom en la última fila del grid (2 últimos bloques) */
  footer #footer-container-main .row > *:nth-last-child(-n+2),
  footer .footer-container .row > *:nth-last-child(-n+2) {
    border-bottom: 0 !important;
  }
}

/* Móvil (<576px): hereda el stacked single-column existente — sin overrides */

/* ============================================================
   RC FIX-29 2026-04-20: Ocultar flechas swiper Elementor
   ============================================================ */
.elementor-swiper-button,
.elementor-swiper-button-prev,
.elementor-swiper-button-next,
.swiper-button-prev.elementor-swiper-button,
.swiper-button-next.elementor-swiper-button {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ============================================================
   RC FIX-31 2026-04-20: Ocultar paginación swiper Elementor (bullets)
   ============================================================ */
.swiper-pagination,
.elementor-swiper-pagination,
.swiper-pagination-bullets,
.swiper-pagination-bullet,
.elementor-widget-container .swiper-pagination,
.elementor-swiper .swiper-pagination,
.swiper-dots-outside,
.swiper-dots-inside {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

/* Recuperar espacio que ocupaban los dots outside */
.elementor-widget-container .swiper,
.elementor-widget-container .swiper-container {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* ============================================================
   RC FIX-32 2026-04-20: Rediseño back-btn del submenú móvil
   ============================================================ */
.mobile-menu__header--active .mobile-menu__back-btn,
.js-mobile-menu .mobile-menu__back-btn,
.js-mobile-menu .js-mobile-menu__back-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 20px 9px 12px !important;
  background: linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 999px !important;
  color: #fff !important;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  transition: background .28s ease, border-color .28s ease, transform .28s ease, box-shadow .28s ease !important;
  -webkit-tap-highlight-color: transparent !important;
}

.js-mobile-menu .mobile-menu__back-btn:hover,
.js-mobile-menu .mobile-menu__back-btn:focus-visible,
.js-mobile-menu .mobile-menu__back-btn:active {
  background: linear-gradient(135deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.05) 100%) !important;
  border-color: rgba(255,255,255,0.28) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.12) !important;
  transform: translateY(-1px) !important;
  outline: none !important;
}

.js-mobile-menu .mobile-menu__back-btn:active {
  transform: translateY(0) scale(0.985) !important;
}

/* Icono chevron dentro de círculo */
.js-mobile-menu .mobile-menu__back-btn .fa-angle-left,
.js-mobile-menu .mobile-menu__back-btn .fa.fa-angle-left {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,0.1) !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  transition: transform .28s ease, background .28s ease !important;
}

.js-mobile-menu .mobile-menu__back-btn:hover .fa-angle-left,
.js-mobile-menu .mobile-menu__back-btn:focus-visible .fa-angle-left,
.js-mobile-menu .mobile-menu__back-btn:active .fa-angle-left {
  background: rgba(255,255,255,0.18) !important;
  transform: translateX(-3px) !important;
}

/* Título tipográficamente más cuidado */
.js-mobile-menu .mobile-menu__back-btn .mobile-menu__title,
.js-mobile-menu .mobile-menu__back-btn .js-mobile-menu__title {
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-size: 13px !important;
  line-height: 1 !important;
  color: #fff !important;
  margin: 0 !important;
  opacity: 0.96 !important;
}

/* Ajuste del wrapper del header */
.js-mobile-menu .mm-panel__header,
.js-mobile-menu .mobile-menu__header-wrapper {
  padding: 14px 16px !important;
}

/* ============================================================
   RC FIX-32b 2026-04-20: Specificity boost para back-btn
   ============================================================ */
html body .js-mobile-menu .mobile-menu__header .mobile-menu__back-btn.btn,
html body .js-mobile-menu .mobile-menu__back-btn.js-mobile-menu__back-btn,
html body #iqitmegamenu-mobile .mobile-menu__back-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 20px 10px 12px !important;
  background-color: transparent !important;
  background-image: linear-gradient(135deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0.02) 100%) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
  border-radius: 999px !important;
  color: #fff !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08) !important;
  text-decoration: none !important;
  min-height: 44px !important;
}

html body .js-mobile-menu .mobile-menu__back-btn:hover,
html body .js-mobile-menu .mobile-menu__back-btn:focus-visible,
html body .js-mobile-menu .mobile-menu__back-btn:active {
  background-image: linear-gradient(135deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.05) 100%) !important;
  border-color: rgba(255,255,255,0.32) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.14) !important;
}

/* ============================================================
   RC FIX-33 2026-04-20: Limpieza header submenú — un solo botón
   ============================================================ */

/* Eliminar background + border-bottom del wrapper externo */
html body .js-mobile-menu .mm-panel__header,
html body .js-mobile-menu .mobile-menu__header-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Eliminar background + border del wrapper interno (header interno) */
html body .js-mobile-menu .mobile-menu__header,
html body .js-mobile-menu .js-mobile-menu__header,
html body .js-mobile-menu .mobile-menu__header--active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Ocultar botón X cuando hay un submenú activo (back-btn ya cumple) */
html body .js-mobile-menu .mm-panel__header:has(.mobile-menu__header--active) .mobile-menu__close,
html body .js-mobile-menu .mobile-menu__header-wrapper:has(.mobile-menu__header--active) .mobile-menu__close,
html body .js-mobile-menu.mobile-menu--active .mobile-menu__close,
html body #iqitmegamenu-mobile.mobile-menu--active .mobile-menu__close {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ============================================================
   RC FIX-34 2026-04-20: Ocultar flecha ">" en items con submenú
   ============================================================ */
html body .js-mobile-menu .mobile-menu__arrow,
html body .js-mobile-menu span.mobile-menu__arrow.js-mobile-menu__link--has-submenu,
html body #iqitmegamenu-mobile .mobile-menu__arrow,
html body .js-mobile-menu .mobile-menu__arrow .fa-angle-right,
html body .js-mobile-menu .expand-icon {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

/* ============================================================
   RC FIX-35 2026-04-20: Mobile menu footer — quitar lang/currency + centrar login
   ============================================================ */

/* Ocultar selector de idioma y moneda */
html body .js-mobile-menu .mobile-menu__language-currency,
html body .js-mobile-menu .js-mobile-menu__language-currency,
html body .js-mobile-menu .mobile-menu__language-selector,
html body .js-mobile-menu .mobile-menu__currency-selector,
html body #iqitmegamenu-mobile .mobile-menu__language-currency {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

/* Centrar el botón de Iniciar sesión en el footer */
html body .js-mobile-menu .mobile-menu__footer,
html body .js-mobile-menu .js-top-menu-bottom.mobile-menu__footer {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 18px 16px !important;
}

/* Bloque user ocupando espacio adecuado */
html body .js-mobile-menu .mobile-menu__user {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: auto !important;
  margin: 0 !important;
}

/* Pill de Iniciar sesión: centrado, padding consistente, icono alineado */
html body .js-mobile-menu .mobile-menu__user > a,
html body .js-mobile-menu .mobile-menu__user a.text-reset {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 12px 28px !important;
  min-height: 48px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  font-size: 14px !important;
  text-decoration: none !important;
  line-height: 1 !important;
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease !important;
}

html body .js-mobile-menu .mobile-menu__user > a:hover,
html body .js-mobile-menu .mobile-menu__user > a:focus-visible,
html body .js-mobile-menu .mobile-menu__user > a:active {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 26px rgba(0, 50, 150, 0.35) !important;
  outline: none !important;
}

html body .js-mobile-menu .mobile-menu__user > a .fa-user {
  font-size: 15px !important;
  line-height: 1 !important;
  margin: 0 !important;
}

/* ============================================================
   RC FIX-36 2026-04-20: Ocultar dots del hero slider
   ============================================================ */
html body .rc-hero-dot,
html body .rc-hero-dots,
html body [class*="rc-hero-dot"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}