/*
 * Tuquinielita brand: the palette and typeface the member app and the admin panel share.
 *
 * Mascot orange on the mascot's navy, with teal (the glasses) as the secondary accent.
 * Green and red stay semantic (a correct pick, income, an open pool / a wrong pick, an
 * expense, an error) and are never used as decoration, so they keep meaning something.
 *
 * Each app maps these onto its own component system: the member app onto Ionic's
 * --ion-color-* and its Tailwind theme, the admin panel onto spartan's shadcn tokens.
 * Change a colour here, not in the apps. The Lexend font itself is loaded by each app's
 * styles.css, because a Google Fonts @import has to come first in the entry stylesheet.
 *
 * Text pairings that pass WCAG AA: navy-950 on orange-400 (6.9:1), orange-400 on navy-900
 * (6.9:1), white on orange-600 and orange-600 on white (4.5:1), navy-400 on navy-800 (4.9:1).
 * Orange-400 on white is only 2.6:1, so light surfaces use orange-600 for primary text.
 *
 * The -rgb triplets exist for rgba(var(--x-rgb), alpha), which Ionic requires; keep them in
 * step with the hex value above them.
 */
:root {
  --brand-font: 'Lexend', ui-sans-serif, system-ui, sans-serif;

  --brand-orange-50: #fff4ec;
  --brand-orange-100: #ffe5d1;
  --brand-orange-200: #fec8a1;
  --brand-orange-200-rgb: 254, 200, 161;
  --brand-orange-300: #fba56a;
  --brand-orange-400: #f2803a;
  --brand-orange-400-rgb: 242, 128, 58;
  --brand-orange-500: #e46a1f;
  --brand-orange-600: #c55414;
  --brand-orange-700: #9d4112;
  --brand-orange-800: #7c3514;
  --brand-orange-900: #642d13;
  --brand-orange-950: #3a170a;

  --brand-navy-50: #f5f7fa;
  --brand-navy-100: #e9edf3;
  --brand-navy-100-rgb: 233, 237, 243;
  --brand-navy-200: #d3d9e3;
  --brand-navy-300: #b0bacb;
  --brand-navy-400: #8390a8;
  --brand-navy-400-rgb: 131, 144, 168;
  --brand-navy-500: #5d6a85;
  --brand-navy-600: #414d66;
  --brand-navy-700: #2a354d;
  --brand-navy-700-rgb: 42, 53, 77;
  --brand-navy-800: #18213a;
  --brand-navy-800-rgb: 24, 33, 58;
  --brand-navy-850: #121a2e;
  --brand-navy-850-rgb: 18, 26, 46;
  --brand-navy-900: #0d1424;
  --brand-navy-900-rgb: 13, 20, 36;
  --brand-navy-950: #080d18;
  --brand-navy-950-rgb: 8, 13, 24;

  --brand-teal-100: #def3ed;
  --brand-teal-300: #9fd8c8;
  --brand-teal-300-rgb: 159, 216, 200;
  --brand-teal-500: #3fa58f;
  --brand-teal-700: #1f6b5c;

  --brand-success: #22c55e;
  --brand-success-rgb: 34, 197, 94;
  --brand-success-strong: #16a34a;
  --brand-warning: #fbbf24;
  --brand-warning-rgb: 251, 191, 36;
  --brand-warning-strong: #d97706;
  --brand-danger: #ef4444;
  --brand-danger-rgb: 239, 68, 68;
  --brand-danger-strong: #dc2626;

  /* Medal metals, for gamification tiers only */
  --brand-medal-bronze: #c98a4b;
  --brand-medal-silver: #c7d0dc;
  --brand-medal-gold: #f5c542;
}