/* قائمة حساب المستفيد والإشعارات في الهيدر */
.hdr-actions{display:flex;align-items:center;gap:10px}
.acct{display:flex;align-items:center;gap:6px;position:relative}
.acct a{font-family:inherit;font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap;border-radius:999px;padding:9px 16px;transition:background .15s,color .15s}
.acct .acct-login{color:var(--text,#14303c)}
.acct .acct-login:hover{color:var(--blue,#0b6b90);background:#eef5f8}
.acct .acct-signup{background:var(--blue,#0b6b90);color:#fff;box-shadow:0 4px 12px rgba(11,107,144,.18)}
.acct .acct-signup:hover{background:var(--blue-deep,#07455e)}
.acct-icon{display:none;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line,#dce6eb);color:var(--blue,#0b6b90);place-items:center;text-decoration:none}
.qm-btn{position:relative;display:inline-flex;align-items:center;gap:8px;height:42px;border:1.5px solid var(--line,#dce6eb);background:#fff;border-radius:999px;cursor:pointer;font-family:inherit;color:var(--text,#14303c);transition:border-color .15s,box-shadow .15s}
.qm-btn:hover,.qm-btn[aria-expanded="true"]{border-color:var(--blue,#0b6b90);box-shadow:0 0 0 3px rgba(11,107,144,.10)}
.qm-bell{width:42px;justify-content:center;padding:0}
.qm-bell svg{width:20px;height:20px}
.qm-badge{position:absolute;top:-4px;left:-4px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#d93025;color:#fff;font-size:11px;font-weight:800;line-height:19px;text-align:center;border:2px solid #fff}
.qm-user{padding:3px 4px 3px 12px}
.qm-av{width:32px;height:32px;border-radius:50%;background:var(--gold,#e0b224);color:#1d2b33;display:inline-grid;place-items:center;font-weight:800;font-size:14px;flex:0 0 auto}
.qm-name{font-size:14px;font-weight:700;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qm-user svg{width:14px;height:14px;opacity:.6}
.qm-pop{position:absolute;top:calc(100% + 10px);left:0;width:340px;max-width:calc(100vw - 24px);background:#fff;border:1px solid var(--line,#dce6eb);border-radius:16px;box-shadow:0 18px 50px rgba(7,69,94,.18);z-index:1000;overflow:hidden;text-align:right;direction:rtl;animation:qmIn .14s ease-out}
@keyframes qmIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.qm-pop[hidden]{display:none}
.qm-me{display:flex;align-items:center;gap:12px;padding:18px 18px 14px;border-bottom:1px solid var(--line,#dce6eb)}
.qm-me .qm-av{width:46px;height:46px;font-size:18px}
.qm-me b{display:block;font-size:15.5px;color:var(--text,#14303c)}
.qm-me span{display:block;font-size:13px;color:var(--muted,#5a7280);direction:ltr;text-align:right;overflow:hidden;text-overflow:ellipsis}
.qm-menu{padding:8px}
.qm-menu a,.qm-menu button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 12px;border:0;background:none;border-radius:10px;font-family:inherit;font-size:14.5px;font-weight:600;color:var(--text,#14303c);text-decoration:none;cursor:pointer;text-align:right}
.qm-menu a:hover,.qm-menu button:hover{background:#f1f7fa;color:var(--blue,#0b6b90)}
.qm-menu svg{width:19px;height:19px;flex:0 0 19px;stroke:currentColor}
.qm-menu .qm-c{margin-inline-start:auto;background:#d93025;color:#fff;border-radius:999px;font-size:11px;font-weight:800;padding:1px 8px}
.qm-sep{height:1px;background:var(--line,#dce6eb);margin:6px 8px}
.qm-menu .qm-out{color:#b3261e}
.qm-menu .qm-out:hover{background:#fdeceb;color:#b3261e}
.qm-nh{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line,#dce6eb)}
.qm-nh b{font-size:15.5px;color:var(--text,#14303c)}
.qm-nh button{border:0;background:none;color:var(--blue,#0b6b90);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer}
.qm-list{max-height:380px;overflow-y:auto;overflow-x:hidden}
.qm-n{display:flex;white-space:normal;gap:12px;padding:13px 16px;border-bottom:1px solid #eef2f5;text-decoration:none;color:inherit;cursor:pointer;position:relative}
.qm-n:hover{background:#f6fafc}
.qm-n.un{background:#f2f8fb}
.qm-n.un:before{content:"";position:absolute;right:6px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--blue,#0b6b90)}
.qm-ni{flex:0 0 36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#eaf3f7;color:var(--blue,#0b6b90)}
.qm-ni.voucher{background:#fbf1d2;color:#8a6500}
.qm-ni.order{background:#e3f4ea;color:#0e7a45}
.qm-ni svg{width:18px;height:18px}
.qm-nt{flex:1 1 auto;min-width:0;white-space:normal;overflow-wrap:anywhere}
.qm-nt b{display:block;font-size:14px;color:var(--text,#14303c);line-height:1.5}
.qm-nt span{display:block;font-size:13px;color:var(--muted,#5a7280);line-height:1.6}
.qm-nt i{display:block;font-style:normal;font-size:12px;color:#93a3ad;margin-top:2px}
.qm-empty{padding:30px 16px;text-align:center;color:var(--muted,#5a7280);font-size:14px}
.qm-all{display:block;text-align:center;padding:12px;font-size:14px;font-weight:700;color:var(--blue,#0b6b90);text-decoration:none;background:#fafcfd}
.qm-all:hover{background:#f1f7fa}
@media (max-width:640px){
  .acct{display:none}.acct-icon{display:grid}
  .acct.qm-on{display:flex}.acct.qm-on~.acct-icon,.acct-icon.qm-hide{display:none}
  .qm-name,.qm-user svg{display:none}.qm-user{padding:3px}
  .qm-pop{position:fixed;top:72px;left:12px;right:12px;width:auto;max-width:none}
}
/* ===== إصلاحات العرض على الجوال (أُضيفت 10-10-2026) ===== */
/* حرف الصورة الرمزية في قائمة الحساب كان منزاحاً لأعلى اليمين */
.qm-me .qm-av{display:inline-grid;place-items:center;direction:rtl;text-align:center;flex:0 0 46px}
/* الشعار كان يتداخل مع أزرار الحساب في الشاشات الضيقة */
@media (max-width:640px){
.top .brand{min-width:0}
.top .brand .logo-link{display:block;max-width:100%}
.top .brand .logo-link img{display:block;width:100%!important;max-width:100%!important;height:auto!important;max-height:40px;object-fit:contain}
}
@media (max-width:400px){
.hdr-actions{gap:6px}
.acct{gap:4px}
.qm-btn{height:36px}
.qm-bell{width:36px}
.qm-bell svg{width:18px;height:18px}
.qm-av{width:28px;height:28px;font-size:13px}
}
/* صفحة حجز موعد الاختبار: قائمة الموقع في الجوال تستخدم الاسم .nav نفسه،
   فكانت أزرار التقويم تتحول إلى طبقة بيضاء تغطي الصفحة كلها في الشاشات حتى 1320px */
#qb .nav{position:static;inset:auto;z-index:auto;background:none;flex-direction:row;align-items:center;gap:6px;padding:0;box-shadow:none;border:0;overflow:visible;animation:none}
/* عنوان «حجز موعد الاختبار الدولي»: ذهبي على خلفية داكنة شفافة بدل الأصفر على الأبيض */
#qb .hero .kick{background:rgba(255,255,255,.1);border:1px solid rgba(255,229,138,.45);color:#ffe58a;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700;margin-bottom:8px;box-shadow:none}
#qb .hero .kick svg{stroke:#ffe58a}
#qb .hero h1{overflow-wrap:anywhere}
#qb .bar{flex-wrap:nowrap;margin-bottom:0}
#qb .bar .pick{flex:1 1 auto}
/* زر واتساب العائم كان يغطي زر «متابعة» في شريط الحجز السفلي */
body:has(#qb .bar) #wa{bottom:92px!important}
/* أيقونة واتساب في روابط التذييل كانت تطفو مثبتة أسفل الشاشة بدل أن تكون بجانب بقية الأيقونات */
a.soc.wa{position:static!important;inset:auto!important;animation:none!important}
@media (max-width:560px){
#qb .hero h1{font-size:20px}
#qb .chip{font-size:12.5px;padding:4px 10px}
#qb .steps{gap:4px;margin:16px 0 12px}
#qb .steps li{padding:8px 6px;gap:6px}
#qb .bar .pick b{font-size:13.5px}
#qb .bar .acts .btn{padding:11px 14px}
#qb .refbox{flex-wrap:wrap;justify-content:center}
#qb .notes{padding:12px 14px}
#qb .hero .hx{flex-direction:column;gap:10px}
#qb .hero .hx>.logo{width:52px;height:52px;font-size:13px;border-radius:14px}
#qb .hero .hx>div{width:100%}
}
@media (max-width:400px){
#qb .wd div{font-size:10px;letter-spacing:-.2px}
#qb .bar{gap:8px;padding:8px 10px}
#qb .bar .acts{gap:6px}
#qb .bar .acts .btn{padding:10px 12px;font-size:14px}
#qb .bar .pick b{font-size:12.5px}
#qb .bar .pick small{font-size:11.5px}
}