/* ════════════════════════════════════════════════════════════════════════════════════════════════
   base.css — إعادة الضبط والعناصر الأساسية. كل لون هنا من tokens.css — صفر قيم حرفية.
   ════════════════════════════════════════════════════════════════════════════════════════════════ */

*{box-sizing:border-box}
html,body{margin:0}
html{color-scheme:light dark}
body{
  font-family:var(--font); background:var(--bg); color:var(--tx);
  font-size:var(--fz-m); -webkit-font-smoothing:antialiased;
}
::selection{background:var(--sel)}

/* ⚠️ الإتاحة: قبل 2026-09-04 ما كانش فيه ولا حالة تركيز واحدة في اللوحة كلها، يعني التنقّل
   بالكيبورد كان أعمى تمامًا. القاعدة دي بتغطي كل عنصر تفاعلي مرة واحدة. */
:focus-visible{outline:2.5px solid var(--p); outline-offset:2px; border-radius:var(--r1)}
:focus:not(:focus-visible){outline:none}

input,textarea,select{
  width:100%; background:var(--field); border:1.5px solid transparent; color:var(--tx);
  border-radius:var(--r2); padding:var(--s4) var(--s5); font-size:var(--fz-m); font-family:inherit;
  transition:border-color var(--dur), background var(--dur);
}
input::placeholder,textarea::placeholder{color:var(--faint)}
input:focus,textarea:focus,select:focus{border-color:var(--p); background:var(--card)}
select{cursor:pointer}
label{display:block; font-size:var(--fz-sm); font-weight:700; color:var(--mut); margin:var(--s5) 0 var(--s1)}

button{
  cursor:pointer; border:0; border-radius:var(--r3); padding:var(--s4) var(--s7);
  font-weight:800; font-size:var(--fz-b); font-family:inherit; color:var(--tx);
  background:var(--field);
  transition:transform .12s, box-shadow .12s, opacity var(--dur), background var(--dur);
}
button:hover:not(:disabled){transform:translateY(-1px)}
button:disabled{opacity:.45; cursor:default; transform:none}

img{max-width:100%}
a{color:var(--p)}

/* الكتابة العربية بتفضل عربية حتى وسط أرقام لاتينية */
[dir=rtl] .num{direction:ltr; display:inline-block; unicode-bidi:isolate}
.tnum{font-variant-numeric:tabular-nums}

.hidden{display:none!important}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  button:hover:not(:disabled){transform:none}
}