/* ============================================================================
   Design Tokens – Sistema de Gimnasio
   Paleta: rojo energía (marca) + carbón (fondos oscuros) + lima (acento).
   Cambiar aquí re-tematiza todo el sitio + portal + panel.
   ========================================================================== */
:root {
    /* Marca (rojo energía) */
    --red-900: #4a0d13;
    --red-800: #6d131c;
    --red-700: #99202b;
    --red-600: #c1272d;   /* principal oscuro */
    --red-500: #e63946;   /* principal */
    --red-400: #f25561;
    --red-300: #f88b93;
    --red-100: #fde0e2;
    --red-50:  #fef2f3;

    /* Acento (lima/energético) */
    --lime-500: #c6f000;
    --lime-400: #d7f94a;
    --lime-300: #e7fb8c;

    /* Carbón (fondos oscuros) */
    --coal-900: #0e0f12;
    --coal-800: #16181d;
    --coal-700: #1f232b;
    --coal-600: #2b303a;

    --white:   #ffffff;

    /* Neutros */
    --gray-900: #14161a;
    --gray-800: #23262d;
    --gray-700: #3a3f49;
    --gray-500: #6b7280;
    --gray-400: #9aa1ad;
    --gray-300: #d3d7de;
    --gray-200: #e7e9ee;
    --gray-100: #f2f4f7;
    --gray-50:  #f8fafc;
    --bg:       #f6f7f9;

    /* Semánticos */
    --primary:   var(--red-500);
    --primary-d: var(--red-700);
    --accent:    var(--lime-500);
    --text:      var(--gray-900);
    --muted:     var(--gray-500);
    --surface:   var(--white);
    --surface-2: var(--gray-50);
    --border:    var(--gray-200);
    --ink:       var(--gray-900);
    --brand-link: var(--red-600);

    /* Estados */
    --ok:     #1f9d55;  --ok-soft:     #e6f6ec;  --ok-ink:     #0f7a3f;
    --warn:   #c77d0a;  --warn-soft:   #fdf1d8;  --warn-ink:   #8a5300;
    --danger: #d64545;  --danger-soft: #fdecec;  --danger-ink: #a3231f;
    --info:   var(--red-600);  --info-soft: var(--red-50);  --info-ink: var(--red-800);

    /* Tipografía */
    --font-sans: 'Inter', 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
    --font-head: 'Poppins', var(--font-sans);
    --font-display: 'Anton', 'Poppins', var(--font-sans); /* titulares tipo póster atlético */

    /* Radios y sombras */
    --r-sm: 8px;
    --r-md: 14px;
    --r-lg: 22px;
    --r-xl: 32px;
    --shadow-sm: 0 2px 8px rgba(14, 15, 18, .08);
    --shadow-md: 0 12px 32px rgba(14, 15, 18, .14);
    --shadow-lg: 0 24px 60px rgba(14, 15, 18, .22);

    /* Panel administrativo: tokens reutilizables */
    --panel-gap: 16px;
    --panel-section-gap: 18px;
    --panel-card-padding: 20px;
    --panel-card-radius: var(--r-md);
    --panel-card-shadow: 0 1px 3px rgba(14, 15, 18, .05);
    --panel-control-height: 36px;

    /* Layout */
    --nav-h: 68px;
    --max: 1180px;
}