/* ==========================================================================
   BURGER BOSS — Admin dashboard stylesheet
========================================================================== */
:root{
  --bg:#0e0d0c; --bg-alt:#161210; --card:#1e1814; --line:rgba(243,234,217,.09);
  --red:#d81f3d; --amber:#f2a63c; --cream:#f4ead9; --cream-rgb:244,234,217; --muted:#a9998a; --green:#4caf6d;
  --bg-rgb:14,13,12;
  --display:'Anton',sans-serif; --mono:'Space Mono',monospace; --body:'Manrope',sans-serif;
}
/* ---------------- LIGHT MODE ---------------- */
[data-theme="light"]{
  --bg:#f6f2ea; --bg-alt:#eee5d6; --card:#ffffff; --line:rgba(24,18,12,.10);
  --red:#d81f3d; --amber:#c97a12; --cream:#221b14; --cream-rgb:34,27,20; --muted:#6e6255; --green:#268049;
  --bg-rgb:246,242,234;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--cream);font-family:var(--body);-webkit-font-smoothing:antialiased;transition:background-color .35s ease,color .35s ease;}
.dash-sidebar,.dash-topbar,.panel,.kpi-card,table.dash-table td,.modal,#notifPanel,.pos-cart,.pos-pcard,.pos-cat-btn,.kds-card,.table-tile,.icon-btn,.icon-action,.status-select,.form-field input,.form-field select,.form-field textarea{transition:background-color .3s ease,color .3s ease,border-color .3s ease,box-shadow .3s ease;}
a{color:inherit;text-decoration:none;}
button,select,input,textarea{font-family:var(--body);}
h1,h2,h3{font-family:var(--display);font-weight:400;margin:0;}
table{border-collapse:collapse;}

/* ---------------- THEME TOGGLE ---------------- */
.theme-toggle{position:relative;width:60px;height:32px;border-radius:100px;border:1px solid var(--line);background:var(--card);cursor:pointer;padding:0;flex-shrink:0;overflow:hidden;transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease;}
.theme-toggle:hover{box-shadow:0 0 0 5px rgba(216,31,61,.12);}
.theme-toggle .tt-icon{position:absolute;top:50%;transform:translateY(-50%);font-size:12.5px;line-height:1;filter:grayscale(.15);}
.theme-toggle .tt-moon{left:8px;}
.theme-toggle .tt-sun{right:7px;}
.theme-toggle .tt-knob{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--red),var(--amber));box-shadow:0 3px 10px rgba(0,0,0,.35),inset 0 1px 1px rgba(255,255,255,.4);transition:transform .45s cubic-bezier(.34,1.56,.64,1);}
[data-theme="light"] .theme-toggle .tt-knob{transform:translateX(28px);}

.btn{font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:1px;text-transform:uppercase;padding:12px 22px;border-radius:100px;border:1px solid transparent;transition:.18s;display:inline-flex;align-items:center;gap:8px;cursor:pointer;}
.btn-primary{background:var(--red);color:#fff;}
.btn-primary:hover{transform:translateY(-2px);}
.btn-ghost{background:transparent;border-color:rgba(var(--cream-rgb),.25);color:var(--cream);}
.btn-ghost:hover{border-color:var(--cream);}
.btn-amber{background:var(--amber);color:#241505;}
.btn-sm{padding:8px 14px;font-size:11px;}
.btn:disabled{opacity:.45;cursor:not-allowed;}

/* layout */
#dashboard{display:flex;min-height:100vh;}
.dash-sidebar{width:236px;flex-shrink:0;background:var(--bg-alt);border-right:1px solid var(--line);padding:22px 14px;position:sticky;top:0;height:100vh;overflow:auto;z-index:200;}
.dash-logo{display:flex;align-items:center;gap:8px;padding:8px 10px 24px;font-family:var(--display);font-size:20px;}
.dash-nav-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:2px;transition:.15s;cursor:pointer;}
.dash-nav-item .ic{width:18px;text-align:center;}
.dash-nav-item:hover{background:rgba(var(--cream-rgb),.05);color:var(--cream);}
.dash-nav-item.active{background:var(--red);color:#fff;}
.dash-main{flex:1;min-width:0;}
.dash-topbar{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:16px 28px;background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);}
.dash-search{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:100px;padding:9px 16px;width:320px;}
.dash-search input{background:transparent;border:none;outline:none;color:var(--cream);font-size:13px;flex:1;}
.dash-top-right{display:flex;align-items:center;gap:14px;}
.dash-content{padding:26px 28px;}
.dash-h1{font-family:var(--display);font-size:30px;margin-bottom:4px;}
.dash-sub{color:var(--muted);font-size:13px;margin-bottom:26px;}
.icon-btn{position:relative;width:40px;height:40px;border-radius:50%;background:rgba(var(--cream-rgb),.06);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:15px;}
.cart-badge{position:absolute;top:-4px;right:-4px;background:var(--red);color:#fff;font-family:var(--mono);font-size:10px;font-weight:700;min-width:17px;height:17px;padding:0 3px;border-radius:100px;display:flex;align-items:center;justify-content:center;}
.burger-menu-btn{display:none;width:40px;height:40px;border-radius:50%;background:var(--card);border:1px solid var(--line);color:var(--cream);}

/* KPI + panels */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:26px;}
.kpi-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px;}
.kpi-card .kpi-label{font-size:12px;color:var(--muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:1px;}
.kpi-card .kpi-val{font-family:var(--display);font-size:28px;margin:8px 0 4px;}
.kpi-card .kpi-delta{font-size:11px;color:var(--green);font-weight:700;}
.kpi-card .kpi-delta.down{color:var(--red);}
.panel{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;margin-bottom:22px;}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:8px;}
.panel-head h3{font-size:16px;font-family:var(--body);font-weight:800;}
.two-col{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;}
.bars{display:flex;align-items:flex-end;gap:10px;height:180px;}
.bars .bar{flex:1;background:linear-gradient(180deg,var(--amber),var(--red));border-radius:6px 6px 0 0;position:relative;min-height:4px;}
.bars .bar span{position:absolute;bottom:-20px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);font-family:var(--mono);}
.donut-legend{display:flex;flex-direction:column;gap:10px;margin-top:4px;}
.donut-legend div{display:flex;justify-content:space-between;font-size:12px;}
.legend-dot{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:8px;}

table.dash-table{width:100%;border-collapse:collapse;font-size:13px;}
table.dash-table th{text-align:left;font-family:var(--mono);font-size:10.5px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;}
table.dash-table td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:middle;}
table.dash-table tr:hover td{background:rgba(var(--cream-rgb),.02);}
.table-wrap{overflow-x:auto;}
.status-pill{font-size:10.5px;font-family:var(--mono);font-weight:700;text-transform:uppercase;padding:5px 10px;border-radius:100px;letter-spacing:.5px;white-space:nowrap;}
.status-New{background:rgba(242,166,60,.16);color:var(--amber);}
.status-Confirmed{background:rgba(78,150,255,.16);color:#6fa8ff;}
.status-Preparing{background:rgba(216,31,61,.16);color:#ff5c7a;}
.status-Ready{background:rgba(76,175,109,.16);color:var(--green);}
.status-Out{background:rgba(160,120,255,.16);color:#b79bff;}
.status-Completed{background:rgba(76,175,109,.22);color:var(--green);}
.status-Cancelled{background:rgba(160,160,160,.16);color:#999;}
.status-select{background:var(--bg-alt);border:1px solid var(--line);color:var(--cream);border-radius:8px;padding:6px 10px;font-size:11px;font-family:var(--mono);}
.icon-action{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--bg-alt);display:inline-flex;align-items:center;justify-content:center;font-size:13px;margin-right:4px;color:var(--cream);}
.icon-action:hover{border-color:var(--red);}
.table-toolbar{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;align-items:center;}
.table-toolbar select,.table-toolbar input{background:var(--bg-alt);border:1px solid var(--line);color:var(--cream);padding:9px 14px;border-radius:10px;font-size:12px;}
.dash-badge-img{width:40px;height:40px;border-radius:10px;object-fit:cover;}
.low-stock{color:var(--red);font-weight:700;}
.empty-row td{text-align:center;color:var(--muted);padding:34px;}

/* forms inside admin */
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.form-field{margin-bottom:14px;}
.form-field label{font-size:12px;color:var(--muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:1px;display:block;margin-bottom:6px;}
.form-field input,.form-field select,.form-field textarea{width:100%;background:var(--bg-alt);border:1px solid var(--line);border-radius:10px;padding:11px 14px;color:var(--cream);font-size:13px;}
.form-field textarea{resize:vertical;min-height:80px;}
.form-error{background:rgba(216,31,61,.12);border:1px solid rgba(216,31,61,.4);color:#ff8fa3;padding:12px 16px;border-radius:10px;font-size:13px;margin-bottom:16px;}
.form-success{background:rgba(76,175,109,.12);border:1px solid rgba(76,175,109,.4);color:var(--green);padding:12px 16px;border-radius:10px;font-size:13px;margin-bottom:16px;}

/* modal */
.overlay{position:fixed;inset:0;background:rgba(6,5,4,.7);backdrop-filter:blur(4px);z-index:900;opacity:0;pointer-events:none;transition:opacity .2s;}
.overlay.show{opacity:1;pointer-events:all;}
.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-46%);width:min(560px,92vw);max-height:88vh;overflow:auto;background:var(--bg-alt);border:1px solid var(--line);border-radius:20px;z-index:950;opacity:0;pointer-events:none;transition:all .25s ease;}
.modal.show{opacity:1;transform:translate(-50%,-50%);pointer-events:all;}
.modal-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.5);border:1px solid var(--line);color:var(--cream);font-size:15px;z-index:5;}
.modal-body{padding:28px;}

/* notifications */
#notifPanel{position:fixed;top:70px;right:24px;width:360px;max-height:70vh;overflow:auto;background:var(--bg-alt);border:1px solid var(--line);border-radius:16px;z-index:950;box-shadow:0 30px 60px -20px rgba(0,0,0,.7);display:none;padding:18px;}
#notifPanel.show{display:block;}
.notif-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);}
.notif-item.unread{background:rgba(216,31,61,.05);}
.notif-dot{width:8px;height:8px;border-radius:50%;background:var(--red);margin-top:6px;flex-shrink:0;}
.notif-body b{font-size:13px;display:block;}
.notif-body span{font-size:11px;color:var(--muted);}

/* toast */
#toastWrap{position:fixed;bottom:24px;right:24px;z-index:1200;display:flex;flex-direction:column;gap:10px;max-width:90vw;}
.toast{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:12px;padding:14px 18px;font-size:13px;min-width:220px;box-shadow:0 20px 40px -14px rgba(0,0,0,.6);animation:toastIn .3s ease;}
.toast.err{border-left-color:var(--red);}
@keyframes toastIn{from{opacity:0;transform:translateX(30px);}to{opacity:1;transform:translateX(0);}}

/* POS */
.pos-grid{display:grid;grid-template-columns:170px 1fr 320px;gap:16px;align-items:start;}
.pos-cats{overflow:auto;}
.pos-cat-btn{display:block;width:100%;text-align:left;padding:12px 14px;border-radius:12px;background:var(--card);border:1px solid var(--line);margin-bottom:8px;font-size:12.5px;font-weight:700;color:var(--muted);}
.pos-cat-btn.active{background:var(--red);color:#fff;border-color:var(--red);}
.pos-products{overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;align-content:start;}
.pos-pcard{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden;text-align:left;color:var(--cream);}
.pos-pcard img{width:100%;aspect-ratio:1;object-fit:cover;}
.pos-pcard .pp-body{padding:10px;}
.pos-pcard .pp-name{font-size:12px;font-weight:700;}
.pos-pcard .pp-price{font-family:var(--mono);color:var(--amber);font-size:12px;margin-top:4px;}
.pos-cart{background:var(--card);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;overflow:hidden;position:sticky;top:90px;}
.pos-cart-head{padding:16px;border-bottom:1px solid var(--line);}
.pos-cart-list{max-height:40vh;overflow:auto;padding:10px 16px;}
.pos-cart-foot{padding:16px;border-top:1px solid var(--line);}
.seg-row{display:flex;gap:8px;}
.seg-opt{flex:1;text-align:center;padding:10px;border-radius:10px;border:1px solid var(--line);background:var(--bg-alt);font-size:12px;font-weight:700;cursor:pointer;}
.seg-opt.sel{border-color:var(--red);background:rgba(216,31,61,.14);color:var(--amber);}
.cart-item{display:flex;flex-direction:column;gap:10px;padding:10px 0;}
.ci-body{flex:1;}
.ci-body .cname{font-weight:700;font-size:13px;}
.ci-foot{display:flex;justify-content:space-between;align-items:center;margin-top:6px;}
.mini-qty{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;}
.mini-qty button{width:22px;height:22px;border-radius:6px;border:1px solid var(--line);background:var(--bg-alt);color:var(--cream);}
.sum-row{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:8px;}
.sum-row.total{color:var(--cream);font-weight:800;font-size:16px;border-top:1px dashed var(--line);padding-top:10px;margin-top:8px;}
.sum-row.total .val{color:var(--amber);}

/* KDS */
.kds-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.kds-col h4{font-family:var(--mono);text-transform:uppercase;font-size:12px;letter-spacing:1.5px;color:var(--muted);margin-bottom:14px;}
.kds-card{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--red);border-radius:14px;padding:14px;margin-bottom:12px;}
.kds-card .kh{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12px;color:var(--amber);margin-bottom:8px;}
.kds-card ul{font-size:12.5px;color:var(--cream);margin:0 0 10px;padding:0;list-style:none;}
.kds-card li{margin-bottom:3px;}
.kds-time{font-size:10px;color:var(--muted);font-family:var(--mono);}

/* tables grid (dine-in) */
.tables-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:14px;}
.table-tile{text-align:center;padding:16px;cursor:pointer;border-radius:16px;border:1px solid var(--line);background:var(--card);}
.table-tile .tno{font-family:var(--display);font-size:20px;}
.table-tile .tstat{font-size:11px;font-family:var(--mono);margin-top:4px;}

/* receipt */
.receipt{font-family:var(--mono);background:#fff;color:#111;border-radius:8px;padding:24px;max-width:320px;margin:0 auto;font-size:12.5px;}
.receipt hr{border:none;border-top:1px dashed #999;margin:10px 0;}
.receipt .rline{display:flex;justify-content:space-between;margin:3px 0;}
.receipt .center{text-align:center;}

/* auth pages */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(900px 600px at 50% 0%,rgba(216,31,61,.25),transparent 60%);padding:20px;}
.auth-card{width:380px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:36px;}
.auth-card .logo{display:flex;align-items:center;gap:8px;font-family:var(--display);font-size:24px;margin-bottom:6px;}
.auth-hint{font-size:11px;color:var(--muted);font-family:var(--mono);margin-top:16px;line-height:1.8;}

@media print{
  body *{visibility:hidden;}
  #printArea, #printArea *{visibility:visible;}
  #printArea{position:absolute;top:0;left:0;width:100%;}
  .dash-sidebar,.dash-topbar,.no-print{display:none !important;}
}

@media (max-width:1100px){
  .kpi-grid{grid-template-columns:1fr 1fr;}
  .two-col{grid-template-columns:1fr;}
  .pos-grid{grid-template-columns:130px 1fr;}
  .pos-cart{display:none;}
}
@media (max-width:760px){
  .kpi-grid{grid-template-columns:1fr 1fr;}
  .dash-sidebar{position:fixed;left:-260px;z-index:400;transition:.3s;box-shadow:0 0 40px rgba(0,0,0,.6);top:0;}
  .dash-sidebar.open{left:0;}
  .burger-menu-btn{display:block;}
  .dash-search{width:150px;}
  .dash-content{padding:18px;}
  #notifPanel{right:10px;left:10px;width:auto;}
}
