/* --- WOOCOMMERCE CATALOGO (TIENDA) --- */
.woocommerce ul.products {
    display: grid;
    grid-template-columns: repeat(1, 1fr); /* 1 col en móvil */
    gap: 30px;
    margin: 40px 0;
    padding: 0;
    list-style: none;
    width: 100%;
}

@media (min-width: 600px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr); /* 2 cols en tablet */
    }
}

@media (min-width: 992px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(4, 1fr); /* 4 cols fijos en PC */
    }
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
    display: none; /* Quita el clear fix antiguo de Woo */
}

/* Tarjeta Individual del Catálogo (Template Personalizado) */
.custom-shop-card {
    border: none;
    text-align: center;
    transition: all 0.3s ease;
    margin: 0 !important; 
    width: 100% !important; 
    display: flex;
    flex-direction: column;
}

.custom-card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.custom-product-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    position: relative;
    border-radius: 6px;
    background-color: #000000;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #111111;
}

.custom-product-image img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
}

/* El zoom se activa al pasar el mouse por la imagen (o la tarjeta entera) */
.custom-product-image:hover img {
    transform: scale(1.1);
}

/* Botón flotante del carrito */
.custom-add-to-cart-icon {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
    background: var(--color-primary);
    color: var(--color-black);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 5;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.custom-add-to-cart-icon svg {
    margin: 0;
}

.custom-add-to-cart-icon:hover {
    background: var(--color-tertiary);
    color: var(--color-carbon);
    transform: translateY(0) scale(1.1);
    box-shadow: 0 5px 15px rgba(216, 200, 94, 0.4);
}

/* Aparece al hacer hover sobre la tarjeta o si ya está en el carro */
.custom-shop-card:hover .custom-add-to-cart-icon,
.custom-add-to-cart-icon.added,
.custom-add-to-cart-icon.in-cart {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Feedback Post-AJAX (Producto agregado) o permanente si ya está */
.custom-add-to-cart-icon.added,
.custom-add-to-cart-icon.in-cart {
    background: var(--color-tertiary); /* Amarillo Mostaza */
    color: var(--color-carbon);
}

.custom-add-to-cart-icon.added svg,
.custom-add-to-cart-icon.in-cart svg {
    color: var(--color-carbon);
}

/* Badge numérico de cantidad por producto */
.custom-add-to-cart-icon .item-qty-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    background: var(--color-black);
    color: var(--color-white);
    font-size: 11px;
    font-weight: bold;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid var(--color-tertiary);
    box-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

/* Botón "Ver carrito" que se inyecta tras agregar (Tooltip flotante) */
.added_to_cart.wc-forward {
    position: absolute;
    top: 55px; /* Justo debajo del ícono */
    right: 10px;
    background: var(--color-black);
    color: var(--color-primary);
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    text-decoration: none;
    z-index: 5;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(216, 200, 94, 0.3);
    opacity: 0;
    visibility: hidden;
    animation: fadeInCartTooltip 0.3s forwards;
}

@keyframes fadeInCartTooltip {
    to { opacity: 1; visibility: visible; }
}

.added_to_cart.wc-forward:hover {
    background: var(--color-primary);
    color: var(--color-black);
}

/* En móviles, siempre visible el ícono base */
@media (max-width: 768px) {
    .custom-add-to-cart-icon {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
}

.custom-product-footer {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    flex-grow: 1;
    width: 100%;
    text-align: left;
    padding: 10px;
}

.custom-product-price {
    margin-top: auto;
    width: 100%;
}

.custom-product-title {
    font-size: 16px;
    padding: 0;
    margin: 0;
}

.custom-product-short-desc {
    color: var(--color-text-main);
    opacity: 0.8;
    font-size: 14px;
    line-height: 1.5;
}

.custom-product-short-desc p {
    margin: 0;
}

.custom-product-price .amount {
    font-size: 20px;
    font-weight: 800;
    color: var(--color-primary);
}

/* Precios con descuento */
.custom-product-price del .amount {
    color: var(--color-text-main);
    opacity: 0.8;
    font-size: 16px;
    font-weight: normal;
    margin-right: 8px;
}

.custom-product-price ins,
.woocommerce div.product p.price ins,
.custom-product-price ins .amount,
.woocommerce div.product p.price ins .amount {
    text-decoration: none;
    background: transparent;
}

/* Paginación de WooCommerce */
.woocommerce nav.woocommerce-pagination ul {
    border: none;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.woocommerce nav.woocommerce-pagination ul li {
    border: none;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    padding: 10px 15px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--color-white);
    border-radius: 6px;
    text-decoration: none;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--color-primary);
    color: var(--color-black);
    font-weight: bold;
}

/* Mensajes de información (Ej. "Mostrando todos los resultados") */
.woocommerce .woocommerce-result-count,
.woocommerce-page .woocommerce-result-count,
.woocommerce .woocommerce-ordering select {
    color: #ccc;
    background: rgba(0,0,0,0.5);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 6px;
    padding: 8px;
    margin-bottom: 30px;
}

.woocommerce .woocommerce-result-count,
.woocommerce-page .woocommerce-result-count {
    font-size: 13px;
}

/* Etiqueta / Badge de Oferta */
.woocommerce span.onsale {
    background-color: var(--color-sale) !important; /* Color de oferta unificado */
    color: #fff !important;
    border-radius: 6px !important;
    font-weight: bold;
    font-size: 14px;
    padding: 6px 12px;
    line-height: 1;
    min-height: 0;
    min-width: 0;
    top: 15px;
    left: 15px;
    right: auto;
    z-index: 9;
    text-transform: uppercase;
    box-shadow: 0 4px 10px rgba(0, 184, 148, 0.4);
}

/* --- WOOCOMMERCE PRODUCTO INDIVIDUAL (SINGLE PRODUCT) --- */
.woocommerce div.product {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin-top: 40px;
}

/* Galería de imágenes (Izquierda) */
.woocommerce div.product div.images,
.woocommerce div.product div.summary {
    width: 100% !important; /* Resetea el ancho del float por defecto */
    float: none !important;
}

@media (min-width: 768px) {
    .woocommerce div.product div.images {
        flex: 1 1 40%;
    }
    .woocommerce div.product div.summary {
        flex: 1 1 50%;
    }
}

.woocommerce div.product div.images {
    background: #fff;
    padding: 20px;
    border-radius: 6px;
}

.woocommerce div.product div.images img {
    border-radius: 6px;
    width: 100%;
}

/* Resumen del Producto (Derecha) */
.woocommerce div.product .product_title {
    font-size: 36px;
    color: var(--color-white);
    margin: 0;
    line-height: 1.2;
}

.woocommerce div.product p.price {
    font-size: 32px;
    font-weight: 800;
    color: var(--color-primary);
    margin: 0;
}

/* Precios con descuento en Producto Individual */
.woocommerce div.product p.price del .amount {
    color: #999;
    font-size: 22px;
    font-weight: normal;
    text-decoration: line-through;
    margin-right: 15px;
    display: inline-block;
}

/* (Optimizados y unificados arriba junto al catálogo) */

.woocommerce div.product .woocommerce-product-details__short-description {
    color: #ccc;
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 30px;
}

/* Botón y Cantidad - Grupo Acoplado */
.woocommerce div.product form.cart {
    display: flex;
    align-items: stretch; /* Para que tengan la misma altura */
    gap: 0;
    margin-bottom: 40px;
}

.woocommerce div.product form.cart div.quantity {
    margin: 0; /* Limpiar márgenes por defecto de woo */
    display: flex;
}

.woocommerce div.product form.cart .qty {
    background: rgba(255, 255, 255, 0.1);
    color: var(--color-white);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-right: none; /* Quitamos borde interno */
    border-radius: 6px 0 0 6px; /* Redondo a la izquierda */
    padding: 10px 10px 10px 20px;
    font-size: 16px;
    text-align: center;
    width: 80px;
    margin: 0;
}

.woocommerce div.product form.cart .button {
    background: var(--color-primary);
    color: var(--color-black);
    padding: 15px 30px;
    border-radius: 0 6px 6px 0; /* Redondo a la derecha */
    font-weight: bold;
    font-size: 16px;
    text-transform: uppercase;
    transition: all 0.3s ease;
    border: none;
    width: 40%; /* Reducido a la mitad del contenedor */
    margin: 0;
}

.woocommerce div.product form.cart .button:hover {
    background: var(--color-tertiary);
    color: var(--color-black);
    width: 45%; /* Se alarga hacia la derecha al pasar el mouse */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}



/* Pestañas (Descripción, Valoraciones) */
.woocommerce div.product .woocommerce-tabs {
    width: 100%;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    display: flex;
    border: none !important;
    padding: 0;
    margin: 0;
}

/* Ocultar las líneas artificiales que dibuja WooCommerce con pseudoelementos */
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after {
    display: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent;
    border: none;
    border-radius: 0;
    margin: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
    display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: #aaa;
    font-weight: bold;
    padding: 12px 24px;
    display: inline-block;
    border-radius: 6px 6px 0 0; /* Curvas solo arriba */
    transition: all 0.3s ease;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    color: var(--color-white);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: transparent !important;
    border-bottom-color: var(--color-tertiary) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    background: rgba(255, 255, 255, 0.1) !important;
    color: var(--color-primary) !important;
}

/* Animación para suavizar el cambio de pestañas */
@keyframes spc-tab-fade-in {
    0% {
        opacity: 0;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.woocommerce div.product .woocommerce-tabs .panel {
    color: #ccc;
    line-height: 1.8;
    width: 100%;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    padding: 30px;
    transition: all 0.3s ease;
    animation: spc-tab-fade-in 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
    color: var(--color-primary);
    font-size: 24px;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: -0.5px;
    border-bottom: 1px solid rgba(216, 200, 94, 0.3);
    padding-bottom: 10px;
}

/* --- RESPONSIVE MOBILE (SINGLE PRODUCT) --- */
@media (max-width: 768px) {
    /* Pestañas: Apilarlas como botones verticales */
    .woocommerce div.product .woocommerce-tabs ul.tabs {
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
        padding: 0;
        margin-bottom: 20px;
    }
    
    .woocommerce div.product .woocommerce-tabs ul.tabs li {
        width: 100%;
        margin-bottom: 10px;
        flex-shrink: 0;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li a {
        display: block;
        width: 100%;
        text-align: center;
        border-radius: 6px; /* Esquinas redondeadas completas para móvil */
        background: rgba(255, 255, 255, 0.02);
    }

    /* Reducir padding del panel para dar más espacio al texto en móvil */
    .woocommerce div.product .woocommerce-tabs .panel {
        padding: 20px 15px;
    }

    /* Ajuste Grupo Carrito: Apilar Cantidad y Botón en vez de lado a lado */
    .woocommerce div.product form.cart {
        flex-direction: column;
        gap: 15px;
    }

    .woocommerce div.product form.cart .qty {
        width: 100%;
        border-radius: 6px;
        border-right: 1px solid rgba(255, 255, 255, 0.2);
    }

    .woocommerce div.product form.cart .button {
        width: 100%;
        border-radius: 6px;
    }

    /* Evitar que el botón crezca y rompa el ancho en móvil */
    .woocommerce div.product form.cart .button:hover {
        width: 100%;
    }
}

/* --- WOOCOMMERCE AVISOS Y MENSAJES GLOBALES --- */
.woocommerce-message, .woocommerce-info {
    background-color: transparent !important; /* Fondo transparente/oscuro */
    border-top-color: var(--color-primary) !important;
    color: var(--color-white) !important; /* Restaurado para visibilidad */
    border-radius: 6px !important;
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 30px;
}

/* Cambiar el color del ícono nativo (check) y de los enlaces internos */
.woocommerce-message::before,
.woocommerce-info::before {
    color: var(--color-primary) !important;
}

/* Para errores, usar un borde superior rojo */
.woocommerce-error {
    background-color: transparent !important; /* Fondo transparente/oscuro */
    border-top-color: #ff4a4a !important;
}
.woocommerce-error::before {
    color: #ff4a4a !important;
}

/* Botones de acción dentro de los mensajes de alerta (Ej: "Ver carrito") */
.woocommerce-message a, 
.woocommerce-info a {
    background-color: var(--color-primary) !important;
    color: var(--color-carbon) !important;
    border-radius: 6px !important;
    border: none !important;
    text-decoration: none !important;
    padding: 10px 20px !important;
    transition: all 0.3s ease !important;
    display: inline-block;
}

.woocommerce-message a:hover, 
.woocommerce-info a:hover {
    background-color: var(--color-tertiary) !important;
    color: var(--color-carbon) !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

/* --- BOTONES DE BLOQUES WOOCOMMERCE (Ej: "Nuevos Productos" en carro vacío) --- */
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-components-product-button .wp-block-button__link,
.wp-block-woocommerce-product-new .wp-block-button__link {
    background-color: var(--color-primary) !important;
    color: var(--color-black) !important;
    border-radius: 6px !important;
    border: none !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    text-decoration: none !important;
    padding: 12px 20px !important;
    transition: all 0.3s ease !important;
    display: block;
    text-align: center;
    width: 100%;
}

.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-components-product-button .wp-block-button__link:hover,
.wp-block-woocommerce-product-new .wp-block-button__link:hover {
    background-color: var(--color-tertiary) !important;
    color: var(--color-carbon) !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
}

/* --- CARRITO FLOTANTE GLOBAL (Bottom Right) --- */
.global-floating-cart {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: var(--color-primary);
    color: var(--color-black);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);
    z-index: 9999;
    transition: all 0.3s ease;
}

.global-floating-cart:hover {
    transform: scale(1.1);
    background: var(--color-tertiary);
    color: var(--color-carbon);
}

.global-floating-cart svg {
    margin: 0;
}

.global-floating-cart .cart-count.badge {
    position: absolute;
    top: -5px;
    right: -5px;
    background: var(--color-black);
    color: var(--color-white);
    font-size: 12px;
    font-weight: bold;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid var(--color-tertiary);
    box-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

/* --- ESTADOS DE INVENTARIO (AGOTADO) --- */
.custom-out-of-stock-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #ff4a4a; /* Rojo alerta */
    color: var(--color-white);
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    z-index: 5;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none; /* No clickeable */
    z-index: 10;
}

/* Etiqueta de Oferta */
.custom-sale-badge {
    position: absolute;
    bottom: 15px;
    right: 15px; /* Esquina inferior derecha para no chocar con el icono del carrito */
    background: var(--color-sale);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 4px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
    z-index: 10;
    letter-spacing: 0.5px;
}

/* Add to Cart Icon (Botón inferior derecha) */
.woocommerce div.product p.stock.out-of-stock {
    color: #ff4a4a;
    font-weight: 800;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 20px;
    display: inline-block;
    padding: 10px 15px;
    background: rgba(255, 74, 74, 0.1); /* Fondo rojizo suave */
    border: 1px solid rgba(255, 74, 74, 0.3);
    border-radius: 6px;
}

/* --- ESTADOS DE INVENTARIO (RESERVA) --- */
.custom-backorder-badge {
    position: absolute;
    top: 10px;
    left: 10px; /* Lo ponemos a la izquierda para que no choque con el botón de agregar al carrito (derecha) */
    background: var(--color-primary); /* Mostaza */
    color: var(--color-black);
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    z-index: 5;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
}

/* En la página de producto individual (Reserva) */
.woocommerce div.product p.stock.available-on-backorder {
    color: var(--color-tertiary);
    font-weight: 800;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 20px;
    display: inline-block;
    padding: 10px 15px;
    background: rgba(216, 200, 94, 0.1); /* Fondo mostaza suave */
    border: 1px solid rgba(216, 200, 94, 0.3);
    border-radius: 6px;
}

/* --- PRODUCTOS AGRUPADOS (GROUPED PRODUCTS) --- */
.woocommerce div.product form.cart.grouped_form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-top: 25px;
    padding: 20px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
}

.woocommerce-grouped-product-list.group_table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-grouped-product-list.group_table tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background 0.3s ease;
}

.woocommerce-grouped-product-list.group_table tr:last-child {
    border-bottom: none;
}

.woocommerce-grouped-product-list.group_table tr:hover {
    background: rgba(255, 255, 255, 0.03);
}

.woocommerce-grouped-product-list.group_table td {
    padding: 15px 10px;
    vertical-align: middle;
}

.woocommerce-grouped-product-list-item__quantity {
    width: 100px;
}

/* Rediseño de los inputs de cantidad dentro de la tabla */
.woocommerce-grouped-product-list.group_table .quantity input.qty {
    width: 60px;
    height: 40px;
    padding: 5px;
    background: var(--color-carbon);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--color-white);
    border-radius: 30px !important; /* Esquinas totalmente redondeadas (efecto cápsula forzado) */
    text-align: center;
}

.woocommerce-grouped-product-list-item__label {
    font-size: 15px;
    font-weight: 500;
    color: var(--color-white);
}

.woocommerce-grouped-product-list-item__label a {
    color: var(--color-white);
    text-decoration: none;
    transition: color 0.3s ease;
}

.woocommerce-grouped-product-list-item__label a:hover {
    color: var(--color-primary);
}

.woocommerce-grouped-product-list-item__price {
    text-align: right;
    font-weight: bold;
    color: var(--color-primary);
    font-size: 16px;
}

.woocommerce div.product form.cart.grouped_form button.single_add_to_cart_button {
    align-self: flex-end;
    margin-top: 10px;
    min-width: 250px;
    border-radius: 30px !important; /* Forzar el diseño cápsula rompiendo el estilo por defecto */
}

/* --- BUNDLE BANNER (LLEVA EL KIT COMPLETO) --- */
.custom-bundle-banner {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.06) 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 25px;
    margin-top: 35px;
    margin-bottom: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

.bundle-banner-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.bundle-badge {
    background: var(--color-bundle);
    color: #fff;
    padding: 4px 12px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: bold;
    text-transform: uppercase;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}

.bundle-banner-header h4 {
    margin: 0;
    font-size: 18px;
    color: var(--color-white);
    font-weight: 600;
}

.bundle-banner-content {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
}

.bundle-product-plus {
    font-size: 26px;
    font-weight: bold;
    color: var(--color-primary);
    background: rgba(216, 200, 94, 0.1);
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    flex-shrink: 0;
}

.bundle-product-partner {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(0,0,0,0.2);
    padding: 15px;
    border-radius: 10px;
    flex: 1;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.bundle-product-partner img {
    width: 65px;
    height: 65px;
    object-fit: cover;
    border-radius: 6px;
}

.bundle-partner-info a {
    color: var(--color-white);
    text-decoration: none;
    font-size: 15px;
    display: block;
    margin-bottom: 5px;
    transition: color 0.3s;
}

.bundle-partner-info a:hover {
    color: var(--color-primary);
}

.bundle-partner-info .price {
    color: var(--color-primary);
    font-weight: bold;
    font-size: 16px;
}

a.button.custom-add-bundle-btn {
    display: block;
    width: 100%;
    background: var(--color-bundle) !important;
    color: #fff !important;
    border-radius: 30px !important;
    padding: 16px !important;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    transition: all 0.3s ease;
    text-decoration: none;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
}

a.button.custom-add-bundle-btn:hover {
    filter: brightness(0.85);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}

/* Responsive para el Bundle Banner */
@media (max-width: 767px) {
    .bundle-banner-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 10px;
    }
}

/* Estilos para la tabla de aplicaciones vehiculares */
.wrap-tabla-aplicaciones {
    overflow-x: auto;
    margin-top: 1rem;
}
.tabla-aplicaciones th, 
.tabla-aplicaciones td {
    text-align: left !important;
    padding: 10px 15px !important;
    border-bottom: 1px solid var(--border-subtle, #eee) !important;
}
.tabla-aplicaciones th {
    border-bottom: 2px solid var(--border-subtle, #ddd) !important;
    font-weight: 600;
}

/* Mejoras visuales para la galería nativa de WooCommerce */
.woocommerce-product-gallery {
    border-radius: var(--radius-lg, 12px);
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
    padding: 15px;
    border: 1px solid var(--border-subtle, #eaeaea);
}

.woocommerce-product-gallery__image img {
    border-radius: var(--radius-md, 8px);
    width: 100%;
    height: auto;
    display: block;
}

/* Contenedor de miniaturas (thumbnails) */
.woocommerce-product-gallery .flex-control-thumbs {
    display: flex !important;
    justify-content: flex-start;
    gap: 15px !important;
    margin-top: 30px !important; /* Más separación con la imagen principal */
    padding: 0;
}

/* Elementos de la miniatura */
.woocommerce-product-gallery .flex-control-thumbs li {
    list-style: none;
    width: calc(25% - 15px) !important; /* Resta el gap para que no se desborden y se separen de verdad */
    float: none !important;
    margin: 0 !important; /* Anula margenes nativos que pegan las imagenes */
}

/* Imagen de miniatura con efecto hover y estado activo */
.woocommerce-product-gallery .flex-control-thumbs li img {
    border-radius: var(--radius-sm, 6px);
    border: 2px solid transparent;
    transition: all 0.3s ease;
    opacity: 0.6;
    cursor: pointer;
    box-sizing: border-box;
}

.woocommerce-product-gallery .flex-control-thumbs li img:hover,
.woocommerce-product-gallery .flex-control-thumbs li img.flex-active {
    opacity: 1;
    border-color: var(--bg-deep, #333); /* Hereda un color oscuro si la variable no existe */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.custom-instock-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #27ae60;
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    z-index: 5;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    pointer-events: none;
}

/* --- Buscador del Catálogo --- */
.catalog-search-wrapper {
    margin: 0 auto 30px auto;
    max-width: 600px;
    padding: 0 15px; /* Evita que choque con los bordes en móvil */
    box-sizing: border-box;
}

.catalog-search-wrapper .woocommerce-product-search {
    display: flex;
    flex-direction: row;
    gap: 0; /* Fusionar campo y botón */
    align-items: center;
    width: 100%;
}

.catalog-search-wrapper .woocommerce-product-search label {
    display: none; /* Ocultar el label visualmente */
}

.catalog-search-wrapper .search-field {
    flex-grow: 1;
    width: 100%;
    padding: 12px 20px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--color-white, #fff);
    border-radius: 50px 0 0 50px; /* Bordes rectos a la derecha */
    font-size: 16px;
    transition: all 0.3s ease;
    box-sizing: border-box;
}

.catalog-search-wrapper .search-field:focus {
    border-color: var(--color-primary, #d8c85e);
    outline: none;
    box-shadow: 0 0 10px rgba(216, 200, 94, 0.2);
}

.catalog-search-wrapper button[type="submit"] {
    background: var(--color-primary, #d8c85e);
    color: #111;
    border: 1px solid var(--color-primary, #d8c85e);
    padding: 12px 25px;
    border-radius: 0 50px 50px 0; /* Bordes rectos a la izquierda */
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap; /* Evita que el botón colapse su texto en móviles */
}

.catalog-search-wrapper button[type="submit"]:hover {
    background: #fff;
    transform: translateY(-2px);
}

/* Responsividad para contador y ordenador del catálogo */
@media (max-width: 768px) {
    .woocommerce-result-count {
        float: none;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
    
    .woocommerce-ordering {
        float: none;
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }

    .woocommerce-ordering select {
        width: 100%;
        padding: 10px;
        background: rgba(255, 255, 255, 0.05);
        border: 1px solid rgba(255, 255, 255, 0.1);
        color: var(--color-white, #fff);
        border-radius: 6px;
    }
}