
:root{
  --primary:#76224f;--primary-2:#a1326c;--accent:#d95480;--dark:#3b122b;
  --gold:#a95f00;--bg:#fff7fb;--card:#ffffff;--surface:#f8edf3;
  --text:#211721;--muted:#746a72;--success:#087f65;--danger:#c93445;
  --info:#3c57b5;--warning:#a95f00;--border:#ead9e3;
  --shadow:0 7px 24px rgba(78,20,51,.10);--radius:18px;
}
:root[data-theme="dark"]{
  --primary:#d16a9a;--primary-2:#bd4f83;--accent:#f080ab;--dark:#170b13;
  --gold:#f4b35c;--bg:#160f14;--card:#231820;--surface:#30212b;
  --text:#f7eef3;--muted:#c3b2bc;--success:#48c9a9;--danger:#ff7985;
  --info:#91a7ff;--warning:#f4b35c;--border:#45313e;
  --shadow:0 8px 28px rgba(0,0,0,.30);
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{font-family:Tahoma,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;direction:rtl;line-height:1.55}
button,input,select,textarea{font:inherit}
button{touch-action:manipulation}
.hidden{display:none!important}

/* LOGIN */
#loginScreen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:22px;background:linear-gradient(150deg,var(--dark),#76224f 55%,#c54476)}
.login-logo{font-size:64px;margin-bottom:6px;filter:drop-shadow(0 7px 18px rgba(0,0,0,.35))}
.login-title{color:#fff;font-size:27px;font-weight:900;text-align:center}
.login-sub{color:rgba(255,255,255,.82);font-size:13px;margin:4px 0 24px;text-align:center}
.login-box{background:var(--card);border-radius:24px;padding:22px;width:100%;max-width:400px;box-shadow:0 20px 60px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.12)}
.login-box h2{font-size:17px;color:var(--primary);margin-bottom:16px;text-align:center}
.role-tabs{display:flex;gap:7px;margin-bottom:16px}
.role-tab{flex:1;min-height:46px;padding:8px 5px;border-radius:12px;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-size:12px;font-weight:700;cursor:pointer;transition:.2s}
.role-tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.login-input,.fi{width:100%;padding:11px 12px;border:1.5px solid var(--border);border-radius:12px;font-size:14px;color:var(--text);background:var(--surface);outline:none;direction:rtl;transition:.2s}
.login-input{margin-bottom:11px;background:var(--card)}
.login-input:focus,.fi:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 15%,transparent)}
.login-btn{width:100%;min-height:48px;padding:12px;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:0;border-radius:14px;font-size:16px;font-weight:800;cursor:pointer}
.login-err{color:var(--danger);font-size:13px;text-align:center;margin-top:9px;display:none}
.login-help{margin-top:13px;border-top:1px solid var(--border);padding-top:10px;color:var(--muted);font-size:12px}
.login-help summary{cursor:pointer;color:var(--primary);font-weight:700}
.login-help code{direction:ltr;display:inline-block;background:var(--surface);padding:1px 5px;border-radius:5px}

/* APP */
#appScreen{display:none;padding-bottom:92px}
.header{background:linear-gradient(135deg,var(--dark),#76224f 58%,#c54476);padding:17px 14px 27px;color:#fff;position:relative;overflow:hidden}
.header:before,.header:after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.06)}
.header:before{width:130px;height:130px;top:-45px;left:-28px}.header:after{width:85px;height:85px;bottom:-35px;right:15%}
.header-top{display:flex;justify-content:space-between;align-items:center;gap:8px;position:relative;z-index:2}
.header-logo{font-size:20px;font-weight:900}.header-logo span{display:block;font-size:11px;font-weight:400;opacity:.82;margin-top:2px}
.header-actions{display:flex;align-items:center;gap:6px}
.user-badge,.icon-btn,.logout-btn{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.16);color:#fff;border-radius:11px;min-height:36px;padding:6px 9px;font-size:11px;font-weight:700}
.icon-btn,.logout-btn{cursor:pointer}.icon-btn{width:38px;padding:0;font-size:17px}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:0 10px;margin-top:-15px;position:relative;z-index:3}
.stat-card{background:var(--card);border-radius:14px;padding:10px 6px;text-align:center;box-shadow:var(--shadow);border-top:3px solid var(--primary);min-width:0}
.stat-card.gold{border-color:var(--gold)}.stat-card.green{border-color:var(--success)}.stat-card.blue{border-color:var(--info)}
.stat-val{font-size:16px;font-weight:900;color:var(--primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stat-card.gold .stat-val{color:var(--gold)}.stat-card.green .stat-val{color:var(--success)}.stat-card.blue .stat-val{color:var(--info)}
.stat-label{font-size:9px;color:var(--muted);margin-top:2px}

.nav{position:fixed;bottom:0;left:0;right:0;background:var(--card);display:flex;overflow-x:auto;box-shadow:0 -5px 22px rgba(0,0,0,.11);z-index:100;border-radius:20px 20px 0 0;scrollbar-width:none;border-top:1px solid var(--border)}
.nav::-webkit-scrollbar{display:none}.nav-btn{flex:1 0 70px;min-width:70px;padding:9px 3px 7px;background:none;border:0;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;font-size:9.5px;transition:.2s}
.nav-btn .ni{font-size:20px}.nav-btn.active{color:var(--primary);font-weight:800}.nav-btn.active .ni{transform:translateY(-1px) scale(1.1)}

.page{display:none;padding:12px;max-width:980px;margin:auto}.page.active{display:block}
.sec-title{font-size:15px;font-weight:800;color:var(--primary);margin:10px 0;display:flex;align-items:center;gap:7px}
.sec-title:after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--primary),transparent);border-radius:3px}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:15px;margin-bottom:12px;border:1px solid color-mix(in srgb,var(--border) 70%,transparent)}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:9px}.fg{margin-bottom:11px}.fg label{font-size:12.5px;font-weight:700;display:block;margin-bottom:5px;color:var(--text)}
.fi[type=number]{direction:ltr;text-align:right}.fi::placeholder{color:color-mix(in srgb,var(--muted) 72%,transparent)}
textarea.fi{resize:vertical;min-height:76px}.hint{font-size:11px;color:var(--muted);margin-top:4px}.required{color:var(--danger)}

.btn{width:100%;min-height:45px;padding:10px 12px;border:0;border-radius:13px;font-size:14px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:.18s}
.btn:active{transform:scale(.985)}.btn-p{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;box-shadow:0 6px 17px rgba(118,34,79,.22)}
.btn-soft{background:var(--surface);color:var(--primary);border:1px solid var(--border)}.btn-danger{background:color-mix(in srgb,var(--danger) 12%,var(--card));color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 25%,transparent)}
.btn-success{background:color-mix(in srgb,var(--success) 12%,var(--card));color:var(--success);border:1px solid color-mix(in srgb,var(--success) 25%,transparent)}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}.btn-row .btn{flex:1;min-width:140px}
.btn-sm{min-height:34px;padding:5px 9px;border:0;border-radius:9px;font-size:11px;font-weight:700;cursor:pointer}.bs-view{background:var(--surface);color:var(--primary)}.bs-edit{background:color-mix(in srgb,var(--info) 12%,var(--card));color:var(--info)}.bs-done{background:color-mix(in srgb,var(--success) 12%,var(--card));color:var(--success)}.bs-del{background:color-mix(in srgb,var(--danger) 12%,var(--card));color:var(--danger)}

.alerts{display:grid;gap:8px}.alert{padding:11px 12px;border-radius:13px;font-size:12px;font-weight:700;border:1px solid}.alert.warn{background:color-mix(in srgb,var(--warning) 10%,var(--card));color:var(--warning);border-color:color-mix(in srgb,var(--warning) 28%,transparent)}.alert.danger{background:color-mix(in srgb,var(--danger) 10%,var(--card));color:var(--danger);border-color:color-mix(in srgb,var(--danger) 28%,transparent)}.alert.info{background:color-mix(in srgb,var(--info) 10%,var(--card));color:var(--info);border-color:color-mix(in srgb,var(--info) 28%,transparent)}

.search-tools{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:9px}.search-box{position:relative}.search-box .fi{padding-right:39px;background:var(--card)}.si{position:absolute;right:12px;top:50%;transform:translateY(-50%)}
.sort-select{width:145px}.ftabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:10px;scrollbar-width:none}.ftabs::-webkit-scrollbar{display:none}.ftab{padding:7px 12px;border-radius:18px;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap}.ftab.active{background:var(--primary);color:#fff;border-color:var(--primary)}

.oc{background:var(--card);border-radius:16px;box-shadow:0 3px 13px rgba(0,0,0,.06);padding:13px;margin-bottom:9px;border-right:4px solid var(--primary);animation:fadeIn .24s ease}.oc.done{border-color:var(--success)}.oc.cancelled{border-color:var(--danger);opacity:.82}.oc.overdue{box-shadow:0 0 0 1px color-mix(in srgb,var(--danger) 40%,transparent),var(--shadow)}
.oc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.oc-name{font-size:14px;font-weight:800;min-width:0}.order-no{font-size:10px;color:var(--muted);display:block;margin-bottom:2px}.oc-price{font-size:16px;font-weight:900;color:var(--primary);white-space:nowrap}.oc-meta{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0}.badge{font-size:10.5px;padding:3px 8px;border-radius:15px;font-weight:700}.b-type{background:var(--surface);color:var(--primary)}.b-date{background:color-mix(in srgb,var(--info) 10%,var(--card));color:var(--info)}.b-phone{background:color-mix(in srgb,var(--success) 10%,var(--card));color:var(--success)}.b-pending{background:color-mix(in srgb,var(--warning) 11%,var(--card));color:var(--warning)}.b-done{background:color-mix(in srgb,var(--success) 11%,var(--card));color:var(--success)}.b-cancelled{background:color-mix(in srgb,var(--danger) 11%,var(--card));color:var(--danger)}.b-slice{background:#fff1e6;color:#a84f00}.oc-note{font-size:11px;color:var(--muted);margin-top:3px}.oc-actions{display:flex;gap:5px;margin-top:8px;flex-wrap:wrap}.pay-line{height:6px;border-radius:5px;background:var(--surface);margin-top:8px;overflow:hidden}.pay-line span{display:block;height:100%;background:linear-gradient(90deg,var(--success),#56cbae);border-radius:5px}

.empty{text-align:center;padding:34px 16px;color:var(--muted)}.empty-icon{font-size:44px;margin-bottom:7px}.empty-text{font-size:14px;font-weight:700}

.mold-grid,.addon-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.mold-card{background:var(--card);border-radius:14px;padding:11px;box-shadow:0 2px 9px rgba(0,0,0,.05);border:2px solid var(--border);cursor:pointer;text-align:center;transition:.18s}.mold-card.selected{border-color:var(--primary);background:var(--surface)}.mold-icon{font-size:25px}.mold-name{font-size:11.5px;font-weight:800}.mold-price{font-size:12px;font-weight:900;color:var(--primary);margin-top:2px}
.addon-item{background:var(--surface);border-radius:12px;padding:9px;display:flex;flex-direction:column;gap:6px;border:1px solid var(--border)}.addon-check{display:flex;align-items:center;gap:7px;cursor:pointer}.addon-check input{width:18px;height:18px;accent-color:var(--primary)}.addon-name{font-size:12px;font-weight:700}.addon-price{width:100%;padding:7px 8px;border:1.5px solid var(--border);border-radius:9px;background:var(--card);color:var(--text);font-size:12px;outline:none}
.img-upload{border:2px dashed var(--border);border-radius:14px;padding:17px;text-align:center;cursor:pointer;background:var(--surface)}.img-preview{width:100%;border-radius:12px;margin-top:9px;max-height:210px;object-fit:cover;display:none;border:1px solid var(--border)}.img-actions{display:none;gap:7px;margin-top:7px}.img-actions.show{display:flex}.img-actions .btn{min-height:38px;font-size:12px}

.summary-box,.calc-res{background:var(--surface);border-radius:14px;padding:12px;margin-top:10px;border:1px solid var(--border)}.cr-row{display:flex;justify-content:space-between;gap:10px;padding:4px 0;font-size:12.5px}.cr-total{border-top:2px solid var(--primary);margin-top:5px;padding-top:8px;font-size:16px;font-weight:900;color:var(--primary)}.cr-remain{font-weight:800;color:var(--warning)}
.slice-box{background:color-mix(in srgb,#ff8a32 8%,var(--card));border-radius:15px;padding:14px;margin-bottom:12px;border:1.5px solid color-mix(in srgb,#ff8a32 35%,transparent)}.slice-counter{display:flex;align-items:center;justify-content:center;gap:16px;margin:10px 0}.cnt-btn{width:43px;height:43px;border-radius:50%;border:0;font-size:21px;font-weight:900;background:var(--primary);color:#fff;cursor:pointer}.cnt-val{font-size:27px;font-weight:900;color:var(--primary);min-width:48px;text-align:center}.slice-total{background:var(--primary);color:#fff;border-radius:11px;padding:10px;text-align:center;font-size:15px;font-weight:800}

.profit-box{background:linear-gradient(135deg,var(--dark),#76224f);color:#fff;border-radius:16px;padding:15px;text-align:center;margin-bottom:11px}.profit-box .pb-label{font-size:12px;opacity:.82}.profit-box .pb-amount{font-size:27px;font-weight:900;margin:2px}.mini-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.mini-stat{background:var(--surface);border-radius:12px;padding:10px;text-align:center}.mini-stat strong{display:block;font-size:16px;color:var(--primary)}.mini-stat span{font-size:10px;color:var(--muted)}
.list-row,.rep-row,.detail-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:9px 0;border-bottom:1px solid var(--border);font-size:12.5px}.list-row:last-child,.rep-row:last-child,.detail-row:last-child{border-bottom:0}.rk,.detail-key{color:var(--muted)}.rv,.detail-val{font-weight:800;text-align:left;overflow-wrap:anywhere}.detail-img{width:100%;border-radius:14px;margin:5px 0 10px;object-fit:cover;max-height:250px;border:1px solid var(--border)}

.user-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px;background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:7px}.user-info .un{font-size:13px;font-weight:800}.user-info .ur{font-size:10.5px;color:var(--muted)}.role-badge{font-size:10px;font-weight:800;padding:4px 8px;border-radius:15px}.rb-admin{background:color-mix(in srgb,var(--primary) 12%,var(--card));color:var(--primary)}.rb-cashier{background:color-mix(in srgb,var(--info) 12%,var(--card));color:var(--info)}.rb-chef{background:color-mix(in srgb,var(--success) 12%,var(--card));color:var(--success)}
.audit-item{padding:8px 0;border-bottom:1px dashed var(--border);font-size:11px}.audit-item:last-child{border:0}.audit-time{color:var(--muted);font-size:10px}

.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.58);z-index:200;align-items:flex-end;justify-content:center}.modal-overlay.open{display:flex}.modal{background:var(--card);width:100%;max-width:680px;max-height:92vh;border-radius:24px 24px 0 0;padding:17px 15px;overflow-y:auto;box-shadow:0 -12px 45px rgba(0,0,0,.22)}.modal-handle{width:40px;height:4px;background:var(--border);border-radius:3px;margin:0 auto 13px}.modal-title{font-size:16px;font-weight:900;color:var(--primary);margin-bottom:13px}
.toast{position:fixed;bottom:102px;left:50%;transform:translateX(-50%) translateY(20px);background:#1e1720;color:#fff;padding:10px 18px;border-radius:28px;font-size:12.5px;font-weight:700;opacity:0;transition:.25s;z-index:300;white-space:nowrap;max-width:92vw;overflow:hidden;text-overflow:ellipsis}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:620px){.fr{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.stat-val{font-size:17px}.search-tools{grid-template-columns:1fr}.sort-select{width:100%}.header-logo{font-size:17px}.user-badge{display:none}}
@media(min-width:760px){.page{padding:18px}.mold-grid{grid-template-columns:repeat(5,1fr)}.addon-grid{grid-template-columns:repeat(3,1fr)}.modal-overlay{align-items:center}.modal{border-radius:24px}}
@media print{body{background:#fff;color:#000}.header,.stats,.nav,.no-print{display:none!important}.page{display:block!important;max-width:none;padding:0}.card{box-shadow:none;border:0}}


/* Cloud/PWA additions */
.connection-strip{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;padding:9px 10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);font-size:11px}
.connection-strip strong{display:flex;align-items:center;gap:6px}.dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 14%,transparent)}.dot.online{background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 14%,transparent)}.dot.syncing{background:var(--warning);box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 14%,transparent)}
.link-btn{border:0;background:none;color:var(--primary);font-weight:800;cursor:pointer;font-size:11px;text-decoration:underline}
.sync-pill{display:flex;align-items:center;gap:5px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.18);border-radius:11px;padding:6px 8px;font-size:10px;font-weight:800;white-space:nowrap}.sync-pill .dot{width:7px;height:7px;box-shadow:none;background:#ffd36a}.sync-pill.online .dot{background:#62efc3}.sync-pill.offline .dot{background:#ff8792}
.setup-note{font-size:11px;line-height:1.8;color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;margin-bottom:12px}.setup-note code{direction:ltr;display:inline-block;max-width:100%;overflow-wrap:anywhere;color:var(--primary)}
.queue-banner{position:fixed;top:8px;left:50%;transform:translateX(-50%);z-index:450;background:var(--warning);color:#fff;border-radius:22px;padding:8px 14px;font-size:11px;font-weight:800;box-shadow:var(--shadow);display:none}.queue-banner.show{display:block}
.status-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.status-actions .btn-sm{flex:1;min-width:88px}.b-seen{background:color-mix(in srgb,var(--info) 10%,var(--card));color:var(--info)}.b-preparing{background:color-mix(in srgb,#8b5cf6 11%,var(--card));color:#7345cf}.b-ready{background:color-mix(in srgb,var(--success) 12%,var(--card));color:var(--success)}
.install-banner{display:none;margin:0 12px 10px;padding:10px 12px;border-radius:13px;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;align-items:center;justify-content:space-between;gap:8px;font-size:11px;font-weight:700}.install-banner.show{display:flex}.install-banner button{border:0;border-radius:9px;padding:7px 10px;background:#fff;color:var(--primary);font-weight:900;cursor:pointer}
.offline-readonly{opacity:.72;pointer-events:none}
@media(max-width:620px){.sync-pill{padding:6px}.sync-pill span:last-child{display:none}}
