/* LINKS — ทุกคลาสอยู่ใต้ .lk เพื่อไม่ชนกับ CSS ของระบบเดิม */
:root{
  --lk-bg:#F7F8FB;--lk-surface:#FFFFFF;--lk-ink:#0E2240;--lk-ink2:#2C4A75;--lk-muted:#475467;
  --lk-line:#EAECF0;--lk-line2:#E3E7EF;--lk-primary:#1B3A6B;--lk-primary-d:#0F2447;--lk-primary-bg:#E9EEF7;
  --lk-accent:#E8A317;--lk-new:#8A5A00;--lk-new-bg:#FDF4DE;--lk-new-line:#F2DBA0;--lk-ok:#1E6B45;--lk-dark:#0E2240;
  --lk-shadow:0 1px 2px rgba(16,24,40,.04),0 12px 32px rgba(16,24,40,.06);
}
*{box-sizing:border-box}
body.lk{margin:0;background:var(--lk-bg);color:var(--lk-ink);font-family:'Sarabun',system-ui,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}
.lk a{color:var(--lk-primary)}.lk a:hover{color:var(--lk-primary-d)}
.lk .hd,.lk h1,.lk h2,.lk h3,.lk th,.lk button{font-family:'Prompt',system-ui,sans-serif}
.lk h1{margin:0;font-size:30px;font-weight:600;line-height:1.35}
.lk h2{margin:0;font-size:22px;font-weight:600}
.lk h3{margin:0;font-size:17px;font-weight:600}
.lk .muted{color:var(--lk-muted)}
.lk .small{font-size:14px}

/* layout — THEME_20261006 เมนูด้านบน */
.lk-wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px;width:100%}
.lk-shell{display:flex;flex-direction:column}
.lk-hdr{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--lk-line)}
.lk-hdr-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;padding-bottom:12px}
.lk-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--lk-ink)!important}
.lk-crest{width:46px;height:46px;border-radius:50%;box-shadow:0 0 0 3px #fff,0 0 0 4px #E3D3A3}
.lk-nav{display:flex;flex-wrap:wrap;gap:2px}
.lk-navlink{color:var(--lk-ink2)!important;text-decoration:none;font-family:'Prompt',sans-serif;font-size:15px;padding:8px 12px;border-radius:10px}
.lk-navlink:hover{background:#F2F4F7;color:var(--lk-ink)!important}
.lk-navlink.on{color:var(--lk-ink)!important;font-weight:600;box-shadow:inset 0 -2px 0 var(--lk-accent);border-radius:0}
.lk-only-m{display:none}
.lk-hdr-r{display:flex;align-items:center;gap:10px}
.lk-out{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;color:#B42318!important;border:1px solid var(--lk-line);background:#fff;font-size:16px}
.lk-band{background:#fff;border-bottom:1px solid var(--lk-line)}
.lk-band-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;padding-top:14px;padding-bottom:14px}
.lk-band-t{display:flex;align-items:center;gap:12px}
.lk-badge{width:44px;height:40px;border-radius:12px;background:var(--lk-dark);color:#F6CD6B;display:flex;align-items:center;justify-content:center;font-family:'Prompt';font-weight:700;font-size:12px;letter-spacing:.5px}
.lk-subnav{display:flex;flex-wrap:wrap;gap:6px}
.lk-subnav a{font-family:'Prompt',sans-serif;text-decoration:none;color:var(--lk-ink2)!important;padding:8px 16px;border-radius:999px;font-size:15px;background:#fff;border:1px solid var(--lk-line)}
.lk-subnav a:hover{background:#F2F4F7}
.lk-subnav a.on{background:var(--lk-dark);color:#fff!important;border-color:var(--lk-dark)}
.lk-tools{display:flex;align-items:center;gap:8px}
.lk-search{display:flex;align-items:center;gap:8px;background:#F2F4F7;border-radius:14px;padding:8px 12px;width:220px;color:#667085;position:relative}
.lk-search input{border:0;background:transparent;font:inherit;font-size:15px;outline:none;flex:1;min-width:0}
.lk-results{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#fff;border:1px solid var(--lk-line);border-radius:14px;box-shadow:var(--lk-shadow);padding:6px;display:none;max-height:320px;overflow:auto;z-index:40}
.lk-results a{display:block;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--lk-ink)}
.lk-results a:hover{background:#F2F4F7}
.lk-avatar{width:40px;height:40px;border-radius:50%;background:var(--lk-primary-bg);color:var(--lk-primary);display:flex;align-items:center;justify-content:center;font-family:'Prompt';font-weight:600;font-size:14px}
.lk-iconbtn{width:40px;height:40px;border-radius:12px;border:1px solid var(--lk-line);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#475467;position:relative}
.lk-dot{position:absolute;top:6px;right:6px;min-width:16px;height:16px;border-radius:8px;background:var(--lk-accent);color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.lk-main{min-width:0}
.lk-content{padding-top:32px;padding-bottom:72px;display:flex;flex-direction:column;gap:28px}
.lk-menu-toggle{display:none}

/* components */
.lk .card{background:#fff;border:1px solid var(--lk-line);border-radius:24px;box-shadow:var(--lk-shadow);padding:20px 22px}
.lk a.card{text-decoration:none;color:var(--lk-ink);transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column;gap:6px}
.lk a.card:hover{transform:translateY(-2px);box-shadow:0 2px 4px rgba(16,24,40,.06),0 16px 36px rgba(16,24,40,.10)}
.lk .grid{display:grid;gap:12px}
.lk .g4{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.lk .g3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.lk .g2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.lk .g5{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.lk .stack{display:flex;flex-direction:column;gap:10px}
.lk .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.lk .between{justify-content:space-between}
.lk .kpi{font-family:'Prompt';font-size:28px;font-weight:600}
.lk .tag{display:inline-block;font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;align-self:flex-start}
.lk .tag-new{background:var(--lk-new-bg);color:var(--lk-new);border:1px solid var(--lk-new-line)}
.lk .tag-old{background:var(--lk-primary-bg);color:var(--lk-primary);border:1px solid #C9D6EC}
.lk .tag-ok{background:#ECFDF3;color:#067647;border:1px solid #ABEFC6}
.lk .tag-wait{background:#FFFAEB;color:#B54708;border:1px solid #FEDF89}
.lk .tag-none{background:#F2F4F7;color:#475467;border:1px solid #E4E7EC}
.lk .step{font-family:'Prompt';font-size:20px;font-weight:600;color:#fff;background:var(--lk-primary);width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center}
.lk .hero{background:var(--lk-dark);color:#fff;padding:40px 32px;border-radius:24px;display:flex;flex-direction:column;gap:14px}
.lk .hero p{color:#C8D0DF;margin:0;font-size:17px;line-height:1.7;max-width:800px}
.lk .hero .stat{background:#183257;border:1px solid #2C4A75;border-radius:16px;padding:16px}
.lk .hero .stat .kpi{font-size:26px}
.lk .hero .stat div:last-child{color:#C8D0DF;font-size:14px}
.lk .pill{align-self:flex-start;background:var(--lk-accent);color:#fff;border-radius:999px;padding:5px 14px;font-size:13px;font-weight:600}
.lk .note{background:#E9EEF7;border:1px solid #C9D6EC;border-radius:16px;padding:14px 18px;font-size:15px;line-height:1.6}
.lk .soft{background:#F4F6FA;border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:6px;line-height:1.6}

/* table */
.lk .tbl{overflow-x:auto;background:#fff;border:1px solid var(--lk-line);border-radius:16px;box-shadow:var(--lk-shadow)}
.lk table{width:100%;border-collapse:collapse;font-size:15px}
.lk th{background:#F8FAFC;font-weight:500;font-size:14px;color:#475467;text-align:left;padding:12px 14px;white-space:nowrap}
.lk td{padding:12px 14px;border-top:1px solid var(--lk-line2);vertical-align:top}
.lk td.num,.lk th.num{text-align:right;font-variant-numeric:tabular-nums}

/* forms */
.lk .fld{display:flex;flex-direction:column;gap:6px;font-size:15px;font-weight:500}
.lk .in,.lk select,.lk textarea,.lk input[type=text],.lk input[type=url],.lk input[type=date],.lk input[type=number]{font:inherit;font-weight:400;font-size:15px;padding:10px 12px;border:1px solid #D0D5DD;border-radius:12px;background:#fff;color:var(--lk-ink);width:100%}
.lk .in:focus,.lk select:focus,.lk textarea:focus,.lk input:focus{outline:3px solid #BFD0EA;border-color:var(--lk-primary)}
.lk .err{color:#B42318;font-size:14px;font-weight:400}
.lk .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--lk-primary);color:#fff!important;border:0;border-radius:14px;padding:11px 18px;font-size:15px;font-weight:500;font-family:'Prompt',sans-serif;cursor:pointer;text-decoration:none;align-self:flex-start}
.lk .btn:hover{background:var(--lk-primary-d)}
.lk .btn.ghost{background:#fff;color:var(--lk-ink)!important;border:1px solid #D0D5DD}
.lk .btn.ghost:hover{background:#F9FAFB}
.lk .btn.ghost-soft{background:#F2F4F7;color:var(--lk-ink)!important;padding:10px 16px}
.lk .btn.ghost-soft:hover{background:#EAECF0}
.lk .btn.gold{background:var(--lk-accent)}.lk .btn.gold:hover{background:#C98A0C}
.lk .btn.danger{background:#fff;color:#B42318!important;border:1px solid #FDA29B}
.lk .btn.sm{padding:6px 12px;font-size:14px}
.lk .seg{display:inline-flex;border:1px solid #D0D5DD;border-radius:10px;overflow:hidden}
.lk .seg label{padding:7px 12px;font-size:14px;cursor:pointer;border-left:1px solid #D0D5DD;font-weight:400}
.lk .seg label:first-child{border-left:0}
.lk .seg input{position:absolute;opacity:0;pointer-events:none}
.lk .seg input:checked+span{color:var(--lk-primary);font-weight:600}
.lk .seg label:has(input:checked){background:var(--lk-primary-bg)}

/* bars */
.lk .bar{height:10px;border-radius:999px;background:#F2F4F7;position:relative;overflow:hidden}
.lk .bar i{position:absolute;left:0;top:0;bottom:0;border-radius:999px}

/* dialog */
.lk dialog{border:0;border-radius:20px;padding:0;max-width:640px;width:calc(100% - 32px);box-shadow:0 24px 64px rgba(16,24,40,.25)}
.lk dialog::backdrop{background:rgba(16,24,40,.45)}
.lk dialog form{padding:22px;display:flex;flex-direction:column;gap:14px}
.lk-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--lk-dark);color:#fff;padding:12px 18px;border-radius:12px;z-index:100;font-size:15px;box-shadow:var(--lk-shadow)}
.lk .demo{background:#FFFAEB;border:1px solid #FEDF89;color:#93370D;border-radius:12px;padding:8px 12px;font-size:14px}
.lk .empty{border:2px dashed #D0D5DD;border-radius:16px;padding:22px;text-align:center;color:var(--lk-muted)}

@media (max-width:960px){
  .lk-menu-toggle{display:flex;margin-left:auto}
  .lk-nav{display:none;order:5;flex:1 1 100%;flex-direction:column}
  .lk-nav.open{display:flex}
  .lk-only-m{display:block}
  .lk-hdr-r .btn,.lk-out{display:none}
  .lk-tools{flex:1 1 100%}
  .lk-search{flex:1;width:auto}
}
@media (max-width:640px){
  .lk-wrap{padding-left:16px;padding-right:16px}
  .lk-content{padding-top:20px;padding-bottom:40px}
  .lk-subnav{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:2px}
  .lk-subnav a{white-space:nowrap}
  .lk-tools label{min-width:0}
  .lk-tools select{min-width:0;max-width:150px}
  .lk-tools{flex-wrap:wrap}
  .lk-tools>label:not(.lk-search){flex:1 1 100%}
  .lk-tools>label .muted{display:none}
  .lk-tools select{max-width:none;width:100%}
  .lk .g4,.lk .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lk .kpi{font-size:24px}
  .lk .hero{padding:28px 20px}
  .lk h1{font-size:25px}
}
@media print{.lk-hdr,.lk-band,.lk .btn{display:none!important}.lk-content{padding:0}}