/* ============================================================
   لوحة تحكم شركة السجوان — نظام موحّد يُلوَّن عبر متغيّرات --brand
   التي يحقنها layout.php من admin/inc/site.php (كحلي + كهرماني).
   القيم أدناه احتياطية فقط إن غاب الحقن.
   ============================================================ */
:root{
  --brand:#F0A830;
  --brand-ink:#1B3A5C;
  --brand-2:#C67F14;
  --brand-glow:rgba(240,168,48,.18);
  --brand-area:rgba(240,168,48,.12);
  --sidebar-bg:#1B3A5C;

  --bg:#F6F7FA;
  --surface:#FFFFFF;
  --ink:#16233A;
  --muted:#64748B;
  --line:#E5EAF1;
  --line-2:#EFF3F8;
  --sidebar:var(--sidebar-bg);
  --shadow:0 1px 3px rgba(16,35,58,.05),0 8px 24px rgba(16,35,58,.05);
  --r:14px;
  --new:#2563EB;--prog:#D97706;--cont:#16A34A;--closed:#94A3B8;
  --up:#15803D;--down:#B91C1C;
  --font:'Noto Kufi Arabic',system-ui,Tahoma,sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);background:var(--bg);color:var(--ink);line-height:1.7;font-size:15px;direction:rtl}
a{color:var(--brand-ink);text-decoration:none}
svg{display:block;flex:none}
:focus-visible{outline:2.5px solid var(--brand);outline-offset:2px;border-radius:6px}

/* ---------------------------------------------------- تسجيل الدخول */
.login-body{
  display:grid;place-items:center;min-height:100vh;padding:24px;
  background:radial-gradient(900px 460px at 78% -12%,var(--brand-glow),transparent 62%),var(--brand-ink);
}
.login-card{background:var(--surface);border-radius:20px;padding:44px 38px;width:min(410px,94vw);box-shadow:0 30px 70px rgba(0,0,0,.34);text-align:center}
.login-logo{width:64px;height:64px;border-radius:17px;background:var(--brand-ink);color:var(--brand);display:grid;place-items:center;font-weight:800;font-size:1.3rem;margin:0 auto 18px}
.login-mark{height:56px;width:auto;margin:0 auto 22px;display:block}
.login-foot{margin-top:22px;font-size:.83rem}
.login-foot a{color:var(--muted)}
.login-foot a:hover{color:var(--brand-ink)}
.login-card h1{font-size:1.18rem;margin-bottom:4px}
.login-sub{color:var(--muted);font-size:.85rem;margin-bottom:24px;direction:ltr}
.login-card form{text-align:right}
.login-card label{display:block;font-size:.85rem;color:var(--muted);margin:14px 0 6px}
.login-card input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff;min-height:48px}
.login-card input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}

/* ---------------------------------------------------------- الهيكل */
.admin-shell{display:grid;grid-template-columns:252px 1fr;min-height:100vh}
.sidebar{background:var(--sidebar);color:#B9C6D6;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;padding:22px 15px}
.side-brand{display:flex;align-items:center;gap:12px;padding:6px 8px 20px;border-bottom:1px solid rgba(255,255,255,.09);margin-bottom:16px}
.side-logo{width:42px;height:42px;border-radius:12px;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.side-name{font-weight:700;color:#fff;font-size:.97rem;line-height:1.4}
.side-nav{display:flex;flex-direction:column;gap:3px;flex:1}
.side-nav a{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:10px;color:#B9C6D6;font-weight:500;font-size:.93rem;transition:background .18s,color .18s;min-height:44px}
.side-nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.side-nav a.on{background:var(--brand);color:var(--brand-ink);font-weight:700}
.side-nav .pill{margin-inline-start:auto;background:#EF4444;color:#fff;font-size:.72rem;font-weight:700;min-width:21px;height:21px;border-radius:11px;display:grid;place-items:center;padding:0 6px}
.side-ext{margin-top:8px;border-top:1px solid rgba(255,255,255,.09);padding-top:14px!important}
.side-logout{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:10px;color:#93A3B8;font-size:.91rem;margin-top:6px;min-height:44px}
.side-logout:hover{background:rgba(239,68,68,.16);color:#FCA5A5}
.side-toggle{display:none;position:fixed;top:13px;inset-inline-start:13px;z-index:60;background:var(--sidebar);color:#fff;border:0;width:46px;height:46px;border-radius:12px;cursor:pointer;place-items:center}
.side-scrim{display:none}

.admin-main{display:flex;flex-direction:column;min-width:0}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 30px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.page-title{font-size:1.14rem;font-weight:700;line-height:1.4}
.page-sub{font-size:.82rem;color:var(--muted);line-height:1.5}
.topbar-user{display:flex;align-items:center;gap:11px;flex:none}
.avatar{width:40px;height:40px;border-radius:50%;background:var(--brand-ink);color:var(--brand);display:grid;place-items:center;font-weight:700;flex:none}
.u-meta b{display:block;font-size:.89rem}.u-meta small{color:var(--muted);font-size:.77rem}
.admin-content{padding:26px 30px 48px;max-width:1280px;width:100%}

/* ---------------------------------------------------------- تنبيهات */
.flash{padding:13px 18px;border-radius:11px;margin-bottom:18px;font-size:.92rem;font-weight:500}
.flash-success{background:#ECFDF5;color:#065F46;border:1px solid #A7F3D0}
.flash-error{background:#FEF2F2;color:#991B1B;border:1px solid #FECACA}

/* ------------------------------------------------------ بطاقات KPI */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:22px}
.kpi-grid--3{grid-template-columns:repeat(3,1fr)}
.kpi-grid--4{grid-template-columns:repeat(4,1fr)}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:134px}
.kpi-ic{color:var(--brand-2);opacity:.95}
.kpi b{display:block;font-size:1.85rem;font-weight:800;line-height:1.2;margin-top:8px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kpi-lbl{color:var(--muted);font-size:.81rem;line-height:1.5}
.kpi-extra{margin-top:auto;padding-top:9px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:.75rem;color:var(--muted)}
.kpi-extra small{color:var(--muted);font-size:.72rem}
.kpi-link{font-size:.79rem;font-weight:700;color:#fff;opacity:.95}
.kpi-link:hover{text-decoration:underline;text-underline-offset:3px}
.kpi-accent{background:linear-gradient(140deg,var(--brand-ink),#24507D);color:#fff;border-color:transparent}
.kpi-accent b{color:#fff}
.kpi-accent .kpi-lbl{color:rgba(255,255,255,.78)}
.kpi-accent .kpi-ic{color:var(--brand)}

.chg{font-weight:700;font-size:.75rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.chg-up{color:var(--up)}
.chg-down{color:var(--down)}
.chg-flat{color:var(--muted)}

/* ---------------------------------------------------------- ألواح */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);margin-bottom:22px}
.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:12px;flex-wrap:wrap}
.panel-head h2{font-size:1.01rem;font-weight:700}
.panel--note{background:#FBFCFE}
.panel--note h2{font-size:.95rem;margin-bottom:8px}
.sub-h{font-size:.82rem;font-weight:700;color:var(--muted);margin:20px 0 11px;padding-top:14px;border-top:1px solid var(--line-2)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.lnk{color:var(--brand-2);font-size:.84rem;font-weight:700}
.lnk:hover{text-decoration:underline;text-underline-offset:3px}
.empty{color:var(--muted);text-align:center;padding:34px 18px;font-size:.9rem;line-height:1.9;background:var(--bg);border-radius:11px}

/* --------------------------------------------------------- المخطط */
/* المخطط بيانات لاتينية (تواريخ وأرقام): نثبّت اتجاهه LTR وإلا انقلب معنى
   text-anchor داخل صفحة RTL فخرجت تسميات المحاور عن حدود اللوحة. */
.chart{width:100%;height:auto;direction:ltr}
.chart .grid{stroke:var(--line-2);stroke-width:1}
.chart .area{fill:var(--brand-area)}
.chart .ln{fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.chart .ln-v{stroke:var(--brand-2)}
.chart .ln-u{stroke:var(--brand-ink);stroke-dasharray:4 4;stroke-width:1.7;opacity:.6}
.chart .bar-req{fill:var(--brand-ink);opacity:.22}
.chart .bar-req:hover{opacity:.5}
.chart .pt{fill:transparent;stroke:none;cursor:crosshair}
.chart .pt:hover{fill:var(--brand);fill-opacity:.3}
.chart .cap{fill:var(--muted);font-size:11px;font-family:var(--font)}
.legend{display:flex;gap:14px;font-size:.78rem;color:var(--muted);flex-wrap:wrap}
.lg::before{content:"";display:inline-block;width:13px;height:3px;border-radius:2px;margin-inline-end:6px;vertical-align:middle}
.lg-v::before{background:var(--brand-2)}
.lg-u::before{background:var(--brand-ink);opacity:.6}
.lg-r::before{background:var(--brand-ink);opacity:.28;height:9px;width:7px;border-radius:2px}

/* ---------------------------------------------------------- أشرطة */
.bars{display:flex;flex-direction:column;gap:11px}
.bar-row{display:grid;grid-template-columns:minmax(0,1.1fr) 1.9fr auto;align-items:center;gap:12px}
.bar-lbl{font-size:.85rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:start}
.bar-track{background:var(--line-2);height:9px;border-radius:6px;overflow:hidden}
.bar-fill{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-2));border-radius:6px}
.bar-val{font-weight:700;font-size:.85rem;min-width:30px;text-align:end;font-variant-numeric:tabular-nums}

/* ------------------------------------------------- الحلقة والحالات */
.donut-wrap{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.donut{width:168px;height:168px;flex:none}
.donut-track{fill:none;stroke:var(--line-2);stroke-width:4.2}
.donut-seg{fill:none;stroke-width:4.2;transition:stroke-width .2s}
.donut-seg:hover{stroke-width:5.4}
.donut-mid,.donut-sub{text-anchor:middle;fill:var(--ink);font-family:var(--font)}
.donut-mid{font-size:7px;font-weight:800}
.donut-sub{font-size:3.1px;fill:var(--muted)}
.statlist{display:flex;flex-direction:column;gap:6px;flex:1;min-width:200px}
.statline{display:flex;align-items:center;gap:9px;font-size:.89rem;color:var(--ink);padding:6px 9px;border-radius:8px;min-height:38px}
.statline:hover{background:var(--bg)}
.statline b{margin-inline-start:auto;font-weight:700;font-variant-numeric:tabular-nums}
.dot{width:11px;height:11px;border-radius:50%;flex:none}
.d-new{background:var(--new)}.d-prog{background:var(--prog)}.d-cont{background:var(--cont)}.d-closed{background:var(--closed)}
.conv-inline{margin-top:8px;padding:13px 15px;background:var(--bg);border-radius:11px}
.conv-inline b{display:block;font-size:1.5rem;font-weight:800;color:var(--brand-ink);line-height:1.2;font-variant-numeric:tabular-nums}
.conv-inline span{font-size:.74rem;color:var(--muted);line-height:1.6;display:block}

/* --------------------------------------------------------- جداول */
.table-scroll{overflow-x:auto}
.data-table,.mini-table{width:100%;border-collapse:collapse;font-size:.89rem}
.data-table th{text-align:start;padding:11px 12px;color:var(--muted);font-weight:600;font-size:.79rem;border-bottom:2px solid var(--line);white-space:nowrap}
.data-table td{padding:12px;border-bottom:1px solid var(--line-2);vertical-align:middle}
.data-table tr:hover{background:var(--bg)}
.data-table a:hover{color:var(--brand-2)}
.mini-table td{padding:9px 4px;border-bottom:1px solid var(--line-2)}
.muted{color:var(--muted)}.sm{font-size:.81rem}

.badge{display:inline-block;padding:3px 11px;border-radius:999px;font-size:.75rem;font-weight:700;white-space:nowrap}
.b-new{background:#EFF6FF;color:#1D4ED8}
.b-in_progress{background:#FFFBEB;color:#B45309}
.b-contacted{background:#ECFDF5;color:#047857}
.b-closed{background:#F1F5F9;color:#475569}

/* --------------------------------------------------- نماذج وأزرار */
label{display:block;font-size:.85rem;color:var(--muted);margin:14px 0 6px;font-weight:500}
input,select,textarea{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff;min-height:46px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-glow)}
input:disabled{background:var(--bg);color:var(--muted)}
textarea{resize:vertical;min-height:120px}
.btn-primary{margin-top:18px;background:var(--brand-ink);color:#fff;border:0;padding:12px 26px;border-radius:10px;font:inherit;font-weight:700;cursor:pointer;transition:opacity .18s;min-height:48px;width:auto}
.btn-primary:hover{opacity:.9}
.btn-sm{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:9px;background:var(--brand-ink);color:#fff;font-size:.84rem;font-weight:600;border:0;cursor:pointer;min-height:42px;width:auto}
.btn-sm:hover{opacity:.92}
.btn-sm.btn-ghost{background:transparent;color:var(--brand-ink);border:1px solid var(--line)}
.btn-sm.btn-ghost:hover{background:var(--bg);border-color:var(--brand)}
.btn-xs{display:inline-block;padding:6px 13px;border-radius:8px;background:var(--bg);border:1px solid var(--line);font-size:.79rem;color:var(--ink);cursor:pointer;min-height:34px;width:auto}
.btn-xs:hover{background:#fff;border-color:var(--brand)}

.toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.search-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.search-form input{width:auto;min-width:250px}
.search-form select{width:auto;min-width:135px}
.range-tabs{display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:4px}
.range-tabs a{padding:8px 16px;border-radius:8px;font-size:.85rem;color:var(--muted);font-weight:600;min-height:38px;display:inline-flex;align-items:center}
.range-tabs a.on{background:var(--brand-ink);color:#fff}

.pager{display:flex;gap:5px;margin-top:18px;flex-wrap:wrap}
.pager a{padding:8px 13px;border:1px solid var(--line);border-radius:8px;font-size:.84rem;color:var(--ink);min-width:40px;text-align:center}
.pager a:hover{border-color:var(--brand)}
.pager a.on{background:var(--brand-ink);color:#fff;border-color:var(--brand-ink)}

/* ------------------------------------------------- صحّة النظام */
.checks{display:flex;flex-direction:column;gap:2px}
.check{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;
  padding:11px 12px;border-radius:9px;font-size:.88rem;
  border-inline-start:3px solid transparent;
}
.check:hover{background:var(--bg)}
.check-ok{border-inline-start-color:#16A34A}
.check-ok .check-ic{color:#16A34A}
.check-bad{border-inline-start-color:#D97706;background:#FFFBEB}
.check-bad .check-ic{color:#B45309}
.check-bad .check-v{color:#B45309;font-weight:700}
.check-l{color:var(--ink)}
.check-v{color:var(--muted);text-align:end;font-size:.84rem;direction:ltr;white-space:nowrap}
.logbox{
  background:#0F172A;color:#CBD5E1;border-radius:11px;padding:16px 18px;
  font-size:.78rem;line-height:1.75;overflow-x:auto;white-space:pre-wrap;word-break:break-word;
}
code{background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-size:.86em}

/* -------------------------------------------------- عرض طلب مفرد */
.kv{display:grid;grid-template-columns:1fr 1fr;gap:2px 22px}
.kv > div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-2)}
.kv dt{color:var(--muted);font-size:.84rem;flex:none}
.kv dd{font-weight:600;font-size:.87rem;text-align:end;min-width:0;overflow-wrap:anywhere}
.msg-box{margin-top:18px;background:var(--bg);border-radius:12px;padding:16px 18px;border-inline-start:3px solid var(--brand)}
.msg-lbl{font-size:.77rem;color:var(--muted);display:block;margin-bottom:6px}
.quick-actions{display:flex;gap:9px;margin-top:18px;flex-wrap:wrap}
.meta-foot{margin-top:16px;padding-top:12px;border-top:1px solid var(--line-2);color:var(--muted);font-size:.77rem;direction:ltr;text-align:left}

/* -------------------------------------------------------- الاستجابة */
@media(max-width:1100px){
  .kpi-grid,.kpi-grid--4{grid-template-columns:repeat(2,1fr)}
  .grid-2{grid-template-columns:1fr}
}
@media(max-width:820px){
  .admin-shell{grid-template-columns:1fr}
  .sidebar{position:fixed;inset-inline-start:-266px;z-index:50;transition:inset-inline-start .25s;width:252px}
  body.side-open .sidebar{inset-inline-start:0}
  body.side-open .side-scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:40}
  .side-toggle{display:grid}
  .topbar{padding-inline-start:72px;padding-block:13px}
  .admin-content{padding:18px 16px 40px}
  .kv{grid-template-columns:1fr}
  .kpi-grid--3{grid-template-columns:repeat(2,1fr)}
  .search-form input{min-width:0;flex:1 1 100%}
}
@media(max-width:520px){
  .kpi-grid,.kpi-grid--3,.kpi-grid--4{grid-template-columns:1fr}
  .donut{width:132px;height:132px}
  .bar-row{grid-template-columns:minmax(0,1fr) 1.2fr auto}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}