/* POS Terminal — Orange/White Theme */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg-base);color:var(--gold-hi);-webkit-font-smoothing:antialiased;}
input,button,select{font-family:inherit;outline:none;}
/* To'q tema: forma elementlari */
input,select,textarea{background:var(--bg-deep);color:var(--text-1);border:1.5px solid var(--leaf);}
input::placeholder,textarea::placeholder{color:var(--text-3);}
input:focus,select:focus,textarea:focus{border-color:var(--gold);}
button{cursor:pointer;}
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-thumb{background:var(--surface-2);border-radius:99px;}

/* ── PAGES ── */
.page{position:fixed;inset:0;display:none;flex-direction:column;}
.page.active{display:flex;}
.tab-content{display:none;flex:1;overflow:auto;padding:16px 20px;}
.tab-content.active{display:flex;flex-direction:column;}
.hidden{display:none!important;}

/* ── LOGIN ── */
#pg-login{background:linear-gradient(135deg,rgba(var(--gold-rgb), .14),rgba(var(--gold-rgb), .14));align-items:center;justify-content:center;}
.login-box{background:var(--surface);border-radius:16px;padding:36px 40px;width:380px;box-shadow:0 8px 32px rgba(0,0,0,.08);}
.login-logo{display:flex;align-items:center;gap:10px;margin-bottom:20px;}
.login-logo span{font-size:18px;font-weight:700;color:var(--gold-hi);}
.login-box h2{font-size:22px;font-weight:700;margin-bottom:20px;color:var(--gold-hi);}
.login-box label{display:block;font-size:12px;font-weight:600;color:var(--text-3);margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px;}
.login-box input{width:100%;border:1.5px solid var(--leaf);border-radius:8px;padding:10px 13px;font-size:14px;margin-bottom:14px;transition:border-color .2s;}
.login-box input:focus{border-color:var(--gold);}
.err-text{color:var(--danger-text);font-size:13px;margin-top:8px;min-height:18px;}
.btn-orange{background:var(--gold);color:var(--bg-deep);border:none;border-radius:8px;padding:11px 20px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s;width:100%;}
.btn-orange:hover{background:var(--gold-dark);}
.btn-orange:disabled{opacity:.5;cursor:not-allowed;}
.btn-orange.small{width:auto;padding:8px 16px;font-size:13px;}

/* ── TOPNAV ── */
.topnav{display:flex;align-items:center;justify-content:space-between;background:var(--surface);border-bottom:1px solid var(--leaf);padding:0 16px;height:52px;flex-shrink:0;gap:12px;}
.topnav-left{display:flex;align-items:center;gap:16px;min-width:0;}
.brand{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--gold-hi);white-space:nowrap;}
.nav-tabs{display:flex;gap:2px;}
.nav-tab{background:transparent;border:none;padding:8px 14px;font-size:13px;font-weight:500;color:var(--text-3);border-radius:6px;transition:all .15s;white-space:nowrap;}
.nav-tab:hover{background:var(--bg-base);color:var(--gold-light);}
.nav-tab.active{background:rgba(var(--gold-rgb), .14);color:var(--gold);font-weight:600;}
.topnav-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.nav-search{border:1.5px solid var(--leaf);border-radius:8px;padding:7px 12px;font-size:13px;width:220px;background:var(--bg-base);transition:border-color .2s;}
.nav-search:focus{border-color:var(--gold);background:var(--surface);}
.menu-search{border:1.5px solid var(--leaf);border-radius:8px;padding:8px 12px;font-size:14px;width:240px;flex:0 0 auto;background:var(--bg-base);color:inherit;transition:border-color .2s}
.menu-search:focus{border-color:var(--gold);background:var(--surface);outline:none}
@media (max-width:820px){ .menu-search{width:150px} }
.btn-icon-nav{width:34px;height:34px;border:1.5px solid var(--leaf);border-radius:8px;background:var(--surface);color:var(--text-3);font-size:16px;display:flex;align-items:center;justify-content:center;transition:all .2s;}
.btn-icon-nav:hover{border-color:var(--gold);color:var(--gold);}
.btn-icon-nav.danger:hover{border-color:var(--danger-text);color:var(--danger-text);}

/* ── MENYU TAB ── */
.menu-layout{display:grid;grid-template-columns:1fr 320px;gap:0;flex:1;overflow:hidden;margin:-16px -20px;}
.menu-main{overflow-y:auto;padding:16px;}
.cat-bar{display:flex;gap:8px;padding:0 0 14px;overflow-x:auto;scrollbar-width:none;flex-wrap:wrap;}
.cat-btn{padding:7px 16px;border-radius:99px;border:1.5px solid var(--leaf);background:var(--surface);font-size:13px;font-weight:500;color:var(--gold-light);cursor:pointer;white-space:nowrap;transition:all .15s;}
.cat-btn.active{background:var(--gold);border-color:var(--gold);color:var(--bg-deep);font-weight:600;}
.items-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.item-card{background:var(--surface);border-radius:12px;overflow:hidden;cursor:pointer;border:1.5px solid var(--leaf);transition:all .2s;}
.item-card:hover{border-color:var(--gold);box-shadow:0 4px 16px rgba(249,115,22,.12);}
.ic-img{height:120px;background:var(--bg-base);position:relative;overflow:hidden;}
.ic-img img{width:100%;height:100%;object-fit:cover;}
.ic-img-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:36px;color:var(--text-3);}
.ic-body{padding:10px 10px 12px;}
.ic-name{font-size:13px;font-weight:600;color:var(--gold-hi);margin-bottom:4px;line-height:1.3;}
.ic-price{font-size:14px;font-weight:700;color:var(--gold-hi);}

/* ── CART ── */
.cart-sidebar{background:var(--surface);border-left:1px solid var(--leaf);display:flex;flex-direction:column;overflow:hidden;}
.cart-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--leaf);flex-shrink:0;}
.cart-title{font-size:16px;font-weight:700;color:var(--gold-hi);}
.btn-clear-cart{background:transparent;border:none;font-size:18px;color:var(--text-3);padding:2px 6px;}
.btn-clear-cart:hover{color:var(--danger-text);}
.cart-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--text-3);text-align:center;padding:24px;}
.cart-empty p{font-size:14px;font-weight:600;}
.cart-empty small{font-size:12px;}
.cart-items{flex:1;overflow-y:auto;padding:8px 12px;}
.cart-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--leaf);}
.ci-name{flex:1;font-size:13px;font-weight:500;color:var(--gold-light);}
.ci-price{font-size:12px;color:var(--text-3);white-space:nowrap;}
.qty-ctrl{display:flex;align-items:center;gap:4px;}
.qty-btn{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--leaf);background:var(--surface);font-size:14px;font-weight:700;color:var(--gold-light);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;}
.qty-btn:hover{border-color:var(--gold);color:var(--gold);}
.qty-num{width:20px;text-align:center;font-size:13px;font-weight:600;}
.cart-footer{border-top:1px solid var(--leaf);padding:12px;flex-shrink:0;}
.stol-row{display:flex;gap:6px;margin-bottom:10px;}
.stol-select{flex:1;border:1.5px solid var(--gold);border-radius:8px;padding:8px 10px;font-size:14px;font-weight:600;color:var(--gold);background:rgba(var(--gold-rgb), .14);cursor:pointer;}
.btn-add-stol{width:34px;border:1.5px solid var(--leaf);border-radius:8px;background:var(--surface);font-size:18px;color:var(--text-3);}
.btn-add-stol:hover{border-color:var(--gold);color:var(--gold);}
.pay-type-row{display:flex;gap:6px;margin-bottom:8px;}
.pay-btn{flex:1;padding:8px;border-radius:8px;border:1.5px solid var(--leaf);background:var(--surface);font-size:13px;font-weight:500;color:var(--gold-light);transition:all .15s;}
.pay-btn.active{background:var(--gold);border-color:var(--gold);color:var(--bg-deep);font-weight:600;}
.check-row{margin-bottom:6px;}
.chk-label{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--gold-light);cursor:pointer;}
.chk-label input[type=checkbox]{width:15px;height:15px;accent-color:var(--gold);}
.chk-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:4px;}
.cart-totals{margin:8px 0;}
.ct-row{display:flex;justify-content:space-between;font-size:13px;color:var(--gold-light);padding:3px 0;}
.ct-row.bold{font-weight:700;font-size:15px;margin-top:4px;}
.orange-text{color:var(--gold);}
.cart-btns{display:flex;gap:6px;margin-top:10px;}
.btn-cancel-cart{flex:1;padding:10px;border:1.5px solid var(--leaf);border-radius:8px;background:var(--surface);font-size:13px;color:var(--text-3);}
.btn-cancel-cart:hover{border-color:var(--danger-text);color:var(--danger-text);}
.btn-submit-order{flex:1;padding:10px;background:var(--gold);border:none;border-radius:8px;color:var(--bg-deep);font-size:13px;font-weight:700;}
.btn-submit-order:hover{background:var(--gold-dark);}
.btn-submit-order:disabled{opacity:.4;cursor:not-allowed;}

/* ── ORDERS TAB (Stollar) ── */
.orders-layout{display:grid;grid-template-columns:1fr 360px;gap:0;flex:1;overflow:hidden;margin:-16px -20px;}
.tables-left{overflow-y:auto;padding:16px;border-right:1px solid var(--leaf);background:var(--surface);}
.section-bar{display:flex;align-items:center;gap:8px;margin-bottom:14px;}
.section-bar h3{font-size:16px;font-weight:700;flex:1;}
.occ-badge{background:rgba(var(--gold-rgb), .14);border:1px solid rgba(var(--gold-rgb), .20);border-radius:99px;padding:2px 10px;font-size:12px;font-weight:600;color:var(--gold);}
.refresh-dot{font-size:12px;color:var(--ok-text);}
.tables-grid-orange{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:16px;}
.table-card-o{background:var(--bg-base);border:1.5px solid var(--leaf);border-radius:12px;padding:14px 12px;cursor:pointer;transition:all .2s;min-height:90px;display:flex;flex-direction:column;gap:4px;position:relative;}
.table-card-o:hover{border-color:var(--gold);box-shadow:0 3px 12px rgba(249,115,22,.1);}
.table-card-o.selected{border-color:var(--gold);background:rgba(var(--gold-rgb), .14);}
.table-card-o.occupied{border-color:rgba(var(--gold-rgb), .20);background:rgba(var(--gold-rgb), .14);}
.table-card-o.t-preparing{border-color:var(--info-text);background:rgba(var(--info-rgb), .10);}
.table-card-o.t-ready{border-color:var(--ok-text);background:rgba(var(--ok-rgb), .10);}
.table-card-o.t-delivered{border-color:var(--leaf);background:var(--bg-base);}
.table-card-o.t-late{border-color:var(--danger-text);}
.tc-o-num{font-size:18px;font-weight:700;color:var(--text-3);}
.table-card-o.occupied .tc-o-num,.table-card-o.t-preparing .tc-o-num,.table-card-o.t-ready .tc-o-num,.table-card-o.t-delivered .tc-o-num{color:var(--gold-hi);}
.tc-o-status{font-size:10px;font-weight:600;padding:2px 6px;border-radius:99px;width:fit-content;}
.tc-o-status.new{background:rgba(var(--gold-rgb), .14);color:var(--gold);}
.tc-o-status.prep{background:rgba(var(--info-rgb), .16);color:var(--info-text);}
.tc-o-status.ready{background:rgba(var(--ok-rgb), .16);color:var(--ok-text);}
.tc-o-status.pending{background:rgba(var(--gold-rgb), .14);color:var(--gold);}
.tc-o-status.preparing{background:rgba(var(--info-rgb), .16);color:var(--info-text);}
.tc-o-status.delivered{background:var(--bg-base);color:var(--text-3);}
.tc-o-total{font-size:14px;font-weight:700;color:var(--gold-hi);margin-top:auto;}
.tc-o-total.empty{font-size:12px;font-weight:400;color:var(--text-3);}
.tc-o-info{font-size:11px;color:var(--text-3);}
.status-legend{display:flex;gap:14px;padding-top:8px;border-top:1px solid var(--leaf);}
.leg-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--text-3);}
.leg-dot{width:8px;height:8px;border-radius:50%;}
.leg-dot.new{background:var(--gold);}
.leg-dot.prep{background:var(--info);}
.leg-dot.ready{background:var(--ok);}
.table-detail-right{overflow-y:auto;background:var(--surface);display:flex;flex-direction:column;}
.detail-placeholder{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--text-3);padding:40px;}
.ph-icon{font-size:48px;}
.detail-placeholder p{font-size:14px;}

/* Table detail content */
.td-hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--leaf);}
.td-hdr-title{font-size:17px;font-weight:700;color:var(--gold-hi);}
.td-hdr-cnt{font-size:12px;color:var(--text-3);margin-left:6px;}
.btn-close-td{background:transparent;border:none;font-size:18px;color:var(--text-3);padding:2px 8px;}
.td-orders{flex:1;overflow-y:auto;padding:12px;}
.td-order-block{background:var(--bg-base);border:1px solid var(--leaf);border-radius:10px;margin-bottom:10px;overflow:hidden;}
.tdo-hdr{display:flex;align-items:center;gap:8px;padding:9px 13px;border-bottom:1px solid var(--leaf);background:var(--surface);}
.tdo-id{font-size:13px;font-weight:700;color:var(--gold-light);}
.tdo-time{font-size:11px;color:var(--text-3);margin-left:auto;}
.tdo-status-badge{font-size:10px;font-weight:600;padding:2px 8px;border-radius:99px;flex-shrink:0;}
.tdo-status-badge.pending{background:rgba(var(--gold-rgb), .14);color:var(--gold);}
.tdo-status-badge.preparing{background:rgba(var(--info-rgb), .16);color:var(--info-text);}
.tdo-status-badge.ready{background:rgba(var(--ok-rgb), .16);color:var(--ok-text);}
.tdo-status-badge.delivered{background:var(--bg-base);color:var(--text-3);}
.tdo-items{padding:8px 13px;display:flex;flex-direction:column;gap:3px;}
.tdo-item{display:flex;justify-content:space-between;font-size:13px;color:var(--gold-light);}
.tdo-item-right{display:flex;gap:8px;color:var(--text-3);}
.tdo-sub{display:flex;justify-content:space-between;align-items:center;padding:8px 13px;border-top:1px solid var(--leaf);}
.tdo-sub-total{font-size:12px;color:var(--text-3);}
.tdo-sub-total strong{color:var(--gold-hi);}
.tdo-status-btn{padding:5px 12px;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;border:1.5px solid;transition:all .15s;}
.tdo-status-btn.to-prep{border-color:var(--info-text);color:var(--info-text);background:rgba(var(--info-rgb), .10);}
.tdo-status-btn.to-prep:hover{background:var(--info);color:var(--bg-deep);}
.tdo-status-btn.to-ready{border-color:var(--ok-text);color:var(--ok-text);background:rgba(var(--ok-rgb), .10);}
.tdo-status-btn.to-ready:hover{background:var(--ok);color:var(--bg-deep);}
.td-footer{border-top:1px solid var(--leaf);padding:14px 16px;background:var(--surface);flex-shrink:0;}
.td-total-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.td-total-label{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;}
.td-total-val{font-size:22px;font-weight:700;color:var(--gold-hi);}
/* Taomlar / xizmat haqi — yakuniy summadan past turishi kerak, aks holda
   kassir qaysi biri to'lanadigan summa ekanini bir qarashda ajratolmaydi. */
.td-sub-row{margin-bottom:6px;}
.td-sub-row .td-total-val{font-size:14px;font-weight:600;color:var(--text-2);}
.td-actions{display:flex;gap:8px;}
.btn-td-transfer{flex:1;padding:10px;border:1.5px solid var(--leaf);border-radius:8px;background:var(--surface);font-size:12px;font-weight:600;color:var(--gold-light);}
.btn-td-transfer:hover{border-color:var(--gold);color:var(--gold);}
.btn-td-bill{flex:1;padding:10px;border:1.5px solid var(--gold);border-radius:8px;background:var(--surface);font-size:12px;font-weight:700;color:var(--gold);}
.btn-td-bill:hover{background:var(--gold);color:var(--bg-deep);}
.btn-td-done{flex:1;padding:10px;background:var(--ok);border:none;border-radius:8px;color:var(--bg-deep);font-size:12px;font-weight:700;}
.btn-td-done:hover{background:var(--ok);}

/* ── TOOLBAR ── */
.tab-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap;}
.tab-toolbar h3{font-size:16px;font-weight:700;flex:1;}
.period-btns{display:flex;gap:4px;}
.period-btn{padding:6px 14px;border:1.5px solid var(--leaf);border-radius:6px;background:var(--surface);font-size:12px;font-weight:500;color:var(--gold-light);cursor:pointer;transition:all .15s;}
.period-btn.active{background:var(--gold);border-color:var(--gold);color:var(--bg-deep);font-weight:600;}
.date-range{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-3);}
.date-range input[type=date]{border:1.5px solid var(--leaf);border-radius:6px;padding:5px 8px;font-size:12px;}

/* ── DATA TABLE ── */
.data-table{width:100%;border-collapse:collapse;background:var(--surface);border-radius:10px;overflow:hidden;font-size:13px;box-shadow:0 1px 4px rgba(0,0,0,.05);}
.data-table th{background:var(--bg-base);color:var(--text-3);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;padding:10px 14px;text-align:left;border-bottom:1px solid var(--leaf);}
.data-table td{padding:11px 14px;border-bottom:1px solid var(--leaf);color:var(--gold-light);vertical-align:middle;}
.data-table tr:last-child td{border-bottom:none;}
.data-table tr:hover td{background:var(--surface);}
.stol-chip{display:inline-block;background:rgba(var(--gold-rgb), .14);border:1px solid rgba(var(--gold-rgb), .20);color:var(--gold);border-radius:6px;padding:2px 10px;font-size:12px;font-weight:600;}
.btn-detail{padding:5px 14px;border:1.5px solid var(--gold);border-radius:6px;background:rgba(var(--gold-rgb), .14);color:var(--gold);font-size:12px;font-weight:600;cursor:pointer;}
.btn-detail:hover{background:var(--gold);color:var(--bg-deep);}
.btn-del{width:30px;height:30px;border:none;background:transparent;color:var(--danger-text);font-size:16px;cursor:pointer;opacity:.6;}
.btn-del:hover{opacity:1;}
.tag-kirim{background:rgba(var(--ok-rgb), .16);color:var(--ok-text);border-radius:6px;padding:2px 10px;font-size:11px;font-weight:700;}
.tag-chiqim{background:rgba(var(--danger-rgb), .16);color:var(--danger-text);border-radius:6px;padding:2px 10px;font-size:11px;font-weight:700;}
.amount-pos{color:var(--ok-text);font-weight:700;}
.amount-neg{color:var(--danger-text);font-weight:700;}

/* ── SUB TABS ── */
.sub-tabs{display:flex;gap:0;border-bottom:2px solid var(--leaf);margin-bottom:14px;}
.sub-tab{padding:8px 18px;background:transparent;border:none;font-size:13px;font-weight:600;color:var(--text-3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s;}
.sub-tab.active{color:var(--gold);border-bottom-color:var(--gold);}

/* ── XODIMLAR ── */
#tab-staff .data-table{margin-top:0;}

/* ── KASSA ── */
.kassa-layout{display:grid;grid-template-columns:1fr 260px;gap:16px;flex:1;}
.kassa-main{overflow-y:auto;}
.kassa-sidebar{display:flex;flex-direction:column;gap:10px;}
.kassa-stat-card{background:var(--surface);border-radius:10px;padding:14px 16px;border:1px solid var(--leaf);}
.kassa-stat-card.two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.ksc-label{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;}
.ksc-val{font-size:22px;font-weight:700;color:var(--gold-hi);}
.ksc-val.orange{color:var(--gold);}
.ksc-val.blue{color:var(--info-text);}
.ksc-val.green{color:var(--ok-text);font-size:15px;}
.ksc-val.red{color:var(--danger-text);font-size:15px;}
.kassa-add-form{background:var(--surface);border-radius:10px;padding:14px;border:1px solid var(--leaf);display:flex;flex-direction:column;gap:8px;}
.kassa-inp{border:1.5px solid var(--leaf);border-radius:8px;padding:9px 12px;font-size:13px;transition:border-color .2s;}
.kassa-inp:focus{border-color:var(--gold);}
.kassa-form-btns{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.btn-kassa-inc{padding:9px;background:rgba(var(--ok-rgb), .16);border:1.5px solid var(--ok-soft);border-radius:8px;color:var(--ok-text);font-size:12px;font-weight:700;cursor:pointer;}
.btn-kassa-inc:hover{background:var(--ok);color:var(--bg-deep);}
.btn-kassa-exp{padding:9px;background:rgba(var(--danger-rgb), .16);border:1.5px solid var(--danger-soft);border-radius:8px;color:var(--danger-text);font-size:12px;font-weight:700;cursor:pointer;}
.btn-kassa-exp:hover{background:var(--danger);color:var(--bg-deep);}
.btn-kassa-out{padding:11px;background:var(--gold);border:none;border-radius:8px;color:var(--bg-deep);font-size:13px;font-weight:700;cursor:pointer;}
.btn-kassa-out:hover{background:var(--gold-dark);}

/* ── STATS TAB ── */
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:4px;}
.stat-card-o{background:var(--surface);border-radius:10px;padding:16px;border:1px solid var(--leaf);}
.stat-card-o.wide{grid-column:1/-1;}
.sc-label{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;}
.sc-val{font-size:22px;font-weight:700;color:var(--gold-hi);}
.sc-val.orange{color:var(--gold);}
.sc-val.big{font-size:32px;}
.sc-sub{font-size:13px;color:var(--text-3);margin-top:4px;}

/* ── MODALS ── */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;display:none;align-items:center;justify-content:center;padding:16px;}
.modal-bg.open{display:flex;}
.modal-box{background:var(--surface);border-radius:16px;box-shadow:0 16px 48px rgba(0,0,0,.15);animation:mIn .2s ease;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;width:100%;}
.modal-box.wide{max-width:640px;}
.modal-box.small{max-width:420px;}
/* Bekor qilish sabablari — tez tanlash tugmalari */
.cancel-reasons{display:flex;flex-wrap:wrap;gap:6px;}
.cancel-reasons button{border:1.5px solid var(--leaf);background:var(--surface);
  color:var(--gold-light);border-radius:99px;padding:6px 12px;font-size:12px;cursor:pointer;}
.cancel-reasons button:hover{border-color:var(--gold);color:var(--gold);}
/* Tugagan variant — bosib bo'lmaydi */
.pos-opt-chip.out{opacity:.4;text-decoration:line-through;cursor:not-allowed;}
/* Bo'lib to'lash — naqd + karta + online bitta chekda */
.split-hdr{display:flex;justify-content:space-between;align-items:center;margin-top:12px;
  font-size:12px;color:var(--text-3);font-weight:600;}
.split-toggle{border:1.5px solid var(--leaf);background:var(--surface);color:var(--gold-light);
  border-radius:99px;padding:4px 12px;font-size:11px;font-weight:700;cursor:pointer;}
.split-toggle.on{border-color:var(--gold);background:rgba(var(--gold-rgb),.14);color:var(--gold);}
.split-box{margin-top:8px;}
.split-row{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.split-row>span{flex:0 0 92px;font-size:12.5px;font-weight:600;color:var(--gold-light);}
.split-row input{flex:1;min-width:0;border:1.5px solid var(--leaf);border-radius:8px;
  padding:8px 10px;font-size:14px;font-weight:700;background:var(--surface);color:var(--gold-hi);}
.split-rest{flex:0 0 auto;border:1.5px solid var(--leaf);background:var(--surface);
  color:var(--text-3);border-radius:8px;padding:7px 9px;font-size:11px;cursor:pointer;}
.split-rest:hover{border-color:var(--gold);color:var(--gold);}
.split-sum{margin-top:6px;font-size:12.5px;font-weight:700;text-align:right;}
.split-sum.ok{color:var(--leaf-hi,#7bbf6a);}
.split-sum.bad{color:#d9694f;}
@keyframes mIn{from{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}
.modal-hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--leaf);flex-shrink:0;}
.modal-title{font-size:16px;font-weight:700;color:var(--gold-hi);}
.modal-sub{font-size:12px;color:var(--text-3);margin-top:2px;}
.btn-modal-close{background:transparent;border:none;font-size:20px;color:var(--text-3);padding:2px 8px;cursor:pointer;}
.btn-modal-close:hover{color:var(--danger-text);}
.modal-body{padding:16px 20px;overflow-y:auto;flex:1;}
.modal-body label{display:block;font-size:12px;font-weight:600;color:var(--text-3);margin:10px 0 5px;text-transform:uppercase;letter-spacing:.5px;}
.modal-body label:first-child{margin-top:0;}
.modal-inp{width:100%;border:1.5px solid var(--leaf);border-radius:8px;padding:9px 12px;font-size:14px;transition:border-color .2s;}
.modal-inp:focus{border-color:var(--gold);}
.modal-footer{display:flex;gap:8px;padding:12px 20px;border-top:1px solid var(--leaf);flex-shrink:0;}
.btn-cancel-m{flex:1;padding:10px;border:1.5px solid var(--leaf);border-radius:8px;background:var(--surface);font-size:13px;color:var(--text-3);cursor:pointer;}
.btn-cancel-m:hover{border-color:var(--text-3);}
.modal-body p{font-size:14px;color:var(--gold-light);line-height:1.5;}

/* Order detail modal */
.od-top-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.od-stol-chip{background:rgba(var(--gold-rgb), .14);border:1px solid rgba(var(--gold-rgb), .20);color:var(--gold);border-radius:6px;padding:4px 14px;font-size:14px;font-weight:700;}
.od-total{font-size:16px;font-weight:700;}
.od-service{font-size:13px;color:var(--text-3);margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--leaf);}
.od-item-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--leaf);}
.od-item-img{width:44px;height:44px;border-radius:8px;object-fit:cover;background:var(--bg-base);flex-shrink:0;}
.od-item-img-ph{width:44px;height:44px;border-radius:8px;background:var(--bg-base);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;}
.od-item-info{flex:1;}
.od-item-name{font-size:13px;font-weight:600;color:var(--gold-hi);}
.od-item-qty{font-size:12px;color:var(--text-3);}
.od-item-price{font-size:13px;font-weight:700;color:var(--gold-hi);}

/* Transfer grid */
.transfer-grid-o{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:12px 0;}
.tg-btn{padding:12px 8px;border:1.5px solid var(--leaf);border-radius:8px;background:var(--surface);font-size:13px;font-weight:600;color:var(--gold-light);cursor:pointer;text-align:center;transition:all .15s;}
.tg-btn:hover{border-color:var(--gold);color:var(--gold);background:rgba(var(--gold-rgb), .14);}
.tg-btn.occupied{border-color:rgba(var(--gold-rgb), .20);color:var(--gold);}
.tg-btn.source{opacity:.3;cursor:not-allowed;}
.tg-btn small{display:block;font-size:10px;color:var(--text-3);font-weight:400;}

/* ── TOAST ── */
.toast{position:fixed;bottom:20px;right:20px;background:var(--bg-deep);color:var(--gold-hi);border-radius:10px;padding:11px 18px;font-size:13px;font-weight:500;box-shadow:0 8px 24px rgba(0,0,0,.2);z-index:200;animation:tIn .25s ease;}
.toast.hidden{display:none;}
.toast.success{background:var(--ok);}
.toast.error{background:var(--danger);}
@keyframes tIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.kassa-pay { margin-bottom:8px; }
.kassa-pay .pay-btn { padding:7px; font-size:12px; }

/* POS logotip (SVG). fill="" atributida var() ishonchli ishlamagani uchun
   ranglar shu yerdan beriladi. Haqiqiy Mashitta logotipi qo'yilganda
   bu ikki qoidani o'chirib tashlash mumkin. */
.pos-logo-bg { fill: var(--gold); }
.pos-logo-fg { fill: var(--bg-deep); }

/* Variant tanlash modali */
.pos-opt-group { margin-bottom:14px; }
.pos-opt-title { font-size:11px; font-weight:700; letter-spacing:.6px;
  text-transform:uppercase; color:var(--text-2); margin-bottom:7px; }
.pos-opt-req { color:var(--gold); }
.pos-opt-chips { display:flex; flex-wrap:wrap; gap:7px; }
.pos-opt-chip { padding:8px 13px; border-radius:999px; cursor:pointer;
  border:1.5px solid var(--leaf); background:var(--surface);
  color:var(--text-2); font-size:13px; font-weight:500; }
.pos-opt-chip.sel { background:var(--gold); border-color:var(--gold);
  color:var(--bg-deep); font-weight:700; }
.pos-opt-chip small { opacity:.85; margin-left:5px; }
.ci-opts { font-size:11px; color:var(--text-3); margin-top:1px; }

/* Saboy (olib ketish) toggle + qisqartirilgan stol tanlash */
.stol-row { display:flex; align-items:center; gap:8px; }
.stol-select { flex:1 1 auto; min-width:0; }
.stol-select:disabled { opacity:.4; }
.saboy-btn {
  flex:0 0 auto; padding:9px 12px; border-radius:9px; white-space:nowrap;
  background:var(--card-2, #2a2a2a); border:1px solid var(--line, #3a3a3a);
  color:var(--gold, #c9a96e); font-size:13px; font-weight:700; cursor:pointer;
  transition:all .15s;
}
.saboy-btn.active { background:var(--gold, #c9a96e); color:var(--dark, #111); border-color:var(--gold, #c9a96e); }

/* ═══ BUYURTMA TAHRIRLASH MODALI ═══════════════════════════════
   Barcha rang tokens.css'dan olinadi — kunduzgi/tungi rejimga
   avtomatik moslashadi. (Ilgari bu yerda var(--text) ishlatilgan
   edi — bunday token yo'q, shuning uchun matn to'q fonda ham
   #1a1a1a bo'lib ko'rinmay qolgan edi.) */
.oe-overlay { position:fixed; inset:0; z-index:99999;
  background:rgba(var(--bg-deep-rgb), .72);
  align-items:flex-end; justify-content:center; }
.oe-box { background:var(--surface); color:var(--text-1); width:100%;
  max-width:540px; max-height:90vh; border:1.5px solid var(--leaf);
  border-bottom:none; border-radius:18px 18px 0 0;
  display:flex; flex-direction:column; overflow:hidden;
  box-shadow:0 -8px 32px rgba(0,0,0,.35); }
.oe-hdr { padding:14px 16px; border-bottom:1px solid var(--leaf);
  display:flex; align-items:center; justify-content:space-between;
  font-size:15px; color:var(--gold-hi); }
.oe-body { overflow:auto; padding:8px 16px; flex:1; min-height:80px; }
.oe-sect { padding:10px 16px; border-top:1px solid var(--leaf); }
.oe-foot { padding:12px 16px; border-top:1px solid var(--leaf);
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; background:var(--bg-base); }
.oe-row { display:flex; align-items:center; gap:8px; padding:9px 0;
  border-bottom:1px solid var(--line); }
.oe-row-name { flex:1; min-width:0; font-size:13px; font-weight:600;
  color:var(--gold-hi); }
.oe-row-sub { font-size:12px; font-weight:400; color:var(--text-3); }
.oe-opt { font-size:11px; color:var(--gold-light); }
.oe-qty { min-width:24px; text-align:center; font-weight:700; color:var(--gold-hi); }
.oe-q { width:30px; height:30px; border-radius:8px; border:1.5px solid var(--leaf);
  background:var(--bg-base); color:var(--gold-light); font-size:16px;
  font-weight:700; cursor:pointer; }
.oe-q:hover { border-color:var(--gold); color:var(--gold); }
.oe-rm { width:30px; height:30px; border-radius:8px; cursor:pointer;
  border:1.5px solid rgba(var(--danger-rgb), .45); background:transparent;
  color:var(--danger-text); }
.oe-rm:hover { background:rgba(var(--danger-rgb), .12); }
.oe-search { width:100%; box-sizing:border-box; padding:9px 12px; border-radius:9px;
  border:1.5px solid var(--leaf); background:var(--bg-deep); color:var(--text-1);
  font-size:13px; margin-bottom:8px; }
.oe-list { max-height:170px; overflow:auto; display:flex; flex-direction:column; gap:5px; }
.oe-add { text-align:left; padding:9px 11px; border-radius:9px; cursor:pointer;
  border:1.5px solid var(--leaf); background:var(--bg-base); color:var(--gold-hi);
  font-size:13px; font-weight:500; display:flex; justify-content:space-between; gap:8px; }
.oe-add:hover { border-color:var(--gold); background:rgba(var(--gold-rgb), .14); color:var(--gold); }
.oe-add-price { color:var(--text-3); font-weight:600; }
.oe-empty { color:var(--text-3); padding:22px; text-align:center; font-size:13px; }
.oe-total { font-size:14px; color:var(--gold-light); }
.oe-total b { color:var(--gold-hi); font-size:16px; }
.oe-btn-cancel { padding:9px 16px; border-radius:10px; border:1.5px solid var(--leaf);
  background:var(--surface); color:var(--text-3); font-weight:700; cursor:pointer; }
.oe-btn-cancel:hover { border-color:var(--danger-text); color:var(--danger-text); }
.oe-btn-save { padding:9px 18px; border-radius:10px; border:none;
  background:var(--gold); color:var(--bg-deep); font-weight:700; cursor:pointer; }
.oe-btn-save:hover { background:var(--gold-dark); }
.oe-x { width:30px; height:30px; border-radius:8px; border:1.5px solid var(--leaf);
  background:transparent; color:var(--text-3); font-size:16px; font-weight:700; cursor:pointer; }
.oe-x:hover { border-color:var(--danger-text); color:var(--danger-text); }

/* Stol detalidagi buyurtma tugmalari */
.tdo-edit-btn, .tdo-cancel-btn { border-radius:8px; padding:6px 12px; font-size:12px;
  font-weight:700; cursor:pointer; transition:all .15s; }
.tdo-edit-btn { background:rgba(var(--gold-rgb), .14); border:1.5px solid rgba(var(--gold-rgb), .45);
  color:var(--gold); }
.tdo-edit-btn:hover { background:rgba(var(--gold-rgb), .24); border-color:var(--gold); }
.tdo-cancel-btn { background:rgba(var(--danger-rgb), .12); border:1.5px solid rgba(var(--danger-rgb), .4);
  color:var(--danger-text); }
.tdo-cancel-btn:hover { background:rgba(var(--danger-rgb), .22); }

/* ═══ ZALLAR (stol guruhlari) ═══════════════════════════════════
   Sarlavha gridning butun enini egallaydi, shuning uchun stollar
   zal bo'yicha ajralib turadi. */
.zone-hdr { grid-column:1 / -1; display:flex; align-items:center; gap:9px;
  font-size:12px; font-weight:700; letter-spacing:.8px; text-transform:uppercase;
  color:var(--gold); padding:4px 2px 2px; margin-top:6px; }
.zone-hdr::after { content:''; flex:1; height:1px; background:var(--leaf); }
.zone-hdr:first-child { margin-top:0; }
.tc-o-waiter { font-size:11px; font-weight:600; color:var(--gold-light);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ═══ KASSA SMENASI (Z-hisobot) ═══════════════════════════════ */
.shift-panel { background:var(--surface); border:1.5px solid var(--leaf);
  border-radius:12px; padding:14px 16px; margin:0 16px 14px; }
.shift-head { display:flex; align-items:center; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.shift-title { font-size:15px; font-weight:700; color:var(--gold-hi); }
.shift-sub { font-size:12px; color:var(--text-3); margin-top:2px; }
.shift-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
.shift-cell { background:var(--bg-base); border:1px solid var(--leaf);
  border-radius:9px; padding:9px 11px; }
.shift-cell span { display:block; font-size:11px; color:var(--text-3); margin-bottom:3px; }
.shift-cell b { font-size:15px; font-weight:700; color:var(--gold-hi); }
.shift-cell.accent b { color:var(--gold); font-size:17px; }

/* Kassir nishoni qo'shilgach yuqori panel torayib qoldi — chap tomon
   (menyu tugmalari) endi kerak bo'lsa siqiladi va o'ralmaydi, o'ng
   tomondagi nishon esa hech qachon ustma-ust tushmaydi. */
.topnav-left { flex:1 1 auto; overflow:hidden; }
.nav-tabs { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
.nav-tabs::-webkit-scrollbar { display:none; }
.topnav-right { flex:0 0 auto; max-width:52%; }
#posUserBadge { flex:0 0 auto; max-width:170px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.nav-search { min-width:0; flex:0 1 auto; }
/* Ekran torayganda avval qidiruv maydoni yig'iladi, keyin tugmalar
   ixchamlashadi — menyu tugmalari HAMMASI ko'rinib turishi kerak,
   ular kassirning asosiy navigatsiyasi. */
@media (max-width:1500px){ .nav-search { width:150px; } }
@media (max-width:1360px){
  .nav-search { display:none; }
  .topnav-left { gap:10px; }
  .nav-tab { padding:8px 9px; font-size:12.5px; }
}
@media (max-width:1120px){
  .brand span { display:none; }
  .nav-tab { padding:7px 7px; font-size:12px; }
  #posUserBadge { max-width:120px; }
}

/* ── Kunlik maosh sahifasi ─────────────────────────────────────────
   Raqam ustunlari mazmuniga qarab qisqaradi (width:1%), ism ustuni
   qolgan joyni yutadi (width:100%) — shunda sarlavha aynan o'z
   raqamining ustida turadi. `table-layout:auto` da belgilangan px
   en faqat taklif bo'lgani uchun bu yagona ishonchli usul. */
#tab-pay .data-table th.num, #tab-pay .data-table td.num {
  text-align:right; white-space:nowrap; width:1%; }
#tab-pay .data-table th:first-child, #tab-pay .data-table td:first-child {
  width:100%; }
#tab-pay .data-table td.num { font-variant-numeric:tabular-nums; }
#tab-pay .data-table td.num .row-sub { white-space:normal; width:180px;
  margin-left:auto; }
.pay-meta { font-size:12px; color:var(--text-3); margin:0 0 14px; }
.pay-note { font-size:12px; color:var(--text-3); margin-top:12px; }
.pay-empty { text-align:center; color:var(--text-3); padding:28px 12px; font-size:13px; }
.row-sub { font-size:11px; color:var(--text-3); margin-top:2px; }
#tab-pay .date-range { display:flex; align-items:center; gap:8px; }

/* Tarix — qaytarilgan buyurtma */
.ret-tag { display:inline-block; font-size:10.5px; font-weight:700; padding:2px 8px;
  border-radius:99px; background:rgba(var(--danger-rgb), .18); color:var(--danger-text);
  white-space:nowrap; }
.ret-why { font-size:11px; color:var(--text-3); margin-top:3px; max-width:220px;
  line-height:1.35; }
#retModal .modal-box { max-width:460px; }

/* Qaytarish tugmasi. `.btn-void` uslubi umuman yo'q edi — brauzer
   standart kulrang tugmasini chizardi va u to'q mavzuda ajralib turardi. */
.btn-void { background:transparent; border:1px solid var(--danger-text);
  color:var(--danger-text); border-radius:8px; padding:7px 14px; cursor:pointer;
  font-family:inherit; font-size:13px; font-weight:600; white-space:nowrap; }
.btn-void:hover { background:rgba(var(--danger-rgb), .14); }
.btn-void:disabled { opacity:.55; cursor:default; }