/** Shopify CDN: Minification failed

Line 818:20 Expected identifier but found whitespace
Line 818:44 Unexpected "("

**/
/*-----------------------------------------------------------------------------/
/ Custom Theme CSS
/-----------------------------------------------------------------------------*/
/*---------------- Global Custom CSS -------------------*/
/* 1. BARRAS SUPERIORES (COLECCIÓN Y BÚSQUEDA) - CERO DEFORMACIÓN */
facet-filters-form.facets-vertical-sort,
.facets-vertical-sort,
.top-control.box-has-content {
    background-color: #0d0d0d !important;
    box-shadow: inset 0 0 0 1px rgba(57, 255, 20, 0.3) !important; /* Borde interno puro */
    border: none !important;
}
/* 2. LIMPIEZA DE FONDOS NATIVOS Y TEXTO BLANCO */
facet-filters-form.facets-vertical-sort *,
.facets-vertical-sort *,
.top-control.box-has-content * {
    color: #ffffff !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

/* 3. SELECTOR "ORDENAR POR" EN MODO CONSOLA */
select.facet-filters__sort,
.facets-vertical-sort select,
.top-control.box-has-content select {
    background-color: #000000 !important;
    color: #39FF14 !important;
    border: 1px solid #39FF14 !important;
    border-radius: 4px !important;
}

/* 4. ACENTOS NEÓN (CONTADORES Y VISTAS ACTIVAS) */
.product-count__text,
.top-control.box-has-content .active {
    color: #39FF14 !important;
    fill: #39FF14 !important;
}

/* ========================================================
   5. CAJA DE PAGOS TRANSPARENTE (TARGET DIRECTO V6)
   ======================================================== */
.product_custom_html,
.product_custom_html .content,
.product_custom_html .custom_image {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Forzar que el texto de seguridad sea verde neón */
.product_custom_html .content-text *,
.product_custom_html p {
    color: #39FF14 !important;
}
/* --------------------------------------------------------
   1. COMPRESIÓN EXTREMA DE TÍTULO DE BÚSQUEDA (TARGET DIRECTO)
   -------------------------------------------------------- */

/* Cazar la clase dinámica "__main-padding" que infla el bloque */
.template-search[class*="__main-padding"],
div[class*="__main-padding"],
#MainContent .template-search {
    padding-top: 15px !important;    /* Destruye el abismo superior */
    padding-bottom: 15px !important; /* Destruye el abismo inferior */
    margin-top: 0 !important;
    min-height: auto !important;
}

/* Reducir el tamaño de la letra del título y sus márgenes internos */
.template-search h1,
.template-search h2,
.template-search .title,
.template-search .search-results-title {
    font-size: 24px !important;      /* Tamaño preciso y afilado */
    line-height: 1.2 !important;
    margin-top: 0 !important;
    margin-bottom: 15px !important;  /* Solo un poco de aire antes de los filtros */
    padding: 0 !important;
}
/* ========================================================
   GAMERS INSIDE: CÓDIGO MAESTRO DEFINITIVO V8
   ======================================================== */

/* --------------------------------------------------------
   1. ANIQUILACIÓN DEL ESPACIO SUPERIOR Y COMPRESIÓN DE TÍTULO
   -------------------------------------------------------- */

/* A. Destruir el abismo entre el menú y el título (Main Content & Breadcrumbs) */
.template-search #MainContent,
.template-search .main-content,
.template-search #PageContainer {
    padding-top: 0 !important; 
    margin-top: 0 !important;
}

/* B. Ocultar secciones fantasma (Breadcrumbs) que ocupan espacio invisible */
.template-search [id*="breadcrumb"],
.template-search .breadcrumb,
.template-search .breadcrumb-wrapper {
    display: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 0 !important;
}

/* C. Cazar la clase dinámica "__main-padding" del contenedor del título */
.template-search[class*="__main-padding"],
div[class*="__main-padding"],
.template-search section[id*="_main"] {
    padding-top: 15px !important;    /* Solo 15px de respiro debajo del menú */
    padding-bottom: 15px !important; 
    margin-top: 0 !important;
    min-height: auto !important;
}

/* D. Compresión de la fuente del título */
.template-search h1,
.template-search h2,
.template-search .title,
.template-search .search-results-title {
    font-size: 24px !important;      
    line-height: 1.2 !important;
    margin-top: 0 !important;
    margin-bottom: 15px !important;  
    padding: 0 !important;
}

/* --------------------------------------------------------
   2. BARRAS SUPERIORES SLIM (COLECCIONES Y BÚSQUEDAS)
   -------------------------------------------------------- */
facet-filters-form.facets-vertical-sort,
.top-control.box-has-content {
    background-color: #0d0d0d !important;
    box-shadow: inset 0 0 0 1px rgba(57, 255, 20, 0.3) !important; /* Borde Fantasma Neón */
    border: none !important;
    border-radius: 4px !important;
    width: 100% !important;
    margin-bottom: 20px !important;
    padding: 5px 15px !important; 
}

facet-filters-form.facets-vertical-sort form,
.top-control.box-has-content form {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

facet-filters-form.facets-vertical-sort *,
.top-control.box-has-content * {
    background: transparent !important;
    color: #ffffff !important;
    border-color: transparent !important;
    margin-bottom: 0 !important; 
    margin-top: 0 !important;
}

facet-filters-form.facets-vertical-sort select,
.top-control.box-has-content select {
    background-color: #000000 !important;
    color: #39FF14 !important;
    border: 1px solid #39FF14 !important;
    border-radius: 4px !important;
    padding: 4px 10px !important; 
    height: auto !important;
    min-height: 30px !important; 
}

.product-count-vertical .product-count__text,
facet-filters-form.facets-vertical-sort .product-count__text,
.top-control.box-has-content .active,
.top-control.box-has-content svg.active {
    color: #39FF14 !important;
    fill: #39FF14 !important;
}

/* --------------------------------------------------------
   3. CAJA DE PAGOS TRANSPARENTE (PÁGINA DE PRODUCTO)
   -------------------------------------------------------- */
.product_custom_html,
.product_custom_html .content,
.product_custom_html .custom_image {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.product_custom_html .content-text *,
.product_custom_html p {
    color: #39FF14 !important;
}
/* ========================================================
   PARCHE QUANT V2: BOTÓN DE CARRITO AMARILLO (CENTRADO ABSOLUTO)
   ======================================================== */

/* 1. Botón Base: Amarilo PayPal, cuadrado y posicionado */
.button-cart-bottom a, 
.button-cart-bottom button,
.product-collection__cart .button-cart-bottom form button {
    background-color: #FFC439 !important; 
    border-radius: 4px !important;       
    color: transparent !important;       
    font-size: 0 !important;             
    height: 42px !important;             
    width: 100% !important;
    border: none !important;
    transition: all 0.2s ease-in-out !important;
    cursor: pointer !important;
    position: relative !important; /* CLAVE: Punto de anclaje para el icono */
    padding: 0 !important;         /* Destruye rellenos asimétricos del tema */
}

/* 2. Efecto Hover: Brillo táctico */
.button-cart-bottom a:hover, 
.button-cart-bottom button:hover,
.product-collection__cart .button-cart-bottom form button:hover {
    background-color: #ffd166 !important; 
    transform: scale(1.02) !important;
}

/* 3. Destruir spans de texto invisibles que estorban el centrado */
.button-cart-bottom a span, 
.button-cart-bottom button span,
.product-collection__cart .button-cart-bottom form button span {
    display: none !important;
}

/* 4. Icono Vectorial con Centrado Matemático Absoluto */
.button-cart-bottom a::after, 
.button-cart-bottom button::after,
.product-collection__cart .button-cart-bottom form button::after {
    content: "";
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important; /* Alineación perfecta al píxel */
    width: 24px;   
    height: 24px;
    background-color: #0d0d0d !important; 
    margin: 0 !important;
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path><line x1="11" y1="11" x2="15" y2="11"></line><line x1="13" y1="9" x2="13" y2="13"></line></svg>') center/contain no-repeat;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path><line x1="11" y1="11" x2="15" y2="11"></line><line x1="13" y1="9" x2="13" y2="13"></line></svg>') center/contain no-repeat;
}
/* ========================================================
   PARCHE QUANT V3: ALINEACIÓN DE BOTÓN (GRAVEDAD FLEXBOX)
   ======================================================== */

/* 1. Limpiamos cualquier rastro del position absolute anterior */
.product-item, .product-grid-item {
    padding-bottom: 0 !important; 
}
.product-item .button-cart-bottom, .product-grid-item .button-cart-bottom {
    position: relative !important; 
    bottom: auto !important;
    left: auto !important;
}

/* 2. Convertir la caja de texto (info) en un contenedor elástico */
/* Esto ataca tanto la vista de cuadrícula como la de lista (row/col) */
.product-item .info, 
.product-item .product-collection__content,
.product-item .product-collection_content {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important; 
    min-height: 100% !important;
}

/* 3. La Magia: Empujar el botón hacia el abismo inferior */
.product-item .button-cart-bottom, 
.product-grid-item .button-cart-bottom {
    margin-top: auto !important; /* ESTO ES LA CLAVE: Todo el espacio libre empuja hacia abajo */
    width: 100% !important;
    padding: 15px 0 0 0 !important; /* Un respiro por si el texto está muy cerca */
}
/* ========================================================
   PARCHE QUANT V2: RESURRECCIÓN DE FLECHAS EN MOBILE
   ======================================================== */

@media (max-width: 767px) {
    /* 1. Destruir el bloqueo del contenedor padre */
    .laber_append_arrows,
    .content_section .laber_append_arrows,
    div[class*="arrows_"] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        z-index: 50 !important;
        pointer-events: auto !important;
    }

    /* 2. Forzar la materialización de las flechas y su transparencia */
    .laber_append_arrows button.slick-arrow,
    .slick-prev,
    .slick-next {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        visibility: visible !important;
        opacity: 0.4 !important;                /* Transparente al 40% */
        background-color: #0d0d0d !important;   /* Fondo oscuro */
        border: 1px solid rgba(57, 255, 20, 0.2) !important; /* Borde sutil */
        z-index: 99 !important;
        pointer-events: auto !important;        /* Obliga a detectar el toque */
        transform: scale(1) !important;         /* Evita que el tema las encoja a 0 */
    }

    /* 3. El Efecto Neón Táctil (Active) */
    .laber_append_arrows button.slick-arrow:active,
    .slick-prev:active,
    .slick-next:active {
        opacity: 1 !important;                  /* Sólido al 100% al tocar */
        border-color: #39FF14 !important;
        background-color: #000000 !important;
        box-shadow: 0 0 10px rgba(57, 255, 20, 0.4) !important;
    }

    /* 4. Colorear el ícono interno de la flecha */
    .laber_append_arrows button.slick-arrow:active::before,
    .laber_append_arrows button.slick-arrow:active i,
    .laber_append_arrows button.slick-arrow:active svg,
    .slick-prev:active::before,
    .slick-next:active::before {
        color: #39FF14 !important;
        fill: #39FF14 !important;
    }
}
/* ========================================================
   PARCHE QUANT: RESPIRACIÓN DE TARJETAS EN MOBILE (CENTRADO)
   ======================================================== */

@media (max-width: 767px) {
    /* 1. Separación Horizontal (El aire exacto que pediste) */
    .slick-slide {
        padding-left: 6px !important;  
        padding-right: 6px !important; 
        box-sizing: border-box !important;
    }

    /* Ajuste para que el carrusel no se salga de los bordes */
    .slick-list {
        margin-left: -6px !important;
        margin-right: -6px !important;
    }

    /* 2. EL ESTABILIZADOR: Fuerza el centrado absoluto del producto */
    .slick-slide .product-item,
    .slick-slide > div {
        margin-left: auto !important;
        margin-right: auto !important;
        float: none !important; /* Destruye cualquier fuerza que lo tire de lado */
    }

    /* 3. Separación Vertical (Para los juegos apilados hacia abajo) */
    .product-item,
    .product-grid-item,
    .pr_grid_item {
        margin-bottom: 20px !important; 
    }
}
/* ========================================================
   PARCHE QUANT: CENTRADO ABSOLUTO SECCIÓN BENEFICIOS (MOBILE)
   ======================================================== */

@media (max-width: 767px) {
    /* 1. Cazar la caja individual de cada beneficio y forzar su eje central */
    div[class*="benefit"] .item,
    div[class*="benefit"] .col,
    .benefit-item,
    .laber-benefit .item {
        display: flex !important;
        flex-direction: column !important; /* Apila el ícono y el texto verticalmente */
        align-items: center !important;    /* Centra en el eje horizontal */
        justify-content: center !important;
        text-align: center !important;     /* Fuerza el texto al centro */
        width: 100% !important;
    }

    /* 2. Asegurar que los íconos (SVG o imágenes) no floten a los lados */
    div[class*="benefit"] .icon,
    div[class*="benefit"] .icon_box,
    div[class*="benefit"] svg,
    div[class*="benefit"] img {
        margin-left: auto !important;
        margin-right: auto !important;
        display: block !important;
    }

    /* 3. Centrar los títulos y descripciones aniquilando márgenes asimétricos */
    div[class*="benefit"] .content,
    div[class*="benefit"] .content_box,
    div[class*="benefit"] h3,
    div[class*="benefit"] h4,
    div[class*="benefit"] p,
    div[class*="benefit"] .title {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
    }
}
/* ========================================================
   PARCHE QUANT: LIMPIEZA DE CARRITO Y BOTONES
   ======================================================== */

/* 1. Aniquilar la sección "Estimate shipping rates" por completo */
.shoppingcart-content .cart-right .shipping-calculator,
.shoppingcart-content .cart-right #shipping-calculator,
.shoppingcart-content .cart-right form.shipping-calculator-form,
.shoppingcart-content [data-shipping-calculator] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* 2. Centrado absoluto para los textos en TODOS los botones del carrito */
.shoppingcart-content button,
.shoppingcart-content a.btn,
.shoppingcart-content input[type="submit"],
.shoppingcart-content .checkout-btn,
.shoppingcart-content .button,
.shoppingcart-content .btn {
    display: flex !important;
    justify-content: center !important; /* Centrado horizontal matemático */
    align-items: center !important;     /* Centrado vertical matemático */
    text-align: center !important;      /* Refuerzo por si hay herencia de texto */
    padding-left: 0 !important;         /* Destruye rellenos asimétricos del tema */
    padding-right: 0 !important;
    height: 45px !important;            /* Altura uniforme para todos los botones */
}

/* 3. Ajuste de color para "Continue Shopping" y otros botones para que resalte el texto */
.shoppingcart-content button,
.shoppingcart-content a.btn,
.shoppingcart-content input[type="submit"] {
    color: #ffffff !important; /* Texto blanco puro */
    border: 1px solid #39FF14 !important; /* Borde Neón */
}

/* El botón principal de CHECKOUT debe ser la estrella */
.shoppingcart-content .checkout-btn,
.shoppingcart-content [name="checkout"] {
    background-color: #39FF14 !important; /* Fondo verde neón */
    color: #0d0d0d !important;          /* Texto negro profundo */
    font-weight: 900 !important;        /* Letra ultra gruesa */
}
/* ========================================================
   CÓDIGO MADRE: SHOPPING CART (MODO NUCLEAR QUANT)
   ======================================================== */

/* 1. Fondo Azul Oscuro al contenedor principal (La Base) */
#PageContainer .shoppingcart-content,
.main-content .shoppingcart-content,
div[class*="shoppingcart-content"] {
    background-color: #151e2b !important;
    padding: 20px !important;
}

/* 2. Destrucción total de fondos blancos internos (Comodín Universal) */
.shoppingcart-content *,
.shoppingcart-content table *,
.shoppingcart-content form * {
    background-color: transparent !important;
    background: transparent !important;
    color: #ffffff !important; 
    box-shadow: none !important; /* Mata cualquier sombra que simule bordes */
}

/* 3. Acentos Neón para los números que importan */
.shoppingcart-content .price,
.shoppingcart-content span.amount,
.shoppingcart-content .total,
.shoppingcart-content span.money,
.shoppingcart-content .cart-total {
    color: #39FF14 !important;
}

/* 4. Cajas de texto e inputs a Modo Consola */
.shoppingcart-content input:not([type="submit"]):not([type="button"]),
.shoppingcart-content textarea,
.shoppingcart-content select {
    background-color: #000000 !important;
    color: #39FF14 !important;
    border: 1px solid rgba(57, 255, 20, 0.4) !important;
    border-radius: 4px !important;
    padding: 10px !important;
}

/* 5. DISEÑO Y OXÍGENO PARA LOS BOTONES */
.shoppingcart-content button,
.shoppingcart-content a.btn,
.shoppingcart-content input[type="submit"],
.shoppingcart-content .checkout-btn {
    background-color: #0d0d0d !important;
    color: #39FF14 !important;
    border: 1px solid #39FF14 !important;
    border-radius: 4px !important;
    margin-top: 15px !important; /* Espacio arriba */
    margin-bottom: 15px !important; /* Espacio abajo */
    padding: 12px 20px !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
}

/* 6. Separar los botones inferiores (Continue Shopping vs Delete All) */
.shoppingcart-content .cart-content > form > div:last-child,
.shoppingcart-content .bottom-cart,
.shoppingcart-content .group-button {
    display: flex !important;
    justify-content: space-between !important; /* Lanza uno a cada esquina */
    flex-wrap: wrap !important;
    gap: 20px !important; /* Distancia de seguridad si se apilan en móvil */
    width: 100% !important;
    border-top: 1px solid rgba(57, 255, 20, 0.2) !important; /* Línea divisora cyberpunk */
    padding-top: 20px !important;
}
/* ========================================================
   PARCHE QUANT: RESURRECCIÓN Y AJUSTE DE BOTÓN PAYPAL
   ======================================================== */

/* 1. Forzar visibilidad y tamaño del contenedor de pagos adicionales */
.additional-checkout-buttons,
.cart__additional_checkout_buttons,
[data-additional-checkout-buttons],
#additional-checkout-buttons,
.paypal-button-container {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    min-height: 50px !important; /* Evita que el botón colapse o se vea pequeño */
    margin-top: 10px !important;
    margin-bottom: 20px !important;
    clear: both !important;
}

/* 2. PROTECCIÓN DE MARCA: Evitar que el Modo Nuclear transparente a PayPal */
/* Esto le devuelve su color original para que sea reconocible */
.additional-checkout-buttons *,
.paypal-button-container *,
.paypal-button * {
    background-color: unset !important; /* Recupera el amarillo/azul original */
    background: unset !important;
    color: unset !important;
    box-shadow: unset !important;
}

/* 3. Centrado y Ajuste para Mobile */
@media (max-width: 767px) {
    .additional-checkout-buttons {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 15px !important;
    }
    
    /* Asegura que el iframe de PayPal ocupe el ancho disponible */
    .paypal-button-container, 
    .paypal-button-container iframe {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 4. Refuerzo de Centrado para textos en botones (Imagen 1 y 2) */
.shoppingcart-content .group-button a,
.shoppingcart-content .group-button button,
.shoppingcart-content .cart-item .btn,
.shoppingcart-content .checkout-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 10px 20px !important; /* Relleno uniforme */
}
/* ========================================================
   PARCHE QUANT V3: RESURRECCIÓN DE PAYPAL (ATAQUE DIRECTO)
   ======================================================== */

@media (max-width: 767px) {
    /* 1. Desbloquear los contenedores ocultos de Shopify en móvil */
    .shopify-payment-button,
    .additional-checkout-buttons,
    div[data-shopify="payment-button"] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        min-height: 50px !important;
        overflow: visible !important;
        margin-top: 15px !important;
    }

    /* 2. Atacar las clases exactas inyectadas por el SDK de PayPal */
    .paypal-button-row,
    div[data-funding-source="paypal"],
    .paypal-button {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        min-height: 45px !important;
        pointer-events: auto !important; /* Asegura que el botón sea clickeable */
    }

    /* 3. Escudo protector: Evitar que nuestro parche oscuro vuelva transparente a PayPal */
    .paypal-button-row *,
    div[data-funding-source="paypal"] *,
    .paypal-button * {
        background-color: unset !important;
        background: unset !important;
        color: unset !important;
        box-shadow: unset !important;
    }
}
/* ========================================================
   PARCHE QUANT V4: PAYPAL ALINEACIÓN PERFECTA (MOBILE)
   ======================================================== */

@media (max-width: 767px) {
    /* 1. Contenedor Maestro: Subir la posición e igualar el ancho */
    .shopify-payment-button,
    .additional-checkout-buttons,
    div[data-shopify="payment-button"] {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        margin-top: 8px !important; /* Lo subimos (antes estaba en 15px) */
        padding-left: 0 !important; /* Destruye el espacio lateral para igualar al Checkout */
        padding-right: 0 !important;
        overflow: visible !important;
    }

    /* 2. El Botón Exacto: Forzar la altura de 45px y ancho completo */
    .paypal-button-row,
    div[data-funding-source="paypal"],
    .paypal-button,
    .paypal-button-row iframe,
    div[data-funding-source="paypal"] iframe {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        height: 20px !important; /* La misma altura matemática del Checkout */
        min-height: 20px !important;
        pointer-events: auto !important; 
        border-radius: 4px !important; /* Esquinas consistentes con tu diseño */
    }

    /* 3. Escudo protector de color (Se mantiene igual) */
    .paypal-button-row *,
    div[data-funding-source="paypal"] *,
    .paypal-button * {
        background-color: unset !important;
        background: unset !important;
        color: unset !important;
        box-shadow: unset !important;
    }
}
/* ========================================================
   PARCHE QUANT: BUSCADOR BLANCO CON TEXTO VERDE
   ======================================================== */

/* 1. Mantener fondo blanco y teclear en verde */
.laber_search .search_header__input,
.laber_search input.js_iput_search,
.frm_search_input input[type="text"],
.search_header input[type="text"] {
    background-color: #ffffff !important; /* Mantiene el blanco */
    color: #39FF14 !important;            /* La tinta al escribir es verde */
}

/* 2. El texto "Search for products..." en gris para que resalte sobre blanco */
.laber_search .search_header__input::placeholder,
.laber_search input.js_iput_search::placeholder,
.search_header input[type="text"]::placeholder {
    color: #666666 !important; /* Gris oscuro */
    opacity: 1 !important;
}

/* 3. Evitar que el fondo se ponga negro al hacer clic */
.laber_search .search_header__input:focus,
.laber_search input.js_iput_search:focus,
.search_header input[type="text"]:focus {
    background-color: #ffffff !important; 
    border-color: #39FF14 !important; /* El borde sí se pone verde al tocarlo */
    outline: none !important;
}
/* ========================================================
   PARCHE QUANT V2: EXPANSIÓN Y COMPRESIÓN DE CUADRÍCULA (MOBILE)
   ======================================================== */

@media (max-width: 767px) {
    /* 1. Compresión Horizontal: Reducir el aire entre columnas */
    .slick-slide {
        padding-left: 4px !important;  /* Canal de aire izquierdo al mínimo */
        padding-right: 4px !important; /* Canal de aire derecho al mínimo */
        box-sizing: border-box !important;
    }

    /* 2. Compresión Vertical: Destruir el abismo entre las filas */
    .slick-slide > div {
        margin-bottom: 8px !important; /* Separación exacta de 8px hacia abajo */
        display: block !important;
        width: 100% !important;
    }

    /* 3. Expansión Absoluta: Romper la jaula de los contenedores */
    .slick-slide article.product-item,
    .slick-slide .alo-item,
    .slick-slide .pr_grid_item {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
    }

    /* 4. Forzar a las imágenes a rellenar el nuevo espacio expandido */
    .slick-slide article.product-item img,
    .slick-slide .alo-item img,
    .slick-slide .product-collection__image img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important; /* Mantiene la proporción sin deformarse */
        border-radius: 6px !important; /* Mantiene el corte premium */
    }
}
/* ========================================================
   OCULTAR SECCIÓN "ADD ORDER NOTE" EN EL CARRITO
   ======================================================== */

.shoppingcart-content .add-order-note,
.add-order-note,
#CartSpecialInstructions {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: none !important;
}
/* ========================================================
   PARCHE QUANT: CHECKBOX BLINDADO (FLOAT LAYOUT)
   ======================================================== */

/* 1. Aniquilación de basura: Falsos cuadros, textos de envío y duplicados */
.cart__shipping_note,
[data-shipping-note],
.shoppingcart-content .cart-right label[for]::before,
.shoppingcart-content .cart-right label[for] * {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* 2. El Checkbox Nativo: Anclado a la izquierda como un bloque de plomo */
.shoppingcart-content .cart-right input[type="checkbox"] {
    display: block !important;
    float: left !important; /* Fuerza la caja a la izquierda absoluta */
    width: 16px !important;
    height: 16px !important;
    margin: 2px 12px 25px 0 !important; /* 12px separan el texto, 25px empujan el botón Checkout */
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    accent-color: #39FF14 !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    cursor: pointer !important;
}

/* 3. El Contenedor del Texto: Limpiado del texto original */
.shoppingcart-content .cart-right label[for],
.shoppingcart-content .cart-right input[type="checkbox"] + label {
    display: block !important;
    overflow: hidden !important; /* Magia CSS: hace que el texto fluya al lado del float sin meterse debajo */
    width: auto !important;
    margin: 0 0 25px 0 !important;
    padding: 0 !important;
    font-size: 0 !important; /* Enmudece el texto original de la plantilla */
    color: transparent !important;
    text-align: left !important;
    cursor: pointer !important;
}

/* 4. Inyección ÚNICA del Texto Quant */
.shoppingcart-content .cart-right label[for]::after,
.shoppingcart-content .cart-right input[type="checkbox"] + label::after {
    content: ">>> Acepta nuestros terminos y condiciones <<<" !important;
    display: block !important;
    font-family: monospace !important; /* Fuente consola */
    font-size: 13px !important;
    color: #ffffff !important;
    text-shadow: 0 0 5px #39FF14 !important; /* Resplandor Neón */
    line-height: 1.5 !important;
    white-space: normal !important; /* Permite que la frase se estire de forma natural */
    letter-spacing: 0.5px !important;
}

   PANEL DE CONTROL: POSICIONAMIENTO GLOBAL (IMAGEN + TEXTO)
   ======================================================== */

/* 1. El Contenedor Maestro: Lo preparamos para centrar */
.featured-product .product-collection {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; /* Intenta centrar todo el bloque verticalmente de forma automática */
    /* Mantiene tu padding y color de fondo actual */
}

/* 2. El Bloque Central (.row): Le quitamos el estiramiento y lo centramos */
.featured-product .product-collection > .row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important; /* Alinea la imagen y el texto para que compartan el mismo centro */
    height: auto !important; /* CLAVE: Ya no es 100%, ahora solo mide lo que miden sus elementos */
    width: 100% !important;
    
    /* ===================================================
       👇 CONTROLES MANUALES DE PÍXELES (TÚ DECIDES) 👇
       =================================================== */
       
    /* AJUSTE VERTICAL (Arriba / Abajo) 
       Si el 'justify-content: center' de arriba no fue suficiente, 
       cambia este '0px' a '20px' (para bajarlo) o '-20px' (para subirlo). */
    margin-top: 0px !important; 

    /* AJUSTE HORIZONTAL (Izquierda / Derecha)
       Si quieres empujar todo el bloque de foto y texto más a la derecha, 
       sube estos píxeles. */
    padding-left: 0px !important; 
    
    /* =================================================== */
}

/* 3. Asegurar que la imagen 1:1 no se deforme al centrarse */
.featured-product .product-collection > .row > div:first-child {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 4. Bloque de Texto: Alineado a la imagen */
.featured-product .product-collection__content.style_left {
    height: auto !important;
    padding-left: 20px !important; /* Espacio limpio entre imagen 1:1 y texto */
    justify-content: center !important;
}
/* ========================================================
   PARCHE DE PRECISIÓN: CENTRADO DE NÚCLEO (IMAGEN + TEXTO)
   ======================================================== */

/* 1. Forzar al formulario a ocupar todo el espacio del contenedor */
.featured-product form.frm_product_collection {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; /* Centrado Vertical */
    align-items: center !important;     /* Centrado Horizontal */
    margin: 0 !important;
}

/* 2. El bloque interior (La fila con imagen y texto) */
.featured-product .product-collection > .row,
.featured-product form .row {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important; /* Alinea imagen y texto entre sí */
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;

    /* ===================================================
       👇 CONTROLADORES DE POSICIÓN MANUAL 👇
       =================================================== */
    
    /* AJUSTE VERTICAL: Si lo quieres más arriba o más abajo */
    /* Usa números positivos (ej: 10px) para bajar, negativos (-10px) para subir */
    transform: translateY(0px) !important; 

    /* AJUSTE HORIZONTAL: Si quieres mover todo a la izquierda o derecha */
    /* Positivo derecha, Negativo izquierda */
    margin-left: 0px !important; 

    /* =================================================== */
}

/* 3. CONTROL DE ANCHOS (Ajusta estos % a tu gusto) */
.featured-product .col-lg-5 { 
    flex: 0 0 45% !important; /* Ancho de la Imagen */
    max-width: 45% !important;
    padding: 0 !important;
}

.featured-product .content-right { 
    flex: 0 0 55% !important; /* Ancho del Texto */
    max-width: 55% !important;
    padding-left: 20px !important; /* Separación entre ambos */
    text-align: left !important;
}

/* 4. Asegurar que el contenido del texto también esté centrado internamente */
.featured-product .product-collection__content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    height: auto !important;
}

/*---------------- Custom CSS for only desktop -------------------*/
@media (min-width: 1025px) {
  
}

/*---------------- Custom CSS for tablet, mobile -------------------*/
@media (max-width: 1024px) {
  .custom-css{padding: 10px;}
}

/*---------------- Custom CSS for only tablet -------------------*/
@media (min-width: 768px) and (max-width: 1024px) {
  
}

/*---------------- Custom CSS for only mobile -------------------*/
@media (max-width: 767px){
  .custom-css{padding: 10px;}
}
