/* ============================================================
   TOKENS — la única fuente de color, tipografía y forma de edoo.
   Se carga ANTES que cualquier otra hoja (app, alumno, landing,
   vistas previas, legales). Los demás archivos usan var(--x);
   los bloques :root que quedan en ellos solo crean alias.
   Dirección Campus (referencias: Canvas, Blackboard, Brightspace):
   azules y verdes con un verde azulado como único color de acción,
   tinta con matiz petróleo, bordes finos, lienzo frío muy claro, barra
   lateral petróleo con el elemento activo en blanco, títulos grandes
   en peso ligero. El degradado --band (petróleo → verde azulado) solo
   en superficies de marca; nada de "stickers".
   ============================================================ */
:root {
    /* Marca */
    --primary: #0B7285;          --primary-rgb: 11, 114, 133;
    --primary-dark: #085C6B;     --primary-dark-rgb: 8, 92, 107;
    --primary-light: #1C8FA3;    --primary-light-rgb: 28, 143, 163;
    --primary-deep: #0B2E3B;     --primary-deep-rgb: 11, 46, 59;
    --primary-tint: #E6F3F4;
    --primary-tint-strong: #BFE3E7;
    --accent: #1B8A4C;           --accent-rgb: 27, 138, 76;
    --accent-tint: #E6F4EC;
    /* Superficies de marca: petróleo → verde azulado profundo, muy sobrio.
       Solo barra lateral, bandas de título, hero y banda oscura de la landing. */
    --band-from: #0B2E3B; --band-to: #0E4F4A;
    --band: linear-gradient(135deg, var(--band-from) 0%, var(--band-to) 100%);
    --band-v: linear-gradient(180deg, var(--band-from) 0%, var(--band-to) 100%);
    --accent-warm: #C99A2E;      --accent-warm-rgb: 201, 154, 46;

    /* Neutros fríos */
    --bg: #F4F7F7;
    /* Barra global (rail) de la dirección Campus */
    --rail-bg: #0F3540; --rail-fg: #FFFFFF; --rail-hover: #164654; --rail-active: #FFFFFF; --rail-active-fg: #0F3540;
    --surface: #FFFFFF;
    --on-primary: #FFFFFF;     /* texto e iconos sobre --primary, --band y fondos oscuros */
    --card: #FFFFFF;
    --surface-2: #EDF2F3;
    --text: #1B2F36;             --text-rgb: 27, 47, 54;
    --text-secondary: #3F5560;
    --muted: #64777F;            --muted-rgb: 100, 119, 127;
    --muted-light: #8A9AA1;
    --border: #C9D3D5;           --border-rgb: 201, 211, 213;
    --border-light: #E1E8EA;
    --border-strong: #AAB8BC;

    /* Estados (semánticos; no cambian con la marca) */
    --success: #1B8A4C;  --success-bg: #E6F4EC;
    --warning: #B4561B;  --warning-bg: #FBF0E6;
    --danger: #C7281C;   --danger-bg: #FBE9E7;
    --info: #1F5F9E;     --info-bg: #E8F0F8;

    /* Paleta de apoyo (tipos de actividad, secciones, estadísticas) */
    --c-blue: #2563EB;   --c-blue-bg: #DBEAFE;
    --c-sky: #0284C7;    --c-sky-bg: #E0F2FE;
    --c-navy: #1E3A8A;   --c-navy-bg: #DBE4F5;
    --c-teal: #0F766E;   --c-teal-bg: #CCFBF1;
    --c-green: #15803D;  --c-green-bg: #DCFCE7;
    --c-lime: #4D7C0F;   --c-lime-bg: #ECFCCB;
    --c-amber: #B45309;  --c-amber-bg: #FEF3C7;
    --c-gold: #A16207;   --c-gold-bg: #FEF9C3;
    --c-purple: #7E22CE; --c-purple-bg: #F3E8FF;
    --c-indigo: #4338CA; --c-indigo-bg: #E0E7FF;
    --c-berry: #BE185D;  --c-berry-bg: #FCE7F3;
    --c-stone: #57534E;  --c-stone-bg: #F0EDEA;

    /* Sombras suaves (sin desplazamientos duros) */
    --shadow-sm: 0 1px 2px rgba(27, 47, 54, 0.08);
    --shadow: 0 1px 3px rgba(27, 47, 54, 0.08), 0 4px 12px rgba(27, 47, 54, 0.06);
    --shadow-md: 0 2px 6px rgba(27, 47, 54, 0.08), 0 10px 24px rgba(27, 47, 54, 0.10);
    --shadow-lg: 0 4px 10px rgba(27, 47, 54, 0.08), 0 20px 44px rgba(27, 47, 54, 0.16);
    --shadow-colored: 0 1px 2px rgba(27, 58, 107, 0.18);

    /* Forma: esquinas moderadas */
    --radius: 4px;
    --radius-sm: 3px;
    --radius-lg: 6px;
    --radius-xl: 8px;

    /* Layout */
    --sidebar-width: 88px;

    /* Tipografía: Lato para la interfaz; una serif sobria para los títulos
       de página y de sección (--font-title), el gesto "institucional". */
    --font-title: 'Lato', 'Segoe UI', 'Helvetica Neue', Arial, 'Liberation Sans', system-ui, -apple-system, sans-serif;
    --font-display: 'Lato', 'Segoe UI', 'Helvetica Neue', Arial, 'Liberation Sans', system-ui, -apple-system, sans-serif;
    --font-body: 'Lato', 'Segoe UI', 'Helvetica Neue', Arial, 'Liberation Sans', system-ui, -apple-system, sans-serif;
    /* Escala tipográfica de la aplicación */
    --fs-h1: 28px; --fs-h2: 22px; --fs-h3: 17px; --fs-body: 15px; --fs-small: 13px; --fs-label: 12px;
    --fw-title: 300;
    /* flecha de los <select> (data URI; mismo gris que --muted) */
    --select-arrow: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%2364777F' stroke-width='1.6'/></svg>");

    /* Ritmo del interior: ancho de lectura, márgenes y separación entre bloques */
    --content-max: 1200px;
    --page-gutter: 40px;
    --section-gap: 28px;
    --card-pad: 24px;
    --font-hand: var(--font-body);
    /* serif solo para los titulares de la landing y las páginas públicas */
    --font-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    /* Alias de las capas anteriores (editorial, alumno, landing, previews) */
    --paper: var(--bg); --cream: var(--surface); --ink: var(--text); --ink2: var(--muted); --ink3: var(--muted-light);
    --coral: var(--primary); --coral-d: var(--primary-dark); --butter: var(--accent-warm);
    --tint: var(--primary-tint); --line: var(--border); --green-e: var(--success); --green: var(--success);
    --brand: var(--primary); --brand-dark: var(--primary-dark); --brand-light: var(--primary-light);
    --edoo-primary: var(--primary); --edoo-primary-dark: var(--primary-dark); --edoo-text: var(--text);
    --edoo-muted: var(--muted); --edoo-border: var(--border); --edoo-bg: var(--bg); --edoo-surface: var(--surface);
    --gradient-primary: linear-gradient(180deg, var(--primary-light), var(--primary));
    --gradient-brand: var(--gradient-primary);

    /* Spacing scale */
    --s-1: 4px;  --s-2: 6px;  --s-3: 8px;  --s-4: 10px; --s-5: 12px;  --s-6: 14px;
    --s-7: 16px; --s-8: 18px; --s-9: 20px; --s-10: 24px; --s-11: 28px; --s-12: 32px;
    --s-13: 36px; --s-14: 40px; --s-15: 48px; --s-16: 56px; --s-17: 64px;
}