/* ══════════════════════════════════════════════════════════
   يشير — Design System (base)
   الألوان: برتقالي الإشارة · كحلي حبري · كريمي
   قاعدة التباين: النص فوق البرتقالي دائمًا كحلي (6.5:1) — لا أبيض.
   ══════════════════════════════════════════════════════════ */
@font-face{font-family:"Alexandria";src:url(../fonts/alexandria.woff) format("woff");font-weight:100 900;font-display:swap}
@font-face{font-family:"Plex Arabic";src:url(../fonts/plex-arabic-regular.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Arabic";src:url(../fonts/plex-arabic-semibold.woff) format("woff");font-weight:600;font-display:swap}
@font-face{font-family:"Plex Arabic";src:url(../fonts/plex-arabic-bold.woff) format("woff");font-weight:700;font-display:swap}

:root{
  --orange:#FF5A1F; --orange-600:#E4470E; --orange-text:#C43D0A; --orange-50:#FFF1EA;
  --navy:#14142B; --navy-800:#1E1E3A; --cream:#FFF8F0; --gray:#8A8698;
  --ok:#0F7A4A; --ok-bg:#E7F6EE; --err:#B42318; --err-bg:#FDECEA; --info:#1D4ED8; --info-bg:#EAF1FF;

  --bg:#FAF7F2; --surface:#FFFFFF; --surface-2:#F6F2EC; --text:#14142B; --muted:#5E5A6E; --faint:#8A8698;
  --border:#ECE6DD; --border-strong:#DCD3C6; --ring:rgba(255,90,31,.45);
  --primary:var(--orange); --on-primary:var(--navy); --link:var(--orange-text);
  --shadow-sm:0 1px 2px rgba(20,20,43,.06); --shadow:0 6px 24px rgba(20,20,43,.08); --shadow-lg:0 18px 50px rgba(20,20,43,.14);
  --r-sm:10px; --r:14px; --r-lg:20px; --r-xl:28px;
  --font:"Plex Arabic",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
  --font-display:"Alexandria","Plex Arabic",system-ui,sans-serif;
  --brand-sq:var(--orange);
  color-scheme:light;
}
[data-theme="dark"]{
  --bg:#0E0E20; --surface:#17172E; --surface-2:#1F1F3A; --text:#F4F2FA; --muted:#B1AEC4; --faint:#8F8CA6;
  --border:#2A2A48; --border-strong:#3A3A5E; --link:#FF8A5B;
  --ok:#4ADE80; --ok-bg:rgba(74,222,128,.12); --err:#F87171; --err-bg:rgba(248,113,113,.12); --info:#93B4FF; --info-bg:rgba(147,180,255,.12);
  --shadow:0 6px 24px rgba(0,0,0,.35); --shadow-lg:0 18px 50px rgba(0,0,0,.45);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:15px;line-height:1.7;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overflow-wrap:anywhere}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.35;margin:0 0 .5em;font-weight:700;letter-spacing:-.01em}
p{margin:0 0 1em}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
img,svg{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:6px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:999;background:var(--navy);color:#fff;padding:10px 16px;border-radius:10px}
.skip:focus{top:12px}
.ltr{direction:ltr;unicode-bidi:isolate}
.muted{color:var(--muted)} .small{font-size:13px}
.hidden{display:none!important}

/* ── الأزرار ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;border-radius:var(--r);border:1.5px solid transparent;
  font-weight:600;font-size:15px;line-height:1.2;cursor:pointer;text-decoration:none!important;transition:background .15s,border-color .15s,transform .1s,box-shadow .15s;white-space:nowrap;user-select:none}
.btn:active{transform:translateY(1px)}
.btn[disabled],.btn.is-loading{opacity:.6;pointer-events:none}
.btn-primary{background:var(--primary);color:var(--on-primary)}
.btn-primary:hover{background:var(--orange-600)}
.btn-dark{background:var(--navy);color:#fff}
[data-theme="dark"] .btn-dark{background:#F4F2FA;color:var(--navy)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--border-strong)}
.btn-ghost:hover{background:var(--surface-2)}
.btn-danger{background:transparent;color:var(--err);border-color:currentColor}
.btn-danger:hover{background:var(--err-bg)}
.btn-sm{min-height:36px;padding:6px 12px;font-size:14px;border-radius:var(--r-sm)}
.btn-lg{min-height:52px;padding:12px 26px;font-size:16px}
.btn-block{width:100%}
.btn-icon{min-height:40px;width:40px;padding:0;border-radius:12px}

/* ── النماذج ── */
.field{margin-bottom:16px}
.field>label,.label{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.hint{display:block;font-size:13px;color:var(--muted);margin-top:6px}
.input,.select,.textarea{width:100%;min-height:46px;padding:10px 14px;background:var(--surface);border:1.5px solid var(--border-strong);border-radius:var(--r-sm);
  transition:border-color .15s,box-shadow .15s;font-size:16px}
.textarea{min-height:110px;resize:vertical;line-height:1.7}
.input:hover,.select:hover,.textarea:hover{border-color:var(--gray)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 4px var(--ring)}
.input[aria-invalid="true"]{border-color:var(--err)}
.input-group{display:flex;align-items:stretch;direction:ltr}
.input-group .addon{display:flex;align-items:center;padding:0 12px;background:var(--surface-2);border:1.5px solid var(--border-strong);border-inline-end:0;border-radius:var(--r-sm) 0 0 var(--r-sm);color:var(--muted);font-size:14px;white-space:nowrap}
.input-group .input{border-radius:0 var(--r-sm) var(--r-sm) 0;direction:ltr;text-align:left}
.field-error{color:var(--err);font-size:13px;margin-top:6px}
.check{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}
.check input{width:20px;height:20px;accent-color:var(--orange)}
.row{display:grid;gap:16px}
@media(min-width:640px){.row-2{grid-template-columns:1fr 1fr}}

/* ── مفتاح تشغيل ── */
.switch{position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer;flex-shrink:0}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.field>.switch{display:inline-flex;margin:0}
.switch .track{display:block;width:46px;height:26px;border-radius:99px;background:var(--border-strong);position:relative;transition:background .2s;flex-shrink:0}
.switch .track::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.switch input:checked+.track{background:var(--orange)}
.switch input:checked+.track::after{transform:translateX(-20px)}
[dir="ltr"] .switch input:checked+.track::after{transform:translateX(20px)}
.switch input:focus-visible+.track{outline:3px solid var(--ring);outline-offset:2px}

/* ── تنبيهات ── */
.alert{padding:12px 16px;border-radius:var(--r-sm);margin-bottom:16px;font-size:14px;border:1px solid transparent}
.alert-ok{background:var(--ok-bg);color:var(--ok);border-color:color-mix(in srgb,var(--ok) 25%,transparent)}
.alert-err{background:var(--err-bg);color:var(--err);border-color:color-mix(in srgb,var(--err) 25%,transparent)}
.alert-info{background:var(--info-bg);color:var(--info);border-color:color-mix(in srgb,var(--info) 25%,transparent)}

/* ── بطاقات + شارات ── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow-sm)}
.card-title{font-size:17px;margin-bottom:4px;display:flex;align-items:center;gap:8px}
.badge{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:600;background:var(--surface-2);color:var(--muted)}
.badge-ok{background:var(--ok-bg);color:var(--ok)} .badge-err{background:var(--err-bg);color:var(--err)} .badge-brand{background:var(--orange-50);color:var(--orange-text)}
[data-theme="dark"] .badge-brand{background:rgba(255,90,31,.15);color:#FF8A5B}

/* ── Toast ── */
.toasts{position:fixed;bottom:88px;inset-inline-start:50%;transform:translateX(50%);z-index:1000;display:grid;gap:8px;width:min(92vw,380px);pointer-events:none}
.toast{background:var(--navy);color:#fff;padding:12px 16px;border-radius:12px;box-shadow:var(--shadow-lg);font-size:14px;display:flex;gap:10px;align-items:center;animation:toast-in .25s ease;pointer-events:auto}
.toast.is-err{background:#8F1D14}
.toast svg{flex-shrink:0}
@keyframes toast-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(min-width:1024px){.toasts{bottom:24px}}

.logo-mark{display:block;height:auto}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}