/* =============================================================================
   SurgiLog Pro — Brand Tokens v1  (sinh tự động bởi tools/gen_tokens.py — KHÔNG sửa tay)
   Nguồn màu: logo SurgiLog — petrol #0C6170 (thân chữ S), ink #00213A (wordmark), bronze #BA9E68 (khớp vàng)
   Giữ nguyên toàn bộ tên biến cũ của app.css → hơn 750 chỗ var(--…) tự đổi màu.
   ============================================================================= */
:root {
  color-scheme: light;
  /* --- Thang màu gốc (OKLCH, 11 nấc) --- */
  --petrol-50: #EBFAFE;  --petrol-100: #D9F2F8;  --petrol-200: #B9E3ED;  --petrol-300: #90CEDD;  --petrol-400: #63B4C6;  --petrol-500: #3897AB;
  --petrol-600: #0E7C8F;  --petrol-700: #0C6170;  --petrol-800: #004D59;  --petrol-900: #003943;  --petrol-950: #00242B;
  --ink-50: #F0F8FF;  --ink-100: #E2EFFA;  --ink-200: #C9DEF1;  --ink-300: #A8C7E2;  --ink-400: #86ABCC;  --ink-500: #658EB1;
  --ink-600: #4B7395;  --ink-700: #375A78;  --ink-800: #274762;  --ink-900: #18344C;  --ink-950: #00213A;
  --bronze-50: #FDF6EB;  --bronze-100: #F6EBDA;  --bronze-200: #EAD8BB;  --bronze-300: #D8BF94;  --bronze-400: #BA9E68;  --bronze-500: #A58348;
  --bronze-600: #89682C;  --bronze-700: #6E5119;  --bronze-800: #583E08;  --bronze-900: #432D00;  --bronze-950: #2C1C00;
  --mist-50: #F5F7F8;  --mist-100: #EAEDEE;  --mist-200: #D7DCDD;  --mist-300: #BDC4C6;  --mist-400: #9FA8AB;  --mist-500: #828B8E;
  --mist-600: #677073;  --mist-700: #50585B;  --mist-800: #3E4547;  --mist-900: #2D3335;  --mist-950: #1B2022;
  --green-50: #EBFCED;  --green-100: #D9F6DD;  --green-200: #B8E9C1;  --green-300: #8ED69D;  --green-400: #60BE78;  --green-500: #32A155;
  --green-600: #00853C;  --green-700: #00692D;  --green-800: #005322;  --green-900: #003D17;  --green-950: #00280C;
  --amber-50: #FFF4EE;  --amber-100: #FFE8D9;  --amber-200: #FFD0B1;  --amber-300: #FEAD76;  --amber-400: #EC8A3E;  --amber-500: #CE6A00;
  --amber-600: #A85500;  --amber-700: #844200;  --amber-800: #693300;  --amber-900: #4F2400;  --amber-950: #341600;
  --red-50: #FFF4F3;  --red-100: #FFE6E4;  --red-200: #FFCDC8;  --red-300: #FFA8A0;  --red-400: #FF756E;  --red-500: #E54C4A;
  --red-600: #C52B30;  --red-700: #A1111D;  --red-800: #830011;  --red-900: #63000A;  --red-950: #430004;
  --blue-50: #F2F7FF;  --blue-100: #E1EEFF;  --blue-200: #C3DDFF;  --blue-300: #99C6FF;  --blue-400: #63A8FF;  --blue-500: #3589ED;
  --blue-600: #106DCE;  --blue-700: #0054A7;  --blue-800: #004285;  --blue-900: #003065;  --blue-950: #001E44;

  /* --- Hằng số chữ, khoảng cách, bo góc, đổ bóng --- */
  --font-display: 'Plus Jakarta Sans', 'Noto Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-sans: 'Noto Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.8125rem;
  --text-base: 0.9375rem;
  --text-md: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;
  --radius-sm: 6px;
  --radius: 8px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 999px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --shadow-sm: 0 1px 2px rgba(0, 33, 58, 0.06);
  --shadow: 0 1px 3px rgba(0, 33, 58, 0.08), 0 1px 2px rgba(0, 33, 58, 0.05);
  --shadow-md: 0 4px 12px -2px rgba(0, 33, 58, 0.10), 0 2px 4px -2px rgba(0, 33, 58, 0.06);
  --shadow-lg: 0 16px 32px -8px rgba(0, 33, 58, 0.18), 0 4px 8px -4px rgba(0, 33, 58, 0.08);
  --touch-target: 44px;
  --ease: cubic-bezier(.2,.7,.2,1);
  --dur: 160ms;

  /* --- Token ngữ nghĩa: SÁNG --- */
  --brand-petrol: #0C6170;
  --brand-ink: #00213A;
  --brand-gold: #BA9E68;
  --bg-main: #F4F9FA;
  --bg-card: #FFFFFF;
  --bg-elevated: #FFFFFF;
  --bg-sunken: #EAF2F3;
  --border: #D7DCDD;
  --border-strong: #828B8E;
  --border-focus: #0E7C8F;
  --focus-ring: #0E7C8F;
  --text-main: #182933;
  --text-heading: #00213A;
  --text-muted: #5E6A6E;
  --text-link: #0C6170;
  --color-on-dark: #F7FAFB;
  --primary: #0C6170;
  --primary-hover: #004D59;
  --primary-fill: #0C6170;
  --primary-fill-hover: #004D59;
  --on-primary: #FFFFFF;
  --primary-soft: #EBFAFE;
  --primary-border: #B9E3ED;
  --accent-gold: #BA9E68;
  --accent-gold-text: #6E5119;
  --accent-gold-soft: #FDF6EB;
  --success: #00692D;
  --warning: #844200;
  --danger: #A1111D;
  --info: #0054A7;
  --tint-green: #EBFCED;
  --tint-amber: #FFF4EE;
  --tint-red: #FFF4F3;
  --tint-blue: #F2F7FF;
  --tint-teal: #EBFAFE;
  --warning-dark: #693300;
  --danger-dark: #830011;
  --clinical-ned: #00692D;
  --clinical-due: #0054A7;
  --clinical-pending: #844200;
  --clinical-urgent: #A1111D;
  --clinical-neutral: #50585B;
  --chart-line: #0E7C8F;
  --chart-area: rgba(14, 124, 143, 0.1);
  --chart-threshold: #C52B30;
  --chart-event: #C52B30;
  --chart-ok: #9FA8AB;
  --chart-grid: #D7DCDD;
  --chart-axis: #677073;
  --spec-colorectal: #0095A1;
  --spec-hpb: #AD811F;
  --spec-upper_gi: #6B5FCA;
  --spec-hernia: #2E9E52;
  --spec-proctology: #A42C71;
  --spec-emergency_general: #E16A3E;
  --spec-other: #828B8E;

  /* --- Bí danh tương thích (tên cũ + 11 tên đang dùng mà chưa từng được định nghĩa) --- */
  --primary-light: var(--tint-teal);
  --primary-contrast: var(--on-primary);
  --btn-on-teal: var(--on-primary);
  --text-on-dark: var(--color-on-dark);
  --danger-light: var(--tint-red);
  --success-light: var(--tint-green);
  --warning-light: var(--tint-amber);
  --primary-dark: var(--primary-hover);
  --primary-subtle: var(--primary-soft);
  --neutral-subtle: var(--bg-sunken);
  --surface: var(--bg-card);
  --bg-surface: var(--bg-card);
  --border-color: var(--border);
  --text-secondary: var(--text-muted);
}

[data-theme="dark"] {
  color-scheme: dark;
  --brand-petrol: #90CEDD;
  --brand-ink: #00213A;
  --brand-gold: #D8BF94;
  --bg-main: #051015;
  --bg-card: #0B191E;
  --bg-elevated: #14242A;
  --bg-sunken: #081519;
  --border: #27363B;
  --border-strong: #637277;
  --border-focus: #90CEDD;
  --focus-ring: #90CEDD;
  --text-main: #EAF2F3;
  --text-heading: #FFFFFF;
  --text-muted: #B3C0C4;
  --text-link: #90CEDD;
  --color-on-dark: #F7FAFB;
  --primary: #90CEDD;
  --primary-hover: #B9E3ED;
  --primary-fill: #0E7C8F;
  --primary-fill-hover: #0C6170;
  --on-primary: #FFFFFF;
  --primary-soft: rgba(99, 180, 198, 0.16);
  --primary-border: rgba(144, 206, 221, 0.4);
  --accent-gold: #D8BF94;
  --accent-gold-text: #D8BF94;
  --accent-gold-soft: rgba(186, 158, 104, 0.16);
  --success: #8ED69D;
  --warning: #FEAD76;
  --danger: #FFA8A0;
  --info: #99C6FF;
  --tint-green: rgba(96, 190, 120, 0.16);
  --tint-amber: rgba(236, 138, 62, 0.16);
  --tint-red: rgba(255, 117, 110, 0.16);
  --tint-blue: rgba(99, 168, 255, 0.16);
  --tint-teal: rgba(99, 180, 198, 0.16);
  --warning-dark: #FFD0B1;
  --danger-dark: #FFCDC8;
  --clinical-ned: #8ED69D;
  --clinical-due: #99C6FF;
  --clinical-pending: #FEAD76;
  --clinical-urgent: #FFA8A0;
  --clinical-neutral: #B3C0C4;
  --chart-line: #90CEDD;
  --chart-area: rgba(144, 206, 221, 0.14);
  --chart-threshold: #FF756E;
  --chart-event: #FF756E;
  --chart-ok: #828B8E;
  --chart-grid: #27363B;
  --chart-axis: #B3C0C4;
  --spec-colorectal: #25A4B0;
  --spec-hpb: #B68A2C;
  --spec-upper_gi: #877EEC;
  --spec-hernia: #3EAB5E;
  --spec-proctology: #C64D8F;
  --spec-emergency_general: #E16A3E;
  --spec-other: #8B9497;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow: 0 1px 3px rgba(0, 0, 0, 0.45), 0 1px 2px rgba(0, 0, 0, 0.30);
  --shadow-md: 0 6px 16px -4px rgba(0, 0, 0, 0.55);
  --shadow-lg: 0 18px 40px -10px rgba(0, 0, 0, 0.65);
}
