/*
Theme Name: Astra Child
Description: Diseño Gemelo Digital - V13.0 (Optimizado & Organizado)
Version: 13.0
*/

/* =======================================================
   1. COLORES Y FUENTES GLOBALES (CENTRO DE MANDO)
   ======================================================= */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

:root {
    /* --- A. TUS COLORES (Edita solo aquí) --- */
    --primary: #3f4d33;       /* Verde Lobby (Tu color principal) */
    --secondary: #2a3322;     /* Verde Oscuro (Para hovers) */
    --accent: #991b1b;        /* Rojo (Para alertas, botón clear) */
    --bg-color: #f7f5f0;      /* Crema (Fondo web) */
    --text-color: #3f4d33;    /* Texto general */
    --white: #ffffff;         /* Blanco puro */
    --border: #d1d5db;        /* Bordes sutiles */

    /* --- B. MAPEO AUTOMÁTICO A ASTRA (No tocar) --- */
    --ast-global-color-0: var(--primary);
    --ast-global-color-1: var(--secondary);
    --ast-global-color-2: var(--text-color);
    --ast-global-color-3: var(--text-color);
    --ast-global-color-4: var(--white);
    --ast-global-color-5: var(--bg-color);
    
    /* Variables de botones nativos de Astra */
    --ast-btn-color: var(--white);
    --ast-btn-bg-color: var(--primary);
    --ast-btn-bg-hover-color: var(--secondary);
}

/* Aplicación Global de Fondo y Fuente */
body, html, .site-content, .ast-container, div.product { 
    background-color: var(--bg-color) !important; 
}

body { 
    color: var(--text-color) !important; 
    font-family: 'Outfit', sans-serif !important; 
}

/* Inputs y Formularios Globales */
input, select, textarea {
    color: var(--text-color) !important; 
    background-color: var(--white) !important;
    border: 1px solid #d1d5db !important; 
    font-family: 'Outfit', sans-serif !important;
}

/* Selección de texto */
::selection {
    background: var(--primary);
    color: var(--white);
}

/* =======================================================
   2. HEADER FIXED, TRANSPARENTE Y FUNCIONAL
   ======================================================= */
.site-header {
    position: fixed !important;
    top: 0; left: 0; width: 100%;
    z-index: 9999 !important;
    background: rgba(247, 245, 240, 0.85) !important;
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(63, 77, 51, 0.1);
    transition: all 0.3s ease;
    overflow: visible !important;
}

.site-header .ast-builder-grid-row {
    align-items: center !important;
    min-height: 80px !important; 
    overflow: visible !important;
}

/* Título */
.site-title, .site-title a, h1.site-title a {
    font-family: 'Playfair Display', serif !important;
    font-weight: 700 !important;
    font-size: 32px !important;
    color: var(--text-color) !important;
    text-transform: none !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

/* Flexbox Helpers Header */
.site-branding, .ast-site-identity,
.ast-builder-menu, .main-header-menu, .ast-header-account-wrap {
    display: flex !important; align-items: center !important; height: 100% !important;
}

/* Interactividad Iconos */
.ast-header-search, .ast-site-header-cart {
    z-index: 10000 !important;
    position: relative !important;
    pointer-events: auto !important;
}

/* Ajustes de Layout Header */
.site-content { padding-top: 85px !important; }
.home .site-content { padding-top: 0 !important; }
.ast-main-header-wrap .ast-builder-grid-row-container-inner {
    max-width: 100% !important; padding-left: 30px !important; padding-right: 30px !important;
}

/* =======================================================
   3. ESTILOS DE PRODUCTO (TÍTULOS Y METADATOS)
   ======================================================= */
h1.product_title, .product .entry-summary .entry-title {
    font-family: 'Playfair Display', serif !important; color: var(--text-color) !important;
    font-size: 45px !important; line-height: 1.1 !important; margin-bottom: 0.5rem !important;
}

/* Títulos de relacionados */
.related.products h2 {
    font-size: 30px !important; margin-bottom: 26px !important;
    font-family: 'Playfair Display', serif !important; color: var(--text-color) !important;
}

/* Ocultar elementos no deseados */
.product .entry-summary .product_meta,
.product_meta .sku_wrapper,
#tab-title-pwb_tab a { 
    display: none !important; 
}

.products .flex-col small{
    font-size: 10px;
    color: #d1d5db;
}

/* Oculta rango de precios y descripciones cortas */
.product .entry-summary p {
    display: none !important;
}

#content .ast-container { padding-top: 0px; }

/* =======================================================
   4. CAJA DE COMPRA (FUNCIONALIDAD VARIACIONES)
   ======================================================= */
form.cart {
    display: flex !important; flex-direction: column !important; gap: 1rem !important;
    background: #fff !important; padding: 1.5rem !important;
    border: 1px solid rgba(63, 77, 51, 0.1) !important; border-radius: 8px !important;
    margin-bottom: 2rem !important; width: 85% !important; position: relative !important;
}

/* Tablas de variaciones convertidas a Flex */
table.variations { 
    width: 100% !important; border: none !important; margin: 0 !important;
    display: flex !important; flex-direction: column !important;
}
table.variations tbody { display: flex !important; flex-direction: column !important; border: none !important; }
table.variations tr {
    display: flex !important; flex-wrap: wrap !important; 
    border: none !important; margin-bottom: 10px !important;
}
table.variations td { display: block !important; width: 100% !important; padding: 0 !important; border: none !important; }

/* Etiquetas y Selectores */
table.variations label {
    font-weight: 700 !important; text-transform: uppercase !important; font-size: 0.8rem !important;
    color: var(--text-color) !important; margin-bottom: 5px !important;
}
.variations tr .label {
    border: none !important; transform: translateX(4px);
}
table.variations select {
    width: 100% !important; height: 45px !important; padding: 0 10px !important; 
    border: 1px solid #d1d5db !important; background-color: #ffffff !important;
    position: relative !important; z-index: 10 !important;
}

/* Botón Clear y Precio */
a.reset_variations {
    font-size: 11px !important; color: #991b1b !important; display: inline-block !important; 
    margin-top: 5px !important; visibility: visible !important;
}
.woocommerce-variation-price, .single_variation .price {
    display: block !important; margin-bottom: 20px !important; color: #3f4d33 !important;
    font-size: 26px !important; font-weight: 700 !important; font-family: 'Playfair Display', serif !important;
}

/* Botones y Layout Carrito */
.woocommerce-variation-add-to-cart { display: flex !important; gap: 10px !important; }
.single_variation_wrap, .woocommerce-variation { display: block !important; visibility: visible !important; opacity: 1 !important; }

/* =======================================================
   5. GRID DE PRODUCTO Y PESTAÑAS
   ======================================================= */
.product-grid-layout {
    display: grid; grid-template-columns: 1fr; gap: 3rem; padding-top: 2rem; margin-bottom: 2rem !important; 
}
@media (min-width: 900px) {
    .product-grid-layout { grid-template-columns: 1.1fr 0.9fr; align-items: start; }
    .sticky-column { position: sticky; top: 120px !important; }
}

/* Imágenes */
.woocommerce-product-gallery__image img {
    width: 100% !important; height: auto !important; border-radius: 12px; display: block; box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}
.woocommerce-product-gallery__trigger { display: none !important; }

/* Inputs Cantidad y Botón Añadir */
.quantity .qty {
    width: 70px !important; height: 50px !important; text-align: center !important; border-radius: 4px !important;
    color: #3f4d33 !important; -webkit-text-fill-color: #3f4d33 !important; background-color: #ffffff !important; font-weight: 700 !important;
}
button.single_add_to_cart_button {
    flex-grow: 1 !important; height: 50px !important; background-color: var(--primary) !important;
    color: white !important; border: none !important; border-radius: 4px !important;
    text-transform: uppercase !important; font-weight: 600 !important;
}
button.single_add_to_cart_button:hover { background-color: #2a3322 !important; }

/* Pestañas (Tabs) */
.woocommerce-tabs, .woocommerce-tabs ul.tabs {
    border: none !important; border-top: none !important; margin-top: 0px !important; padding-top: 23px !important;
}
.woocommerce-tabs ul.tabs { display: flex !important; gap: 2rem !important; padding: 0 !important; margin-bottom: 2rem !important; }
.woocommerce-tabs ul.tabs li a { padding: 0.5rem 0 !important; color: var(--text-color) !important; font-family: 'Outfit', sans-serif !important; opacity: 0.5; }
.woocommerce-tabs ul.tabs li.active a { opacity: 1 !important; border-bottom: 2px solid var(--text-color) !important; }

/* Extras y Breadcrumbs */
.product_meta img, .product_meta .wc-brand-image {
    width: auto !important; height: auto !important; max-height: 100px !important; margin-top: 20px !important;
}
.single-product .entry-header, .single-product .ast-single-entry-banner { display: none !important; }
.ast-breadcrumbs .trail-items { display: flex !important; flex-wrap: wrap; padding: 0; margin-bottom: 1rem; list-style: none; font-size: 0.85rem; opacity: 0.8; }
.ast-breadcrumbs li::after { content: "/" !important; margin: 0 8px; opacity: 0.5; }
.related.products { margin-top: 6rem !important; padding-top: 4rem !important; border-top: none !important; width: 100% !important; }

/* =======================================================
   6. FIX HOME PAGE (ROMPER JAULA ASTRA)
   ======================================================= */
.home .ast-container, .home .site-content, .home #primary, .home #main {
    max-width: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; display: block !important;
}
/* Hero Expandido */
.home main > section:first-child {
    width: 100vw !important; position: relative !important;
    left: 50% !important; right: 50% !important;
    margin-left: -50vw !important; margin-right: -50vw !important;
}
/* Proteger Header en Home */
.home .site-header .ast-main-header-wrap .ast-container,
.home .site-header .ast-builder-grid-row-container-inner {
    max-width: 1240px !important; margin: 0 auto !important; padding-left: 20px !important; padding-right: 20px !important;
}

/* =======================================================
   7. FIX LUPA MANUAL (NECESARIO PARA SCRIPT WPCODE)
   ======================================================= */
.ast-search-menu-icon .search-form {
    display: block !important; visibility: hidden !important; opacity: 0 !important;
    top: 100% !important; right: 0 !important; position: absolute !important;
    background: #fff !important; width: 300px !important; padding: 20px !important;
    box-shadow: 0 10px 30px rgba(63, 77, 51, 0.15) !important;
    border: 1px solid rgba(63, 77, 51, 0.1) !important;
    z-index: 999999 !important; transition: all 0.3s ease !important;
    transform: translateY(10px) !important;
}
/* Clase activada por JS */
.ast-search-menu-icon .search-form.visible-manual {
    visibility: visible !important; opacity: 1 !important; transform: translateY(0) !important;
}
/* Input Lupa */
.ast-search-menu-icon .search-form input.search-field {
    width: 100% !important; border: 1px solid #d1d5db !important; padding: 10px !important;
}

/* =======================================================
   9. YELLOWPENCIL FIXES (CARRITO Y MENÚ)
   ======================================================= */

/* 1. MENÚ DE NAVEGACIÓN */
#primary-site-navigation-desktop .menu-item .menu-link {
    color: var(--secondary) !important;
    font-weight: 500 !important;
}

/* 2. BOTONES DEL CARRITO */
.woocommerce-cart .actions .coupon .button,
.woocommerce-cart .actions .button[name="update_cart"] {
    color: var(--secondary) !important;
    position: relative;
    left: 1px;
    background-color: transparent !important;
}

.woocommerce-cart .actions .button:hover,
.woocommerce-cart .actions .coupon .button:hover {
    background-color: var(--secondary) !important;
    color: var(--bg-color) !important;
}

/* 3. ALINEACIÓN DE LA FILA DE ACCIONES */
.cart tr .actions {
    position: relative !important;
    left: -1px !important;
    top: -1px !important;
}

/* 4. BOTÓN FINALIZAR COMPRA */
.cart_totals .wc-proceed-to-checkout .checkout-button {
    color: var(--secondary) !important;
    background-color: transparent !important;
}

.cart_totals .wc-proceed-to-checkout .checkout-button:hover {
    background-color: var(--secondary) !important;
    color: var(--bg-color) !important;
}

#page footer,
#page .mx-auto .text-center {
    border-top-color: var(--border) !important;
    border-top-style: solid !important;
    border-top-width: 1px !important;
}

/* =======================================================
   10. DISEÑO CATÁLOGO / TIENDA (SHOP FIX)
   ======================================================= */

/* 1. Contenedor y Barra Superior */
.ast-woocommerce-container {
    padding-top: 0px !important;
}

/* Separar la barra de herramientas de los productos */
.woocommerce-result-count, .woocommerce-ordering {
    margin-bottom: 40px !important;
}

/* 2. Rejilla de Productos */
ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
    gap: 30px !important; width: 100% !important;
}

ul.products::before, ul.products::after { display: none !important; }

/* 3. Estética de la Tarjeta de Producto */
ul.products li.product {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 20px !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
    margin: 0 !important;
    width: 100% !important;
}

/* Hover: La tarjeta "flota" */
ul.products li.product:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(63, 77, 51, 0.08) !important;
    border-color: var(--primary) !important;
}

/* 4. TÍTULO Y PRECIO */
.woocommerce-loop-product__title {
    font-family: 'Playfair Display', serif !important;
    font-size: 18px !important;
    color: var(--text-color) !important;
    margin-top: 15px !important;
    padding: 0 !important;
    line-height: 1.2 !important;
}

/* PRECIO: Selectores unificados para evitar duplicidad de propiedades */
.price, 
.products .text-primary, 
.products .flex-col .text-primary,
.price span.woocommerce-Price-amount,
.price span.woocommerce-Price-currencySymbol,
.text-primary span.woocommerce-Price-amount,
.text-primary span.woocommerce-Price-currencySymbol {
    font-family: 'Outfit', sans-serif !important;
    color: var(--primary) !important;
    font-weight: 500 !important;
    font-size: 18px !important;
}

/* Contenedor del precio específico */
.price, 
.products .text-primary, 
.products .flex-col .text-primary {
    display: block !important;
    margin-bottom: 15px !important;
    margin-top: 5px !important;
}

/* 5. Botón "Añadir al Carrito" en Catálogo */
ul.products li.product .button {
    width: 100% !important;
    background-color: transparent !important;
    color: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    padding: 8px 0 !important;
    border-radius: 4px !important;
    margin-top: 10px !important;
    font-size: 0.9rem !important;
}

ul.products li.product .button:hover {
    background-color: var(--primary) !important;
    color: var(--white) !important;
}

/* SUFIJO DE IMPUESTOS (VAT Included) - Estilo Sutil */
.price .woocommerce-price-suffix,
.text-primary .woocommerce-price-suffix {
    font-family: 'Outfit', sans-serif !important;
    font-size: 10px !important;       
    color: #9ca3af !important;        
    font-weight: 400 !important;      
    text-transform: none !important;  
    margin-left: 4px !important;      
    display: inline-block !important; 
    opacity: 0.8 !important;          
}

/* =======================================================
   11. CONTROL DE ESPACIOS (INTEGRACIÓN YELLOWPENCIL)
   ======================================================= */

/* A. TIENDA (SHOP): Subir contenido para anular el padding de 85px */
.post-type-archive-product #content .ast-container,
.woocommerce-shop #content .ast-container,
.tax-product_cat #content .ast-container {
    padding-top: 0px !important;
    margin-top: -85px !important; 
}

/* B. PRODUCTO INDIVIDUAL: Aquí SÍ queremos los 85px */
.single-product #content .ast-container {
    padding-top: 85px !important;
    margin-top: 0px !important;
}

/* Hide breadcrumb */
nav.woocommerce-breadcrumb {
    display: none;
}

/* =======================================================
   13. ESTILOS HUSKY / WOOF (NUEVOS FILTROS)
   ======================================================= */

/* 1. TÍTULOS DE FILTRO */
.woof_container h4 {
    font-family: 'Playfair Display', serif !important;
    font-size: 18px !important;
    color: var(--primary) !important;
    font-weight: 700 !important;
    text-transform: none !important;
    border-bottom: 1px solid var(--border) !important;
    padding-bottom: 10px !important;
    margin-bottom: 15px !important;
    margin-top: 25px !important;
}
.woof_container:first-child h4 { margin-top: 0 !important; }

/* 2. TEXTOS Y LISTAS */
.woof_list li {
    padding: 0 !important;
    margin: 0 0 8px 0 !important;
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}
.woof_list label {
    font-family: 'Outfit', sans-serif !important;
    color: var(--text-color) !important;
    font-size: 15px !important;
    cursor: pointer !important;
    margin-left: 8px !important;
    display: inline-block !important;
}
.woof_list label:hover {
    color: var(--primary) !important;
}

/* 3. CHECKBOXES PERSONALIZADOS */
.woof_checkbox_term {
    accent-color: var(--primary) !important;
    transform: scale(1.1);
    cursor: pointer !important;
}

/* 4. CONTADORES */
.woof_checkbox_count {
    color: #9ca3af !important; 
    font-size: 0.8em !important; 
    margin-left: 5px !important;
}

/* 5. SLIDER DE PRECIO */
.irs--round .irs-line {
    background-color: #e5e7eb !important; 
    height: 4px !important;
    border-radius: 4px !important;
    top: 36px !important;
}
.irs--round .irs-bar {
    background-color: var(--primary) !important; 
    height: 4px !important;
    top: 36px !important;
}
.irs--round .irs-handle {
    border: 2px solid var(--primary) !important;
    background-color: white !important;
    width: 18px !important;
    height: 18px !important;
    top: 29px !important;
    box-shadow: 0 2px 5px rgba(63, 77, 51, 0.2) !important;
    cursor: grab !important;
}
.irs--round .irs-handle:hover,
.irs--round .irs-handle.state_hover {
    background-color: var(--primary) !important;
    transform: scale(1.1); 
}
.irs--round .irs-from, 
.irs--round .irs-to, 
.irs--round .irs-single {
    background-color: var(--primary) !important;
    color: white !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
    padding: 2px 6px !important;
    top: 0px !important;
}
.irs--round .irs-from:before, 
.irs--round .irs-to:before, 
.irs--round .irs-single:before {
    border-top-color: var(--primary) !important;
}
.irs-grid-text {
    color: var(--text-color) !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 11px !important;
    opacity: 0.6;
    bottom: 5px !important;
}
.irs-grid-pol {
    background-color: #e5e7eb !important;
}

/* 6. BOTÓN RESET */
.woof_reset_search_form {
    background-color: transparent !important;
    color: var(--accent) !important;
    border: 1px solid var(--accent) !important;
    padding: 8px 15px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 11px !important;
    margin-top: 20px !important;
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: 0.3s !important;
}
.woof_reset_search_form:hover {
    background-color: var(--accent) !important;
    color: #fff !important;
}
.woof_sid_widget .irs .irs span{
    color: #2a3322 !important;
    font-family: 'Outfit', sans-serif;
}

/* =======================================================
   14. FIX FOOTER DEFINITIVO
   ======================================================= */

/* 1. TÍTULOS DE LOS WIDGETS */
#colophon #block-8 h3, 
#colophon #block-9 h3 {
    color: var(--secondary) !important; 
    font-weight: 500 !important;
    font-family: 'Playfair Display', serif !important;
    text-transform: none !important;    
    border-bottom: none !important;     
    margin-bottom: 10px !important;
    padding-bottom: 0 !important;
}

/* 2. TEXTOS DE LOS WIDGETS */
#colophon #block-8 p, 
#colophon #block-9 p {
    color: #666666 !important; 
    font-family: 'Outfit', sans-serif !important;
}

/* 3. COPYRIGHT */
#colophon .site-below-footer-wrap .ast-footer-copyright p {
    color: var(--secondary) !important; 
    font-family: 'Outfit', sans-serif !important;
    margin-bottom: 0 !important;
}

/* 4. TEXTO DE CUERPO GENERAL */
#page #content .ast-container main section > div > p {
     color: #666666 !important;
}

/* 5. AJUSTE DE ESPACIOS */
#colophon .site-below-footer-wrap {
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    border-top: 1px solid var(--border) !important;
}

/* =======================================================
   15. GLOBAL: TÍTULOS EN MINÚSCULA/NORMAL
   ======================================================= */
h1, h2, h3, h4, h5, h6,
.site-title, 
.entry-title,
.widget-title, 
.elementor-heading-title {
    text-transform: none !important;
}

/* =======================================================
   16. FIX BÚSQUEDA: GRID + MARCOS + CLIC TOTAL
   ======================================================= */

/* 1. CONTENEDOR PRINCIPAL */
body.search #page #content .ast-container {
    width: 92% !important;        
    max-width: 1240px !important; 
    margin: 0 auto !important;    
    padding-bottom: 50px !important;
}

/* 2. ESTRUCTURA REJILLA */
.search-results #primary #main {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
    gap: 30px !important;
}

/* 3. TARJETA */
.search-results article {
    background: #ffffff !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 1 !important;
}

/* 4. ROMPER JAULAS INTERNAS */
.search-results article .ast-article-inner,
.search-results article .post-content {
    position: static !important; 
    width: 100% !important;
}
.search-results article .ast-article-inner {
    border-bottom-style: none !important;
    height: 379px !important; 
}
.search-results article:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(63, 77, 51, 0.08) !important;
    border-color: var(--primary) !important;
}

/* 5. IMÁGENES */
.search-results article .post-thumb,
.search-results article .ast-post-format-image {
    width: 100% !important;
    margin-bottom: 15px !important;
}
.search-results article img {
    width: 100% !important;
    height: 250px !important;
    object-fit: contain !important;
    border-radius: 4px !important;
}

/* 6. TÍTULOS */
.search-results .entry-title,
.search-results .entry-title a {
    font-family: 'Playfair Display', serif !important;
    font-size: 25px !important;   
    font-weight: 500 !important;  
    color: var(--text-color) !important;
    margin-bottom: 5px !important;
    text-decoration: none !important;
}

/* 7. ENLACE EXPANDIDO */
.search-results .entry-title a::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    cursor: pointer;
}

/* 8. PRECIOS Y CATEGORÍAS */
.search-results .gemelo-price-wrapper {
    position: relative; 
    z-index: 20; 
    pointer-events: none; 
}
.search-results .gemelo-price-wrapper .search-product-cats {
    margin-top: 10px !important;    
    margin-bottom: 10px !important; 
}
.search-results .gemelo-price-wrapper .search-product-price {
    font-weight: 500 !important;    
}

/* 9. LIMPIEZA */
.search-results .entry-summary, 
.search-results .read-more,
.search-results .entry-meta,
.search-results header.entry-header,
.ast-excerpt-container > p:last-child {
    display: none !important; 
}

/* 10. EXCEPCIÓN NO RESULTADOS */
.search-no-results #primary #main,
.search .no-results {
    grid-column: 1 / -1 !important;
    width: 100% !important;
}

/* =======================================================
   17. FIX BOTONES TIENDA (PARCHE YELLOWPENCIL)
   ======================================================= */
.products .mt-2 .button {
    color: var(--secondary) !important;         
    border-style: solid !important;
    border-color: var(--border) !important;     
    border-width: 1px !important;
    background-color: transparent !important;   
}
.products .mt-2 .button:hover {
    color: var(--bg-color) !important;          
    background-color: var(--secondary) !important; 
    border-color: var(--secondary) !important;
}

/* =======================================================
   18. FIX SIDEBAR Y LAYOUT (PARCHE YP + LIMPIEZA)
   ======================================================= */

/* 1. TÍTULOS DE LA BARRA LATERAL (FILTROS) */
.ast-filter-wrap .widget h2 {
    color: var(--secondary) !important; 
    font-family: 'Playfair Display', serif !important;
    text-align: left !important;
    font-weight: 500 !important;
}

/* 2. INPUTS DE PRECIO (Ajuste de tamaño) */
.woof_sid_widget .woof_price_filter input[type=text] {
    padding-left: 10px !important;
    padding-bottom: 0px !important;
    padding-right: 25px !important;
    width: 75px !important;
    max-width: 75px !important;
}

/* 3. OCULTAR ELEMENTOS SOBRANTES */
.woof_sid_widget .woof_submit_search_form, 
.woof_autohide_wrapper {                   
    display: none !important;
}

/* 4. EXPANDIR CONTENEDOR EN ESCRITORIO */
@media (min-width: 922px) {
    #page #content .ast-container {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* =======================================================
   19. FIX CARRITO LATERAL (MINI CART) - V7
   ======================================================= */

/* 1. CONTENEDOR DEL PRODUCTO */
#astra-mobile-cart-drawer .woocommerce-mini-cart-item {
    position: relative !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    padding-left: 80px !important;  
    padding-right: 35px !important; 
    border-bottom: 1px solid var(--border) !important;
    min-height: 90px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    width: 100% !important;
}

/* 2. IMAGEN */
#astra-mobile-cart-drawer .woocommerce-mini-cart-item img {
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 65px !important;
    height: auto !important;
    max-height: 80px !important;
    object-fit: contain !important;
    background: transparent !important;
    border-radius: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* 3. TÍTULO */
#astra-mobile-cart-drawer .woocommerce-mini-cart-item a:not(.remove),
#astra-mobile-cart-drawer .woocommerce-mini-cart-item .woocommerce-mini-cart-item-name {
    font-family: 'Outfit', sans-serif !important; 
    font-weight: 600 !important;
    font-size: 15px !important;
    color: var(--text-color) !important;
    line-height: 1.3 !important;
    text-decoration: none !important;
    display: block !important;
    margin-bottom: 4px !important;
    width: 100% !important;
}

/* 4. CANTIDAD Y PRECIO */
#astra-mobile-cart-drawer .woocommerce-mini-cart-item .quantity {
    font-family: 'Outfit', sans-serif !important;
    font-size: 13px !important;
    color: #666 !important;
    display: block !important;
}

/* 5. BOTÓN "X" (ROJO) */
#astra-mobile-cart-drawer .woocommerce-mini-cart-item .remove {
    position: absolute !important;    
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: 1px solid #d32f2f !important; 
    color: #d32f2f !important;            
    font-size: 14px !important;
    line-height: 1 !important;
}
#astra-mobile-cart-drawer .woocommerce-mini-cart-item .remove:hover {
    border-color: #b71c1c !important;     
    background-color: #d32f2f !important; 
    color: white !important;
}

/* 6. RESET ESTRUCTURAL (Recuperado del final del archivo) */
#astra-mobile-cart-drawer > div.astra-cart-drawer-content > div {
    display: block !important;       
    gap: 0 !important;               
    align-items: normal !important;  
    width: 100% !important;
}

/* =======================================================
   20. FIX SINGLE PRODUCT (PÁGINA DE PRODUCTO INDIVIDUAL)
   ======================================================= */
@media (min-width: 922px) {
    body.single-product #page #content .ast-container {
        width: 92% !important;        
        max-width: 1240px !important; 
        margin: 0 auto !important;    
    }
}

/* =======================================================
   21. ESTILO DE MARCAS (TIENDA Y CARRITO)
   ======================================================= */
.gemelo-shop-brand {
    font-family: 'Outfit', sans-serif !important;
    font-size: 11px !important;       
    text-transform: uppercase !important;
    letter-spacing: 1px !important;   
    color: #666666 !important;        
    font-weight: 700 !important;      
    line-height: 1.2 !important;
    display: block !important;        
    visibility: visible !important;   
    margin-bottom: 5px !important;
    position: relative !important;
    z-index: 10 !important;
}
.gemelo-cart-brand {
    font-size: 11px !important;
    color: var(--primary) !important;
    margin-top: 2px !important;
    display: block !important;
}

/* =======================================================
   23. FIX FINAL MI CUENTA (GHOST BUTTONS + LAYOUT)
   ======================================================= */

/* 1. LAYOUT DE ESCRITORIO */
@media (min-width: 922px) {
    .woocommerce-account .woocommerce {
        display: flex !important;
        gap: 40px !important;
        align-items: flex-start !important;
    }
    .woocommerce-MyAccount-navigation {
        width: 280px !important;
        flex-shrink: 0 !important;
    }
    .woocommerce-MyAccount-content {
        flex-grow: 1 !important;
        background: #fff !important;
        padding: 30px !important;
        border: 1px solid var(--border) !important;
        border-radius: 8px !important;
    }
}

/* 2. ESTILO DEL MENÚ DE NAVEGACIÓN */
.woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    background: #fff !important;
    overflow: hidden !important;
}
.woocommerce-MyAccount-navigation ul li {
    margin: 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
}
.woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none !important;
}
.woocommerce-MyAccount-navigation ul li a {
    display: block !important;
    padding: 15px 20px !important;
    color: var(--text-color) !important;
    text-decoration: none !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    font-size: 15px !important;
    background-color: transparent !important;
}
.woocommerce-MyAccount-navigation ul li a:hover {
    background-color: #f9f9f9 !important;
    color: var(--primary) !important;
    padding-left: 25px !important;
}

/* 3. ELEMENTO ACTIVO (FONDO VERDE) */
.woocommerce-MyAccount-navigation ul li.is-active,
.woocommerce-MyAccount-navigation ul li.is-active a {
    background-color: var(--primary) !important; 
    color: #2a3322 !important;                   
}

/* 4. BOTONES DE MI CUENTA (ESTILO GHOST UNIFICADO) */
.woocommerce-account .woocommerce-form-login__submit,
.woocommerce-account .woocommerce-form-register__submit,
.woocommerce-account button[name="save_account_details"], 
.woocommerce-account button[name="save_address"],
#content > div > div > div > div > div.woocommerce-info > a,
.woocommerce-account .woocommerce-Button {                
    background-color: transparent !important;
    color: var(--secondary) !important;         
    border: 1px solid #d1d5db !important;       
    font-family: 'Outfit', sans-serif !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    width: auto !important;                     
    display: inline-block !important;           
    opacity: 1 !important;
    transition: all 0.3s ease !important;
    margin-top: 10px !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

/* Estado Hover Unificado */
.woocommerce-account .woocommerce-form-login__submit:hover,
.woocommerce-account .woocommerce-form-register__submit:hover,
.woocommerce-account button[name="save_account_details"]:hover,
.woocommerce-account button[name="save_address"]:hover,
#content > div > div > div > div > div.woocommerce-info > a:hover,
.woocommerce-account .woocommerce-Button:hover {
    background-color: var(--secondary) !important; 
    border-color: var(--secondary) !important;
    color: #f7f5f0 !important;                     
    transform: translateY(-2px);
}

/* 5. TEXTOS DE BIENVENIDA */
.woocommerce-MyAccount-content p {
    font-family: 'Outfit', sans-serif !important;
    color: #666 !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
}
.woocommerce-MyAccount-content a {
    color: var(--primary) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

/* =======================================================
   26. DISEÑO CHECKOUT FINAL (ESTILO BOUTIQUE CLEAN)
   ======================================================= */

/* 1. CONTENEDOR CENTRAL ELEGANTE */
.woocommerce-checkout form.checkout {
    max-width: 800px !important;  /* Ancho de lectura cómodo */
    margin: 0 auto !important;    /* Centrado en pantalla */
    padding-bottom: 40px !important;
}

/* Limpieza de seguridad para el Footer */
.woocommerce-checkout form.checkout::after,
.woocommerce-checkout .col2-set::after,
#customer_details::after {
    content: ""; display: table; clear: both;
}

/* 2. CAMPOS EN PAREJA (Organización Visual) */
/* Nombre y Apellido */
#billing_first_name_field, #shipping_first_name_field {
    width: 48% !important; float: left !important; clear: both !important; margin-right: 4% !important;
}
#billing_last_name_field, #shipping_last_name_field {
    width: 48% !important; float: left !important; margin-right: 0 !important;
}

/* Teléfono y Email */
#billing_phone_field {
    width: 48% !important; float: left !important; clear: both !important; margin-right: 4% !important;
}
#billing_email_field {
    width: 48% !important; float: left !important; margin-right: 0 !important;
}

/* Estado y Código Postal */
#billing_state_field {
    width: 48% !important; float: left !important; clear: both !important; margin-right: 4% !important;
}
#billing_postcode_field {
    width: 48% !important; float: left !important; margin-right: 0 !important;
}

/* Reset para el resto de campos (Ancho completo) */
#billing_company_field, #billing_country_field, 
#billing_address_1_field, #billing_address_2_field, 
#billing_city_field, #order_comments_field {
    width: 100% !important; float: none !important; clear: both !important;
}

/* 3. INPUTS "PREMIUM" (El toque fino) */
.woocommerce-checkout input.input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
    background-color: #fcfcfc !important; /* Blanco hueso muy sutil */
    border: 1px solid #e2e4e7 !important; /* Borde gris muy suave */
    border-radius: 0px !important;        /* Esquinas rectas (más elegante) o 4px si prefieres */
    padding: 16px 20px !important;        /* Mucho aire interno */
    font-family: 'Outfit', sans-serif !important;
    font-size: 15px !important;
    color: var(--text-color) !important;
    min-height: 55px !important;          /* Altura generosa */
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    margin-bottom: 5px !important;
}

/* Efecto Focus (Línea inferior elegante) */
.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
    background-color: #ffffff !important;
    border-color: var(--primary) !important;
    outline: none !important;
}

/* Etiquetas (Labels) Minimalistas */
.woocommerce-checkout label {
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color: #888888 !important; /* Gris medio para no distraer */
    font-weight: 600 !important;
    margin-bottom: 8px !important;
}

/* 4. SECCIÓN "YOUR ORDER" (Tarjeta Estilizada) */
/* Esto crea la caja visual al final sin romper el layout */
#order_review_heading {
    margin-top: 50px !important;
    text-align: center !important;
    font-family: 'Playfair Display', serif !important;
    font-size: 28px !important;
    border-bottom: none !important;
    padding-bottom: 20px !important;
}

/* Contenedor simulado para la tabla y pago */
#order_review, 
.woocommerce-checkout > table.shop_table {
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    padding: 30px !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.03) !important; /* Sombra "aireada" */
}

/* Tabla limpia */
.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
    border-top: 1px solid #f7f7f7 !important;
    padding: 20px 0 !important;
}
.woocommerce-checkout table.shop_table .order-total th,
.woocommerce-checkout table.shop_table .order-total td {
    border-top: 2px solid var(--primary) !important; /* Línea de cierre verde */
    font-size: 20px !important;
    color: var(--primary) !important;
    font-weight: 700 !important;
}

/* 5. BOTÓN PLACE ORDER (Llamada a la acción clara) */
#place_order {
    width: 100% !important;
    background-color: var(--primary) !important;
    color: #ffffff !important;
    padding: 20px !important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-weight: 600 !important;
    border: 1px solid var(--primary) !important;
    margin-top: 20px !important;
    transition: all 0.3s ease !important;
}
#place_order:hover {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    transform: translateY(-2px);
}

/* 6. MÓVIL (Ajuste de seguridad) */
@media (max-width: 768px) {
    #billing_first_name_field, #shipping_first_name_field,
    #billing_last_name_field, #shipping_last_name_field,
    #billing_phone_field, #billing_email_field,
    #billing_state_field, #billing_postcode_field {
        width: 100% !important;
        margin-right: 0 !important;
    }
    .woocommerce-checkout form.checkout {
        padding: 0 15px !important;
    }
}