@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&display=swap";:root{--paper:#f7f5ef;--panel:#fffdfa;--panel-strong:#f1ede3;--ink:#1e2528;--muted:#69747a;--line:#ddd7ca;--teal:#007c76;--teal-dark:#005d59;--teal-soft:#dff2ee;--amber:#bd7312;--amber-soft:#fff0c9;--red:#b83232;--red-soft:#ffe2de;--blue:#2d5b9a;--blue-soft:#dce9ff;--green:#237a43;--green-soft:#daf1df;--shadow:0 14px 34px #30261814;--radius:8px;color:var(--ink);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:IBM Plex Sans Thai,Tahoma,sans-serif;line-height:1.45}*{box-sizing:border-box}body{background:linear-gradient(90deg, #007c760d 1px, transparent 1px), linear-gradient(180deg, #bd73120d 1px, transparent 1px), var(--paper);background-size:32px 32px;min-width:320px;margin:0}button,input,select{font:inherit}button{border:1px solid var(--line);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:8px 12px;font-weight:700;transition:background .16s,border-color .16s,color .16s,transform .16s;display:inline-flex}button:hover:not(:disabled){transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.45}input,select{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:6px;outline:none;width:100%;min-height:42px;padding:8px 11px}input:focus,select:focus,button:focus-visible{border-color:var(--teal);outline:none;box-shadow:0 0 0 3px #007c7629}.shell{max-width:1440px;min-height:100vh;margin:0 auto;padding:24px}.app-header{grid-template-columns:minmax(260px,1fr) minmax(420px,.95fr);align-items:end;gap:20px;margin-bottom:18px;display:grid}.eyebrow{color:var(--teal-dark);letter-spacing:0;text-transform:uppercase;margin:0 0 4px;font-size:13px;font-weight:700}h1,h2,p{margin:0}h1{font-size:clamp(28px,4vw,48px);line-height:1.05}h2{font-size:18px;line-height:1.25}h3{margin:0;font-size:15px;line-height:1.25}.header-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.metric{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fffdfae6;grid-template-columns:auto 1fr;gap:2px;padding:12px;display:grid}.metric svg{color:var(--teal);grid-row:span 2}.metric span{color:var(--muted);font-size:12px;font-weight:600}.metric strong{font-size:19px;line-height:1.15}.role-nav{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);z-index:10;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:16px;padding:8px;display:grid;position:sticky;top:12px}.role-tab{color:var(--muted);background:0 0}.role-tab.active{background:var(--teal);border-color:var(--teal);color:#fff}.workspace{gap:16px;display:grid}.two-col{grid-template-columns:minmax(320px,.9fr) minmax(360px,1.1fr)}.order-layout{grid-template-columns:minmax(420px,1fr) minmax(360px,460px);align-items:start}.shop-layout{grid-template-columns:minmax(420px,1.05fr) minmax(360px,.95fr);align-items:start}.coordinator-layout{grid-template-columns:minmax(520px,1.2fr) minmax(330px,.8fr);align-items:start}.stack{gap:16px;display:grid}.panel{border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);background:#fffdfaf5;min-width:0;padding:16px}.panel-title{align-items:center;gap:9px;margin-bottom:14px;display:flex}.panel-title svg{color:var(--teal)}.panel-note{background:var(--teal-soft);color:var(--teal-dark);border:1px solid #007c762e;border-radius:6px;margin-bottom:12px;padding:10px 12px;font-size:13px;font-weight:800}.field{gap:6px;display:grid}.field span{color:var(--muted);font-size:13px;font-weight:700}.field.compact{min-width:170px}.input-with-icon{position:relative}.input-with-icon svg{color:var(--muted);position:absolute;top:12px;left:12px}.input-with-icon input{padding-left:40px}.patient-strip{background:var(--amber-soft);border-radius:var(--radius);border:1px solid #bd731247;justify-content:space-between;align-items:center;min-height:74px;margin-top:12px;padding:12px;display:flex}.patient-strip.found{background:var(--teal-soft);border-color:#007c7638}.patient-strip div:first-child,.cart-row div:first-child,.order-card-head div,.stock-row div,.patient-row div,.service-row div,.ledger-row div{gap:2px;display:grid}.patient-strip span,.cart-row span,.order-card-head span,.stock-row span,.patient-row span,.service-row span,.ledger-row span,.settlement-box small{color:var(--muted);font-size:13px}.balance-pill{background:var(--ink);color:#fff;white-space:nowrap;border-radius:999px;padding:8px 12px;font-weight:800}.amount-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px;display:grid}.amount-grid button,.secondary{background:var(--panel-strong);color:var(--ink)}.button-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px;display:grid}.primary,.pay-button{background:var(--teal);border-color:var(--teal);color:#fff}.primary:hover:not(:disabled),.pay-button:hover:not(:disabled){background:var(--teal-dark)}.danger-soft{background:var(--red-soft);color:var(--red);border-color:#b832324d;width:100%}.out-all{color:var(--teal-dark);border-color:#007c7647}.balance-board{background:linear-gradient(135deg, #007c761a, transparent 52%), var(--panel)}.balance-rows{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.balance-rows div,.payment-summary div{border-bottom:1px solid var(--line);background:#ffffffa3;justify-content:space-between;align-items:center;gap:12px;padding:12px;display:flex}.balance-rows div:last-child,.payment-summary div:last-child{border-bottom:0}.balance-rows .settlement-total{background:var(--ink);color:#fff}.balance-rows .settlement-total span{color:#ffffffb8}.balance-rows span,.payment-summary span{color:var(--muted);font-weight:700}.service-charge{grid-template-columns:1fr auto;gap:10px;margin-top:14px;display:grid}.medical-service-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.medical-service-item{text-align:left;background:#fff;justify-content:stretch;align-items:start;gap:3px;min-height:92px;padding:11px;display:grid}.medical-service-item.active{background:var(--red-soft);color:var(--red);border-color:#b8323257}.medical-service-item span{color:var(--ink);font-weight:800}.medical-service-item strong{color:var(--teal-dark);font-size:17px}.medical-service-item small{color:var(--muted);font-size:12px;line-height:1.35}.ledger-list,.order-list,.stock-list,.patient-table,.service-list,.cart-list{gap:10px;display:grid}.ledger-row,.service-row{border:1px solid var(--line);border-radius:6px;justify-content:space-between;align-items:center;padding:11px;display:flex}.positive{color:var(--green)}.negative{color:var(--red)}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.product-tile{text-align:left;background:#fff;justify-content:start;align-items:stretch;gap:4px;min-height:118px;padding:12px;display:grid}.product-tile span{color:var(--blue);font-size:12px;font-weight:800}.product-tile strong{font-size:16px;line-height:1.25}.product-tile small{color:var(--muted);align-self:end;font-size:12px}.checkout-panel{position:sticky;top:92px}.cart-row{border-bottom:1px solid var(--line);grid-template-columns:1fr auto auto;align-items:center;gap:10px;padding:10px 0;display:grid}.stepper{grid-template-columns:34px 54px 34px;align-items:center;display:grid}.stepper button{background:var(--panel-strong);min-height:34px;padding:0}.stepper input{text-align:center;border-left:0;border-right:0;border-radius:0;min-height:34px;padding:4px}.payment-summary{border:1px solid var(--line);border-radius:var(--radius);margin:14px 0 10px;overflow:hidden}.limit-note{background:var(--blue-soft);color:var(--blue);border:1px solid #2d5b9a33;border-radius:6px;margin-bottom:10px;padding:9px 11px;font-size:13px;font-weight:800}.status-alert{border-radius:6px;align-items:center;gap:8px;margin-bottom:10px;padding:10px 12px;font-weight:800;display:flex}.status-alert.ok{background:var(--green-soft);color:var(--green)}.status-alert.warning{background:var(--amber-soft);color:var(--amber)}.status-alert.danger{background:var(--red-soft);color:var(--red)}.pay-button{width:100%;min-height:52px;font-size:17px}.order-card{border:1px solid var(--line);border-left:5px solid var(--teal);border-radius:var(--radius);background:#fff;gap:10px;padding:14px;display:grid}.order-card-head,.order-actions,.delivery-line,.stock-row,.patient-row{align-items:center;gap:10px;display:flex}.order-card-head,.order-actions{justify-content:space-between}.delivery-line{color:var(--blue);font-weight:800}.order-items{border:1px solid var(--line);border-radius:6px;margin:0;padding:0;list-style:none}.order-items li{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:8px 10px;display:flex}.order-items li:last-child{border-bottom:0}.status-badge{white-space:nowrap;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}.status-badge.new{background:var(--amber-soft);color:var(--amber)}.status-badge.packing{background:var(--blue-soft);color:var(--blue)}.status-badge.delivered{background:var(--green-soft);color:var(--green)}.stock-row{border:1px solid var(--line);background:#fff;border-radius:6px;grid-template-columns:minmax(150px,1fr) minmax(90px,160px) 46px 58px;padding:10px;display:grid}meter{width:100%;height:16px}.analytics-toggle-panel{justify-content:space-between;align-items:center;gap:12px;display:flex}.analytics-toggle-panel>div{gap:2px;display:grid}.analytics-toggle-panel span{color:var(--muted);font-size:13px;font-weight:700}.analytics-panel{background:linear-gradient(135deg,#2d5b9a1a,#0000 48%),#fffdfafa}.analytics-metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px;display:grid}.analytics-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.analytics-block{border:1px solid var(--line);border-radius:var(--radius);background:#fff;gap:10px;min-width:0;padding:12px;display:grid}.analytics-block h3{color:var(--ink)}.warning-block{background:var(--amber-soft);border-color:#bd73123d}.status-split{flex-wrap:wrap;align-items:start;gap:8px;display:flex}.rank-list{gap:7px;display:grid}.rank-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:10px;padding-bottom:7px;display:flex}.rank-row:last-child{border-bottom:0;padding-bottom:0}.rank-row div{gap:1px;min-width:0;display:grid}.rank-row span{color:var(--muted);font-size:12px}.rank-row strong:first-child{overflow-wrap:anywhere}.rank-row>strong{white-space:nowrap}.compact-empty{padding:10px}.toolbar{align-items:end;gap:10px;margin-bottom:12px;display:flex}.search-field{flex:1}.patient-row{border:1px solid var(--line);background:#fff;border-radius:6px;grid-template-columns:minmax(180px,1fr) 80px minmax(160px,220px) minmax(90px,auto);padding:10px;display:grid}.settlement-box{background:var(--ink);border-radius:var(--radius);color:#fff;gap:4px;margin-bottom:12px;padding:16px;display:grid}.settlement-box span{color:#ffffffb8;font-weight:700}.settlement-box strong{font-size:32px}.settlement-box small{color:#ffffffb8}.empty-state{background:var(--panel-strong);border:1px dashed var(--line);color:var(--muted);text-align:center;border-radius:6px;padding:16px;font-weight:700}.modal-backdrop{z-index:100;background:#1e25287a;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);gap:14px;width:min(100%,560px);max-width:560px;max-height:calc(100vh - 40px);padding:18px;display:grid;overflow:auto;box-shadow:0 24px 72px #1e252847}.modal-head{justify-content:space-between;align-items:start;gap:12px;display:flex}.icon-button{background:var(--panel-strong);border-radius:50%;width:38px;height:38px;min-height:38px;padding:0;font-size:24px;font-weight:700;line-height:1}.modal-message{color:var(--muted);font-weight:700}.modal-rows{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.modal-row{border-bottom:1px solid var(--line);background:#fff;grid-template-columns:minmax(130px,.8fr) minmax(160px,1fr);justify-content:space-between;align-items:start;gap:12px;padding:11px 12px;display:grid}.modal-row:last-child{border-bottom:0}.modal-row span{color:var(--muted);font-weight:800}.modal-row strong{overflow-wrap:anywhere;text-align:right}.modal-actions{justify-content:end;gap:10px;display:flex}@media (width<=1120px){.app-header,.two-col,.order-layout,.shop-layout,.coordinator-layout{grid-template-columns:1fr}.analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.checkout-panel{position:static}}@media (width<=760px){.shell{padding:14px}.header-metrics,.analytics-metrics,.analytics-grid,.role-nav,.product-grid,.medical-service-list,.amount-grid,.button-row,.service-charge{grid-template-columns:1fr}.role-nav{position:static}.role-tab{justify-content:flex-start}.cart-row,.stock-row,.patient-row{grid-template-columns:1fr;align-items:stretch}.toolbar,.analytics-toggle-panel,.patient-strip,.order-actions,.modal-actions{flex-direction:column;align-items:stretch}.patient-strip{gap:10px}.modal-row{grid-template-columns:1fr}.modal-row strong{text-align:left}}
