/*
 Theme Name:   Astra Child
 Theme URI:    https://wpastra.com/
 Description:  Tema hijo para Astra con soporte de subcategorías dinámicas de WooCommerce.
 Author:       Inforrada Soluciones Tecnológicas
 Author URI:   https://inforrada.es
 Template:     astra
 Version:      1.0.0
 Text Domain:  astra-child
*/

/* ==========================================================================
   Estilos para Submenús Dinámicos de Categorías WooCommerce (Astra)
   ========================================================================== */

/* 1. Asegurar la visualización del submenú de 2º y 3er nivel al hacer hover */
.main-header-menu .menu-item-has-children-auto {
    position: relative;
}

/* 2. Posicionamiento del submenú desplegable lateral (Sub-subcategorías / Nivel 3+) */
.main-header-menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
    margin-top: -1px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

/* Ajuste para pantallas donde el desplegable pueda salirse por la derecha */
.main-header-menu .sub-menu .menu-item:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    display: block;
}

/* 3. Indicador visual (flechita) para categorías que tienen subcategorías */
.main-header-menu .sub-menu .menu-item-object-product_cat.menu-item-has-children-auto>a::after {
    content: "›";
    float: right;
    font-size: 14px;
    font-weight: bold;
    margin-left: 10px;
    line-height: 1;
    transition: transform 0.2s ease;
}

/* 4. Estilos visuales al pasar el ratón (Hover state) */
.main-header-menu .sub-menu .menu-item-object-product_cat>a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 18px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.main-header-menu .sub-menu .menu-item-object-product_cat>a:hover {
    background-color: rgba(0, 0, 0, 0.03);
}

/* 5. Adaptación responsive para el menú móvil de Astra */
@media (max-width: 921px) {
    .ast-header-break-point .main-header-menu .sub-menu .sub-menu {
        left: 0;
        top: 100%;
        position: relative;
        box-shadow: none;
        padding-left: 15px;
        /* Indentación para ver la jerarquía en móvil */
        background: transparent;
    }

    .ast-header-break-point .main-header-menu .sub-menu .menu-item-object-product_cat.menu-item-has-children-auto>a::after {
        content: "⌄";
    }
}


/* Botón de Lista de Deseos en Ficha de Producto */
.btn-wishlist-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: transparent !important;
    border-style: none !important;
	box-shadow: none !important;
    color: #333333;
    cursor: pointer;
    font-size: 14px;
    margin-left: 16px;
    transition: all 0.3s ease;
}

.btn-wishlist-toggle .icon-corazon {
    color: #999999;
    font-size: 16px;
    transition: color 0.3s ease;
}

/* Estado Activo (Guardado en la lista) */
.btn-wishlist-toggle.en-wishlist {
    color: #e63946;
}

.btn-wishlist-toggle.en-wishlist .icon-corazon {
    color: #e63946;
}

/* Efecto Hover */
.btn-wishlist-toggle:hover {

    color: #e63946;
}

.btn-wishlist-toggle:hover .icon-corazon {
    color: #e63946;
}

/* Estado de carga */
.btn-wishlist-toggle.cargando {
    opacity: 0.6;
    cursor: wait;
}

/* Estilos para el botón añadir al carrito */
/* ==========================================================================
   Botón Añadir al Carrito (Fondo Blanco, Borde Negro, Icono + Precio)
   ========================================================================== */

.wp-block-woocommerce-product-template .wp-block-button__link,
.add_to_cart_button
 {
    background-color: var(--ast-global-color-4) !important;
    color: var(--ast-global-color-2) !important;
    border: 2px solid var(--ast-global-color-2) !important;
    border-radius: 25px !important; /* Bordes redondeados / pastilla */
    padding: 8px 18px !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    letter-spacing: 1px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    line-height: 1.2 !important;
    box-shadow: none !important;
    transition: all 0.25s ease !important;
    text-decoration: none !important;
}

/* Inyectar icono de carrito por CSS antes del precio */
a.button.add_to_cart_button.ajax_add_to_cart::before,
button.add_to_cart_button.ajax_add_to_cart::before
 {
    content: '' !important;
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    background-color: currentColor !important; /* Hereda el color negro del texto */
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12'/%3E%3C/svg%3E") !important;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12'/%3E%3C/svg%3E") !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    flex-shrink: 0 !important;
}

/* Efecto al pasar el cursor (Hover) */
.wp-block-woocommerce-product-template .wp-block-button__link:hover,
.add_to_cart_button:hover
{
    color: var(--ast-global-color-3) !important; /* Texto e icono pasan a blanco */
    border-color: var(--ast-global-color-3) !important;
    transform: translateY(-2px);
}