/*
Theme Name: Oveja Negra Pro v1.0
Theme URI: https://ovejanegra.cl/
Author: Maestro Web Pro
Author URI: https://ovejanegra.cl/
Description: Tema WordPress moderno con diseño de tienda profesional, layout SureCart corregido y colores llamativos.
Version: 1.0
Text Domain: oveja-negra-pro
Tags: e-commerce, responsive, woocommerce, dark-mode, neon, artisanal
License: GPLv2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* [CORRECCIÓN PRO] PREVENIR DESBORDAMIENTO HORIZONTAL EN MÓVIL */
html, body {
    overflow-x: hidden !important;
    width: 100%;
    position: relative;
    max-width: 100vw;
}

/* VARIABLES CSS */
:root{ 
    --color-fondo-claro:#F5F2EC; 
    --color-fondo-oscuro:#000000; 
    --color-acento:#32C1FF; 
    --color-acento-alt:#52FFA8; 
    --color-texto-secundario:#2B2B2B; 
    --color-fondo-tarjeta:#D9D9D9; 
    --color-alerta:#E94823; 
    --fuente-global:'Inter', sans-serif; 
} 

/* ESTILOS BASE */
body{ 
    background-color: var(--color-fondo-claro); 
    color: var(--color-texto-principal); 
}

/* Botones y enlaces */
.btn-primary{ 
    background-color: var(--color-acento); 
    color: var(--color-fondo-oscuro); 
    border-radius:.75rem; padding:.75rem 1.25rem; font-weight:700; transition: all .3s ease; 
}
.btn-primary:hover{ 
    background-color: var(--color-acento-alt); 
    color: var(--color-fondo-oscuro); 
}
a{ 
    color: var(--color-acento); 
    text-decoration:none; 
    transition: color .2s ease; 
}
a:hover{ color: var(--color-acento-alt); } 

/* Identidad */
.custom-logo img { max-height: 60px !important; width: auto !important; transition: max-height 0.3s ease; }
.custom-logo{ max-height:60px; width:auto; } 
.site-title{ color: var(--color-fondo-oscuro); }
.site-description{ color: var(--color-texto-secundario); }
.main-navigation a{ color: var(--color-fondo-oscuro); font-weight:500; }
.main-navigation a:hover{ color: var(--color-acento); } 

/* Menú inferior móvil */
#mobile-bottom-nav{ 
    backdrop-filter: blur(5px); 
    background-color: var(--color-fondo-claro); 
    border-top: 1px solid var(--color-fondo-oscuro);
    max-width: 100vw; 
    box-sizing: border-box;
}
#mobile-bottom-nav ul li a{ color: var(--color-fondo-oscuro); }
body.dark #mobile-bottom-nav{ 
    background-color: var(--color-fondo-oscuro) !important; 
    border-top-color: var(--color-acento) !important; 
    color: var(--color-fondo-claro);
}

/* Contador */
.tnt-cart-count { background-color: var(--color-alerta) !important; }

/* MODO OSCURO */
body.dark { 
    background-color: var(--color-fondo-oscuro); 
    color: var(--color-fondo-claro); 
}
body.dark #main-header { 
    background-color: var(--color-fondo-oscuro) !important; 
    border-bottom-color: var(--color-acento) !important; 
}
.dark .site-title{ color: var(--color-fondo-claro); }
.dark .site-description{ color: var(--color-acento); } 
.dark a { color: var(--color-acento) !important; } 
.dark a:hover { color: var(--color-acento-alt) !important; }
.dark .bg-white, .dark .bg-gray-50 { background-color: var(--color-fondo-oscuro) !important; }
.dark .text-gray-900 { color: var(--color-fondo-claro) !important; } 
.dark .text-gray-700, .dark .text-gray-600 { color: var(--color-acento) !important; } 
.dark .border-gray-200 { border-color: var(--color-texto-secundario) !important; }

/* Toast */
#tnt-toast { 
    position: fixed; right: 20px; bottom: 24px; z-index: 9999; 
    background: var(--color-principal); color: var(--color-fondo-claro); 
    border-radius: 16px; padding: 14px 16px; 
    display:none; 
    align-items:center; gap:12px; 
    box-shadow: 0 8px 24px rgba(0,0,0,.35); max-width: 380px; 
    border: 2px solid var(--color-acento); 
}
#tnt-toast.tnt-show { display:flex; animation: tnt-slide-up .35s ease forwards; }
#tnt-toast.tnt-hide { animation: tnt-fade-out .35s ease forwards; }
#tnt-toast-close { 
    background: none; border: none; cursor: pointer; 
    color: var(--color-acento-alt); line-height: 1;
}

/* WOOCOMMERCE LAYOUT */
.alignwide.wp-block-surecart-product-list, 
.woocommerce .site-content .content-area {
    display: grid; 
    grid-template-columns: minmax(250px, 300px) 1fr; 
    gap: 3rem; 
    align-items: flex-start; 
    width: 100% !important; 
    margin: 0 auto; 
}
@media (max-width: 768px) {
    .alignwide.wp-block-surecart-product-list, 
    .woocommerce .site-content .content-area {
        grid-template-columns: 1fr; 
        gap: 1rem;
    }
    .woocommerce-sidebar { display: none; } 
}
.woocommerce-sidebar, .sc-sidebar-desktop.wp-block-surecart-product-list-sidebar {
    grid-column: 1 / 2; 
    border-right: 2px solid var(--color-acento); 
}
.wp-block-surecart-product-list-content, .woocommerce .content-area .products {
    grid-column: 2 / 3; 
    flex-grow: 1;
}
.woocommerce ul.products {
    padding-top: 2.5rem; padding-bottom: 2.5rem; 
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important; 
    gap: 2.5rem !important; 
}
/* ... (resto del CSS) ... */

/* === OPTIMIZACIÓN MÓVIL GLOBAL === */

/* Asegura que las imágenes no desborden en los grids */
img {
    max-width: 100%;
    height: auto;
}

/* Tipografía Responsiva Global (Safety Net) */
@media (max-width: 640px) {
    h1 { font-size: 2rem !important; line-height: 1.1; }
    h2 { font-size: 1.75rem !important; line-height: 1.2; }
    h3 { font-size: 1.25rem !important; line-height: 1.3; }
    
    /* Ajuste específico para tarjetas de servicios */
    .grid h3 { 
        font-size: 1rem !important; /* 16px */
    }
    
    /* Ajuste de padding en contenedores generales */
    .container {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}