@font-face{font-family:CMHThai;src:url('../../assets/fonts/NotoSansThai-Regular.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:CMHThai;src:url('../../assets/fonts/NotoSansThai-SemiBold.ttf') format('truetype');font-weight:600 800;font-display:swap}
:root{--ink:#17282f;--muted:#60747c;--teal:#077d8e;--line:#d3dfe0;--paper:#f9fbfa;--red:#bd3449}*{box-sizing:border-box}body{margin:0;background:#eaf0ef;color:var(--ink);font:16px/1.65 CMHThai,system-ui,sans-serif}a{color:inherit}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button,.button{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--ink);background:transparent;color:var(--ink);padding:11px 19px;text-decoration:none;min-height:46px;transition:background .16s,color .16s}button:hover,.button:hover{background:#dce7e7}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--teal);border-color:var(--teal);color:white}.primary:hover{background:#055d6b;color:white}.danger{background:var(--red);border-color:var(--red);color:#fff}.small{padding:6px 12px;min-height:38px;font-size:14px}.text-button{border:0;padding:3px;min-height:32px;color:inherit}.required{color:var(--red)}:focus-visible{outline:3px solid #22b7ca;outline-offset:3px}.skip{position:fixed;left:12px;top:-100px;z-index:100;padding:12px;background:white}.skip:focus{top:12px}.sidebar{width:265px;position:fixed;inset:0 auto 0 0;background:#172328;color:#dbe9e9;padding:28px 22px;display:flex;flex-direction:column;overflow-y:auto;z-index:20}.brand{display:flex;gap:14px;align-items:center;text-decoration:none;letter-spacing:.06em;font-size:16px;font-weight:700;margin-bottom:34px;line-height:1.4}.brand-cross{font-size:43px;font-weight:700;color:#20adc0;line-height:1}.brand small{display:block;font-size:12px;font-weight:400;letter-spacing:0;margin-top:4px;color:#869da4}.sidebar nav a{display:flex;justify-content:space-between;text-decoration:none;border-bottom:1px solid #34464d;padding:12px 4px;font-size:15px}.sidebar nav a:hover,.sidebar nav a[aria-current]{color:#fff;border-color:#25b6c6}.sidebar nav span{font-size:13px;color:#7ca8b2}.identity{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:auto;padding-top:26px}.identity a{text-decoration:none}.identity small{display:block;color:#a0b7bc;font-size:12px}.portal-link{font-size:12px;margin-top:20px;color:#a4b9bf}.main-shell{margin-left:265px}.topbar{background:var(--paper);padding:28px 42px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line)}h1,h2,h3,p{margin-top:0}h1{font-size:34px;margin-bottom:0;line-height:1.5}h2{font-size:25px;line-height:1.6;margin-bottom:14px}h3{font-size:19px}.eyebrow{font-size:11px;letter-spacing:.17em;color:var(--teal);margin-bottom:6px}.scope{font-size:12px;color:var(--muted)}.content{padding:35px 42px 60px;max-width:1700px}.menu-toggle{display:none}.toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:0 0 24px}.toolbar h2{margin:0}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.section{border-top:2px solid var(--ink);padding:28px;background:var(--paper);margin-bottom:28px}.section>p,.muted,small{color:var(--muted)}.notice{background:#dfefee;border-left:3px solid var(--teal);padding:16px 20px;margin-bottom:24px;overflow-wrap:anywhere}.notice-error{background:#fce7e9;border-color:var(--red)}.warning{background:#fff3cd;border-left:3px solid #bf9223;padding:16px 20px;margin-bottom:22px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.full{grid-column:1/-1}label{display:block;font-size:14px;color:var(--muted)}input,select,textarea{display:block;width:100%;border:1px solid #bfcfd1;background:#fff;color:var(--ink);padding:11px 13px;min-height:47px;border-radius:0;margin-top:6px}textarea{resize:vertical}input[type=checkbox]{width:20px;min-height:20px;display:inline-block;margin-right:8px;vertical-align:middle}.check{display:flex;align-items:center;gap:8px}.form-actions{display:flex;justify-content:flex-end;gap:12px;border-top:1px solid var(--line);padding-top:22px;margin-top:24px;flex-wrap:wrap}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}th{text-align:left;font-weight:400;color:var(--muted);font-size:12px;border-top:2px solid var(--ink);padding:15px 14px;white-space:nowrap}td{padding:18px 14px;border-bottom:1px solid var(--line);background:var(--paper);vertical-align:top;overflow-wrap:anywhere}td small{display:block;line-height:1.6;margin-top:4px}.empty{text-align:center;color:var(--muted);padding:45px}.status{display:inline-block;font-size:12px;padding:4px 10px;background:#e5ebed;white-space:nowrap}.status-confirmed,.status-completed{background:#d8eee5;color:#24634b}.status-departing,.status-picked_up,.status-delivered{background:#daf1f4;color:#076b7a}.status-cancelled,.status-rejected{background:#f4e0e2;color:#943847}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--ink);border-bottom:1px solid var(--line);margin-bottom:35px}.metrics>div{padding:22px;border-right:1px solid var(--line)}.metrics strong{display:block;font-size:43px;font-weight:600}.metrics small{font-size:13px}.filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:20px 0}.filters label{flex:1;min-width:150px}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.detail-grid dt{font-size:12px;color:var(--muted)}.detail-grid dd{margin:3px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}.timeline{padding-left:20px}.timeline li{padding:0 0 20px 12px;border-left:1px solid #aec6c8}.timeline small{display:block}.auth-page{min-height:100svh;display:grid;place-items:center;background:#e8efee}.auth-shell{width:min(540px,calc(100% - 32px));padding:42px;background:var(--paper);border-top:4px solid var(--teal);margin:25px 0}.auth-shell h1{font-size:28px;margin-bottom:18px}.auth-shell label{margin:18px 0}.auth-shell .primary{width:100%;margin-top:12px}.auth-shell p{font-size:14px;color:var(--muted)}dialog{border:0;border-top:4px solid var(--teal);padding:0;width:min(850px,calc(100vw - 28px));max-height:calc(100dvh - 36px);color:var(--ink);background:var(--paper);box-shadow:0 20px 90px #0005}dialog::backdrop{background:#0b171d99}dialog[open]{display:flex;flex-direction:column;animation:dialog-in .16s ease-out}.dialog-header{display:flex;align-items:flex-start;gap:20px;padding:22px 28px;border-bottom:1px solid var(--line);flex:none}.dialog-header h2{margin:0;min-width:0}.close{margin-left:auto;flex:none;font:32px/1 system-ui;border:0;padding:4px;min-width:40px;min-height:40px;color:#657a7c}.dialog-body{overflow-y:auto;padding:26px 28px;min-height:0;overscroll-behavior:contain}.calendar{width:100%;min-width:600px}.calendar th{border-top:0}.calendar td{height:100px;width:14.28%;padding:8px;border:1px solid var(--line)}.calendar td a{display:block;font-size:11px;text-decoration:none;border-left:3px solid var(--teal);padding:4px;background:#e3f0f0;margin:5px 0}.calendar .other{background:#e8eeed}.calendar-day{font-size:13px;font-weight:600}.nowrap{white-space:nowrap}.pagination-note{font-size:12px;color:var(--muted);margin-top:14px}@keyframes dialog-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media(max-width:1050px){.sidebar{width:220px;padding:22px 16px}.main-shell{margin-left:220px}.topbar{padding:24px}.content{padding:25px}.scope{display:none}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:transform .18s;box-shadow:15px 0 60px #0003}.sidebar.open{transform:none}.main-shell{margin-left:0}.menu-toggle{display:inline-flex;font-size:13px;padding:7px 10px;min-height:38px}.topbar{padding:18px;justify-content:flex-start}h1{font-size:25px}.eyebrow{font-size:9px}.content{padding:22px 16px}.section{padding:20px 16px}.form-grid,.detail-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.metrics strong{font-size:34px}.metrics>div{padding:16px}.auth-shell{padding:28px 24px}.dialog-header,.dialog-body{padding:18px}.dialog-header h2{font-size:22px}.form-actions button{flex:1}.actions .button,.actions button{font-size:13px}.filters button{width:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
