/* AMS - Alteration Management System
 * Full CSS extracted from prototype v16
 * Split into sections for developer reference
 * Developer: reorganise into separate files per the folder structure
 */

/* ============================================
   SECTION 1: Variables & Base
   ============================================ */
*{box-sizing:border-box;margin:0;padding:0}
:root{--brand:#1B4F72;--brand-dark:#154060;--brand-light:#2E86C1;--sidebar:#0F3250;--sidebar-text:#A9CCE3;--bg:#F4F6F9;--text:#1A2533;--text-muted:#3D4A5C;--border:#DDE3EC;--success:#1E8449;--danger:#C0392B;--warning:#D4891A;--radius:10px;--shadow:0 1px 4px rgba(0,0,0,0.08)}
body{font-family:system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:15px;font-weight:450}
#login-screen{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#0F3250,#1B4F72 60%,#2E86C1);padding:30px 16px}
.login-card{background:#fff;border-radius:16px;padding:36px 32px;width:360px;max-width:100%;box-shadow:0 8px 40px rgba(0,0,0,.22)}
.logo-mark{width:50px;height:50px;background:var(--brand);border-radius:12px;display:flex;align-items:center;justify-content:center;margin:0 auto 10px;font-size:20px;font-weight:800;color:#fff}
.login-card h1{text-align:center;font-size:19px;font-weight:700;margin-bottom:3px}
.lsub{text-align:center;font-size:12px;color:var(--text-muted);margin-bottom:22px}
.fg label{display:block;font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
.fg{margin-bottom:14px}
.fg input{width:100%;padding:10px 12px;border:1.5px solid var(--border);border-radius:8px;font-size:14px;outline:none}
.fg input:focus{border-color:var(--brand-light)}
.btn-login{width:100%;padding:12px;background:var(--brand);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;margin-top:4px}
.btn-login:hover{background:var(--brand-dark)}
.hint{font-size:11px;color:var(--text-muted);text-align:center;margin-top:14px;line-height:1.8}
.hint code{background:#F4F6F9;padding:1px 6px;border-radius:4px;font-family:monospace}
.lerr{background:#FDEDEC;border:1px solid #F1948A;color:var(--danger);border-radius:6px;padding:8px 12px;font-size:12px;margin-bottom:12px;display:none}
#app{display:none;min-height:100vh;flex-direction:row}
.sidebar{width:220px;background:var(--sidebar);display:flex;flex-direction:column;min-height:100vh;flex-shrink:0}
.sb-logo{padding:18px 16px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;gap:8px}
.sb-logo .lm{width:32px;height:32px;background:var(--brand-light);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff;flex-shrink:0}
.sb-logo span{font-size:14px;font-weight:700;color:#fff}
.sb-nav{flex:1;padding:8px 0;overflow-y:auto}
.nav-sec{padding:14px 16px 3px;font-size:10px;font-weight:700;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:1px;pointer-events:none!important;user-select:none;cursor:default}
.nav-item{display:flex;align-items:center;gap:8px;padding:9px 16px;cursor:pointer!important;color:var(--sidebar-text);font-size:14px;font-weight:600;border-left:3px solid transparent;transition:all .15s;user-select:none;position:relative;z-index:1}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-item.active{background:rgba(46,134,193,.2);color:#fff;border-left-color:var(--brand-light)}
.sb-foot{padding:12px 16px;border-top:1px solid rgba(255,255,255,.07)}
.u-pill{display:flex;align-items:center;gap:8px}
.u-av{width:28px;height:28px;border-radius:50%;background:var(--brand-light);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
.u-info{flex:1;min-width:0}
.u-name{font-size:12px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.u-role{font-size:10px;color:var(--sidebar-text);text-transform:uppercase}
.logout-btn{background:none;border:none;color:var(--sidebar-text);cursor:pointer;font-size:15px;padding:2px}
.logout-btn:hover{color:#fff}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.topbar{background:#fff;border-bottom:1px solid var(--border);padding:0 20px;height:52px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.topbar-t{font-size:15px;font-weight:700}
.topbar-s{font-size:11px;color:var(--text-muted);margin-top:1px}
.pg{padding:20px;overflow-y:auto;height:calc(100vh - 52px)}
.page{display:none}.page.active{display:block}
.card{background:#fff;border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);margin-bottom:16px}
.card-hd{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.card-t{font-size:13px;font-weight:700}
.card-bd{padding:18px}
.btn{padding:7px 13px;border-radius:7px;font-size:12px;font-weight:600;cursor:pointer;border:none;display:inline-flex;align-items:center;gap:5px;transition:all .15s}
.btn-brand{background:var(--brand);color:#fff}.btn-brand:hover{background:var(--brand-dark)}
.btn-outline{background:#fff;color:var(--brand);border:1.5px solid var(--border)}.btn-outline:hover{border-color:var(--brand-light)}
.btn-danger{background:var(--danger);color:#fff}
.btn-edit{background:#7D3C98;color:#fff}.btn-edit:hover{background:#6C3483}
.btn-sm{padding:4px 9px;font-size:11px}
.badge{display:inline-flex;align-items:center;padding:2px 9px;border-radius:20px;font-size:10px;font-weight:700}
.b-new{background:#E8F4FD;color:#1A5276}.b-progress{background:#FEF9E7;color:#7D6608}.b-ready{background:#EAFAF1;color:#1E6B3A}.b-collected{background:#F0F0F0;color:#555}.b-cancelled{background:#FDEDEC;color:#8B2121}
.b-admin{background:#EAF0FB;color:#1B4F72}.b-licensee{background:#FEF5E7;color:#9A5E00}.b-staff{background:#EAFAF1;color:#1E6B3A}
.b-paid{background:#EAFAF1;color:#1E6B3A}.b-partial{background:#E8F4FD;color:#1A5276}.b-unpaid{background:#FEF9E7;color:#7D6608}
.tw{overflow-x:auto;overflow-y:auto;max-height:480px}
table{width:100%;border-collapse:collapse}
th{font-size:12px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;padding:9px 12px;text-align:left;border-bottom:1px solid var(--border);background:#FAFBFC;position:sticky;top:0;z-index:10;box-shadow:0 2px 2px -1px rgba(0,0,0,.08)}
td{padding:11px 12px;border-bottom:1px solid #F0F3F7;font-size:14px;font-weight:500;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:#F9FBFD}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
.stat{background:#fff;border-radius:var(--radius);border:1px solid var(--border);padding:14px 16px;box-shadow:var(--shadow)}
.stat-l{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}
.stat-v{font-size:22px;font-weight:800;color:var(--text);line-height:1}
.stat-s{font-size:11px;color:var(--text-muted);margin-top:3px}
.stat-clickable{border-color:var(--brand-light)!important;transition:all .2s}.stat-clickable:hover{background:#EAF0FB;border-color:var(--brand)!important;transform:translateY(-2px);box-shadow:0 4px 12px rgba(27,79,114,.15)}
.welcome{background:linear-gradient(120deg,var(--brand),var(--brand-light));border-radius:var(--radius);padding:18px 20px;margin-bottom:16px;color:#fff}
.welcome h2{font-size:16px;font-weight:700;margin-bottom:3px}
.welcome p{font-size:12px;opacity:.85}
.due-warning{color:var(--danger);font-weight:700}
.due-soon{color:var(--warning);font-weight:600}
.filter-panel{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin-bottom:14px;box-shadow:var(--shadow)}
.fp-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.fp-row2{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:10px}
.fp-row3{display:grid;grid-template-columns:1fr 1fr auto auto;gap:8px;align-items:end}
.fp-sw{position:relative;flex:1;min-width:180px}
.fp-sw input{width:100%;padding:8px 12px 8px 32px;border:1.5px solid var(--border);border-radius:8px;font-size:13px;outline:none;background:#fff}
.fp-sw input:focus{border-color:var(--brand-light)}
.fp-si{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:13px;pointer-events:none}
.fsel{padding:7px 10px;border:1.5px solid var(--border);border-radius:7px;font-size:12px;outline:none;background:#fff;color:var(--text);width:100%}
.filter-lbl{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}
.active-filters{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.filter-chip{background:#EAF0FB;color:var(--brand);padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;display:flex;align-items:center;gap:4px}
.filter-chip button{background:none;border:none;cursor:pointer;color:var(--brand);font-size:12px;padding:0;line-height:1}
.mo{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;z-index:100}
.mo.open{display:flex}
.modal{background:#fff;border-radius:14px;width:640px;max-width:96vw;box-shadow:0 20px 60px rgba(0,0,0,.2);max-height:92vh;display:flex;flex-direction:column}
.mo-hd{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.mo-t{font-size:14px;font-weight:700}
.mo-x{background:none;border:none;font-size:20px;cursor:pointer;color:var(--text-muted);line-height:1}
.mo-bd{padding:20px;overflow-y:auto;flex:1}
.mo-ft{padding:12px 20px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fg-m{margin-bottom:14px}
.fg-m label{display:block;font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px}
.fg-m input,.fg-m select,.fg-m textarea{width:100%;padding:9px 11px;border:1.5px solid var(--border);border-radius:7px;font-size:13px;color:var(--text);outline:none;background:#fff}
.fg-m input:focus,.fg-m select:focus,.fg-m textarea:focus{border-color:var(--brand-light)}
.fg-m textarea{resize:vertical;min-height:54px}
.req{color:var(--danger)}
.sec-label{font-size:11px;font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.6px;margin:16px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--border)}
.comm-pills{display:flex;gap:8px;flex-wrap:wrap}
.comm-pill{padding:7px 14px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;border:2px solid var(--border);background:#fff;transition:all .15s}
.comm-pill.selected{border-color:var(--brand);background:#EAF0FB;color:var(--brand)}
.comm-pill:hover{border-color:var(--brand-light)}
.cust-search-box{border:1.5px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:4px}
.cust-search-box input{width:100%;padding:9px 12px;border:none;font-size:13px;outline:none}
.cust-results{border-top:1px solid var(--border);max-height:140px;overflow-y:auto}
.cust-result{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer}
.cust-result:hover{background:#F0F7FF}
.c-av{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
.cust-selected{background:#EAFAF1;border:1.5px solid #A9DFBF;border-radius:8px;padding:10px 14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.delivery-override{background:#FEF9E7;border:1.5px solid #F9CA4B;border-radius:8px;padding:10px 12px;margin-top:8px}
.delivery-override p{font-size:12px;color:#7D6608;margin-bottom:6px;font-weight:500}
.delivery-override .comm-pills .comm-pill{font-size:11px;padding:5px 10px}
.ord-branch-sel{background:#EAF0FB;border:1.5px solid var(--brand-light);border-radius:8px;padding:10px 14px;margin-bottom:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ord-branch-sel label{font-size:11px;font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.4px;white-space:nowrap}
.ord-branch-sel select{padding:6px 10px;border:1.5px solid var(--brand-light);border-radius:6px;font-size:12px;outline:none;background:#fff;color:var(--text);flex:1}
.garment-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:10px;margin-bottom:14px}
.g-card{border:2px solid var(--border);border-radius:12px;padding:0;text-align:center;cursor:pointer;transition:all .18s;background:#fff;position:relative;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.g-card:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.12);border-color:var(--brand-light)}
.g-card.selected{border-color:var(--brand);border-width:2.5px;box-shadow:0 0 0 3px rgba(27,79,114,.15)}
.g-icon-wrap{width:100%;height:90px;display:flex;align-items:center;justify-content:center;background:#FAFBFC;padding:8px;position:relative}
.g-icon-wrap img{max-width:100%;max-height:74px;object-fit:contain;display:block}
.g-name{font-size:10px;font-weight:700;color:var(--text);line-height:1.2;padding:5px 4px 7px;margin:0;background:#fff;border-top:1px solid var(--border)}
.g-cnt{position:absolute;top:5px;right:5px;min-width:20px;height:20px;padding:0 4px;background:#fff;border-radius:10px;font-size:11px;font-weight:800;color:var(--brand);display:none;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.g-card.selected .g-cnt{display:flex}
.garment-item{background:#F8FAFC;border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:10px}
.garment-item-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.gi-title{font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px}
.gi-icon-sm{width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.remove-g{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:16px;padding:0;line-height:1}
.remove-g:hover{color:var(--danger)}
.gi-label{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px}
.gi-input{padding:7px 9px;border:1.5px solid var(--border);border-radius:6px;font-size:12px;outline:none;width:100%;background:#fff}
.gi-input:focus{border-color:var(--brand-light)}
.alt-item{background:#fff;border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:6px}
.alt-item-hd{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.alt-item-num{width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.alt-sel{width:100%;padding:6px 9px;border:1.5px solid var(--border);border-radius:6px;font-size:12px;outline:none;background:#fff}
.alt-sel:focus{border-color:var(--brand-light)}
.remove-alt-item{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:14px;padding:0;flex-shrink:0}
.remove-alt-item:hover{color:var(--danger)}
.add-alt-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1.5px dashed var(--border);border-radius:7px;background:none;cursor:pointer;font-size:12px;color:var(--brand);font-weight:600;width:100%;justify-content:center;margin-top:4px}
.add-alt-btn:hover{border-color:var(--brand);background:#F0F7FF}
.garment-subtotal{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border)}
.order-total-box{background:#F4F6F9;border-radius:8px;padding:12px 14px;margin-top:8px}
.total-row{display:flex;justify-content:space-between;font-size:13px;padding:3px 0}
.total-row.grand{font-size:15px;font-weight:800;border-top:1px solid var(--border);margin-top:6px;padding-top:8px}
.mini-cal-wrap{position:relative}
.due-input-row{display:flex;gap:8px;align-items:center}
.due-input-row input[type=date]{flex:1;padding:9px 11px;border:1.5px solid var(--border);border-radius:7px;font-size:13px;outline:none;background:#fff}
.mini-cal-btn{padding:8px 12px;border:1.5px solid var(--border);border-radius:7px;background:#fff;cursor:pointer;font-size:14px;flex-shrink:0}
.mini-cal-popup{position:absolute;top:calc(100% + 6px);left:0;z-index:50;background:#fff;border:1.5px solid var(--border);border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.15);padding:14px;width:300px;display:none}
.mini-cal-popup.open{display:block}
.mini-cal-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.mini-cal-hd span{font-size:13px;font-weight:700}
.mini-cal-hd button{background:none;border:1.5px solid var(--border);border-radius:5px;padding:3px 8px;cursor:pointer;font-size:12px}
.mini-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.mini-cal-dh{text-align:center;font-size:9px;font-weight:700;color:var(--text-muted);text-transform:uppercase;padding:3px 0}
.mini-cal-day{min-height:34px;border-radius:6px;padding:3px 2px;cursor:pointer;border:1.5px solid transparent;transition:all .1s;text-align:center}
.mini-cal-day:hover{border-color:var(--brand-light)}
.mini-cal-day.mc-today{border-color:var(--brand-light);background:#EAF0FB}
.mini-cal-day.mc-selected{border-color:var(--brand);background:#EAF0FB}
.mini-cal-day.mc-other{opacity:.3;pointer-events:none}
.mini-cal-day.mc-has-work{background:#FEF9E7}
.mini-cal-day.mc-busy{background:#FDEDEC}
.mini-cal-dn{font-size:11px;font-weight:700;line-height:1.2}
.mini-cal-dc{font-size:9px;font-weight:700;line-height:1}
.mini-cal-legend{display:flex;gap:8px;margin-top:8px;font-size:10px;color:var(--text-muted)}
.cal-dot{width:8px;height:8px;border-radius:2px;display:inline-block}
.status-flow{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.status-btn{padding:6px 12px;border-radius:20px;font-size:11px;font-weight:700;cursor:pointer;border:2px solid transparent;transition:all .15s}
.status-btn.active-s{border-color:var(--brand)}
.order-detail-hd{background:linear-gradient(120deg,var(--brand),var(--brand-light));border-radius:var(--radius);padding:16px 18px;color:#fff;margin-bottom:16px}
.order-detail-hd h3{font-size:16px;font-weight:700;margin-bottom:4px}
.order-detail-hd p{font-size:12px;opacity:.85}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.info-box{background:var(--bg);border-radius:8px;padding:10px 12px}
.info-lbl{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
.info-val{font-size:13px;font-weight:600}
.garment-summary{background:#F8FAFC;border:1px solid var(--border);border-radius:8px;padding:12px 14px;margin-bottom:8px}
.garment-summary-hd{font-size:12px;font-weight:700;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center}
.alt-tag{display:inline-block;background:#EAF0FB;color:var(--brand);padding:2px 8px;border-radius:4px;font-size:11px;margin:2px 2px 2px 0}
.inv-mat-line{display:flex;justify-content:space-between;font-size:11px;color:#555;margin:3px 0 2px 4px;padding:2px 0}
.inv-mat-amt{font-weight:500;color:#333}
.send-invoice-box{background:#F0F7FF;border:1.5px solid var(--brand-light);border-radius:10px;padding:14px 16px;margin-bottom:14px}
.send-invoice-box h4{font-size:13px;font-weight:700;color:var(--brand);margin-bottom:8px}
.send-btn{padding:8px 14px;border-radius:7px;font-size:12px;font-weight:700;cursor:pointer;border:none;transition:all .15s;display:inline-flex;align-items:center;gap:6px}
.send-email{background:#1B4F72;color:#fff}.send-sms{background:#E67E22;color:#fff}.send-whatsapp{background:#25D366;color:#fff}
.send-btn:hover{opacity:.88}
.send-log{margin-top:10px;font-size:11px;color:var(--text-muted)}
.send-log-item{padding:4px 0;border-bottom:1px solid #eee;display:flex;justify-content:space-between;gap:8px}
.cancelled-box{background:#FDEDEC;border:1.5px solid #F1948A;border-radius:10px;padding:14px 16px;margin-bottom:14px}
.cancelled-box h4{font-size:13px;font-weight:700;color:var(--danger);margin-bottom:4px}
.cancelled-box p{font-size:12px;color:#7B241C}
.resume-banner{background:linear-gradient(90deg,#1B4F72,#2E86C1);border-radius:var(--radius);padding:12px 18px;margin-bottom:14px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:10px}
.resume-banner p{font-size:13px;font-weight:600}
.resume-banner span{font-size:11px;opacity:.85}
.reason-options{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.reason-opt{padding:10px 14px;border:1.5px solid var(--border);border-radius:8px;cursor:pointer;font-size:13px;transition:all .15s}
.reason-opt:hover{border-color:var(--brand-light);background:#F0F7FF}
.reason-opt.selected{border-color:var(--brand);background:#EAF0FB;font-weight:600}
.edit-mode-banner{background:linear-gradient(90deg,#7D3C98,#9B59B6);border-radius:8px;padding:10px 14px;margin-bottom:12px;color:#fff;display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600}
/* WORKLOAD */
.wl-loc-sel{padding:7px 10px;border:1.5px solid var(--border);border-radius:7px;font-size:12px;outline:none;background:#fff;color:var(--text);min-width:180px}
.cal-nav{display:flex;align-items:center;gap:8px}
.cal-nav button{background:none;border:1.5px solid var(--border);border-radius:6px;padding:4px 10px;cursor:pointer;font-size:12px;font-weight:600}
.cal-nav button:hover{border-color:var(--brand-light)}
.cal-nav span{font-size:14px;font-weight:700;min-width:130px;text-align:center}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-day-hd{text-align:center;font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;padding:4px 0}
.cal-day{min-height:56px;border-radius:8px;padding:5px 6px;cursor:pointer;border:1.5px solid transparent;transition:all .15s;position:relative}
.cal-day:hover{border-color:var(--brand-light)}
.cal-day.today{border-color:var(--brand-light);background:#EAF0FB}
.cal-day.selected-day{border-color:var(--brand)!important;box-shadow:0 0 0 2px rgba(27,79,114,.2)!important}
.cal-day.other-month{opacity:.25;pointer-events:none}
.cal-day.has-work{background:#FEF9E7}
.cal-day.busy{background:#FDEDEC}
.cal-day.has-overdue{background:#C0392B!important;border-color:#922B21!important;box-shadow:0 2px 8px rgba(192,57,43,.45)!important}
.cal-day.has-overdue .cal-day-num{color:#fff!important;font-weight:900}
.cal-day.has-overdue:hover{background:#A93226!important}
.cal-day-num{font-size:11px;font-weight:700;line-height:1;margin-bottom:3px;color:var(--text)}
.cal-day.today .cal-day-num{color:var(--brand);font-weight:800}
.cal-day-pills{display:flex;flex-direction:column;gap:2px;margin-top:2px}
.cal-pill{font-size:9px;font-weight:700;padding:1px 5px;border-radius:3px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-pill.pill-work{background:rgba(253,198,39,.3);color:#856404}
.cal-pill.pill-overdue{background:rgba(255,255,255,.25);color:#fff}
.cal-pill.pill-carryover{background:rgba(255,153,0,.2);color:#6B4500}
.cal-legend{display:flex;gap:12px;margin-top:10px;font-size:11px;color:var(--text-muted);flex-wrap:wrap}
.cal-legend span{display:flex;align-items:center;gap:5px}
.cal-legend-dot{width:12px;height:12px;border-radius:3px;flex-shrink:0}
.day-detail{background:#fff;border:1px solid var(--border);border-radius:var(--radius);margin-top:14px;overflow:hidden;box-shadow:var(--shadow)}
.dd-hd{padding:14px 16px;background:linear-gradient(120deg,var(--brand),var(--brand-light));color:#fff;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px}
.dd-hd h3{font-size:14px;font-weight:700;margin:0}
.dd-hd p{font-size:11px;opacity:.85;margin:0}
.dd-section-hd{padding:10px 16px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.dd-section-hd.overdue-hd{background:#FDEDEC;color:#7B241C}
.dd-section-hd.carryover-hd{background:#FFF3CD;color:#856404}
.dd-section-hd.today-hd{background:#EAF0FB;color:var(--brand)}
.dd-section-hd.future-hd{background:#EAFAF1;color:#1E6B3A}
.work-item{padding:12px 16px;border-bottom:1px solid #F0F3F7;display:flex;align-items:flex-start;gap:12px}
.work-item:last-child{border-bottom:none}
.work-item.overdue-item{background:#FFFBF9;border-left:3px solid var(--danger)}
.work-item.carryover-item{background:#FFFDF0;border-left:3px solid var(--warning)}
.work-item.today-item{background:#F8FBFF;border-left:3px solid var(--brand-light)}
.work-num{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex-shrink:0;margin-top:2px}
.work-num.num-overdue{background:var(--danger);color:#fff}
.work-num.num-carryover{background:var(--warning);color:#fff}
.work-num.num-today{background:var(--brand);color:#fff}
.work-body{flex:1;min-width:0}
.work-order{font-size:11px;color:var(--text-muted);margin-bottom:2px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.work-cust{font-size:13px;font-weight:700;margin-bottom:4px}
.work-garments{display:flex;flex-direction:column;gap:4px;margin-bottom:4px}
.work-garment-row{display:flex;align-items:flex-start;gap:8px;padding:5px 8px;background:#F4F6F9;border-radius:6px}
.work-garment-info{flex:1;min-width:0}
.work-garment-name{font-size:12px;font-weight:700}
.work-garment-alts{font-size:11px;color:var(--text-muted);line-height:1.5}
.work-meta{font-size:11px;color:var(--text-muted);display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.work-priority-badge{display:inline-flex;align-items:center;padding:1px 7px;border-radius:10px;font-size:10px;font-weight:700}
.pri-urgent{background:#FDEDEC;color:#8B2121}
.pri-express{background:#FEF5E7;color:#9A5E00}
.pri-normal{background:#F0F0F0;color:#555}
.fifo-label{font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;display:inline-flex;align-items:center;gap:3px}
.fifo-label.fl-overdue{background:#FDEDEC;color:#7B241C}
.fifo-label.fl-carryover{background:#FFF3CD;color:#856404}
.fifo-label.fl-today{background:#EAF0FB;color:var(--brand)}
.empty-day{padding:24px 16px;text-align:center;color:var(--text-muted)}
.day-summary-bar{background:var(--bg);border-top:1px solid var(--border);padding:10px 16px;display:flex;gap:16px;flex-wrap:wrap;font-size:12px}
.dsb-item{display:flex;align-items:center;gap:6px}
.dsb-val{font-weight:700;color:var(--text)}
/* INVOICE */
.invoice-preview{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.inv-hd{background:#1B4F72;color:#fff;padding:20px 26px;display:flex;align-items:stretch;justify-content:space-between;gap:20px}
.inv-logo-box{background:#fff;border-radius:6px;padding:4px 8px;display:flex;align-items:center;justify-content:flex-end;margin-bottom:3px;width:100%}
.inv-biz-name{font-size:20px;font-weight:800;margin-bottom:4px}
.inv-biz-sub{font-size:12px;opacity:.85;line-height:1.8}
.inv-title-blk{text-align:right}
.inv-title{font-size:20px;font-weight:800;letter-spacing:1px;opacity:.9}
.inv-num{font-size:12px;font-weight:700;font-family:monospace;background:rgba(255,255,255,.15);padding:3px 10px;border-radius:4px;display:inline-block;margin-top:4px}
.inv-stamp{display:inline-block;padding:3px 10px;border-radius:4px;font-size:10px;font-weight:700;border:2px solid;margin-top:6px}
.inv-stamp.unpaid{border-color:rgba(255,200,0,.7);color:rgba(255,230,100,1)}
.inv-stamp.partial{border-color:rgba(255,200,100,.7);color:rgba(255,220,120,1)}
.inv-stamp.paid{border-color:rgba(100,255,150,.7);color:rgba(150,255,180,1)}
.inv-stamp.cancelled{border-color:rgba(255,120,120,.7);color:rgba(255,150,150,1)}
.inv-body{padding:20px 26px}
.inv-meta{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.inv-meta-box h4{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}
.inv-meta-box p{font-size:12px;line-height:1.7}
.inv-meta-right{text-align:right}
.inv-tbl{width:100%;border-collapse:collapse;margin-bottom:14px}
.inv-tbl th{font-size:10px;font-weight:700;color:var(--text-muted);text-transform:uppercase;padding:7px 10px;text-align:left;border-bottom:2px solid var(--border);background:#FAFBFC}
.inv-tbl th.right{text-align:right}
.inv-tbl td{padding:10px 10px;border-bottom:1px solid #F0F3F7;font-size:12px;vertical-align:top}
.inv-tbl td.right{text-align:right;font-weight:700}
.inv-tbl tr:last-child td{border-bottom:none}
.inv-g-name{font-weight:700;font-size:13px;margin-bottom:3px}
.inv-g-alts{font-size:11px;color:var(--text-muted);line-height:1.7}
.inv-totals{display:flex;justify-content:flex-end;border-top:2px solid var(--border);padding-top:12px}
.inv-totals-box{min-width:240px}
.inv-tot-row{display:flex;justify-content:space-between;padding:3px 0;font-size:12px}
.inv-tot-row.grand{font-size:15px;font-weight:800;border-top:2px solid var(--border);margin-top:5px;padding-top:7px;color:var(--brand)}
.inv-tot-row.disc-row{color:var(--success);font-weight:600}
.inv-tot-row.tax-row{color:var(--text-muted)}
.inv-tot-row.paid-row{color:var(--success);font-weight:700}
.inv-tot-row.bal-row{color:var(--danger);font-weight:800;font-size:14px}
.inv-footer{padding:14px 26px;background:#F8FAFC;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:16px}
.inv-footer-terms{font-size:11px;color:var(--text-muted);line-height:1.7;flex:1}
.inv-footer-terms strong{color:var(--text);display:block;margin-bottom:2px}
.inv-footer-sig{text-align:right;font-size:11px;color:var(--text-muted)}
.disc-preview{background:#F4F6F9;border-radius:8px;padding:10px 14px;font-size:12px;margin-top:4px}
.color-picker-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.color-opt{width:26px;height:26px;border-radius:50%;cursor:pointer;border:3px solid transparent;transition:all .15s}
.color-opt.selected{border-color:#333;transform:scale(1.15)}
.garment-edit-name{font-size:14px;font-weight:700;border:1.5px solid var(--border);border-radius:7px;padding:6px 10px;outline:none;min-width:0;flex:1}
.garment-admin-grid{display:grid;grid-template-columns:280px 1fr;gap:16px;min-height:400px}
.garment-list-panel{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:#fff}
.garment-list-hd{padding:12px 14px;border-bottom:1px solid var(--border);font-size:12px;font-weight:700;background:#FAFBFC}
.garment-list-body{overflow-y:auto;max-height:380px}
.garment-list-item{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;border-bottom:1px solid #F0F3F7;transition:all .15s}
.garment-list-item:hover{background:#F4F6F9}
.garment-list-item.active{background:#EAF0FB;border-left:3px solid var(--brand)}
.gli-icon{width:52px;height:52px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.gli-info{flex:1;min-width:0}
.gli-name{font-size:13px;font-weight:700}
.gli-count{font-size:11px;color:var(--text-muted)}
.garment-detail-panel{border:1px solid var(--border);border-radius:var(--radius);background:#fff;overflow:hidden}
.garment-detail-hd{padding:14px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;background:#FAFBFC;flex-wrap:wrap}
.gd-icon{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}
.garment-detail-body{padding:14px 16px;overflow-y:auto;max-height:340px}
.alt-admin-item{display:flex;align-items:center;gap:8px;padding:8px 10px;background:#F8FAFC;border:1px solid var(--border);border-radius:7px;margin-bottom:6px}
.alt-add-row{display:flex;gap:8px;margin-top:10px}
.alt-add-row input{flex:1;padding:8px 10px;border:1.5px solid var(--border);border-radius:7px;font-size:13px;outline:none;background:#fff}
.toast{position:fixed;bottom:20px;right:20px;background:#1A2533;color:#fff;padding:10px 16px;border-radius:8px;font-size:12px;font-weight:500;z-index:300;opacity:0;transform:translateY(6px);transition:all .3s;pointer-events:none;max-width:320px}
.toast.show{opacity:1;transform:translateY(0)}
.toast.success{background:var(--success)}.toast.error{background:var(--danger)}
/* AUDIT BANNER */
.audit-banner{background:#FFF3CD;border:1.5px solid #F9CA4B;border-radius:8px;padding:10px 14px;margin-bottom:14px;font-size:11px;color:#856404}
.audit-banner strong{display:block;margin-bottom:4px;font-size:12px}

/* ── PHASE 5A TABLE UPDATES ─────────────────────────────── */
.ws-select{padding:4px 7px;border:1.5px solid var(--border);border-radius:6px;font-size:11px;font-weight:600;outline:none;background:#fff;cursor:pointer;width:100%;max-width:130px}
.ws-select:focus{border-color:var(--brand-light)}
.ws-new{border-color:#2E86C1;color:#1A5276;background:#E8F4FD}
.ws-progress{border-color:#F9CA4B;color:#7D6608;background:#FEF9E7}
.ws-completed{border-color:#27AE60;color:#1E6B3A;background:#EAFAF1}
.ws-collected{border-color:#8E44AD;color:#6C3483;background:#F3E8FF}
.ws-cancelled{border-color:#C0392B;color:#8B2121;background:#FDEDEC}
.pay-status-badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:10px;font-weight:700;white-space:nowrap;transition:all .15s}
.pay-status-badge[onclick]:hover{transform:scale(1.06);box-shadow:0 1px 4px rgba(0,0,0,.15)}
.ps-full{background:#EAFAF1;color:#1E6B3A}
.ps-partly{background:#E8F4FD;color:#1A5276}
.ps-unpaid{background:#FEF9E7;color:#7D6608}
/* Outstanding modal */
.outstanding-modal{background:#fff;border-radius:14px;width:880px;max-width:96vw;max-height:92vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.out-filter-bar{display:flex;gap:10px;flex-wrap:wrap;padding:14px 20px;border-bottom:1px solid var(--border);align-items:center}
.out-filter-bar select{padding:6px 10px;border:1.5px solid var(--border);border-radius:7px;font-size:12px;outline:none;background:#fff}
.out-total-bar{padding:12px 20px;background:linear-gradient(90deg,var(--brand),var(--brand-light));color:#fff;display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:14px;flex-shrink:0}
.rec-pay-btn{background:linear-gradient(135deg,#1E8449,#27AE60);color:#fff;border:none;border-radius:8px;padding:9px 16px;font-size:12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:all .15s;box-shadow:0 2px 6px rgba(30,132,73,.25)}.rec-pay-btn:hover{opacity:.9;transform:translateY(-1px)}.pm-pill.selected{border-color:var(--brand)!important;background:#EAF0FB;color:var(--brand)}
.qa-btn{padding:4px 10px;border:1.5px solid var(--border);border-radius:6px;background:#fff;font-size:12px;font-weight:600;cursor:pointer}
.qa-btn:hover{border-color:var(--brand-light);background:#F0F7FF}

.payment-history{background:#fff;border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-top:12px}
.payment-history-hd{padding:10px 14px;background:#F8FAFC;border-bottom:1px solid var(--border);font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;display:flex;justify-content:space-between;align-items:center}
.payment-row{padding:10px 14px;border-bottom:1px solid #F0F3F7;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.payment-row:last-child{border-bottom:none}
.pm-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700}
.pm-cash{background:#D1FAE5;color:#065F46}
.pm-eftpos{background:#EAF0FB;color:#1B4F72}
.pm-bank{background:#FEF3C7;color:#B45309}
.payment-amount{font-size:14px;font-weight:800;color:var(--success)}
.payment-meta{font-size:11px;color:var(--text-muted);flex:1}

.pay-line{background:#F8FAFC;border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:10px}
.pay-line-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.pay-line-num{width:20px;height:20px;border-radius:50%;background:var(--brand);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pay-line-title{font-size:12px;font-weight:700;display:flex;align-items:center;gap:8px}
.pay-line-remove{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:16px;padding:0;line-height:1}
.pay-line-remove:hover{color:var(--danger)}
.pl-method-row{display:flex;gap:6px;margin-bottom:10px}
.pl-method-pill{flex:1;text-align:center;padding:8px 6px;border:2px solid var(--border);border-radius:8px;cursor:pointer;font-size:11px;font-weight:600;background:#fff}
.pl-method-pill.selected{border-color:var(--brand);background:#EAF0FB;color:var(--brand)}
.pl-method-pill .pm-icon-sm{font-size:16px;display:block;margin-bottom:2px}
.pl-cash-detail{background:#EAFAF1;border:1.5px solid #A9DFBF;border-radius:8px;padding:10px 12px;margin-top:8px;font-size:12px}
.pl-eftpos-detail{background:#EAF0FB;border:1.5px solid var(--brand-light);border-radius:8px;padding:10px 12px;margin-top:8px}
.pl-bank-detail{background:#FEF9E7;border:1.5px solid #F9CA4B;border-radius:8px;padding:10px 12px;margin-top:8px}
.pl-quick-amounts{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
.pl-qa-btn{padding:3px 8px;border:1.5px solid var(--border);border-radius:5px;background:#fff;font-size:11px;font-weight:600;cursor:pointer}
.pl-qa-btn:hover{border-color:var(--brand-light);background:#F0F7FF}
.pay-lines-total{display:flex;justify-content:space-between;padding:10px 14px;background:#F4F6F9;border-radius:8px;margin-top:8px;font-size:13px;font-weight:700}

/* Phase 9 Charts */
.charts-section{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.charts-section.full{grid-template-columns:1fr}
.chart-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.chart-hd{font-size:11px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px;border-bottom:1px solid var(--border);padding-bottom:8px}
.chart-wrap{overflow-x:auto}