/* =========================================================
   REZZIO · SISTEMA DE TOKENS CENTRAL (fuente unica de verdad)
   Lo enlazan base.html (16 vistas) y login.html (standalone).
   Prefijo --rz-* para NO colisionar con las vars locales de las
   vistas actuales (--bg/--blue/etc.): los tokens conviven inertes
   hasta que cada vista se migre a consumirlos.
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;450;500;600&display=swap');

:root {
  /* --- Base oscura --- */
  --rz-bg:            #0c0d10;   /* fondo general (casi negro, neutro) */
  --rz-bg-2:         #121419;   /* fondo secundario / panel */
  --rz-surface:      #16181f;   /* tarjeta */
  --rz-surface-2:    #1c1f28;   /* tarjeta elevada / hover */
  --rz-line:          rgba(255,255,255,0.08);  /* bordes sutiles */
  --rz-line-2:        rgba(255,255,255,0.14);  /* bordes enfasis */

  /* --- Acento (sistema glass): rojo vivo MARCA + guinda/carmesi para degradados --- */
  --rz-accent:        #e8242f;   /* ROJO VIVO = MARCA (botones, CTAs, tabs/nav activo) */
  --rz-accent-deep:   #670010;   /* guinda profundo (degradados) */
  --rz-accent-grad:   linear-gradient(135deg, #670010 0%, #960018 100%);  /* guinda->carmesi */
  --rz-accent-soft:   rgba(232,36,47,0.14);    /* fondo suave del acento */
  --rz-accent-glow:   rgba(232,36,47,0.38);    /* halo de focus */
  --rz-accent-2:      #cf5e79;                  /* carmesi claro: texto-acento legible sobre oscuro */
  --rz-prio-alta:     #960018;   /* GUINDA profundo = prioridad ALTA misiones (distinto de marca y error) */

  /* --- Texto --- */
  --rz-text:          #f4f5f7;   /* principal */
  --rz-text-2:        #a8acb6;   /* secundario */
  --rz-text-3:        #6b6f7a;   /* terciario / hints */

  /* --- Semanticos (independientes del acento) --- */
  --rz-danger:        #ff6b4a;   /* CORAL (error/alerta) - distinto del rojo de marca y del guinda */
  --rz-success:       #3fb27f;
  --rz-warning:       #e0a020;
  --rz-info:          #5a9fe0;   /* azul informativo (prioridad normal, sin-agente) */

  /* --- GLASS (vidrio oscuro sobre la foto de fondo) --- */
  --rz-glass:         rgba(16,17,21,0.72);   /* tarjeta/panel */
  --rz-glass-thin:    rgba(16,17,21,0.62);   /* paneles de tabla/grafica (mas transparente) */
  --rz-glass-2:       rgba(24,26,32,0.80);   /* elevado (drawers/modales/dropdown) + sidebar */
  --rz-glass-strong:  rgba(14,15,18,0.88);   /* sidebar (legibilidad del nav) */
  --rz-glass-border:  rgba(255,255,255,0.12);
  --rz-blur:          blur(22px) saturate(125%);
  --rz-veil-strong:   linear-gradient(rgba(8,9,12,0.74), rgba(8,9,12,0.82));  /* vistas densas */
  --rz-veil-soft:     linear-gradient(rgba(8,9,12,0.55), rgba(8,9,12,0.66));  /* vistas con poco contenido */

  /* --- Tipografia --- */
  --rz-font-display:  'Space Grotesk', system-ui, sans-serif;
  --rz-font-body:     'Inter', system-ui, sans-serif;

  /* --- Radios --- */
  --rz-r-sm:  10px;
  --rz-r-md:  16px;
  --rz-r-lg:  22px;
  --rz-r-pill: 999px;

  /* --- Espaciado / aire --- */
  --rz-gap:   16px;
  --rz-pad:   28px;
}

/* FALLBACK: navegadores SIN backdrop-filter -> glass casi opaco (sin blur), sigue legible. */
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  :root {
    --rz-glass:        rgba(16,17,21,0.95);
    --rz-glass-thin:   rgba(16,17,21,0.92);
    --rz-glass-2:      rgba(24,26,32,0.96);
    --rz-glass-strong: rgba(14,15,18,0.98);
  }
}
