:root { color-scheme:light; --bg:#f3f5f3; --surface:#ffffff; --surface-2:#f5f6f3; --border:#d9ccb0; --gold:#b2770c; --gold-bright:#a96800; --text:#1c211f; --muted:#676b66; --sidebar-width:250px; }
html[data-theme="dark"] { color-scheme:dark; --bg:#090b0b; --surface:#111414; --surface-2:#181b1a; --border:#423719; --gold:#e3ad36; --gold-bright:#f4c454; --text:#f5f3ed; --muted:#aaa89f; }
html { font-size:15px; min-height:100%; }
body { margin:0; min-height:100vh; background:var(--bg); color:var(--text); }
body.sidebar-resizing { cursor:col-resize; user-select:none; }
body.sidebar-resizing .sidebar,body.sidebar-resizing .app-content { transition:none!important; }
a { color:var(--gold-bright); }
.app-shell { display:flex; min-height:100vh; }
.sidebar { width:var(--sidebar-width); padding:28px 20px; background:#070909; border-right:1px solid var(--border); display:flex; flex-direction:column; position:fixed; inset:0 auto 0 0; transition:width .12s ease; }
.sidebar-resize-handle { position:fixed; top:0; bottom:0; left:var(--sidebar-width); width:14px; margin-left:-7px; z-index:60; cursor:col-resize; display:flex; align-items:center; justify-content:center; background:transparent; border:0; padding:0; touch-action:none; }
.sidebar-resize-handle:hover .resize-grip,.sidebar-resize-handle:focus-visible .resize-grip,body.sidebar-resizing .resize-grip { opacity:1; background:var(--gold-bright); height:72px; }
.sidebar-resize-handle:hover,.sidebar-resize-handle:focus-visible { background:rgba(227,173,54,.06); }
.resize-grip { width:4px; height:44px; border-radius:999px; background:#4a4a44; opacity:0; transition:opacity .15s ease,height .15s ease,background .15s ease; pointer-events:none; }
@media (pointer:coarse) { .sidebar-resize-handle { width:26px; margin-left:-13px; } .resize-grip { opacity:.55; width:5px; } }
.brand { color:var(--gold-bright); text-decoration:none; display:flex; align-items:center; gap:12px; font-size:1.15rem; font-weight:700; letter-spacing:.04em; }
.brand:hover { color:var(--gold-bright); }
.brand-copy { min-width:0; overflow-wrap:anywhere; }
.brand small { display:block; color:var(--muted); font-size:.68rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; }
.brand-mark { width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--gold); border-radius:10px; background:linear-gradient(145deg,#2b2414,#111); }
.brand-logo { width:52px; height:52px; flex:0 0 52px; object-fit:contain; padding:4px; border:1px solid var(--gold); border-radius:10px; background:#fff; }
.brand-visual { position:relative; width:52px; height:52px; flex:0 0 52px; }
.brand-visual .brand-mark,.brand-visual .brand-logo { position:absolute; inset:0; width:52px; height:52px; }
.brand-copy { line-height:1.25; overflow-wrap:normal; word-break:normal; }
.sidebar-nav { margin-top:42px; display:grid; gap:8px; }
.sidebar-nav a { padding:12px 14px; border-radius:8px; color:#deddd8; text-decoration:none; border:1px solid transparent; display:flex; align-items:center; gap:12px; }
.sidebar-nav a:hover { color:var(--gold-bright); border-color:var(--border); background:var(--surface-2); }
.nav-icon { width:21px; height:21px; flex:0 0 21px; color:var(--gold); }
.nav-icon svg { display:block; width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.app-content { margin-left:var(--sidebar-width); width:calc(100% - var(--sidebar-width)); transition:margin-left .12s ease,width .12s ease; }
.topbar { height:76px; padding:0 32px; border-bottom:1px solid #292a27; display:flex; align-items:center; justify-content:flex-end; gap:24px; background:rgba(12,14,14,.96); }
.pakistan-clock { color:var(--muted); font-size:.82rem; }
.topbar strong { display:block; font-weight:500; }
.current-user { display:flex; align-items:center; gap:12px; }
.current-user-avatar,.current-user-fallback { width:44px; height:44px; flex:0 0 44px; border-radius:50%; border:1px solid var(--gold); }
.current-user-visual { position:relative; width:44px; height:44px; flex:0 0 44px; }
.current-user-visual .current-user-avatar,.current-user-visual .current-user-fallback { position:absolute; inset:0; }
.current-user-avatar { object-fit:cover; background:var(--surface); }
.current-user-fallback { display:grid; place-items:center; color:#111; background:linear-gradient(135deg,var(--gold-bright),#c88e1d); font-weight:800; }
.current-user-copy { min-width:0; }
.current-user-copy strong { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.current-user-copy small { display:block; max-width:260px; color:var(--muted); font-size:.75rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.content-wrap { padding:38px 32px; max-width:1400px; margin:0 auto; }
.eyebrow { color:var(--gold); text-transform:uppercase; letter-spacing:.13em; font-size:.72rem; font-weight:700; }
.page-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:28px; }
.page-heading h1 { font-size:2rem; margin:4px 0; }
.page-heading p,.auth-card p { color:var(--muted); margin:0; }
.dash-heading { position:relative; padding:26px 30px; margin-bottom:32px; border:1px solid var(--border); border-radius:16px; overflow:hidden; background:radial-gradient(circle at 15% 20%,#211c0c 0,var(--surface) 55%),linear-gradient(145deg,var(--surface-2),var(--surface)); animation:posFadeSlideUp .5s cubic-bezier(.16,1,.3,1) both; }
.dash-heading::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(120deg,transparent 40%,rgba(227,173,54,.06) 50%,transparent 60%); background-size:220% 220%; animation:posShimmer 7s ease infinite alternate; }
.dash-heading h1 { background:linear-gradient(120deg,var(--text),var(--gold-bright)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.dash-heading .btn-gold,.dash-heading .btn-outline-gold { position:relative; z-index:1; }
.metric-card,.panel,.auth-card { background:linear-gradient(145deg,var(--surface-2),var(--surface)); border:1px solid var(--border); border-radius:12px; box-shadow:0 18px 50px rgba(0,0,0,.2); }
.metric-card { padding:24px; }
.metric-row .col-md-4 { animation:posFadeSlideUp .5s cubic-bezier(.16,1,.3,1) both; }
.metric-row .col-md-4:nth-child(1){animation-delay:.05s}.metric-row .col-md-4:nth-child(2){animation-delay:.13s}.metric-row .col-md-4:nth-child(3){animation-delay:.21s}
.dashboard-link { display:block; height:100%; text-decoration:none; }
.metric-card span { color:var(--muted); }
.metric-card strong { display:block; color:var(--gold-bright); font-size:2.4rem; margin-top:12px; font-variant-numeric:tabular-nums; }
.metric-card { position:relative; overflow:hidden; transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s ease,border-color .22s ease; }
.metric-card::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--accent,var(--gold)),transparent); opacity:.9; }
.metric-card:hover { transform:translateY(-5px); box-shadow:0 26px 60px rgba(0,0,0,.32); border-color:var(--accent,var(--border)); }
.metric-card.accent-gold { --accent:#e3ad36; }
.metric-card.accent-green { --accent:#3fae68; }
.metric-card.accent-red { --accent:#d64545; }
.metric-card.accent-blue { --accent:#4a9fe3; }
.metric-icon { display:grid; place-items:center; width:46px; height:46px; margin-bottom:14px; border-radius:11px; color:var(--accent,var(--gold)); background:color-mix(in srgb,var(--accent,var(--gold)) 16%,transparent); }
.metric-icon svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.metric-label { display:block; color:var(--muted); font-size:.85rem; }
.dashboard-link:hover .metric-icon { animation:posPop .45s cubic-bezier(.34,1.56,.64,1); }
.dashboard-pulse { display:grid; gap:18px; margin-top:34px; animation:posFadeSlideUp .55s .25s cubic-bezier(.16,1,.3,1) both; }
.dashboard-section-heading { display:flex; align-items:end; justify-content:space-between; gap:18px; }
.dashboard-section-heading h2 { margin:4px 0 0; font-size:1.45rem; }
.dashboard-live-dot { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:.76rem; }
.dashboard-live-dot::before { content:""; width:8px; height:8px; border-radius:50%; background:#46c475; box-shadow:0 0 0 4px rgba(70,196,117,.12); }
.dashboard-pulse-strip { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); overflow:hidden; border:1px solid var(--border); border-radius:14px; background:linear-gradient(145deg,#191c1a,#0f1110); box-shadow:0 18px 50px rgba(0,0,0,.22); }
.dashboard-pulse-strip>div,.dashboard-pulse-strip>a { min-width:0; padding:20px 24px; color:var(--text); text-decoration:none; border-right:1px solid #343329; }
.dashboard-pulse-strip>*:last-child { border-right:0; }
.dashboard-pulse-strip>a { transition:background .18s ease; }
.dashboard-pulse-strip>a:hover { background:rgba(227,173,54,.08); }
.dashboard-pulse-strip span,.dashboard-pulse-strip small { display:block; color:var(--muted); }
.dashboard-pulse-strip span { font-size:.76rem; text-transform:uppercase; letter-spacing:.08em; }
.dashboard-pulse-strip strong { display:block; margin:5px 0 2px; color:var(--gold-bright); font-size:1.55rem; font-variant-numeric:tabular-nums; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dashboard-pulse-strip .pulse-text-value { font-size:1.18rem; padding:5px 0 3px; }
.dashboard-pulse-strip small { font-size:.72rem; }
.dashboard-detail-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:18px; }
.dashboard-insight-panel { min-width:0; padding:24px; border:1px solid var(--border); border-radius:14px; background:radial-gradient(circle at 10% 0%,#1d1b11 0,#121514 55%); box-shadow:0 18px 50px rgba(0,0,0,.2); }
.dashboard-panel-title { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:18px; border-bottom:1px solid #302d22; }
.dashboard-panel-title h3 { margin:3px 0 0; font-size:1.08rem; }
.dashboard-panel-title>span,.dashboard-panel-title>a { color:var(--muted); font-size:.75rem; text-decoration:none; }
.dashboard-panel-title>a:hover { color:var(--gold-bright); }
.order-mix-list { display:grid; gap:18px; padding-top:20px; }
.order-mix-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 14px; align-items:end; }
.order-mix-item>div:first-child { min-width:0; }
.order-mix-item strong,.order-mix-item span { display:block; }
.order-mix-item strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.order-mix-item span { margin-top:2px; color:var(--muted); font-size:.73rem; }
.order-mix-item>b { color:var(--gold-bright); font-size:.8rem; }
.order-mix-track { grid-column:1/-1; height:7px; overflow:hidden; border-radius:99px; background:#292b28; }
.order-mix-track span { height:100%; min-width:5px; border-radius:inherit; background:linear-gradient(90deg,#c98e20,var(--gold-bright)); box-shadow:0 0 14px rgba(227,173,54,.25); }
.dashboard-recent-list { display:grid; }
.dashboard-recent-order { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 0; border-bottom:1px solid #2c2d29; }
.dashboard-recent-order:last-child { border-bottom:0; padding-bottom:0; }
.recent-order-main,.recent-order-total { min-width:0; }
.recent-order-main a,.recent-order-main strong,.recent-order-main span,.recent-order-total strong,.recent-order-total span { display:block; }
.recent-order-main a,.recent-order-main strong { color:var(--text); font-weight:700; text-decoration:none; }
.recent-order-main a:hover { color:var(--gold-bright); }
.recent-order-main span,.recent-order-total span { margin-top:3px; color:var(--muted); font-size:.72rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.recent-order-total { max-width:48%; text-align:right; }
.recent-order-total strong { color:var(--gold-bright); font-variant-numeric:tabular-nums; }
.dashboard-empty { display:grid; place-items:center; min-height:180px; align-content:center; text-align:center; }
.dashboard-empty::before { content:"◇"; margin-bottom:10px; color:var(--gold); font-size:2rem; }
.dashboard-empty span { margin-top:5px; color:var(--muted); font-size:.8rem; }
@media (max-width:900px) { .dashboard-pulse-strip{grid-template-columns:1fr}.dashboard-pulse-strip>div,.dashboard-pulse-strip>a{border-right:0;border-bottom:1px solid #343329}.dashboard-pulse-strip>*:last-child{border-bottom:0}.dashboard-detail-grid{grid-template-columns:1fr}.dashboard-section-heading{align-items:center} }
@media (max-width:520px) { .dashboard-insight-panel{padding:18px}.dashboard-recent-order{align-items:flex-start}.recent-order-total{max-width:42%}.dashboard-live-dot{display:none} }
.panel { overflow:hidden; }
.form-panel { padding:28px; max-width:900px; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; border-top:1px solid #333; margin-top:28px; padding-top:20px; }
.table-dark { --bs-table-bg:transparent; --bs-table-striped-bg:#171918; --bs-table-border-color:#33342f; --bs-table-color:var(--text); }
.table>:not(caption)>*>* { padding:1rem; }
.table thead th { color:var(--gold); font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; }
.table small { color:var(--muted); }
.empty-state { text-align:center; color:var(--muted)!important; padding:48px!important; }
.status-pill { display:inline-block; padding:5px 10px; border-radius:99px; font-size:.78rem; font-weight:700; }
.status-pill.active { color:#8fe0a8; background:rgba(45,145,78,.18); }
.status-pill.inactive { color:#ff9a9a; background:rgba(190,54,54,.18); }
.btn-gold { color:#111; background:linear-gradient(135deg,var(--gold-bright),#c88e1d); border-color:var(--gold); font-weight:700; }
.btn-gold:hover { color:#050505; background:var(--gold-bright); border-color:var(--gold-bright); }
.btn-outline-gold { color:var(--gold-bright); border-color:var(--gold); }
.btn-outline-gold:hover { color:#111; background:var(--gold); }
.form-control { color:var(--text); background:#0c0e0e; border-color:#44443d; padding:.72rem .85rem; }
.form-control:focus { color:var(--text); background:#0c0e0e; border-color:var(--gold); box-shadow:0 0 0 .2rem rgba(227,173,54,.14); }
.form-check-input:checked { background-color:var(--gold); border-color:var(--gold); }
.form-text { color:var(--muted); }
.logo-preview { display:flex; align-items:center; gap:12px; margin-top:14px; color:var(--muted); }
.logo-preview img { width:72px; height:72px; object-fit:contain; padding:5px; border:1px solid var(--border); border-radius:10px; background:#080909; }
.form-select { color:var(--text); background-color:#0c0e0e; border-color:#44443d; padding:.72rem .85rem; }
.permission-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.permission-option { padding:11px 12px; background:#0c0e0e; border:1px solid #34352f; border-radius:8px; }
.text-gold { color:var(--gold); }
.user-cell { display:flex; align-items:center; gap:12px; }
.avatar,.avatar-fallback { width:42px; height:42px; border-radius:50%; border:1px solid var(--border); }
.avatar { object-fit:cover; }
.avatar-fallback { display:grid; place-items:center; color:#111; background:var(--gold); font-weight:800; }
.menu-thumb,.menu-thumb-fallback { width:54px; height:54px; border-radius:10px; border:1px solid var(--border); }
.menu-thumb { object-fit:cover; }
.menu-thumb-fallback { display:grid; place-items:center; color:#111; background:var(--gold); font-size:1.2rem; font-weight:800; }
.variant-help-panel { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:24px; padding:16px; border:1px solid var(--border); border-radius:9px; background:#0c0e0e; }
.variant-help-panel p { margin:4px 0 0; color:var(--muted); }
.crop-status { display:block; min-height:20px; margin-top:5px; color:#8fe0a8; }
.crop-dialog { width:min(92vw,760px); padding:22px; color:var(--text); background:var(--surface); border:1px solid var(--gold); border-radius:12px; box-shadow:0 30px 90px #000; }
.crop-dialog::backdrop { background:rgba(0,0,0,.82); backdrop-filter:blur(3px); }
.crop-dialog-head { display:flex; justify-content:space-between; align-items:flex-start; }
.crop-dialog h2 { margin:3px 0 0; }
.crop-dialog p { color:var(--muted); }
.crop-close { width:36px; height:36px; color:var(--text); background:#090b0b; border:1px solid #4a4a44; border-radius:50%; font-size:1.4rem; line-height:1; }
.crop-canvas-wrap { overflow:hidden; border:1px solid var(--border); border-radius:9px; background:#050606; }
.crop-canvas-wrap canvas { display:block; width:100%; height:auto; cursor:grab; touch-action:none; }
.crop-canvas-wrap canvas:active { cursor:grabbing; }
.crop-zoom-label { display:flex; align-items:center; gap:14px; margin-top:16px; color:var(--gold-bright); font-weight:700; }
.crop-zoom-label input { flex:1; accent-color:var(--gold); }
.crop-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
@keyframes posFadeSlideUp { from{opacity:0; transform:translateY(16px) scale(.96);} to{opacity:1; transform:translateY(0) scale(1);} }
@keyframes posCartLineIn { from{opacity:0; transform:translateX(18px);} to{opacity:1; transform:translateX(0);} }
@keyframes posPulseGlow { 0%{box-shadow:0 0 0 0 rgba(227,173,54,.45);} 70%{box-shadow:0 0 0 10px rgba(227,173,54,0);} 100%{box-shadow:0 0 0 0 rgba(227,173,54,0);} }
@keyframes posShimmer { 0%{background-position:0% 50%;} 100%{background-position:200% 50%;} }
@keyframes posPop { 0%{transform:scale(1);} 35%{transform:scale(1.16);} 60%{transform:scale(.96);} 100%{transform:scale(1);} }
@keyframes posCheckIn { from{opacity:0; transform:scale(.5) rotate(-20deg);} to{opacity:1; transform:scale(1) rotate(0);} }
@keyframes posFadeIn { from{opacity:0;} to{opacity:1;} }
@media (prefers-reduced-motion:reduce) { .pos-product,.cart-line,.current-order-tab,.pos-continue-btn,.add-item-button,.pos-categories button{animation:none!important;transition:none!important;} }
.pos-page { overflow-x:hidden; }
.pos-content-wrap { max-width:none; padding:20px 24px 28px; margin:0; background:radial-gradient(circle at 50% 0%,#171814 0,var(--bg) 55%); }
.pos-page-header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; animation:posFadeSlideUp .4s cubic-bezier(.16,1,.3,1) both; }
.pos-page-header h1 { margin:2px 0 0; font-size:1.6rem; }
.pos-page-header p { margin:4px 0 0; color:var(--muted); font-size:.85rem; }
.pos-date-badge { display:flex; align-items:center; gap:8px; padding:10px 16px; border:1px solid var(--border); border-radius:11px; background:linear-gradient(145deg,#181b17,#0e1010); color:var(--muted); font-size:.8rem; font-weight:600; white-space:nowrap; }
.pos-date-badge::before { content:""; width:7px; height:7px; border-radius:50%; background:#3fae68; box-shadow:0 0 0 3px rgba(63,174,104,.2); }
.pos-shell { display:grid; grid-template-columns:minmax(0,1fr) 400px; gap:22px; align-items:start; }
.pos-menu { min-width:0; padding:22px 24px 28px; border:1px solid var(--border); border-radius:18px; background:radial-gradient(circle at 30% 0%,#1c1e18 0,#101211 65%); box-shadow:0 20px 50px rgba(0,0,0,.3); }
.pos-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:22px; }
.pos-work-title { display:flex; align-items:center; gap:14px; white-space:nowrap; padding:8px 16px; border:1px solid var(--border); border-radius:10px; background:linear-gradient(145deg,#181b17,#0e1010); }
.pos-work-title strong { font-size:1.05rem; letter-spacing:.01em; }
.pos-search { position:relative; width:min(560px,65%); }
.pos-search-icon { position:absolute; right:16px; top:50%; z-index:1; color:var(--gold); font-size:1.35rem; line-height:1; transform:translateY(-50%) rotate(-20deg); pointer-events:none; }
.pos-search .form-control { height:50px; padding-right:48px; border-radius:12px; background:#14171680; border-color:#3a3221; box-shadow:inset 0 1px 0 rgba(255,255,255,.02); }
.pos-search .form-control:focus { border-color:var(--gold); box-shadow:inset 0 1px 0 rgba(255,255,255,.02),0 0 0 .18rem rgba(227,173,54,.14); }
.pos-categories { display:flex; flex-wrap:wrap; gap:9px; overflow-x:auto; padding-bottom:22px; margin-bottom:4px; border-bottom:1px solid #2a2517; }
.pos-categories button { min-height:42px; white-space:nowrap; color:var(--text); background:linear-gradient(145deg,#181b19,#0d0f0e); border:1px solid var(--border); border-radius:999px; padding:9px 20px; font-weight:650; font-size:.86rem; transition:all .18s cubic-bezier(.34,1.56,.64,1); }
.pos-categories button.active,.pos-categories button:hover { color:#161206; background:linear-gradient(135deg,var(--gold-bright),#d99a21); border-color:var(--gold-bright); box-shadow:0 6px 16px rgba(227,173,54,.25); transform:translateY(-2px) scale(1.03); }
.pos-categories button:active { transform:translateY(0) scale(.97); }
.pos-products { display:grid; grid-template-columns:repeat(auto-fill,minmax(215px,1fr)); align-items:start; gap:18px; padding-top:22px; }
.pos-product { overflow:hidden; border:1px solid #3a331c; border-radius:14px; background:linear-gradient(165deg,#191c19,#0e100f); box-shadow:0 10px 26px rgba(0,0,0,.28); transition:border-color .18s ease,transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s ease; animation:posFadeSlideUp .5s cubic-bezier(.16,1,.3,1) both; }
.pos-product:nth-child(1){animation-delay:.01s}.pos-product:nth-child(2){animation-delay:.04s}.pos-product:nth-child(3){animation-delay:.07s}.pos-product:nth-child(4){animation-delay:.1s}.pos-product:nth-child(5){animation-delay:.13s}.pos-product:nth-child(6){animation-delay:.16s}.pos-product:nth-child(7){animation-delay:.19s}.pos-product:nth-child(8){animation-delay:.22s}.pos-product:nth-child(9){animation-delay:.25s}.pos-product:nth-child(10){animation-delay:.28s}.pos-product:nth-child(n+11){animation-delay:.3s}
.pos-product:hover { border-color:var(--gold); transform:translateY(-5px) scale(1.015); box-shadow:0 18px 38px rgba(0,0,0,.42),0 0 0 1px rgba(227,173,54,.2); }
.pos-product-image { width:100%; aspect-ratio:16/11; display:grid; place-items:center; overflow:hidden; background:linear-gradient(150deg,#171a18,#0a0b0b); color:var(--gold); font-size:2.4rem; font-weight:800; position:relative; }
.pos-product-image { min-height:145px; }
.pos-product-image-fallback { position:relative; z-index:0; }
.pos-product-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.35)); }
.pos-product-image img { position:absolute; inset:0; z-index:1; width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }
.pos-product-image::after { z-index:2; pointer-events:none; }
.pos-product:hover .pos-product-image img { transform:scale(1.06); }
.pos-product-body { padding:14px 14px 16px; }
.pos-product h2 { font-size:1rem; margin:0 0 6px; letter-spacing:.01em; }
.pos-product p { min-height:34px; margin:0 0 10px; color:var(--muted); font-size:.78rem; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.variant-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; margin-top:8px; }
.variant-options label { min-width:0; cursor:pointer; }
.variant-options input { position:absolute; opacity:0; pointer-events:none; }
.variant-options span,.fixed-price-row { display:flex; justify-content:space-between; gap:5px; padding:8px 9px; border:1px solid #4a3e1f; border-radius:8px; color:#e9e6dc; background:#0d0f0e; font-size:.75rem; transition:all .15s ease; }
.variant-options strong,.fixed-price-row strong { color:var(--gold-bright); }
.variant-options input:checked + span { border-color:var(--gold); background:#2c2313; box-shadow:0 0 0 1px rgba(227,173,54,.25); transform:scale(1.02); transition:transform .15s cubic-bezier(.34,1.56,.64,1),border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.variant-options span { transition:transform .15s cubic-bezier(.34,1.56,.64,1),border-color .15s ease,background .15s ease; }
.fixed-price-row { margin-top:8px; align-items:center; }
.fixed-price-row span { color:var(--muted); font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; }
.fixed-price-row strong { font-size:.95rem; }
.price-action-row { display:flex; align-items:center; gap:8px; margin-top:8px; }
.price-action-row .fixed-price-row { flex:1; margin-top:0; }
.add-item-button.compact { flex:0 0 auto; width:38px; height:38px; margin-top:0; padding:0; border-radius:50%; font-size:1.1rem; }
.add-item-button { display:flex; justify-content:center; align-items:center; gap:8px; width:100%; margin-top:11px; padding:10px 10px; border:1px solid var(--gold); border-radius:9px; color:#161206; background:linear-gradient(135deg,var(--gold-bright),#d99a21); font-weight:800; letter-spacing:.01em; box-shadow:0 6px 14px rgba(227,173,54,.18); transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s ease,background .2s ease; }
.add-item-button:hover { background:#f7d272; transform:translateY(-2px); box-shadow:0 10px 22px rgba(227,173,54,.3); }
.add-item-button:active { transform:translateY(0) scale(.96); }
.add-item-button.added { background:#5fcf85; border-color:#3fae68; color:#0a2412; animation:posPop .5s cubic-bezier(.34,1.56,.64,1); }
.add-item-button.added span { display:inline-block; animation:posCheckIn .35s ease; }
.pos-cart { align-self:start; position:sticky; top:96px; max-height:calc(100vh - 116px); overflow:hidden; display:flex; flex-direction:column; padding:20px 20px 24px; border:1px solid #d8d8d1; border-radius:18px; background:linear-gradient(180deg,#f8f8f5,#efefe9); color:#141513; box-shadow:0 24px 55px rgba(0,0,0,.4); transition:box-shadow .3s ease,border-color .3s ease; }
.pos-cart.cart-updated { border-color:var(--gold); box-shadow:0 24px 55px rgba(0,0,0,.4),0 0 0 3px rgba(227,173,54,.18); animation:posPulseGlow .6s ease; }
.pos-cart-title { display:flex; justify-content:space-between; align-items:center; padding-bottom:16px; border-bottom:1px solid #d8d8d1; }
.pos-cart-title { flex:0 0 auto; }
.pos-cart-scroll { flex:1 1 auto; min-height:0; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:0 4px 12px 0; }
.pos-cart-actions { flex:0 0 auto; z-index:5; margin:0 -4px -12px; padding:10px 4px 12px; border-top:1px solid #d8d8d1; background:#efefe9; box-shadow:0 -10px 24px rgba(0,0,0,.08); }
.pos-cart-actions .pos-message { margin-top:0; }
.pos-cart-actions .pos-continue-btn { margin-top:0; }
.current-order-tab { display:flex; align-items:center; gap:9px; padding:12px 20px; border-radius:11px; color:#161206; background:linear-gradient(135deg,var(--gold-bright),#d99a21,var(--gold-bright)); background-size:200% 100%; animation:posShimmer 5s ease infinite alternate; font-size:1rem; font-weight:800; letter-spacing:.01em; box-shadow:0 8px 20px rgba(197,139,22,.28); }
.current-order-tab span { display:grid; place-items:center; min-width:24px; height:24px; padding:0 6px; border-radius:999px; color:#fff; background:#161206; font-size:.82rem; transition:transform .2s cubic-bezier(.34,1.56,.64,1); }
.pos-cart.cart-updated .current-order-tab span { animation:posPop .4s cubic-bezier(.34,1.56,.64,1); }
.clear-order-btn { color:#c32626; background:#fff; border:1px solid #e3b7b7; border-radius:8px; padding:9px 12px; font-weight:600; transition:all .15s ease; }
.clear-order-btn:hover { color:#fff; background:#c32626; border-color:#c32626; transform:translateY(-1px); }
.pos-cart-title h2 { margin:2px 0 0; font-size:1.35rem; }
.pos-cart-title h2 span { color:var(--gold); }
.cart-lines { max-height:280px; overflow:auto; padding:10px 0; }
.cart-empty { padding:44px 10px; text-align:center; color:#8b8b84; font-size:.9rem; animation:posFadeIn .4s ease; }
.cart-line { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:10px; padding:14px 10px; margin-bottom:6px; border-radius:10px; background:#fff; border:1px solid #e4e4de; box-shadow:0 2px 6px rgba(0,0,0,.03); animation:posCartLineIn .3s cubic-bezier(.16,1,.3,1) both; transition:box-shadow .15s ease,border-color .15s ease; }
.cart-line:hover { border-color:#d9c48f; box-shadow:0 4px 12px rgba(0,0,0,.06); }
.cart-line small { display:block; color:#83837c; margin-top:2px; }
.cart-controls { display:flex; align-items:center; gap:6px; }
.cart-controls button { width:28px; height:28px; padding:0; color:#161206; background:#fff; border:1px solid #cfcfc8; border-radius:7px; font-weight:700; transition:all .12s ease; }
.cart-controls button:hover { border-color:var(--gold); background:#fdf3d9; transform:translateY(-1px); }
.cart-controls button:active { transform:scale(.9); }
.cart-controls .remove-line { color:#d64545; border-color:#e3c0c0; background:#fff5f5; }
.cart-controls .remove-line:hover { color:#fff; background:#d64545; border-color:#d64545; }
.cart-summary { display:flex; justify-content:space-between; align-items:center; padding:16px 4px; border-top:1px solid #d8d8d1; border-bottom:1px dashed #c3c3bc; font-size:1rem; color:#5a5a54; }
.cart-summary strong { color:#c48614; font-size:1.3rem; }
.order-context-form { padding-top:18px; }
.order-context-form .form-label { color:#3a3a35; font-weight:650; font-size:.86rem; letter-spacing:.01em; }
.order-context-form .form-control,.order-context-form .form-select { color:#141513; background:#fff; border-color:#d4d4cd; border-radius:9px; }
.order-context-form .form-control:focus,.order-context-form .form-select:focus { border-color:var(--gold); box-shadow:0 0 0 .16rem rgba(227,173,54,.18); }
.order-type-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.order-type-tabs label { cursor:pointer; }
.order-type-tabs input { position:absolute; opacity:0; pointer-events:none; }
.order-type-tabs span { display:grid; place-items:center; min-height:42px; padding:6px; border:1px solid #d9c48f; border-radius:9px; background:#fff; color:#272318; font-size:.82rem; font-weight:700; text-align:center; transition:all .18s cubic-bezier(.34,1.56,.64,1); }
.order-type-tabs input:checked + span,.order-type-tabs span:hover { color:#161206; background:linear-gradient(135deg,var(--gold-bright),#d99a21); border-color:#c68a12; box-shadow:0 6px 16px rgba(227,173,54,.28); transform:translateY(-2px); }
.order-type-tabs input:checked + span { animation:posPop .35s cubic-bezier(.34,1.56,.64,1); }
.pos-continue-btn { display:flex; justify-content:center; align-items:center; gap:18px; width:100%; margin-top:16px; padding:14px; border:1px solid #c58b16; border-radius:10px; color:#161206; background:linear-gradient(135deg,var(--gold-bright),#d99a21); font-size:1.05rem; font-weight:800; letter-spacing:.01em; box-shadow:0 10px 24px rgba(197,139,22,.3); transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s ease; }
.pos-continue-btn:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(197,139,22,.4); }
.pos-continue-btn:active { transform:translateY(0) scale(.98); }
.pos-continue-btn span { transition:transform .2s ease; }
.pos-continue-btn:hover span { transform:translateX(4px); }
.pos-place-btn { display:flex; justify-content:center; align-items:center; gap:18px; width:100%; margin-top:10px; padding:14px; border:1px solid #1f7a44; border-radius:10px; color:#fff; background:linear-gradient(135deg,#1e9350,#146c39); font-size:1.05rem; font-weight:800; letter-spacing:.01em; box-shadow:0 10px 24px rgba(20,108,57,.3); transition:transform .15s cubic-bezier(.34,1.56,.64,1),box-shadow .15s ease; animation:posFadeSlideUp .3s ease both; }
.pos-place-btn:hover { transform:translateY(-2px); box-shadow:0 14px 30px rgba(20,108,57,.4); }
.pos-place-btn:active { transform:translateY(0) scale(.98); }
.pos-message { min-height:22px; margin-top:10px; font-size:.85rem; font-weight:600; }
.pos-message:not(:empty) { animation:posFadeSlideUp .25s ease both; }
.pos-message.success { color:#1e8f4f; }.pos-message.error { color:#d64545; }
.server-totals { margin-top:16px; padding:14px; border-radius:11px; background:#fff; border:1px solid #e4e4de; animation:posFadeIn .35s ease; }
.server-totals div { display:flex; justify-content:space-between; padding:5px 0; color:#5a5a54; font-size:.92rem; }
.server-totals .grand-total { margin-top:6px; padding-top:12px; border-top:1px dashed #c3c3bc; font-size:1.12rem; color:#161206; }
.server-totals .grand-total b { color:#bd7e0d; font-size:1.3rem; transition:transform .2s cubic-bezier(.34,1.56,.64,1); display:inline-block; }
.server-totals.totals-updated .grand-total b { animation:posPop .45s cubic-bezier(.34,1.56,.64,1); }
.auth-shell { min-height:100vh; display:grid; place-items:center; padding:24px; background:radial-gradient(circle at 50% 10%,#28200f 0,var(--bg) 40%); }
.auth-card { width:min(100%,440px); padding:38px; }
.auth-card h1 { margin:20px 0 8px; }
.auth-card form { margin-top:28px; }
.alert-success { color:#b9f2ca; background:#102a18; border-color:#245c35; }
.receipt-actions { max-width:80mm; margin:0 auto 18px; display:flex; justify-content:space-between; gap:10px; }
.receipt-80 { width:80mm; max-width:100%; margin:0 auto; padding:8mm 6mm; color:#111; background:#fff; font-family:Arial,sans-serif; font-size:11px; box-shadow:0 16px 45px rgba(0,0,0,.35); }
.receipt-head { text-align:center; padding-bottom:8px; border-bottom:1px dashed #222; }
.receipt-head img { width:54px; height:54px; object-fit:contain; }
.receipt-head h1 { margin:5px 0; font-size:18px; }
.receipt-meta { padding:8px 0; border-bottom:1px dashed #222; }
.receipt-meta div,.receipt-totals div { display:flex; justify-content:space-between; gap:12px; }
.receipt-meta span { color:#444; }.receipt-meta strong { text-align:right; }
.receipt-items { width:100%; margin:8px 0; border-collapse:collapse; }
.receipt-items th,.receipt-items td { padding:4px 2px; border-bottom:1px dotted #aaa; text-align:right; }
.receipt-items th:first-child,.receipt-items td:first-child { text-align:left; }.receipt-items small { display:block; color:#555; }
.receipt-totals { display:grid; gap:3px; }.receipt-grand { margin-top:4px; padding-top:5px; border-top:1px dashed #222; font-size:14px; }
.receipt-note { overflow-wrap:anywhere; }.receipt-80 footer { margin-top:12px; padding-top:8px; border-top:1px dashed #222; text-align:center; white-space:pre-line; }
.report-filter { padding:18px; display:flex; align-items:end; gap:12px; }.report-filter>div { flex:1; }.report-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:18px; }
.settings-section-title { margin:0 0 6px; color:var(--gold-bright); font-size:1.15rem; }
.settings-divider { margin:24px 0; border-color:#4b3b18; opacity:1; }
@media (max-width:850px) { .pos-shell{grid-template-columns:1fr}.pos-cart{position:static;max-height:none;box-shadow:0 18px 45px rgba(0,0,0,.3)}.pos-page-header{flex-direction:column;align-items:flex-start} }
@media (max-width:767px) { .sidebar{width:100%;position:static;border-right:0;border-bottom:1px solid var(--border)} .sidebar-nav{margin-top:20px;grid-template-columns:1fr 1fr} .app-shell{display:block} .app-content{margin-left:0;width:100%} .sidebar-resize-handle{display:none} .topbar{height:auto;padding:16px 20px} .content-wrap{padding:26px 20px} .page-heading,.pos-toolbar{align-items:flex-start;flex-direction:column}.pos-search{width:100%}.pos-menu{padding:16px}.pos-products{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px} }
@media (max-width:767px) { .report-filter{align-items:stretch;flex-direction:column}.report-grid{grid-template-columns:1fr} }
@media print { @page{size:80mm auto;margin:0} body{background:#fff!important}.app-shell>.sidebar,.topbar,.no-print{display:none!important}.app-content{margin:0!important;width:auto!important}.content-wrap{padding:0!important}.receipt-80{width:80mm;max-width:none;margin:0;padding:5mm;box-shadow:none} }

/* Operational workflows: held orders, voids, cashier shifts, audit and KOT */
.held-orders-strip { margin:0 0 16px; padding:12px 16px; border:1px solid var(--border); border-radius:10px; background:var(--surface); display:flex; gap:16px; align-items:center; }
.held-orders-strip>strong { color:var(--gold-bright); white-space:nowrap; }
.held-orders-strip>div { display:flex; gap:8px; flex-wrap:wrap; }
.held-order-chip { display:flex; overflow:hidden; border:1px solid #5b481a; border-radius:999px; background:#0b0d0d; }
.held-order-chip a { padding:7px 10px; color:var(--text); text-decoration:none; }
.held-order-chip form { display:flex; }
.held-order-chip button { border:0; border-left:1px solid #5b481a; padding:0 10px; color:#ff8d8d; background:transparent; }
.pos-action-row { display:grid; grid-template-columns:1fr 2fr; gap:10px; }
.void-order-control { display:inline-block; position:relative; margin-left:4px; text-align:left; }
.void-order-control summary { list-style:none; }
.void-order-control form { position:absolute; z-index:20; right:0; width:280px; padding:14px; border:1px solid #8c3838; border-radius:9px; background:#111; box-shadow:0 18px 50px #000; }
.order-voided { opacity:.72; }
.receipt-void-banner { border:3px double #a40000; margin-bottom:12px; padding:8px; color:#a40000; font-size:1.7rem; font-weight:900; text-align:center; transform:rotate(-2deg); }
.kitchen-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.kitchen-card h2 { margin:18px 0 8px; font-size:1.1rem; }
.kot-slip { width:min(100%,420px); margin:0 auto; padding:24px; color:#111; background:#fff; }
.kot-slip h1,.kot-slip h2 { text-align:center; }
.kot-meta { display:grid; gap:4px; padding:12px 0; border-top:2px dashed #111; border-bottom:2px dashed #111; }
.kot-slip table { width:100%; margin:14px 0; }
.kot-slip th,.kot-slip td { padding:8px 4px; border-bottom:1px dashed #777; vertical-align:top; }
.kot-slip td:first-child { width:52px; font-size:1.2rem; font-weight:800; }

/* Responsive tablet shell (Galaxy Tab A class devices in portrait and landscape). */
.sidebar-toggle,.sidebar-backdrop,.pos-cart-toggle,.pos-cart-close,.pos-cart-backdrop { display:none; }
.pos-header-actions,.pos-cart-title-actions { display:flex; align-items:center; gap:10px; }

@media (max-width:1180px), (max-width:1366px) and (hover:none) and (pointer:coarse) {
    body.nav-open { overflow:hidden; }
    .sidebar {
        position:fixed;
        inset:0 auto 0 0;
        z-index:130;
        width:min(320px,86vw);
        padding:24px 20px;
        overflow-y:auto;
        border-right:1px solid var(--border);
        border-bottom:0;
        box-shadow:18px 0 50px rgba(0,0,0,.48);
        transform:translateX(-105%);
        transition:transform .24s cubic-bezier(.16,1,.3,1);
    }
    .sidebar.is-open { transform:translateX(0); }
    .sidebar-nav { grid-template-columns:1fr; margin-top:28px; }
    .sidebar-resize-handle { display:none; }
    .sidebar-backdrop {
        display:block;
        position:fixed;
        inset:0;
        z-index:120;
        padding:0;
        border:0;
        background:rgba(0,0,0,.64);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transition:opacity .2s ease,visibility .2s ease;
    }
    body.nav-open .sidebar-backdrop { opacity:1; visibility:visible; pointer-events:auto; }
    .app-shell { display:block; }
    .app-content { width:100%; margin-left:0; }
    .topbar {
        position:sticky;
        top:0;
        z-index:80;
        height:68px;
        min-height:68px;
        padding:0 18px;
        gap:14px;
        justify-content:flex-end;
        backdrop-filter:blur(12px);
    }
    .sidebar-toggle {
        display:inline-flex;
        align-items:center;
        gap:8px;
        min-height:44px;
        margin-right:auto;
        padding:9px 14px;
        color:var(--text);
        background:#111414;
        border:1px solid var(--border);
        border-radius:10px;
        font-weight:700;
    }
    .sidebar-toggle>span:first-child { color:var(--gold-bright); font-size:1.2rem; line-height:1; }
    .content-wrap { max-width:none; padding:24px 20px; }
    .pos-content-wrap { padding:16px 18px 24px; }
    .pos-shell { grid-template-columns:minmax(0,1fr) minmax(320px,350px); gap:14px; }
    .pos-menu { padding:18px; }
    .pos-toolbar { margin-bottom:16px; }
    .pos-search { width:100%; }
    .pos-categories { flex-wrap:nowrap; padding-bottom:15px; scrollbar-width:thin; }
    .pos-categories button { min-height:44px; padding:9px 17px; }
    .pos-products { grid-template-columns:repeat(auto-fill,minmax(185px,1fr)); gap:13px; padding-top:17px; }
    .pos-product-image { aspect-ratio:16/10; }
    .pos-cart { top:84px; max-height:calc(100dvh - 100px); padding:17px; }
    .page-heading { align-items:flex-start; flex-wrap:wrap; }
}

@media (max-width:900px) {
    body.pos-cart-open { overflow:hidden; }
    .topbar .pakistan-clock { display:none; }
    .current-user-copy strong { max-width:180px; }
    .pos-page-header { flex-direction:row; align-items:center; }
    .pos-header-actions { margin-left:auto; }
    .pos-date-badge { display:none; }
    .pos-cart-toggle {
        display:inline-flex;
        align-items:center;
        gap:9px;
        min-height:44px;
        padding:9px 14px;
        border:1px solid var(--gold);
        border-radius:10px;
        color:#17130a;
        background:linear-gradient(135deg,var(--gold-bright),#d99a21);
        font-weight:800;
    }
    .pos-cart-toggle b { min-width:24px; padding:2px 7px; border-radius:999px; color:var(--gold-bright); background:#111; text-align:center; }
    .pos-shell { grid-template-columns:minmax(0,1fr); }
    .pos-products { grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); }
    .pos-product-image { min-height:165px; aspect-ratio:16/9; }
    .pos-cart {
        position:fixed;
        top:0;
        right:0;
        bottom:auto;
        left:auto;
        z-index:160;
        width:min(440px,94vw);
        height:var(--pos-viewport-height,100vh);
        max-height:var(--pos-viewport-height,100vh);
        box-sizing:border-box;
        display:grid;
        grid-template-rows:auto minmax(0,1fr) auto;
        padding:18px;
        border-radius:18px 0 0 18px;
        overflow:hidden;
        visibility:hidden;
        transform:translateX(105%);
        transition:transform .24s cubic-bezier(.16,1,.3,1),visibility .24s ease;
        touch-action:pan-y;
    }
    .pos-cart-scroll {
        min-height:0;
        height:100%;
        overflow-x:hidden;
        overflow-y:scroll;
        -webkit-overflow-scrolling:touch;
        touch-action:pan-y;
        padding-bottom:24px;
        padding-bottom:max(24px,env(safe-area-inset-bottom));
    }
    .pos-cart-scroll .cart-lines { max-height:none; overflow:visible; }
    .pos-cart-actions {
        position:relative;
        padding-bottom:12px;
        padding-bottom:max(12px,env(safe-area-inset-bottom));
    }
    .pos-shell.cart-open .pos-cart { visibility:visible; transform:translateX(0); }
    .pos-cart-close {
        display:inline-grid;
        place-items:center;
        width:42px;
        height:42px;
        padding:0;
        border:1px solid #bcbcb5;
        border-radius:9px;
        color:#222;
        background:#fff;
        font-size:1.45rem;
        line-height:1;
    }
    .pos-cart-backdrop {
        display:block;
        position:fixed;
        top:0;
        right:0;
        bottom:0;
        left:0;
        z-index:150;
        padding:0;
        border:0;
        background:rgba(0,0,0,.68);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transition:opacity .2s ease,visibility .2s ease;
    }
    .pos-shell.cart-open .pos-cart-backdrop { opacity:1; visibility:visible; pointer-events:auto; }
}

@media (max-width:600px) {
    .topbar { padding:0 12px; gap:9px; }
    .sidebar-toggle>span:last-child,.pakistan-clock { display:none; }
    .current-user-copy small { max-width:130px; }
    .content-wrap,.pos-content-wrap { padding:16px 12px 22px; }
    .pos-page-header h1 { font-size:1.35rem; }
    .pos-page-header p { display:none; }
    .pos-menu { padding:12px; border-radius:14px; }
    .pos-products { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    .pos-product-body { padding:11px; }
    .pos-product p { display:none; }
    .pos-action-row { grid-template-columns:1fr; }
    .held-orders-strip { align-items:flex-start; flex-direction:column; }
}

@media (hover:none) and (pointer:coarse) {
    .sidebar-nav a,.btn,.form-control,.form-select,button { min-height:44px; }
    .pos-product:hover,.pos-categories button:hover { transform:none; }
}
.kot-slip small { display:block; }
.kot-note { padding:10px; border:2px solid #111; font-size:1.1rem; }
@media print { .kot-slip { width:80mm; padding:3mm; } .kot-slip .no-print { display:none!important; } }
@media(max-width:720px){.held-orders-strip{align-items:flex-start;flex-direction:column}.pos-action-row{grid-template-columns:1fr}.void-order-control form{position:fixed;right:12px;left:12px;bottom:12px;width:auto}}

/* Theme control: light is the default; dark preserves the original black and gold workspace. */
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; padding:7px 11px; color:var(--text); background:var(--surface-2); border:1px solid var(--border); border-radius:999px; font-size:.76rem; font-weight:700; line-height:1; transition:background .18s ease,border-color .18s ease,transform .18s ease; }
.theme-toggle:hover { color:var(--text); border-color:var(--gold); transform:translateY(-1px); }
.theme-toggle-icon { display:grid; place-items:center; width:20px; height:20px; color:var(--gold-bright); font-size:1rem; }
.auth-theme-toggle { position:fixed; top:20px; right:20px; z-index:10; }

html[data-theme="light"] body { background:#f3f5f3; }
html[data-theme="light"] .sidebar { background:#fffdf8; box-shadow:8px 0 28px rgba(57,47,25,.06); }
html[data-theme="light"] .brand-mark { color:#422f08; background:linear-gradient(145deg,#fff3d4,#f1d899); }
html[data-theme="light"] .sidebar-nav a { color:#303632; }
html[data-theme="light"] .sidebar-nav a:hover { color:#704900; background:#f8f1e2; }
html[data-theme="light"] .topbar { background:rgba(255,255,255,.94); border-bottom-color:#dedfd9; box-shadow:0 5px 18px rgba(41,45,42,.05); }
html[data-theme="light"] .btn-outline-light { color:#323833; border-color:#9b9e98; }
html[data-theme="light"] .btn-outline-light:hover { color:#fff; background:#383d39; border-color:#383d39; }
html[data-theme="light"] .dash-heading { background:radial-gradient(circle at 15% 20%,#fff1cb 0,var(--surface) 58%),linear-gradient(145deg,var(--surface-2),var(--surface)); }
html[data-theme="light"] .metric-card,html[data-theme="light"] .panel,html[data-theme="light"] .auth-card { background:linear-gradient(145deg,#fff,var(--surface-2)); box-shadow:0 16px 38px rgba(46,49,44,.09); }
html[data-theme="light"] .dashboard-pulse-strip { background:linear-gradient(145deg,#fff,#f6f7f3); box-shadow:0 16px 38px rgba(46,49,44,.08); }
html[data-theme="light"] .dashboard-pulse-strip>div,html[data-theme="light"] .dashboard-pulse-strip>a { border-color:#e2dfd5; }
html[data-theme="light"] .dashboard-pulse-strip>a:hover { background:#fff5dd; }
html[data-theme="light"] .dashboard-insight-panel { background:radial-gradient(circle at 10% 0%,#fff4d7 0,#fff 58%); box-shadow:0 16px 38px rgba(46,49,44,.08); }
html[data-theme="light"] .dashboard-panel-title,html[data-theme="light"] .dashboard-recent-order { border-color:#e3e3dc; }
html[data-theme="light"] .order-mix-track { background:#e6e7e2; }
html[data-theme="light"] .form-actions { border-color:#dfe0da; }
html[data-theme="light"] .table-dark { --bs-table-bg:transparent; --bs-table-striped-bg:#f5f6f3; --bs-table-active-bg:#eee8da; --bs-table-hover-bg:#f8f0de; --bs-table-accent-bg:transparent; color:var(--text); border-color:#dcddd7; }
html[data-theme="light"] .table-dark.table-striped>tbody>tr:nth-of-type(odd)>* { color:var(--text); }
html[data-theme="light"] .table-dark.table-hover>tbody>tr:hover>* { color:var(--text); }
html[data-theme="light"] .status-pill.active { color:#176c36; background:#e0f4e7; }
html[data-theme="light"] .status-pill.inactive { color:#9e2929; background:#fbe4e4; }
html[data-theme="light"] .form-control,html[data-theme="light"] .form-select { color:var(--text); background-color:#fff; border-color:#cfd2cb; }
html[data-theme="light"] .form-control:focus,html[data-theme="light"] .form-select:focus { color:var(--text); background-color:#fff; border-color:var(--gold); }
html[data-theme="light"] .form-control::placeholder { color:#8a8e88; }
html[data-theme="light"] .permission-option,html[data-theme="light"] .variant-help-panel { background:#fafbf8; border-color:#dcded7; }
html[data-theme="light"] .logo-preview img { background:#fff; }
html[data-theme="light"] .crop-close { color:var(--text); background:#fff; border-color:#cfd2cb; }
html[data-theme="light"] .crop-canvas-wrap { background:#eef0ec; }
html[data-theme="light"] .pos-content-wrap { background:radial-gradient(circle at 50% 0%,#fff4d7 0,var(--bg) 57%); }
html[data-theme="light"] .pos-date-badge,html[data-theme="light"] .pos-work-title { background:linear-gradient(145deg,#fff,#f4f5f1); }
html[data-theme="light"] .pos-menu { background:radial-gradient(circle at 30% 0%,#fff7e5 0,#fff 68%); box-shadow:0 18px 42px rgba(48,50,45,.1); }
html[data-theme="light"] .pos-search .form-control { background:#fff; border-color:#d7d0bf; box-shadow:inset 0 1px 0 rgba(0,0,0,.02); }
html[data-theme="light"] .pos-categories { border-color:#ded8c9; }
html[data-theme="light"] .pos-categories button { color:var(--text); background:linear-gradient(145deg,#fff,#f4f5f1); }
html[data-theme="light"] .pos-product { border-color:#ded6c2; background:linear-gradient(165deg,#fff,#f5f6f2); box-shadow:0 10px 25px rgba(44,47,42,.1); }
html[data-theme="light"] .pos-product:hover { box-shadow:0 16px 34px rgba(44,47,42,.15),0 0 0 1px rgba(178,119,12,.15); }
html[data-theme="light"] .pos-product-image { background:linear-gradient(150deg,#eef1eb,#dfe5dc); }
html[data-theme="light"] .variant-options span,html[data-theme="light"] .fixed-price-row { color:#30352f; background:#fff; border-color:#d7ccb4; }
html[data-theme="light"] .variant-options input:checked + span { background:#fff0ca; }
html[data-theme="light"] .auth-shell { background:radial-gradient(circle at 50% 10%,#fff0c8 0,var(--bg) 43%); }
html[data-theme="light"] .alert-success { color:#176c36; background:#e4f6e9; border-color:#a7d8b6; }
html[data-theme="light"] .settings-divider { border-color:#d8c79f; }
html[data-theme="light"] .held-orders-strip { background:#fff; }
html[data-theme="light"] .held-order-chip { background:#fff8e9; border-color:#d8bd7e; }
html[data-theme="light"] .held-order-chip button { border-color:#d8bd7e; color:#a32828; }
html[data-theme="light"] .void-order-control form { color:var(--text); background:#fff; box-shadow:0 18px 50px rgba(33,37,34,.2); }
html[data-theme="light"] .sidebar-toggle { color:var(--text); background:#fff; }

@media (max-width:600px) { .theme-toggle-label { display:none; } .theme-toggle { width:42px; min-width:42px; padding:7px; } .auth-theme-toggle { top:12px; right:12px; } }
@media print { .theme-toggle { display:none!important; } }