/*=====================================
  ESTILOS GLOBALES Y CONTENEDORES
  (Tamaños base: 1rem = 16px)
=======================================*/

body {
    background-color: #ffffff;
}

/* Títulos y Encabezados de Sección (Recomendados/Generales) */
.h2,
#onsale-products .h2 {
    /* Base para títulos fuera de #onsale-products */
    text-align: center;
    background: #85C1E9;
    padding: 0.875rem; /* 14px */
    font-size: 1rem;    /* 16px */
    border-radius: 1.5rem 0.0625rem 1.5rem 0.0625rem;
    text-transform: uppercase;
}

/* Secciones específicas */
#onsale-products {
    /* Degradado lineal de arriba hacia abajo: Rojo oscuro -> Rojo brillante -> Rojo oscuro */
    background: linear-gradient(to bottom, #D70000 0%, #FF0000 50%, #D70000 100%);
    border-radius: 0;
}

/* ********** MENÚ MÓVIL: AZUL OSCURO ********** */
.modal-body { 
    background-color: #003366; 
}

.barrita-inferior {
    background: #def7ff;
}

.barrita-superior-texto {
    font-size: 1rem;
    color: white;
}

/*=====================================
 SIDEBAR Y CATEGORÍAS (PRODUCTOS)
 (SOLUCIÓN FINAL PARA SUBCATEGORÍAS)
=======================================*/

/* Contenedor de las categorías (Principal) */
.sidebar-categories .widget.woocommerce.widget_product_categories {
    padding: 0.875rem; /* 14px */
    background-color: #003366; /* AZUL OSCURO */
    border-radius: 0.75rem; /* 12px */
}

/* Ítem de la lista de categorías (li) */
.sidebar-categories .widget_product_categories ul.product-categories > li {
    border-bottom: 0;
    padding: 0;
}

/* Elemento LINK del ítem de la lista de categorías (a) */
.sidebar-categories .widget_product_categories ul.product-categories > li a {
    padding: 0.875rem; /* 14px */
    color: white;
}

/* Elemento LINK del ítem con hover */
.sidebar-categories .widget_product_categories ul.product-categories > li a:hover {
    background-color: #00AFEF; /* CIAN BRILLANTE */
    color: #003366; /* AZUL OSCURO para contraste */
}

/* ********** ESTILOS PARA SUBCATEGORÍAS (.children) ********** */

/* 1. Contenedor de Subcategorías (la lista 'ul.children') */
.product-categories ul.children {
    /* Forzamos el color de fondo para anular el gris del tema */
    background-color: #003366 !important; 
    /* Ajusta la indentación horizontal si el tema la quitó */
    margin-left: 0;
    padding-left: 1rem;
}

/* 2. Enlaces de Subcategorías (el texto) */
.product-categories ul.children li a {
    /* Aseguramos el texto blanco en el link */
    color: white !important; 
    /* Reduce el padding para que visualmente se vean como sub-elementos */
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

/* 3. Estilizar el hover de los enlaces A de subcategorías */
.product-categories ul.children li a:hover {
    background-color: #00AFEF !important; /* CIAN BRILLANTE */
    color: #003366 !important; /* AZUL OSCURO para alto contraste */
}




/*=====================================
  PRODUCTOS (GRIDS/LISTADOS)
=======================================*/

.products-grid li.product,
.products-grid article.product,
.woocommerce:not(.single-product) li.product,
.woocommerce:not(.single-product) article.product {

    /* ********** IMÁGENES DE PRODUCTO: BORDE UNIFORME ********** */
    .woocommerce-loop-product__link img {
        border-radius: 0.5rem; /* Radio sutil y uniforme en todas las esquinas */
    }

    /* ********** TÍTULO DE PRODUCTO: MÁS GRANDE Y AZUL OSCURO ********** */
    .woocommerce-loop-product__link .woocommerce-loop-product__title {
        font-size: 1rem !important; 
        font-weight: 600; 
        padding: 0.625rem 0; 
        color: #003366; /* AZUL OSCURO */
        text-align: Center;
        text-transform: uppercase;
    }

    /* ********** PRECIO EN LISTADOS (NEGRO) ********** */
    .woocommerce-loop-product__link .price span {
        color: black !important; 
        text-align: center;
        font-weight: 600; 
        font-size: 1.3rem; 
    }
    
    /* Precio anterior tachado (MANTENIDO EN ROJO) */
    .woocommerce-loop-product__link .price del,
    .woocommerce-loop-product__link .price del span bdi,
    .woocommerce-loop-product__link .price del span bdi span {
        font-size: 1rem; 
        color: red; 
        font-weight: bold;
    }
    
    /* ********** BOTÓN AÑADIR AL CARRITO EN LISTADOS (AZUL CIAN) ********** */
    a.button.add_to_cart_button {
        background-color: #00AFEF !important; /* AZUL CIAN PRINCIPAL */
        color: white !important;
        font-weight: bold;
        text-transform: uppercase !important;
        border-radius: 0.5rem !important;
        border: none !important;
        width: 100%; /* Asegura el ancho completo */
        margin-top: 0.5rem;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
    }
    
    /* Hover para el botón de listado */
    a.button.add_to_cart_button:hover {
        background-color: #003366 !important; /* Azul Oscuro */
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    }
}


/* Ocultar etiquetas de stock y ofertas en grid (general) */
.onsale,
.out-of-stock,
.in-stock {
    display: none;
}

/*=====================================
  SECCIÓN DE OFERTAS (#onsale-products)
=======================================*/

#onsale-products {
    /* Degradado lineal de arriba hacia abajo: Rojo oscuro -> Rojo brillante -> Rojo oscuro */
    background: linear-gradient(to bottom, #D70000 0%, #FF0000 50%, #D70000 100%);
    border-radius: 0;
    /* Relleno interno para que el borde rojo se vea bien */
    padding: 1.5rem 0.625rem; 
}

/* ********** TÍTULO DE LA SECCIÓN DE OFERTAS ********** */
#onsale-products .h2 {
    font-size: 1.5rem; /* 24px */
    color: white !important; /* Texto BLANCO para alto contraste sobre el rojo */
    background: #000000 !important; /* Fondo NEGRO para el título */
    padding: 0.875rem !important; 
    border-radius: 0.75rem !important; /* Bordes un poco redondeados */
    text-transform: uppercase;
    margin-bottom: 1.5rem; /* Espacio debajo del título */
}

/* ********** Productos en Oferta (Listados dentro de la sección) ********** */
#onsale-products .products-grid li.product,
#onsale-products .products-grid article.product {
    background-color: #ffffff; /* Fondo Blanco para destacar */
    border-radius: 0.75rem; /* Bordes redondeados */
    /* Sombra para hacer que el producto "flote" */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3); 
    padding: 0.625rem; /* Pequeño relleno interior */
    margin-bottom: 1.5rem; /* Espacio entre productos */
}


/*=====================================
  PRODUCTOS (PÁGINA INDIVIDUAL)
=======================================*/

.single-product:not(.quickswish-content-area) .product {

    .entry-content {
        margin-top: 0.3125rem !important; /* 5px */
    }

    /* ********** 1. CONTENEDOR PRINCIPAL: FONDO AZUL OSCURO ********** */
    .summary.entry-summary {
        border-radius: 0.75rem; 
        margin-top: 0;
        /* Fondo azul oscuro */
        background-color: #003366; 
        box-shadow: none;
        border: none;
        /* REDUCCIÓN DE PADDING: 24px -> 16px arriba/abajo */
        padding: 1rem 1.25rem; 
        text-align: center; 
    }

    /* 2. TÍTULO - COLOR BLANCO y TAMAÑO REDUCIDO */
    .product_title {
        font-size: 1.4rem !important; /* MÁS PEQUEÑO */
        text-align: center; 
        padding-top: 0;
        margin-bottom: 0.5rem;
        text-transform: uppercase;
        color: white; /* COLOR: BLANCO */
    }

    /* ********** 3. PRECIO: CON SOMBRA SUTIL ********** */
    .price {
        text-align: center; 
        font-size: 1.3rem !important; 
        font-weight: bold; 
        
        /* Con sombra sutil */
        border: none; 
        border-radius: 0.5rem; 
        padding: 0.5rem 0.75rem; 
        margin: 0.75rem auto; 
        display: inline-block; 
        
        background-color: transparent; 
        color: #00AFEF !important; 
        
        /* Sombra sutil para destacar el precio (Azul Oscuro con 40% opacidad) */
        box-shadow: 0 4px 8px rgba(0, 51, 102, 0.4); 
        
        max-width: 80%; 
    }
    
    .price span {
        color: #00AFEF !important; 
    }
    
    /* Precio anterior (tachado): Gris claro para contraste en fondo oscuro */
    p.price del,
    span.price del {
        font-size: 1.0rem; 
        color: #AAAAAA; 
        font-weight: normal; 
    }
    
    /* Descripción corta: NEGRO (HEREDA FUENTE DEL TEMA) */
    .woocommerce-product-details__short-description {
        font-size: 0.9375rem !important; 
        padding: 0.5rem 0 0; 
        text-align: justify;
        color: #000000; 
    }
    
    /* ********** MEJORA: ESTILOS DE PESTAÑAS (TABS) ********** */
    .woocommerce-tabs ul.tabs li {
        background: #F0F0F0; /* Fondo gris claro inactivo */
        border: 1px solid #CCCCCC;
        border-bottom: 0;
        border-radius: 0.5rem 0.5rem 0 0;
    }
    
    .woocommerce-tabs ul.tabs li a {
        color: #003366; /* Texto azul oscuro */
        font-weight: 600;
    }
    
    .woocommerce-tabs ul.tabs li.active {
        background: #00AFEF; /* AZUL CIAN PRINCIPAL ACTIVO */
        border-color: #00AFEF;
        border-bottom: 1px solid #00AFEF; /* Ajuste para que la pestaña no se vea cortada */
    }
    
    .woocommerce-tabs ul.tabs li.active a {
        color: white; /* Texto blanco en pestaña activa */
    }
}

/* ********** 4. MEJORA: BOTÓN AÑADIR AL CARRITO (AZUL OSCURO) ********** */

.single-product .button.single_add_to_cart_button {
    /* Fondo AZUL OSCURO */
    background-color: #003366 !important;
    
    /* Texto en BLANCO */
    color: white !important; 
    
    /* ESTILOS CLAVE PARA DESTACAR */
    text-transform: uppercase !important;
    letter-spacing: 0.05rem;
    
    /* Tamaño y forma */
    font-size: 1.1rem !important;
    font-weight: bold !important;
    padding: 0.8rem 2rem !important;
    border-radius: 0.5rem !important;
    border: none !important;
    
    /* Asegurar que el ancho es total para móvil */
    width: 100%;
    display: block;
    margin-top: 1rem;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.4); 
}

/* Icono de Carrito de Compra (DELANTE del texto) */
.single-product .button.single_add_to_cart_button:before {
    font-family: 'bootstrap-icons'; /* Asume Bootstrap Icons está cargado */
    content: "\f244"; /* Código Unicode para el icono bi-cart-plus */
    margin-right: 0.625rem; 
    font-weight: bold;
    font-size: 1.1rem;
    vertical-align: top; 
}


/* Efecto Hover (al pasar el ratón) */
.single-product .button.single_add_to_cart_button:hover {
    /* FONDO ROJO BRILLANTE - ALTO CONTRASTE */
    background-color: #FF0000 !important; 
    /* Texto Blanco */
    color: white !important; 
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.5); 
}

/* Sección "TAMBIEN PODÉS LLEVARTE" (Upsells) */
.product_upsells h3 {
    text-align: center;
    background: #00afef;
    color: white;
    padding: 0.5rem; /* 8px */
    border-radius: 0.75rem; /* 12px */
    font-size: 1rem !important;
    font-weight: bold !important;
    text-transform: uppercase;
}


/*=====================================
  FOOTER Y CONTACTO
=======================================*/

/* Pie de página principal */
.site-footer {
    text-align: center;
    background-color: black;
    padding: 2rem 0.625rem 5rem 0.625rem !important;
    font-size: 0.875rem; /* 14px */
    font-weight: 600;
    margin-top: 1.2rem;
}

/* Títulos del Footer */
.site-footer h4,
.footer-categorias .widget-title {
    color: white;
}

/* Contenedor general de textos e íconos */
.footer-datos {
    color: white;
    margin: 0;
    padding: 0;
    list-style-type: none;
    text-align: center;
}

/* Datos información de contacto (Texto más pequeño) */
#footer-datos .footer-datos {
    color: white;
    font-size: 0.75rem; /* 12px */
}

/* Texto de la sección "Nosotros" */
.menu-footer {
    margin: 0;
    padding: 1rem; /* 16px */
    list-style-type: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 1rem;
}

/* Propiedades de los links de "Nosotros" */
.menu-footer > li > a {
    color: #00AFEF; /* Color Principal Oscuro */
    font-weight: bold;
    text-decoration: none;
}

/* Ítems categorías del Footer */
.footer-categorias .product-categories .cat-item a {
    color: white;
}

/* Ocultar sub-categorías en el footer */
footer .children {
    display: none;
}

/* Link de Instagram */
.link-instagram-footer {
    color: white;
    list-style-type: none;
    text-decoration: none;
}

.link-instagram-footer:hover {
    color: white;
}

.bi-instagram {
    font-size: 1.25rem; /* 20px */
}

/* Lugar donde van los logos de pago */
.footer-pagos {
    text-align: center;
    padding: 0.25rem; /* 4px */
    font-size: 0.8rem;
    font-weight: 600;
    margin-top: 1.2rem;
}

/* Logo URUTIENDA */
.footer-urutienda {
    display: none;
}

.footer-urutienda-logo {
    display: flex;
    justify-content: flex-end;
}

.footer-urutienda-logo a {
    margin-top: 1rem;
    padding-top: 1rem;
    display: flex;
    width: 35%;
}

.urutienda-sub-container {
    background: #3c3c3c !important;
}

.urutienda-sub-title {
    color: white;
}

/*=====================================
  VARIOS Y UTILIDADES
=======================================*/

/* Ocultar categorías específicas */
.cat-item-114,
.cat-item-88 {
    display: none !important;
}

/* Títulos de páginas/entradas */
.entry-title {
    text-align: center !important;
    text-transform: uppercase;
}

/* Metaslider (Carrousel en home) */
.metaslider.ml-slider {
    margin-top: 0.3125rem !important; /* 5px */
}

/* Estilos de filtro de productos */
.woocommerce-ordering .orderby {
    font-size: 0.875rem; /* 14px */
    font-weight: bold;
    color: black;
    border-radius: 0;
    box-shadow: none;
    padding: 0.875rem 1.5625rem;
}

/* Descripción de término/categoría */
.term-description {
    text-align: center;
    margin-bottom: 1.25rem !important; /* 20px */
    font-size: 1.rem; /* 16px */
}

/* Elementos de pago bancario (Ocultar) */
.wc-bacs-bank-details-account-name,
.wc-bacs-bank-details-heading {
    display: none;
}

/* Búsqueda */
.main-search-form .aws-search-field {
    border: 1.2px solid #000000 !important;
}

/* Alerta de Stock (Plugin) */
.stock_alert_button {
    text-align: center;
    background: #00afef;
    color: white;
    border-radius: 0.75rem; /* 12px */
}

.subscribe_for_interest_text {
    font-size: 1rem !important;
    font-weight: bold;
}

.stock_notifier-subscribe-form {
    padding-left: 1.375rem !important; /* 22px */
    padding-bottom: 2.5rem; /* 40px */
}

/* Ícono y texto de descripción con fondo azul */
.icono-home-desc {
    background: #85C1E9;
    color: white;
    text-align: justify;
    font-size: 1.125rem !important; /* 18px */
    font-weight: bold;
    padding: 0.9375rem 5.625rem; /* 15px arriba/abajo, 90px laterales */
    border-radius: 0.625rem; /* 10px */
}

.bi.bi-truck,
.icono-home-title {
    display: none;
}


/*=====================================
  MEDIA QUERY: OPTIMIZACIÓN PARA MÓVIL
  (Aplicar para pantallas <= 768px)
=======================================*/

@media (max-width: 768px) {

    /* --- 1. Compactar Barra Superior de Aviso --- */
    /* La barra mantiene su altura original. */

    /* --- 2. Compactar el Footer (Pie de Página) --- */
    
    /* OCULTAMOS: La lista de categorías Y su título */
    .footer-categorias .widget_product_categories ul.product-categories,
    .footer-categorias .widget-title { 
        display: none !important;
    }
    
    /* MANTENEMOS VISIBLES: Nosotros, Contacto y Logo Urutienda */
    .menu-footer,
    #footer-datos .footer-datos,
    .footer-urutienda-logo {
        display: block !important; 
    }
    
    /* Reducir el padding general del footer */
    .site-footer {
        padding: 1.5rem 0.625rem 3rem 0.625rem !important; 
    }
    
    /* Ajustar el padding de la sección de categorías para que no sea muy ancho */
    .sidebar-categories .widget.woocommerce.widget_product_categories {
        padding: 0.625rem;
    }
}