/* ═══════════════════════════════════════════════════════════
   QUANTECH — DESIGN TOKENS (única fuente de verdad de color)

   REGLA PERMANENTE: ningún color en hexadecimal escrito directo
   en el código del sitio ni de los productos. Todo color se
   define aquí y se consume vía var(--token).

   Excepciones técnicas (documentadas, sin alternativa):
   - SVG embebidos como data-URI en CSS: no heredan variables;
     el valor usado debe anotarse con el token equivalente.
   - Emails transaccionales (server.js): los clientes de correo
     no soportan variables CSS; usan la constante EMAIL_COLORS
     de server.js, espejo de la sección "Emails" de esta paleta.
   - Assets exportados en /public (SVG/PNG estáticos).
   ═══════════════════════════════════════════════════════════ */
:root {
  /* ── Fondos y superficies ── */
  --bg-primary: #0A1628;
  --bg-secondary: #122337;
  --surface: #1F2F46;
  --surface-hover: #1F2F46;
  --surface-deep: #0F1D2F;   /* selects y campos de formulario */
  --surface-alt: #1E2D40;    /* thumbnails y bloques admin */

  /* ── Acento ── */
  --accent: #00C2FF;
  --accent-hover: #00E5FF;
  --accent-bg: rgba(0,194,255,0.08);

  /* ── Texto ── */
  --text-primary: #F0F6FF;
  --text-secondary: #94A3B8;
  --text-tertiary: #64748B;
  --text-muted: #4A5568;     /* placeholders */
  --text-on-accent: #000D1A; /* texto sobre botones de acento */
  --white: #FFFFFF;

  /* ── Semánticos ── */
  --green: #10D690;
  --green-alt: #10B981;
  --amber: #F59E0B;
  --red: #F76B6B;            /* rojo semántico sobre fondo oscuro */
  --red-alt: #EF4444;
  --red-bg: rgba(247,107,107,0.10);

  /* ── Neutros de UI ── */
  --dot-neutral: #8C99AE;    /* puntos de ventana en mockups de producto */

  /* ── Marcas de terceros ── */
  --linkedin: #0A66C2;

  /* ── Emails (espejo de EMAIL_COLORS en server.js) ── */
  --email-heading: #0F172A;
  --email-text: #334155;
  --email-bg-soft: #F1F5F9;

  /* ── Bordes ── */
  --border-subtle: rgba(255,255,255,0.08);
  --border-medium: rgba(255,255,255,0.12);
  --border-accent: rgba(0,194,255,0.20);
}
