@custom-variant dark (&:where(.dark, .dark *));
:root {
  --bg-primary: 255, 255, 255;
  --bg-primary-hover: 242, 251, 255;
  --bg-primary-solid: 45, 98, 118;
  --bg-secondary: 219, 242, 251;
  --bg-brand-primary: 15, 126, 168;
  --bg-brand-primary-hover: 11, 94, 125;
  --bg-brand-secondary: 219, 242, 251;
  --bg-brand-solid: 11, 94, 125;
  --bg-brand-solid-hover: 9, 77, 103;
  --bg-quaternary: 238, 249, 253;
  --bg-disabled: 238, 249, 253;
  --bg-disabled-subtle: 247, 252, 255;
  --bg-overlay: 45, 98, 118;
  --bg-error-primary: 240, 68, 56;
  --bg-error-solid: 217, 45, 32;
  --text-primary: 45, 98, 118;
  --text-secondary: 22, 64, 85;
  --text-tertiary: 45, 98, 118;
  --text-placeholder-subtle: 85, 132, 154;
  --text-primary-on-brand: 255, 255, 255;
  --text-brand-primary: 11, 94, 125;
  --text-brand-secondary: 45, 98, 118;
  --text-brand-tertiary: 85, 132, 154;
  --text-error-primary: 240, 68, 56;
  --text-white: 255, 255, 255;
  --fg-primary: 45, 98, 118;
  --fg-secondary: 22, 64, 85;
  --fg-tertiary: 45, 98, 118;
  --fg-quaternary: 85, 132, 154;
  --fg-disabled: 85, 132, 154;
  --fg-disabled-subtle: 189, 226, 241;
  --border-primary: 189, 226, 241;
  --border-brand: 15, 126, 168;
  --border-brand-alt: 11, 94, 125;
  --border-disabled: 189, 226, 241;
  --border-error: 180, 35, 24;
  --border-error-subtle: 254, 205, 202;
  --lms-bg-primary: 255, 255, 255;
  --lms-bg-primary-hover: 242, 251, 255;
  --lms-bg-primary-solid: 45, 98, 118;
  --lms-bg-secondary: 219, 242, 251;
  --lms-bg-brand-primary: 15, 126, 168;
  --lms-bg-brand-primary-hover: 11, 94, 125;
  --lms-bg-brand-secondary: 219, 242, 251;
  --lms-bg-brand-solid: 11, 94, 125;
  --lms-bg-brand-solid-hover: 9, 77, 103;
  --lms-bg-quaternary: 238, 249, 253;
  --lms-bg-disabled: 238, 249, 253;
  --lms-bg-disabled-subtle: 247, 252, 255;
  --lms-bg-overlay: 45, 98, 118;
  --lms-bg-error-primary: 240, 68, 56;
  --lms-bg-error-solid: 217, 45, 32;
  --lms-text-primary: 45, 98, 118;
  --lms-text-secondary: 22, 64, 85;
  --lms-text-tertiary: 45, 98, 118;
  --lms-text-placeholder-subtle: 85, 132, 154;
  --lms-text-primary-on-brand: 255, 255, 255;
  --lms-text-brand-primary: 11, 94, 125;
  --lms-text-brand-secondary: 45, 98, 118;
  --lms-text-brand-tertiary: 85, 132, 154;
  --lms-text-error-primary: 240, 68, 56;
  --lms-text-white: 255, 255, 255;
  --lms-fg-primary: 45, 98, 118;
  --lms-fg-secondary: 22, 64, 85;
  --lms-fg-tertiary: 45, 98, 118;
  --lms-fg-quaternary: 85, 132, 154;
  --lms-fg-disabled: 85, 132, 154;
  --lms-fg-disabled-subtle: 189, 226, 241;
  --lms-border-primary: 189, 226, 241;
  --lms-border-brand: 15, 126, 168;
  --lms-border-brand-alt: 11, 94, 125;
  --lms-border-disabled: 189, 226, 241;
  --lms-border-error: 180, 35, 24;
  --lms-border-error-subtle: 254, 205, 202;
  --external-app-card-background: #ffffff;
  --external-app-card-border: #d3ebf5;
  --external-app-card-title: #164055;
  --external-app-card-logo: #164055;
  --external-app-card-logo-placeholder: #55849a;
  --external-app-card-hover-background: #f2fbff;
  --external-app-card-hover-border: #bde2f1;
  --background: #f7fcff;
  --foreground: #2d6276;
  --card: #ffffff;
  --card-foreground: #2d6276;
  --popover: #ffffff;
  --popover-foreground: #2d6276;
  --primary: #0f7ea8;
  --primary-foreground: #ffffff;
  --secondary: #dbf2fb;
  --secondary-foreground: #0f7ea8;
  --muted: #eef9fd;
  --muted-foreground: #55849a;
  --accent: #d5f0fb;
  --accent-foreground: #0d5f80;
  --border: #bde2f1;
  --input: #bde2f1;
  --ring: #82c8e4;
  --chart-1: #0f7ea8;
  --chart-2: #4ba8cf;
  --chart-3: #a7ddf1;
  --chart-4: #2d6276;
  --chart-5: #55849a;
  --sidebar: #ffffff;
  --sidebar-foreground: #2d6276;
  --sidebar-primary: #0f7ea8;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #dbf2fb;
  --sidebar-accent-foreground: #2d6276;
  --sidebar-border: #d3ebf5;
  --sidebar-ring: #82c8e4;
  --system-card-background: #ffffff;
  --system-card-border: #0f7ea8;
  --system-card-title: #0f7ea8;
  --system-card-icon: #0f7ea8;
  --system-card-arrow-border: #bde2f1;
  --system-card-arrow-icon: #0f7ea8;
  --system-card-arrow-background: #ffffff;
  --system-card-hover-background: #eef9fd;
  --system-card-add-border: #bde2f1;
  --system-card-add-icon: #0f7ea8;
  --lms-bg-footer: #036f8b;
}

.dark {
  /* Base backgrounds */
  --bg-primary: 13, 31, 41;
  --bg-primary-hover: 18, 40, 52;
  --bg-primary-solid: 11, 94, 125;
  --bg-secondary: 18, 40, 52;
  --bg-quaternary: 22, 50, 65;
  --bg-disabled: 22, 50, 65;
  --bg-disabled-subtle: 26, 58, 75;
  --bg-overlay: 0, 0, 0;

  /* Brand */
  --bg-brand-primary: 15, 126, 168;
  --bg-brand-primary-hover: 20, 150, 200;
  --bg-brand-secondary: 18, 40, 52;
  --bg-brand-solid: 15, 126, 168;
  --bg-brand-solid-hover: 20, 150, 200;

  /* Error */
  --bg-error-primary: 240, 68, 56;
  --bg-error-solid: 217, 45, 32;

  /* Text */
  --text-primary: 230, 245, 250;
  --text-secondary: 180, 210, 220;
  --text-tertiary: 140, 180, 195;
  --text-placeholder-subtle: 100, 140, 160;
  --text-primary-on-brand: 255, 255, 255;
  --text-brand-primary: 90, 190, 230;
  --text-brand-secondary: 120, 200, 230;
  --text-brand-tertiary: 150, 210, 235;
  --text-error-primary: 255, 120, 110;
  --text-white: 255, 255, 255;

  /* Foreground (icons etc.) */
  --fg-primary: 230, 245, 250;
  --fg-secondary: 180, 210, 220;
  --fg-tertiary: 140, 180, 195;
  --fg-quaternary: 100, 140, 160;
  --fg-disabled: 90, 120, 135;
  --fg-disabled-subtle: 60, 85, 100;

  /* Borders */
  --border-primary: 40, 80, 100;
  --border-brand: 15, 126, 168;
  --border-brand-alt: 20, 150, 200;
  --border-disabled: 40, 80, 100;
  --border-error: 180, 35, 24;
  --border-error-subtle: 120, 40, 35;

  /* Shadcn / semantic tokens */
  --background: #0d1f29;
  --foreground: #e6f5fa;

  --card: #122832;
  --card-foreground: #e6f5fa;

  --popover: #122832;
  --popover-foreground: #e6f5fa;

  --primary: #0f7ea8;
  --primary-foreground: #ffffff;

  --secondary: #12303c;
  --secondary-foreground: #8ed0ec;

  --muted: #163846;
  --muted-foreground: #7aa6b8;

  --accent: #164055;
  --accent-foreground: #9bd8f0;

  --border: #285066;
  --input: #285066;
  --ring: #4ba8cf;

  /* Charts */
  --chart-1: #4ba8cf;
  --chart-2: #82c8e4;
  --chart-3: #2d6276;
  --chart-4: #a7ddf1;
  --chart-5: #55849a;

  /* Sidebar */
  --sidebar: #0f2530;
  --sidebar-foreground: #e6f5fa;
  --sidebar-primary: #0f7ea8;
  --sidebar-primary-foreground: #ffffff;
  --sidebar-accent: #163846;
  --sidebar-accent-foreground: #e6f5fa;
  --sidebar-border: #285066;
  --sidebar-ring: #4ba8cf;

  /* Cards (custom) */
  --external-app-card-background: #122832;
  --external-app-card-border: #285066;
  --external-app-card-title: #e6f5fa;
  --external-app-card-logo: #8ed0ec;
  --external-app-card-logo-placeholder: #6b9db2;
  --external-app-card-hover-background: #163846;
  --external-app-card-hover-border: #3a6f86;

  --system-card-background: #122832;
  --system-card-border: #0f7ea8;
  --system-card-title: #8ed0ec;
  --system-card-icon: #4ba8cf;
  --system-card-arrow-border: #285066;
  --system-card-arrow-icon: #8ed0ec;
  --system-card-arrow-background: #0d1f29;
  --system-card-hover-background: #163846;
  --system-card-add-border: #285066;
  --system-card-add-icon: #4ba8cf;

  /* Footer */
  --lms-bg-footer: #021f29;
}