/* ===== Kah Go x Temu — ثيم العميل فقط (لوحة التحكم والتطبيق الأساسيان محفوظان) ===== */
:root{
  --bg:#f2f3f5;
  --bg-2:#f7f7f7;
  --surface:#ffffff;
  --surface-2:#f7f8fa;
  --line:#ececec;
  --text:#1f1f1f;
  --muted:#8c8c8c;
  --primary:#ff6a00;
  --primary-2:#ff4d00;
  --pink:#ff2d2d;
  --accent:#ff6a00;
  --green:#00a868;
  --grad:linear-gradient(120deg,#ff8a00,#ff4d00);
  --radius:16px;
  --shadow:0 6px 20px rgba(0,0,0,.08);
}
body{background:var(--bg);color:var(--text)}
::-webkit-scrollbar-thumb{background:#d9d9d9;border:3px solid var(--bg)}
::selection{background:#ffd9b8;color:#1f1f1f}

/* ===== الشريط العلوي ===== */
.topbar{background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.page-title h1{font-weight:900;color:#1f1f1f}
.search input{background:#f2f3f5;border-color:transparent;color:var(--text);width:250px}
.search input::placeholder{color:#a0a0a0}
.search input:focus{width:300px;background:#fff;border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,106,0,.15)}
.search svg{color:var(--primary)}
.icon-btn,.hamburger{background:#f2f3f5;border-color:transparent;color:#1f1f1f}
.top-avatar{background:#f2f3f5;border-color:transparent}
.top-avatar span{color:var(--muted)}

/* ===== الشريط الجانبي ===== */
.sidebar{background:#fff;border-inline-start:1px solid var(--line);box-shadow:1px 0 0 rgba(0,0,0,.03)}
.brand{border-bottom-color:var(--line)}
.nav-group > h6{color:#9a9a9a}
.s-link{color:#5a5a5a}
.s-link:hover{background:#f6f6f6;color:#1f1f1f}
.s-link.active{background:var(--grad);color:#fff;box-shadow:0 8px 18px rgba(255,90,0,.3)}
.s-link.active .badge{background:rgba(0,0,0,.22)}
.side-card{background:linear-gradient(150deg,#fff4e8,#ffe9d6);border-color:#ffd9b8}
.side-card p{color:#7a5a3a}
.side-user{background:#f7f7f7;border-color:var(--line)}
.logout{color:#9a9a9a}

/* ===== الترحيب ===== */
.hello{background:linear-gradient(120deg,#ff7a00,#ff4d00);border-color:transparent;color:#fff;border-radius:20px;box-shadow:0 12px 26px rgba(255,90,0,.32);overflow:hidden}
.hello h2,.hello h2 span{color:#fff}
.hello p{color:rgba(255,255,255,.92)}
.hello .btn-ghost{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5);color:#fff}
.hello .btn-ghost:hover{background:rgba(255,255,255,.34);color:#fff}
.hello .btn-primary{background:#fff;color:#ff4d00;box-shadow:0 6px 14px rgba(0,0,0,.18)}
.hello .btn-primary:hover{background:#fff}
.big-avatar{background:#fff;color:#ff4d00;box-shadow:0 10px 24px rgba(0,0,0,.18)}

/* ===== اللوحات ===== */
.panel,.kpi{background:#fff;border-color:var(--line);box-shadow:0 2px 10px rgba(0,0,0,.04);border-radius:16px}
.panel-head{border-bottom-color:#f0f0f0}
.panel-head h3{font-weight:900}
.panel-head .btn{white-space:nowrap}
.panel-foot{color:#8c8c8c;border-top-color:#eee}
.kpi .val{color:#1f1f1f}
.kpi .lab{color:#8c8c8c}
.kpi .delta.up{background:#e7f8f0;color:#00a868}
.kpi .delta.down{background:#ffecec;color:#ff2d2d}
.kpi-ico{background:#f5f6f8;border-color:#eee;color:#ff6a00}
.kpi::after{opacity:0}

/* ===== الأزرار ===== */
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 6px 14px rgba(255,90,0,.35)}
.btn-primary:hover{box-shadow:0 8px 18px rgba(255,90,0,.45)}
.btn-ghost{background:#f5f6f8;border-color:#e8e8e8;color:#333}
.btn-ghost:hover{border-color:var(--primary);color:var(--primary);background:#fff}
.btn-danger{background:#ffecec;border-color:#ffd6d6;color:#e53935}
.btn-danger:hover{background:#ffdede;border-color:#ffb3b3;color:#e53935}
.btn-sm{min-height:34px}

/* ===== الشارات والحالة ===== */
.tp-orange{background:#fff1e6;color:#ff6a00;border-color:#ffd9b8}
.tp-cyan{background:#e8f7ff;color:#0089c7;border-color:#c9ecff}
.tp-green{background:#e7f8f0;color:#00a868;border-color:#c6efdd}
.tp-pink{background:#ffecec;color:#ff2d2d;border-color:#ffd6d6}
.tp-purple{background:#f2ecff;color:#7c4dff;border-color:#e0d4ff}
.st-new{background:#e8f7ff;color:#0089c7}
.st-prog{background:#fff1e6;color:#ff6a00}
.st-done{background:#e7f8f0;color:#00a868}
.st-cancel{background:#ffecec;color:#ff2d2d}
.st-wait{background:#f0f0f0;color:#8c8c8c}
.st-live{background:#e7f8f0;color:#00a868}
.rate{color:#ff6a00;font-weight:800}
.mono{color:#0089c7}
.tag-pill{border-color:rgba(0,0,0,.05)}

/* ===== الجداول ===== */
thead th{background:#f7f8fa;color:#5a5a5a;border-bottom-color:#eee}
tbody td{border-bottom-color:#f1f1f1}
tbody tr:hover{background:#fafafa}
tbody tr[data-row]{border-color:#eee}
tbody tr[data-row]:hover{background:#fff8f0}
tbody tr[data-row] td:first-child{color:#1f1f1f;font-weight:800}
tbody tr[data-row] td:last-child{border-top-color:#f1f1f1}
tbody tr[data-row] td::before{color:#8c8c8c}
.list-item{background:#f8f9fa;border-color:#eee}
.list-item:hover{border-color:#ffd9b8;background:#fff8f0}
.empty-row td{color:#8c8c8c}
.bar{background:#ececec}
.bar i{background:var(--grad)}
.bar.green i,.bar.cyan i,.bar.pink i,.bar.amber i{filter:saturate(1.15)}

/* ===== المحافظة والهدايا ===== */
.wallet{background:linear-gradient(135deg,#fff4e8,#ffe9d6);border-color:#ffd9b8}
.wallet::after{background:radial-gradient(circle,rgba(255,106,0,.25),transparent 70%)}
.wallet .w-label{color:#8c6a4a}
.wallet .w-val{color:#ff4d00}
.wallet .w-num{color:#8c8c8c}
.gift-panel{background:#fff;border-color:var(--line)}
.gift-empty{background:#fafafa;border-color:#ececec;color:#8c8c8c}

/* ===== الحقول ===== */
.field input,.field select,.field textarea{background:#f5f6f8;border-color:#e8e8e8;color:#1f1f1f}
.field input::placeholder,.field textarea::placeholder{color:#a8a8a8}
.field input:focus,.field select:focus,.field textarea:focus{background:#fff;border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,106,0,.15);color:#1f1f1f}
.field select option{background:#fff;color:#1f1f1f}
.field > label{color:#666}
.chip{background:#f5f6f8;border-color:#e8e8e8;color:#666}
.chip:hover{border-color:var(--primary);color:var(--primary)}
.chip.active{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 14px rgba(255,90,0,.3)}
.chip .badge{background:#ff2d2d;color:#fff}
.addon{background:#f2f3f5;color:#555;border-color:#e6e6e6}

/* ===== رسائل وتنبيهات ===== */
.msg{background:#e7f8f0;border-color:#bdeada;color:#00a868}
.alert{background:#fff1e6;border-color:#ffd9b8;color:#ff6a00}
.alert.err{background:#ffecec;border-color:#ffd6d6;color:#ff2d2d}
#toastBox > div{background:#fff!important;color:#1f1f1f!important;border:1px solid #eee!important;box-shadow:0 10px 26px rgba(0,0,0,.16)!important;border-radius:14px!important;font-weight:700!important}

/* ===== العروض: بانرات أفقية ===== */
.offers-grid{display:flex;gap:.7rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.35rem;scrollbar-width:none}
.offers-grid::-webkit-scrollbar{display:none}
.offer-card{flex:0 0 74%;scroll-snap-align:start;border:none;color:#fff;background:linear-gradient(120deg,#ff7a00,#ff3d00);border-radius:18px;padding:1.05rem 1.1rem;box-shadow:0 8px 18px rgba(255,80,0,.28);transform:translateY(0)}
.offer-card:nth-child(even){background:linear-gradient(120deg,#ff4d4d,#ff8a00);box-shadow:0 8px 18px rgba(255,60,60,.25)}
.offer-card.o-gift{background:linear-gradient(120deg,#ff3d7f,#ff7a00);box-shadow:0 8px 18px rgba(255,61,127,.28)}
.offer-card:hover{transform:translateY(-4px);border:none}
.offer-card > b{color:#fff;font-size:1.05rem;font-weight:900}
.offer-card > span{color:rgba(255,255,255,.92)}
.o-foot small{color:rgba(255,255,255,.85)}
.offer-card .tag-pill{background:rgba(255,255,255,.24)!important;color:#fff!important;border-color:rgba(255,255,255,.35)!important}
.offer-card .btn{background:#fff;color:#ff3d00;box-shadow:none}
.offer-card .btn:hover{background:#fff6f2}
.offer-card.applied{background:linear-gradient(120deg,#00c486,#00a868);box-shadow:0 8px 18px rgba(0,180,130,.28)}
.offer-card.applied .btn{background:rgba(255,255,255,.25);color:#fff;border-color:rgba(255,255,255,.55)}
.offer-card.applied .btn:hover{background:rgba(255,255,255,.38)}

/* ===== التصنيفات: دوائر ===== */
.cat-grid{grid-template-columns:repeat(4,1fr);gap:.55rem}
.cat-tile{flex-direction:column;align-items:center;text-align:center;background:transparent;border:1px solid transparent;padding:.5rem .2rem .35rem;gap:.4rem;position:relative}
.cat-tile:hover{background:transparent;border-color:transparent;transform:none}
.cat-tile .cat-ico{width:58px;height:58px;margin:0;border-radius:50%;background:#fff;border:1px solid #eee;box-shadow:0 4px 10px rgba(0,0,0,.06);display:grid;place-items:center;font-size:1.5rem;color:#1f1f1f}
.cat-tile:hover .cat-ico{box-shadow:0 6px 14px rgba(255,106,0,.18);border-color:#ffd9b8}
.cat-tile b{font-size:.76rem;font-weight:800;color:#1f1f1f}
.cat-tile small{display:none}
.cat-tile .tag-pill{position:absolute;top:.15rem;inset-inline-end:.7rem;font-size:.55rem;padding:.1rem .35rem;font-weight:900}

/* ===== المنتجات (قائمة الطعام) ===== */
.menu-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.75rem}
.dish{position:relative;flex-direction:column;align-items:stretch;gap:.5rem;background:#fff;border:1px solid #eee;border-radius:16px;padding:0 0 .8rem;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.dish:hover{transform:translateY(-3px);border-color:#ffd0ad;box-shadow:0 10px 22px rgba(0,0,0,.1)}
.dish-img{width:100%;height:112px;border-radius:0;border:none;background:linear-gradient(160deg,#fff6ec,#ffe9d9);font-size:3rem}
.dish-main{padding:0 .85rem;gap:.25rem}
.dish-main b{font-size:.92rem;font-weight:900;color:#1f1f1f}
.dish-main > span{font-size:.74rem;color:#8c8c8c}
.dish-tags{gap:.4rem}
.dish-tags .tag-pill{font-size:.6rem;padding:.14rem .45rem}
.dish-end{width:100%;padding:0 .85rem;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}
.price{gap:.4rem}
.price b{color:#ff2d2d;font-size:1.08rem;font-weight:900}
.price s{color:#b0b0b0;font-size:.76rem;font-weight:600}
.price small{color:#8c8c8c}
.dish [data-add]{background:var(--grad);color:#fff;border-radius:999px;box-shadow:0 5px 12px rgba(255,90,0,.35);min-height:34px;padding:.35rem 1rem;font-weight:800}
.dish [data-add]:hover{box-shadow:0 7px 16px rgba(255,90,0,.45)}
.p-off{position:absolute;top:.55rem;inset-inline-start:.55rem;z-index:2;background:#ff2d2d;color:#fff;font-size:.68rem;font-weight:900;padding:.16rem .48rem;border-radius:7px;box-shadow:0 4px 10px rgba(255,45,45,.35);letter-spacing:.02em}

/* ===== العناوين ===== */
.section-title{font-weight:900}
.section-sub{color:#8c8c8c}
.menu-cats{gap:.45rem}
.menu-cats .chip{background:#fff;border-color:#e8e8e8}

/* ===== الخط الزمني والتتبع ===== */
.timeline li::after{border-color:#e6e6e6}
.timeline li.now::after{box-shadow:0 0 0 6px rgba(255,106,0,.15)}
.timeline li.done .tl-dot{box-shadow:0 0 0 5px rgba(0,168,104,.15)}
.map{border-color:#e6e6e6}
.map .marker span{color:#fff}

/* ===== الإشعارات والقوائم المنسدلة ===== */
.notif:hover{background:#f7f7f7}
.dropdown{background:#fff;border-color:var(--line);box-shadow:0 14px 34px rgba(0,0,0,.14)}
.dropdown a{color:#444}
.dropdown a:hover{background:#f7f7f7;color:#ff6a00}
.notif .n-ico{background:rgba(255,106,0,.12);color:#ff6a00}

/* ===== العناوين/الهوية ===== */
.addr{background:#fff;border-color:#eee}
.addr:hover,.addr.on{border-color:#ffb380;background:#fff8f0}
.addr .muted{color:#8c8c8c}

/* ===== الشريط السفلي ===== */
.mobile-nav{background:rgba(255,255,255,.98);border-top:1px solid #eee;box-shadow:0 -4px 16px rgba(0,0,0,.06);backdrop-filter:blur(10px)}
.mobile-nav a{color:#8c8c8c;font-size:.66rem;font-weight:700;gap:.2rem}
.mobile-nav a.active{color:#ff6a00;background:rgba(255,106,0,.08)}
.mobile-nav a.active svg{stroke-width:2.4}
.mobile-nav svg{stroke-width:2.1}

/* ===== أدوات مساعدة ===== */
.avatar{border:1px solid rgba(0,0,0,.05)}
.overlay{background:rgba(0,0,0,.42)}

/* ===== الهدايا: اختيار هدية حقيقية ===== */
.gift-items{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}
.gi-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:.3rem;text-align:center;background:#fff;border:1.5px solid #ececec;border-radius:14px;padding:.85rem .5rem .7rem;cursor:pointer;transition:border-color .15s,transform .15s,box-shadow .15s}
.gi-item:hover{border-color:#ffc9a1;transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.06)}
.gi-item.active{border-color:#ff6a00;background:#fff6ef;box-shadow:0 6px 16px rgba(255,106,0,.16)}
.gi-ico{font-size:1.95rem;line-height:1}
.gi-item b{font-size:.78rem;font-weight:800;color:#1f1f1f;line-height:1.35}
.gi-item small{font-size:.74rem;font-weight:900;color:#ff2d2d}
.gi-check{position:absolute;top:.35rem;inset-inline-end:.4rem;width:18px;height:18px;border-radius:50%;background:#ff6a00;color:#fff;font-size:.68rem;font-weight:900;font-style:normal;display:grid;place-items:center;opacity:0;transform:scale(.5);transition:.15s}
.gi-item.active .gi-check{opacity:1;transform:scale(1)}
.gift-note b{color:#ff4d00}

/* ===== اتصال مباشر بالسائق ===== */
.tel-mini{display:inline-flex;align-items:center;gap:.3rem;margin-top:.25rem;padding:.2rem .65rem;border-radius:999px;background:#fff1e6;border:1px solid #ffd9b8;color:#ff5a00;font-family:var(--font);font-weight:900;font-size:.78rem;text-decoration:none;direction:ltr;transition:.15s}
.tel-mini:hover{background:#ffe4d0;border-color:#ffb380}
.tel-mini::before{content:"\1F4DE";font-size:.72rem}
a.btn[href^="tel:"]{gap:.4rem}

/* ===== موبايل ===== */
@media (max-width:760px){
  .search{display:flex;flex:1}
  .search input,.search input:focus{width:100%}
  .page-title{display:none}
  .top-avatar{display:none}
  .topbar{padding:.6rem .8rem;gap:.5rem}
  .hello{flex-direction:row;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem .95rem!important}
  .big-avatar{display:none}
  .cat-grid{grid-template-columns:repeat(4,1fr)}
  .menu-grid{grid-template-columns:repeat(2,1fr);gap:.6rem}
  .gift-items{grid-template-columns:repeat(3,1fr);gap:.5rem}
  .offer-card{flex:0 0 84%}
  .dish-main b{font-size:.84rem}
  .dish-main > span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .panel,.kpi{border-radius:14px}
}
@media (max-width:640px){
  .cat-grid{grid-template-columns:repeat(4,1fr)}
  .menu-grid{grid-template-columns:repeat(2,1fr);gap:.55rem}
  .gift-items{grid-template-columns:repeat(2,1fr);gap:.5rem}
  .gi-item b{font-size:.74rem}
  .dish-img{height:96px;font-size:2.6rem}
  .dish-end{flex-direction:column;align-items:stretch;gap:.45rem}
  .price{justify-content:flex-start;flex-wrap:wrap}
  .price b{font-size:.98rem}
  .dish [data-add]{padding:.32rem .8rem;font-size:.8rem;width:100%}
  .offer-card{flex:0 0 88%;padding:.95rem 1rem}
  .btn{min-height:42px}
  .offers-grid{gap:.6rem}
  tbody tr[data-row]{background:#fafafa;border-color:#eee}
  tbody tr[data-row]:hover{background:#fff8f0}
  tbody tr[data-row] td:first-child{color:#1f1f1f}
  .chip{background:#fff}
}