:root{
  --ink:#0C0A09; --ink2:#141110; --ink3:#1D1815;
  --yellow:#FFC61A; --red:#D62828; --cream:#FFF6E5; --mut:#9E9486; --line:rgba(255,255,255,.09);
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--ink); color:var(--cream);
  font-family:'Almarai',system-ui,sans-serif; font-size:15px; line-height:1.7;
}
h1{font-family:'Lalezar',sans-serif; font-weight:400; font-size:34px; margin:0 0 4px; color:#fff}
h2{font-family:'Lalezar',sans-serif; font-weight:400; font-size:23px; margin:0 0 14px; color:var(--yellow)}
h3{font-family:'Lalezar',sans-serif; font-weight:400; font-size:20px; margin:0 0 8px; color:#fff}
p.sub{color:var(--mut); margin:0 0 26px}
p.hint{color:var(--mut); font-size:13.5px; margin:-6px 0 14px}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer; border:0; background:none; color:inherit}
:focus-visible{outline:2px solid var(--yellow); outline-offset:2px}

/* ---------- الدخول ---------- */
.loginpage{display:grid; place-items:center; min-height:100svh; padding:20px;
  background:radial-gradient(60% 50% at 50% 0%, rgba(255,198,26,.12), transparent 60%), var(--ink)}
.loginbox{width:min(100%,390px); background:var(--ink2); border:1px solid var(--line); border-radius:24px; padding:34px}
.lmark{width:64px; height:64px; border-radius:50%; background:var(--ink3); border:3px solid var(--red);
  box-shadow:0 0 0 3px var(--yellow) inset; display:grid; place-items:center; margin:0 auto 16px;
  font-family:'Lalezar'; font-size:26px; color:var(--yellow)}
.loginbox h1{text-align:center; font-size:28px}
.loginbox .sub{text-align:center; font-size:14px}
.loginbox label{display:block; font-size:13px; color:var(--mut); margin:14px 0 6px}
.loginbox input{width:100%}
.loginbox .btn{width:100%; margin-top:20px; justify-content:center}
.back{display:block; text-align:center; margin-top:18px; font-size:13px; color:var(--mut)}
.err{background:rgba(214,40,40,.15); border:1px solid rgba(214,40,40,.4); color:#FFB4B4;
  padding:10px 14px; border-radius:12px; font-size:14px; margin-top:14px}

/* ---------- الحقول ---------- */
input,textarea,select{
  width:100%; background:#0F0D0B; border:1px solid var(--line); border-radius:12px;
  padding:11px 14px; color:var(--cream); font-family:inherit; font-size:14.5px;
}
input:focus,textarea:focus,select:focus{border-color:var(--yellow); outline:none}
textarea{resize:vertical; line-height:1.6}
input[type=file]{padding:9px; font-size:13px}
input[type=checkbox]{width:auto}
.fld{margin-bottom:14px}
.fld label{display:block; font-size:12.5px; color:var(--mut); margin-bottom:6px; font-weight:700}
.g2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.g3{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}

.btn{display:inline-flex; align-items:center; gap:8px; background:var(--yellow); color:#120E08;
  font-weight:800; padding:12px 26px; border-radius:100px; font-size:15px; transition:.25s; margin-top:8px}
.btn:hover{transform:translateY(-2px); box-shadow:0 10px 26px rgba(255,198,26,.3)}
.btn:disabled{opacity:.6}
.btn.ghost{background:none; border:2px solid var(--line); color:var(--cream); margin-inline-start:8px}

.switch{display:inline-flex; align-items:center; gap:9px; cursor:pointer; font-size:14px; font-weight:700}
.switch input{display:none}
.switch i{width:44px; height:25px; border-radius:20px; background:#2A2320; position:relative; transition:.3s}
.switch i::after{content:""; position:absolute; top:3px; right:3px; width:19px; height:19px; border-radius:50%; background:#6B6257; transition:.3s}
.switch input:checked + i{background:rgba(74,222,128,.25)}
.switch input:checked + i::after{background:#4ADE80; transform:translateX(-19px)}

/* ---------- الهيكل ---------- */
.side{
  position:fixed; inset-block:0; inset-inline-start:0; width:250px; background:var(--ink2);
  border-inline-end:1px solid var(--line); padding:22px 14px; overflow-y:auto; z-index:50;
  display:flex; flex-direction:column; gap:3px;
}
.side .brand{display:flex; align-items:center; gap:10px; padding:0 8px 20px}
.side .mark{width:40px; height:40px; border-radius:50%; background:var(--ink3); border:3px solid var(--red);
  box-shadow:0 0 0 3px var(--yellow) inset; display:grid; place-items:center; font-family:'Lalezar'; color:var(--yellow)}
.side .brand b{font-family:'Lalezar'; font-weight:400; font-size:19px}
.side .brand i{color:var(--yellow); font-style:normal}
.side a{display:flex; align-items:center; gap:11px; padding:11px 14px; border-radius:12px; font-size:14.5px; color:#C3B9AA; transition:.2s}
.side a:hover{background:rgba(255,255,255,.05); color:#fff}
.side a.on{background:var(--yellow); color:#120E08; font-weight:800}
.side-foot{margin-top:auto; padding-top:16px; border-top:1px solid var(--line)}
.side-foot .out{color:#FF8A8A}
.main{margin-inline-start:250px; padding:34px clamp(16px,3vw,46px) 80px; max-width:1150px}

#mnav{display:none; position:fixed; top:12px; inset-inline-start:12px; z-index:60; width:44px; height:44px;
  border-radius:12px; background:var(--ink3); border:1px solid var(--line); font-size:19px}

.flash{background:rgba(74,222,128,.12); border:1px solid rgba(74,222,128,.35); color:#B7F5CC;
  padding:12px 18px; border-radius:14px; margin-bottom:22px; font-weight:700; font-size:14.5px}

.card{background:var(--ink2); border:1px solid var(--line); border-radius:20px; padding:24px; margin-bottom:22px}

.cards4{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px}
.kpi{background:var(--ink2); border:1px solid var(--line); border-radius:18px; padding:20px}
.kpi b{display:block; font-family:'Space Grotesk'; font-size:34px; color:var(--yellow); line-height:1}
.kpi span{font-size:13px; color:var(--mut)}
.kpi.hi{border-color:rgba(255,107,0,.45); background:linear-gradient(180deg,#241609,var(--ink2))}
.quick{display:flex; gap:10px; flex-wrap:wrap}
.quick a{padding:11px 18px; border:1px solid var(--line); border-radius:100px; font-size:14px; font-weight:700}
.quick a:hover{border-color:var(--yellow); color:var(--yellow)}

/* ---------- العروض ---------- */
.promo-box{border:1px solid rgba(255,107,0,.3); background:rgba(255,107,0,.05); border-radius:16px; padding:18px; margin:18px 0}
.days{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px}
.dchip input{display:none}
.dchip span{display:block; padding:9px 15px; border-radius:100px; border:1px solid var(--line); font-size:13.5px; cursor:pointer; transition:.2s}
.dchip input:checked + span{background:var(--yellow); color:#120E08; border-color:var(--yellow); font-weight:800}
.checks{display:flex; gap:22px; flex-wrap:wrap; margin:14px 0}
.prev{display:flex; align-items:center; gap:14px; margin-bottom:14px}
.prev img{width:80px; height:80px; object-fit:cover; border-radius:12px; border:1px solid var(--line)}
.mini{font-size:13px; color:var(--mut); display:flex; align-items:center; gap:6px}

/* ---------- لائحة الأطباق ---------- */
.dishes{display:flex; flex-direction:column; gap:8px}
.dish{display:flex; align-items:center; gap:13px; padding:11px; border:1px solid var(--line); border-radius:14px; background:#0F0D0B}
.dish.off{opacity:.45}
.dish .th{width:52px; height:52px; flex:0 0 52px; border-radius:11px; background:var(--ink3); display:grid; place-items:center; font-size:24px; overflow:hidden}
.dish .th img{width:100%; height:100%; object-fit:cover}
.dinfo{flex:1; min-width:0}
.dinfo b{font-size:15px; color:#fff; font-weight:800}
.dinfo small{color:var(--mut); font-weight:400; font-size:12px; margin-inline-start:6px}
.pz{display:block; font-size:13px; color:var(--mut); font-family:'Space Grotesk'}
.pz s{opacity:.6} .pz u{color:var(--yellow); text-decoration:none; font-weight:700}
.pz em{font-style:normal; background:var(--red); color:#fff; font-size:11px; padding:2px 8px; border-radius:100px; margin-inline-start:6px}
.pz em.soft{background:rgba(255,255,255,.08); color:var(--mut)}
.dacts{display:flex; gap:5px; align-items:center}
.dacts button,.dacts a{width:34px; height:34px; border-radius:10px; border:1px solid var(--line); display:grid; place-items:center; font-size:14px; transition:.2s}
.dacts button:hover,.dacts a:hover{border-color:var(--yellow)}
.dacts .dan:hover{border-color:var(--red); background:rgba(214,40,40,.15)}
.dacts form{display:contents}

/* ---------- محرّر الصفوف ---------- */
.rows{display:flex; flex-direction:column; gap:10px}
.rowline{display:flex; gap:12px; align-items:flex-start; padding:13px; border:1px solid var(--line); border-radius:14px; background:#0F0D0B; flex-wrap:wrap}
.rowline.new{border-style:dashed; border-color:rgba(255,198,26,.35)}
.rowline .fld{margin:0; min-width:140px}
.del-note{font-size:11px; color:#5E564E; align-self:center}

@media (max-width:900px){
  .side{transform:translateX(100%); transition:transform .35s}
  .side.on{transform:none}
  .main{margin-inline-start:0; padding-top:68px}
  #mnav{display:grid}
  .g2,.g3,.cards4{grid-template-columns:1fr}
  .cards4{grid-template-columns:1fr 1fr}
}