/* The platform's design tokens — one source of truth for every surface we
   draw ourselves: the marketing site, the sign-up wizard and the maintenance
   page. Documented in docs/design.md.

   Not for practice homepages: a practice's site wears its own theme, and not
   for the backoffice, which is Tabler's palette. */

:root {
  /* Brand, taken from static/images/logo.svg: a violet→blue gradient on a
     near-black plate. --iz-primary-ink is the darkened twin for text and links
     on a light background (the light blue is too low-contrast for type). */
  --iz-brand-1: #400086;
  --iz-brand-2: #2eabff;
  /* The lightest tone sits in the middle and both edges run back towards the
     violet: a light-blue edge against white reads as a hard border. */
  --iz-brand-gradient: linear-gradient(
      120deg,
      var(--iz-brand-1) 0%,
      var(--iz-brand-2) 52%,
      color-mix(in srgb, var(--iz-brand-2) 45%, var(--iz-brand-1)) 100%);
  --iz-ink: #0b0b12;

  --iz-fg: #1f2933;
  --iz-muted: #6b7280;
  --iz-bg: #ffffff;
  --iz-bg-alt: #f5f7fa;
  --iz-primary: var(--iz-brand-2);
  --iz-primary-ink: #0a6ea8;
  --iz-primary-fg: #ffffff;
  --iz-border: #e5e7eb;
  --iz-radius: 12px;
  --iz-maxw: 1100px;
  --iz-font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial,
      sans-serif;
}

/* Dark theme: the logo's near-black plate becomes the page background; the
   light brand blue now carries enough contrast to be the link colour itself. */
@media (prefers-color-scheme: dark) {
  :root {
    --iz-fg: #e9ecf2;
    --iz-muted: #a0a7b4;
    --iz-bg: var(--iz-ink);
    --iz-bg-alt: #14141d;
    --iz-primary-ink: var(--iz-brand-2);
    --iz-border: #26263a;
  }
}