/* Waffle Whale design tokens. Light is the default; dark applies with .dark, [data-theme="dark"], or the OS setting (unless [data-theme="light"]). */
/* Copied from wafflewhale/brand/waffle-whale.tokens.css. Only change: the Google Fonts @import was removed; each page loads Figtree with <link> instead. */

:root {
  --radius: 14px;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --font-sans: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

:root, [data-theme="light"] {
  color-scheme: light;
  --background: #FFFFFF;
  --foreground: #15202B;
  --card: #FFFFFF;
  --card-foreground: #15202B;
  --popover: #FFFFFF;
  --popover-foreground: #15202B;
  --primary: #1E66A8;
  --primary-foreground: #FFFFFF;
  --secondary: #EDF3F9;
  --secondary-foreground: #1A3D5E;
  --muted: #F3F5F7;
  --muted-foreground: #5A6774;
  --accent: #F5B83D;
  --accent-foreground: #3A2804;
  --destructive: #C2352B;
  --destructive-foreground: #FFFFFF;
  --border: #E3E8EE;
  --input: #86929E;
  --ring: #1E66A8;
  --success: #1B7A4C;
  --success-foreground: #FFFFFF;
  --warning: #9E5A00;
  --warning-foreground: #FFFFFF;
  --danger: #C2352B;
  --glass: #FFFFFFB8;
  --app-mail: #DCEBFA;
  --app-mail-ink: #1E66A8;
  --app-budget: #D9F2E4;
  --app-budget-ink: #1C7449;
  --app-notes: #FFF0C2;
  --app-notes-ink: #855A00;
  --app-focus: #E8E3FA;
  --app-focus-ink: #5A45A6;
  --app-workspace: #E2E8F1;
  --app-workspace-ink: #2E4A6B;
  --app-cursed: #FBE0EC;
  --app-cursed-ink: #A3245F;
  --app-defuse: #FFE4CC;
  --app-defuse-ink: #A44A0A;
  --shadow-sm: 0 1px 2px #15202B0F, 0 1px 3px #15202B14;
  --shadow-md: 0 2px 6px #15202B0F, 0 8px 20px -4px #15202B1F;
  --shadow-lg: 0 4px 10px #15202B12, 0 20px 40px -8px #15202B29;
}

.dark, [data-theme="dark"] {
  color-scheme: dark;
  --background: #0E141B;
  --foreground: #E9EEF3;
  --card: #161D26;
  --card-foreground: #E9EEF3;
  --popover: #1B232D;
  --popover-foreground: #E9EEF3;
  --primary: #6CB0F0;
  --primary-foreground: #06223D;
  --secondary: #1F2933;
  --secondary-foreground: #D6E2EE;
  --muted: #1B232D;
  --muted-foreground: #9AA7B4;
  --accent: #F7C35A;
  --accent-foreground: #2E1F02;
  --destructive: #F0736A;
  --destructive-foreground: #2B0705;
  --border: #26313D;
  --input: #67747F;
  --ring: #6CB0F0;
  --success: #4CC38A;
  --success-foreground: #062A18;
  --warning: #F2B34A;
  --warning-foreground: #2E1C00;
  --danger: #F0736A;
  --glass: #161D26B8;
  --app-mail: #16314D;
  --app-mail-ink: #9CCBF5;
  --app-budget: #133A28;
  --app-budget-ink: #8FDDB5;
  --app-notes: #3D3112;
  --app-notes-ink: #F5D27A;
  --app-focus: #2A2448;
  --app-focus-ink: #C4B6F5;
  --app-workspace: #1F2B3A;
  --app-workspace-ink: #B5C6DB;
  --app-cursed: #401A2D;
  --app-cursed-ink: #F3A6C8;
  --app-defuse: #42260F;
  --app-defuse-ink: #F8B887;
  --shadow-sm: 0 1px 2px #00000066;
  --shadow-md: 0 8px 20px -4px #00000099;
  --shadow-lg: 0 20px 40px -8px #000000B3;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not(.light) {
    color-scheme: dark;
    --background: #0E141B;
    --foreground: #E9EEF3;
    --card: #161D26;
    --card-foreground: #E9EEF3;
    --popover: #1B232D;
    --popover-foreground: #E9EEF3;
    --primary: #6CB0F0;
    --primary-foreground: #06223D;
    --secondary: #1F2933;
    --secondary-foreground: #D6E2EE;
    --muted: #1B232D;
    --muted-foreground: #9AA7B4;
    --accent: #F7C35A;
    --accent-foreground: #2E1F02;
    --destructive: #F0736A;
    --destructive-foreground: #2B0705;
    --border: #26313D;
    --input: #67747F;
    --ring: #6CB0F0;
    --success: #4CC38A;
    --success-foreground: #062A18;
    --warning: #F2B34A;
    --warning-foreground: #2E1C00;
    --danger: #F0736A;
    --glass: #161D26B8;
    --app-mail: #16314D;
    --app-mail-ink: #9CCBF5;
    --app-budget: #133A28;
    --app-budget-ink: #8FDDB5;
    --app-notes: #3D3112;
    --app-notes-ink: #F5D27A;
    --app-focus: #2A2448;
    --app-focus-ink: #C4B6F5;
    --app-workspace: #1F2B3A;
    --app-workspace-ink: #B5C6DB;
    --app-cursed: #401A2D;
    --app-cursed-ink: #F3A6C8;
    --app-defuse: #42260F;
    --app-defuse-ink: #F8B887;
    --shadow-sm: 0 1px 2px #00000066;
    --shadow-md: 0 8px 20px -4px #00000099;
    --shadow-lg: 0 20px 40px -8px #000000B3;
  }
}
