/* ==========================================================================
   MemoLeap design tokens — GENERATED FILE, do not hand-edit.

   Source of truth: the .NET MAUI design system at
     libs/MemoLeap.DesignSystem/Resources/Styles/Colors.xaml   (colour tokens)
     libs/MemoLeap.DesignSystem/Resources/Styles/Styles.xaml   (font family)
   in the memoleap monorepo (Building-on-IT-Limited/memoleap).

   To change a value: edit it in the XAML source above first, then re-sync
   this file by hand (no automated generator exists yet — see CLAUDE.md).

   Structure mirrors Colors.xaml's own two tiers:
     Tier 1 — "BRAND PRIMITIVES": raw palette values (--ml-<colour-name>)
     Tier 2 — "APP COLOUR TOKENS": semantic roles (--ml-<role>)

   IMPORTANT: in the XAML source, MAUI's Color type cannot alias another
   Color resource, so most Tier 2 entries repeat a literal hex value rather
   than pointing back at a Tier 1 primitive (see the comment above
   AppColors' APP COLOUR TOKENS section). CSS custom properties CAN alias,
   so Tier 2 uses var(--ml-*) only where a Tier 2 value is byte-for-byte
   identical to an existing Tier 1 value. Everywhere else, the Tier 2
   variable carries its own literal value, same as the XAML source does.
   See the session report's "open questions" for the full list of
   non-aliasing Tier 2 tokens and near-miss values that were NOT merged.
   ========================================================================== */

@font-face {
  font-family: "OpenSansRegular";
  src: url("../fonts/OpenSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Tier 1 — brand primitives (Colors.xaml: BRAND PRIMITIVES) ── */
  --ml-primary: #C8432A;
  --ml-primary-dark: #9E3220;
  --ml-primary-dark-text: #242424;
  --ml-secondary: #E8907A;
  --ml-secondary-dark-text: #9E3220;
  --ml-tertiary: #9E3220;

  --ml-white: #FFFFFF;
  --ml-black: #000000;
  --ml-magenta: #D600AA;
  --ml-midnight-blue: #190649;
  --ml-off-black: #1F1F1F;

  --ml-gray-100: #E1E1E1;
  --ml-gray-200: #C8C8C8;
  --ml-gray-300: #ACACAC;
  --ml-gray-400: #919191;
  --ml-gray-500: #6E6E6E;
  --ml-gray-600: #404040;
  --ml-gray-900: #212121;
  --ml-gray-950: #141414;

  /* ── Tier 2 — semantic roles (Colors.xaml: APP COLOUR TOKENS) ── */

  /* Surfaces */
  --ml-page-background: #F5F0EB;
  --ml-surface-card: var(--ml-white); /* XAML value is literal "White" — identical to Tier 1 */
  --ml-surface-subtle: #F0F0F0;

  /* Borders */
  --ml-border-subtle: #E0E0E0;
  --ml-border-light: #DDDDDD;

  /* Chart axis / gridlines */
  --ml-chart-axis-line: #9B9A97;

  /* Text — lightest to darkest */
  --ml-text-primary: #111111;
  --ml-text-strong: #222222;
  --ml-text-body: #333333;
  --ml-text-subdued: #444444;
  --ml-text-light: #555555;
  --ml-text-faint: #666666;
  --ml-text-muted: #888888;
  --ml-text-very-muted: #CCCCCC;

  /* Performance categories */
  --ml-status-very-good: #2E7D32;
  --ml-status-very-good-light: #A5D6A7;
  --ml-status-good: #558B2F;
  --ml-status-developing: #E65100;
  --ml-status-weak: #C62828;
  --ml-status-unseen: #9E9E9E;

  /* Grade and result colours */
  --ml-grade-1-color: #A5D6A7;
  --ml-grade-2-color: #2E7D32;
  --ml-grade-3-color: #E65100;
  --ml-grade-4-color: #C62828;
  --ml-grade-5-color: #9E9E9E;
  --ml-success-color: #2E7D32;
  --ml-fail-color: #C62828;

  /* Training session background flashes */
  --ml-feedback-correct-bg: #E8F5E9;
  --ml-feedback-incorrect-bg: #FFEBEE;
  --ml-feedback-neutral-bg: #F5F5F5;

  /* Modal overlay — source is MAUI AARRGGBB #CC000000 (80% alpha black) */
  --ml-overlay-dark: rgba(0, 0, 0, 0.8);

  /* Custom Learn-screen keyboard key face — stated warm neutral, not
     derived from Primary (see CR-13/CR-14 note in Colors.xaml) */
  --ml-keyboard-key-face-color: #A9A7A1;
}