/* =====================================================================
   Token thiết kế — Văn phòng số NOC2
   Màu xanh nhận diện cho khung ứng dụng, đỏ dấu mộc CHỈ dùng cho độ khẩn
   và sự vụ nghiêm trọng, mỗi phòng ban một màu riêng để định hướng.
   Bảng màu phòng ban đã chạy kiểm tra tách màu cho người mù màu
   (cặp kề nhau, cả nền sáng lẫn ca đêm).
   ===================================================================== */
:root {
  color-scheme: light;
  --paper: #F3F6FB;
  --surface: #FFFFFF;
  --surface-2: #F8FAFD;
  --sunken: #ECF1F8;
  --ink: #0F1B34;
  --ink-2: #4A5772;
  --ink-3: #6F7B93;
  --line: #E1E7F0;
  --line-2: #CBD5E3;

  --brand: #0A55D6;
  --brand-hover: #0846B4;
  --brand-ink: #0A4BC0;
  --brand-soft: #E7EEFC;
  --on-brand: #FFFFFF;

  --seal: #C8291F;
  --seal-soft: #FCEBE9;
  --ok: #15803D;
  --ok-soft: #E3F4EA;
  --warn: #A35208;
  --warn-soft: #FDF0DC;

  --sev-1: #C8291F;
  --sev-2: #D4560F;
  --sev-3: #B7791F;
  --sev-4: #64748B;

  --dept-RNOC2: #EB6834;
  --dept-SNOC2: #6D4AE8;
  --dept-INOC2: #14A37F;
  --dept-TNOC2: #E0A000;
  --dept-SOC2:  #D6458E;
  --dept-TH2:   #2F7FE0;

  --doc-paper: #FFFFFF;
  --doc-ink: #1B1C22;
  --esign: #1C7A45;

  --shadow-1: 0 1px 2px rgb(15 27 52 / .06);
  --shadow-2: 0 1px 2px rgb(15 27 52 / .05), 0 6px 16px -8px rgb(15 27 52 / .14);
  --shadow-pop: 0 20px 44px -14px rgb(15 27 52 / .30), 0 2px 6px rgb(15 27 52 / .08);
  --shadow-paper: 0 1px 1px rgb(15 27 52 / .05), 0 16px 36px -18px rgb(15 27 52 / .38);

  --font-ui: "Be Vietnam Pro", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-doc: "Tinos", "Times New Roman", Times, serif;

  --r-xs: 4px;
  --r-sm: 7px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;

  --side-w: 252px;
  --top-h: 60px;
}

/* Ca đêm: dịu mắt cho kíp trực 19:00–07:00, các bước màu phòng ban riêng cho nền tối */
[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0C1322;
  --surface: #141C2E;
  --surface-2: #182237;
  --sunken: #101829;
  --ink: #E6EBF5;
  --ink-2: #A8B3C9;
  --ink-3: #8390A9;
  --line: #233049;
  --line-2: #33415F;

  --brand: #4F86F7;
  --brand-hover: #6B9AFA;
  --brand-ink: #93B4FF;
  --brand-soft: #1A2A50;
  --on-brand: #FFFFFF;

  --seal: #FF6F61;
  --seal-soft: #3B1C1E;
  --ok: #4ACB7D;
  --ok-soft: #14301F;
  --warn: #F0A646;
  --warn-soft: #36270F;

  --sev-1: #FF6F61;
  --sev-2: #F08A3C;
  --sev-3: #D9A33B;
  --sev-4: #8D9AB3;

  --dept-RNOC2: #DE6630;
  --dept-SNOC2: #8468F0;
  --dept-INOC2: #17A07E;
  --dept-TNOC2: #B98508;
  --dept-SOC2:  #D9579A;
  --dept-TH2:   #4189E6;

  --doc-paper: #E9ECF2;
  --doc-ink: #1B1C22;
  --esign: #1C7A45;

  --shadow-1: 0 1px 2px rgb(0 0 0 / .4);
  --shadow-2: 0 1px 2px rgb(0 0 0 / .35), 0 8px 18px -8px rgb(0 0 0 / .5);
  --shadow-pop: 0 22px 48px -12px rgb(0 0 0 / .65), 0 2px 6px rgb(0 0 0 / .4);
  --shadow-paper: 0 1px 1px rgb(0 0 0 / .3), 0 16px 36px -16px rgb(0 0 0 / .7);
}

[data-dept="RNOC2"] { --dc: var(--dept-RNOC2); }
[data-dept="SNOC2"] { --dc: var(--dept-SNOC2); }
[data-dept="INOC2"] { --dc: var(--dept-INOC2); }
[data-dept="TNOC2"] { --dc: var(--dept-TNOC2); }
[data-dept="SOC2"]  { --dc: var(--dept-SOC2); }
[data-dept="TH2"]   { --dc: var(--dept-TH2); }
[data-dept] {
  --dc-soft: color-mix(in srgb, var(--dc) 12%, var(--surface));
  --dc-line: color-mix(in srgb, var(--dc) 40%, var(--surface));
  --dc-ink: color-mix(in srgb, var(--dc) 70%, var(--ink));
}