/* SmartTeam · กรอบมน นุ่ม ทันสมัย ทุกโมดูล (รอบ 8)
   โหลดเป็นไฟล์สุดท้ายของทุกหน้า · ใช้ "html body" นำหน้าให้ชนะสไตล์เดิมของแต่ละหน้าโดยไม่ต้องใช้ !important
   ไม่แตะหน้าพิมพ์เอกสาร (หน้าต่างพิมพ์มี CSS ของตัวเอง) */
:root{
  --r-sm:.6rem;     /* ช่องกรอก ปุ่ม ตัวเลือก */
  --r-md:.9rem;     /* การ์ด แผง ตาราง กล่องข้อความ */
  --r-lg:1.15rem;   /* หน้าต่างลอย */
  --soft-shadow:0 1px 2px rgba(16,24,40,.04),0 6px 20px rgba(16,24,40,.05);
  /* ฟอนต์เดียวทั้งระบบ: เดิมหัวตาราง/ป้ายช่องใช้ฟอนต์ mono ซึ่งไม่มีอักษรไทย → เบราว์เซอร์ไปใช้ฟอนต์ระบบ ตัวห่าง ดูไม่เข้ากัน
     ตัวเลขยังตรงหลักด้วย tabular-nums */
  --mono:var(--body,'IBM Plex Sans Thai','Segoe UI','Noto Sans Thai',sans-serif);
}
html body{font-family:var(--body,'IBM Plex Sans Thai',sans-serif)}
html body :where(input,select,textarea,button){font-family:inherit}
html body :where(td,th,input,.num,.n,.stats dd,.bal,.wallet-bal){font-variant-numeric:tabular-nums}
/* ป้ายหัวตาราง/ป้ายช่อง: ไม่ตัวพิมพ์ใหญ่ ไม่ถ่างตัวอักษร (ถ่างแล้ววรรณยุกต์ไทยลอย) */
html body :is(th,label.fld>span,.fld>span,.stats dt,.tag,.doclinks-row .lb,.doclinks-title,.imgslot .lb,.bookpick label,
  .sliplines .sec,.company-imgpick>.lb,.modnav-app,.lbl,.field-label){
  letter-spacing:normal;text-transform:none;font-family:var(--body,inherit);
}
html body th{font-weight:600;color:var(--ink-2,inherit)}

/* ---------- การ์ด แผง ตาราง ---------- */
html body .panel,html body .card,html body .stats,html body .scroller,html body .slip,html body .tile,
html body .lockcard,html body .doclinks,html body .bn-ivpick,html body .import-review-doc,
html body .notepreset,html body .customer-table,html body .picklist{
  border-radius:var(--r-md);
}
html body .panel,html body .card,html body .tile,html body .slip,html body .stats{box-shadow:var(--soft-shadow)}
html body .panel>header{border-radius:var(--r-md) var(--r-md) 0 0}
html body .panel>:last-child{border-bottom-left-radius:var(--r-md);border-bottom-right-radius:var(--r-md)}
html body .scroller{overflow:auto}

/* ---------- หน้าต่างลอย ---------- */
html body .sheetcard,html body #pinbox .pincard,html body .pick-ask .card,html body #coSearch>div{border-radius:var(--r-lg)}
html body .sheetcard>header{border-radius:var(--r-lg) var(--r-lg) 0 0}
html body .sheetcard>footer{border-radius:0 0 var(--r-lg) var(--r-lg)}

/* ---------- ช่องกรอก ปุ่ม ----------
   ค่าพื้นฐานใช้ :where (ความเจาะจงต่ำ) ให้ป้ายแบบเม็ดยา (999px) ของแต่ละหน้ายังชนะ
   แล้วระบุตัวที่หน้าเดิมตั้งเหลี่ยมไว้ตรง ๆ ด้านล่าง */
html body :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea,button){border-radius:var(--r-sm)}
/* ช่องที่หน้าเดิมไม่ได้แต่งไว้ (ขอบดำหนาของเบราว์เซอร์) ให้เป็นขอบบางสีเดียวกันทั้งระบบ */
html body :where(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]):not([type=hidden]),select,textarea){
  border:1px solid var(--rule,#d5dee4);background-color:var(--surface,#fff);color:var(--ink,inherit);padding:.38rem .55rem;
}
html body :where(input,select,textarea):focus-visible{outline:2px solid color-mix(in srgb,var(--accent,#0D5A60) 35%,transparent);outline-offset:1px;border-color:var(--accent,#0D5A60)}
html body .btn,html body a.btn,html body label.fld input,html body label.fld select,html body label.fld textarea,
html body .fld>input,html body .fld>select,html body .fld>textarea,html body select.pill,html body input.pill,
html body .custcombo-in,html body .bookpick select,html body .bookpick .row button,html body .lockcard input,
html body .bnboard-side .bnq input,html body .rcsrc-item,html body .yearpick select,html body .scalectl input{
  border-radius:var(--r-sm);
}
html body .pickseg{border-radius:var(--r-sm)}
html body .pickseg .btn{border-radius:0}
html body .pickseg .btn:first-child{border-radius:var(--r-sm) 0 0 var(--r-sm)}
html body .pickseg .btn:last-child{border-radius:0 var(--r-sm) var(--r-sm) 0}

/* ---------- ข้อความแจ้ง ป้าย ---------- */
html body .notice,html body .msg,html body .lockmsg,html body .import-review-errors,html body .toast{border-radius:var(--r-sm)}
html body .doctype,html body .tag{border-radius:.45rem}

/* ---------- เมนูลอย รายการเลือก ---------- */
html body .combo-menu,html body .custcombo-list,html body .docq-pop,html body .pickbox{border-radius:var(--r-sm)}
html body .pickbox label,html body .navlist button,html body .modtabs button{border-radius:var(--r-sm)}

/* ---------- ที่วางไฟล์ รูป ---------- */
html body .dropzone,html body .logobox,html body .company-imgdrop,html body .co-prev-viewport,html body .fd{border-radius:var(--r-md)}

/* ---------- รอบ 8 ชุด E: ฟอร์ม 3 กรอบ (รายละเอียดเอกสาร / รายการ / การชำระ) ---------- */
html body .xf{border:1px solid var(--rule,#d5dee4);border-radius:var(--r-md);background:var(--surface,#fff);
  padding:.85rem 1rem 1rem;margin:0 0 .9rem;box-shadow:var(--soft-shadow)}
html body .xf>.xf-h{display:flex;align-items:center;gap:.55rem;margin:0 0 .7rem;padding:0 0 .55rem;border-bottom:1px dashed var(--rule,#d5dee4)}
html body .xf>.xf-h h3{margin:0;font-size:1.02rem;font-weight:600;color:var(--ink,inherit)}
html body .xf>.xf-h .xf-n{display:inline-grid;place-items:center;width:1.6rem;height:1.6rem;border-radius:999px;flex:none;
  background:color-mix(in srgb,var(--accent,#0D5A60) 14%,transparent);color:var(--accent,#0D5A60);font-weight:700;font-size:.9rem}
html body .xf>.xf-h .xf-sub{margin-left:auto;color:var(--ink-3,#6b7785);font-size:.88rem}
html body .xf .fr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(11.5rem,1fr));gap:.6rem .8rem;align-items:end}
html body .xf .fr-grid .wide2{grid-column:span 2}
html body .xf .fr-grid .full{grid-column:1/-1}
html body .xf .fr-grid label{display:block;font-size:.88rem;color:var(--ink-2,inherit);margin-bottom:.2rem}
html body .xf .fr-grid input:not([type=checkbox]),html body .xf .fr-grid select{width:100%}
@media (max-width:640px){html body .xf .fr-grid .wide2{grid-column:1/-1}}

/* กรอบการชำระ */
html body .pf-scroll{overflow-x:auto}
html body .pf-table{width:100%;border-collapse:separate;border-spacing:0 .3rem;min-width:40rem}
html body .pf-table th{font-size:.86rem;text-align:left;padding:0 .35rem}
html body .pf-table th.num{text-align:right}
html body .pf-table td{padding:0 .35rem;vertical-align:middle}
html body .pf-table td input,html body .pf-table td select{width:100%}
html body .pf-table .combo{width:100%}
html body .pf-row[data-method=account] td:first-child select{border-color:color-mix(in srgb,var(--accent,#0D5A60) 45%,var(--rule,#d5dee4))}
html body .pf-hint{color:var(--ink-3,#6b7785);font-size:.86rem}
html body .pf-tools{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin:.35rem 0 .2rem}
html body .pf-sum{display:flex;gap:1.2rem;justify-content:flex-end;flex-wrap:wrap;margin-top:.45rem;font-size:.92rem}
html body .pf-sum div{display:flex;gap:.45rem;align-items:baseline}
html body .pf-sum b{font-variant-numeric:tabular-nums}
html body .pf-sum .pf-diff{color:var(--crit,#b42318)}
html body .pf-sum .pf-ok{color:var(--ok,#16794a)}

/* ---------- ไอคอนเมนูแบบโมเดิร์น นุ่ม มน (รอบ 8 ชุด E) ----------
   ไอคอนเมนูย่อยทุกโมดูลอยู่ในชิปมนสีจาง · เมนูที่เลือกอยู่ = ชิปสีหลัก ไอคอนขาว */
html body .modnav button svg,html body .navlist button svg{
  width:1.95rem;height:1.95rem;padding:.4rem;box-sizing:border-box;border-radius:.7rem;flex:none;
  background:color-mix(in srgb,var(--accent,#0D5A60) 9%,var(--surface,#fff));
  stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;transition:background .15s,color .15s
}
html body .modnav button:hover svg,html body .navlist button:hover svg{background:color-mix(in srgb,var(--accent,#0D5A60) 16%,var(--surface,#fff))}
html body .modnav button.on svg,html body .navlist button[aria-current="true"] svg{
  background:var(--accent,#0D5A60);color:var(--on-accent,#fff);box-shadow:0 3px 10px color-mix(in srgb,var(--accent,#0D5A60) 30%,transparent)
}
html body .modnav button,html body .navlist button{padding:.34rem .55rem;border-radius:.85rem}
/* การ์ดเมนูหน้าหลัก */
html body .tile .ic{width:2.9rem;height:2.9rem;padding:.6rem;box-sizing:border-box;border-radius:.95rem;
  background:color-mix(in srgb,var(--accent,#0D5A60) 10%,var(--surface,#fff))}
html body .tile .ic svg{stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
html body .tile.off .ic{background:var(--surface-2,#f1f4f5)}

/* ---------- ลูกหนี้/เจ้าหนี้ยกมา (รอบ 8 ชุด F) ---------- */
html body .po-cmp,html body .po-list{width:100%;border-collapse:collapse;font-size:.93rem}
html body .po-cmp th,html body .po-cmp td,html body .po-list th,html body .po-list td{padding:.4rem .5rem;border-bottom:1px solid var(--rule,#d5dee4);text-align:left}
html body .po-cmp .num,html body .po-list .num{text-align:right}
html body .po-cmp tr.po-bad td{background:color-mix(in srgb,var(--crit,#b42318) 8%,transparent);color:var(--crit,#b42318)}
html body .po-scroll{overflow-x:auto}
html body .po-list tfoot td{border-top:2px solid var(--rule,#d5dee4);border-bottom:0}
html body .po-list tr.po-edit input{width:100%;min-width:6rem}
html body .po-batches{margin:.2rem 0 0 1.1rem;padding:0;font-size:.92rem}
html body .po-note{display:block;padding:.6rem .8rem;border:1px solid var(--rule,#d5dee4);border-radius:var(--r-sm)}
html body .po-note.crit{border-color:color-mix(in srgb,var(--crit,#b42318) 40%,transparent);background:color-mix(in srgb,var(--crit,#b42318) 7%,transparent);color:var(--crit,#b42318)}
html body .po-note.ok{border-color:color-mix(in srgb,var(--ok,#16794a) 40%,transparent);background:color-mix(in srgb,var(--ok,#16794a) 7%,transparent);color:var(--ok,#16794a)}
/* เมนูรหัสบัญชีในกรอบการชำระ/เพิ่มรายการ: กว้างพอให้อ่านชื่อบัญชีได้ ไม่มีแถบเลื่อนแนวนอน */
html body .pf-table .combo-menu,html body .sale-addacc .combo-menu{min-width:max(100%,24rem);max-width:36rem;overflow-x:hidden}
html body .pf-table .combo-opt,html body .sale-addacc .combo-opt{white-space:normal;overflow-wrap:anywhere}

/* หน้าต่างเด้ง (เพิ่มผู้ขายระหว่างคีย์เอกสาร) */
html body .xmodal{position:fixed;inset:0;z-index:1000;background:rgba(15,23,32,.38);display:flex;align-items:flex-start;justify-content:center;
  padding:5vh 16px;overflow:auto;backdrop-filter:blur(2px)}
html body .xmodal-card{background:var(--paper,var(--surface,#fff));border-radius:var(--r-lg);box-shadow:0 18px 50px rgba(0,0,0,.22);
  width:min(62rem,100%);padding:.4rem .6rem .8rem}
html body .xmodal-card>div>.card{box-shadow:none;border:0;margin:0}
html body .notice-amend{border-color:color-mix(in srgb,var(--ok,#16794a) 40%,transparent);background:color-mix(in srgb,var(--ok,#16794a) 6%,var(--surface,#fff))}
html body .notice-lock{border-color:color-mix(in srgb,var(--warn,#b54708) 45%,transparent);background:color-mix(in srgb,var(--warn,#b54708) 7%,var(--surface,#fff))}
html body .draft-bar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;border-color:color-mix(in srgb,var(--accent,#0D5A60) 40%,transparent);
  background:color-mix(in srgb,var(--accent,#0D5A60) 6%,var(--surface,#fff))}
html body .draft-bar .grow{flex:1}
html body button.danger,html body .btn.danger{color:var(--crit,#b42318)}
html body button.danger:hover{background:color-mix(in srgb,var(--crit,#b42318) 9%,transparent)}
/* รอบ 8 ชุด I · ลิงก์เอกสาร + แถบกลับหน้าที่มา */
html body a.doc-link{color:var(--accent,#0D5A60);font-weight:600;text-decoration:none;border-bottom:1px dashed color-mix(in srgb,var(--accent,#0D5A60) 45%,transparent)}
html body a.doc-link:hover{border-bottom-style:solid}
html body .docnav-back{margin:0 0 .75rem}
html body .docnav-back a{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .85rem .4rem .6rem;border-radius:999px;
  background:color-mix(in srgb,var(--accent,#0D5A60) 10%,var(--card,#fff));color:var(--accent,#0D5A60);font-weight:600;text-decoration:none;
  border:1px solid color-mix(in srgb,var(--accent,#0D5A60) 30%,transparent);font-size:.95rem}
html body .docnav-back a:hover{background:color-mix(in srgb,var(--accent,#0D5A60) 18%,var(--card,#fff))}
html body .docnav-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
html body tr.docnav-hit td{background:color-mix(in srgb,#f59e0b 16%,transparent);transition:background .6s}

/* ---------- รอบ 10: โมเดิร์น มน อีกขั้น — หน้าเดิม (หนังสือรับรอง · ขาย/รับ · เงินเดือน) ให้หน้าตาเดียวกับโมดูลใหม่ ----------
   ตารางในแผงมนมุมล่าง (เดิมมุมเหลี่ยมเพราะกล่องเลื่อนตารางทับขอบแผง) · ปุ่ม/ป้ายสถานะแบบเม็ดยา · เงานุ่มขึ้น */
:root{--r-sm:.75rem;--r-md:1.15rem;--r-lg:1.4rem;
  --soft-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.06)}
html body .panel>.scroller:last-child,html body .panel>.body:last-child,html body .panel>table:last-child,
html body .panel>.scroller:last-child>table{border-bottom-left-radius:var(--r-md);border-bottom-right-radius:var(--r-md)}
html body .panel>.scroller{border:0;border-top:1px solid var(--rule-soft,var(--rule,#e3e8e6));border-radius:0}
html body .panel>.scroller:last-child{border-radius:0 0 var(--r-md) var(--r-md)}
html body :is(.panel,.card,.tile,.stats,.slip,.scroller){border-color:color-mix(in srgb,var(--rule,#d5dee4) 75%,transparent)}
html body .tile{border-radius:var(--r-md)}
html body .stats{border-radius:var(--r-md);overflow:hidden}
/* หัวตาราง: พื้นอ่อน ตัวหนา · แถวชี้แล้วเน้นอ่อน ๆ */
html body .panel table thead th{background:color-mix(in srgb,var(--accent,#0D5A60) 4%,var(--surface-2,#f4f6f5))}
html body .panel table tbody tr:hover td{background:color-mix(in srgb,var(--accent,#0D5A60) 4%,transparent)}
html body .panel table tbody tr:last-child td{border-bottom:0}
/* ช่องกรอก ตัวกรอง ปุ่ม */
html body .filters :is(select,input){min-height:2.5rem;border-radius:var(--r-sm)}
html body .btn,html body a.btn{border-radius:var(--r-sm)}
html body .sesbar button,html body .railfoot button{border-radius:999px;padding:.3rem .95rem;border:1px solid var(--rule,#d5dee4);background:var(--surface,#fff)}
html body .sesbar button:hover{background:color-mix(in srgb,var(--accent,#0D5A60) 8%,var(--surface,#fff))}
html body #localSaveStatus{border-radius:999px;padding:.35rem .9rem;box-shadow:var(--soft-shadow)}
html body .doctype,html body .formtag{border-radius:.6rem}
html body .stat,html body .pill{border-radius:999px}
/* ป้ายเวอร์ชันเก่าที่มุมซ้ายล่างทับเมนู (ตัวเลขค้าง r7) — ซ่อน */
html body [aria-label="เวอร์ชันโปรแกรม"]{display:none}

/* รอบ 11: หัวแถบซ้ายของหน้าขาย/รับ เงินเดือน หัก ณ ที่จ่าย (nav.rail) ให้หน้าตาเดียวกับหน้าบัญชี (.modnav)
   ชื่อบริษัท → ปุ่มภาษา → ☰ ทุกระบบ + ชิประบบ → เส้นคั่น → เมนู ระยะชิดเท่ากัน */
@media(min-width:861px){
  html body nav.rail{padding:1.1rem 0;gap:.15rem}
  html body nav.rail > .brand{padding:0 1.1rem;gap:0}
  html body nav.rail .brand b#brandCo{font:700 1.18rem/1.2 var(--display,inherit);letter-spacing:-.01em;margin:0 0 .15rem}
  html body nav.rail > .switcher{padding:0 1.1rem .75rem;margin:0 0 .35rem;gap:.28rem;border-bottom:1px solid var(--rule)}
  html body nav.rail > .switcher .swhome{padding:.1rem 0 .25rem}
  html body nav.rail > .switcher .swtab{padding:.2rem .55rem;line-height:1.4;font-weight:400}
  html body nav.rail > .switcher .swtab.here{font-weight:400}
  html body nav.rail > .navlist{padding:0 .55rem}
  html body nav.rail > .railfoot{margin-top:.6rem}
}
/* รอบ 12 แผนก/โปรเจค */
html body .dim-quick{width:min(26rem,100%);padding:1rem 1.1rem}
html body .dim-quick h3{margin:0 0 .7rem;font-size:1.05rem}
html body .dim-quick-row{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.6rem}
html body .dim-quick-row input{width:100%}
html body .dim-quick-msg{min-height:1.2em;color:var(--crit,#b42318);font-size:.85rem}
html body .dim-quick-btns{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.4rem}
html body .dim-field{display:flex;flex-direction:column;gap:.2rem;min-width:12rem}
html body .dim-field .req,html body .dim-quick .req{color:var(--crit,#b42318)}
html body td.dim-cell{min-width:9.5rem}
html body td.dim-cell .combo-q{min-width:8rem}
html body .dim-toggle{font-size:.82rem}
html body .dim-tag{display:inline-block;font-size:.72rem;padding:.05rem .4rem;border-radius:.6rem;margin-left:.3rem;white-space:nowrap;
  background:color-mix(in srgb,var(--accent,#0D5A60) 10%,transparent);color:var(--accent,#0D5A60)}
html body .dim-tag.d{background:color-mix(in srgb,var(--warn,#b54708) 10%,transparent);color:var(--warn,#b54708)}
html body .dim-hidecols .dim-cell{display:none}

/* รอบ 13: ช่องตัวเลขไม่มีลูกศรขึ้นลง (กดค้างแล้วตารางวาดใหม่ = เลขวิ่งไม่หยุด) · ใช้พิมพ์หรือปุ่มลูกศรบนคีย์บอร์ดแทน */
html body input[type=number]::-webkit-inner-spin-button,
html body input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
html body input[type=number]{-moz-appearance:textfield;appearance:textfield}