/* ==========================================================================
   Design tokens — a modern, semantic layer that complements the brand
   variables already defined in extra.css (--q-primary, --q-brick, ...).
   These NEW tokens (radii, spacing, type scale, elevation, surfaces) are used
   by the modern homepage (home.css) and the reusable components (components.css).
   ========================================================================== */

:root {
  /* Brand (constant across both color schemes) */
  --q-brand: #ff9933;          /* Qualytics orange */
  --q-brand-strong: #b83200;   /* brick — hover / active */

  /* Radius scale */
  --q-radius-sm: 4px;
  --q-radius-md: 8px;
  --q-radius-lg: 14px;
  --q-radius-pill: 999px;

  /* Spacing scale */
  --q-space-1: 0.25rem;
  --q-space-2: 0.5rem;
  --q-space-3: 0.75rem;
  --q-space-4: 1rem;
  --q-space-6: 1.5rem;
  --q-space-8: 2rem;
  --q-space-12: 3rem;

  /* Type scale */
  --q-fs-sm: 0.8rem;
  --q-fs-md: 0.95rem;
  --q-fs-lg: 1.15rem;
  --q-fs-xl: 1.5rem;
  --q-fs-2xl: 2rem;
  --q-fs-hero: clamp(2.1rem, 4.5vw, 3.4rem);
  --q-fw-medium: 600;
  --q-fw-bold: 700;

  /* Elevation */
  --q-shadow-1: 0 1px 3px rgb(0 0 0 / 8%);
  --q-shadow-2: 0 4px 14px rgb(184 50 0 / 18%);   /* brand-tinted */
  --q-shadow-3: 0 10px 34px rgb(0 0 0 / 14%);

  /* Motion */
  --q-ease: 0.2s ease;

  /* Admonition palette (constant across both color schemes). Each token holds
     the icon color used by the Zensical/Material theme for that variant and
     is reused for the matching 1px border in extra.css. */
  --q-adm-note: #448aff;        /* note */
  --q-adm-abstract: #00b0ff;    /* abstract / summary / tldr */
  --q-adm-info: #00b8d4;        /* info / todo */
  --q-adm-tip: #00bfa5;         /* tip / hint / important */
  --q-adm-success: #00c853;     /* success / check / done */
  --q-adm-question: #64dd17;    /* question / help / faq */
  --q-adm-warning: #ff9100;     /* warning / caution / attention */
  --q-adm-failure: #ff5252;     /* failure / fail / missing */
  --q-adm-danger: #ff1744;      /* danger / error */
  --q-adm-bug: #f50057;         /* bug */
  --q-adm-example: #7c4dff;     /* example */
  --q-adm-quote: #9e9e9e;       /* quote / cite */
}

/* Light scheme — semantic surface roles */
[data-md-color-scheme="default"] {
  --q-surface: #ffffff;
  --q-surface-2: #faf8f6;
  --q-border: #e7e1da;
  --q-border-strong: #d3cabf;
  --q-fg: #1a1a1a;
  --q-fg-muted: #5b5b5b;
  --q-on-brand: #ffffff;
}

/* Dark (slate) scheme — improved elevation & contrast over the old pure-black
   cards on #232526: surfaces now read as raised, text is off-white to reduce
   glare, and brick is brightened so links/buttons keep AA contrast. */
[data-md-color-scheme="slate"] {
  --q-surface: #1f2329;
  --q-surface-2: #262b31;
  --q-border: #343a42;
  --q-border-strong: #454c56;
  --q-fg: #ececec;
  --q-fg-muted: #b3b3b3;
  --q-on-brand: #1a1a1a;
  --q-brand-strong: #ff5a2c;
}