*{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#f5f5f0;--bg2:#fff;--bg3:#f0f0ec;--text:#1a1a1a;--text2:#666;--text3:#999;--border:rgba(0,0,0,0.12);--border2:rgba(0,0,0,0.22);--sidebar:220px;--shadow:rgba(0,0,0,0.06)}
[data-theme="dark"]{--bg:#0f1012;--bg2:#18191e;--bg3:#222429;--text:#dfe0e8;--text2:#7e8196;--text3:#52546a;--border:rgba(255,255,255,0.07);--border2:rgba(255,255,255,0.14);--shadow:rgba(0,0,0,0.4)}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:13px;height:100vh;overflow:hidden}
/* ── AUTH ── */
#auth{display:none;align-items:center;justify-content:center;height:100vh;background:var(--bg)}
.show-auth #auth{display:flex!important}
.login-card{background:var(--bg2);border:0.5px solid var(--border);border-radius:12px;padding:2rem;width:340px;box-shadow:0 4px 24px var(--shadow)}
.login-logo{font-size:20px;font-weight:600;margin-bottom:4px}
.login-sub{font-size:12px;color:var(--text2);margin-bottom:1.5rem}
.f-label{display:block;font-size:11px;color:var(--text2);margin-bottom:4px;margin-top:12px}
.um-toggle{position:relative;display:inline-block;width:34px;height:18px;flex-shrink:0}
.um-toggle input{opacity:0;width:0;height:0}
.um-toggle-slider{position:absolute;cursor:pointer;inset:0;background:#D1D5DB;border-radius:18px;transition:.2s}
.um-toggle-slider:before{content:"";position:absolute;width:14px;height:14px;left:2px;bottom:2px;background:#fff;border-radius:50%;transition:.2s}
.um-toggle input:checked+.um-toggle-slider{background:#2563EB}
.um-toggle input:checked+.um-toggle-slider:before{transform:translateX(16px)}
.um-tab{padding:8px 14px;background:none;border:none;cursor:pointer;font-size:12px;font-weight:500;color:#6B7280;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;white-space:nowrap}
.um-tab:hover{color:#374151}
.um-tab.active{color:#2563EB;border-bottom-color:#2563EB}
.um-tr{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:7px;transition:background .12s}
.um-tr:hover{background:#F3F4F6}
.um-tr-label{font-size:12px;font-weight:500;color:#374151;flex:1}
.um-tr-desc{font-size:11px;color:#9CA3AF;flex:2}
.um-office-chip{display:inline-flex;align-items:center;padding:3px 10px;background:#F3F4F6;color:#6B7280;border:1px solid #E5E7EB;border-radius:20px;font-size:11px;cursor:pointer;transition:all .12s}
.um-office-chip.selected{background:#2563EB;color:#fff;border-color:#2563EB}
.um-status-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border-radius:7px;font-size:12px;cursor:pointer;transition:opacity .12s;user-select:none}
.um-status-chip:not(.selected){opacity:.3}
.um-locked{opacity:.4;cursor:not-allowed!important}
.um-locked input{pointer-events:none}
.f-inp{width:100%;padding:8px 10px;border:0.5px solid var(--border2);border-radius:8px;font-size:13px;outline:none;background:var(--bg2);color:var(--text)}
.f-inp:focus{border-color:var(--text)}
.login-hint{font-size:11px;color:var(--text3);margin-top:12px;line-height:1.7}
.login-err{font-size:12px;color:#e05252;margin-top:6px;min-height:16px}
/* ── LAYOUT ── */
#app{display:none;height:100vh;flex-direction:column}
.show-app #app{display:flex!important}
.app-inner{display:flex;flex:1;overflow:hidden;position:relative}
.sidebar{width:54px;background:var(--bg2);border-right:0.5px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;overflow-x:hidden;overflow-y:auto;transition:width .22s cubic-bezier(.4,0,.2,1);z-index:10;position:absolute;top:0;left:0;bottom:0}
.sidebar:hover{width:220px}
.sb-logo{padding:.8rem 1rem;border-bottom:0.5px solid var(--border);display:flex;align-items:center;gap:9px;min-height:54px}
.sb-logo-img{width:28px;height:28px;object-fit:contain;border-radius:7px;flex-shrink:0}
.sb-logo-name{font-size:15px;font-weight:700;color:var(--text);line-height:1.2;letter-spacing:-.3px;white-space:nowrap;opacity:0;transition:opacity .15s}
.sb-logo-name small{display:block;font-size:10px;font-weight:400;color:var(--text2);letter-spacing:0}
.sidebar:hover .sb-logo-name{opacity:1;transition:opacity .2s .08s}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 1rem;font-size:13px;cursor:pointer;color:var(--text2);border-left:2px solid transparent;transition:color .12s,background .12s;user-select:none;white-space:nowrap}
.nav-item:hover{color:var(--text);background:var(--bg3)}
.nav-item.active{color:var(--text);background:var(--bg3);border-left-color:var(--text);font-weight:500}
.nav-icon{font-size:16px;width:20px;text-align:center;flex-shrink:0;font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;font-style:normal}
.sb-footer{margin-top:auto;padding:1rem;border-top:0.5px solid var(--border);font-size:12px;color:var(--text2);opacity:0;transition:opacity .1s;pointer-events:none;white-space:nowrap}
.sidebar:hover .sb-footer{opacity:1;pointer-events:auto;transition:opacity .2s .08s}
.sb-user{font-weight:500;font-size:13px;color:var(--text);margin-bottom:8px}
.theme-toggle{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;border:0.5px solid var(--border2);border-radius:8px;background:transparent;color:var(--text2);font-size:11px;cursor:pointer;font-family:inherit;margin-bottom:6px;width:100%;transition:all .12s}
.theme-toggle:hover{background:var(--bg3);color:var(--text)}
.theme-track{width:28px;height:16px;border-radius:8px;background:var(--border2);position:relative;transition:background .2s;flex-shrink:0}
.theme-track.on{background:#4c6ef5}
.theme-thumb{width:12px;height:12px;border-radius:50%;background:#fff;position:absolute;top:2px;left:2px;transition:transform .2s}
.theme-track.on .theme-thumb{transform:translateX(12px)}
.content{flex:1;overflow:auto;display:flex;flex-direction:column;margin-left:54px}
.page{display:none;flex-direction:column;flex:1}
.page.active{display:flex}
/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:5px;padding:7px 13px;border:0.5px solid var(--border2);border-radius:8px;background:transparent;color:var(--text);font-size:12px;cursor:pointer;transition:all .12s;font-family:inherit}
.btn:hover{background:var(--bg3)}
.btn-dark{background:var(--text);color:var(--bg2);border-color:var(--text)}
.btn-danger{background:#e03131;color:#fff;border-color:#c92a2a}
.btn-danger:hover{background:#c92a2a;color:#fff}
.btn-dark:hover{opacity:.85}
.btn-sm{padding:5px 10px;font-size:11px}
.btn-success{border-color:rgba(22,101,52,.4);color:#166534}
.btn-success:hover{background:#dcfce7}
[data-theme="dark"] .btn-success{border-color:rgba(81,207,102,.25);color:#69db7c}
[data-theme="dark"] .btn-success:hover{background:rgba(81,207,102,.1)}
[data-theme="dark"] .btn-danger{background:#c92a2a;color:#fff;border-color:#e03131}
[data-theme="dark"] .btn-danger:hover{background:#e03131}
/* ── CARDS ── */
.card{background:var(--bg2);border:0.5px solid var(--border);border-radius:12px;padding:1rem 1.25rem}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.stat-card{background:var(--bg3);border-radius:8px;padding:.85rem 1rem}
.stat-label{font-size:11px;color:var(--text2);margin-bottom:4px}
.stat-value{font-size:22px;font-weight:600;line-height:1.2}
.stat-sub{font-size:11px;color:var(--text2);margin-top:3px}
/* ── BADGES ── */
.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;font-size:11px;font-weight:500;white-space:nowrap}
.s-0{background:#e8f0fe;color:#1a56db}
.s-1{background:#dcfce7;color:#166534}
.s-2{background:#fee2e2;color:#991b1b}
.s-3{background:#fef9c3;color:#92400e}
.s-4{background:#e0f2fe;color:#0369a1}
.s-5{background:#f3e8ff;color:#6b21a8}
.s-6{background:#fff7ed;color:#c2410c}
.s-7{background:#f0fdf4;color:#14532d}
.s-8{background:#fef2f2;color:#7f1d1d}
.s-9{background:#fdf4ff;color:#701a75}
.badge-admin{background:#ede9fe;color:#5b21b6}
.badge-mgr{background:#e0f2fe;color:#0369a1}
[data-theme="dark"] .s-0{background:#1a2e52;color:#74a8e8}
[data-theme="dark"] .s-1{background:#1a3328;color:#69db7c}
[data-theme="dark"] .s-2{background:#3a1f1f;color:#ff8787}
[data-theme="dark"] .s-3{background:#332e18;color:#ffd43b}
[data-theme="dark"] .s-4{background:#1a2a38;color:#5cc8e8}
[data-theme="dark"] .s-5{background:#281a38;color:#d0a8f0}
[data-theme="dark"] .s-6{background:#382518;color:#ffa94d}
[data-theme="dark"] .s-7{background:#1a3022;color:#51cf66}
[data-theme="dark"] .s-8{background:#3a1f1f;color:#ff6b6b}
[data-theme="dark"] .s-9{background:#2e1a38;color:#da77f2}
[data-theme="dark"] .badge-admin{background:#281a38;color:#d0a8f0}
[data-theme="dark"] .badge-mgr{background:#1a2a38;color:#5cc8e8}
/* ── TABLES ── */
.tbl-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
thead{position:sticky;top:0;z-index:2;background:var(--bg2)}
th{text-align:left;font-size:11px;font-weight:500;color:var(--text2);padding:8px 10px;border-bottom:0.5px solid var(--border);white-space:nowrap;user-select:none}
th:hover{color:var(--text)}
/* ── SORT INDICATORS ── */
th[data-sort-col]{cursor:pointer;position:relative;padding-right:18px}
th[data-sort-col]::after{content:'↕';position:absolute;top:7px;right:4px;font-size:9px;color:var(--text3);pointer-events:none;opacity:.55;transition:color .15s,opacity .15s}
th[data-sort-col]:hover::after{opacity:1;color:var(--text2)}
th[data-sort-col].sort-asc::after{content:'↑';color:var(--accent);opacity:1;font-weight:700}
th[data-sort-col].sort-desc::after{content:'↓';color:var(--accent);opacity:1;font-weight:700}
th[data-sort-col].sort-active{background:var(--accent-soft);color:var(--accent)!important}
.col-filter{width:100%;padding:3px 6px;border:0.5px solid var(--border2);border-radius:5px;font-size:11px;background:var(--bg);color:var(--text);font-family:inherit;outline:none;margin-top:4px;display:block}
.col-filter:focus{border-color:var(--text);background:var(--bg2)}
.sf-wrap{position:relative;margin-top:0}
.sf-inp{cursor:pointer;caret-color:transparent;width:100%;padding:3px 20px 3px 6px;border:0.5px solid var(--border2);border-radius:5px;font-size:11px;background:var(--bg);color:var(--text);font-family:inherit;outline:none;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-inp:focus{border-color:var(--text);background:var(--bg2)}
.sf-arr{position:absolute;right:5px;top:50%;transform:translateY(-50%);font-size:9px;color:var(--text3);pointer-events:none}
.sf-dd{position:absolute;top:calc(100% + 3px);left:0;z-index:999;background:var(--bg2);border:0.5px solid var(--border2);border-radius:8px;box-shadow:0 6px 20px var(--shadow);min-width:180px;padding:5px;display:none}
.sf-srch{width:100%;padding:5px 8px;border:0.5px solid var(--border);border-radius:5px;font-size:11px;background:var(--bg3);color:var(--text);font-family:inherit;outline:none;margin-bottom:4px;display:block}
.sf-list{max-height:180px;overflow-y:auto}
.sf-opt{padding:5px 8px;font-size:12px;cursor:pointer;border-radius:4px;white-space:nowrap}
.sf-opt:hover,.sf-opt.active{background:var(--bg3)}
.sf-opt.selected{font-weight:600}
.sf-clear{font-size:10px;color:var(--text3);cursor:pointer;text-align:right;padding:2px 4px;margin-top:2px}
.sf-clear:hover{color:var(--text)}
.date-range-wrap{display:flex;flex-direction:row;align-items:center;gap:3px;margin-top:0}
.drw-sep{font-size:10px;color:var(--text3);flex-shrink:0}
/* Custom CRM date picker trigger */
.crm-date-pick{display:flex;align-items:center;gap:4px;padding:3px 5px;background:var(--bg2);border:1px solid var(--border);border-radius:5px;cursor:pointer;font-size:10.5px;color:var(--text3);flex:1;min-width:70px;user-select:none;white-space:nowrap;transition:border-color .12s}
.crm-date-pick:hover{border-color:var(--border2)}
.crm-date-pick.has-value{color:var(--text2)}
.crm-date-pick svg{width:10px;height:10px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;opacity:.6}
/* Calendar popup */
#crm-cal-popup{position:fixed;background:#fff;border:1px solid #E5E7EB;border-radius:12px;box-shadow:0 6px 24px rgba(0,0,0,.13);z-index:99999;width:252px;font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;overflow:hidden}
.ccal-head{display:flex;align-items:center;justify-content:space-between;padding:11px 14px 7px}
.ccal-title{font-size:12.5px;font-weight:600;color:#111827}
.ccal-nav{background:none;border:none;cursor:pointer;padding:3px 5px;color:#6B7280;border-radius:4px;font-size:13px;line-height:1;transition:background .1s}
.ccal-nav:hover{background:#F3F4F6;color:#374151}
.ccal-body{padding:0 10px 6px}
.ccal-dow{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:3px}
.ccal-dow span{text-align:center;font-size:10.5px;color:#9CA3AF;font-weight:500;padding:2px 0}
.ccal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:1px}
.ccal-day{text-align:center;font-size:12px;padding:5px 0;border-radius:50%;cursor:pointer;color:#374151;transition:background .1s,color .1s;aspect-ratio:1}
.ccal-day:hover{background:#FEE2E2;color:#991b1b}
.ccal-day.other{color:#D1D5DB}
.ccal-day.other:hover{background:#F9FAFB;color:#9CA3AF}
.ccal-day.today{font-weight:700;color:var(--accent)}
.ccal-day.selected{background:var(--accent)!important;color:#fff!important;font-weight:600}
.ccal-foot{display:flex;justify-content:space-between;padding:7px 14px 11px;border-top:1px solid #F3F4F6}
.ccal-foot button{background:none;border:none;cursor:pointer;font-size:12px;color:var(--accent);font-family:inherit;padding:2px 0;transition:opacity .1s}
.ccal-foot button:hover{opacity:.7;text-decoration:underline}
td{padding:0 8px;border-bottom:0.5px solid var(--border);font-size:13px;font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;vertical-align:middle;height:16px;line-height:normal;min-height:16px;white-space:nowrap}
tr:hover td{background:var(--bg3)}
.ord-row{cursor:pointer;user-select:none}
.ord-row:hover td{background:#e8eeff!important}
[data-theme="dark"] .ord-row:hover td{background:#1e2545!important}
.ord-even td,.ord-odd td{background:var(--bg2)}
.ord-selected td{background:#dbeafe!important;outline:none}
.ord-selected:hover td{background:#bfdbfe!important}
[data-theme="dark"] .ord-selected td{background:#1e3a5f!important}
[data-theme="dark"] .ord-selected:hover td{background:#1e4a7a!important}
.order-link{color:var(--text);font-weight:500;cursor:pointer;text-decoration:underline;text-decoration-color:rgba(0,0,0,.18)}
.ttn-copy{cursor:pointer;border-bottom:1px dashed var(--text3);transition:color .15s,border-color .15s}
.ttn-copy:hover{color:var(--text);border-color:var(--text)}
.ttn-copy.copied{color:var(--accent);border-color:var(--accent);transition:none}
[data-theme="dark"] .order-link{text-decoration-color:rgba(255,255,255,.12)}
.order-link:hover{text-decoration-color:var(--text)}
/* ── FORMS ── */
input,select,textarea{font-family:inherit;font-size:13px;color:var(--text);background:var(--bg2);border:0.5px solid var(--border2);border-radius:8px;padding:7px 10px;outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--text)}
textarea{resize:vertical;width:100%}
/* ── STATUS TABS ── */
.status-tabs{display:flex;gap:0;overflow-x:auto;border-bottom:0.5px solid var(--border);background:var(--bg2);padding:0 1rem;flex-shrink:0}
.status-tab{padding:10px 12px;font-size:12px;cursor:pointer;color:var(--text2);border-bottom:3px solid transparent;white-space:nowrap;flex-shrink:0;user-select:none;transition:color .12s,border-color .12s}
.status-tab:hover{color:var(--text)}
.status-tab.active{color:var(--text);font-weight:500}
.tab-cnt{font-size:11px;margin-left:4px;font-weight:600;color:var(--text2)}
/* ── TOPBAR ── */
.topbar{display:flex;align-items:center;gap:8px;padding:.65rem 1rem;background:var(--bg2);border-bottom:0.5px solid var(--border);flex-shrink:0;flex-wrap:wrap}
.topbar input,.topbar select{font-size:12px;padding:6px 9px}
/* ── MODAL ── */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:200;align-items:center;justify-content:center;padding:1rem}
.modal-bg.open{display:flex}
.modal{background:var(--bg2);border-radius:12px;max-height:92vh;overflow-y:auto;display:flex;flex-direction:column;border:0.5px solid var(--border)}
.modal-hdr{display:flex;align-items:center;gap:10px;padding:1rem 1.25rem;border-bottom:0.5px solid var(--border);flex-shrink:0;position:sticky;top:0;background:var(--bg2);z-index:5}
.modal-title{font-size:14px;font-weight:600}
.modal-close{margin-left:auto;background:none;border:none;font-size:20px;color:var(--text2);cursor:pointer;line-height:1;padding:2px 6px}
.modal-close:hover{color:var(--text)}
.modal-footer{padding:.75rem 1.25rem;border-top:0.5px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;bottom:0;background:var(--bg2)}
.m-section-title{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;padding-bottom:6px;border-bottom:0.5px solid var(--border);margin-bottom:.5rem}
.m-label{font-size:11px;color:var(--text2);margin-bottom:3px;display:block}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
/* ── PROFIT ── */
.pos{color:#166534;font-weight:500}
.neg{color:#991b1b;font-weight:500}
[data-theme="dark"] .pos{color:#51cf66}
[data-theme="dark"] .neg{color:#ff6b6b}
/* ── BATCH ROW ── */
.batch-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:20px;font-size:11px}
.chip-cur{background:#dcfce7;color:#166534}
.chip-queue{background:#fef9c3;color:#92400e}
.chip-done{background:var(--bg3);color:var(--text2)}
[data-theme="dark"] .chip-cur{background:#1a3328;color:#69db7c}
[data-theme="dark"] .chip-queue{background:#332e18;color:#ffd43b}
/* ── WEBOOK BAR ── */
.wh-bar{background:var(--bg2);border-top:0.5px solid var(--border);padding:.4rem 1rem;display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text2);flex-shrink:0}
.wh-dot{width:7px;height:7px;border-radius:50%;background:#1D9E75;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
/* ── STAT FILTER ── */
.filter-row{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}
.filter-group{display:flex;flex-direction:column;gap:3px}
.filter-group label{font-size:11px;color:var(--text2)}
.filter-group input,.filter-group select{font-size:12px;padding:6px 9px}
.range-btn{padding:6px 10px;border:0.5px solid var(--border2);border-radius:8px;background:transparent;font-size:11px;cursor:pointer;color:var(--text2);font-family:inherit}
.range-btn.active{background:var(--text);color:var(--bg2);border-color:var(--text)}
.chart-legend{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:8px;font-size:11px;color:var(--text2)}
.leg-dot{width:10px;height:10px;border-radius:2px;display:inline-block;margin-right:3px;flex-shrink:0}
.page-title{font-size:16px;font-weight:600}
.page-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;flex-shrink:0}
.section-gap{display:flex;flex-direction:column;gap:1rem;padding:0 1.25rem 1.25rem}
.prod-tbl th{font-size:10px;font-weight:500;color:var(--text2);padding:5px 8px;border-bottom:0.5px solid var(--border);text-align:left}
.prod-tbl td{padding:6px 8px;border-bottom:0.5px solid var(--border);font-size:12px}
.prod-tbl tr:last-child td{border-bottom:none}
.ttn-chip{display:inline-flex;align-items:center;font-size:11px;color:var(--text2);background:var(--bg3);padding:3px 8px;border-radius:6px}
.np-chip{display:inline-flex;align-items:center;font-size:10px;padding:2px 7px;border-radius:5px;font-weight:500;white-space:nowrap}
.wh-item{padding:7px 12px;cursor:pointer;font-size:12px;border-bottom:0.5px solid var(--border);line-height:1.4;transition:background .1s}
.wh-item:last-child{border-bottom:none}
.wh-item:hover{background:var(--bg3)}
.np-chip-wait{background:#f1f3f5;color:#868e96}
.np-chip-transit{background:#fff3bf;color:#e67700}
.np-chip-arrived{background:#d3f9d8;color:#1c7c36}
.np-chip-delivered{background:#d0ebff;color:#1864ab}
.np-chip-refused{background:#ffe3e3;color:#c92a2a}
.np-chip-back{background:#f3d9fa;color:#7c309a}
[data-theme="dark"] .np-chip-wait{background:#373a40;color:#adb5bd}
[data-theme="dark"] .np-chip-transit{background:#3d3000;color:#fcc419}
[data-theme="dark"] .np-chip-arrived{background:#0d2e10;color:#6fcf97}
[data-theme="dark"] .np-chip-delivered{background:#0c1f35;color:#74c0fc}
[data-theme="dark"] .np-chip-refused{background:#3b0a0a;color:#ff8787}
[data-theme="dark"] .np-chip-back{background:#2d0a3e;color:#cc5de8}
/* ── Modules ── */
.modules-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;padding:1.25rem}
.module-card{background:var(--bg2);border:0.5px solid var(--border);border-radius:12px;padding:1rem;display:flex;flex-direction:column;gap:.6rem}
.module-card-head{display:flex;align-items:center;gap:.6rem}
.module-logo{width:36px;height:36px;border-radius:8px;object-fit:contain;background:#fff;border:0.5px solid var(--border);padding:2px}
.module-name{font-weight:600;font-size:14px}
.module-badge-on{font-size:10px;background:#d3f9d8;color:#1c7c36;padding:2px 8px;border-radius:20px;font-weight:500}
.module-badge-off{font-size:10px;background:#f1f3f5;color:#868e96;padding:2px 8px;border-radius:20px;font-weight:500}
[data-theme="dark"] .module-badge-on{background:#0d2e10;color:#6fcf97}
[data-theme="dark"] .module-badge-off{background:#373a40;color:#adb5bd}
.module-desc{font-size:12px;color:var(--text2);line-height:1.5}
.wh-log-row{font-size:11px;padding:4px 8px;background:var(--bg3);border-radius:6px;display:flex;gap:8px}
.wh-ok{color:#1D9E75}
[data-theme="dark"] .wh-ok{color:#51cf66}
.wh-t{color:var(--text3)}
.empty-msg{text-align:center;padding:2rem;font-size:13px;color:var(--text2)}
/* ── STATS ── */
#page-stats{display:none;flex-direction:column;flex:1;overflow:hidden}
#page-stats.active{display:flex}
.stats-layout{display:flex;height:100%;overflow:hidden}
/* Filter sidebar */
.stats-sidebar{width:256px;flex-shrink:0;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden}
.stats-sidebar-hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 12px;border-bottom:1px solid var(--border);flex-shrink:0}
.stats-sidebar-hdr-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--text)}
.stats-sidebar-hdr svg{width:15px;height:15px;stroke:var(--accent);fill:none;stroke-width:2}
.stats-sidebar-body{flex:1;overflow-y:auto;padding:0;scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.stats-sidebar-ftr{flex-shrink:0;padding:10px 14px;border-top:1px solid var(--border)}
.sf-section{padding:12px 18px;border-bottom:1px solid rgba(0,0,0,.05)}
.sf-section:last-child{border-bottom:none}
.sf-section-compact{display:flex;flex-direction:column;gap:5px}
.sf-section-label{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:7px}
.sf-ctrl{width:100%;padding:6px 10px;font-size:12.5px;font-family:inherit;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);outline:none;transition:border-color .15s,box-shadow .15s}
.sf-ctrl:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(227,30,36,.08)}
.sf-ctrl:hover{border-color:var(--border2)}
select.sf-ctrl{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:28px;background-color:var(--bg)}
.sf-date-row{display:flex;align-items:center;gap:6px;margin-top:6px}
.sf-date-row .sf-ctrl{flex:1;min-width:0;padding:5px 6px;font-size:11.5px;text-align:center}
.sf-date-sep{color:var(--text3);font-size:12px;flex-shrink:0}
.sf-quick{display:flex;gap:5px;flex-wrap:wrap;margin-top:7px}
.sf-qbtn{padding:3px 10px;border:1px solid var(--border);border-radius:20px;background:transparent;font-size:11px;font-weight:500;cursor:pointer;color:var(--text2);font-family:inherit;transition:all .15s}
.sf-qbtn:hover{background:var(--bg3);border-color:var(--border2);color:var(--text)}
.sf-qbtn.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.sf-reset-btn{width:100%;padding:7px;border:1px solid var(--border);border-radius:8px;background:transparent;font-size:12px;font-weight:500;cursor:pointer;color:var(--text2);font-family:inherit;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:6px}
.sf-reset-btn:hover{background:#FEF2F2;color:#991b1b;border-color:#FECACA}
/* Status multiselect dropdown */
.status-dd-wrap{position:relative}
.status-dd-trigger{width:100%;display:flex;align-items:center;gap:7px;padding:6px 10px;background:var(--bg);border:1px solid var(--border);border-radius:8px;cursor:pointer;font-family:inherit;font-size:12.5px;color:var(--text);text-align:left;transition:border-color .15s}
.status-dd-trigger:hover{border-color:var(--border2)}
.status-dd-trigger.open{border-color:var(--accent);box-shadow:0 0 0 3px rgba(227,30,36,.08)}
.status-dd-dots{display:flex;gap:3px;flex-shrink:0}
.status-dd-dots span{width:7px;height:7px;border-radius:50%;display:block}
.status-dd-trigger>span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-dd-trigger svg{width:14px;height:14px;fill:none;stroke:var(--text3);stroke-width:2.5;flex-shrink:0;transition:transform .2s}
.status-dd-trigger.open svg{transform:rotate(180deg)}
.status-dd-panel{display:none;position:absolute;top:calc(100% + 5px);left:0;right:0;background:var(--bg2);border:1px solid var(--border);border-radius:10px;box-shadow:0 4px 16px rgba(0,0,0,.1);z-index:200;overflow:hidden}
.status-dd-panel.open{display:block}
.status-dd-actions{display:flex;border-bottom:1px solid var(--border);padding:4px 6px;gap:5px}
.status-dd-actions button{flex:1;padding:3px 0;border:1px solid var(--border);border-radius:5px;background:transparent;font-size:11px;font-weight:500;color:var(--text2);cursor:pointer;font-family:inherit;transition:all .12s}
.status-dd-actions button:hover{background:var(--bg3);color:var(--text)}
.status-dd-list{padding:3px 4px}
.sd-item{display:flex;align-items:center;gap:7px;padding:3px 6px;border-radius:5px;cursor:pointer;transition:background .1s;user-select:none}
.sd-item:hover{background:var(--bg3)}
.sd-chk{width:13px;height:13px;flex-shrink:0;border:1.5px solid var(--border2);border-radius:3px;display:flex;align-items:center;justify-content:center;background:var(--bg2);transition:all .15s}
.sd-chk.on{border-color:var(--accent);background:var(--accent)}
.sd-chk.on::after{content:'';display:block;width:3px;height:6px;border-right:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(45deg) translate(-1px,-1px)}
.sd-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.sd-name{font-size:11.5px;color:var(--text);flex:1}
.sd-cnt{font-size:10.5px;color:var(--text3);background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:0 5px}
/* Right area */
.stats-right{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.stats-topbar{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;background:var(--bg2);border-bottom:1px solid var(--border);flex-shrink:0}
.stats-chart-title{font-size:16px;font-weight:700;color:var(--text);letter-spacing:-.2px}
.stats-chart-wrap{flex:none;display:flex;padding:14px 300px 14px 14px}
.st-chart-block{flex:1;display:flex;flex-direction:column;min-height:0;min-width:0;background:var(--bg2);border-radius:12px;border:1px solid var(--border);overflow:hidden}
.st-chart-top{height:480px;flex-shrink:0;display:flex;min-height:0}
.st-chart-canvas{position:relative;flex:1;min-width:0;padding:14px;min-height:0}
.st-chart-canvas canvas{position:absolute;inset:14px;width:calc(100% - 28px)!important;height:calc(100% - 28px)!important}
.st-chart-divider{width:1px;background:var(--border);flex-shrink:0;margin:10px 0}
.st-legend{width:156px;flex-shrink:0;padding:10px 8px;overflow-y:auto;display:flex;flex-direction:column;gap:1px}
.st-leg-title{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;padding:0 4px}
.st-leg-item{display:flex;align-items:center;gap:7px;padding:4px 6px;border-radius:6px;cursor:default;transition:background .1s}
.st-leg-item:hover{background:var(--bg3)}
.st-leg-dot{width:14px;height:14px;border-radius:4px;flex-shrink:0}
.st-leg-pct{font-size:12px;font-weight:700;color:var(--text);flex-shrink:0;min-width:34px;text-align:right}
.st-leg-label{font-size:12px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.st-leg-cnt{display:none}
.st-nav-wrap{height:52px;flex-shrink:0;padding:6px 14px 8px}
.st-nav-inner{height:100%;background:var(--bg2);border-radius:8px;border:1px solid var(--border);padding:3px 8px;position:relative}
.st-nav-inner canvas{position:absolute;inset:3px 8px;width:calc(100% - 16px)!important;height:calc(100% - 6px)!important}
/* Mobile filter toggle button */
.stats-mob-filter-btn{display:none;align-items:center;gap:6px;padding:6px 11px;background:var(--bg3);border:1px solid var(--border);border-radius:8px;font-size:12px;font-weight:500;color:var(--text2);cursor:pointer;flex-shrink:0}
.stats-mob-filter-btn svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0}
.stats-mob-filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}
/* ── Mobile portrait ── */
@media(max-width:767px){
  #page-stats{height:auto;overflow:visible}
  .stats-layout{flex-direction:column;height:auto;overflow:visible}
  .stats-sidebar{width:100%;border-right:none;border-bottom:1px solid var(--border);max-height:0;overflow:hidden;transition:max-height .3s ease}
  .stats-sidebar.mob-open{max-height:80vh;overflow-y:auto}
  .stats-mob-filter-btn{display:flex}
  .stats-right{overflow:visible}
  .stats-topbar{padding:10px 12px;flex-wrap:wrap;gap:8px}
  .stats-chart-title{font-size:14px}
  .stats-chart-wrap{padding:10px 10px 0;flex:none}
  .st-chart-block{border-radius:10px}
  .st-chart-top{flex-direction:column}
  .st-chart-canvas{height:230px;flex:none;padding:10px}
  .st-chart-canvas canvas{inset:10px;width:calc(100% - 20px)!important;height:calc(100% - 20px)!important}
  .st-chart-divider{width:auto;height:1px;margin:0 10px}
  .st-legend{width:auto;flex-direction:row;flex-wrap:wrap;padding:8px 10px;gap:4px 10px;overflow-y:visible}
  .st-leg-title{width:100%;margin-bottom:2px}
  .st-leg-item{flex:0 0 auto}
  .stats-cards{grid-template-columns:repeat(2,1fr)}
  .sum-card:nth-child(2){border-right:none}
  .sum-card:nth-child(3),.sum-card:nth-child(4){border-top:1px solid var(--border)}
  .sum-card:nth-child(4){border-right:none}
  .sum-card{padding:12px 14px}
  .sum-card-main{font-size:20px}
}
/* ── Mobile landscape (телефон горизонтально) ── */
@media(max-width:1024px) and (orientation:landscape) and (max-height:500px){
  /* Повертаємо desktop-розкладку але компактну */
  #page-stats{height:100%;overflow:hidden}
  .stats-layout{flex-direction:row;height:100%;overflow:hidden}
  .stats-sidebar{width:190px;max-height:none;border-right:1px solid var(--border);border-bottom:none;overflow-y:auto}
  .stats-sidebar.mob-open{max-height:none}
  .stats-mob-filter-btn{display:none}
  .stats-right{overflow:hidden}
  .stats-topbar{padding:7px 12px}
  .stats-chart-title{font-size:13px}
  .stats-chart-wrap{padding:7px 8px 0;flex:1}
  .st-chart-block{border-radius:8px}
  .st-chart-top{flex-direction:row;height:180px}
  .st-chart-canvas{height:auto;flex:1;padding:8px}
  .st-chart-canvas canvas{inset:8px;width:calc(100% - 16px)!important;height:calc(100% - 16px)!important}
  .st-chart-divider{width:1px;height:auto;margin:8px 0}
  .st-legend{width:110px;flex-direction:column;flex-wrap:nowrap;overflow-y:auto;padding:8px 6px}
  .st-leg-title{width:auto;margin-bottom:4px}
  .st-leg-item{flex:none}
  .stats-cards{grid-template-columns:repeat(4,1fr)}
  .sum-card:nth-child(2){border-right:1px solid var(--border)}
  .sum-card:nth-child(3),.sum-card:nth-child(4){border-top:none}
  .sum-card:nth-child(4){border-right:none}
  .sum-card{padding:7px 10px}
  .sum-card-main{font-size:16px;margin-bottom:4px}
  .sum-card-hdr{margin-bottom:4px}
  .sum-row{padding:1px 0;font-size:11px}
}
/* KPI cards */
.stats-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:0;flex-shrink:0;border-top:1px solid var(--border)}
.sum-card{padding:14px 18px;border-right:1px solid var(--border)}
.sum-card:last-child{border-right:none}
.sum-card-hdr{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sum-card-ico{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sum-card-ico svg{width:16px;height:16px;fill:none;stroke-width:1.8}
.sum-card-title{font-size:12px;font-weight:500;color:var(--text2)}
.sum-card-main{font-size:26px;font-weight:700;color:var(--text);margin-bottom:10px;line-height:1;letter-spacing:-.4px}
.sum-card-main.accent{color:var(--accent)}
.sum-row{display:flex;align-items:center;justify-content:space-between;padding:3px 0;border-top:1px solid rgba(0,0,0,.04)}
.sum-row:first-child{border-top:none}
.sum-label{font-size:11px;color:var(--text3)}
.sum-val{font-size:11.5px;font-weight:600;color:var(--text)}
.sum-pct{font-size:11px;font-weight:600;color:#16a34a;background:#F0FDF4;border-radius:20px;padding:1px 7px}
/* KPI cards */
.stats-kpi-cards{display:flex;gap:12px;padding:14px;flex-shrink:0;border-top:1px solid var(--border);background:var(--bg3)}
.kpi-card{flex:1;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:16px}
.kpi-card-hdr{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.kpi-card-ico{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.kpi-card-ico svg{width:18px;height:18px;fill:none;stroke-width:1.8}
.kpi-card-title{font-size:13px;font-weight:600;color:var(--text2)}
.kpi-card-big{font-size:24px;font-weight:700;color:var(--text);letter-spacing:-.5px;margin-bottom:8px}
.kpi-card-row{display:flex;justify-content:space-between;font-size:11.5px;padding:3px 0;border-top:1px solid var(--border)}
.kpi-card-lbl{color:var(--text3)}
.kpi-card-dash{color:var(--border);justify-content:flex-start}
.kpi-metrics-strip{background:var(--bg3);padding:0 14px 14px;flex-shrink:0}
.kpi-metrics-inner{display:flex;align-items:center;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:12px 16px}
.kpi-metric{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.kpi-metric-lbl{font-size:11px;color:var(--text3);white-space:nowrap}
.kpi-metric-val{font-size:17px;font-weight:700;color:var(--text);letter-spacing:-.3px}
.kpi-metric-sep{width:1px;height:36px;background:var(--border);flex-shrink:0;margin:0 8px}
.chart-type-btn{padding:5px 11px;border:1px solid var(--border);background:transparent;border-radius:7px;cursor:pointer;font-size:12px;font-weight:500;color:var(--text2);font-family:inherit;transition:all .12s;display:flex;align-items:center;gap:5px}
.chart-type-btn svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2}
.chart-type-btn.active{background:var(--text);color:var(--bg2);border-color:var(--text)}
.chart-type-btn:first-child{border-radius:7px 0 0 7px;border-right:none}
.chart-type-btn:last-child{border-radius:0 7px 7px 0}

/* ═══════════════════════════════════════════════════
   PRO-LINE THEME  — light default, dark override
   ═══════════════════════════════════════════════════ */

/* ── LIGHT (default) ── */
:root{
  --bg:#F5F6F8;--bg2:#FFFFFF;--bg3:#F2F4F7;--bg4:#EEF0F3;
  --text:#111827;--text2:#4B5563;--text3:#6B7280;--text4:#9CA3AF;
  --border:#E5E7EB;--border2:#D1D5DB;
  --shadow:rgba(0,0,0,0.08);--shadow2:rgba(0,0,0,0.04);
  --accent:#E31E24;--accent-h:#F43F46;--accent-d:#B91C1C;--accent-soft:rgba(227,30,36,0.08);--accent-border:rgba(227,30,36,0.18);
  --sidebar-bg:#FFFFFF;--topbar-bg:#FFFFFF;
  --tbl-bg:#FFFFFF;--tbl-head:#F2F4F7;--input-bg:#FFFFFF;
  --nav-text:#4B5563;--nav-active-bg:rgba(227,30,36,0.07);
  --sidebar:220px;
}

/* ── DARK override ── */
[data-theme="dark"]{
  --bg:#0F1115;--bg2:#12161C;--bg3:#1D232B;--bg4:#171C23;
  --text:#F3F4F6;--text2:#A1A7B3;--text3:#6B7280;--text4:#4B5563;
  --border:rgba(255,255,255,0.07);--border2:#2A3038;
  --shadow:rgba(0,0,0,0.6);--shadow2:rgba(0,0,0,0.3);
  --accent:#E31E24;--accent-h:#F43F46;--accent-d:#B91C1C;--accent-soft:rgba(227,30,36,0.12);--accent-border:rgba(227,30,36,0.25);
  --sidebar-bg:#11151B;--topbar-bg:#12161C;
  --tbl-bg:#0F1115;--tbl-head:#12161C;--input-bg:#0F1115;
  --nav-text:#A1A7B3;--nav-active-bg:rgba(227,30,36,0.12);
}

body{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--text)}

/* ── AUTH ── */
.login-card{background:var(--bg2);border:1px solid var(--border);border-radius:14px;box-shadow:0 8px 40px var(--shadow)}
.login-logo{font-size:22px;font-weight:700;color:var(--text);letter-spacing:-.5px}
.f-inp{background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:13px}
.f-inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.btn-dark{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important;border-radius:10px!important;font-weight:500!important}
.btn-dark:hover{background:var(--accent-h)!important;border-color:var(--accent-h)!important}

/* ── SIDEBAR ── */
.sidebar{
  width:60px;background:var(--sidebar-bg);
  border-right:1px solid var(--border);
  position:absolute;top:0;left:0;bottom:0;
  z-index:10;overflow:hidden;
  transition:width .22s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;
}
.sidebar:hover{width:220px}
.content{margin-left:60px}
.sb-logo{
  padding:0 11px;height:60px;
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:12px;
  flex-shrink:0;overflow:hidden;
}
.sb-logo-img{width:36px;height:36px;flex-shrink:0;object-fit:contain}
.sb-logo-name{
  font-size:16px;font-weight:700;color:var(--text);
  white-space:nowrap;letter-spacing:-.3px;
  opacity:0;transition:opacity .15s;
}
.sidebar:hover .sb-logo-name{opacity:1;transition:opacity .2s .06s}
.nav-item{
  display:flex;align-items:center;height:36px;
  padding:0;cursor:pointer;
  border-left:2.5px solid transparent;
  transition:background .12s,border-color .12s;
  user-select:none;overflow:hidden;flex-shrink:0;
}
.nav-item:hover{background:var(--bg3);border-left-color:var(--border2)}
.nav-item.active{
  background:var(--nav-active-bg);
  border-left-color:var(--accent);
}
/* icon zone — fixed 58px = collapsed sidebar width */
.nav-icon{
  width:58px;height:36px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  color:var(--text3);transition:color .12s;
}
.nav-item:hover .nav-icon{color:var(--text2)}
.nav-item.active .nav-icon{color:var(--accent)}
.nav-icon svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
/* label — slides in */
.nav-label{
  font-size:13px;font-weight:400;
  color:var(--text2);white-space:nowrap;
  opacity:0;transform:translateX(-6px);
  transition:opacity .15s,transform .15s;
  flex:1;padding-right:12px;
}
.nav-item:hover .nav-label{color:var(--text)}
.nav-item.active .nav-label{color:var(--accent);font-weight:600}
.sidebar:hover .nav-label{
  opacity:1;transform:translateX(0);
  transition:opacity .2s .07s,transform .2s .07s;
}
/* ── Settings submenu ── */
.nav-chevron{
  width:32px;height:36px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .15s,transform .2s;
}
.sidebar:hover .nav-chevron{opacity:1;transition:opacity .2s .07s,transform .2s;}
.nav-item.sb-open .nav-chevron{transform:rotate(90deg)}
.nav-sub{
  overflow:hidden;max-height:0;
  transition:max-height .25s ease;
  background:var(--bg3);
}
.nav-sub.open{max-height:600px}
.sidebar:not(:hover) .nav-sub{max-height:0!important;transition:max-height .15s ease}
.nav-sub-item{
  display:flex;align-items:center;height:30px;
  padding-left:0;cursor:pointer;
  border-left:2.5px solid transparent;
  transition:background .12s,border-color .12s;
  user-select:none;overflow:hidden;flex-shrink:0;
}
.nav-sub-item:hover{background:var(--bg2);border-left-color:var(--border2)}
.nav-sub-item.active{background:var(--bg2);border-left-color:var(--accent)}
.nav-sub-icon{
  width:58px;height:30px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  color:var(--text3);transition:color .12s;
}
.nav-sub-icon svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav-sub-icon img{width:15px;height:15px;opacity:.55;transition:opacity .12s}
.nav-sub-item:hover .nav-sub-icon{color:var(--text2)}
.nav-sub-item:hover .nav-sub-icon img{opacity:.85}
.nav-sub-item.active .nav-sub-icon{color:var(--accent)}
.nav-sub-item.active .nav-sub-icon img{opacity:1}
.nav-sub-label{
  font-size:12px;font-weight:400;color:var(--text2);
  white-space:nowrap;opacity:0;transform:translateX(-6px);
  transition:opacity .15s,transform .15s;
}
.nav-sub-item:hover .nav-sub-label{color:var(--text)}
.nav-sub-item.active .nav-sub-label{color:var(--accent);font-weight:600}
.sidebar:hover .nav-sub-label{opacity:1;transform:translateX(0);transition:opacity .2s .07s,transform .2s .07s;}
.sb-footer{
  margin-top:auto;padding:12px;
  border-top:1px solid var(--border);
  opacity:0;pointer-events:none;
  white-space:nowrap;overflow:hidden;
  transition:opacity .15s;
}
.sidebar:hover .sb-footer{opacity:1;pointer-events:auto;transition:opacity .2s .06s}
.sb-user{font-weight:600;font-size:13px;color:var(--text);margin-bottom:8px}
.theme-toggle{
  background:var(--bg3);border:1px solid var(--border);border-radius:8px;
  color:var(--text2);font-size:11px;font-family:'Inter',sans-serif;
  padding:6px 10px;margin-bottom:6px;width:100%;
  display:flex;align-items:center;justify-content:space-between;cursor:pointer;
  transition:all .12s;
}
.theme-toggle:hover{border-color:var(--border2);color:var(--text)}
.theme-track{background:var(--border2);border-radius:8px}
.theme-track.on{background:var(--accent)}
.trash-nav-badge{
  background:var(--accent);color:#fff;
  border-radius:10px;font-size:10px;
  padding:1px 6px;margin-left:4px;font-weight:600;
}

/* ── TOPBAR ── */
.app-topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 20px;height:60px;
  background:var(--topbar-bg);border-bottom:1px solid var(--border);
  flex-shrink:0;position:sticky;top:0;z-index:5;
  box-shadow:0 1px 4px var(--shadow2);
}
.app-topbar-title{font-size:22px;font-weight:700;color:var(--text);letter-spacing:-.4px}
.app-topbar-right{display:flex;align-items:center;gap:6px}
.tb-icon-btn{
  width:36px;height:36px;border-radius:10px;
  background:transparent;border:1px solid var(--border);
  color:var(--text3);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .12s;position:relative;
}
.tb-icon-btn:hover{background:var(--bg3);border-color:var(--border2);color:var(--text)}
.tb-icon-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.tb-notif-dot{
  position:absolute;top:6px;right:6px;
  width:8px;height:8px;border-radius:50%;
  background:var(--accent);border:2px solid var(--topbar-bg);
}
.tb-badge-num{
  position:absolute;top:-4px;right:-4px;
  background:var(--accent);color:#fff;
  font-size:9px;font-weight:700;border-radius:9px;
  padding:1px 5px;min-width:16px;text-align:center;
  border:1.5px solid var(--topbar-bg);line-height:1.4;
}
.tb-avatar{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,#E31E24,#8B0000);
  display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:700;color:#fff;cursor:pointer;
  border:2px solid var(--border);margin-left:4px;position:relative;
}
.tb-avatar-dot{
  position:absolute;bottom:1px;right:1px;
  width:9px;height:9px;border-radius:50%;
  background:#22c55e;border:2px solid var(--topbar-bg);
}

/* ── PAGE HEADER ── */
.page-header{
  padding:.75rem 1.25rem;background:var(--bg2);
  border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  flex-shrink:0;
}
.page-title{font-size:15px;font-weight:600;color:var(--text)}

/* ── STATUS TABS ── */
.status-tabs{
  display:flex;align-items:center;gap:6px;
  padding:10px 16px;background:var(--bg2);
  border-bottom:1px solid var(--border);
  overflow-x:auto;flex-shrink:0;
  scrollbar-width:thin;scrollbar-color:var(--border2) transparent;
}
.status-tabs::-webkit-scrollbar{height:3px}
.status-tabs::-webkit-scrollbar-track{background:transparent}
.status-tabs::-webkit-scrollbar-thumb{background:var(--border2);border-radius:4px}
/* pill tabs — colors injected via inline style from STATUS_BG/STATUS_FG */
.status-tab{
  display:inline-flex;align-items:center;gap:5px;
  padding:0 10px;height:28px;border-radius:6px;
  font-size:12px;font-weight:500;
  cursor:pointer;border:1px solid transparent;
  white-space:nowrap;flex-shrink:0;
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;
  user-select:none;line-height:1;
}
.status-tab:hover{
  transform:translateY(-1px);
  filter:brightness(0.88) saturate(1.1);
  box-shadow:0 4px 12px rgba(17,24,39,0.12);
}
.status-tab:active{transform:translateY(0);filter:brightness(0.82)}
/* count — просто число після назви */
.status-tab-cnt{
  font-size:12px;font-weight:600;
  color:inherit;opacity:.85;
}
/* zero-count tab — slightly faded */
.status-tab.empty{opacity:.5}

/* ── FILTER TOPBAR ── */
.topbar{
  display:flex;align-items:center;gap:8px;
  padding:.6rem 1rem;background:var(--bg2);
  border-bottom:1px solid var(--border);
  flex-shrink:0;flex-wrap:wrap;
}
.topbar input,.topbar select{
  background:var(--input-bg);border:1px solid var(--border);
  border-radius:8px;color:var(--text);font-size:12px;
  padding:6px 9px;font-family:'Inter',sans-serif;transition:border-color .12s;
}
.topbar input:focus,.topbar select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px var(--accent-soft)}
.topbar input::placeholder{color:var(--text4)}

/* ── BUTTONS ── */
.btn{
  background:var(--bg2);border:1px solid var(--border);
  border-radius:8px;color:var(--text2);
  font-size:12px;font-family:'Inter',sans-serif;
  padding:6px 12px;transition:all .12s;cursor:pointer;
  display:inline-flex;align-items:center;gap:5px;
}
.btn:hover{background:var(--bg3);border-color:var(--border2);color:var(--text)}
.btn-dark{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important;border-radius:10px!important;font-weight:500!important}
.btn-dark:hover{background:var(--accent-h)!important;border-color:var(--accent-h)!important;opacity:1!important}
.btn-danger{background:rgba(239,68,68,.08);color:#DC2626;border-color:rgba(239,68,68,.18)}
.btn-danger:hover{background:rgba(239,68,68,.15);color:#B91C1C}
[data-theme="dark"] .btn-danger{background:#7f1d1d;color:#fca5a5;border-color:#991b1b}
[data-theme="dark"] .btn-danger:hover{background:#991b1b;color:#fff}
.btn-success{background:rgba(22,163,74,.08);color:#16A34A;border-color:rgba(22,163,74,.18)}
.btn-success:hover{background:rgba(22,163,74,.15);color:#15803D}
[data-theme="dark"] .btn-success{background:rgba(22,101,52,.2);color:#4ade80;border-color:rgba(74,222,128,.2)}
[data-theme="dark"] .btn-success:hover{background:rgba(22,101,52,.35);color:#86efac}

/* ── CARDS ── */
.card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:1rem 1.25rem;box-shadow:0 1px 3px var(--shadow2)}
.stat-card{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:.85rem 1rem;box-shadow:0 1px 3px var(--shadow2)}
[data-theme="dark"] .stat-card{background:var(--bg3);border-color:var(--border)}
.stat-label{color:var(--text2)}
.stat-value{color:var(--text)}
.stat-sub{color:var(--text3)}

/* ── TABLE ── */
thead{background:var(--tbl-head);position:sticky;top:0;z-index:2}
th{
  font-size:11px;font-weight:600;color:var(--text3);
  padding:5px 7px;border-bottom:1px solid var(--border);
  text-transform:uppercase;letter-spacing:.04em;
  white-space:nowrap;cursor:pointer;user-select:none;
}
th:hover{color:var(--text2)}
td{
  padding:0 8px;border-bottom:1px solid var(--border);
  font-size:13px;vertical-align:middle;
  height:16px;line-height:normal;min-height:16px;
  white-space:nowrap;color:var(--text2);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;
}
.ord-even td,.ord-odd td{background:transparent}
#orders-body tr td:nth-child(even){background:rgba(0,0,0,.025)}
#orders-body tr td:nth-child(odd){background:#fff}
[data-theme="dark"] #orders-body tr td:nth-child(even){background:rgba(255,255,255,.03)}
[data-theme="dark"] #orders-body tr td:nth-child(odd){background:transparent}
.ord-row:hover td{background:#eef1ff!important}
[data-theme="dark"] .ord-row:hover td{background:#1D232B!important}
.order-link{color:var(--text);font-weight:500;text-decoration:none;cursor:pointer}
.order-link:hover{color:var(--accent)}
.tbl-wrap{background:var(--tbl-bg)}

/* ── BADGES ── */
.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:6px;font-size:11px;font-weight:500;white-space:nowrap;border:1px solid transparent}
/* Light badges */
.s-0{background:rgba(107,114,128,.1);color:#374151}
.s-1{background:rgba(59,130,246,.1);color:#1E40AF}
.s-2{background:rgba(239,68,68,.1);color:#B91C1C}
.s-3{background:rgba(245,158,11,.12);color:#92400E}
.s-4{background:rgba(20,184,166,.1);color:#0F766E}
.s-5{background:rgba(139,92,246,.1);color:#6D28D9}
.s-6{background:rgba(249,115,22,.1);color:#C2410C}
.s-7{background:rgba(34,197,94,.1);color:#15803D}
.s-8{background:rgba(107,114,128,.08);color:#6B7280}
.s-9{background:rgba(249,115,22,.12);color:#C2410C}
/* Dark badges */
[data-theme="dark"] .s-0{background:rgba(107,114,128,.2);color:#9CA3AF}
[data-theme="dark"] .s-1{background:rgba(59,130,246,.15);color:#60A5FA}
[data-theme="dark"] .s-2{background:rgba(239,68,68,.15);color:#F87171}
[data-theme="dark"] .s-3{background:rgba(245,158,11,.15);color:#FCD34D}
[data-theme="dark"] .s-4{background:rgba(20,184,166,.15);color:#2DD4BF}
[data-theme="dark"] .s-5{background:rgba(168,85,247,.15);color:#C084FC}
[data-theme="dark"] .s-6{background:rgba(249,115,22,.15);color:#FB923C}
[data-theme="dark"] .s-7{background:rgba(34,197,94,.15);color:#4ADE80}
[data-theme="dark"] .s-8{background:rgba(107,114,128,.15);color:#9CA3AF}
[data-theme="dark"] .s-9{background:rgba(249,115,22,.2);color:#FB923C}

/* ── NP STATUS CHIPS ── */
.ttn-chip{background:var(--bg3);border:1px solid var(--border);color:var(--text2);border-radius:6px;padding:3px 8px;font-size:11px}
.chip-wait{background:rgba(107,114,128,.08);color:#6B7280;border-color:rgba(107,114,128,.15)}
.chip-transit{background:rgba(59,130,246,.08);color:#1D4ED8;border-color:rgba(59,130,246,.15)}
.chip-arrived{background:rgba(139,92,246,.08);color:#6D28D9;border-color:rgba(139,92,246,.15)}
.chip-delivered{background:rgba(34,197,94,.08);color:#15803D;border-color:rgba(34,197,94,.15)}
.chip-back{background:rgba(249,115,22,.08);color:#C2410C;border-color:rgba(249,115,22,.15)}
.chip-refused{background:rgba(239,68,68,.08);color:#DC2626;border-color:rgba(239,68,68,.15)}
[data-theme="dark"] .chip-wait{background:rgba(107,114,128,.15);color:#9CA3AF;border-color:rgba(107,114,128,.2)}
[data-theme="dark"] .chip-transit{background:rgba(59,130,246,.12);color:#60A5FA;border-color:rgba(59,130,246,.2)}
[data-theme="dark"] .chip-arrived{background:rgba(168,85,247,.12);color:#C084FC;border-color:rgba(168,85,247,.2)}
[data-theme="dark"] .chip-delivered{background:rgba(34,197,94,.12);color:#4ADE80;border-color:rgba(34,197,94,.2)}
[data-theme="dark"] .chip-back{background:rgba(249,115,22,.12);color:#FB923C;border-color:rgba(249,115,22,.2)}
[data-theme="dark"] .chip-refused{background:rgba(239,68,68,.12);color:#F87171;border-color:rgba(239,68,68,.2)}

/* ── COLUMN FILTERS ── */
.col-filter{
  background:var(--input-bg);border:1px solid var(--border);
  border-radius:5px;color:var(--text);font-size:11px;
  font-family:'Inter',sans-serif;width:100%;
  padding:4px 6px;margin-top:0;display:block;transition:border-color .12s;
}
.col-filter:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 2px var(--accent-soft)}
.sf-inp{background:var(--input-bg);border:1px solid var(--border);color:var(--text);font-size:11px;margin-top:0}
.sf-dd{background:var(--bg2);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px var(--shadow)}
.sf-srch{background:var(--bg3);border:1px solid var(--border);color:var(--text);font-size:11px}
.sf-opt{color:var(--text2)}
.sf-opt:hover,.sf-opt.active{background:var(--bg3);color:var(--text)}
.sf-opt.selected{color:var(--accent);font-weight:600}

/* ── FORM CONTROLS ── */
.form-ctrl{
  background:var(--input-bg);border:1px solid var(--border);
  border-radius:8px;color:var(--text);
  padding:7px 10px;font-size:13px;font-family:'Inter',sans-serif;
  transition:border-color .12s;width:100%;outline:none;
}
.form-ctrl:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
textarea.form-ctrl{min-height:60px;resize:vertical}

/* ── MODALS ── */
.modal-bg{background:rgba(0,0,0,.4)!important}
[data-theme="dark"] .modal-bg{background:rgba(0,0,0,.7)!important}
.modal{background:var(--bg2);border:1px solid var(--border);border-radius:14px;box-shadow:0 20px 60px var(--shadow)}
.modal-header{border-bottom:1px solid var(--border)}
.modal-close{background:transparent;border:none;color:var(--text3);font-size:18px;cursor:pointer;border-radius:6px;padding:4px 8px}
.modal-close:hover{background:var(--bg3);color:var(--text)}
.m-section-title{font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border);padding-bottom:6px;margin-bottom:8px}
.m-label{font-size:11px;color:var(--text3);display:block;margin-bottom:3px;margin-top:10px}
.modal input,.modal select,.modal textarea{
  background:var(--input-bg);border:1px solid var(--border);
  border-radius:8px;color:var(--text);
  padding:7px 10px;font-size:12px;font-family:'Inter',sans-serif;
  width:100%;outline:none;transition:border-color .12s;
}
.modal input:focus,.modal select:focus,.modal textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}
.modal select option{background:var(--bg2)}

/* ── WH BAR ── */
.wh-bar{background:var(--bg3);border-top:1px solid var(--border);padding:6px 16px;color:var(--text3);font-size:11px}
[data-theme="dark"] .wh-bar{background:#0d1117}
.wh-dot{background:#22c55e;box-shadow:0 0 6px #22c55e}

/* ── PAGINATION ── */
.pl-pagination{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 16px;background:var(--bg2);
  border-top:1px solid var(--border);flex-shrink:0;
  font-size:12px;color:var(--text3);
}
.pl-pg-btns{display:flex;align-items:center;gap:4px}
.pl-pg-btn{
  width:30px;height:30px;border-radius:7px;
  border:1px solid var(--border);background:var(--bg2);
  color:var(--text2);font-size:12px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .12s;font-family:'Inter',sans-serif;
}
.pl-pg-btn:hover{background:var(--bg3);border-color:var(--border2);color:var(--text)}
.pl-pg-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.pl-pg-btn:disabled{opacity:.3;cursor:not-allowed}
.pl-pg-select{
  background:var(--input-bg);border:1px solid var(--border);
  border-radius:7px;color:var(--text2);font-size:12px;
  padding:4px 8px;font-family:'Inter',sans-serif;cursor:pointer;
}

/* ── MISC ── */
.empty-msg{color:var(--text3);text-align:center;padding:3rem;font-size:13px}
.ord-pagination{display:flex;align-items:center;gap:6px;padding:8px 12px;border-top:1px solid var(--border);background:var(--bg2);flex-shrink:0;font-size:12px;color:var(--text2)}
.ord-pagination .pg-info{flex:1;color:var(--text3)}
.ord-pagination .pg-btn{padding:3px 9px;border:1px solid var(--border2);border-radius:4px;background:var(--bg);color:var(--text);font-size:12px;cursor:pointer;line-height:1.4}
.ord-pagination .pg-btn:hover:not(:disabled){background:var(--bg3)}
.ord-pagination .pg-btn:disabled{opacity:.4;cursor:default}
.ord-pagination .pg-btn.pg-active{background:var(--accent);color:#fff;border-color:var(--accent)}
.ord-pagination select.pg-size{padding:2px 4px;border:1px solid var(--border2);border-radius:4px;background:var(--bg);color:var(--text);font-size:12px;cursor:pointer}
.pos{color:#16A34A}
[data-theme="dark"] .pos{color:#4ADE80}
.neg{color:#DC2626}
[data-theme="dark"] .neg{color:#F87171}
.chip-cur{background:rgba(34,197,94,.08);color:#15803D}
.chip-queue{background:rgba(245,158,11,.1);color:#92400E}
[data-theme="dark"] .chip-cur{background:#1a3328;color:#69db7c}
[data-theme="dark"] .chip-queue{background:#332e18;color:#ffd43b}
.module-badge-on{background:rgba(34,197,94,.1);color:#15803D;border:1px solid rgba(34,197,94,.2)}
.module-badge-off{background:var(--bg3);color:var(--text3);border:1px solid var(--border)}
[data-theme="dark"] .module-badge-on{background:#0d2e10;color:#6fcf97}
[data-theme="dark"] .module-badge-off{background:#373a40;color:#adb5bd}
/* ─── TTN modal redesign ─── */
.ttn-modal-wrap{background:var(--bg2);border-radius:14px;border:0.5px solid var(--border);width:min(760px,99vw);max-height:96vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 8px 40px rgba(0,0,0,.13)}
.ttn-modal-header{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:0.5px solid var(--border);background:var(--bg2);flex-shrink:0}
.ttn-modal-header-left{display:flex;align-items:center;gap:.7rem}
.ttn-modal-icon{width:36px;height:36px;border-radius:10px;background:var(--accent-soft);border:1px solid var(--accent-border);display:flex;align-items:center;justify-content:center;color:var(--accent);flex-shrink:0}
.ttn-modal-title{font-size:14px;font-weight:600;color:var(--text);line-height:1.3}
.ttn-modal-sub{font-size:11px;color:var(--text3);margin-top:1px}
.ttn-modal-close{width:30px;height:30px;border-radius:8px;border:0.5px solid var(--border);background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text2);transition:all .12s}
.ttn-modal-close:hover{background:var(--bg3);color:var(--text)}
.ttn-modal-body{display:grid;grid-template-columns:1fr 1fr;gap:0;overflow-y:auto;flex:1}
.ttn-panel{display:flex;flex-direction:column;gap:.7rem;padding:1rem}
.ttn-panel:first-child{border-right:0.5px solid var(--border);background:var(--bg2)}
.ttn-panel:last-child{background:var(--bg3)}
.ttn-card{background:var(--bg2);border:0.5px solid var(--border);border-radius:10px;overflow:hidden}
.ttn-panel:last-child .ttn-card{background:var(--bg2);border-color:var(--border)}
.ttn-card-header{display:flex;align-items:center;gap:.5rem;padding:.55rem .8rem;background:var(--bg3);border-bottom:0.5px solid var(--border);font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.06em}
.ttn-panel:last-child .ttn-card-header{background:rgba(0,0,0,0.03)}
.ttn-card-icon{width:22px;height:22px;border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ttn-card-icon--sender{background:rgba(74,144,226,0.12);color:#3b82f6}
.ttn-card-icon--recipient{background:rgba(34,197,94,0.12);color:#16a34a}
.ttn-card-icon--delivery{background:var(--accent-soft);color:var(--accent)}
.ttn-card-icon--params{background:rgba(168,85,247,0.1);color:#9333ea}
.ttn-card-icon--dims{background:rgba(245,158,11,0.1);color:#d97706}
.ttn-fields{display:flex;flex-direction:column;gap:.5rem;padding:.7rem .8rem}
.ttn-field{display:flex;flex-direction:column;gap:3px}
.ttn-label{font-size:11px;color:var(--text2);font-weight:500}
.ttn-ctrl{width:100%;padding:6px 9px;border:0.5px solid var(--border2);border-radius:7px;font-size:12.5px;outline:none;background:var(--bg2);color:var(--text);font-family:inherit;transition:border-color .12s,box-shadow .12s}
.ttn-ctrl:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ttn-ctrl--accent{border-color:var(--accent-border);background:var(--accent-soft)}
.ttn-ctrl--accent:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.ttn-ctrl--icon{padding-left:28px}
.ttn-ctrl--dim{text-align:center}
.ttn-input-icon-wrap{position:relative}
.ttn-input-icon{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--text3);pointer-events:none}
.ttn-row-2{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.ttn-row-3{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.ttn-dims-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:4px;align-items:center}
.ttn-dim-sep{color:var(--text3);text-align:center;font-size:14px;padding:0 1px}
/* Service type pill buttons */
.ttn-service-pills{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}
.ttn-pill{display:flex;align-items:center;gap:5px;padding:6px 10px;border-radius:7px;border:0.5px solid var(--border2);background:var(--bg3);color:var(--text2);font-size:11.5px;font-weight:500;cursor:pointer;transition:all .15s;font-family:inherit;justify-content:center}
.ttn-pill:hover{border-color:var(--accent-border);color:var(--text);background:var(--bg2)}
.ttn-pill--active{background:var(--accent-soft);border-color:var(--accent-border);color:var(--accent);font-weight:600}
/* Footer */
.ttn-modal-footer{padding:.75rem 1rem;border-top:0.5px solid var(--border);background:var(--bg2);flex-shrink:0;display:flex;flex-direction:column;gap:.5rem}
.ttn-err-box{font-size:12px;color:#c92a2a;padding:7px 11px;background:#fff5f5;border:0.5px solid #ffc9c9;border-radius:7px;line-height:1.5}
[data-theme="dark"] .ttn-err-box{background:rgba(201,42,42,0.1);border-color:rgba(201,42,42,0.3);color:#ff8787}
.ttn-footer-actions{display:flex;gap:.5rem;justify-content:flex-end;align-items:center}
.ttn-footer-cod{display:flex;flex-direction:column;justify-content:center;margin-right:auto}
.ttn-footer-cod-lbl{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text3);line-height:1.2}
.ttn-footer-cod-val{font-size:20px;font-weight:700;color:var(--accent);letter-spacing:-.5px;line-height:1.2}
.ttn-btn-cancel{padding:7px 14px;border-radius:8px;border:0.5px solid var(--border2);background:transparent;color:var(--text2);font-size:12.5px;cursor:pointer;font-family:inherit;transition:all .12s}
.ttn-btn-cancel:hover{background:var(--bg3);color:var(--text)}
.ttn-btn-submit{display:inline-flex;align-items:center;gap:5px;padding:7px 16px;border-radius:8px;border:none;background:var(--accent);color:#fff;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:opacity .12s;box-shadow:0 2px 8px rgba(227,30,36,0.25)}
.ttn-btn-submit:hover{opacity:.88}
.ttn-info-btn{display:inline-flex;align-items:center;gap:3px;padding:3px 7px;border-radius:5px;border:0.5px solid var(--border2);background:var(--bg3);color:var(--text2);font-size:10px;font-weight:500;cursor:pointer;font-family:inherit;transition:all .12s;white-space:nowrap}
.ttn-info-btn:hover{background:var(--bg2);border-color:var(--accent-border);color:var(--accent)}
.ttn-btn-submit:active{opacity:.78}
/* Locked COD fields */
.ttn-ctrl:disabled{opacity:.7;cursor:not-allowed;background:var(--bg3)}
/* Street dropdown items */
.ttn-street-item{padding:7px 11px;cursor:pointer;border-bottom:0.5px solid var(--border);transition:background .1s}
.ttn-street-item:last-child{border-bottom:none}
.ttn-street-item:hover{background:var(--bg3)}
#ttn-street-status{display:inline-flex;align-items:center;gap:2px}
/* dark mode adjustments */
[data-theme="dark"] .ttn-modal-wrap{box-shadow:0 8px 40px rgba(0,0,0,.5)}
[data-theme="dark"] .ttn-card{background:var(--bg2)}
[data-theme="dark"] .ttn-panel:last-child{background:var(--bg3)}
[data-theme="dark"] .ttn-pill{background:var(--bg3);border-color:var(--border2)}
[data-theme="dark"] .ttn-ctrl--accent{background:rgba(227,30,36,0.07);border-color:rgba(227,30,36,0.2)}
.ttn-section-lbl{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text2);padding-bottom:5px;border-bottom:0.5px solid var(--border)}
#ttn-submit-btn{display:inline-flex;align-items:center;gap:5px}
/* ─── Module toggle switch ─── */
.mod-toggle{position:relative;display:inline-flex;align-items:center;width:44px;height:24px;cursor:pointer;flex-shrink:0}
.mod-toggle input{opacity:0;width:0;height:0;position:absolute}
.mod-toggle-track{position:absolute;inset:0;border-radius:24px;background:var(--border);transition:background .2s;border:1px solid rgba(0,0,0,.06)}
.mod-toggle input:checked~.mod-toggle-track{background:var(--accent)}
.mod-toggle-thumb{position:absolute;width:18px;height:18px;background:#fff;border-radius:50%;top:3px;left:3px;transition:left .18s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 4px rgba(0,0,0,.22)}
.mod-toggle input:checked~.mod-toggle-thumb{left:23px}
.module-card-head{display:flex;align-items:center;gap:.6rem}
.module-card-actions{display:flex;align-items:center;gap:.55rem;margin-left:auto}
/* ─── NP2 module styles ─── */
.np2-section-title{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text2);margin:.85rem 0 .35rem;padding-bottom:5px;border-bottom:0.5px solid var(--border)}
.np2-key-row{display:flex;align-items:center;gap:6px;padding:6px 10px;border:0.5px solid var(--border);border-radius:8px;background:var(--bg3);margin-bottom:4px}
.np2-key-row.active{border-color:var(--accent);background:var(--accent-soft)}
.np2-key-name{font-size:12.5px;font-weight:600;min-width:60px}
.np2-key-val{font-size:10.5px;color:var(--text2);flex:1;font-family:monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.np2-toggle-lbl{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer;padding:3px 0;user-select:none}
.np2-toggle-lbl input[type=checkbox]{width:15px;height:15px;cursor:pointer;accent-color:var(--accent)}
.np2-sm-row{display:grid;grid-template-columns:1fr 18px 1fr 1fr 26px;gap:5px;align-items:center;padding:4px 0;border-bottom:0.5px solid var(--border)}
.np2-sm-row:last-child{border-bottom:none}
.np2-sm-arrow{text-align:center;color:var(--text2);font-size:12px}
.np2-del-btn{background:none;border:none;cursor:pointer;color:#ef4444;font-size:16px;padding:0;line-height:1;opacity:.6}
.np2-del-btn:hover{opacity:1}
.np2-sm-hdr{display:grid;grid-template-columns:1fr 18px 1fr 1fr 26px;gap:5px;font-size:10px;color:var(--text2);font-weight:500;padding:0 0 3px;margin-top:4px}
.np2-select-icon{display:flex;align-items:center;gap:6px;width:100%;height:32px;border:0.5px solid var(--border2);border-radius:6px;background:var(--bg2);padding:0 8px;font-size:13px;cursor:pointer}
.np2-icon-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
/* ─── NP2 Sender cards ─── */
.np2-sender-card{border:0.5px solid var(--border);border-radius:8px;margin-bottom:6px;overflow:hidden}
.np2-sender-hdr{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--bg3);cursor:pointer;user-select:none}
.np2-sender-hdr:hover{background:var(--bg4,var(--bg3))}
.np2-sender-info{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.np2-sender-name-badge{font-size:13px;font-weight:600;color:var(--text)}
.np2-sender-cp{font-size:11px;color:var(--text2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.np2-sender-stats-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:130px}
.np2-sender-pct-bar{width:100%;height:4px;border-radius:2px;background:var(--border);overflow:hidden}
.np2-sender-pct-fill{height:100%;border-radius:2px;background:var(--accent);transition:width .3s}
.np2-sender-pct-text{font-size:10.5px;color:var(--text2);white-space:nowrap}
.np2-sender-ttn-count{font-size:10px;color:var(--text3)}
.np2-sender-body{padding:10px 12px;border-top:0.5px solid var(--border);background:var(--bg2)}
.np2-sender-form{display:flex;flex-direction:column;gap:.5rem}
.wh-ok{color:#16A34A}
[data-theme="dark"] .wh-ok{color:#51cf66}
.badge-admin{background:rgba(139,92,246,.1);color:#6D28D9}
.badge-mgr{background:rgba(59,130,246,.1);color:#1D4ED8}
[data-theme="dark"] .badge-admin{background:#281a38;color:#d0a8f0}
[data-theme="dark"] .badge-mgr{background:#1a2a38;color:#5cc8e8}
.np-chip-wait{background:rgba(107,114,128,.08);color:#6B7280}
.np-chip-transit{background:rgba(245,158,11,.1);color:#92400E}
.np-chip-arrived{background:rgba(139,92,246,.1);color:#6D28D9}
.np-chip-delivered{background:rgba(34,197,94,.1);color:#15803D}
.np-chip-refused{background:rgba(239,68,68,.1);color:#DC2626}
.np-chip-back{background:rgba(249,115,22,.1);color:#C2410C}
[data-theme="dark"] .np-chip-wait{background:#373a40;color:#adb5bd}
[data-theme="dark"] .np-chip-transit{background:#3d3000;color:#fcc419}
[data-theme="dark"] .np-chip-arrived{background:#0d2e10;color:#6fcf97}
[data-theme="dark"] .np-chip-delivered{background:#0c1f35;color:#74c0fc}
[data-theme="dark"] .np-chip-refused{background:#3b0a0a;color:#ff8787}
[data-theme="dark"] .np-chip-back{background:#2d0a3e;color:#cc5de8}

/* ── SCROLLBAR ── */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--text3)}

/* ─── Toast notifications ─────────────────────────────────────────────────── */
#toast-container{position:fixed;bottom:24px;right:24px;z-index:99999;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.toast{display:flex;align-items:flex-start;gap:10px;padding:13px 16px;border-radius:10px;font-size:13px;font-weight:500;min-width:260px;max-width:400px;box-shadow:0 4px 24px rgba(0,0,0,.18);pointer-events:all;animation:toastIn .22s cubic-bezier(.4,0,.2,1);line-height:1.45;color:#fff;}
.toast-success{background:#16a34a;}
.toast-error{background:#dc2626;}
.toast-info{background:#2563eb;}
.toast-warn{background:#d97706;}
.toast-icon{font-size:15px;flex-shrink:0;margin-top:1px;}
.toast-msg{flex:1;}
.toast-x{background:none;border:none;color:rgba(255,255,255,.65);cursor:pointer;font-size:17px;padding:0 0 0 6px;line-height:1;flex-shrink:0;margin-top:-1px;}
.toast-x:hover{color:#fff;}
@keyframes toastIn{from{opacity:0;transform:translateX(28px);}to{opacity:1;transform:translateX(0);}}
@keyframes toastOut{from{opacity:1;transform:translateX(0);}to{opacity:0;transform:translateX(28px);}}

/* ═══ ORDER MODAL REDESIGN ═══════════════════════════════════════════════════ */
.om2{padding:0!important;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;max-height:92vh;}
.om2-hdr{display:flex;align-items:center;gap:8px;padding:14px 20px;border-bottom:1px solid var(--border);flex-shrink:0;}
.om2-hdr-icon{width:34px;height:34px;border:1px solid var(--border);border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text3);background:none;}
.om2-hdr-icon:hover{background:var(--bg3);}
.om2-hdr-icon svg{width:16px;height:16px;}
.om2-body{display:grid;grid-template-columns:270px 1fr 1fr;flex:1;min-height:0;}
.om2-col{overflow-y:auto;border-right:1px solid var(--border);}
.om2-col:last-child{border-right:none;}
.om2-sec{padding:18px 20px;}
.om2-sec+.om2-sec{border-top:1px solid var(--border);}
.om2-sec-hdr{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.om2-ico{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.om2-ico svg{width:15px;height:15px;}
.om2-ico.red{background:#FFF0F0;color:#E31E24;}
.om2-ico.blue{background:#EFF6FF;color:#2563EB;}
.om2-ico.green{background:#F0FDF4;color:#16A34A;}
.om2-ico.orange{background:#FFF7ED;color:#EA580C;}
.om2-sec-title{font-size:14px;font-weight:700;color:var(--text);}
.om2-row{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid var(--border);}
.om2-row:last-child{border-bottom:none;}
.om2-row-ico{width:16px;height:16px;flex-shrink:0;color:var(--text3);}
.om2-row-ico svg{width:16px;height:16px;}
.om2-lbl{font-size:12px;color:var(--text3);width:105px;flex-shrink:0;white-space:nowrap;}
.om2-val{flex:1;font-size:13px;color:var(--text);background:none;border:none;outline:none;padding:0;min-width:0;font-family:inherit;}
.om2-val::placeholder{color:var(--text3);}
.om2-val:focus{color:var(--accent);}
select.om2-val{cursor:pointer;appearance:none;-webkit-appearance:none;}
textarea.om2-val{resize:none;min-height:36px;line-height:1.4;}
.om2-row-end{display:flex;align-items:center;gap:4px;margin-left:auto;flex-shrink:0;}
.om2-status-wrap{flex:1;display:flex;align-items:center;gap:6px;min-width:0;}
.om2-status-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;background:#9CA3AF;}
#om-status.om2-val{font-weight:600;}
.om2-ftr{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;border-top:1px solid var(--border);flex-shrink:0;}
.om2-save-btn{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:11px 36px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;margin:0 auto;}
.om2-save-btn:hover{filter:brightness(.9);}
.om2-save-btn svg{width:16px;height:16px;}
.om2-total-wrap{font-size:13px;color:var(--text2);white-space:nowrap;text-align:right;}
.om2-total-wrap b{font-size:17px;font-weight:700;color:var(--accent);}
/* products table */
.om2-prod-tbl{width:100%;border-collapse:collapse;font-size:12px;}
.om2-prod-tbl th{padding:5px 6px;text-align:left;color:var(--text3);font-weight:500;border-bottom:1px solid var(--border);font-size:11px;}
.om2-prod-tbl td{padding:5px 6px;border-bottom:1px solid var(--border);vertical-align:middle;}
.om2-prod-tbl tbody tr:last-child td{border-bottom:none;}
.om2-prod-foot{display:flex;justify-content:space-between;align-items:center;padding:7px 2px 2px;font-size:12px;color:var(--text2);}
.om2-prod-foot b{color:var(--accent);font-size:13px;}
.om2-prod-add{background:none;border:1.5px dashed var(--border);border-radius:8px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text3);font-size:18px;flex-shrink:0;}
.om2-prod-add:hover{border-color:var(--accent);color:var(--accent);}
.om2-empty{text-align:center;padding:24px 0;color:var(--text3);font-size:12px;}
.om2-fifo{display:flex;align-items:center;gap:6px;padding:5px 8px;background:var(--bg3);border-radius:6px;font-size:12px;color:var(--text2);margin-top:8px;}

/* ═══ ORDER MODAL v3 ════════════════════════════════════════════════════════ */
.om3-bg{background:rgba(15,17,23,.55);backdrop-filter:blur(4px);}
.om3{
  padding:0!important;border-radius:20px;overflow:hidden;
  display:flex;flex-direction:column;
  height:auto;
  max-height:92vh;
  width:min(calc(100vw - 60px),1380px)!important;
  box-shadow:0 24px 64px rgba(0,0,0,.2);
}
/* header */
.om3-hdr{display:flex;align-items:center;gap:6px;padding:7px 14px;border-bottom:1px solid #E5E7EB;background:#fff;flex-shrink:0;}
.om3-hdr-btn{width:26px;height:26px;border:1px solid #E5E7EB;border-radius:6px;display:flex;align-items:center;justify-content:center;background:none;cursor:pointer;color:#6B7280;}
.om3-hdr-btn:hover{background:#F3F4F6;}
.om3-hdr-btn svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;}
.om3-hdr-title{font-size:12px;font-weight:600;color:#111827;flex:1;padding-left:4px;}
.om3-hdr-sub{font-size:10px;color:#9CA3AF;}
/* scrollable body — ONE scroll for whole body */
.om3-body{
  flex:1;overflow-y:auto;
  display:grid;
  grid-template-columns:1fr 1fr 2fr;
  gap:8px;
  padding:8px;
  background:#EEF1F5;
  align-items:start;
  padding-bottom:10px;
}
/* cards */
.om3-card{background:#fff;border:1px solid #E5E7EB;border-radius:10px;padding:6px 10px 8px 10px;display:flex;flex-direction:column;}
.om3-card+.om3-card{margin-top:6px;}
.om3-card-hdr{display:flex;align-items:center;gap:7px;margin:-6px -10px 7px -10px;padding:6px 10px;border-bottom:1px solid #F3F4F6;background:#FAFAFA;border-radius:10px 10px 0 0;}
.om3-card-ico{width:20px;height:20px;border-radius:5px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.om3-card-ico svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2;}
.om3-card-ico.red{background:#FEE2E2;color:#E31E24;}
.om3-card-ico.blue{background:#DBEAFE;color:#2563EB;}
.om3-card-ico.green{background:#DCFCE7;color:#15803D;}
.om3-card-ico.orange{background:#FEF3C7;color:#D97706;}
.om3-card-ico.purple{background:#EDE9FE;color:#7C3AED;}
.om3-card-title{font-size:11px;font-weight:700;color:#374151;flex:1;text-transform:uppercase;letter-spacing:.4px;}
.om3-card-action{width:20px;height:20px;border:1.5px dashed #D1D5DB;border-radius:5px;display:flex;align-items:center;justify-content:center;background:none;cursor:pointer;color:#9CA3AF;font-size:15px;line-height:1;}
.om3-card-action:hover{border-color:#E31E24;color:#E31E24;}
/* field rows */
.om3-row{display:flex;align-items:center;gap:6px;padding:3px 0;border-bottom:1px solid #F9FAFB;min-height:26px;}
.om3-row:last-child{border-bottom:none;}
.om3-row.top{align-items:flex-start;padding-top:4px;}
.om3-row-ico{width:13px;height:13px;flex-shrink:0;color:#C4C9D4;display:flex;align-items:center;justify-content:center;}
.om3-row-ico svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:1.8;}
.om3-lbl{font-size:11px;color:#9CA3AF;width:86px;flex-shrink:0;white-space:nowrap;}
/* TEXT value — read-only display */
.om3-text{font-size:12.5px;color:#111827;flex:1;min-width:0;line-height:1.35;}
.om3-text.link{color:#2563EB;}
.om3-text.muted{color:#9CA3AF;}
/* EDITABLE value — actual inputs */
.om3-inp{flex:1;font-size:12.5px;color:#111827;background:#F9FAFB;border:1px solid #EDEFF2;border-radius:6px;padding:3px 7px;min-width:0;font-family:inherit;outline:none;transition:border-color .15s;}
.om3-inp:focus{border-color:#E31E24;background:#fff;}
.om3-inp::placeholder{color:#D1D5DB;}
.om3-inp.area{resize:none;min-height:38px;line-height:1.4;}
select.om3-inp{cursor:pointer;appearance:none;font-size:12.5px;font-family:inherit;color:#111827;line-height:1.4;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 7px center;padding-right:22px;}
/* copy btn */
.om3-copy{width:18px;height:18px;border:none;background:none;cursor:pointer;color:#9CA3AF;display:flex;align-items:center;justify-content:center;border-radius:4px;flex-shrink:0;}
.om3-copy:hover{background:#F3F4F6;color:#374151;}
/* country custom dropdown */
.cdd{position:relative;flex:1;min-width:0;}
.cdd-btn{display:flex;align-items:center;gap:6px;width:100%;text-align:left;cursor:pointer;background:#F9FAFB;border:1px solid #EDEFF2;border-radius:6px;padding:3px 7px;font-size:12.5px;color:#111827;font-family:inherit;outline:none;transition:border-color .15s;min-height:26px;}
.cdd-btn:focus,.cdd.open .cdd-btn{border-color:#E31E24;background:#fff;}
.cdd-val{flex:1;min-width:0;display:flex;align-items:center;gap:6px;overflow:hidden;}
.cdd-placeholder{color:#D1D5DB;}
.cdd-arrow{width:12px;height:12px;flex-shrink:0;opacity:.5;transition:transform .15s;stroke:#6B7280;}
.cdd.open .cdd-arrow{transform:rotate(180deg);}
.cdd-list{position:absolute;top:calc(100% + 3px);left:0;right:0;background:#fff;border:1px solid #EDEFF2;border-radius:8px;box-shadow:0 4px 18px rgba(0,0,0,.13);z-index:9999;max-height:230px;overflow-y:auto;display:none;}
.cdd.open .cdd-list{display:block;}
.cdd-opt{display:flex;align-items:center;gap:8px;padding:6px 12px;cursor:pointer;font-size:13px;color:#111827;transition:background .1s;}
.cdd-opt:hover{background:#F3F4F6;}
.cdd-opt.sel{background:#FEF2F2;color:#E31E24;font-weight:500;}
.cdd-opt-empty{color:#9CA3AF;font-size:12.5px;}
.om3-copy svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.8;}
/* status */
.status-dd-wrap{flex:1;min-width:0;}
.om3-status-pill{display:flex;align-items:center;gap:8px;width:100%;box-sizing:border-box;font-size:12.5px;font-family:inherit;font-weight:600;cursor:pointer;border:1px solid #EDEFF2;border-radius:6px;padding:4px 9px;outline:none;transition:border-color .15s,background .15s;user-select:none;background:#F9FAFB;}
.om3-status-pill:hover{border-color:#D1D5DB;}
.status-dd-sq{width:16px;height:16px;border-radius:4px;flex-shrink:0;background:#9CA3AF;}
#status-dd-floating{position:fixed;background:#fff;border:1px solid #E5E7EB;border-radius:10px;box-shadow:0 10px 32px rgba(0,0,0,.15);z-index:99999;display:none;flex-direction:column;overflow:hidden;}
.status-dd-items{overflow-y:auto;max-height:260px;}
.status-dd-item{padding:7px 12px;font-size:12.5px;cursor:pointer;display:flex;align-items:center;gap:10px;border-bottom:1px solid #F9FAFB;}
.status-dd-item:last-child{border-bottom:none;}
.status-dd-item:hover{background:#FFF1F2;}
.status-dd-item.s-active .status-dd-iname{font-weight:600;}
.om3-status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;pointer-events:none;}
/* products table */
.om3-tbl{width:100%;border-collapse:collapse;margin-bottom:2px;}
.om3-tbl thead tr{background:#F9FAFB;}
.om3-tbl th{padding:5px 8px;text-align:left;font-size:10.5px;font-weight:600;color:#6B7280;border-bottom:1px solid #E5E7EB;white-space:nowrap;}
.om3-tbl td{padding:4px 8px;border-bottom:1px solid #F3F4F6;vertical-align:middle;color:#111827;font-size:12.5px;}
.om3-tbl tbody tr:last-child td{border-bottom:none;}
.om3-tbl-id{font-size:10.5px;color:#9CA3AF;font-family:monospace;white-space:nowrap;}
.om3-tbl th.r,.om3-tbl td.r{text-align:right;}
.om3-tbl td.bold{font-weight:600;}
/* prod row inputs */
.om3-tbl input,.om3-tbl select{background:none;border:none;outline:none;font-family:inherit;font-size:12.5px;color:#111827;padding:0;width:100%;}
.om3-tbl input[type=number]{text-align:right;}
.om3-tbl .prod-price{width:68px;text-align:right;}
.om3-tbl .prod-qty{width:34px;}
.om3-tbl select{cursor:pointer;}
.om3-tbl .custom-name{border:1px solid #E5E7EB;border-radius:5px;padding:2px 6px;margin-top:3px;font-size:12px;width:100%;}
/* tbl footer */
.om3-tbl-foot{border-top:1px solid #E5E7EB;padding-top:6px;margin-top:2px;display:flex;flex-direction:column;gap:2px;}
.om3-tbl-foot-row{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:#6B7280;padding:1px 0;}
.om3-tbl-foot-row.grand{font-size:12.5px;font-weight:700;color:#E31E24;}
/* empty state */
.om3-empty{border:1.5px dashed #E5E7EB;border-radius:8px;padding:14px 10px;text-align:center;color:#9CA3AF;font-size:11.5px;display:flex;flex-direction:column;align-items:center;gap:5px;}
.om3-empty svg{width:20px;height:20px;stroke:#D1D5DB;fill:none;stroke-width:1.5;}
/* fifo */
.om3-fifo{display:flex;align-items:center;gap:5px;padding:5px 8px;background:#F0FDF4;border-radius:6px;font-size:11px;color:#15803D;margin-top:5px;}
/* footer */
.om3-ftr{display:flex;align-items:center;justify-content:space-between;padding:0 18px;height:50px;border-top:1px solid #E5E7EB;background:#fff;flex-shrink:0;}
.om3-save{background:#E31E24;color:#fff;border:none;border-radius:8px;padding:8px 32px;font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;font-family:inherit;}
.om3-save:hover{background:#c8181e;}
.om3-save svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2;}
.om3-total-lbl{font-size:11px;color:#6B7280;margin-bottom:1px;}
.om3-total-val{font-size:17px;font-weight:800;color:#E31E24;letter-spacing:-.5px;line-height:1.1;}

/* ═══ PRODUCT SEARCH DROPDOWN ══════════════════════════════════════════════ */
.prod-dd{position:relative;width:100%;}
.prod-dd-inp{width:100%;background:none;border:none;outline:none;font-family:inherit;font-size:12.5px;color:#111827;padding:0;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.prod-dd-inp::placeholder{color:#C4C9D4;}
#prod-dd-floating{position:fixed;background:#fff;border:1px solid #E5E7EB;border-radius:10px;box-shadow:0 10px 32px rgba(0,0,0,.15);z-index:99999;width:320px;display:none;flex-direction:column;overflow:hidden;}
#offer-dd-floating{position:fixed;background:#fff;border:1px solid #E5E7EB;border-radius:10px;box-shadow:0 10px 32px rgba(0,0,0,.15);z-index:99999;display:none;flex-direction:column;overflow:hidden;}
.prod-dd-search{padding:8px 10px;border-bottom:1px solid #F3F4F6;flex-shrink:0;}
.prod-dd-search input{width:100%;border:1px solid #E5E7EB;border-radius:6px;padding:5px 9px;font-size:12px;outline:none;font-family:inherit;color:#111827;}
.prod-dd-search input:focus{border-color:#E31E24;}
.prod-dd-items{overflow-y:auto;max-height:220px;flex:1;}
.prod-dd-item{padding:6px 12px;font-size:12.5px;cursor:pointer;display:flex;align-items:center;gap:10px;border-bottom:1px solid #F9FAFB;}
.prod-dd-item:last-child{border-bottom:none;}
.prod-dd-item:hover{background:#FFF1F2;}
.prod-dd-item.active{background:#FFF1F2;}
.prod-dd-item.active .prod-dd-name{color:#E31E24;font-weight:600;}
.prod-dd-pid{font-family:monospace;font-size:10.5px;color:#9CA3AF;min-width:26px;flex-shrink:0;text-align:right;}
.prod-dd-name{flex:1;color:#111827;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.prod-dd-custom{padding:7px 12px;font-size:12px;color:#6B7280;cursor:pointer;border-top:1px solid #F0F0F0;flex-shrink:0;display:flex;align-items:center;gap:7px;}
.prod-dd-custom:hover{background:#F9FAFB;color:#374151;}
.prod-dd-empty{padding:14px 12px;font-size:12px;color:#9CA3AF;text-align:center;}

/* ═══ MOBILE FIX ═══════════════════════════════════════════════════════════ */
@media(max-width:767px){
  /* Login */
  body { overflow: auto; }
  #auth { align-items: flex-start; padding: 2rem 1rem; min-height: 100vh; height: auto; }
  .login-card { width: 100%; max-width: 380px; box-sizing: border-box; }

  /* Sidebar — на мобільному не розширюється по hover/tap */
  .sidebar { position: relative; width: 0; min-width: 0; border-right: none; overflow: hidden; flex-shrink: 0; }
  .sidebar:hover { width: 0; }
  .content { margin-left: 0; }

  /* Hamburger кнопка */
  #mob-menu-btn { display: flex !important; }

  /* Sidebar відкривається по класу mob-open */
  .sidebar.mob-open { position: fixed; top: 0; left: 0; bottom: 0; width: 220px !important; z-index: 600; overflow-y: auto; pointer-events: all; }
  /* Показуємо текст навігації у відкритому sidebar */
  .sidebar.mob-open .nav-label { opacity: 1; transform: translateX(0); }
  .sidebar.mob-open .nav-sub-label { opacity: 1; transform: translateX(0); }
  .sidebar.mob-open .nav-chevron { opacity: 1; }
  .sidebar.mob-open .sb-footer { opacity: 1; pointer-events: auto; }
  .sidebar.mob-open .sb-logo-name { opacity: 1; }
  .sidebar.mob-open .nav-sub.open { max-height: 600px !important; }

  /* Overlay під sidebar */
  #mob-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.4); z-index: 599; }
  #mob-overlay.active { display: block; }

  /* Topbar */
  .topbar { padding: .5rem .75rem; gap: 6px; }
  .topbar .btn span { display: none; }

  /* Таблиця замовлень — горизонтальний скрол */
  #page-orders .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ═══ IOS TOUCH FIX ════════════════════════════════════════════════════════ */
button, .btn, .nav-item, .nav-sub-item, .tab-btn, .ord-row,
[onclick], .modal-close, .pg-btn, .sf-opt, .cdd-trigger,
.tsms-tpl-card, .tsms-rule-card, .mod-toggle-track {
  touch-action: manipulation;
  cursor: pointer;
}