/* تنسيق مشترك لصفحات الحساب ولوحة الإدارة — هوية وزارة التعليم */
@font-face{font-family:"Plex Ar";src:url(/fonts/plex-ar-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Ar";src:url(/fonts/plex-ar-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Plex Ar";src:url(/fonts/plex-ar-700.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--navy:#15445a;--green:#07a869;--teal:#0da9a6;--blue:#3d7eb9;--sand:#c1b489;--violet:#7258a4;--steel:#3078a6;--cerulean:#218caa;--red:#c0392b;
--bg:#f3f6f7;--surface:#fff;--raised:#f7f9fa;--text:#1f3d4b;--muted:#4d6672;--line:#d9dee0;--ring:#0da9a6;--head:#15445a}
@media (prefers-color-scheme:dark){:root{--bg:#0d1f28;--surface:#132a35;--raised:#18323e;--text:#e3edf1;--muted:#a9bec7;--line:#24414e;--head:#cfe6ee}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.7 "Helvetica Neue W23 for SKY","Plex Ar",system-ui,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
:focus-visible{outline:3px solid var(--ring);outline-offset:3px;border-radius:6px}
.skip{position:absolute;inset-inline-start:12px;top:-60px;background:var(--surface);padding:8px 14px;border-radius:8px;z-index:9}.skip:focus{top:12px}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px;width:100%}
header.top{background:var(--navy);color:#fff}
header.top .wrap{display:flex;align-items:center;gap:14px;min-height:70px}
header.top img{height:42px;width:auto}
header.top .sep{width:1px;height:34px;background:rgba(255,255,255,.35)}
header.top .brand{text-decoration:none}
header.top .brand b{display:block;font-size:17px}
header.top .brand span{font-size:12.5px;opacity:.85}
header.top nav{margin-inline-start:auto;display:flex;gap:6px;align-items:center}
header.top nav a,header.top nav button{color:#fff;background:none;border:0;font:inherit;font-size:14.5px;text-decoration:none;padding:8px 14px;border-radius:999px;cursor:pointer}
header.top nav a:hover,header.top nav button:hover{background:rgba(255,255,255,.12)}
main{flex:1;padding:32px 0 56px}
footer{color:var(--muted);font-size:13.5px;text-align:center;padding:0 0 28px}
footer .bar{height:6px;background:linear-gradient(90deg,var(--green),var(--teal),var(--blue),var(--sand),var(--violet));margin-bottom:18px}
h1{font-size:clamp(22px,3vw,28px);margin:0 0 6px;color:var(--head)}
h2{font-size:20px;margin:0 0 10px;color:var(--head)}
.muted{color:var(--muted)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:12px;font:inherit;font-weight:700;font-size:15px;text-decoration:none;border:2px solid transparent;cursor:pointer;background:var(--navy);color:#fff}
.btn.green{background:var(--green)}
.btn.outline{background:transparent;border-color:var(--line);color:var(--text)}
.btn.small{padding:6px 12px;font-size:13.5px;border-radius:9px}
.btn.danger{background:transparent;color:var(--red);border-color:color-mix(in srgb,var(--red) 40%,transparent)}
.btn:disabled{opacity:.6;cursor:wait}
label{display:block;font-weight:500;font-size:14.5px;margin:12px 0 6px}
input,select,textarea{width:100%;font:inherit;color:var(--text);background:var(--raised);border:1.5px solid var(--line);border-radius:12px;padding:11px 14px}
input:focus,select:focus,textarea:focus{border-color:var(--teal);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--teal) 25%,transparent)}
input.ltr{direction:ltr;text-align:right}
.hint{font-size:13px;color:var(--muted);margin-top:4px}
.err{color:var(--red);font-size:14px;min-height:1.4em;margin:8px 0 0}
.tabs{display:flex;background:var(--raised);border-radius:12px;padding:4px;gap:4px;margin-bottom:6px}
.tabs button{flex:1;border:0;background:none;font:inherit;font-weight:700;padding:9px;border-radius:9px;cursor:pointer;color:var(--muted)}
.tabs button[aria-selected=true]{background:var(--surface);color:var(--head);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.auth{max-width:440px;margin:0 auto}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--navy);color:#fff;padding:11px 20px;border-radius:12px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:50;max-width:90vw}
.toast.on{opacity:1}
.loading{display:grid;place-items:center;min-height:40vh;color:var(--muted)}
.num{direction:ltr;unicode-bidi:isolate;display:inline-block}
.pill{display:inline-block;white-space:nowrap;font-size:12.5px;font-weight:700;padding:2px 10px;border-radius:999px;background:var(--raised);border:1px solid var(--line)}
.pill.ok{background:#e1f6ee;color:#05774b;border-color:transparent}
.pill.off{background:#fdecea;color:#a3271b;border-color:transparent}
.pill.soon{background:#f3efe2;color:#7a6a36;border-color:transparent}
@media (prefers-color-scheme:dark){.pill.ok{background:#0f3b2c;color:#7fe3c4}.pill.off{background:#3e1d1a;color:#f5b1a8}.pill.soon{background:#3a3424;color:#e6d9ae}}
dialog{border:0;border-radius:22px;padding:0;max-width:min(720px,94vw);width:100%;background:var(--surface);color:var(--text);box-shadow:0 30px 80px rgba(0,0,0,.35)}
dialog::backdrop{background:rgba(9,30,40,.55);backdrop-filter:blur(3px)}
@media (max-width:640px){header.top .brand span{display:none}main{padding-top:22px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;inset-inline-start:0;top:0}
@media (max-width:640px){header.top nav a[href="/"]{display:none}header.top .brand b{font-size:15px}}
