/* ══════════════════════════════════════════════════════════
   GLOBAL.CSS — Variables, reset y tipografía base
   Villa Natura Peru SAC
   ══════════════════════════════════════════════════════════ */

:root {
    /* Colores principales */
    --color-primario:       #2d6a4f;
    --color-primario-hover: #1b4332;
    --color-primario-light: #52b788;
    --color-acento:         #40916c;
    /* Dorado de marca (verde + dorado). Antes estaba hardcodeado (#e9b637) en 15 archivos. */
    --color-dorado:         #e9b637;
    --color-dorado-claro:   #f4d06a;
    --color-dorado-oscuro:  #b8860b;

    /* Estados */
    --color-success: #28a745;
    --color-warning: #e9a820;
    --color-danger:  #dc3545;
    --color-info:    #17a2b8;

    /* Fondos */
    --color-bg:       #f0f4f1;
    --color-bg-card:  #ffffff;
    --color-sidebar:  #1b2d25;
    --color-sidebar-hover:  #2a4438;
    --color-sidebar-active: var(--color-primario);

    /* Texto */
    --color-texto:       #1e2b23;
    --color-texto-suave: #5a7065;
    --color-borde:       #d4e2d8;

    /* Tipografía */
    --fuente: 'Segoe UI', system-ui, -apple-system, sans-serif;

    /* Sombras */
    --sombra-sm: 0 1px 3px rgba(0,0,0,0.08);
    --sombra:    0 4px 12px rgba(0,0,0,0.10);
    --sombra-lg: 0 8px 24px rgba(0,0,0,0.14);

    /* Bordes */
    --radio:    8px;
    --radio-lg: 14px;

    /* Transición */
    --transicion: all 0.2s ease;

    /* Layout */
    --sidebar-ancho: 252px;
    --navbar-alto:   60px;
}

/* ── Reset ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
    font-size: 16px;
    scroll-behavior: smooth;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

body {
    font-family: var(--fuente);
    background-color: var(--color-bg);
    color: var(--color-texto);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

a { color: var(--color-primario); text-decoration: none; }
a:hover { color: var(--color-primario-hover); }

img { max-width: 100%; display: block; }
ul, ol { list-style: none; }
button { cursor: pointer; font-family: inherit; }
input, textarea, select { font-family: inherit; }

/* ── Scrollbar ──────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #a8c4b0; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--color-acento); }

/* ── Utilidad base ──────────────────────────────────────── */
.hidden { display: none !important; }