/* =========================================================
   Cafee POS System — Microsoft Edge / Fluent inspired theme
   System By Harees | 0773 207 160
   ========================================================= */
:root{
  --edge-navy:#0B2E59;
  --edge-blue:#0C59A4;
  --edge-primary:#0078D4;
  --edge-sky:#2B9FE6;
  --edge-cyan:#35C1F1;
  --edge-green:#4CC38A;
  --edge-grad:linear-gradient(135deg,#0C59A4 0%,#1477D2 40%,#2FB4E8 75%,#4CC38A 100%);
  --edge-grad-soft:linear-gradient(135deg,rgba(12,89,164,.08),rgba(53,193,241,.08),rgba(76,195,138,.08));
  --bg:#F3F6FA;
  --surface:#FFFFFF;
  --surface-2:#F8FAFD;
  --border:#E3E8EF;
  --grid:#EEF2F7;
  --text:#1B1F24;
  --muted:#5F6B7A;
  --radius:10px;
  --shadow:0 1px 2px rgba(16,24,40,.06),0 2px 8px rgba(16,24,40,.05);
  --shadow-lg:0 8px 28px rgba(16,24,40,.12);
  --sidebar-w:252px;
  --bs-primary:#0078D4; --bs-primary-rgb:0,120,212;
  --bs-link-color:#0067B8; --bs-link-hover-color:#0C59A4;
  --bs-body-font-family:"Segoe UI Variable","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  --bs-body-color:#1B1F24; --bs-body-bg:#F3F6FA; --bs-border-color:#E3E8EF;
}
html,body{background:var(--bg)}
body{font-size:.94rem;-webkit-font-smoothing:antialiased}
a{text-decoration:none}

/* ---------- Sidebar ---------- */
.sidebar{width:var(--sidebar-w);background:linear-gradient(180deg,#0B2E59 0%,#0A3F7A 55%,#0C5A8F 100%);color:#DCE8F7;display:flex;flex-direction:column}
@media (min-width:992px){.sidebar{position:fixed;inset:0 auto 0 0;z-index:1030;overflow-y:auto}.main{margin-left:var(--sidebar-w)}}
@media (max-width:991.98px){.sidebar.offcanvas-lg{width:var(--sidebar-w)!important;background:linear-gradient(180deg,#0B2E59 0%,#0A3F7A 55%,#0C5A8F 100%)!important}}
.sidebar .brand{display:flex;align-items:center;gap:.7rem;padding:1.05rem 1rem;border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar .brand img{width:38px;height:38px}
.brand-name{font-weight:700;color:#fff;font-size:1rem;line-height:1.1}
.brand-sub{font-size:.72rem;color:#9FC3EA;letter-spacing:.06em;text-transform:uppercase}
.side-nav{padding:.5rem .6rem 2rem;overflow-y:auto;flex:1}
.nav-group{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:#7FA7D3;margin:1rem .6rem .35rem;font-weight:600}
.side-nav a{display:flex;align-items:center;gap:.7rem;color:#D6E4F5;padding:.5rem .7rem;border-radius:8px;margin:1px 0;font-size:.9rem;position:relative;transition:background .15s}
.side-nav a i{font-size:1.05rem;width:20px;text-align:center;opacity:.9}
.side-nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.side-nav a.active{background:rgba(255,255,255,.14);color:#fff;font-weight:600}
.side-nav a.active::before{content:"";position:absolute;left:-2px;top:22%;bottom:22%;width:4px;border-radius:4px;background:linear-gradient(180deg,#35C1F1,#4CC38A)}

/* ---------- Topbar ---------- */
.main{min-height:100vh;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:1020;display:flex;align-items:center;gap:.6rem;padding:.6rem 1.25rem;background:rgba(255,255,255,.85);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border);min-height:58px}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--edge-grad);opacity:.85}
.page-title{font-size:1.15rem;font-weight:600;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.btn-icon{border:0;background:transparent;font-size:1.5rem;padding:.1rem .4rem;color:var(--edge-blue)}
.btn-user{display:flex;align-items:center;gap:.5rem;border:1px solid var(--border);background:#fff;border-radius:999px;padding:.2rem .7rem .2rem .2rem}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--edge-grad);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem}
.clock{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.88rem}
.content{padding:1.25rem;flex:1}
@media (max-width:575.98px){.content{padding:.75rem}.topbar{padding:.5rem .75rem}}

/* ---------- Footer ---------- */
.app-footer{display:flex;flex-wrap:wrap;gap:.4rem 1rem;justify-content:space-between;padding:.8rem 1.25rem;font-size:.82rem;color:var(--muted);border-top:1px solid var(--border);background:#fff}
.app-footer a{color:var(--edge-primary)}

/* ---------- Components ---------- */
.card-fluent,.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-header{background:transparent;border-bottom:1px solid var(--border);font-weight:600;padding:.8rem 1rem}
.btn{border-radius:6px;font-weight:500}
.btn-edge{background:var(--edge-grad);color:#fff;border:0;box-shadow:0 2px 6px rgba(12,89,164,.25)}
.btn-edge:hover,.btn-edge:focus{color:#fff;filter:brightness(1.07);box-shadow:0 4px 12px rgba(12,89,164,.3)}
.btn-primary{--bs-btn-bg:#0078D4;--bs-btn-border-color:#0078D4;--bs-btn-hover-bg:#0067B8;--bs-btn-hover-border-color:#0067B8;--bs-btn-active-bg:#005A9E}
.btn-outline-primary{--bs-btn-color:#0078D4;--bs-btn-border-color:#0078D4;--bs-btn-hover-bg:#0078D4;--bs-btn-hover-border-color:#0078D4}
.form-control,.form-select{border-radius:6px;border-color:#CBD5E1}
.form-control:focus,.form-select:focus{border-color:#0078D4;box-shadow:0 0 0 .2rem rgba(0,120,212,.18)}
.form-check-input:checked{background-color:#0078D4;border-color:#0078D4}
.table{--bs-table-bg:transparent;margin:0}
.table thead th{font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;background:var(--surface-2);border-bottom:1px solid var(--border);white-space:nowrap}
.table td{vertical-align:middle}
.table-wrap{overflow-x:auto}
.text-bg-primary{background:#0078D4!important}
.badge{font-weight:600}
.nav-pills .nav-link.active{background:var(--edge-grad)}
.nav-pills .nav-link{color:var(--edge-blue)}
.modal-content{border:0;border-radius:12px;box-shadow:var(--shadow-lg)}
.modal-header{border-bottom:1px solid var(--border)}
.modal-header .modal-title{font-weight:600}
.toolbar{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:1rem}
.toolbar .search{max-width:280px}

/* ---------- KPI tiles ---------- */
.kpi{position:relative;overflow:hidden;padding:1rem 1.1rem;border-radius:var(--radius);background:#fff;border:1px solid var(--border);box-shadow:var(--shadow);height:100%}
.kpi .label{color:var(--muted);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.kpi .value{font-size:1.55rem;font-weight:700;margin-top:.2rem;font-variant-numeric:tabular-nums}
.kpi .icon{position:absolute;right:.9rem;top:.9rem;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#fff;background:var(--edge-grad)}
.kpi.hero{background:var(--edge-grad);color:#fff;border:0}
.kpi.hero .label{color:rgba(255,255,255,.85)}
.kpi.hero .icon{background:rgba(255,255,255,.2)}

/* ---------- Login ---------- */
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem;background:radial-gradient(1200px 600px at 10% 10%,rgba(53,193,241,.35),transparent 60%),radial-gradient(900px 500px at 90% 90%,rgba(76,195,138,.35),transparent 60%),linear-gradient(135deg,#0B2E59,#0C59A4 60%,#1A8BD8)}
.login-card{width:100%;max-width:400px;background:rgba(255,255,255,.96);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.25);padding:2rem}
.login-card .logo{width:64px;height:64px}
.login-footer{color:rgba(255,255,255,.85);font-size:.82rem;text-align:center;margin-top:1rem}
.login-footer a{color:#fff}

/* ---------- POS ---------- */
body.pos-mode .content{padding:0}
body.pos-mode .app-footer{display:none}
.pos{display:grid;grid-template-columns:1fr 400px;height:calc(100vh - 58px)}
.pos-left{display:flex;flex-direction:column;min-width:0;overflow:hidden}
.pos-top{display:flex;gap:.5rem;padding:.65rem .75rem;background:#fff;border-bottom:1px solid var(--border);flex-wrap:wrap}
.pos-top .form-control{max-width:340px}
.cat-bar{display:flex;gap:.45rem;overflow-x:auto;padding:.6rem .75rem;background:var(--surface-2);border-bottom:1px solid var(--border);scrollbar-width:thin}
.cat-btn{flex:0 0 auto;border:1px solid var(--border);background:#fff;border-radius:999px;padding:.45rem .95rem;font-weight:600;font-size:.88rem;display:flex;align-items:center;gap:.4rem;color:var(--text);min-height:42px}
.cat-btn .dot{width:10px;height:10px;border-radius:50%}
.cat-btn.active{background:var(--edge-grad);color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(12,89,164,.3)}
.prod-grid{flex:1;overflow-y:auto;padding:.75rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.65rem;align-content:start}
.prod{position:relative;border:1px solid var(--border);border-radius:12px;background:#fff;padding:.7rem;text-align:left;min-height:108px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow);transition:transform .08s,box-shadow .15s;cursor:pointer;user-select:none;overflow:hidden}
.prod:hover{box-shadow:var(--shadow-lg)}
.prod:active{transform:scale(.97)}
.prod::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c,#0078D4)}
.prod .p-img{width:100%;height:72px;object-fit:cover;border-radius:8px;margin-bottom:.4rem}
.prod .p-name{font-weight:600;font-size:.92rem;line-height:1.2}
.prod .p-price{color:var(--edge-blue);font-weight:700;font-size:.92rem;margin-top:.3rem}
.prod .p-old{text-decoration:line-through;color:var(--muted);font-weight:400;font-size:.78rem;margin-left:.3rem}
.prod.disabled{opacity:.45;pointer-events:none}
.prod .tag{position:absolute;top:.4rem;right:.4rem;font-size:.66rem}
.pos-right{display:flex;flex-direction:column;background:#fff;border-left:1px solid var(--border);min-height:0}
.order-head{padding:.65rem .75rem;border-bottom:1px solid var(--border)}
.otype .btn{flex:1;font-size:.85rem;padding:.45rem .2rem}
.otype .btn.active{background:var(--edge-grad);color:#fff;border-color:transparent}
.cart{flex:1;overflow-y:auto;padding:.25rem .5rem}
.cart-empty{color:var(--muted);text-align:center;padding:3rem 1rem}
.cart-empty i{font-size:2.6rem;opacity:.35}
.ci{display:flex;gap:.5rem;padding:.55rem .35rem;border-bottom:1px dashed var(--border);cursor:pointer;border-radius:8px}
.ci:hover{background:var(--surface-2)}
.ci.sel{background:rgba(0,120,212,.07)}
.ci .ci-main{flex:1;min-width:0}
.ci .ci-name{font-weight:600;font-size:.9rem}
.ci .ci-mods{font-size:.78rem;color:var(--muted)}
.ci .ci-note{font-size:.78rem;color:#B45309}
.ci .ci-total{font-weight:700;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.ci .sent{font-size:.65rem}
.qty-ctl{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-top:.3rem}
.qty-ctl button{border:0;background:var(--surface-2);width:32px;height:30px;font-weight:700}
.qty-ctl span{min-width:32px;text-align:center;font-weight:600}
.totals{padding:.6rem .9rem;border-top:1px solid var(--border);background:var(--surface-2);font-size:.9rem}
.totals .row-t{display:flex;justify-content:space-between;padding:.1rem 0;font-variant-numeric:tabular-nums}
.totals .grand{font-size:1.3rem;font-weight:800;color:var(--edge-navy);border-top:1px solid var(--border);margin-top:.3rem;padding-top:.35rem}
.pos-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem;padding:.55rem .75rem}
.pos-actions .btn{font-size:.78rem;padding:.45rem .2rem;display:flex;flex-direction:column;align-items:center;gap:.1rem}
.pos-actions .btn i{font-size:1.1rem}
.pay-btn{margin:0 .75rem .75rem;font-size:1.15rem;padding:.8rem;font-weight:700;border-radius:10px}
.mod-group{margin-bottom:1rem}
.mod-group h6{font-weight:700;font-size:.85rem;text-transform:uppercase;color:var(--muted);letter-spacing:.04em}
.chip{display:inline-flex;align-items:center;gap:.3rem;border:1px solid #CBD5E1;border-radius:999px;padding:.45rem .9rem;margin:0 .35rem .45rem 0;background:#fff;font-weight:500;cursor:pointer;min-height:40px;user-select:none}
.chip small{color:var(--muted)}
.chip.on{background:var(--edge-grad);color:#fff;border-color:transparent}
.chip.on small{color:#E0F2FE}
.pay-methods{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}
.pay-methods .btn{padding:.8rem;font-weight:600;display:flex;align-items:center;justify-content:center;gap:.45rem}
.quick-cash{display:flex;flex-wrap:wrap;gap:.4rem}
.quick-cash .btn{flex:1 1 22%}
.paid-line{display:flex;justify-content:space-between;align-items:center;padding:.35rem .6rem;border:1px solid var(--border);border-radius:8px;margin-bottom:.35rem;background:var(--surface-2)}
.mobile-cart-bar{display:none}
@media (max-width:991.98px){
  .pos{grid-template-columns:1fr;height:calc(100vh - 58px)}
  .pos-right{position:fixed;inset:58px 0 0 0;z-index:1040;transform:translateY(105%);transition:transform .25s ease;border-left:0}
  .pos-right.open{transform:none}
  .mobile-cart-bar{display:flex;position:fixed;left:.75rem;right:.75rem;bottom:.75rem;z-index:1035;border-radius:12px;padding:.85rem 1rem;justify-content:space-between;align-items:center;font-weight:700;box-shadow:var(--shadow-lg)}
  .prod-grid{padding-bottom:5rem;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
}

/* ---------- Tables layout ---------- */
.area-title{font-weight:700;color:var(--muted);font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;margin:1rem 0 .5rem}
.tbl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.75rem}
.tbl{border-radius:14px;padding:1rem;background:#fff;border:2px solid var(--border);text-align:center;cursor:pointer;box-shadow:var(--shadow);position:relative;min-height:120px}
.tbl .t-name{font-size:1.4rem;font-weight:800}
.tbl .t-meta{font-size:.78rem;color:var(--muted)}
.tbl.available{border-color:#86EFAC;background:linear-gradient(180deg,#F0FDF4,#fff)}
.tbl.occupied{border-color:#FCA5A5;background:linear-gradient(180deg,#FEF2F2,#fff)}
.tbl.reserved{border-color:#FCD34D;background:linear-gradient(180deg,#FFFBEB,#fff)}
.tbl.cleaning{border-color:#7DD3FC;background:linear-gradient(180deg,#F0F9FF,#fff)}
.tbl .t-amt{font-weight:700;color:#B91C1C;margin-top:.2rem}

/* ---------- KDS ---------- */
body.kds-mode{background:#0E1726}
body.kds-mode .content{padding:.75rem}
.kds-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:.75rem;align-items:start}
.ticket{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.25);border-top:6px solid #0078D4}
.ticket.st-preparing{border-top-color:#F59E0B}
.ticket.st-ready{border-top-color:#16A34A}
.ticket.late{animation:pulse 1.4s infinite;border-top-color:#DC2626}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.6)}50%{box-shadow:0 0 0 8px rgba(220,38,38,0)}}
.ticket .t-head{display:flex;justify-content:space-between;align-items:center;padding:.6rem .8rem;background:var(--surface-2);border-bottom:1px solid var(--border)}
.ticket .t-no{font-size:1.25rem;font-weight:800}
.ticket .timer{font-variant-numeric:tabular-nums;font-weight:700;font-size:1.05rem}
.ticket.late .timer{color:#DC2626}
.ticket ul{list-style:none;margin:0;padding:.4rem .8rem}
.ticket li{padding:.4rem 0;border-bottom:1px dashed var(--border)}
.ticket li:last-child{border-bottom:0}
.ticket .k-qty{font-weight:800;color:var(--edge-blue);margin-right:.35rem;font-size:1.05rem}
.ticket .k-item{font-weight:700;font-size:1.02rem}
.ticket .k-mods{font-size:.85rem;color:#334155}
.ticket .k-note{font-size:.85rem;color:#B45309;font-weight:600}
.ticket .t-foot{padding:.6rem .8rem;display:flex;gap:.4rem}
.ticket .t-foot .btn{flex:1;font-weight:700;padding:.65rem}
.kds-head{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.75rem;color:#fff}
.kds-head .btn-outline-light.active{background:#fff;color:#0B2E59}

/* ---------- Customer display ---------- */
.cd{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;background:#fff}
.cd-left{background:var(--edge-grad);color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2rem;text-align:center}
.cd-right{padding:1.5rem;display:flex;flex-direction:column}
@media (max-width:768px){.cd{grid-template-columns:1fr}.cd-left{min-height:30vh}}

/* ---------- Misc ---------- */
.stat-list .d-flex{padding:.45rem 0;border-bottom:1px dashed var(--border)}
.stat-list .d-flex:last-child{border-bottom:0}
.thumb{width:42px;height:42px;object-fit:cover;border-radius:8px;background:var(--surface-2)}
.thumb-ph{width:42px;height:42px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--edge-grad-soft);color:var(--edge-blue)}
.low{color:#DC2626;font-weight:700}
@media print{.sidebar,.topbar,.app-footer,.no-print,.toolbar{display:none!important}.main{margin:0!important}.content{padding:0}.card,.card-fluent{box-shadow:none;border:0}}
@media (max-width:575.98px){
  .kpi{padding:.8rem .85rem}.kpi .value{font-size:1.12rem;padding-right:2.4rem}.kpi .icon{width:32px;height:32px;font-size:1rem;right:.6rem;top:.6rem}.kpi .label{font-size:.7rem;padding-right:2.4rem}
  .page-title{font-size:1.02rem}
  .pay-methods .btn{padding:.6rem .3rem;font-size:.9rem}
}

/* =========================================================
   DARK THEME  (Edge dark: deep navy surfaces + blue/teal accents)
   ========================================================= */
[data-bs-theme="dark"]{
  --bg:#0B1220;
  --surface:#121B2B;
  --surface-2:#172235;
  --border:#243247;
  --grid:#1F2B3D;
  --text:#E6EDF6;
  --muted:#93A4BA;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 2px 10px rgba(0,0,0,.25);
  --shadow-lg:0 10px 32px rgba(0,0,0,.5);
  --edge-grad-soft:linear-gradient(135deg,rgba(53,193,241,.12),rgba(76,195,138,.10));
  --bs-body-bg:#0B1220; --bs-body-color:#E6EDF6; --bs-border-color:#243247;
  --bs-secondary-bg:#172235; --bs-tertiary-bg:#121B2B; --bs-secondary-color:#93A4BA;
  --bs-link-color:#4CB4F5; --bs-link-hover-color:#7CCBFA; --bs-link-color-rgb:76,180,245;
  --bs-emphasis-color:#fff;
  color-scheme:dark;
}
[data-bs-theme="dark"] body{color:var(--text)}
[data-bs-theme="dark"] .sidebar,[data-bs-theme="dark"] .sidebar.offcanvas-lg{background:linear-gradient(180deg,#07101E 0%,#0A1A33 55%,#0B2747 100%)!important;border-right:1px solid #16243A}
[data-bs-theme="dark"] .topbar{background:rgba(14,22,36,.85);border-bottom-color:var(--border)}
[data-bs-theme="dark"] .btn-icon{color:#7CCBFA}
[data-bs-theme="dark"] .btn-user{background:var(--surface);border-color:var(--border);color:var(--text)}
[data-bs-theme="dark"] .app-footer{background:var(--surface);border-top-color:var(--border)}
[data-bs-theme="dark"] .app-footer a{color:#4CB4F5}
[data-bs-theme="dark"] .card,[data-bs-theme="dark"] .card-fluent,[data-bs-theme="dark"] .kpi,[data-bs-theme="dark"] .modal-content,[data-bs-theme="dark"] .list-group-item,[data-bs-theme="dark"] .dropdown-menu{background:var(--surface);border-color:var(--border);color:var(--text)}
[data-bs-theme="dark"] .kpi.hero{background:var(--edge-grad);border:0}
[data-bs-theme="dark"] .card-footer.bg-white,[data-bs-theme="dark"] .bg-white{background:var(--surface)!important}
[data-bs-theme="dark"] .table{--bs-table-color:var(--text);--bs-table-hover-bg:rgba(53,193,241,.06);--bs-table-hover-color:var(--text);border-color:var(--border)}
[data-bs-theme="dark"] .table thead th{background:var(--surface-2);color:var(--muted);border-color:var(--border)}
[data-bs-theme="dark"] .form-control,[data-bs-theme="dark"] .form-select,[data-bs-theme="dark"] .input-group-text{background-color:#0E1727;border-color:#2C3B52;color:var(--text)}
[data-bs-theme="dark"] .form-control:focus,[data-bs-theme="dark"] .form-select:focus{border-color:#35C1F1;box-shadow:0 0 0 .2rem rgba(53,193,241,.2);background-color:#0E1727;color:var(--text)}
[data-bs-theme="dark"] .form-control::placeholder{color:#62738A}
[data-bs-theme="dark"] .btn-light{--bs-btn-bg:#1A2638;--bs-btn-border-color:#2A3A52;--bs-btn-color:#DCE6F2;--bs-btn-hover-bg:#22324A;--bs-btn-hover-border-color:#35486A;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#22324A}
[data-bs-theme="dark"] .btn-light.border{border-color:#2A3A52!important}
[data-bs-theme="dark"] .btn-outline-primary{--bs-btn-color:#4CB4F5;--bs-btn-border-color:#2F7FC1;--bs-btn-hover-bg:#0078D4;--bs-btn-hover-color:#fff}
[data-bs-theme="dark"] .text-bg-light{background:#1F2B3D!important;color:#DCE6F2!important}
[data-bs-theme="dark"] .nav-pills .nav-link{color:#7CCBFA}
[data-bs-theme="dark"] .text-muted{color:var(--muted)!important}
[data-bs-theme="dark"] .low{color:#FF7A7A}
[data-bs-theme="dark"] .text-warning-emphasis{color:#FBBF24!important}
[data-bs-theme="dark"] .thumb,[data-bs-theme="dark"] .thumb-ph{background:var(--surface-2)}
[data-bs-theme="dark"] .thumb-ph{color:#7CCBFA}
/* POS */
[data-bs-theme="dark"] .pos-top,[data-bs-theme="dark"] .pos-right{background:var(--surface);border-color:var(--border)}
[data-bs-theme="dark"] .pos-top .input-group-text.bg-white{background:#0E1727!important}
[data-bs-theme="dark"] .cat-bar{background:var(--bg);border-color:var(--border)}
[data-bs-theme="dark"] .cat-btn{background:var(--surface);border-color:var(--border);color:var(--text)}
[data-bs-theme="dark"] .cat-btn.active{background:var(--edge-grad);color:#fff;border-color:transparent}
[data-bs-theme="dark"] .prod{background:var(--surface);border-color:var(--border);color:var(--text)}
[data-bs-theme="dark"] .prod:hover{border-color:#2F7FC1}
[data-bs-theme="dark"] .prod .p-price{color:#4CB4F5}
[data-bs-theme="dark"] .ci:hover{background:var(--surface-2)}
[data-bs-theme="dark"] .ci.sel{background:rgba(53,193,241,.10)}
[data-bs-theme="dark"] .ci .ci-note{color:#FBBF24}
[data-bs-theme="dark"] .qty-ctl{border-color:var(--border)}
[data-bs-theme="dark"] .qty-ctl button{background:var(--surface-2);color:var(--text)}
[data-bs-theme="dark"] .totals{background:var(--surface-2);border-color:var(--border)}
[data-bs-theme="dark"] .totals .grand{color:#fff;border-color:var(--border)}
[data-bs-theme="dark"] .chip{background:var(--surface-2);border-color:#2C3B52;color:var(--text)}
[data-bs-theme="dark"] .chip.on{background:var(--edge-grad);color:#fff;border-color:transparent}
[data-bs-theme="dark"] .paid-line{background:var(--surface-2);border-color:var(--border)}
/* Tables */
[data-bs-theme="dark"] .tbl{background:var(--surface);border-color:var(--border)}
[data-bs-theme="dark"] .tbl.available{border-color:#2F9E62;background:linear-gradient(180deg,rgba(76,195,138,.14),var(--surface))}
[data-bs-theme="dark"] .tbl.occupied{border-color:#C24848;background:linear-gradient(180deg,rgba(239,68,68,.16),var(--surface))}
[data-bs-theme="dark"] .tbl.reserved{border-color:#B8891C;background:linear-gradient(180deg,rgba(245,158,11,.16),var(--surface))}
[data-bs-theme="dark"] .tbl.cleaning{border-color:#2A8DB8;background:linear-gradient(180deg,rgba(53,193,241,.14),var(--surface))}
[data-bs-theme="dark"] .tbl .t-amt{color:#FF8A8A}
/* KDS */
[data-bs-theme="dark"] body.kds-mode{background:#060B14}
[data-bs-theme="dark"] .ticket{background:var(--surface);color:var(--text)}
[data-bs-theme="dark"] .ticket .t-head{background:var(--surface-2);border-color:var(--border)}
[data-bs-theme="dark"] .ticket li{border-color:var(--border)}
[data-bs-theme="dark"] .ticket .k-qty{color:#4CB4F5}
[data-bs-theme="dark"] .ticket .k-mods{color:#B8C6D8}
[data-bs-theme="dark"] .ticket .k-note{color:#FBBF24}
/* Login & customer display */
[data-bs-theme="dark"] .login-page{background:radial-gradient(1100px 600px at 10% 10%,rgba(53,193,241,.22),transparent 60%),radial-gradient(900px 500px at 90% 90%,rgba(76,195,138,.18),transparent 60%),linear-gradient(135deg,#050B16,#0A1A33 60%,#0C3260)}
[data-bs-theme="dark"] .login-card{background:rgba(18,27,43,.92);border:1px solid #243247;color:var(--text);backdrop-filter:blur(10px)}
[data-bs-theme="dark"] .form-floating>label{color:#8FA0B6}
[data-bs-theme="dark"] .form-floating>.form-control:focus~label,[data-bs-theme="dark"] .form-floating>.form-control:not(:placeholder-shown)~label{color:#8FA0B6}
[data-bs-theme="dark"] .form-floating>.form-control:focus~label::after,[data-bs-theme="dark"] .form-floating>.form-control:not(:placeholder-shown)~label::after{background:transparent}
[data-bs-theme="dark"] .cd{background:var(--bg)}
/* theme toggle button */
.theme-toggle{font-size:1.15rem;border-radius:999px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center}
.theme-toggle:hover{background:var(--surface-2)}
[data-bs-theme="dark"] .btn-light:disabled,[data-bs-theme="dark"] .btn-light.disabled{--bs-btn-disabled-bg:#152033;--bs-btn-disabled-border-color:#243247;--bs-btn-disabled-color:#8396AE;opacity:1}
[data-bs-theme="dark"] .btn-close{filter:invert(1) grayscale(100%) brightness(200%)}
.toolbar.card{flex-direction:row;align-items:center}
[data-bs-theme="dark"] .form-floating>.form-control::placeholder{color:transparent}

/* ---------- Kiosk / extended display mode ---------- */
body.kiosk-mode .sidebar,body.kiosk-mode .topbar,body.kiosk-mode .app-footer{display:none!important}
body.kiosk-mode .main{margin-left:0!important}
body.kiosk-mode .content{padding:.75rem}
.fs-hint{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:3000;display:none;align-items:center;gap:.5rem;background:rgba(12,89,164,.92);color:#fff;padding:.6rem 1.1rem;border-radius:999px;font-weight:600;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.screen-map{position:relative;height:190px;border:1px dashed var(--border);border-radius:10px;background:var(--surface-2);overflow:hidden}
.screen-box{position:absolute;border:2px solid #2F7FC1;border-radius:6px;background:rgba(0,120,212,.12);display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:.75rem;color:var(--text);text-align:center;padding:2px}
.screen-box b{font-size:1.4rem;line-height:1}
.screen-box.primary{border-color:#4CC38A;background:rgba(76,195,138,.14)}
.ticket.st-completed{border-top-color:#16A34A;opacity:.95}