/*
Theme Name: Europa
Author: Tu Nombre
Description: Tema personalizado con encabezado dinámico y menús desplegables.
Version: 1.2.0
*/

/* ==========================================
   1. TIPOGRAFÍA Y RESET GLOBAL
   ========================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

html, body, button, input, select, textarea,
h1, h2, h3, h4, h5, h6, p, a, span, div, li,
.woocommerce, .woocommerce * {
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.woocommerce-products-header__title,
.page-title {
    color: #1a1a1a !important;
    font-weight: 700 !important;
    letter-spacing: -0.3px !important;
}

a,
.nav-menu-list a,
.woocommerce a,
.woocommerce-loop-product__title,
.woocommerce-breadcrumb a {
    text-decoration: none !important;
}

*, *::before, *::after {
    box-sizing: border-box !important;
}

html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ==========================================
   2. ESTILOS GLOBALES DEL ENCABEZADO
   ========================================== */
.site-header-custom { font-family: system-ui, -apple-system, sans-serif; width: 100%; color: #333; }
.header-container { max-width: 1280px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; }

/* Top Bar */
.top-bar { background-color: #124c40; color: #ffffff; font-size: 13px; padding: 8px 0; }
.top-bar-content { justify-content: space-between; }
.top-bar-left a { color: #fff; text-decoration: underline; }
.top-bar-right { display: flex; align-items: center; gap: 12px; }
.phone-highlight { color: #2eb872; font-weight: 600; }
.sep { opacity: 0.4; }

/* Middle Bar */
.middle-bar { background: #fff; padding: 18px 0; border-bottom: 1px solid #f0f0f0; }
.middle-bar-content { justify-content: space-between; gap: 20px; }
.site-logo img { max-height: 45px; width: auto; display: block; }
.site-logo .default-logo-text { font-size: 32px; font-weight: bold; color: #333; text-decoration: none; }

.site-search-form { flex: 1; max-width: 500px; position: relative; }
.site-search-form input { width: 100%; background: #f3f4f6; border: none; padding: 12px 45px 12px 20px; border-radius: 30px; font-size: 14px; outline: none; }
.site-search-form button { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); background: none; border: none; cursor: pointer; }

/* Acciones del usuario e ícono sin círculo
   IMPORTANTE: el selector incluye .action-circle en general (no solo
   "a.action-circle"), porque el botón de presupuesto es un <button>,
   no un <a>. Con solo "a.action-circle" el botón nunca recibía
   position:relative y el badge (position:absolute) se posicionaba
   respecto a un ancestro lejano, apareciendo en la esquina de toda
   la pantalla en vez de pegado al ícono. */
.header-user-actions { display: flex; align-items: center; gap: 12px; }
.header-user-actions .action-circle {
    border: none !important;
    background: transparent !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    padding: 0 5px !important;
    position: relative !important;
    text-decoration: none;
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer;
}

.badge {
    position: absolute !important;
    top: -6px !important;
    right: -8px !important;
    background: #e53e3e !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: bold !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    z-index: 2 !important;
}

.cart-widget { display: flex; align-items: center; gap: 8px; margin-left: 5px; }
.cart-amount { font-weight: 700; font-size: 15px; }

/* Bottom Bar */
.bottom-bar { background: #fff; border-bottom: 1px solid #eaeaea; padding: 15px 0; display: block; }
.bottom-bar-content { display: flex; align-items: center; gap: 30px; position: relative; }

/* Desplegable Categorías */
.categories-dropdown-wrapper { position: relative; display: inline-block; z-index: 100; visibility: visible; opacity: 1; }
.btn-categories {
  display: inline-flex; align-items: center; justify-content: center;
  background: #2eb872; color: #fff; border: none; padding: 12px 24px; border-radius: 30px;
  gap: 10px; font-weight: 600; font-size: 14px; cursor: pointer; outline: none;
  visibility: visible; opacity: 1;
}
.categories-dropdown-menu {
  position: absolute; top: calc(100% + 8px); left: 0; width: 290px; background: #ffffff;
  border-radius: 8px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); border: 1px solid #ededed;
  z-index: 1000; padding: 6px 0; display: none;
}
.categories-dropdown-menu.show { display: block; animation: fadeInDown 0.2s ease forwards; }
.categories-menu-list { list-style: none; margin: 0; padding: 0; }
.categories-menu-list li { border-bottom: 1px solid #f0f0f0; }
.categories-menu-list li:last-child { border-bottom: none; }
.categories-menu-list a {
  display: flex; justify-content: space-between; align-items: center; padding: 12px 20px;
  font-size: 14px; font-weight: 700; color: #222222; text-decoration: none; transition: color 0.2s;
}
.categories-menu-list a:hover { color: #2eb872; }
.categories-menu-list li.menu-item-has-children > a::after { content: '›'; font-size: 16px; color: #888; font-weight: 400; }

/* Menú Principal */
.dynamic-main-menu .nav-menu-list { display: flex; list-style: none; margin: 0; padding: 0; gap: 25px; }
.dynamic-main-menu .nav-menu-list > li > a {
  text-decoration: none; color: #1a1a1a; font-weight: 700; font-size: 14px; padding: 15px 0; display: inline-block; transition: color 0.2s ease;
}
.dynamic-main-menu .nav-menu-list > li.current-menu-item > a,
.dynamic-main-menu .nav-menu-list > li.current_page_item > a,
.dynamic-main-menu .nav-menu-list > li.current-menu-ancestor > a,
.dynamic-main-menu .nav-menu-list > li:hover > a { color: #2eb872 !important; }
.dynamic-main-menu .nav-menu-list > li { position: relative; }
.dynamic-main-menu .nav-menu-list > li.menu-item-has-children > a::after { content: ' ▾'; font-size: 11px; margin-left: 4px; display: inline-block; }

.dynamic-main-menu .nav-menu-list ul.sub-menu {
  position: absolute; top: 100%; left: 0; min-width: 230px; background: #ffffff; border: 1px solid #eeeeee;
  border-radius: 0 0 6px 6px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08); list-style: none; padding: 0; margin: 0; z-index: 999;
  opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
}
.dynamic-main-menu .nav-menu-list li:hover > ul.sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.dynamic-main-menu .nav-menu-list ul.sub-menu li { margin: 0; border-bottom: 1px solid #f2f2f2; }
.dynamic-main-menu .nav-menu-list ul.sub-menu li:last-child { border-bottom: none; }
.dynamic-main-menu .nav-menu-list ul.sub-menu a {
  display: flex; justify-content: space-between; align-items: center; padding: 12px 18px; font-size: 13px; font-weight: 500; color: #333333; text-decoration: none; transition: color 0.2s ease;
}
.dynamic-main-menu .nav-menu-list ul.sub-menu li > a::after { content: '›'; font-size: 15px; color: #bbb; font-weight: 400; transition: color 0.2s ease, transform 0.2s ease; }
.dynamic-main-menu .nav-menu-list ul.sub-menu a:hover { color: #2eb872; }
.dynamic-main-menu .nav-menu-list ul.sub-menu a:hover::after { color: #2eb872; transform: translateX(3px); }

@keyframes fadeInDown {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ==========================================
   3. FRANJA BREADCRUMB Y NAVEGACIÓN
   ========================================== */
.custom-breadcrumb-band {
    background-color: #f5f7f2 !important;
    width: 100% !important;
    padding: 50px 0 !important;
    margin-bottom: 65px !important;
    border-bottom: 1px solid #eaeaea !important;
}

.custom-breadcrumb-band .header-container {
    display: flex !important;
    justify-content: flex-start !important;
}

.custom-breadcrumb-nav,
.woocommerce-breadcrumb {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
    font-size: 14px !important;
    color: #777777 !important;
    font-family: system-ui, -apple-system, sans-serif !important;
}

.custom-breadcrumb-nav a,
.custom-breadcrumb-nav a:visited,
.custom-breadcrumb-nav a:link,
.woocommerce-breadcrumb a,
.woocommerce-breadcrumb a:visited {
    color: #333333 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

.custom-breadcrumb-nav a:hover,
.woocommerce-breadcrumb a:hover {
    color: #2eb872 !important;
}

.custom-breadcrumb-nav .sep {
    color: #333333 !important;
    margin: 0 10px !important;
    font-size: 12px !important;
}

.custom-breadcrumb-nav .current-page,
.woocommerce-breadcrumb span {
    color: #666666 !important;
    font-weight: 400 !important;
}

/* ==========================================
   4. SECCIÓN HERO (SLIDER Y BANNERS)
   ========================================== */
.hero-section { margin: 20px 0 60px 0; }
.hero-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; height: 480px; }
.hero-slider { position: relative; border-radius: 10px; overflow: hidden; background: #f9f9f9; height: 100%; width: 100%; box-shadow: 0 4px 15px rgba(0,0,0,0.03); }
.hero-slider .slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; transition: opacity 0.6s ease, visibility 0.6s ease; }
.hero-slider .slide.active { opacity: 1; visibility: visible; }
.hero-slider .slide > img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1); transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.hero-slider:hover .slide.active > img { transform: scale(1.04); }

.btn-hero-slide {
  position: absolute; bottom: 40px; left: 40px; background: #2eb872; color: #ffffff; padding: 12px 28px; border-radius: 30px;
  text-decoration: none; font-family: system-ui, -apple-system, sans-serif; font-weight: 700; font-size: 14px; display: inline-block; white-space: nowrap;
  box-shadow: 0 4px 10px rgba(46, 184, 114, 0.3); transition: background 0.3s, transform 0.3s; z-index: 10;
}
.btn-hero-slide:hover { background: #259e61; transform: translateY(-2px); color: #ffffff; }

.slider-dots { position: absolute; bottom: 20px; width: 100%; text-align: center; z-index: 10; }
.slider-dots .dot { display: inline-block; width: 10px; height: 10px; background: #e0e0e0; border-radius: 50%; margin: 0 4px; transition: background 0.3s ease, width 0.3s ease; }
.slider-dots .dot.active { background: #2eb872; width: 24px; border-radius: 10px; }

.hero-banners { display: flex; flex-direction: column; gap: 20px; height: 100%; width: 100%; }
.banner-box { flex: 1; border-radius: 10px; overflow: hidden; display: block; position: relative; text-decoration: none; height: calc(50% - 10px); box-shadow: 0 4px 15px rgba(0,0,0,0.03); }
.banner-box img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1); transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.banner-box:hover img { transform: scale(1.05); }

.btn-banner {
  position: absolute; left: 30px; bottom: 40px; background: #ffffff; color: #1a1a1a; font-family: system-ui, -apple-system, sans-serif;
  font-size: 12px; font-weight: 700; padding: 8px 18px; border-radius: 20px; display: inline-flex; align-items: center; gap: 6px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08); transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease; z-index: 5;
}
.btn-banner span { font-size: 14px; line-height: 1; transition: transform 0.3s ease; }
.banner-box:hover .btn-banner { background: #2eb872; color: #ffffff; }
.banner-box:hover .btn-banner span { transform: translateX(4px); }

/* ==========================================
   5. CATEGORÍAS POPULARES
   ========================================== */
.popular-categories-section { margin: 140px 0 60px 0; padding-top: 10px; font-family: system-ui, -apple-system, sans-serif; clear: both; }
.categories-header { margin-bottom: 25px; }
.categories-header h2 { font-size: 24px; color: #1a1a1a; margin: 0 0 6px 0; font-weight: 700; }
.categories-header p { color: #777777; margin: 0; font-size: 15px; }

.categories-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); background-color: #eaeaea; border: 1px solid #eaeaea; gap: 1px; border-radius: 8px; overflow: hidden;
}
.category-card { background-color: #ffffff; display: flex; align-items: center; justify-content: space-between; padding: 25px; text-decoration: none; transition: background-color 0.3s ease; }
.category-card:hover { background-color: #fdfdfd; }
.category-info h3 { font-size: 16px; color: #1a1a1a; margin: 0 0 6px 0; font-weight: 700; transition: color 0.3s ease; }
.category-card:hover .category-info h3 { color: #2eb872; }
.category-info span { font-size: 13px; color: #666; }

.category-image { width: 75px; height: 75px; background-color: #f3f4f6; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.category-image img { width: 85%; height: 85%; object-fit: contain; transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
.category-card:hover .category-image img { transform: scale(1.1); }

/* ==========================================
   6. REJILLA DE PRODUCTOS (TARJETAS COMPACTAS)
   ========================================== */
.woocommerce .related.products h2 { font-size: 22px !important; font-weight: 700 !important; color: #1a1a1a !important; margin-bottom: 25px !important; }

.woocommerce ul.products,
.shop-main-content ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0px !important;
    padding: 0 !important;
    margin: 0 !important;
}
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }

/* Contenedor de tarjeta */
ul.products li.product,
.woocommerce ul.products li.product {
    width: 100% !important;
    float: none !important;
    background-color: #ffffff !important;
    border: 1px solid #eaeaea !important;
    padding: 20px 16px !important;
    text-align: left !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    transition: box-shadow 0.3s ease, border-color 0.3s ease !important;
}

ul.products li.product:hover,
.woocommerce ul.products li.product:hover {
    box-shadow: 0 5px 25px rgba(0,0,0,0.06) !important;
    border-color: #dcdcdc !important;
}

ul.products li.product a,
.woocommerce ul.products li.product a {
    color: #1a1a1a !important;
    text-decoration: none !important;
}

ul.products li.product img,
.woocommerce ul.products li.product img.product-loop-image,
.woocommerce ul.products li.product a img {
    width: 100% !important;
    height: 170px !important;
    object-fit: contain !important;
    margin: 0 auto 12px auto !important;
    display: block !important;
    background: transparent !important;
}

ul.products li.product .star-rating,
ul.products li.product .onsale,
ul.products li.product .yith-wcbm-badge,
.woocommerce .star-rating {
    display: none !important;
}

ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin: 0 0 6px 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}

ul.products li.product .price,
.woocommerce ul.products li.product .price {
    font-family: system-ui, -apple-system, sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #e53935 !important;
    margin: 0 0 12px 0 !important;
    display: block !important;
}

ul.products li.product .price .woocommerce-price-suffix,
.woocommerce ul.products li.product .price .woocommerce-price-suffix {
    color: #8b8000 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    margin-left: 6px !important;
}

ul.products li.product .price del,
.woocommerce ul.products li.product .price del {
    color: #b3b3b3 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    margin-right: 6px !important;
    display: inline-block !important;
}
ul.products li.product .price ins,
.woocommerce ul.products li.product .price ins {
    text-decoration: none !important;
    display: inline-block !important;
}

/* Forzar contenedores YITH al 100% de ancho */
ul.products li.product .yith-ywraq-add-to-quote,
ul.products li.product .yith-ywraq-add-button,
ul.products li.product .ywraq-add-button-wrapper,
ul.products li.product .ywraq-add-to-quote {
    width: 100% !important;
    display: block !important;
    margin-top: auto !important;
    margin-bottom: 0 !important;
}

/* Botones en grilla: altura fija en 44px (con min/max/flex-basis a la vez)
   para que ninguna clase temporal que YITH agregue mientras espera la
   respuesta AJAX (estado "cargando") pueda estirar el botón, ya que la
   tarjeta es un flex-column y eso causaba un "salto" visual momentáneo. */
ul.products li.product a.add-request-quote-button,
ul.products li.product button.add-request-quote-button,
ul.products li.product .yith-ywraq-add-button a,
ul.products li.product .ywraq-add-to-quote a,
ul.products li.product .button,
ul.products li.product .add_to_cart_button,
.woocommerce ul.products li.product .button.add_to_cart_button {
    position: static !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    flex-basis: 44px !important;
    background-color: #2eb872 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 30px !important;
    padding: 0 !important;
    margin-top: auto !important;
    text-align: center !important;
    font-family: system-ui, -apple-system, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    text-transform: none !important;
    line-height: 44px !important;
    transition: background-color 0.2s ease !important;
    box-sizing: border-box !important;
}

ul.products li.product a.add-request-quote-button *,
ul.products li.product button.add-request-quote-button *,
ul.products li.product .yith-ywraq-add-button a * {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Blindaje del borde redondeado y del color en TODOS los estados
   (normal, hover, focus, active, y clases "loading"/"added" que YITH
   agrega momentáneamente). Se repite la clase dos veces a propósito
   (ej: .add-request-quote-button.add-request-quote-button) para subir
   la especificidad por encima de cualquier CSS que cargue después
   (como el propio CSS de YITH) sin depender del orden de carga. */
body ul.products li.product .button.button,
body ul.products li.product .add-request-quote-button.add-request-quote-button,
body ul.products li.product a.add-request-quote-button.add-request-quote-button,
body ul.products li.product button.add-request-quote-button.add-request-quote-button,
body ul.products li.product .yith-ywraq-add-button.yith-ywraq-add-button a,
body ul.products li.product .yith-ywraq-add-to-quote.yith-ywraq-add-to-quote,
body ul.products li.product .add_to_cart_button.add_to_cart_button,

body ul.products li.product .button.button:hover,
body ul.products li.product .add-request-quote-button.add-request-quote-button:hover,
body ul.products li.product a.add-request-quote-button.add-request-quote-button:hover,
body ul.products li.product button.add-request-quote-button.add-request-quote-button:hover,

body ul.products li.product .button.button:focus,
body ul.products li.product .add-request-quote-button.add-request-quote-button:focus,
body ul.products li.product a.add-request-quote-button.add-request-quote-button:focus,
body ul.products li.product button.add-request-quote-button.add-request-quote-button:focus,

body ul.products li.product .button.button:active,
body ul.products li.product .add-request-quote-button.add-request-quote-button:active,
body ul.products li.product a.add-request-quote-button.add-request-quote-button:active,
body ul.products li.product button.add-request-quote-button.add-request-quote-button:active,

body ul.products li.product .button.button.loading,
body ul.products li.product .add-request-quote-button.add-request-quote-button.loading,
body ul.products li.product .button.button.added,
body ul.products li.product .add-request-quote-button.add-request-quote-button.added {
    border-radius: 30px !important;
    -webkit-border-radius: 30px !important;
    background-color: #2eb872 !important;
    color: #ffffff !important;
    outline: none !important;
    box-shadow: none !important;
    transform: none !important;
}

ul.products li.product .button::after,
.woocommerce ul.products li.product .button.add_to_cart_button::after {
    display: none !important;
}

/* ==========================================
   7. VISTA DE PRODUCTO INDIVIDUAL
   ========================================== */
body.single-product #main-content,
body.single-product main,
.single-product .site-main {
    max-width: 1280px !important;
    width: 100% !important;
    margin: 20px auto 50px auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.single-product-wrap {
    padding-top: 20px !important;
    padding-bottom: 40px !important;
    display: block !important;
}

.single-product .shop-sidebar-area,
.single-product #main-content aside,
.single-product .site-main aside,
.single-product .widget_product_categories,
.single-product #secondary,
.woocommerce div.product .woocommerce-product-rating,
.woocommerce div.product .product_meta,
.woocommerce div.product .yith-wcwl-add-to-wishlist,
.woocommerce div.product .compare.button,
.woocommerce div.product .social-share,
.woocommerce-share,
.woocommerce div.product form.cart .yith-wcwl-add-button,
.woocommerce div.product form.cart .compare-button {
    display: none !important;
}

.single-product .shop-main-content,
.single-product .shop-grid-layout {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 1fr !important;
    display: block !important;
}

.woocommerce div.product {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    width: 100% !important;
    font-family: system-ui, -apple-system, sans-serif !important;
}

body.single-product form.cart button.single_add_to_cart_button,
body.single-product form.cart .single_add_to_cart_button,
body.single-product form.cart button[name="add-to-cart"],
body.single-product form.cart button.alt,
body.single-product form.cart button[type="submit"]:not(.add-request-quote-button) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    position: absolute !important;
    pointer-events: none !important;
}

.woocommerce div.product .product_title { font-size: 28px !important; font-weight: 600 !important; color: #1a1a1a !important; line-height: 1.3 !important; margin-bottom: 20px !important; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: #e53935 !important; font-size: 26px !important; font-weight: 700 !important; margin-bottom: 20px !important; display: block !important; }
.woocommerce div.product .woocommerce-product-details__short-description { font-size: 15px !important; color: #666666 !important; line-height: 1.6 !important; margin-bottom: 30px !important; }
.woocommerce div.product .woocommerce-product-details__short-description p { margin-bottom: 0 !important; }

.woocommerce div.product form.cart div.quantity { margin: 0 !important; display: flex !important; }
.woocommerce div.product form.cart div.quantity input.qty { width: 75px !important; height: 48px !important; border-radius: 4px !important; border: 1px solid #dddddd !important; background: #ffffff !important; text-align: center !important; font-size: 16px !important; color: #333 !important; padding: 0 10px !important; }

body.single-product div.product div.images img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: inline !important;
    margin: 0 auto !important;
}

.product-payment-banner { background-color: #f7f7f7 !important; padding: 25px 20px !important; border-radius: 8px !important; text-align: center !important; margin-top: 30px !important; border: none !important; width: 100% !important; box-sizing: border-box !important; }
.payment-icons { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px 15px !important; margin-bottom: 10px !important; }
.pay-icon { font-size: 12px; white-space: nowrap; }
.product-payment-banner p { font-size: 14px !important; color: #777777 !important; margin: 0 !important; }

.woocommerce div.product .woocommerce-tabs { width: 100% !important; clear: both !important; margin-top: 40px !important; padding-top: 30px !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; border-bottom: 1px solid #eaeaea !important; margin: 0 0 30px 0 !important; padding: 0 !important; list-style: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { border: none !important; background: transparent !important; margin: 0 15px !important; border-radius: 0 !important; padding: 0 !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 10px 5px !important; font-weight: 700 !important; font-size: 13px !important; color: #1a1a1a !important; text-transform: uppercase !important; border-bottom: 2px solid transparent !important; transition: all 0.3s ease !important; font-family: system-ui, -apple-system, sans-serif !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a, .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover { color: #2eb872 !important; border-bottom-color: #2eb872 !important; }
.woocommerce div.product .woocommerce-tabs .panel { color: #555 !important; font-size: 14px !important; line-height: 1.6 !important; margin-bottom: 60px !important; }
.woocommerce div.product .woocommerce-tabs .panel h2 { display: none !important; }

/* ==========================================
   8. ESTILOS TIENDA Y BARRA LATERAL (FILTROS)
   ========================================== */
body.woocommerce,
body.woocommerce-page,
body.archive {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-page #main-content,
.woocommerce #main-content,
.woocommerce-page main,
.woocommerce main {
    max-width: 1280px !important;
    width: 100% !important;
    margin: 20px auto 40px auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    float: none !important;
}

.shop-grid-layout {
  display: grid !important;
  grid-template-columns: 260px 1fr !important;
  gap: 30px !important;
  width: 100% !important;
}

.shop-sidebar-area .shop-widget,
.shop-sidebar .widget {
  margin-bottom: 35px !important;
  background: #fff;
  font-family: system-ui, -apple-system, sans-serif !important;
}

.shop-sidebar-area .widget-title,
.shop-sidebar .widget-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  margin-bottom: 20px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid #2eb872 !important;
  text-transform: capitalize !important;
}

.shop-sidebar-area ul,
.shop-sidebar ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.shop-sidebar-area ul li,
.shop-sidebar ul li {
  padding: 8px 0 !important;
  border-bottom: 1px solid #f0f0f0 !important;
  font-size: 14px !important;
  display: flex !important;
  justify-content: space-between !important;
  color: #666666 !important;
}

.shop-sidebar-area ul li a,
.shop-sidebar ul li a {
  color: #444 !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
}

.shop-sidebar-area ul li a:hover,
.shop-sidebar ul li a:hover {
  color: #2eb872 !important;
}

.widget_price_filter .price_slider_wrapper .ui-slider { background-color: #e5e5e5 !important; height: 4px !important; border-radius: 4px !important; margin-bottom: 20px !important; }
.widget_price_filter .ui-slider .ui-slider-range { background-color: #2eb872 !important; }
.widget_price_filter .ui-slider .ui-slider-handle { background-color: #ffffff !important; border: 2px solid #2eb872 !important; width: 14px !important; height: 14px !important; border-radius: 50% !important; top: -5px !important; outline: none !important; cursor: pointer !important; }
.widget_price_filter .price_slider_amount { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-direction: row-reverse !important; font-size: 14px !important; color: #666666 !important; }
.widget_price_filter .price_slider_amount .button { background-color: #1a1a1a !important; color: #ffffff !important; border-radius: 30px !important; padding: 6px 18px !important; font-size: 12px !important; font-weight: 600 !important; text-transform: capitalize !important; border: none !important; }
.widget_price_filter .price_slider_amount .button:hover { background-color: #333333 !important; }

.shop-main-content .woocommerce-before-shop-loop { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 30px !important; }
.woocommerce-result-count { color: #666666 !important; font-size: 14px !important; margin: 0 !important; }
.woocommerce-ordering select { border: none !important; color: #333333 !important; font-size: 14px !important; font-weight: 500 !important; cursor: pointer !important; background: transparent !important; outline: none !important; }

/* Paginación */
.woocommerce nav.woocommerce-pagination { margin-top: 50px !important; text-align: center !important; }
.woocommerce nav.woocommerce-pagination ul { border: none !important; margin: 0 !important; padding: 0 !important; display: inline-flex !important; gap: 15px !important; align-items: center !important; }
.woocommerce nav.woocommerce-pagination ul li { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
    display: flex !important; align-items: center !important; justify-content: center !important; width: 36px !important; height: 36px !important;
    border-radius: 50% !important; font-size: 14px !important; font-family: system-ui, -apple-system, sans-serif !important; font-weight: 600 !important;
    color: #333333 !important; text-decoration: none !important; padding: 0 !important; background: transparent !important; transition: all 0.3s ease !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current { background-color: #2eb872 !important; color: #ffffff !important; }
.woocommerce nav.woocommerce-pagination ul li a:hover { color: #2eb872 !important; }

/* ==========================================
   9. PÁGINA DEL CARRITO
   ========================================== */
.checkout-progress-bar { background-color: #fafafa !important; padding: 35px 0 !important; margin-bottom: 30px !important; border-bottom: 1px solid #f0f0f0 !important; }
.checkout-progress-bar .step { display: flex !important; align-items: center !important; gap: 12px !important; color: #666666 !important; font-weight: 600 !important; font-size: 16px !important; text-transform: uppercase !important; }
.checkout-progress-bar .step.active { color: #2eb872 !important; }
.checkout-progress-bar .step-number { width: 28px !important; height: 28px !important; border-radius: 50% !important; background-color: #e0e0e0 !important; color: #ffffff !important; display: flex !important; justify-content: center !important; align-items: center !important; font-size: 14px !important; }
.checkout-progress-bar .step.active .step-number { background-color: #2eb872 !important; }
.checkout-progress-bar .step-line { height: 1px !important; width: 80px !important; background-color: #e0e0e0 !important; margin: 0 20px !important; }

.woocommerce-cart .woocommerce {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    max-width: 1280px !important;
    width: 100% !important;
    margin: 0 auto !important;
    gap: 30px !important;
}

.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper,
.woocommerce-cart .woocommerce > .woocommerce-message,
.woocommerce-cart .woocommerce > .woocommerce-error,
.woocommerce-cart .woocommerce > .woocommerce-info {
    flex: 0 0 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 30px 0 !important;
}

.woocommerce-message { display: none !important; }

.woocommerce-cart .woocommerce-cart-form {
    flex: 1 1 63% !important;
    width: 63% !important;
    margin: 0 !important;
}

.woocommerce-cart .cart-collaterals {
    flex: 1 1 33% !important;
    width: 33% !important;
    margin: 0 !important;
}

.woocommerce table.shop_table { border: none !important; border-radius: 0 !important; }
.woocommerce table.shop_table th { background: transparent !important; border-bottom: 1px solid #eeeeee !important; border-top: none !important; text-transform: uppercase !important; font-size: 14px !important; color: #1a1a1a !important; font-weight: 700 !important; padding: 15px 0 !important; }

.woocommerce table.shop_table th.product-price,
.woocommerce table.shop_table td.product-price { width: 15% !important; text-align: center !important; }
.woocommerce table.shop_table th.product-quantity,
.woocommerce table.shop_table td.product-quantity { width: 18% !important; text-align: center !important; }
.woocommerce table.shop_table th.product-subtotal,
.woocommerce table.shop_table td.product-subtotal { width: 15% !important; text-align: right !important; padding-left: 20px !important; }

.woocommerce table.shop_table td { border-bottom: 1px solid #eeeeee !important; border-top: none !important; padding: 20px 0 !important; vertical-align: middle !important; }
.woocommerce table.shop_table td.product-remove a.remove { color: #e53935 !important; font-weight: 800 !important; font-size: 20px !important; display: block !important; background: transparent !important; line-height: 1 !important; }
.woocommerce table.shop_table td.product-remove a.remove:hover { background: transparent !important; color: #d32f2f !important; }
.woocommerce table.shop_table td.product-thumbnail img { width: 70px !important; border-radius: 8px !important; box-shadow: none !important; border: 1px solid #f0f0f0 !important; }
.woocommerce table.shop_table td.product-name a { color: #1a1a1a !important; font-weight: 500 !important; text-decoration: none !important; }
.woocommerce table.shop_table td.product-price .amount { color: #666666 !important; font-weight: 500 !important; }
.woocommerce table.shop_table td.product-subtotal .amount { color: #2eb872 !important; font-weight: 600 !important; }

.woocommerce table.shop_table td.actions { padding: 30px 0 10px 0 !important; border: none !important; }
.woocommerce table.shop_table td.actions .coupon { display: flex !important; gap: 10px !important; float: left !important; }
.woocommerce table.shop_table td.actions .coupon input.input-text { border: 1px solid #e0e0e0 !important; border-radius: 4px !important; padding: 12px 15px !important; width: 200px !important; }
.woocommerce table.shop_table td.actions .button { background-color: #2eb872 !important; color: #ffffff !important; border-radius: 30px !important; padding: 12px 25px !important; font-weight: 600 !important; border: none !important; }
.woocommerce table.shop_table td.actions > .button { float: right !important; background-color: #eeeeee !important; color: #666666 !important; }

.woocommerce-cart .cart-collaterals .cart_totals { border: 1px solid #e5e5e5 !important; border-radius: 8px !important; padding: 35px !important; width: 100% !important; float: none !important; background: #ffffff !important; }
.woocommerce-cart .cart-collaterals .cart_totals h2 { font-size: 26px !important; font-weight: 700 !important; color: #1a1a1a !important; margin-bottom: 25px !important; border-bottom: none !important; }
.woocommerce-cart .cart-collaterals .cart_totals table { border: none !important; margin-bottom: 30px !important; }
.woocommerce-cart .cart-collaterals .cart_totals table th { background: transparent !important; border-top: none !important; border-bottom: 1px solid #f0f0f0 !important; padding: 15px 0 !important; color: #1a1a1a !important; font-weight: 500 !important; }
.woocommerce-cart .cart-collaterals .cart_totals table td { border-top: none !important; border-bottom: 1px solid #f0f0f0 !important; padding: 15px 0 !important; text-align: right !important; }
.woocommerce-cart .cart-collaterals .cart_totals table td .amount { color: #2eb872 !important; font-weight: 600 !important; }
.woocommerce-cart .cart-collaterals .cart_totals table tr.order-total th, .woocommerce-cart .cart-collaterals .cart_totals table tr.order-total td { border-bottom: none !important; padding-top: 25px !important; }
.woocommerce-cart .cart-collaterals .cart_totals table tr.order-total th { font-size: 18px !important; font-weight: 700 !important; }
.woocommerce-cart .cart-collaterals .cart_totals table tr.order-total td .amount { font-size: 24px !important; font-weight: 800 !important; }
.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout { padding: 0 !important; }
.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout a.checkout-button { background-color: #2eb872 !important; color: #ffffff !important; border-radius: 30px !important; padding: 16px 0 !important; font-size: 16px !important; font-weight: 700 !important; text-align: center !important; display: block !important; width: 100% !important; }
.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout a.checkout-button:hover { background-color: #259e61 !important; }

/* ==========================================
   10. OFF-CANVAS DEL CARRITO Y PRESUPUESTO
   ========================================== */
.woocommerce a.added_to_cart { display: none !important; }

.cart-toggle-btn { background: none; border: none; cursor: pointer; padding: 0; }

/* Contenedor base de ambos paneles off-canvas (menú móvil y presupuesto).
   Implementación única (ya no hay reglas duplicadas/contradictorias):
   flex-column con altura fija a 100vh, header y footer con tamaño fijo
   (flex: 0 0 auto) y el cuerpo con flex:1 + overflow-y:auto + min-height:0.
   El min-height:0 es imprescindible: sin él, un hijo flex con overflow
   tiende a crecer para mostrar todo su contenido en vez de scrollear,
   sobre todo en navegadores móviles. */
.cart-menu-drawer,
#mini-cart-drawer {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    width: 420px !important;
    max-width: 90vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    z-index: 999999 !important;
    transform: translateX(100%) !important;
    visibility: hidden !important;
    pointer-events: none !important;
    box-shadow: -4px 0 25px rgba(0, 0, 0, 0.15) !important;
    background: #ffffff !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    font-family: system-ui, -apple-system, sans-serif;
}

.cart-menu-drawer.active,
#mini-cart-drawer.is-open {
    transform: translateX(0) !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

.cart-drawer-header {
  flex: 0 0 auto !important;
  background: #f7f7f5; color: #1a1a1a; padding: 22px 25px; display: flex;
  justify-content: space-between; align-items: center; font-weight: 600; font-size: 20px;
}
.cart-drawer-header .btn-close-drawer { color: #2eb872; font-size: 30px; background: none; border: none; cursor: pointer; line-height: 1; padding: 0; }

.cart-drawer-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 25px;
    display: flex;
    flex-direction: column;
}
.widget_shopping_cart_content { display: flex; flex-direction: column; height: 100%; }

ul.woocommerce-mini-cart { flex: 1; list-style: none; padding: 0; margin: 0; }
ul.woocommerce-mini-cart li { display: flex !important; flex-wrap: wrap !important; position: relative !important; padding: 20px 0 !important; border-bottom: 1px solid #eaeaea !important; }
ul.woocommerce-mini-cart li > a:not(.remove) { display: flex !important; align-items: flex-start !important; width: 100% !important; text-decoration: none !important; color: #1a1a1a !important; font-size: 13px !important; font-weight: 500 !important; text-transform: uppercase !important; padding-right: 25px !important; line-height: 1.4 !important; }
ul.woocommerce-mini-cart li img { width: 65px !important; height: auto !important; margin-right: 15px !important; border-radius: 4px !important; }
ul.woocommerce-mini-cart li .quantity { width: 100% !important; padding-left: 80px !important; margin-top: -15px !important; color: #2eb872 !important; font-size: 15px !important; font-weight: 500 !important; }

ul.woocommerce-mini-cart li a.remove {
  position: absolute !important; top: 20px !important; right: 0 !important; color: #666 !important;
  font-size: 16px !important; border: 1px solid #ccc !important; border-radius: 50% !important;
  width: 18px !important; height: 18px !important; line-height: 16px !important; text-align: center !important;
  text-decoration: none !important; background: #fff !important;
}
ul.woocommerce-mini-cart li a.remove:hover { border-color: #ff3b30 !important; color: #ff3b30 !important; }

.woocommerce-mini-cart__total { border-top: none !important; display: flex !important; justify-content: space-between !important; align-items: center !important; font-size: 16px !important; color: #1a1a1a !important; padding-top: 20px !important; }
.woocommerce-mini-cart__total strong { font-weight: 400 !important; }
.woocommerce-mini-cart__total .amount { font-size: 24px !important; font-weight: 400 !important; }

.woocommerce-mini-cart__buttons { margin-top: 15px !important; display: flex !important; flex-direction: column !important; flex: 0 0 auto !important; }
.woocommerce-mini-cart__buttons a.button.wc-forward:not(.checkout) { display: none !important; }
.woocommerce-mini-cart__buttons a.checkout {
  display: block !important; width: 100% !important; background-color: #1a1a1a !important; color: #ffffff !important;
  text-align: center !important; padding: 18px !important; border-radius: 40px !important; font-size: 16px !important;
  font-weight: 400 !important; text-decoration: none !important; transition: background 0.3s ease !important;
}
.woocommerce-mini-cart__buttons a.checkout:hover { background-color: #333333 !important; }

.quote-drawer-content { width: 100%; }
.quote-drawer-empty { color: #777; font-size: 14px; text-align: center; padding: 40px 0; }
.quote-drawer-content table.shop_table {
    width: 100% !important;
    font-size: 13px !important;
    border-collapse: collapse !important;
}
.quote-drawer-content table.shop_table th,
.quote-drawer-content table.shop_table td {
    padding: 10px 4px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    vertical-align: middle !important;
}
.quote-drawer-content table.shop_table img { width: 45px !important; height: auto !important; border-radius: 4px !important; }
.quote-drawer-content .quantity input.qty { width: 45px !important; padding: 4px !important; font-size: 13px !important; }
.quote-drawer-content .add-request-quote-button,
.quote-drawer-content a.button {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    padding: 12px !important;
    font-size: 13px !important;
    margin-top: 15px !important;
}

.site-footer .widget_shopping_cart,
.footer-col .widget_shopping_cart {
    display: none !important;
}

/* ==========================================
   11. PÁGINA "MI CUENTA" (ANCHO COMPLETO 1280px)
   ========================================== */
.woocommerce-account .woocommerce {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 30px !important;
    max-width: 1280px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

.woocommerce-MyAccount-navigation {
    width: 260px !important;
    flex: 0 0 260px !important;
    background: #fcfcfc !important;
    border-radius: 8px !important;
    padding: 15px 0 !important;
    border: 1px solid #eaeaea !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    float: none !important;
}

.woocommerce-MyAccount-navigation ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.woocommerce-MyAccount-navigation ul li { margin: 0 !important; border-bottom: 1px solid #f2f2f2 !important; }
.woocommerce-MyAccount-navigation ul li:last-child { border-bottom: none !important; }
.woocommerce-MyAccount-navigation ul li a {
    display: block !important; padding: 14px 20px !important; color: #555555 !important;
    text-decoration: none !important; font-weight: 500 !important; font-size: 14px !important;
    transition: all 0.3s ease !important; border-left: 3px solid transparent !important;
}
.woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-MyAccount-navigation ul li.is-active a {
    color: #2eb872 !important; background-color: #ffffff !important; border-left: 3px solid #2eb872 !important; font-weight: 700 !important;
}

.woocommerce-MyAccount-content {
    flex: 1 !important;
    width: auto !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    padding: 35px !important;
    border: 1px solid #eaeaea !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.02) !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    float: none !important;
}
.woocommerce-MyAccount-content p { font-size: 15px !important; color: #444 !important; line-height: 1.6 !important; }
.woocommerce-MyAccount-content a { color: #2eb872 !important; text-decoration: none !important; font-weight: 600 !important; }
.woocommerce-MyAccount-content a:hover { text-decoration: underline !important; }

/* ==========================================
   12. ESTILOS PÁGINA SOBRE NOSOTROS
   ========================================== */
.about-us-page { max-width: 1080px; margin: 0 auto; padding: 30px 20px 60px 20px; color: #333333; }
.text-center { text-align: center; }
.about-header h1 { font-size: 32px; font-weight: 800; color: #1a1a1a; margin-bottom: 25px; text-align: center; }
.about-hero-image img { width: 100%; max-height: 480px; object-fit: cover; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.06); margin-bottom: 40px; }
.about-block { margin-bottom: 50px; }
.about-block h2 { font-size: 24px; font-weight: 700; color: #1a1a1a; margin-bottom: 18px; }
.about-block p { font-size: 15px; line-height: 1.7; color: #555555; max-width: 850px; margin: 0 auto 12px auto; }

.values-list { max-width: 750px; margin: 30px auto 0 auto; display: flex; flex-direction: column; gap: 22px; }
.value-item { display: flex; align-items: flex-start; gap: 20px; text-align: left; }
.value-icon { flex: 0 0 40px; padding-top: 2px; }
.value-text h3 { font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0 0 4px 0; }
.value-text p { font-size: 14px; margin: 0; }

.services-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 30px; }
.service-card { background: #ffffff; border-radius: 8px; overflow: hidden; text-align: center; }
.card-img-holder { height: 160px; background: #f4f4f6; overflow: hidden; }
.card-img-holder img { width: 100%; height: 100%; object-fit: cover; }
.service-card h3 { font-size: 15px; font-weight: 700; margin: 15px 0 8px 0; color: #1a1a1a; }
.service-card p { font-size: 13px; padding: 0 10px 15px 10px; color: #666; }

.cta-buttons { display: flex; justify-content: center; gap: 15px; margin-top: 25px; }
.btn-green { background: #2eb872; color: #ffffff; padding: 12px 28px; border-radius: 30px; text-decoration: none; font-weight: 600; font-size: 14px; transition: background 0.2s ease; }
.btn-green:hover { background: #23985d; }

/* ==========================================
   13. FORMINATOR - FORMULARIO DE REGISTRO
   ========================================== */
.forminator-custom-form {
    width: 100% !important; max-width: 1100px !important; margin: 40px auto !important;
    background: #ffffff !important; border: 1px solid #eaeaea !important; border-radius: 12px !important;
    padding: 50px 60px !important; box-shadow: 0 4px 20px rgba(0,0,0,0.04) !important; box-sizing: border-box !important;
}

.forminator-custom-form .forminator-row:has(.forminator-repeater-label) { flex-direction: column !important; align-items: flex-start !important; }
.forminator-custom-form .forminator-label.forminator-repeater-label,
.forminator-custom-form .forminator-repeater-label {
    width: 100% !important; flex: 0 0 100% !important; max-width: 100% !important; display: block !important;
    white-space: normal !important; font-size: 20px !important; font-weight: 800 !important; color: #1a1a1a !important;
    letter-spacing: -0.3px !important; margin: 35px 0 20px 0 !important; padding-bottom: 10px !important;
    border-bottom: 2px solid #2eb872 !important; text-align: left !important;
}
.forminator-custom-form .forminator-row:first-child .forminator-repeater-label { margin-top: 0 !important; }

.forminator-custom-form .forminator-row { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; margin-bottom: 16px !important; width: 100% !important; }
.forminator-custom-form .forminator-col { width: 100% !important; flex: 1 !important; }
.forminator-custom-form .forminator-field { display: flex !important; flex-direction: row !important; align-items: center !important; width: 100% !important; }

.forminator-custom-form .forminator-label:not(.forminator-repeater-label) {
    width: 380px !important; flex: 0 0 380px !important; font-size: 14px !important; font-weight: 500 !important;
    color: #444444 !important; margin: 0 !important; padding-right: 25px !important; box-sizing: border-box !important; white-space: nowrap !important;
}

.forminator-custom-form .forminator-input-with-icon,
.forminator-custom-form .forminator-field > input,
.forminator-custom-form .forminator-field > select,
.forminator-custom-form .forminator-field > textarea,
.forminator-custom-form .forminator-field > div:not(.forminator-label) { flex: 1 1 100% !important; width: 100% !important; }

.forminator-custom-form input.forminator-input,
.forminator-custom-form select {
    width: 100% !important; height: 38px !important; background-color: #f5f5f7 !important; border: 1px solid #e5e5e7 !important;
    border-radius: 4px !important; padding: 0 14px !important; font-size: 14px !important; color: #1a1a1a !important; box-sizing: border-box !important; outline: none !important; transition: all 0.2s ease !important;
}

.forminator-custom-form textarea.forminator-textarea {
    width: 100% !important; height: 90px !important; background-color: #f5f5f7 !important; border: 1px solid #e5e5e7 !important;
    border-radius: 4px !important; padding: 10px 14px !important; font-size: 14px !important; color: #1a1a1a !important; box-sizing: border-box !important; outline: none !important;
}

.forminator-custom-form input.forminator-input:focus,
.forminator-custom-form select:focus,
.forminator-custom-form textarea.forminator-textarea:focus {
    background-color: #ffffff !important; border-color: #2eb872 !important; box-shadow: 0 0 0 3px rgba(46, 184, 114, 0.12) !important;
}

.forminator-custom-form .forminator-button-submit {
    margin-left: 380px !important; margin-top: 30px !important; background-color: #1a1a1a !important; color: #ffffff !important;
    border-radius: 30px !important; padding: 12px 45px !important; font-size: 14px !important; font-weight: 600 !important; border: none !important; cursor: pointer !important; transition: background 0.3s ease !important;
}
.forminator-custom-form .forminator-button-submit:hover { background-color: #2eb872 !important; }

/* ==========================================
   14. FOOTER Y PRE-FOOTER
   ========================================== */
.footer-newsletter-bar { background-color: #0d4232 !important; color: #ffffff !important; padding: 30px 0 !important; font-family: system-ui, -apple-system, sans-serif !important; }
.footer-newsletter-container { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important; }
.newsletter-info { display: flex !important; align-items: center !important; gap: 15px !important; }
.newsletter-info .icon-mail { font-size: 32px !important; }
.newsletter-text h3 { margin: 0 !important; font-size: 18px !important; font-weight: 700 !important; color: #ffffff !important; }
.newsletter-text p { margin: 3px 0 0 0 !important; font-size: 13px !important; color: #a3c2b8 !important; }

.newsletter-form { display: flex !important; background: #ffffff !important; border-radius: 30px !important; padding: 4px !important; width: 42% !important; }
.newsletter-form input { border: none !important; background: transparent !important; padding: 10px 20px !important; font-size: 14px !important; width: 100% !important; outline: none !important; color: #333 !important; }
.newsletter-form button { background-color: #2eb872 !important; color: #ffffff !important; border: none !important; border-radius: 25px !important; padding: 10px 28px !important; font-weight: 600 !important; font-size: 13px !important; cursor: pointer !important; transition: background 0.3s ease !important; }
.newsletter-form button:hover { background-color: #259e61 !important; }

.footer-phone { display: flex !important; align-items: center !important; gap: 12px !important; }
.footer-phone .icon-phone { font-size: 28px !important; }
.footer-phone small { display: block !important; font-size: 11px !important; color: #a3c2b8 !important; text-transform: uppercase !important; }
.footer-phone strong { font-size: 18px !important; color: #ffffff !important; }

.footer-features-bar { background-color: #0d4232 !important; border-bottom: 1px solid #eaeaea !important; padding: 30px 0 !important; font-family: system-ui, -apple-system, sans-serif !important; }
.footer-features-container { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 20px !important; }
.feature-item { display: flex !important; align-items: center !important; gap: 15px !important; }
.feature-icon { font-size: 28px !important; }
.feature-item strong { display: block !important; font-size: 14px !important; color: white !important; }
.feature-item p { margin: 2px 0 0 0 !important; font-size: 12px !important; color: white !important; }

.site-footer { background-color: #ffffff !important; padding-top: 50px !important; font-family: system-ui, -apple-system, sans-serif !important; }
.footer-widgets-grid { display: grid !important; grid-template-columns: 2fr 1fr 1fr 1.5fr !important; gap: 40px !important; padding-bottom: 40px !important; border-bottom: 1px solid #eaeaea !important; }
.footer-col h4 { font-size: 13px !important; font-weight: 700 !important; color: #1a1a1a !important; margin-bottom: 20px !important; letter-spacing: 0.5px !important; text-transform: uppercase !important; }
.footer-col p { font-size: 13px !important; color: #666666 !important; line-height: 1.6 !important; }
.footer-col ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.footer-col ul li { margin-bottom: 10px !important; }
.footer-col ul li a { color: #666666 !important; text-decoration: none !important; font-size: 13px !important; transition: color 0.3s ease !important; }
.footer-col ul li a:hover { color: #2eb872 !important; }
.footer-logo { max-width: 130px !important; margin-bottom: 15px !important; }
.footer-bottom { padding: 20px 0 !important; text-align: center !important; font-size: 13px !important; color: #999999 !important; }

/* ==========================================
   15. MENÚ OFF-CANVAS NAVEGACIÓN MÓVIL
   ========================================== */
.btn-mobile-toggle { display: none; background: none; border: none; cursor: pointer; padding: 5px; }

.mobile-menu-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100vh;
  background: rgba(0, 0, 0, 0.5); z-index: 99998; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease;
}
.mobile-menu-overlay.active { opacity: 1; visibility: visible; }

.mobile-menu-drawer {
  position: fixed; top: 0; left: 0; width: 320px; max-width: 85%; height: 100vh; max-height: 100vh;
  background: #ffffff; z-index: 99999; transform: translateX(-100%); transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  display: flex; flex-direction: column; overflow: hidden;
  box-shadow: 4px 0 25px rgba(0,0,0,0.15); font-family: system-ui, -apple-system, sans-serif;
}
.mobile-menu-drawer.active { transform: translateX(0); }

.mobile-drawer-top { flex: 0 0 auto; padding: 20px 15px; text-align: center; font-size: 13px; color: #555; background: #ffffff; border-bottom: 1px solid #eeeeee; }
.mobile-drawer-top .drawer-notice { margin: 0 0 8px 0; }
.mobile-drawer-top .drawer-notice a { color: #2eb872; text-decoration: underline; }
.mobile-drawer-top .drawer-phone { margin: 0 0 12px 0; font-size: 13px; }

.drawer-user-links { margin: 12px 0; font-weight: 600; color: #333; }
.drawer-user-links a { color: #333; text-decoration: none; }
.drawer-extra-actions { display: flex; justify-content: center; gap: 15px; margin: 12px 0; font-size: 12px; color: #666; }
.drawer-dropdowns { display: flex; border-top: 1px solid #eee; margin-top: 12px; padding-top: 12px; }
.drawer-drop-item { flex: 1; padding: 6px; font-weight: 600; color: #333; font-size: 13px; }
.drawer-drop-item:first-child { border-right: 1px solid #eee; }

.mobile-drawer-header { flex: 0 0 auto; background: #222529; color: #ffffff; padding: 12px 20px; display: flex; justify-content: space-between; align-items: center; font-weight: 800; font-size: 15px; letter-spacing: 0.5px; }
.btn-close-drawer { background: none; border: none; color: #ffffff; font-size: 20px; cursor: pointer; line-height: 1; }

.mobile-drawer-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0;
}
.mobile-menu-list { list-style: none; margin: 0; padding: 0; }
.mobile-menu-list li { border-bottom: 1px solid #f0f0f0; }
.mobile-menu-list a { display: flex; justify-content: space-between; align-items: center; padding: 14px 20px; color: #222222; font-weight: 700; font-size: 14px; text-decoration: none; transition: color 0.2s; }
.mobile-menu-list a:hover { color: #2eb872; }
.mobile-menu-list li.menu-item-has-children > a::after { content: '+'; font-size: 16px; color: #666; font-weight: 400; }

/* ==========================================
   16. BOTÓN YITH "AÑADIR AL PRESUPUESTO"
   ========================================== */
.yith-ywraq-add-to-quote,
.yith-ywraq-add-button,
.ywraq-add-button-wrapper,
.ywraq-add-to-quote {
    display: inline-block !important;
    margin: 0 !important;
}

a.add-request-quote-button,
button.add-request-quote-button,
.yith-ywraq-add-button a,
.yith-ywraq-add-button a.button,
.ywraq-add-to-quote a {
    background-color: #2eb872 !important;
    color: #ffffff !important;
    border-radius: 35px !important;
    border: none !important;
    box-shadow: none !important;
    padding: 12px 28px !important;
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    line-height: 1.3 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background-color 0.2s ease !important;
}

a.add-request-quote-button:hover,
button.add-request-quote-button:hover,
.yith-ywraq-add-button a:hover,
.yith-ywraq-add-button a.button:hover,
.ywraq-add-to-quote a:hover {
    background-color: #259e61 !important;
    color: #ffffff !important;
}

/* ==========================================
   17. PRODUCTO INDIVIDUAL - ESCRITORIO (>= 992px)
   ========================================== */
@media (min-width: 992px) {
    .woocommerce div.product div.images,
    .woocommerce-page div.product div.images {
        width: 48% !important;
        max-width: 48% !important;
        flex: 0 0 48% !important;
        margin-bottom: 30px !important;
    }

    .woocommerce div.product div.summary,
    .woocommerce-page div.product div.summary {
        width: 48% !important;
        max-width: 48% !important;
        flex: 0 0 48% !important;
        margin-bottom: 30px !important;
    }

    .woocommerce div.product form.cart {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 15px !important;
        margin-bottom: 30px !important;
        width: 100% !important;
    }

    .yith-ywraq-add-to-quote,
    .yith-ywraq-add-button,
    .ywraq-add-button-wrapper,
    .ywraq-add-to-quote {
        width: auto !important;
        display: inline-block !important;
    }

    a.add-request-quote-button,
    button.add-request-quote-button,
    .yith-ywraq-add-button a,
    .ywraq-add-to-quote a {
        width: auto !important;
        white-space: nowrap !important;
        padding: 12px 28px !important;
    }
}

/* ==========================================
   18. PRODUCTO INDIVIDUAL - MÓVIL Y TABLET (<= 991px)
   ========================================== */
@media (max-width: 991px) {
    .woocommerce div.product,
    .woocommerce-page div.product,
    body.single-product div.product {
        display: inline !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .woocommerce div.product div.images,
    .woocommerce div.product div.summary,
    .woocommerce-page div.product div.images,
    .woocommerce-page div.product div.summary,
    body.single-product div.product div.images,
    body.single-product div.product div.summary {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        float: none !important;
        clear: both !important;
        margin: 0 0 20px 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    .woocommerce div.product div.summary {
        text-align: center !important;
    }

    .woocommerce div.product div.summary .price,
    .woocommerce div.product div.summary .product_title,
    .woocommerce div.product div.summary .woocommerce-product-details__short-description {
        width: 100% !important;
        text-align: center !important;
    }

    .woocommerce div.product form.cart {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        gap: 15px !important;
        margin: 20px 0 30px 0 !important;
    }

    .woocommerce div.product form.cart div.quantity {
        margin: 0 auto !important;
        justify-content: center !important;
    }

    .yith-ywraq-add-to-quote,
    .yith-ywraq-add-button,
    .ywraq-add-button-wrapper,
    .ywraq-add-to-quote {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        margin: 0 !important;
    }

    a.add-request-quote-button,
    button.add-request-quote-button,
    .yith-ywraq-add-button a,
    .yith-ywraq-add-button a.button,
    .ywraq-add-to-quote a {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        padding: 14px 20px !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    .product-payment-banner,
    .summary div[class*="payment"],
    .summary div[class*="guarantee"] {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
        left: 0 !important;
    }
}

/* ==========================================
   19. SLIDER PRODUCTOS RELACIONADOS
   ========================================== */
.related.products.swiper {
    overflow: hidden !important;
    position: relative !important;
    padding: 10px 2px !important;
}

.related.products.swiper ul.products.swiper-wrapper {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.related.products.swiper ul.products li.product.swiper-slide {
    width: auto !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
}

.related.products ul.products li.product .woocommerce-loop-product__title {
    font-size: 13px !important;
    height: 36px !important;
}

.related.products .add-request-quote-button {
    font-size: 12px !important;
    padding: 9px 10px !important;
    border-radius: 25px !important;
    width: auto !important;
}

.related-slider-outer-wrapper {
    position: relative !important;
    padding: 0 45px !important;
    margin: 30px 0 !important;
    overflow: visible !important;
}

.related-swiper {
    overflow: hidden !important;
    width: 100% !important;
}

.related-slider-outer-wrapper .swiper-button-next,
.related-slider-outer-wrapper .swiper-button-prev {
    color: #2eb872 !important;
    background: #ffffff !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    border: 1px solid #e0e0e0 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin-top: 0 !important;
    z-index: 99 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: all 0.2s ease !important;
}

.related-slider-outer-wrapper .swiper-button-prev { left: 0 !important; }
.related-slider-outer-wrapper .swiper-button-next { right: 0 !important; }

.related-slider-outer-wrapper .swiper-button-next:hover,
.related-slider-outer-wrapper .swiper-button-prev:hover {
    background: #2eb872 !important;
    color: #ffffff !important;
    border-color: #2eb872 !important;
}

.related-slider-outer-wrapper .swiper-button-next:after,
.related-slider-outer-wrapper .swiper-button-prev:after {
    font-size: 16px !important;
    font-weight: 700 !important;
}

/* ==========================================
   20. LOGIN / REGISTRO B2B
   ========================================== */
body.woocommerce-account:not(.logged-in) .woocommerce {
    max-width: 900px !important;
    margin: 20px auto 80px auto !important;
    padding: 0 20px !important;
}

.woocommerce-account h2:first-child {
    display: none;
}

.woocommerce-account form.woocommerce-form-login,
.woocommerce-account form.woocommerce-form-register {
    max-width: 440px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #eef2ef;
    border-radius: 16px;
    padding: 40px 35px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.woocommerce-account form.login h2,
.woocommerce-account form.register h2 {
    display: block !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin-bottom: 25px !important;
    text-align: center !important;
}

.woocommerce-account form .form-row label {
    font-size: 14px;
    font-weight: 600;
    color: #333333;
    margin-bottom: 8px;
    display: block;
}

.woocommerce-account form .form-row input.input-text {
    width: 100%;
    height: 48px;
    padding: 0 16px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    font-size: 14px;
    background-color: #fcfcfc;
    transition: all 0.25s ease;
    box-sizing: border-box;
}

.woocommerce-account form .form-row input.input-text:focus {
    border-color: #2eb872;
    background-color: #ffffff;
    outline: none;
    box-shadow: 0 0 0 3px rgba(46, 184, 114, 0.15);
}

.woocommerce-account form .form-row button.button,
.woocommerce-account form .form-row .woocommerce-Button {
    width: 100%;
    height: 48px;
    background-color: #2eb872 !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    border-radius: 24px !important;
    border: none !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease, transform 0.1s ease !important;
    margin-top: 15px;
}

.woocommerce-account form .form-row button.button:hover {
    background-color: #24965d !important;
}

.woocommerce-account form .woocommerce-form-login__rememberme {
    margin-top: 15px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #555555;
}

.woocommerce-account form .woocommerce-form-login__rememberme input[type="checkbox"] {
    accent-color: #2eb872;
    width: 16px;
    height: 16px;
}

.woocommerce-account form .woocommerce-LostPassword {
    text-align: center;
    margin-top: 20px;
    font-size: 13px;
}

.woocommerce-account form .woocommerce-LostPassword a {
    color: #777777;
    text-decoration: none;
    transition: color 0.2s ease;
}

.woocommerce-account form .woocommerce-LostPassword a:hover {
    color: #2eb872;
    text-decoration: underline;
}

body.woocommerce-account:not(.logged-in) .woocommerce h2 {
    display: none !important;
}

body.woocommerce-account:not(.logged-in) .woocommerce {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
}

body.woocommerce-account:not(.logged-in) #customer_login,
body.woocommerce-account:not(.logged-in) .u-columns {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 auto !important;
}

body.woocommerce-account:not(.logged-in) .u-column1,
body.woocommerce-account:not(.logged-in) .u-column2 {
    width: 100% !important;
    max-width: 440px !important;
    float: none !important;
    margin: 0 auto 30px auto !important;
    padding: 0 !important;
}

.b2b-register-block {
    margin-top: 25px;
    text-align: center;
}

.b2b-divider {
    border: none;
    border-top: 1px solid #eee;
    margin: 20px 0;
}

.b2b-register-title {
    font-size: 14px;
    font-weight: 600;
    color: #444;
    margin-bottom: 12px !important;
}

.b2b-register-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px;
    border: 2px solid #2eb872;
    background-color: #f6fcf8;
    color: #2eb872 !important;
    font-size: 14px;
    font-weight: 700;
    border-radius: 22px;
    text-decoration: none !important;
    transition: all 0.25s ease;
    box-sizing: border-box;
}

.b2b-register-btn:hover {
    background-color: #2eb872;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(46, 184, 114, 0.2);
}

.b2b-register-info {
    font-size: 12px;
    color: #777;
    margin-top: 14px !important;
    line-height: 1.4;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    text-align: left;
    background: #f9f9fb;
    padding: 10px 12px;
    border-radius: 8px;
}

.b2b-register-info svg {
    flex-shrink: 0;
    margin-top: 2px;
    stroke: #2eb872;
}

/* ==========================================
   21. CONTENEDORES UNIFICADOS (1280px)
   ========================================== */
.site-header-custom,
.top-bar,
.middle-bar,
.bottom-bar,
.custom-breadcrumb-band {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.header-container,
.europa-contact-wrap,
#main-content,
.site-main-page,
#page,
#content,
#primary,
.site-content,
.entry-content,
.container,
.site-main,
.woocommerce,
.woocommerce-page,
.shop-layout-container {
    width: 100% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

.europa-map-box,
.europa-map-box iframe {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ==========================================
   22. REGLAS RESPONSIVAS GENERALES
   ========================================== */
@media (max-width: 1024px) {
    .shop-layout { flex-direction: column !important; }
    .shop-sidebar { width: 100% !important; margin-bottom: 30px !important; }
    .shop-main-content { width: 100% !important; }
    .footer-newsletter-container { flex-direction: column !important; text-align: center !important; }
    .newsletter-form { width: 100% !important; }
    .footer-features-container { grid-template-columns: repeat(2, 1fr) !important; }
    .footer-widgets-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 991px) {
    .btn-mobile-toggle { display: flex; align-items: center; }
    .top-bar { display: none; }
    .dynamic-main-menu { display: none; }
    .middle-bar-content { gap: 10px; }
    .site-search-form { max-width: 100%; }

    /* En móvil/tablet el panel off-canvas ocupa casi todo el ancho
       disponible en vez de un ancho fijo de 420px. */
    .cart-menu-drawer,
    #mini-cart-drawer {
        width: 100vw !important;
        max-width: 100vw !important;
    }

    .hero-grid { grid-template-columns: 1fr; height: auto; }
    .hero-slider { height: 400px; }
    .hero-banners { flex-direction: row; height: 200px; }
    .categories-grid { grid-template-columns: repeat(2, 1fr); }
    .shop-grid-layout { grid-template-columns: 1fr !important; }
    .checkout-progress-bar .step-line { width: 30px !important; }
    .checkout-progress-bar .step { font-size: 12px !important; }
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals { width: 100% !important; flex: 0 0 100% !important; margin-bottom: 40px !important; }

    .woocommerce ul.products,
    .shop-main-content ul.products { grid-template-columns: repeat(2, 1fr) !important; }

    .single-product-wrap { padding-top: 25px !important; padding-bottom: 25px !important; }

    .popular-categories-section { margin-top: 60px !important; }
}

@media (max-width: 900px) {
    .forminator-custom-form { padding: 30px !important; }
    .forminator-custom-form .forminator-field,
    .forminator-custom-form .forminator-row { flex-direction: column !important; align-items: flex-start !important; }
    .forminator-custom-form .forminator-label { width: 100% !important; flex: 0 0 100% !important; margin-bottom: 6px !important; white-space: normal !important; }
    .forminator-custom-form .forminator-button-submit { margin-left: 0 !important; width: 100% !important; }
}

@media (max-width: 820px) {
    .services-grid { grid-template-columns: repeat(2, 1fr); }
    .cta-buttons { flex-direction: column; align-items: center; }
}

@media (max-width: 768px) {
    .page .woocommerce, .woocommerce-account .woocommerce { flex-direction: column !important; }
    .woocommerce-MyAccount-navigation, .woocommerce-MyAccount-content { width: 100% !important; flex: 0 0 100% !important; }

    .related-slider-outer-wrapper { padding: 0 30px !important; }
    .related-slider-outer-wrapper .swiper-button-next,
    .related-slider-outer-wrapper .swiper-button-prev {
        width: 32px !important;
        height: 32px !important;
    }
    .related-slider-outer-wrapper .swiper-button-next:after,
    .related-slider-outer-wrapper .swiper-button-prev:after {
        font-size: 12px !important;
    }

    .woocommerce div.product .product_title { font-size: 22px !important; }
    .woocommerce div.product p.price, .woocommerce div.product span.price { font-size: 22px !important; }

    .blog-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

@media (max-width: 600px) {
    .footer-features-container { grid-template-columns: 1fr !important; }
    .footer-widgets-grid { grid-template-columns: 1fr !important; }
}

@media (max-width: 576px) {
    .hero-banners { flex-direction: column; height: 400px; }
    .btn-hero-slide { padding: 10px 24px; font-size: 13px; left: 20px; bottom: 30px; }
    .categories-grid { grid-template-columns: 1fr; }
    .categories-header { text-align: center; }

    .woocommerce ul.products,
    .shop-main-content ul.products { grid-template-columns: 1fr !important; }

    .blog-grid { grid-template-columns: 1fr !important; }

    /* Panel off-canvas: encabezado y controles un poco más compactos
       en pantallas muy pequeñas. */
    .cart-drawer-header,
    .mobile-drawer-header {
        padding: 16px 18px !important;
        font-size: 17px !important;
    }
}

/* ==========================================
   23. ESTILOS DEL LISTADO OFF-CANVAS DE YITH
   ========================================== */
.europa-quote-drawer-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.europa-quote-item {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 15px 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
    position: relative !important;
}

.europa-quote-thumb img {
    width: 60px !important;
    height: 60px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    border: 1px solid #eee !important;
}

.europa-quote-details {
    flex: 1 !important;
}

.europa-quote-title {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 8px !important;
    line-height: 1.3 !important;
}

.europa-quote-qty-controls {
    display: inline-flex !important;
    align-items: center !important;
    background: #f4f4f5 !important;
    border-radius: 20px !important;
    padding: 2px 6px !important;
}

.btn-quote-qty {
    background: none !important;
    border: none !important;
    width: 26px !important;
    height: 26px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #333 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: color 0.2s !important;
}

.btn-quote-qty:hover {
    color: #2eb872 !important;
}

.quote-qty-val {
    font-size: 13px !important;
    font-weight: 700 !important;
    padding: 0 8px !important;
    color: #1a1a1a !important;
}

.btn-quote-remove {
    background: none !important;
    border: none !important;
    font-size: 20px !important;
    color: #aaa !important;
    cursor: pointer !important;
    padding: 5px !important;
    line-height: 1 !important;
    transition: color 0.2s !important;
}

.btn-quote-remove:hover {
    color: #e53e3e !important;
}

/* ==========================================
   24. OCULTAR MENSAJES Y CARGADORES YITH
   ========================================== */
img.ajax-loading,
.ajax-loading,
.ywraq-loader,
.yith-ywraq-loader,
.ywraq-product-added,
.ywraq-already-in-list,
.ywraq-item-added-response,
.yith_ywraq_add_item_response_message,
.ywraq-browse-list,
.ywraq-add-button + div,
.ywraq-add-button + p,
.add-request-quote-button + div,
.add-request-quote-button + p,
.yith-ywraq-add-to-quote + div,
.yith_ywraq_add_item_product_message,
.hide-when-removed,
[class*="yith_ywraq_add_item_product-response-"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.add-request-quote-button,
.yith-ywraq-add-to-quote {
    display: inline-block !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* ==========================================
   25. ESTILOS PÁGINA "SOLICITA UN PRESUPUESTO" (YITH RAQ)
   ========================================== */
.page-template-default #main-content,
.yith-ywraq-request-quote,
.ywraq-wrapper {
    max-width: 1280px !important;
    width: 100% !important;
    margin: 20px auto 50px auto !important;
    padding: 0 20px !important;
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
}

.yith-ywraq-request-quote,
form#yith-ywraq-form {
    background: #ffffff !important;
    border: 1px solid #eaeaea !important;
    border-radius: 16px !important;
    padding: 35px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
    width: 100% !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
    float: none !important;
}

a.button.wc-backward,
.ywraq-return-to-shop a,
.yith-ywraq-request-quote a.button:not(.raq-send-request) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #f4f4f5 !important;
    color: #1a1a1a !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    padding: 12px 24px !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    border: 1px solid #e4e4e7 !important;
    transition: all 0.2s ease !important;
    margin-bottom: 25px !important;
}

a.button.wc-backward:hover,
.ywraq-return-to-shop a:hover {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    border-color: #1a1a1a !important;
}

table.yith-ywraq-list-table,
table.shop_table.cart.wishlist_table,
.yith-ywraq-request-quote table.shop_table {
    width: 100% !important;
    border-collapse: collapse !important;
    border: none !important;
    margin-bottom: 30px !important;
}

table.yith-ywraq-list-table th,
.yith-ywraq-request-quote table.shop_table th {
    background: #f7f7f5 !important;
    color: #1a1a1a !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 16px 20px !important;
    border-bottom: 2px solid #eaeaea !important;
    border-top: none !important;
}

table.yith-ywraq-list-table td,
.yith-ywraq-request-quote table.shop_table td {
    padding: 20px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    border-top: none !important;
    vertical-align: middle !important;
}

table.yith-ywraq-list-table td.product-thumbnail img,
.yith-ywraq-request-quote table.shop_table td.product-thumbnail img {
    width: 65px !important;
    height: 65px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
    border: 1px solid #eee !important;
}

table.yith-ywraq-list-table td.product-name a,
.yith-ywraq-request-quote table.shop_table td.product-name a {
    color: #1a1a1a !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

table.yith-ywraq-list-table td.product-name a:hover {
    color: #2eb872 !important;
}

table.yith-ywraq-list-table a.remove,
.yith-ywraq-request-quote table.shop_table a.remove {
    color: #aaa !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

table.yith-ywraq-list-table a.remove:hover,
.yith-ywraq-request-quote table.shop_table a.remove:hover {
    color: #e53935 !important;
}

.yith-ywraq-request-quote .quantity input.qty {
    width: 60px !important;
    height: 40px !important;
    background: #f5f5f7 !important;
    border: 1px solid #e5e5e7 !important;
    border-radius: 20px !important;
    text-align: center !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    color: #1a1a1a !important;
}

input[name="update_raq_list"],
.button.update-raq-list,
input.button[name="update_cart"] {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 12px 28px !important;
    border-radius: 30px !important;
    border: none !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
    display: inline-block !important;
    float: right !important;
}

input[name="update_raq_list"]:hover,
.button.update-raq-list:hover {
    background-color: #333333 !important;
}

.yith-ywraq-mail-form,
.raq-form-container {
    margin-top: 40px !important;
    padding-top: 30px !important;
    border-top: 2px solid #f0f0f0 !important;
    clear: both !important;
}

.yith-ywraq-mail-form h3,
.raq-form-container h3 {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    margin-bottom: 20px !important;
}

.yith-ywraq-mail-form input[type="text"],
.yith-ywraq-mail-form input[type="email"],
.yith-ywraq-mail-form textarea {
    width: 100% !important;
    background-color: #f5f5f7 !important;
    border: 1px solid #e5e5e7 !important;
    border-radius: 8px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    color: #1a1a1a !important;
    outline: none !important;
    box-sizing: border-box !important;
    margin-bottom: 15px !important;
}

.yith-ywraq-mail-form input:focus,
.yith-ywraq-mail-form textarea:focus {
    background-color: #ffffff !important;
    border-color: #2eb872 !important;
    box-shadow: 0 0 0 3px rgba(46, 184, 114, 0.12) !important;
}

.raq-send-request,
input.raq-send-request,
.yith-ywraq-mail-form input[type="submit"] {
    background-color: #2eb872 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    padding: 14px 35px !important;
    border-radius: 30px !important;
    border: none !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
    margin-top: 10px !important;
}

.raq-send-request:hover,
.yith-ywraq-mail-form input[type="submit"]:hover {
    background-color: #259e61 !important;
}

/* ==========================================
   26. ESTILOS BOTONES +/- DE CANTIDAD
   ========================================== */
.quantity {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

.quantity .qty-btn {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: #f3f4f6 !important;
    border: none !important;
    color: #1a1a1a !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: background 0.2s ease !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.quantity .qty-btn:hover {
    background: #e5e7eb !important;
}

.quantity input.qty {
    width: 45px !important;
    height: 32px !important;
    border: none !important;
    background: transparent !important;
    text-align: center !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    color: #1a1a1a !important;
    padding: 0 !important;
    margin: 0 !important;
    -moz-appearance: textfield !important;
}

.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* ==========================================
   27. ESPACIADO SUPERIOR Y CONTENEDOR PRINCIPAL
   ========================================== */
#main-content,
.site-main,
.woocommerce,
.woocommerce-page,
.shop-layout-container,
.woocommerce-account .woocommerce {
    margin-top: 15px !important;
    margin-bottom: 40px !important;
}

/* ==========================================
   28. PÁGINA DE BLOG (GRILLA 3 COLUMNAS Y TARJETAS)
   ========================================== */
.blog-page-container {
    max-width: 1280px !important;
    width: 100% !important;
    margin: 0 auto 60px auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.blog-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 35px 30px !important;
    margin-bottom: 50px !important;
}

.blog-card {
    background: #ffffff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform 0.3s ease !important;
}

.blog-card:hover {
    transform: translateY(-3px) !important;
}

.blog-card-image {
    display: block !important;
    width: 100% !important;
    height: 230px !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    margin-bottom: 18px !important;
}

.blog-card-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.4s ease !important;
}

.blog-card:hover .blog-card-image img {
    transform: scale(1.04) !important;
}

.blog-card-content {
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    align-items: flex-start !important;
}

.blog-card-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 0 0 8px 0 !important;
    color: #1a1a1a !important;
}

.blog-card-title a {
    color: #1a1a1a !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.blog-card-title a:hover {
    color: #2eb872 !important;
}

.blog-card-meta {
    font-size: 12px !important;
    color: #888888 !important;
    margin-bottom: 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

.blog-card-meta .sep {
    opacity: 0.5;
}

.blog-card-excerpt {
    font-size: 14px !important;
    color: #666666 !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
    flex-grow: 1 !important;
}

.btn-blog-readmore {
    display: inline-block !important;
    background-color: #1a1a1a !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 10px 24px !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    transition: background-color 0.25s ease !important;
    border: none !important;
}

.btn-blog-readmore:hover {
    background-color: #2eb872 !important;
    color: #ffffff !important;
}

/* Paginación del Blog */
.blog-pagination {
    text-align: center !important;
    margin-top: 40px !important;
}

.blog-pagination .nav-links {
    display: inline-flex !important;
    gap: 10px !important;
    align-items: center !important;
}

.blog-pagination a,
.blog-pagination span {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333333 !important;
    text-decoration: none !important;
    background: #f4f4f5 !important;
    transition: all 0.2s ease !important;
}

.blog-pagination span.current,
.blog-pagination a:hover {
    background-color: #2eb872 !important;
    color: #ffffff !important;
}

/* ==========================================
   29. ARTÍCULO INDIVIDUAL (SINGLE POST)
   ========================================== */
.single-post-container {
    max-width: 1280px !important;
    width: 100% !important;
    margin: 40px auto 80px auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
}

.single-post-article {
    max-width: 1000px;
    margin: 0 auto;
}

.single-post-title {
    font-size: 34px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    line-height: 1.3 !important;
    margin: 0 0 12px 0 !important;
}

.single-post-meta {
    font-size: 13px !important;
    color: #888888 !important;
    margin-bottom: 30px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.single-post-meta .sep {
    opacity: 0.5;
}

.single-post-meta .category a {
    color: #2eb872 !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.single-post-meta .category a:hover {
    text-decoration: underline !important;
}

.single-post-featured-image {
    width: 100% !important;
    max-height: 520px !important;
    overflow: hidden !important;
    border-radius: 12px !important;
    margin-bottom: 35px !important;
}

.single-post-featured-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.single-post-content {
    font-size: 16px !important;
    line-height: 1.8 !important;
    color: #444444 !important;
}

.single-post-content p {
    margin-bottom: 24px !important;
}

.single-post-content h2,
.single-post-content h3 {
    color: #1a1a1a !important;
    font-weight: 700 !important;
    margin: 35px 0 15px 0 !important;
}

#comments,
.comments-area,
.comment-respond,
#respond {
    display: none !important;
}

/* ==========================================
   EMPUJE FINAL PARA LIBERAR EL FOOTER
   ========================================== */
@media (max-width: 768px) {
    body::after {
        content: "";
        display: block !important;
        height: 150px !important; 
        width: 100% !important;
        clear: both !important;
    }
}
/* ==========================================
   ÍCONOS REDES SOCIALES FOOTER
   ========================================== */
.footer-social-icons {
    display: flex !important;
    gap: 18px !important; /* Separación horizontal entre íconos */
    margin-top: 15px !important;
    align-items: center !important;
}

.footer-social-icons a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #1a1a1a !important; /* Color gris oscuro casi negro */
    transition: transform 0.3s ease, color 0.3s ease !important;
}

.footer-social-icons a svg {
    width: 24px !important;
    height: 24px !important;
    transition: all 0.3s ease !important;
}

/* Efecto hover: Se levantan un poco y cambian al verde de tu marca */
.footer-social-icons a:hover {
    color: #2eb872 !important;
    transform: translateY(-3px) !important;
}
/* ==========================================
   ALINEACIÓN SUPERIOR PERFECTA EN EL FOOTER
   ========================================== */
.footer-widgets-grid {
    align-items: start !important;
}

.footer-col h4 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.footer-col.brand-col {
    margin-top: -5px !important; /* Ajuste fino opcional para alinear el logo con los textos */
}
.site-search-form { position: relative; }

.europa-live-search-results {
    display: none;
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 100%;
    max-width: 420px;
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    z-index: 9999;
    max-height: 420px;
    overflow-y: auto;
}

.europa-live-search-results.active { display: block; }

.europa-search-loading,
.europa-search-empty {
    padding: 16px;
    font-size: 14px;
    color: #888;
    text-align: center;
}

.europa-search-results-list { list-style: none; margin: 0; padding: 6px; }

.europa-search-result-item a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    text-decoration: none;
    border-radius: 8px;
}

.europa-search-result-item a:hover { background: #f6f6f8; }

.europa-search-thumb img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 6px;
}

.europa-search-info { display: flex; flex-direction: column; }

.europa-search-title {
    font-size: 13px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.3;
}

.europa-search-price {
    font-size: 13px;
    color: #2eb872;
    font-weight: 700;
    margin-top: 2px;
}

.europa-search-view-all {
    display: block;
    text-align: center;
    padding: 12px;
    font-size: 13px;
    font-weight: 700;
    color: #2eb872;
    text-decoration: none;
    border-top: 1px solid #eaeaea;
}
body ul.products li.product .button.button,
body ul.products li.product .add-request-quote-button.add-request-quote-button,
body ul.products li.product a.add-request-quote-button.add-request-quote-button,
body ul.products li.product button.add-request-quote-button.add-request-quote-button,
body ul.products li.product .yith-ywraq-add-button.yith-ywraq-add-button a,
body ul.products li.product .yith-ywraq-add-to-quote.yith-ywraq-add-to-quote,
body ul.products li.product .add_to_cart_button.add_to_cart_button {
    overflow: hidden !important;
}
 a.add-request-quote-button,
button.add-request-quote-button,
.yith-ywraq-add-button a,
.yith-ywraq-add-button a.button,
.ywraq-add-to-quote a {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    align-self: flex-start !important;
}
 
/* En móvil (sección 18) el botón sí debe ocupar el 100% del ancho a
   propósito, así que ahí anulamos el align-self anterior. */
@media (max-width: 991px) {
    a.add-request-quote-button,
    button.add-request-quote-button,
    .yith-ywraq-add-button a,
    .yith-ywraq-add-button a.button,
    .ywraq-add-to-quote a {
        align-self: stretch !important;
    }
}
/* ==========================================
   30. BLOQUEO GLOBAL CONTRA EL "SALTO" DEL BOTÓN
   ========================================== */
a.add-request-quote-button,
button.add-request-quote-button,
.yith-ywraq-add-button a,
.yith-ywraq-add-button a.button,
.ywraq-add-to-quote a {
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    align-self: flex-start !important;
}
 
@media (max-width: 991px) {
    a.add-request-quote-button,
    button.add-request-quote-button,
    .yith-ywraq-add-button a,
    .yith-ywraq-add-button a.button,
    .ywraq-add-to-quote a {
        align-self: stretch !important;
    }
}
 
/* ==========================================
   31. RESTAURAR overflow:hidden EN EL BOTÓN DE LA CUADRÍCULA
   ========================================== */
body ul.products li.product .button.button,
body ul.products li.product .add-request-quote-button.add-request-quote-button,
body ul.products li.product a.add-request-quote-button.add-request-quote-button,
body ul.products li.product button.add-request-quote-button.add-request-quote-button,
body ul.products li.product .yith-ywraq-add-button.yith-ywraq-add-button a,
body ul.products li.product .yith-ywraq-add-to-quote.yith-ywraq-add-to-quote,
body ul.products li.product .add_to_cart_button.add_to_cart_button {
    overflow: hidden !important;
}
/* ==========================================
   32. Correccion de imagen que hace que se abra el boton al dar click
   ========================================== */
img.ywraq-loader,
img.ywraq-loader.ywraq-loader,
.woocommerce img.ywraq-loader,
ul.products li.product img.ywraq-loader,
ul.products li.product .ywraq-loader {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    position: absolute !important;
    pointer-events: none !important;
}
/* ==========================================
   33. CATEGORÍAS POPULARES: CARRUSEL TÁCTIL EN MÓVIL
   ========================================== */
/* Reemplaza el comportamiento de la sección 22 en el breakpoint de
   576px (donde antes se apilaban 1 por fila). Ahora en móvil se
   muestran 2 tarjetas a la vez, en una fila que se desliza
   horizontalmente con el dedo (scroll nativo, sin JS ni flechas). */
@media (max-width: 767px) {
    .categories-grid {
        display: flex !important;
        grid-template-columns: none !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
        gap: 10px !important;
        background: none !important;
        border: none !important;
        border-radius: 0 !important;
        padding-bottom: 4px !important;
    }

    /* Oculta la barra de scroll visualmente (sigue siendo deslizable) */
    .categories-grid::-webkit-scrollbar { display: none !important; }
    .categories-grid { -ms-overflow-style: none !important; scrollbar-width: none !important; }

    .category-card {
        flex: 0 0 46% !important;
        scroll-snap-align: start !important;
        background-color: #ffffff !important;
        border: 1px solid #eaeaea !important;
        border-radius: 8px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 10px !important;
        padding: 18px !important;
    }

    .category-image {
        width: 60px !important;
        height: 60px !important;
    }
}
.body.single-product div.product{
    display: inline !important;
}
/* ==========================================
   34. ENCABEZADO COMPACTO EN MÓVIL (BUSCADOR + PRESUPUESTO)
   ========================================== */
@media (max-width: 767px) {
    .cart-amount {
        display: none !important;
    }

    .middle-bar {
        position: relative !important;
    }

    .site-search-form {
        flex: 0 0 auto !important;
        max-width: none !important;
        width: auto !important;
    }

    .site-search-form input {
        display: none !important;
    }

    .site-search-form button {
        position: static !important;
        transform: none !important;
        width: 40px !important;
        height: 40px !important;
        border-radius: 50% !important;
        background: #f3f4f6 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
    }

    /* Estado desplegado: el contenedor externo solo se encarga
       del posicionamiento (queda pegado bajo el header) */
    .site-search-form.mobile-search-open {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        background: #ffffff !important;
        padding: 14px 20px !important;
        box-shadow: 0 10px 25px rgba(0,0,0,0.08) !important;
        z-index: 500 !important;
    }

    /* El flex real va en el <form>, que es quien contiene
       el input y el botón */
    .site-search-form.mobile-search-open form {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .site-search-form.mobile-search-open input {
        display: block !important;
        flex: 1 !important;
        min-width: 0 !important; /* evita que el input desborde el flex */
        padding: 10px 16px !important;
        border-radius: 20px !important;
        background: #f3f4f6 !important;
        border: none !important;
        font-size: 14px !important;
        outline: none !important;
    }

    .site-search-form.mobile-search-open button {
        background: none !important;
    }
}
/* Ocultar la pestaña "VALORACIONES" */
.woocommerce-tabs ul.tabs li.reviews_tab,
#tab-title-reviews {
    display: none !important;
}

/* Forzar alineación a la izquierda del contenedor de pestañas */
.woocommerce-tabs ul.tabs {
    display: flex !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
}

.woocommerce-tabs ul.tabs li {
    float: none !important;
    text-align: left !important;
    margin-right: 30px !important;
}
/* Ocultar la pestaña "VALORACIONES" */
ul.tabs.wc-tabs li.reviews_tab {
    display: none !important;
}

/* Forzar alineación a la izquierda */
ul.tabs.wc-tabs {
    display: flex !important;
    justify-content: flex-start !important;
    text-align: left !important;
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
    width: 100% !important;
}

ul.tabs.wc-tabs li.description_tab {
    float: none !important;
    text-align: left !important;
    margin: 0 !important;
}
.woocommerce-tabs {
    text-align: left !important;
}

ul.tabs.wc-tabs li.description_tab a {
    text-align: left !important;
    display: inline-block !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
    justify-content: flex-start !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.reviews_tab {
    display: none !important;
}