/* ============ Naosfi — Color tokens (paleta v2) ============
   COPIA SINCRONIZADA del design system de marca:
   /Users/eabp/Proyectos/naosfi/branding/design-system/tokens/colors.css
   No se edita acá. Lo que la app necesita encima vive en css/app.css.

   Reemplazó a los tokens del Eprisma Design System el 2026-08-17: el
   producto pasa a la marca Naosfi (ver docs/DECISIONS.md de esa fecha). */

/* Light (default) */
:root {
  /* Base */
  --ink: #13161D;        /* primary text / brand dark navy */
  --ink-soft: #3E4453;   /* secondary text */
  --muted: #6A7080;      /* tertiary text, captions */
  --canvas: #F4F6F9;     /* page background — cool white */
  --surface: #FFFFFF;    /* cards */
  --surface-2: #FAFBFD;  /* alternate section background */
  --line: #E3E7EE;       /* hairline borders */

  /* Brand accent */
  --accent: #00D9FF;     /* cian Naosfi */
  --accent-ink: #13161D; /* text/icons placed on accent */

  /* Brand secondaries (paleta v2 — usar con moderación) */
  --green: #09E989;
  --purple: #6930C3;
  --purple-2: #613DC1;
  --navy: #1C2541;
  --navy-deep: #090223;
  --cyan-soft: #97DFFC;
  --blue: #1436AA;

  /* Semantic aliases */
  --text-body: var(--ink);
  --text-secondary: var(--ink-soft);
  --text-muted: var(--muted);
  --surface-card: var(--surface);
  --surface-page: var(--canvas);
  --border-hairline: var(--line);
}

/* Dark theme (html[data-theme="dark"]) */
html[data-theme="dark"] {
  --ink: #EAF1F7;
  --ink-soft: #B4BCCB;
  --muted: #8A92A6;
  --canvas: #0C0F16;
  --surface: #13161D;
  --surface-2: #1A1F2B;
  --line: rgba(255, 255, 255, 0.10);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 30px 60px -20px rgba(0, 0, 0, 0.6);
}

/* Inverted (dark) block scope — hero, security, CTA capsule */
.invert {
  --ink: #EAF1F7;
  --ink-soft: #B4BCCB;
  --muted: #8A92A6;
  --canvas: #0C0F16;
  --surface: #13161D;
  --surface-2: #1A1F2B;
  --line: rgba(255, 255, 255, 0.12);
  --shadow-lg: 0 30px 60px -20px rgba(0, 0, 0, 0.55);
  background: var(--canvas);
  color: var(--ink);
}
