/* Theme tokens ported 1:1 from KPC-POS assets/css/main.css (same names, same values).
   Light = Variant B "Executive Hybrid Slate"; dark = POS dark/Variant C. Colours are space-separated RGB triplets
   so they compose as rgb(var(--token) / alpha). Change a brand here and the whole app follows. */
@font-face{font-family:"Kdam Thmor Pro";src:url("/app/fonts/KdamThmorPro-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"MiSans Lao";src:url("/app/fonts/MiSansLao-Light.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"MiSans Lao";src:url("/app/fonts/MiSansLao-Normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"MiSans Lao";src:url("/app/fonts/MiSansLao-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"MiSans Lao";src:url("/app/fonts/MiSansLao-Bold.woff2") format("woff2");font-weight:700;font-display:swap}

:root{
  color-scheme:light;
  --brand-primary:0 104 234;--brand-primary-fg:255 255 255;--brand-accent:0 170 255;--brand-dark:11 19 43;
  --accent-soft-bg:230 240 253;--accent-soft-fg:0 78 176;
  --brand-surface:255 255 255;--brand-muted:248 250 252;--brand-50:239 246 255;
  --ink:15 23 42;--ink-2:51 65 85;--ink-3:100 116 139;
  --surface-border:226 232 240;--border-subtle:241 245 249;
  --shell-bg:15 23 42;--shell-fg:248 250 252;--shell-muted:148 163 184;--shell-border:30 41 59;
  --gold-fg:146 110 28;--gold-bg:255 251 235;
  --success:4 120 87;--success-bg:236 253 245;--warning:180 83 9;--warning-bg:254 252 232;--danger:239 68 68;--danger-bg:254 242 242;
  --glass-bg:255 255 255;--glass-border:203 213 225;
  --font-sans:'Kdam Thmor Pro','MiSans Lao','Noto Sans Lao',-apple-system,BlinkMacSystemFont,sans-serif;
  --font-body:'MiSans Lao','Noto Sans Lao',-apple-system,BlinkMacSystemFont,sans-serif;
  --font-mono:ui-monospace,'SFMono-Regular','Consolas',monospace;
  --radius-sm:10px;--radius:16px;--radius-lg:20px;--radius-xl:24px;--radius-pill:9999px;
  --shadow-card:0 6px 20px -4px rgb(11 19 43 / .07),0 2px 6px -1px rgb(0 104 234 / .04);
  --shadow-float:0 14px 28px -6px rgb(11 19 43 / .14),0 4px 10px -2px rgb(0 104 234 / .08);
  font-synthesis:none;
}
/* Dark: POS values. Applied by explicit choice, or by the OS when the user has not chosen. */
:root[data-theme='dark']{
  color-scheme:dark;
  --brand-primary:8 118 186;--brand-accent:69 191 240;--accent-soft-bg:7 34 61;--accent-soft-fg:69 191 240;
  --brand-surface:18 26 43;--brand-muted:11 17 30;--brand-50:22 34 56;
  --ink:248 250 252;--ink-2:203 213 225;--ink-3:148 163 184;
  --surface-border:40 54 84;--border-subtle:28 40 64;
  --shell-bg:9 14 26;--shell-fg:248 250 252;--shell-muted:148 163 184;--shell-border:40 54 84;
  --gold-fg:253 224 71;--gold-bg:66 52 17;--success:52 211 153;--success-bg:9 32 27;--warning:251 191 36;--warning-bg:40 30 9;
  --danger:251 113 133;--danger-bg:45 14 24;--glass-bg:18 26 43;--glass-border:44 52 84;
  --radius-sm:12px;--radius-lg:24px;--radius-xl:28px;
  --shadow-card:0 25px 50px -12px rgb(0 0 0 / .55),inset 0 1px 2px rgb(255 255 255 / .12);
  --shadow-float:0 25px 50px -12px rgb(0 0 0 / .65),0 0 24px -4px rgb(0 111 190 / .32);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme='light']){
    color-scheme:dark;
    --brand-primary:8 118 186;--brand-accent:69 191 240;--accent-soft-bg:7 34 61;--accent-soft-fg:69 191 240;
    --brand-surface:18 26 43;--brand-muted:11 17 30;--brand-50:22 34 56;
    --ink:248 250 252;--ink-2:203 213 225;--ink-3:148 163 184;
    --surface-border:40 54 84;--border-subtle:28 40 64;
    --shell-bg:9 14 26;--shell-fg:248 250 252;--shell-muted:148 163 184;--shell-border:40 54 84;
    --gold-fg:253 224 71;--gold-bg:66 52 17;--success:52 211 153;--success-bg:9 32 27;--warning:251 191 36;--warning-bg:40 30 9;
    --danger:251 113 133;--danger-bg:45 14 24;--glass-bg:18 26 43;--glass-border:44 52 84;
    --radius-sm:12px;--radius-lg:24px;--radius-xl:28px;
    --shadow-card:0 25px 50px -12px rgb(0 0 0 / .55),inset 0 1px 2px rgb(255 255 255 / .12);
    --shadow-float:0 25px 50px -12px rgb(0 0 0 / .65),0 0 24px -4px rgb(0 111 190 / .32);
  }
}
