/* =========================================================================
   AKARA — ค่าสีและระยะกลางของทุกระบบ (ไม่มีกฎ layout ใด ๆ ในไฟล์นี้)

   แยกออกมาจาก akara.css เพราะหน้าที่มีโครงหน้าของตัวเองอยู่แล้ว (People Connect
   กับระบบสวัสดิการ) ต้องการแค่ "สีชุดเดียวกัน" ไม่ได้ต้องการโครงหน้าใหม่
   ถ้าบังคับให้หน้าพวกนั้นโหลด akara.css ทั้งก้อน กฎ layout จะไปทับของเดิมจนเพี้ยน

   หน้าที่ใช้ชุดหน้าตากลางทั้งชุด ลิงก์ akara.css พอ (มันดึงไฟล์นี้ให้เอง)
   หน้าที่มีโครงของตัวเอง ลิงก์ไฟล์นี้ไฟล์เดียว แล้วผูกตัวแปรของตัวเองเข้ากับค่าที่นี่

   ⚠️ เปลี่ยนสีที่นี่ที่เดียว มีผลทุกระบบ — ห้าม hardcode สีลงในหน้าใดหน้าหนึ่ง
   ========================================================================= */

:root{
  /* แบรนด์ */
  --ak:         #2B5BAE;
  --ak-dark:    #1a3d7a;
  --ak-yellow:  #F5C02B;

  /* บนพื้นน้ำเงิน (เมนูข้าง) */
  --ak-muted:   rgba(255,255,255,.62);
  --ak-divider: rgba(255,255,255,.12);
  --ak-active:  rgba(255,255,255,.15);
  --ak-hover:   rgba(255,255,255,.08);
  /* ข้อความรองในแถบเมนู (หัวข้อกลุ่ม · ป้ายกำกับ · อีเมลผู้พัฒนา)
     ─────────────────────────────────────────────────────────────────
     **เป็นสีทึบ ไม่ใช่ขาวโปร่งแสง** เพราะแถบเมนูของแต่ละระบบเป็นน้ำเงินคนละ
     เฉด (ระบบรับสมัครงานมี rgba(0,0,0,.14) ทับอีกชั้น · People Connect ใช้
     --ak · ระบบระเบียบบริษัทใช้ --ak-dark) ขาวโปร่งแสงค่าเดียวจึงให้ความ
     อ่านออกไม่เท่ากันสามแบบ · สีทึบให้ผลเดียวกันทุกพื้น

     เลือก #D6DDEC จากการวัด: พื้นที่สว่างที่สุด (--ak) ได้ contrast 4.80
     ผ่านเกณฑ์ข้อความเล็กที่ต้องได้ 4.5 · พื้นอื่นได้ 5.91 และ 7.74
     ของเดิมใช้ขาว 38-62% ได้แค่ 2.23-4.19 ไม่ผ่านทุกหน้า จางจนแทบมองไม่เห็น

     ชื่อผู้พัฒนายังเป็นขาวเต็ม (6.54-10.54) จึงยังเห็นลำดับว่าอันไหนคือชื่อ */
  --credit-dim: #D6DDEC;

  /* ป้ายผู้พัฒนาท้ายแถบเมนู — ตั้งใจให้กลืนไปกับพื้นหลัง
     มันคือ "ถามใครเวลาระบบมีปัญหา" ไม่ใช่ลายเซ็นบนงาน

     ⚠️ **ค่าเหล่านี้ต่ำกว่าเกณฑ์ contrast ของข้อความเล็ก และนั่นคือความตั้งใจ**
     วัดได้ 2.27–3.58 บนแถบเมนูสามเฉด ส่วนเกณฑ์ WCAG ของข้อความเล็กคือ 4.5
     พี่อำนาจสั่งสามครั้งให้กลืนกับพื้นหลัง และรับทราบว่าแลกอะไรไป (10 ก.ย. 69)
     — ถ้าจะแก้กลับ ให้ถามพี่อำนาจก่อน อย่าคิดว่าเป็นบั๊กแล้วดันค่าขึ้นเอง

     ใช้ขาวโปร่งแสง ไม่ใช่สีทึบ **โดยตั้งใจ** เพราะโจทย์คือ "กลืนไปกับพื้น"
     ขาวโปร่งแสงจะจางลงเท่ากันเมื่อเทียบกับพื้นที่รองอยู่เสมอ ต่อให้แถบเมนู
     ของแต่ละระบบเป็นน้ำเงินคนละเฉด · สีทึบค่าเดียวจะดูจางไม่เท่ากันสามแบบ
     (ต่างจาก --credit-dim ข้างบนที่เป้าหมายคือให้อ่านง่ายเท่ากัน จึงใช้สีทึบ)

     ประวัติที่ลองแล้วไม่เอา: เคยทำพื้นใต้ป้ายให้เข้มขึ้น 26% แล้วใช้สีทึบ
     #ADBAD8 ซึ่งผ่านเกณฑ์ 4.95 — แต่แถบพื้นเข้มทำให้มุมนั้นสะดุดตาขึ้นมา
     เป็นก้อน ตรงข้ามกับที่ต้องการ จึงไม่เอาแถบพื้น */
  --dev-label: rgba(255,255,255,.38);
  --dev-name:  rgba(255,255,255,.62);
  --dev-mail:  rgba(255,255,255,.42);
  --dev-hover: rgba(255,255,255,.85);

  /* พื้นและตัวอักษร */
  --bg:         #f2f4f8;
  --surface:    #ffffff;
  --border:     #dce3f0;
  --text:       #1a1e2e;
  --text-sub:   #4b5875;
  --text-muted: #6b7899;

  /* สถานะ */
  --ok:         #16a34a;
  --ok-dark:    #15803d;
  --danger:     #dc2626;
  --warn-bg:    #fef3c7;
  --warn:       #92400e;
  --ok-bg:      #dcfce7;
  --danger-bg:  #fee2e2;
  --info-bg:    #e6eefb;

  /* ── สีสำหรับกราฟ (21 ก.ย. 69) ──────────────────────────────────
     ใช้สีแบรนด์ล้วน — น้ำเงินองค์กรกับเหลืองโลโก้ · วัดระยะห่างสำหรับคน
     ตาบอดสีแล้ว ΔE 41.8 (protan) · 37.8 (tritan) · 46.2 (สายตาปกติ)
     ซึ่งห่างกว่าคู่น้ำเงิน-ส้มที่เคยใช้ (27.5) อยู่มาก

     ⚠️ **เหลืองโลโก้คอนทราสต์บนพื้นขาวแค่ 1.69:1** แท่งสีนี้จึงต้องมี
        "ราง" สีอ่อนรองอยู่เสมอ หรือมีตัวเลขกำกับ อย่างใดอย่างหนึ่ง ไม่งั้น
        มองไม่เห็นว่าแท่งยาวแค่ไหน · ห้ามใช้เป็นตัวหนังสือบนพื้นขาวเด็ดขาด
     เปลี่ยนค่าเมื่อไหร่ต้องวัดใหม่ อย่าเลือกด้วยสายตา */
  --chart-1:    #2B5BAE;   /* น้ำเงินองค์กร · ชาย · คนเข้าใหม่ · พิจิตร */
  --chart-2:    #F5C02B;   /* เหลืองโลโก้ · หญิง · คนพ้นสภาพ · จังหวัดอื่น */

  /* ไล่เฉดน้ำเงินสำหรับ "ค่าที่มีลำดับ" เท่านั้น เช่น จังหวัดเรียงตามระยะห่าง
     จากเหมือง · ผ่านการตรวจแบบ ordinal (ความสว่างไล่ทางเดียว ห่างกันพอ
     ทุกขั้น ปลายอ่อนสุดยังคอนทราสต์ 3.00:1)
     ⚠️ ห้ามเอาไปใช้กับหมวดที่ไม่มีลำดับ (แผนก ทีม) — การไล่เฉดตามค่ามาก
        น้อยคือการเข้ารหัสซ้ำกับความยาวแท่ง เปลืองช่องสีไปเปล่า ๆ */
  --chart-s1:   #1A3D7A;
  --chart-s2:   #2B5BAE;
  --chart-s3:   #6E96D6;

  --chart-track: #e7ecf5;  /* รางของแท่ง — สิ่งที่ทำให้แท่งสีอ่อนอ่านออก */
  --chart-grid:  #eef1f7;  /* เส้นตารางจาง ๆ เส้นเดียว ห้ามเป็นเส้นประ */

  --radius:     10px;
  --shadow:     0 1px 3px rgba(26,30,46,.07);
}
