/* ============================================================
   NVS · Sistema de diseño
   Única fuente de verdad visual del Hub.
   Cambiar un color aquí lo cambia en todos los módulos.
   No escribir códigos de color sueltos dentro de los módulos.
   ============================================================ */

:root{
  /* ── Marca ───────────────────────────────────────────────── */
  --green:        #AAFF00;                  /* verde New Vision */
  --green-dk:     #88CC00;                  /* verde de borde / hover */
  --green-ink:    #3a6b00;                  /* texto sobre fondo verde */
  --green-dim:    rgba(170,255,0,0.12);     /* fondo suave (chips activos) */
  --green-glow:   rgba(170,255,0,0.15);     /* halo / sombra verde */

  /* ── Superficies ─────────────────────────────────────────── */
  --bg:           #f8fafc;                  /* fondo de pantalla */
  --card:         #ffffff;                  /* tarjetas y paneles */
  --card2:        #f1f5f9;                  /* tarjeta hundida / fila alterna */
  --card3:        #e2e8f0;                  /* separadores y rellenos */

  /* ── Líneas ──────────────────────────────────────────────── */
  --border:        rgba(0,0,0,0.08);        /* borde normal */
  --border-strong: rgba(0,0,0,0.14);        /* borde marcado */

  /* ── Texto ───────────────────────────────────────────────── */
  --txt:          #0f172a;                  /* texto principal */
  --muted:        #64748b;                  /* texto secundario */
  --muted2:       #94a3b8;                  /* texto tenue */
  --muted3:       #334155;                  /* texto fuerte no-negro */

  /* ── Semáforo ────────────────────────────────────────────── */
  --blue:   #3b82f6;
  --amber:  #d97706;
  --red:    #dc2626;
  --teal:   #0d9488;
  --purple: #7c3aed;
  --pink:   #db2777;
  --orange: #ea580c;
  --danger: #ef4444;

  --red-bg:    rgba(220,38,38,0.08);
  --blue-bg:   rgba(59,130,246,0.08);
  --amber-bg:  rgba(217,119,6,0.08);
  --purple-bg: rgba(124,58,237,0.08);
  --teal-bg:   rgba(13,148,136,0.08);

  /* ── Forma y profundidad ─────────────────────────────────── */
  --r:         10px;
  --r2:        14px;
  --radius:    12px;
  --shadow:    0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);

  /* ── Tipografía ──────────────────────────────────────────── */
  --font:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-head: 'Anton', 'Inter', sans-serif;

  /* ── Alias heredados ─────────────────────────────────────────
     Los módulos viejos usan otros nombres para lo mismo.
     Se mantienen para no reescribir cientos de reglas.
     En código nuevo usar SIEMPRE los nombres de arriba.        */
  --b:          var(--border);
  --b2:         var(--border-strong);
  --m:          var(--muted);
  --m2:         var(--muted2);
  --m3:         var(--muted3);
  --text:       var(--txt);
  --sb:         var(--card);
  --surface:    var(--card);
  --green-bg:   var(--green-dim);
  --green-txt:  var(--green-ink);
  --accent:     var(--green);
  --accent-ink: var(--green-ink);
  --accent-dark:var(--green-ink);
}