*{box-sizing:border-box}body{margin:0;font-family:Tahoma,"Noto Sans Thai",sans-serif;background:#f4f6f8;color:#1f2937}
:root{--nav:#172033;--gold:#c59a55;--green:#15803d;--red:#b91c1c;--blue:#2563eb;--line:#e5e7eb}
.sidebar{position:fixed;left:0;top:0;bottom:0;width:235px;background:var(--nav);color:#fff;padding:24px 16px}.logo{font-size:22px;font-weight:700;margin:0 8px 28px}.logo b{color:var(--gold)}.logo small{display:block;font-size:12px;font-weight:400;opacity:.65;margin-top:5px}.sidebar nav{display:grid;gap:7px}.sidebar a{color:#dbe3ef;text-decoration:none;padding:12px;border-radius:9px}.sidebar a:hover{background:#24314b;color:#fff}.main{margin-left:235px;min-height:100vh}.top{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 28px}.content{padding:28px;max-width:1450px}.head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:20px}.head h1{margin:0;font-size:28px}.head p{margin:6px 0 0;color:#6b7280}.actions,.between{display:flex;gap:9px;align-items:center;justify-content:space-between}.btn{border:1px solid #d1d5db;background:white;color:#263041;text-decoration:none;border-radius:8px;padding:10px 14px;cursor:pointer}.btn.primary{background:var(--nav);color:#fff;border-color:var(--nav)}.btn.small{padding:6px 9px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.card,.panel{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 5px 18px rgba(15,23,42,.04)}.card{padding:20px;border-top:4px solid}.card span{color:#6b7280}.card b{display:block;font-size:25px;margin-top:10px}.green{border-color:var(--green)}.red{border-color:var(--red)}.gold{border-color:var(--gold)}.blue{border-color:var(--blue)}.grid2{display:grid;grid-template-columns:1fr 1.35fr;gap:18px;margin-bottom:18px}.panel{padding:18px;margin-bottom:18px;overflow:hidden}.panel-title{margin:-18px -18px 15px;padding:16px 18px;border-bottom:1px solid var(--line)}.panel-title h2{margin:0;font-size:18px}.panel-title small{color:#6b7280}.stats{display:grid;gap:12px}.stats div{display:flex;justify-content:space-between;border-bottom:1px solid #eee;padding:10px 0}.chart{display:grid;gap:8px}.bar-row{display:grid;grid-template-columns:24px 1fr 150px;gap:8px;align-items:center;font-size:12px}.bars{display:grid;gap:3px}.bar{height:7px;border-radius:99px;display:block}.bar.inc{background:#22c55e}.bar.exp{background:#ef4444}table{width:100%;border-collapse:collapse}th,td{padding:11px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{font-size:12px;color:#6b7280;background:#fafafa}.right{text-align:right}.nowrap{white-space:nowrap}.pill{font-size:11px;border-radius:99px;padding:5px 8px}.pill.income{background:#dcfce7;color:#166534}.pill.expense{background:#fee2e2;color:#991b1b}.income{color:#166534}.expense{color:#991b1b}.empty{text-align:center;color:#6b7280;padding:30px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-stack{display:grid;gap:14px;align-content:start}.full{grid-column:1/-1}label{font-weight:700;font-size:13px}input,select,textarea{width:100%;padding:11px;border:1px solid #d1d5db;border-radius:8px;background:#fff;font:inherit;margin-top:6px}textarea{min-height:85px}.form-actions{display:flex;justify-content:flex-end;gap:9px}.inline{display:inline}.inline-edit{display:flex;gap:6px}.inline-edit input{margin:0}.inline-edit button,.link-danger{border:0;background:none;color:#b91c1c;cursor:pointer}.inline-edit button{color:#2563eb}.item-row{display:grid;grid-template-columns:3fr .8fr 1fr 1.2fr;gap:8px;margin-bottom:8px}.flash{padding:12px 14px;border-radius:9px;margin-bottom:15px}.flash.success{background:#dcfce7;color:#166534}.flash.error{background:#fee2e2;color:#991b1b}small{display:block;color:#6b7280;margin-top:4px}.print-bg{background:#d1d5db}.print-tools{width:210mm;margin:14px auto;text-align:right}.print-tools button{padding:10px 14px}.a4{width:210mm;min-height:297mm;margin:auto;background:#fff;padding:15mm;box-shadow:0 4px 18px rgba(0,0,0,.18)}.doc-head{display:flex;justify-content:space-between;border-bottom:2px solid #1f2937;padding-bottom:12px;margin-bottom:16px}.doc-head h1{margin:0}.doc-head p{margin:5px 0}.doc-summary{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #bbb;margin-bottom:15px}.doc-summary div{text-align:center;padding:12px;border-right:1px solid #bbb}.doc-summary div:last-child{border-right:0}.doc-summary b{display:block;margin-top:5px;font-size:18px}.customer-box{border:1px solid #ccc;padding:12px;margin-bottom:15px;line-height:1.7}.sign{display:flex;justify-content:space-between;margin-top:45px}
@page{size:A4;margin:8mm}@media print{.no-print{display:none!important}.a4{width:auto;min-height:auto;margin:0;padding:0;box-shadow:none}.print-bg{background:#fff}table{font-size:11px}th,td{padding:6px}}
@media(max-width:900px){.sidebar{position:static;width:auto}.main{margin-left:0}.cards{grid-template-columns:1fr 1fr}.grid2{grid-template-columns:1fr}.content{padding:16px}}@media(max-width:600px){.cards,.form-grid{grid-template-columns:1fr}.head{align-items:stretch;flex-direction:column}.full{grid-column:auto}}

.status{display:inline-block;padding:5px 9px;border-radius:99px;font-size:12px}.status.on{background:#dcfce7;color:#166534}.status.off{background:#f3f4f6;color:#6b7280}

.sidebar{display:flex;flex-direction:column}.sidebar nav{flex:1}.sidebar-user{border-top:1px solid rgba(255,255,255,.12);padding:16px 8px 0}.sidebar-user span{display:block;font-weight:700}.sidebar-user small{color:#9ca3af}.sidebar-user button{margin-top:10px;width:100%;border:1px solid rgba(255,255,255,.2);background:transparent;color:white;padding:8px;border-radius:7px;cursor:pointer}
.top small{display:block;color:#6b7280}.menu-toggle,.mobile-menu-button,.menu-overlay{display:none}.narrow{max-width:560px}.auth-bg{min-height:100vh;background:linear-gradient(135deg,#101827,#253551);display:grid;place-items:center;padding:20px}.auth-card{width:min(430px,100%);background:#fff;border-radius:18px;padding:30px;box-shadow:0 20px 60px rgba(0,0,0,.25)}.auth-logo{font-size:25px;font-weight:800;margin-bottom:26px}.auth-logo b{color:#c59a55}.auth-logo small{display:block;font-size:12px;color:#6b7280;margin-top:5px}.auth-card h1{margin-bottom:5px}.auth-note{color:#6b7280;margin-top:0;margin-bottom:22px}.check{display:flex;align-items:center;gap:8px;font-weight:400}.check input{width:auto;margin:0}.wide-btn{width:100%}
@media(max-width:900px){
 .mobile-menu-button{display:block;position:fixed;z-index:1200;left:14px;top:14px;background:#172033;color:#fff;width:42px;height:42px;border-radius:9px;text-align:center;line-height:42px;font-size:22px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
 .sidebar{position:fixed;z-index:1100;left:-260px;top:0;bottom:0;width:245px;transition:left .2s ease}
 .menu-toggle:checked~.sidebar{left:0}.menu-toggle:checked~.menu-overlay{display:block;position:fixed;z-index:1050;inset:0;background:rgba(0,0,0,.45)}
 .main{margin-left:0}.top{padding-left:70px;padding-right:14px}.top>a{font-size:13px;padding:9px}.content{padding:16px;padding-top:20px}
 .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.panel{overflow-x:auto}
}
@media(max-width:600px){
 .cards{grid-template-columns:1fr 1fr;gap:10px}.card{padding:14px}.card b{font-size:19px}
 .grid2{display:block}.head form,.actions,.actions form{width:100%}.actions{flex-direction:column;align-items:stretch}
 .item-row{grid-template-columns:1fr 1fr}.item-row input:first-child{grid-column:1/-1}
 th,td{padding:9px 8px;font-size:12px}.top strong{font-size:14px}.top small{font-size:10px}
}

.order-item-row{display:grid;grid-template-columns:1.5fr 2fr 1fr 1fr .55fr .8fr .8fr auto;gap:7px;margin-bottom:9px;align-items:end}.order-item-row input,.order-item-row select{margin:0}.order-totals{margin-left:auto;max-width:340px;padding:15px}.order-totals p{display:flex;justify-content:space-between;border-bottom:1px solid #eee;padding:8px}.packing-check{border:1px solid #bbb;padding:14px;margin:18px 0;line-height:2}.packing-check h3{margin:0 0 5px}@media(max-width:1000px){.order-item-row{grid-template-columns:1fr 1fr}.order-item-row .product-select{grid-column:1/-1}}@media print{.packing-check{page-break-inside:avoid}}