/* ============================================================================
   assets/css/tokens.css — ชั้น token กลางชุดเดียวของทั้งระบบ (D-31 ชั้น C · C1)
   ----------------------------------------------------------------------------
   ปัญหาเดิม: ค่าสีดิบกระจายอยู่ 20 บล็อกใน 7 ไฟล์ CSS + 5 ไฟล์ PHP และ
   "สีเดียวกัน" มีชื่อเรียก 3 ชุด:
       --primary / --text / --border      (ฝั่งแอป)
       --navy-soft / --text / --line      (หน้าสาธารณะ + หลังบ้าน)
       --f-green / --f-ink / --f-line     (พื้นที่ตัวแทน)
   ⇒ แก้สีหนึ่งครั้งต้องไล่หลายไฟล์ และมักลืมไฟล์ใดไฟล์หนึ่ง

   วิธีแก้ที่เลือก (เสี่ยงน้อยที่สุด): **ไม่ไล่เปลี่ยนชื่อตัวแปรทั่วรีโป**
   ไฟล์นี้ถือ "ค่า" · ไฟล์เดิมยังถือ "ชื่อ" เหมือนเดิมทุกตัว แต่ค่าเปลี่ยนเป็น
   `var(--k-...)` ⇒ โค้ดที่อ้าง `var(--navy)` / `var(--primary)` / `var(--f-green)`
   อยู่แล้วทั้งหมดยังใช้ได้ต่อ ไม่ต้องแตะ

   ลำดับโหลด: ไฟล์นี้ต้องอยู่ **ก่อน** app.css / landing.css เสมอ
   (มีเทสไล่ทุกหน้าตรวจให้ที่ tests/ui_layer_c.php)

   ⚠ ห้ามใส่กฎที่วาดอะไรลงในไฟล์นี้ — เก็บเฉพาะค่า
   ============================================================================ */

:root {
  /* ── แบรนด์ ─────────────────────────────────────────────────────────────
     ทอง = สีแบรนด์ร่วม (อยู่ในโลโก้) ไม่ใช่สีประจำโซนใดโซนหนึ่ง
     สีหลักของระบบคือน้ำเงิน — มติ CEO 2026-09-02 (W-90) */
  --k-navy:        #141452;   /* Deep Navy — ตัวอักษร/พื้นเข้ม */
  --k-navy-raise:  #1E1E6B;   /* พื้นเข้มที่ยกขึ้นหนึ่งชั้น */
  --k-blue:        #2D35C0;   /* Bright Blue — primary */
  --k-blue-700:    #242BA0;   /* hover/active */
  --k-blue-300:    #6E74D6;   /* เฉดอ่อน */
  --k-blue-tint:   #E9EAFB;   /* พื้นอ่อนของน้ำเงิน */
  --k-blue-faint:  #F3F4FD;
  --k-gold:        #F5B40C;
  --k-gold-deep:   #D89A00;
  --k-gold-tint:   #FDF2D4;
  --k-gold-ink:    #1C1200;   /* ตัวอักษรบนพื้นทอง */
  --k-gold-glow:   rgba(245, 180, 12, .32);

  /* ── สีประจำโซน (W-90 · มติ CEO 2026-09-02) ────────────────────────────
     แอดมิน/หลังบ้าน = Blue Sky · กิจการ = Blue Navy · ตัวแทน = Green */
  --k-zone-admin-deep: #0C4A6E;
  --k-zone-admin-dark: #075985;
  --k-zone-admin-main: #0369A1;
  --k-zone-admin-on:   #BAE6FD;
  --k-zone-admin-tint: #E0F2FE;
  --k-zone-firm:       #15803D;   /* เขียวโซนตัวแทน */
  --k-zone-firm-deep:  #0E6A33;
  --k-zone-firm-soft:  #E9F4EC;
  --k-zone-firm-faint: #F0F8F2;

  /* ── พื้นผิว ───────────────────────────────────────────────────────────
     --k-app-bg คือค่าทิศทาง CALM (มติ CEO 2026-08-26 แบบ 4) */
  --k-app-bg:      #F6F7F9;
  --k-paper:       #F5F6FC;   /* พื้นหลังหน้าสาธารณะ/หลังบ้าน */
  --k-surface:     #FFFFFF;
  --k-surface-2:   #FBFBFE;
  --k-sunken:      #EFF0F6;
  --k-firm-bg:     #F7F9F8;   /* พื้นหลังโซนตัวแทน (อมเขียวจาง) */
  --k-firm-card:   #FFFFFF;

  /* ── เส้น ──────────────────────────────────────────────────────────── */
  --k-line:        #E4E6F1;
  --k-line-soft:   #EFF0F6;
  --k-line-strong: #D2D5E6;
  --k-firm-line:   #E3E9E5;
  --k-firm-line-soft: #EEF2EF;

  /* ── ตัวอักษร ──────────────────────────────────────────────────────────
     UI-01 / D-31 B3: เทาจางเดิม (#9094AC = 2.99:1 · #ADB1C6 = 2.13:1)
     ต่ำกว่า WCAG AA — ค่าปัจจุบันคงโทนน้ำเงินอมเทาไว้ แต่เข้มพอให้อ่านออก
     ตัวเลขคำนวณสดที่ tests/ui_layer_b.php · tests/js/color_tokens.test.js */
  --k-text:        #141452;   /* = --k-navy */
  --k-text-soft:   #5B5F7A;   /* 6.24:1 บนขาว */
  --k-text-mut:    #5F6486;   /* 5.75 ขาว · 5.05 พื้นจม */
  --k-text-faint:  #63688A;   /* 5.42 ขาว · 4.76 พื้นจม */
  --k-on-dark:     #FFFFFF;
  --k-on-dark-mut: rgba(255, 255, 255, .72);
  --k-firm-ink:    #1A2433;   /* ตัวอักษรโซนตัวแทน (เทาอมน้ำเงิน) */
  --k-firm-ink-2:  #46566A;
  /* D-31 C2 (วัดจริงในเบราว์เซอร์ 2026-09-02): ค่าเดิม #7A8894 = 3.64:1 บนขาว
     ตกเกณฑ์ WCAG AA และใช้อยู่ 23 จุดที่มองเห็นบนหน้าเลือกกิจการ (ป้ายกำกับ KPI ·
     คำอธิบายใต้หัวข้อ · หัวหมวดเมนู) — เป็นบั๊กชุดเดียวกับ --text-mut ที่ D-31 B3 แก้ไปแล้ว
     แต่โซนตัวแทนตกสำรวจ · ค่าใหม่คงมุมสีเดิม (208.6° vs 207.7°) แต่เข้มพอ:
     ขาว 5.29 · พื้นโซน #F7F9F8 5.00 · พื้นเขียวจาง #F0F8F2 4.89 */
  --k-firm-ink-3:  #626D77;

  /* ── สถานะ (C2) ────────────────────────────────────────────────────────
     ก่อนหน้านี้ "สำเร็จ" มี 8 เฉด · "ผิดพลาด" 9 · "เตือน" 5 กระจายตามไฟล์
     ทั้งที่ความหมายเดียวกัน — ยุบเหลือชุดละ พื้น 1 + ตัวอักษร 1 (+ เส้น 1)

     คอนทราสต์วัดจริง (สูตร WCAG · เทสคำนวณซ้ำที่ tests/ui_layer_c.php):
       ok   #15693B บน #E7F6EC = 6.03 · ขาว 6.74 · พื้นแอป 6.29 · พื้นจม 5.93
       warn #8A6100 บน #FEF3DC = 5.03 · ขาว 5.54 · พื้นแอป 5.24 · พื้นจม 4.87
       bad  #9B2C2C บน #FDE8E8 = 6.41 · ขาว 7.53 · พื้นแอป 7.12 · พื้นจม 6.62
       info #1D4ED8 บน #E7F0FD = 5.83 · ขาว 6.70 · พื้นจม 5.89
     ค่าที่ถูกยุบทิ้งและเหตุผล:
       #0B7A4B/#15683F (สำเร็จ) · #8A5A00/#8A6402 (เตือน) · #B0311F (ผิดพลาด)
         — ต่างจากค่ากลางน้อยกว่าที่ตาแยกออก แต่ทำให้แก้สีต้องไล่ 5 ไฟล์
       #C2453A (แดงโซนตัวแทน) — บนพื้น #FBEAE8 ได้ **4.29:1 ตก AA**
         ยุบมาที่ #9B2C2C บน #FDE8E8 = 6.41 ⇒ แก้บั๊กคอนทราสต์ไปในตัว */
  --k-ok:          #16A34A;   /* สีพื้น/ไอคอน — อ่านเป็นข้อความไม่ออก */
  --k-ok-strong:   #15803D;   /* hover/pressed ของปุ่มสถานะสำเร็จ */
  --k-ok-bg:       #E7F6EC;
  --k-ok-ink:      #15693B;
  --k-ok-line:     #BFE3CD;
  --k-warn:        #F59E0B;
  --k-warn-bg:     #FEF3DC;
  --k-warn-ink:    #8A6100;
  --k-warn-line:   #F0DDAE;
  --k-bad:         #EF4444;
  --k-bad-strong:  #B91C1C;
  --k-bad-bg:      #FDE8E8;
  --k-bad-ink:     #9B2C2C;
  --k-bad-line:    #F5C6C2;
  --k-info:        #3B82F6;
  --k-info-bg:     #E7F0FD;
  --k-info-ink:    #1D4ED8;

  /* ── เงา · มุม · จังหวะ ────────────────────────────────────────────────
     ทิศทาง CALM (มติ CEO 2026-08-26 แบบ 4): เงาบางแต่ "มี" · มุมมนขึ้น
     ก่อน D-31 ชั้น C ค่าชุดนี้ถูก app-refresh.css ตั้งทับด้วยของก่อนหน้า
     ⇒ เงา calm ไม่เคยขึ้นจอเลย (C4) */
  --k-shadow-sm: 0 1px 2px rgba(20, 20, 82, .05);
  --k-shadow:    0 1px 2px rgba(20, 20, 82, .04), 0 10px 24px -14px rgba(20, 20, 82, .22);
  --k-shadow-lg: 0 18px 44px -20px rgba(20, 20, 82, .32);
  --k-shadow-doc: 0 10px 30px rgba(20, 20, 82, .28);
  --k-ring:      0 0 0 3px rgba(45, 53, 192, .35);
  --k-focus-ring: rgba(45, 53, 192, .35);

  --k-radius-sm: 8px;
  --k-radius:    12px;
  --k-radius-lg: 16px;
  --k-radius-xl: 20px;
  --k-radius-pill: 999px;

  --k-dur:  160ms;
  --k-ease: cubic-bezier(.4, 0, .2, 1);

  /* ── ตัวอักษร (ตระกูลฟอนต์) ─────────────────────────────────────────── */
  --k-font-display: 'Poppins', 'IBM Plex Sans Thai', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --k-font-body:    'IBM Plex Sans Thai', 'Poppins', system-ui, sans-serif;
  --k-font-num:     'Poppins', system-ui, sans-serif;
  --k-font-mono:    'JetBrains Mono', 'SFMono-Regular', Menlo, Consolas, monospace;
}

/* ============================================================================
   โหมดมืด — พาเลตเดียวของทั้งระบบ (C5)
   ----------------------------------------------------------------------------
   ปัญหาเดิม: `html.dark` ถูกประกาศ 2 ไฟล์ด้วยพาเลตคนละตระกูล
     app-refresh.css → slate (#0F172A / #1E293B / #334155)
     app-peak.css    → navy  (#0b0d1b / #141731 / #282d52)
   app-peak โหลดทีหลังจึงชนะเฉพาะตัวที่มันประกาศ ส่วนที่มีแต่ใน refresh
   (--hairline · --accent-tint · --surface-raise · ชุดสถานะ) ยังเป็น slate
   ⇒ โหมดมืดจริงเป็น "ลูกผสม" เส้นสีหนึ่ง พื้นอีกสีหนึ่ง

   ตัดสิน: ยึด **navy** (ตระกูลเดียวกับแบรนด์ และเป็นค่าที่ชนะบนจอมาตลอด)
   ⇒ ตัวที่เคยเป็น navy อยู่แล้วไม่เปลี่ยน · ตัวที่เคยเป็น slate ย้ายมาโทน navy
   ============================================================================ */
html.dark {
  --k-surface:     #141731;
  --k-surface-2:   #1A1E3B;
  --k-sunken:      #1A1E3B;
  --k-app-bg:      #0B0D1B;
  --k-paper:       #0B0D1B;
  --k-surface-raise: #1A1E3B;

  --k-navy:        #0E1128;   /* พื้นเข้มสุดในโหมดมืด */
  --k-navy-raise:  #1A1E3B;
  --k-blue:        #5B74FF;
  --k-blue-700:    #7D91FF;
  --k-blue-300:    #6B82FF;
  --k-blue-tint:   #242F66;
  --k-blue-faint:  #1C2145;

  --k-line:        #282D52;
  --k-line-soft:   #222747;
  --k-line-strong: #343A66;

  --k-text:        #EEF0FB;
  --k-text-soft:   #C3C9EC;
  --k-text-mut:    #9AA1CC;
  --k-text-faint:  #8990BE;

  /* ชุดสถานะโหมดมืด — สีตัวอักษรสว่างบนพื้น tint เข้ม (D-31 ชั้น B1)
     ok   #86EFAC บน #14532D = 6.49  · บนพื้นการ์ด 12.5
     warn #FCD34D บน #78350F = 6.29  · บนพื้นการ์ด 12.17
     bad  #FCA5A5 บน #7F1D1D = 5.28  · บนพื้นการ์ด 9.25
     info #93C5FD บน #1E3A5F = 6.38  · บนพื้นการ์ด 9.73 */
  --k-ok:          #4ADE80;
  --k-ok-strong:   #86EFAC;
  --k-ok-bg:       #14532D;
  --k-ok-ink:      #86EFAC;
  --k-ok-line:     #1D6B3C;
  --k-warn:        #FCD34D;
  --k-warn-bg:     #78350F;
  --k-warn-ink:    #FCD34D;
  --k-warn-line:   #92510F;
  --k-bad:         #F87171;
  --k-bad-strong:  #FCA5A5;
  --k-bad-bg:      #7F1D1D;
  --k-bad-ink:     #FCA5A5;
  --k-bad-line:    #9B2C2C;
  --k-info:        #60A5FA;
  --k-info-bg:     #1E3A5F;
  --k-info-ink:    #93C5FD;

  --k-shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);
  --k-shadow:    0 4px 12px -2px rgba(0, 0, 0, .4);
  --k-shadow-lg: 0 16px 32px -8px rgba(0, 0, 0, .5);
  --k-ring:      0 0 0 3px rgba(91, 116, 255, .35);
  --k-focus-ring: rgba(91, 116, 255, .35);

  /* โซนตัวแทนในโหมดมืด (C6) — เขียวเข้มพอให้ตัวอักษรขาวอ่านออกเมื่อเป็นพื้นทึบ
     ขาวบน #15803D = 4.99 · ในโหมดมืดใช้ตัวอักษรเข้มบนเขียวสว่างแทน (ดู firm.css) */
  --k-zone-firm:       #4ADE80;
  --k-zone-firm-deep:  #86EFAC;
  --k-zone-firm-soft:  #14532D;
  --k-zone-firm-faint: #102A1B;
  --k-firm-bg:         #0C1310;
  --k-firm-card:       #141C18;
  --k-firm-line:       #253028;
  --k-firm-line-soft:  #1C2620;
  --k-firm-ink:        #E7EFE9;
  --k-firm-ink-2:      #B2C2B7;
  --k-firm-ink-3:      #94A69A;
}
