/* ==========================================================================
   Colors — the single home for every color value in the guide.

   Three families live here:

   1. The guide palette (--q-primary, --q-positive, ...): the variables every
      other stylesheet and page references. Most values are synced with the
      product's own palette; update them here when the product changes.
   2. The guide's design colors (--q-brand, admonition palette, surface
      roles): the modern layer used by the homepage and components.
   3. Product colors reproduced in page content (--q-color-*): values pages
      quote from the app UI, such as the notification type colors.

   No other stylesheet defines a color value: they reference these variables,
   or derive translucent effects from them with color-mix(). The only literal
   colors outside this file are mermaid classDef colors (they cannot read CSS
   variables) and hex codes that are content rather than presentation.
   ========================================================================== */

[data-md-color-scheme="default"] {
  /* Brand Colors */
  --q-primary: #FF9933;
  --q-secondary: #86AA5B;
  --q-brick: #B83200;

  /* Base Colors */
  --q-white: #FFFFFF;
  --q-black: #000000;
  --q-accent: var(--q-black);

  /* Neutral Colors */
  --q-disabled: #DDDDDD;
  --q-normal: #333333;
  --q-lighter: #666666;
  --q-lightest: #AAAAAA;
  --q-inverted: var(--q-white);
  --q-mild: #f6f3f0;
  --q-shadow: #33333320;

  /* Light Mode Specific (not used in light mode but defined for consistency) */
  --q-search-bg: #222222;
  --q-search-text-secondary: #CCCCCC;

  /* Field Type Colors (User Guide Specific) */
  --q-salmon: #FF9780;
  --q-positive: #21BA45;
  --q-negative: #E91E63;
  --q-warning: #ffbb33;
  --q-orange: #F96719;
  --q-orange-rgb: 249, 103, 25;
  --q-invalid: #5A678F;

  /* Frontend Palette Sync (Quasar tokens used in the app) */
  --q-tertiary: #5B86AA;
  --q-info: #2163D0;
  --q-cyan: #33CFFF;
  --q-navy: #001A49;
  --q-amber: #F59E0B;

  /* Semantic surface roles (the modern homepage and components layer) */
  --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;

  /* Theme-aware product colors reproduced in page content. The app defines
     these per scheme, so the docs mirror both values. Neutral is dark text on
     the light scheme; invalid is the Discarded anomaly status. */
  --q-color-neutral: #333333;
  --q-color-invalid: #8B7355;
}

/* Dark (slate) scheme. Surfaces read as raised, text is off-white to reduce
   glare, and the brand hover is brightened so links/buttons keep AA contrast. */
[data-md-color-scheme="slate"] {
  /* Brand Colors */
  --q-primary: #FF9933;
  --q-secondary: #86AA5B;
  --q-brick: #B83200;
  --q-brand-strong: #ff5a2c;

  /* Base Colors */
  --q-white: #FFFFFF;
  --q-black: #000000;

  /* Neutral Colors */
  --q-disabled: #555555;
  --q-normal: var(--q-white);
  --q-lighter: #A0A0A0;
  --q-lightest: #AAAAAA;
  --q-inverted: #333333;
  --q-mild: #232526;
  --q-shadow: #FFFFFF20;

  /* Dark Mode Specific */
  --q-search-bg: #222222;
  --q-search-text-secondary: #CCCCCC;

  /* Field Type Colors (User Guide Specific) */
  --q-salmon: #FF9780;
  --q-positive: #21BA45;
  --q-negative: #E91E63;
  --q-warning: #ffbb33;
  --q-orange: #F96719;
  --q-orange-rgb: 249, 103, 25;
  --q-invalid: #828db0;

  /* Frontend Palette Sync (Quasar tokens used in the app) */
  --q-tertiary: #5B86AA;
  --q-info: #2163D0;
  --q-cyan: #33CFFF;
  --q-navy: #001A49;
  --q-amber: #F59E0B;

  /* Semantic surface roles (the modern homepage and components layer) */
  --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;

  /* Theme-aware product colors reproduced in page content: light text on the
     dark scheme, and the Discarded anomaly status lightened as in the app. */
  --q-color-neutral: #F7F7F7;
  --q-color-invalid: #C4B49A;
}

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

  /* 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 */

  /* Notification types (see the notification deep-dive pages). Constant
     across both schemes, matching the app's category colors: mention shares
     the app's tertiary blue, ownership its secondary green, and anomaly and
     assignment its orange. */
  --q-color-mention: #5B86AA;
  --q-color-ownership: #86AA5B;
  --q-color-anomaly: #F96719;
  --q-color-assignment: #F96719;

  /* General properties accent (the shared general-props snippet) */
  --q-props-accent: #357AE3;

  /* Print */
  --q-print-muted: #555555;
}

/* Homepage (.q-home) accents. The homepage deliberately re-points --q-brick
   at its own link color, and its always-dark hero keeps constant accents. */
.q-home {
  --q-home-hero-border: #2a2a2a;
  --q-home-cta-hover: #ffb15f;
  /* Hero glow: brick fading into the brand orange. Kept literal because
     --q-brick is re-pointed inside .q-home. */
  --q-home-glow-a: rgb(184 50 0 / 82%);
  --q-home-glow-b: rgb(255 153 51 / 45%);
}

[data-md-color-scheme="default"] .q-home {
  --q-home-card-border: #948b82;
  --q-home-focus: #005fcc;
  --q-home-link: #b83200;
  --q-brick: var(--q-home-link);
}

[data-md-color-scheme="slate"] .q-home {
  --q-home-card-border: #6b7280;
  --q-home-focus: #7dd3fc;
  --q-home-link: #ff5a2c;
  --q-brick: var(--q-home-link);
}