/* ==========================================================================
   FICHA DE PRODUCTO HUG - KADENCE NATIVO + GLASSMORPHISM
   ========================================================================== */

/* 1. Fondo de la ficha de producto y tipografía base */
.single-product {
    background-color: var(--hug-dark) !important;
    color: #e2e8f0 !important;
}
.single-product h1, 
.single-product h2, 
.single-product h3, 
.single-product h4, 
.single-product h5, 
.single-product h6 {
    color: #ffffff !important;
    font-family: var(--sl-font) !important;
}

/* 2. El Hero contenedor (Inyectado vía Hook) */
.hug-product-hero-glass {
    background: rgba(15, 22, 17, 0.65);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(163, 209, 51, 0.08);
    border-radius: 24px;
    padding: 3rem;
    position: relative;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
    margin-top: 4rem;
    margin-bottom: 3rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
    align-items: start;
}
.hug-product-hero-glass::before {
    content: ''; 
    position: absolute; 
    top: -30%; 
    left: 20%; 
    width: 60%; 
    height: 150%; 
    background: radial-gradient(circle, rgba(163, 209, 51, 0.15) 0%, transparent 60%); 
    pointer-events: none; 
    z-index: -1;
}

/* 3. Ajustes de WooCommerce Nativos para encajar en el Hero */
.single-product div.product {
    background: transparent !important;
}

/* Forzar ancho al 100% dentro de nuestro Grid, matando el float/width nativo de Kadence */
.single-product div.product .woocommerce-product-gallery,
.single-product div.product .summary.entry-summary {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.single-product div.product .woocommerce-product-gallery {
    border-radius: 16px;
    overflow: hidden;
    background: transparent !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}
.single-product div.product .woocommerce-product-gallery img {
    border-radius: 16px;
    width: 100% !important;
    height: auto !important;
    display: block;
}

/* Título */
.single-product div.product .product_title {
    font-size: clamp(2rem, 4vw, 3rem) !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    margin-bottom: 1rem !important;
}

/* Precio */
.single-product div.product p.price, 
.single-product div.product span.price {
    color: #a3d133 !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
}
.single-product div.product p.price del, 
.single-product div.product span.price del {
    color: #6b7a5e !important;
    font-size: 1.2rem !important;
}

/* Descripción Corta */
.single-product div.product .woocommerce-product-details__short-description {
    color: #e2e8f0 !important;
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
    margin-bottom: 2rem !important;
}
.single-product div.product .woocommerce-product-details__short-description p {
    color: #e2e8f0 !important;
    margin-bottom: 1rem !important;
}

/* Opciones de Variación (Formato) */
.single-product div.product form.cart .variations {
    margin-bottom: 1.5rem !important;
}
.single-product div.product form.cart .variations label {
    color: #e2e8f0 !important;
    font-weight: 600 !important;
    margin-bottom: 0.5rem !important;
    display: block !important;
}
.single-product div.product form.cart .variations select {
    background: rgba(255,255,255,0.08) !important;
    color: #fff !important;
    border: 1px solid rgba(163, 209, 51, 0.4) !important;
    border-radius: 8px !important;
    padding: 12px 15px !important;
    width: 100% !important;
    max-width: 300px !important;
    font-size: 1rem !important;
    outline: none !important;
}
.single-product div.product form.cart .variations select:focus {
    border-color: #a3d133 !important;
    background: rgba(255,255,255,0.12) !important;
}
.single-product div.product form.cart .variations select option {
    background: #0b100d !important;
    color: #fff !important;
}

/* Contenedor Add to Cart y Cantidad */
.single-product div.product form.cart .woocommerce-variation-add-to-cart,
.single-product div.product form.cart.grouped_form,
.single-product div.product form.cart:not(.variations_form) {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    flex-wrap: wrap !important;
    margin-top: 1.5rem !important;
}

/* Botón Añadir al Carrito Nativo */
.single-product div.product form.cart button.single_add_to_cart_button {
    background-color: #a3d133 !important;
    color: #050806 !important;
    border-radius: 12px !important;
    font-weight: 800 !important;
    font-size: 1.1rem !important;
    padding: 15px 30px !important;
    border: none !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 4px 15px rgba(163, 209, 51, 0.2) !important;
    margin: 0 !important; /* Quitar margin superior del botón */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.single-product div.product form.cart button.single_add_to_cart_button:hover {
    background-color: #b5e345 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 25px rgba(163, 209, 51, 0.4) !important;
}

/* Input Cantidad */
.single-product div.product form.cart div.quantity {
    display: flex !important;
    margin: 0 !important;
}
.single-product div.product form.cart div.quantity .qty {
    background: rgba(255,255,255,0.08) !important;
    color: #fff !important;
    border: 1px solid rgba(163, 209, 51, 0.4) !important;
    border-radius: 12px !important;
    height: 54px !important;
    width: 70px !important;
    padding: 0 10px !important;
    text-align: center !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    outline: none !important;
}
.single-product div.product form.cart div.quantity .qty:focus {
    border-color: #a3d133 !important;
}
.single-product div.product form.cart div.quantity input::-webkit-outer-spin-button,
.single-product div.product form.cart div.quantity input::-webkit-inner-spin-button {
    opacity: 1; /* Forzar mostrar flechas en webkit si es necesario, aunque a veces el tema las quita */
}

/* Meta Data (Categorías, SKU) */
.single-product div.product .product_meta {
    color: #6b7a5e !important;
}
.single-product div.product .product_meta a {
    color: #a3d133 !important;
}

/* 4. Pestañas (Acordeón de Descripción) */
.woocommerce-tabs {
    background: rgba(15, 22, 17, 0.65);
    border: 1px solid rgba(163, 209, 51, 0.08);
    border-radius: 24px;
    padding: 2rem !important;
}
.woocommerce-tabs ul.tabs {
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}
.woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
}
.woocommerce-tabs ul.tabs li a {
    color: #b8c4a8 !important;
    font-weight: 700 !important;
}
.woocommerce-tabs ul.tabs li.active a {
    color: #a3d133 !important;
    border-bottom: 2px solid #a3d133 !important;
}
.woocommerce-Tabs-panel h2 {
    color: #fff !important;
}
.woocommerce-Tabs-panel p,
.woocommerce-Tabs-panel table {
    color: #b8c4a8 !important;
}

/* Imágenes nativas (ya resuelto arriba, eliminamos esto para no duplicar) */

/* Badges / Stock */
.in-stock.low-stock { color: #f59e0b !important; }
.in-stock { color: #a3d133 !important; }
.out-of-stock { color: #ef4444 !important; }

/* Responsive adjustments */
@media (max-width: 768px) {
    .hug-product-hero-glass {
        padding: 1.5rem;
        grid-template-columns: 1fr;
        gap: 2rem;
        margin-top: 2rem;
    }
}

/* 5. Alertas de WooCommerce (Añadido al carrito, Errores) */
.single-product .woocommerce-notices-wrapper,
.single-product .woocommerce-message,
.single-product .woocommerce-error,
.single-product .woocommerce-info {
    width: 100% !important;
    margin-bottom: 2rem !important;
    background: rgba(163, 209, 51, 0.1) !important;
    border: 1px solid rgba(163, 209, 51, 0.3) !important;
    border-radius: 12px !important;
    color: #e2e8f0 !important;
    padding: 15px 20px !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2) !important;
    flex-wrap: wrap;
    gap: 15px;
}
.single-product .woocommerce-message::before,
.single-product .woocommerce-info::before {
    display: none !important; /* Quitamos el icono nativo feo */
}
.single-product .woocommerce-message .button,
.single-product .woocommerce-error .button,
.single-product .woocommerce-info .button {
    background: #a3d133 !important;
    color: #050806 !important;
    border-radius: 8px !important;
    padding: 8px 16px !important;
    font-weight: 700 !important;
    border: none !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.5px !important;
}
.single-product .woocommerce-message .button:hover {
    background: #b5e345 !important;
}