/* Aidem design tokens. Every screen, including other teams' tabs, takes colour, type, radius and motion from here. */
:root {
  color-scheme: light dark;
  /* Brand */
  --gold: #F5B700;          /* Baiterek gold: brand accent, fills behind dark text */
  --gold-strong: #E0A500;
  --gold-soft: #FFF4D1;
  --gold-ink: #6E4E00;      /* gold-coloured text on light surfaces (7.4:1) */
  --sky: #1A8CFF;           /* routes, "you are here", links on dark */
  --sky-ink: #0B66C3;       /* links on light (5.2:1) */
  --sky-soft: #E5F1FF;
  --green: #0F9F4F;  --green-soft: #E3F6EA;
  --amber: #B86E00;  --amber-soft: #FFF1DC;
  --red: #D93036;    --red-soft: #FDE8E8;

  /* Neutrals (light) */
  --bg: #F4F3EF;
  --surface: #FFFFFF;
  --surface-2: #F7F6F2;
  --surface-3: #EEEDE7;
  --glass: rgba(255, 255, 255, .78);
  --ink: #0E1621;           /* text, primary buttons */
  --ink-2: #3B4656;         /* secondary text (9.5:1) */
  --ink-3: #667080;         /* tertiary text (4.9:1) */
  --line: rgba(14, 22, 33, .09);
  --line-strong: rgba(14, 22, 33, .16);
  --on-ink: #FFFFFF;
  --on-gold: #0E1621;
  --scrim: rgba(8, 12, 18, .42);

  /* Time ring: there / on site / back / reserve */
  --ring-there: var(--sky);
  --ring-visit: var(--gold);
  --ring-back: #7DBDFF;
  --ring-reserve: var(--line-strong);

  /* Category accents for map dots and chips */
  --cat-cafe: #C26A1B; --cat-food: #D2453A; --cat-park: #1E9E57; --cat-water: #1A8CFF;
  --cat-culture: #8B5CF6; --cat-landmark: #E0A500; --cat-mall: #64748B; --cat-family: #EC4899; --cat-night: #6366F1;

  /* Type */
  --font: "Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Unbounded", var(--font);
  --fs-11: .6875rem; --fs-12: .75rem; --fs-13: .8125rem; --fs-15: .9375rem; --fs-16: 1rem; --fs-17: 1.0625rem;
  --fs-20: 1.25rem; --fs-24: 1.5rem; --fs-28: 1.75rem; --fs-34: 2.125rem; --fs-44: 2.75rem;
  --lh-tight: 1.12; --lh-snug: 1.3; --lh-body: 1.5;

  /* Space (4px grid), radius, elevation */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;
  --r-xs: 8px; --r-sm: 12px; --r-md: 16px; --r-lg: 22px; --r-xl: 28px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(14, 22, 33, .06), 0 1px 1px rgba(14, 22, 33, .04);
  --shadow-2: 0 6px 20px rgba(14, 22, 33, .10), 0 1px 3px rgba(14, 22, 33, .06);
  --shadow-sheet: 0 -10px 40px rgba(14, 22, 33, .14), 0 -1px 0 rgba(14, 22, 33, .05);
  --tap: 44px;              /* minimum touch target */

  /* Motion */
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-in-out: cubic-bezier(.77, 0, .175, 1);
  --ease-drawer: cubic-bezier(.32, .72, 0, 1);
  --t-press: 120ms; --t-fast: 180ms; --t-med: 260ms; --t-sheet: 460ms;

  /* Layout */
  --panel-w: 420px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --gold: #FFC21A; --gold-strong: #FFD149; --gold-soft: rgba(255, 194, 26, .14); --gold-ink: #FFD25C;
    --sky: #4AA8FF; --sky-ink: #7CC0FF; --sky-soft: rgba(74, 168, 255, .16);
    --green: #3DD68C; --green-soft: rgba(61, 214, 140, .14);
    --amber: #FFB547; --amber-soft: rgba(255, 181, 71, .14);
    --red: #FF6B6B; --red-soft: rgba(255, 107, 107, .14);
    --bg: #0B0B0D; --surface: #161618; --surface-2: #1D1D20; --surface-3: #26262A; --glass: rgba(22, 22, 24, .82);
    --ink: #F2F4F7; --ink-2: #B7C0CC; --ink-3: #8A95A4; --line: rgba(255, 255, 255, .08); --line-strong: rgba(255, 255, 255, .16);
    --on-ink: #0E1621; --scrim: rgba(0, 0, 0, .55); --ring-back: #2F6FB3;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .4); --shadow-2: 0 8px 24px rgba(0, 0, 0, .45); --shadow-sheet: 0 -10px 40px rgba(0, 0, 0, .5), 0 -1px 0 rgba(255, 255, 255, .06);
  }
}
:root[data-theme="dark"] {
  --gold: #FFC21A; --gold-strong: #FFD149; --gold-soft: rgba(255, 194, 26, .14); --gold-ink: #FFD25C;
  --sky: #4AA8FF; --sky-ink: #7CC0FF; --sky-soft: rgba(74, 168, 255, .16);
  --green: #3DD68C; --green-soft: rgba(61, 214, 140, .14);
  --amber: #FFB547; --amber-soft: rgba(255, 181, 71, .14);
  --red: #FF6B6B; --red-soft: rgba(255, 107, 107, .14);
  --bg: #0B0B0D; --surface: #161618; --surface-2: #1D1D20; --surface-3: #26262A; --glass: rgba(22, 22, 24, .82);
  --ink: #F2F4F7; --ink-2: #B7C0CC; --ink-3: #8A95A4; --line: rgba(255, 255, 255, .08); --line-strong: rgba(255, 255, 255, .16);
  --on-ink: #0E1621; --scrim: rgba(0, 0, 0, .55); --ring-back: #2F6FB3;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .4); --shadow-2: 0 8px 24px rgba(0, 0, 0, .45); --shadow-sheet: 0 -10px 40px rgba(0, 0, 0, .5), 0 -1px 0 rgba(255, 255, 255, .06);
}