:root{
  --bg:#0b1220; --panel:#fff; --ink:#0f172a; --muted:#64748b; --line:#e9edf3;
  --accent:#14b8b6; --accent-d:#0e8f8d; --gold:#f5c842; --danger:#e0524d; --ok:#16a34a;
  --radius:16px; --shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.06);
  font-family:'Cairo',system-ui,"Segoe UI",Tahoma,"Noto Naskh Arabic",sans-serif;
}
*{box-sizing:border-box}
input,select,button,textarea{font-family:inherit}
body{margin:0;background:#f5f7fa;color:var(--ink);line-height:1.5}
h1,h2,h3{margin:0 0 .4rem;letter-spacing:-.01em}
a{color:var(--accent-d);text-decoration:none}
.wrap{max-width:1040px;margin:0 auto;padding:1rem}
.muted{color:var(--muted)} .center{text-align:center} .num{text-align:end}
.row{display:flex;flex-wrap:wrap} .gap{gap:.6rem} .wrap{flex-wrap:wrap}
.between{justify-content:space-between} .center-v{align-items:center} .end{align-items:flex-end}
.mt{margin-top:.8rem} .block{width:100%} .hide-sm{} .small{font-size:.8rem}
@media(max-width:680px){.hide-sm{display:none}}
.ico{display:inline-block;vertical-align:middle;flex:none}

/* topbar */
.topbar{background:rgba(255,255,255,.85);backdrop-filter:saturate(150%) blur(8px);
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.topbar .wrap{padding:.6rem 1rem}
.brand{color:var(--ink);font-weight:800;font-size:1.1rem;display:flex;align-items:center;gap:.5rem}
.brand-dot{width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--accent),#0ea5a3);
  box-shadow:0 2px 8px rgba(20,184,182,.5)}
.greet{color:var(--muted);font-size:.95rem}.greet b{color:var(--ink)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;
  color:var(--ink);background:#f1f4f8;border:1px solid var(--line);transition:.15s}
.icon-btn:hover{background:#e7ecf3}
.icon-btn.danger{color:var(--danger)}.icon-btn.danger:hover{background:#fdecec}
.back{display:inline-flex;align-items:center;gap:.3rem;margin:.6rem 0 .2rem;color:var(--accent-d);font-weight:600}

/* hero + tiles */
.hero{padding:.8rem 0 .2rem}
.hero h1{font-size:1.7rem;display:flex;align-items:center;gap:.5rem}
.hero.sm h1{font-size:1.4rem}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin:1.2rem 0}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:1.4rem;display:block;color:var(--ink);transition:.18s}
.tile:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(15,23,42,.12);border-color:#dfe6ee}
.tile-ico{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  margin-bottom:.7rem;color:#fff;background:linear-gradient(135deg,var(--accent),#0ea5a3)}
.tile-ico.ti-pt{background:linear-gradient(135deg,#f97362,#ef4444)}
.tile-ico.ti-topo{background:linear-gradient(135deg,#34d399,#0d9488)}
.tile-ico.ti-cars{background:linear-gradient(135deg,#60a5fa,#4f46e5)}
.tile-ico.ti-set{background:linear-gradient(135deg,#94a3b8,#475569)}
.tile h3{font-size:1.18rem}
.tile-go{display:inline-block;margin-top:.7rem;color:var(--accent-d);font-weight:700}
.empty-wide{grid-column:1/-1;padding:2rem;text-align:center;background:#fff;border:1px dashed var(--line);border-radius:var(--radius)}

/* settings hub */
.set-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem;margin:1rem 0}
.set-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.3rem}
.set-card.wide{grid-column:1/-1}
.set-ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:#eef9f9;color:var(--accent-d);margin-bottom:.6rem}
.set-card h3{font-size:1.1rem}
.u-name{font-weight:700}

/* cards / grid */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.3rem;margin:1rem 0}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:1rem}
@media(max-width:760px){.grid{grid-template-columns:1fr}}

/* auth */
.auth-bg{display:flex;min-height:100vh;align-items:center;justify-content:center;background:linear-gradient(160deg,#0b1220,#0e8f8d)}
.card.narrow{max-width:400px;width:92%;margin:1rem}
.card.narrow .brand{font-size:1.5rem;justify-content:center;color:var(--ink)}

/* forms */
label{display:block;font-weight:600;margin:.6rem 0 .25rem;font-size:.92rem}
input,select{width:100%;padding:.7rem .8rem;border:1px solid var(--line);border-radius:11px;font-size:1rem;background:#fbfcfe}
input:focus,select:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.field{margin-bottom:.6rem}
.seg{display:flex;border:1px solid var(--line);border-radius:11px;overflow:hidden}
.seg-opt{flex:1;margin:0}.seg-opt input{position:absolute;opacity:0}
.seg-opt span{display:block;text-align:center;padding:.7rem;cursor:pointer;font-weight:600;background:#fbfcfe}
.seg-opt input:checked + span{background:var(--accent);color:#fff}
.time-in{flex:1;text-align:center}.time-in small{display:block;color:var(--muted);margin-top:.2rem}
.colon{align-self:center;font-size:1.4rem;font-weight:700;color:var(--muted);padding-top:.4rem}
.checks{display:flex;flex-wrap:wrap;gap:.5rem}
.chk{display:inline-flex;align-items:center;gap:.35rem;font-weight:500;background:#f6f8fb;border:1px solid var(--line);padding:.4rem .7rem;border-radius:999px;margin:0}
.chk input{width:auto}
.editrow{background:#f6f8fb;border-radius:10px;padding:.8rem}

/* buttons */
.btn{display:inline-block;background:var(--accent);color:#fff;border:0;border-radius:10px;padding:.75rem 1.2rem;font-size:1rem;font-weight:700;cursor:pointer;text-align:center}
.btn:hover{background:var(--accent-d)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.ghost:hover{background:#f4f6f9}

/* tables / results */
.pill{background:#eef7f7;color:var(--accent-d);padding:.3rem .7rem;border-radius:999px;font-size:.85rem;font-weight:700}
table{width:100%;border-collapse:collapse}
.scores th,.scores td,.kv th,.kv td{padding:.6rem .4rem;border-bottom:1px solid var(--line);text-align:start}
.kv th{width:38%;color:var(--muted);font-weight:600}
.scores .num{text-align:end}.big{font-size:1.25rem;font-weight:800;color:var(--accent-d)}
.totals{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:1rem}
.tot{background:#f6f8fb;border-radius:12px;padding:.8rem;text-align:center}
.tot span{display:block;font-size:.78rem;color:var(--muted);margin-bottom:.25rem}
.tot strong{font-size:1.5rem}.tot small{font-size:.7rem;color:var(--muted);margin-inline-start:2px}
.tot.accent{background:var(--bg);color:#fff}.tot.accent span,.tot.accent small{color:#9aa7b8}
@media(max-width:420px){.totals{grid-template-columns:1fr}}
.table-scroll{overflow-x:auto}
.hist th,.hist td{padding:.5rem;border-bottom:1px solid var(--line);text-align:start;white-space:nowrap;font-size:.9rem}
.hist b{color:var(--accent-d)}
.result-card .empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:240px;text-align:center}
.empty-ico{font-size:3rem;margin-bottom:.5rem;opacity:.6}

/* badges */
.badge{padding:.25rem .65rem;border-radius:999px;font-size:.8rem;font-weight:700}
.badge.valid{background:#e7f6ee;color:var(--ok)}
.badge.expired{background:#fff4e2;color:#9a6f12}
.badge.revoked{background:#fdeaea;color:var(--danger)}

/* banners */
.banner{padding:.7rem 1rem;border-radius:10px;margin:1rem 0;font-weight:600}
.banner.ok{background:#e7f6ee;color:var(--ok)}
.banner.err{background:#fdeaea;color:var(--danger)}
.ok{color:var(--ok)}.err{color:var(--danger)}

/* vehicle multi-field form grid */
.formgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem 1rem}
.formgrid .field{margin-bottom:.2rem}
.formgrid input{padding:.55rem .7rem;font-size:.95rem}

/* clear action buttons */
.actions{display:flex;gap:.4rem;flex-wrap:wrap}
.btn-sm{display:inline-block;border:0;border-radius:8px;padding:.4rem .8rem;font-size:.85rem;
  font-weight:700;cursor:pointer;text-decoration:none;color:#fff;line-height:1.2}
.btn-sm.edit{background:#2b6cb0}.btn-sm.edit:hover{background:#245a93}
.btn-sm.del{background:#d24b4b}.btn-sm.del:hover{background:#b53e3e}
.btn-sm.warn{background:#c98a14}.btn-sm.warn:hover{background:#a8740f}
.btn-sm.ok{background:#1f9d63}.btn-sm.ok:hover{background:#19844f}
/* admin toolbar (vehicle lookup) */
.toolbar{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;background:#f6f8fb;
  border:1px solid var(--line);border-radius:10px;padding:.6rem .8rem;margin-top:.8rem}
.toolbar .lbl{font-weight:700;color:var(--muted);font-size:.85rem}
.toolbar a.btn-sm{background:var(--accent)}.toolbar a.btn-sm:hover{background:var(--accent-d)}

/* ===== Vehicle solution theme ===== */
.veh{max-width:720px;margin:0 auto}
.veh-search{text-align:center}
.veh-hero{width:64px;height:64px;border-radius:18px;margin:.2rem auto .5rem;display:flex;align-items:center;justify-content:center;
  color:#fff;background:linear-gradient(135deg,#60a5fa,#4f46e5);box-shadow:0 10px 24px rgba(79,70,229,.35)}
.veh-search h2{font-size:1.5rem}
.veh-form{display:flex;gap:.5rem;max-width:480px;margin:1rem auto 0}
.veh-form input{flex:1;text-align:center;font-size:1.15rem;letter-spacing:.5px;padding:.8rem}
.veh-search .toolbar{justify-content:center;margin-top:1.2rem}
.small{font-size:.8rem}
/* results as clickable rows */
.result-list{display:flex;flex-direction:column;gap:.55rem;margin-top:.6rem}
.result-row{display:flex;align-items:center;gap:.6rem;background:#fff;border:1px solid var(--line);
  border-inline-start:4px solid var(--accent);border-radius:12px;padding:.8rem 1rem;color:var(--ink);transition:.15s}
.result-row:hover{box-shadow:0 8px 22px rgba(20,30,50,.10);transform:translateY(-2px);border-inline-start-color:var(--accent-d)}
.rr-fields{flex:1;display:flex;flex-wrap:wrap;gap:.3rem .9rem}
.rr-f{font-size:.95rem;font-weight:600;color:var(--ink)}
.rr-f i{font-style:normal;font-weight:600;color:#8a98a8;font-size:.72rem;display:block;margin-bottom:1px}
.rr-go{font-size:1.6rem;color:var(--accent);font-weight:700}
/* detail */
.veh-detail .detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;
  border-bottom:1px solid var(--line);padding-bottom:1rem;margin-bottom:.4rem}
.bignum{font-size:2.2rem;font-weight:900;margin:.1rem 0;color:var(--ink);letter-spacing:.5px}
.detail-actions{display:flex;flex-direction:column;gap:.4rem}
.veh-detail .kv th{width:42%}
@media(max-width:520px){.detail-head{flex-direction:column}.detail-actions{flex-direction:row}}

/* advanced vehicle search */
.adv{margin-top:.9rem;border:1px solid var(--line);border-radius:12px;background:#fbfcfe}
.adv>summary{cursor:pointer;list-style:none;padding:.7rem 1rem;font-weight:700;color:var(--accent-d);
  display:flex;align-items:center;gap:.4rem}
.adv>summary::-webkit-details-marker{display:none}
.adv[open]>summary{border-bottom:1px solid var(--line)}
.adv-form{padding:1rem}
.adv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}
.adv-foot{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:.8rem}
.seg.match{max-width:240px}

/* ===== Manager.io dashboard module ===== */
.tile-ico.ti-manager{background:linear-gradient(135deg,#f5c842,#e0a800)}
.mgr-biz h3{display:flex;align-items:center;gap:.5rem;font-size:1.12rem}
.acc-row{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.55rem .1rem;border-bottom:1px solid var(--line)}
.acc-row:last-child{border-bottom:0}
.acc-name{font-weight:600}
.acc-bal{font-weight:800;color:var(--accent-d);white-space:nowrap}
.acc-bal.muted2{color:var(--muted);font-weight:600}
.cur-tot{display:flex;justify-content:space-between;font-weight:800;padding:.5rem .1rem;border-top:2px solid var(--line);margin-top:.2rem}
.cur-tot .big{font-size:1.3rem}
/* cash counter */
.cc-grid{width:100%}
.cc-grid th,.cc-grid td{padding:.55rem .5rem;border-bottom:1px solid var(--line);text-align:start}
.cc-grid input{width:120px;text-align:center}
.cc-foot td{font-size:1.2rem;font-weight:900;color:var(--accent-d);border-bottom:0;border-top:2px solid var(--line)}

/* ============================================================================
   EGF Accounting theme — overrides (navy #282973 / gray #545454, warm cream)
   Inspired by the Relief Center look: serif display headings, soft cards.
   ============================================================================ */
:root{
  --bg:#282973;             /* dark accent surfaces -> EGF navy */
  --ink:#23253a;            /* near-black, navy-tinted */
  --muted:#6b6c72;          /* EGF gray */
  --line:#e7e2d6;           /* warm hairline */
  --accent:#282973;         /* EGF navy (primary) */
  --accent-d:#1c1d57;       /* darker navy (hover) */
  --gold:#9a8c63;           /* muted bronze for subtle highlights */
  --danger:#c0453f; --ok:#2f7d4f;
  --shadow:0 1px 2px rgba(40,41,115,.05),0 10px 28px rgba(40,41,115,.07);
}
body{background:#f4f1ea;color:var(--ink)}

/* serif display headings; Arabic gracefully falls back to Cairo */
h1,h2,h3,.brand,.hero h1,.tile h3,.set-card h3{
  font-family:'Playfair Display','Cairo',Georgia,serif;letter-spacing:-.01em;
}

/* brand: EGF logo in the top bar */
.brand-dot{display:none}
.brand-logo{height:36px;width:auto;display:block;border-radius:6px}
.brand{gap:.6rem;color:var(--ink);font-weight:800}

/* warm chrome + cards */
.topbar{background:rgba(255,255,255,.92);border-bottom:1px solid var(--line)}
.tile,.set-card,.card{border:1px solid var(--line)}
.tile:hover{border-color:#d8d2c4}
.icon-btn{background:#f1efe8;border:1px solid var(--line)}
.icon-btn:hover{background:#e9e6dc}
.pill{background:#ecebf3;color:var(--accent)}

/* auth screen: navy gradient + centered logo */
.auth-bg{background:linear-gradient(160deg,#1c1d57,#282973)}
.auth-logo{display:block;width:200px;max-width:70%;margin:0 auto .8rem}

/* EGF-branded tiles for the accounting + settings cards */
.tile-ico{box-shadow:0 8px 20px rgba(40,41,115,.18)}
.tile-ico.ti-manager{background:linear-gradient(135deg,#3a3c93,#282973)}
.tile-ico.ti-set{background:linear-gradient(135deg,#6f7076,#545454)}

/* ===== Manager.io settings — clean cards + modern icon actions ===== */
.ghost-sm{background:#fff;color:var(--ink);border:1px solid var(--line)}
.ghost-sm:hover{background:#f4f2ec}
.btn-sm .ico,.btn .ico{vertical-align:-3px;margin-inline-end:.25rem}

.biz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;margin:.4rem 0 1rem}
.biz-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.1rem 1.2rem}
.biz-head{display:flex;align-items:center;gap:.7rem}
.biz-ico{width:44px;height:44px;flex:none;border-radius:12px;display:flex;align-items:center;justify-content:center;
  color:#fff;background:linear-gradient(135deg,#3a3c93,#282973)}
.biz-id{min-width:0}
.biz-nm{display:block;font-weight:800;font-size:1.08rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.biz-host{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.biz-stats{display:flex;align-items:center;gap:.5rem;margin:.7rem 0;color:var(--muted);font-size:.9rem}
.biz-stats b{color:var(--ink)} .biz-stats .dot{opacity:.5}
.biz-actions{display:flex;gap:.4rem;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:.8rem}
.biz-actions form{margin:0}
.ico-act{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;
  background:#f3f1ea;border:1px solid var(--line);color:var(--ink);cursor:pointer;transition:.15s}
.ico-act:hover{background:#e9e6dc}
.ico-act.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.ico-act.primary:hover{background:var(--accent-d)}
.ico-act.danger{color:var(--danger)} .ico-act.danger:hover{background:#fdecec}

/* search field with leading icon */
.search-wrap{display:flex;align-items:center;gap:.5rem;background:#fbfaf6;border:1px solid var(--line);
  border-radius:11px;padding:.1rem .8rem;margin:.6rem 0 1rem}
.search-wrap .ico{color:var(--muted);flex:none}
.search-wrap input{border:0;background:transparent;padding:.65rem 0}
.search-wrap input:focus{outline:none}

/* account toggle list */
.acc-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.acc-item{display:flex;align-items:center;gap:.8rem;padding:.7rem .9rem;margin:0;border-bottom:1px solid var(--line);
  cursor:pointer;font-weight:500;transition:.12s}
.acc-item:last-child{border-bottom:0}
.acc-item:hover{background:#faf9f4}
.acc-item input{position:absolute;opacity:0;width:0;height:0}
.acc-tick{width:24px;height:24px;flex:none;border-radius:7px;border:1.5px solid #cfc9bb;background:#fff;
  display:flex;align-items:center;justify-content:center;color:#fff;transition:.12s}
.acc-tick .ico{opacity:0}
.acc-item input:checked + .acc-tick{background:var(--accent);border-color:var(--accent)}
.acc-item input:checked + .acc-tick .ico{opacity:1}
.acc-meta{flex:1;min-width:0}
.acc-nm{display:block;font-weight:700;color:var(--ink)}
.acc-sub{display:flex;gap:.35rem;margin-top:.15rem}
.acc-amt{font-weight:800;color:var(--accent);white-space:nowrap}
.tag{font-size:.72rem;font-weight:700;padding:.12rem .5rem;border-radius:999px;background:#eee9dd;color:#6b6c72}
.tag-cash{background:#e7f1ec;color:#2f7d4f} .tag-bank{background:#ecebf3;color:#3a3c93}

.empty-mini{text-align:center;padding:1.6rem;color:var(--muted)}
.empty-mini .ico{color:#cfc9bb;margin-bottom:.4rem}
.empty-mini form{margin-top:.8rem}

/* ===== Manager dashboard — collapsible business cards + comparison ===== */
.toolbar2{display:flex;gap:.5rem;margin:.9rem 0 .2rem}
details.mgr-biz{padding:0;overflow:hidden}
details.mgr-biz > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:.6rem;
  padding:1rem 1.2rem;font-weight:800;font-size:1.1rem}
details.mgr-biz > summary::-webkit-details-marker{display:none}
.biz-sum-name{display:flex;align-items:center;gap:.45rem;font-family:'Playfair Display','Cairo',serif}
.biz-sum-name .ico{color:var(--accent)}
.chev{display:inline-flex;color:var(--muted);transition:transform .18s}
details[open] .chev{transform:rotate(180deg)}
.biz-sum-tot{margin-inline-start:auto;display:flex;gap:.7rem;flex-wrap:wrap;justify-content:flex-end}
.mini-tot{font-size:.95rem;font-weight:800;color:var(--accent)}
.mini-tot small{font-weight:600;color:var(--muted)}
.biz-body{padding:0 1.2rem 1.1rem;border-top:1px solid var(--line)}
.biz-body .acc-row:first-child{padding-top:.8rem}

/* comparison panel */
.cmp-pick{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin:.4rem 0 1rem}
.cmp-pick select{flex:1;min-width:140px}
.cmp-vs{color:var(--muted);font-weight:700}
.cmp-tbl{width:100%;border-collapse:collapse}
.cmp-tbl th,.cmp-tbl td{padding:.6rem .5rem;border-bottom:1px solid var(--line);text-align:start}
.cmp-tbl thead th{font-size:.82rem;color:var(--muted);font-weight:700}
.cmp-tbl thead th:nth-child(n+2){text-align:end}
.cmp-tbl .num{text-align:end;font-weight:700;white-space:nowrap}
.cmp-cur{font-weight:800}
.cmp-d.pos{color:var(--ok)} .cmp-d.neg{color:var(--danger)}