/* Sistema visual de Cooper Blue Energy: marino profundo, azul eléctrico y plata.
   Azul eléctrico = acción y dato clave. Los colores de estado solo codifican estados.
   Radios: paneles y diálogos 12px, botones y campos 8px, pastillas 999px. */
:root {
  --n0: #010d22;   /* marco y menú */
  --n1: #02132e;   /* lienzo */
  --n2: #041c40;   /* panel */
  --n3: #07274f;   /* elevado y hover */
  --n4: #0c3362;   /* seleccionado */
  --n5: #134378;

  --line: rgba(200, 208, 218, .1);
  --line-2: rgba(200, 208, 218, .19);

  --fg1: #f2f5f9;
  --fg2: #c8d0da;
  --fg3: #8f9db2;

  --accent: #2e9bff;
  --accent-hi: #6db9ff;
  --accent-ink: #021634;
  --accent-soft: rgba(46, 155, 255, .13);

  --red: #f0717a;
  --green: #45d483;
  --blue: #8fc6ff;
  --teal: #3fd0c9;
  --warn: #f2b84b;
  --slate: #c8d0da;

  --paper: #fff;
  --ink: #022555;
  --ink-2: #4a5d7c;
  --rule-paper: #dbe2ec;

  --display: "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --body: "Figtree", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-drawer: cubic-bezier(.32, .72, 0, 1);

  --r-s: 6px;
  --r-m: 8px;
  --r-l: 12px;

  --band-h: 26px;
  --top-h: 52px;
  --tab-h: 60px;
  --side-w: 252px;
  --side-rail: 58px;

  --shadow-pop: 0 18px 44px -14px rgba(0, 0, 0, .75), 0 2px 6px rgba(0, 0, 0, .25);

  color-scheme: dark;
  scrollbar-color: var(--n4) transparent;
  scrollbar-width: thin;
}

/* Paso del recorrido */
.st-solicitud { --c: var(--slate); }
.st-estudio { --c: var(--warn); }
.st-visita { --c: var(--blue); }
.st-instalacion { --c: var(--teal); }
.st-seguimiento { --c: var(--green); }
.st-renovacion { --c: var(--accent); }
/* Instalación */
.ins-pendiente { --c: var(--slate); }
.ins-programada { --c: var(--blue); }
.ins-instalada { --c: var(--green); }
.ins-incidencia { --c: var(--red); }
/* Cita */
.item-confirmada { --c: var(--green); }
.item-pendiente { --c: var(--warn); }
.item-anulada { --c: var(--slate); }
.item-incidencia { --c: var(--red); }
/* Automatización */
.auto-ok { --c: var(--green); }
.auto-paused { --c: var(--slate); }
.auto-error { --c: var(--red); }
/* Equipo */
.dev-online { --c: var(--green); }
.dev-offline { --c: var(--red); }
/* Roles y verificación */
.inv-dia { --c: var(--green); }
.role-admin { --c: var(--accent); }
.role-com { --c: var(--blue); }
.role-tec { --c: var(--teal); }