/* ══════════════════════════════════════════════════════════════════════
   โหมดมืด / สว่าง — 30 ก.ย. 69 (Boss: "ทำโหมด dark/light mode ไว้ด้วย")
   ⚠️ โหลด "ท้ายสุด" ต่อจาก ui-v3.css · แอปใช้ตัวแปรสีเกือบทั้งหมด → เปลี่ยนตัวแปรเป็นหลัก
      ที่เหลือคือกฎที่ฝังสีสว่างไว้ตรง ๆ (#fff/#F8FAFC ...) ทับเฉพาะจุดด้านล่าง
   ค่าเริ่ม = ตามเครื่อง (prefers-color-scheme) · กดปุ่ม 🌙/☀️ = บังคับ เก็บใน localStorage 'x10-theme'
   ตั้ง <html data-theme> ตั้งแต่ใน <head> (สคริปต์สั้นใน app.html/login.html) กันจอกะพริบขาว
   ถอยกลับ = เอา <link ui-dark.css> ออก
   ══════════════════════════════════════════════════════════════════════ */

/* ชุดตัวแปรโหมดมืด — ใช้ 2 ที่: ตามเครื่อง (ยกเว้นบังคับสว่าง) + บังคับมืด */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --primary:#3A86CF; --primary-dark:#2B6FB0; --primary-light:#15283D; --primary-glow:rgba(58,134,207,.25);
    --accent:#F68A39; --accent-dark:#F29A55; --accent-soft:#3A2614; --accent-tx:#F5A868;
    --success:#4ADE80; --success-bg:#12301F;
    --warning:#F5B454; --warning-bg:#33260F;
    --danger:#F87171;  --danger-bg:#3A1717;
    --bg:#0D141D; --card:#151F2B; --soft:#1C2836;
    --ink:#E6EDF5; --ink-soft:#B7C4D3; --muted:#8FA1B5;
    --line:#26354A; --line-strong:#36475E;
    --nav-bg:#0A1017; --nav-hdr:#070C12; --nav-ink:#C3D2E2;
    --sh:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);
    --sh-lg:0 12px 32px rgba(0,0,0,.55);
    --e1:0 1px 2px rgba(0,0,0,.35); --e2:0 1px 2px rgba(0,0,0,.35),0 4px 14px -4px rgba(0,0,0,.5);
    --e3:0 2px 4px rgba(0,0,0,.4),0 14px 32px -10px rgba(0,0,0,.6);
    --cta-ink:#2E1A05;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --primary:#3A86CF; --primary-dark:#2B6FB0; --primary-light:#15283D; --primary-glow:rgba(58,134,207,.25);
  --accent:#F68A39; --accent-dark:#F29A55; --accent-soft:#3A2614; --accent-tx:#F5A868;
  --success:#4ADE80; --success-bg:#12301F;
  --warning:#F5B454; --warning-bg:#33260F;
  --danger:#F87171;  --danger-bg:#3A1717;
  --bg:#0D141D; --card:#151F2B; --soft:#1C2836;
  --ink:#E6EDF5; --ink-soft:#B7C4D3; --muted:#8FA1B5;
  --line:#26354A; --line-strong:#36475E;
  --nav-bg:#0A1017; --nav-hdr:#070C12; --nav-ink:#C3D2E2;
  --sh:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);
  --sh-lg:0 12px 32px rgba(0,0,0,.55);
  --e1:0 1px 2px rgba(0,0,0,.35); --e2:0 1px 2px rgba(0,0,0,.35),0 4px 14px -4px rgba(0,0,0,.5);
  --e3:0 2px 4px rgba(0,0,0,.4),0 14px 32px -10px rgba(0,0,0,.6);
  --cta-ink:#2E1A05;
}

/* ── กฎที่ฝังสีสว่างไว้ตรง ๆ — ทับเฉพาะตอนมืด ──
   ใช้ html.dk (สคริปต์ใน head ใส่ให้ตามผลจริงของ data-theme + เครื่อง) จะได้เขียนชุดเดียว */
html.dk body{ background:var(--bg); color:var(--ink); }
html.dk table.dt th,
html.dk .tbl-wrap table.dt.sticky-last th:last-child{ background:#1A2533; color:var(--ink-soft); }
html.dk table.dt tr:hover td{ background:#1B2735; }
html.dk .todo:hover{ background:var(--soft); }
html.dk .rail-user, html.dk .r-items{ background:var(--soft); }
html.dk .x-modal > .panel.l1-pop{ background:var(--bg); }
html.dk .r-stage .mini i.now{ background:var(--card); }
html.dk .ix-bar-n{ background:var(--card); }
html.dk .mx .c12{ background:#3A2614; color:#F5B27A; border-color:#5A3A1C; }
html.dk .mx .c4{ background:#33260F; color:#F5C87A; }
html.dk .alert.i{ border-color:#244463; color:#B9D6F2; }
html.dk .alert.w{ border-color:#5A4318; color:#F3D39A; }
html.dk .alert.d{ border-color:#5E2626; color:#F9B4B4; }
html.dk .alert.w, html.dk .alert.d, html.dk .alert.i{ background-image:none; }
html.dk .chip.c-app{ color:#8CC4F5; }
html.dk .chip.c-sub{ color:#F5C26B; }
html.dk .chip.c-post{ color:#6EE7A0; }
html.dk .chip.c-rej{ color:#FCA5A5; }
html.dk .chip.c-iss{ color:#F5A868; }
html.dk .kpi.pri .vl{ color:#8CC4F5; }
html.dk .rail-nav a.on .ic, html.dk .rail-nav a.on{ color:#8CC4F5; }
html.dk a{ color:#8CC4F5; }
html.dk .btn-p, html.dk .btn-p:visited{ color:#fff; }
html.dk input, html.dk select, html.dk textarea{ background-color:var(--card); color:var(--ink); border-color:var(--line-strong); }
html.dk input::placeholder, html.dk textarea::placeholder{ color:var(--muted); }
html.dk .topbar{ background:color-mix(in srgb, var(--card) 92%, transparent); }
html.dk img{ opacity:.94; }
/* ช่องกรอกที่ถูกแก้ (สีส้มอ่อน) */
html.dk .row .in.edited{ background:var(--accent-soft); color:var(--accent-tx); }
/* สไตล์ inline ที่ฝังพื้นเหลือง/ขาวไว้ในหน้า (แถวไฮไลต์ ฯลฯ) */
html.dk [style*="background:#fff3c4"]{ background:#3A2E0E !important; }
html.dk [style*="background:#fff;"], html.dk [style*="background: #fff;"]{ background:var(--card) !important; }
html.dk [style*="background:#f2f2f2"]{ background:var(--soft) !important; }
html.dk [style*="color:#444"], html.dk [style*="color:#333"],
html.dk [style*="color:#666"], html.dk [style*="color:#777"]{ color:var(--ink-soft) !important; }

/* เส้นขอบที่ฝังสีสว่าง (รอบ 2) */
html.dk table.dt td{ border-bottom-color:var(--line); }
html.dk .l1-row{ border-top-color:var(--line); }
html.dk .panel, html.dk .kpi, html.dk .todo, html.dk .item{ border-color:var(--line); }
html.dk .panel-hd{ border-bottom-color:var(--line); }
html.dk .over{ border-color:#5A4318; color:#F3D39A; }
html.dk .urg{ border-color:#5E2626; color:#F9B4B4; }
html.dk .srcdot.s-demo, html.dk .srcdot.s-stale{ border-color:#5A4318; }

/* ปุ่มสลับธีมบนแถบหัว — หน้าตาเดียวกับปุ่ม ? */
.tb-theme{ width:34px; height:34px; border-radius:50%; border:1px solid var(--line-strong);
  background:var(--card); color:var(--ink); font-size:16px; line-height:1; cursor:pointer; padding:0;
  flex:none; display:grid; place-items:center; position:relative; }
.tb-theme:hover{ border-color:var(--primary); }
.tb-theme::after{ content:''; position:absolute; inset:-5px; }   /* พื้นที่แตะ ~44px */

/* ⚠️ ตอนปริ้นต้องเป็นขาว-ดำเสมอ ไม่ว่าจะอยู่โหมดไหน */
@media print{
  html.dk, html.dk body{ background:#fff !important; color:#000 !important; }
  html.dk #printArea, html.dk #printArea *{ color:#000 !important; background:transparent !important; }
}

/* 8 ต.ค. 69 — ป้าย "มูลค่า" ในการ์ด #acct ฝังสี #41536A/#52657A ใน app-core.css ⇒ โหมดมืดอ่านไม่ออก (2.1:1) */
html.dk .item .qty .lb, html.dk .kpi .lb { color: var(--muted); }