/* ==============================================================
   NOKTIR — tokens de marca compartidos entre todas las apps
   (SONAR, TAXVO, VOLTA, PULS)
   Oscuro por defecto. Respeta prefers-color-scheme. Toggle manual
   vía [data-theme] + localStorage (ver theme-toggle.js).
   Regla de oro: NINGÚN color de acento en ningún modo.
   ============================================================== */

:root {
  /* Paleta base (los seis tonos) */
  --nk-true-black: #1E1E21;
  --nk-white: #FFFFFF;
  --nk-non-white: #F4F4F4;
  --nk-dark-gray: #565659;
  --nk-medium-gray: #8E8E90;
  --nk-light-gray: #C7C7C7;

  /* Tipografía */
  --nk-font-display: 'Alternate Gothic No2 D', 'Arial Narrow', sans-serif;
  --nk-font-body: 'Nimbus Sans Novus', 'Helvetica Neue', Arial, sans-serif;
  --nk-tracking-kicker: 0.2em;
  --nk-tracking-display: 0.05em;

  /* Semántico — modo oscuro (por defecto) */
  --nk-bg: var(--nk-true-black);
  --nk-surface: var(--nk-dark-gray);
  --nk-text: var(--nk-white);
  --nk-text-2: var(--nk-non-white);
  --nk-text-3: var(--nk-medium-gray);
  --nk-line: var(--nk-dark-gray);
  --nk-logo: var(--nk-white);
  color-scheme: dark;
}

/* Modo claro por preferencia de sistema (si no hay toggle manual) */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --nk-bg: var(--nk-non-white);
    --nk-surface: var(--nk-white);
    --nk-text: var(--nk-true-black);
    --nk-text-2: var(--nk-dark-gray);
    --nk-text-3: var(--nk-medium-gray);
    --nk-line: var(--nk-light-gray);
    --nk-logo: var(--nk-true-black);
    color-scheme: light;
  }
}

/* Modo claro forzado por toggle manual */
[data-theme="light"] {
  --nk-bg: var(--nk-non-white);
  --nk-surface: var(--nk-white);
  --nk-text: var(--nk-true-black);
  --nk-text-2: var(--nk-dark-gray);
  --nk-text-3: var(--nk-medium-gray);
  --nk-line: var(--nk-light-gray);
  --nk-logo: var(--nk-true-black);
  color-scheme: light;
}

/* Modo oscuro forzado por toggle manual (por si el sistema está en claro) */
[data-theme="dark"] {
  --nk-bg: var(--nk-true-black);
  --nk-surface: var(--nk-dark-gray);
  --nk-text: var(--nk-white);
  --nk-text-2: var(--nk-non-white);
  --nk-text-3: var(--nk-medium-gray);
  --nk-line: var(--nk-dark-gray);
  --nk-logo: var(--nk-white);
  color-scheme: dark;
}

/* ==============================================================
   Base mínima compartida
   ============================================================== */
body {
  background: var(--nk-bg);
  color: var(--nk-text);
  font-family: var(--nk-font-body);
  transition: background-color .25s ease, color .25s ease;
}

.nk-kicker {
  font-family: var(--nk-font-display);
  text-transform: uppercase;
  letter-spacing: var(--nk-tracking-kicker);
  color: var(--nk-text-3);
  font-size: .72rem;
}

.nk-h1 {
  font-family: var(--nk-font-body);
  font-weight: 300;
  color: var(--nk-text);
  letter-spacing: .01em;
}

.nk-wordmark {
  font-family: var(--nk-font-display);
  text-transform: uppercase;
  letter-spacing: var(--nk-tracking-display);
  color: var(--nk-logo);
}

.nk-panel {
  background: var(--nk-surface);
  border: 1px solid var(--nk-line);
}

hr, .nk-line { border: 0; border-top: 1px solid var(--nk-line); }

/* El sigilo en SVG inline: fill/stroke="currentColor" dentro de un
   contenedor con color: var(--nk-logo) — cambia solo con el modo. */
.nk-sigil { color: var(--nk-logo); }

.nk-lockup {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.nk-theme-toggle {
  background: transparent;
  border: 1px solid var(--nk-line);
  color: var(--nk-text);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Regla de oro: NINGÚN color de acento en ningún modo.
   Verde/rojo solo en cifras si el documento lo exige explícitamente. */