/* hrai — البحث المتمدد (2026-10-28) */
.hs{--hs-bg:#fff;--hs-ink:#111;--hs-mute:#8a8a8a;--hs-line:rgba(17,17,17,.08);--hs-hl:rgba(17,17,17,.05);--hs-soft:rgba(17,17,17,.05);position:relative}
html[data-theme="dark"] .hs{--hs-bg:#26272c;--hs-ink:#f2f2f2;--hs-mute:#8f8f8f;--hs-line:rgba(255,255,255,.1);--hs-hl:rgba(255,255,255,.07);--hs-soft:rgba(255,255,255,.07)}
.hs-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== الهيدر: زر يتحول لخانة ===== */
.hd-search{flex:none;width:36px;height:36px;z-index:3}
.hs-x .hs-shell{position:absolute;top:0;inset-inline-start:0;height:36px;width:36px;border-radius:999px;display:flex;align-items:center;overflow:hidden;background:transparent;
  transition:width .55s cubic-bezier(.3,1.22,.42,1),background .25s,box-shadow .25s}
.hs-x:not(.hs-open) .hs-shell:hover{background:var(--hd-hl,rgba(17,17,17,.055))}
.hs-x.hs-open .hs-shell{width:var(--hs-w,340px);background:var(--hs-bg);box-shadow:0 0 0 1px var(--hs-line),0 8px 24px -10px rgba(17,17,17,.25);transition:width .55s cubic-bezier(.3,1.22,.42,1),background .15s,box-shadow .25s}
.hs-trg{position:absolute;inset:0;z-index:2;border:0;background:transparent;cursor:pointer;border-radius:inherit}
.hs-open .hs-trg{display:none}
.hs-ic{flex:none;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;color:var(--hs-ink)}
.hs-ic svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.hs-in{flex:1;min-width:0;height:36px;border:0;outline:0;background:transparent;color:var(--hs-ink);font:600 13.5px/1 inherit;font-family:inherit;padding:0;opacity:0;transition:opacity .08s}
.hs-open .hs-in{opacity:1;transition:opacity .2s .08s}
.hs-in::placeholder{color:var(--hs-mute);font-weight:500}
.hs-clr{flex:none;width:30px;height:30px;margin-inline-end:3px;border:0;border-radius:50%;background:var(--hs-soft);color:var(--hs-ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transform:scale(.6);filter:blur(2px);pointer-events:none;transition:opacity .15s,transform .35s cubic-bezier(.3,1.4,.5,1),filter .15s}
.hs-clr svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.hs-open.hs-has .hs-clr{opacity:1;transform:none;filter:none;pointer-events:auto}
/* لما تنفتح، أزرار الطرف تختفي وراها بهدوء */
#navbar-wrap .navbar-right-cell > :not(.hd-search){transition:opacity .2s}
#navbar-wrap .navbar-right-cell.hs-on > :not(.hd-search){opacity:0;pointer-events:none}
html[data-theme="dark"] .hs-x.hs-open .hs-shell{box-shadow:0 0 0 1px var(--hs-line),0 10px 28px -10px rgba(0,0,0,.6)}

/* ===== لوحة النتائج (للوضعين) ===== */
.hs-panel{position:absolute;z-index:30;top:calc(100% + 8px);inset-inline-start:0;width:var(--hs-w,340px);overflow:hidden;border-radius:18px;background:var(--hs-bg);
  box-shadow:0 0 0 1px var(--hs-line),0 24px 60px -18px rgba(17,17,17,.3);opacity:0;transform:translateY(-6px) scale(.985);transform-origin:top;
  transition:opacity .18s ease,transform .4s cubic-bezier(.3,1.2,.4,1),height .38s cubic-bezier(.25,1,.35,1)}
.hs-x .hs-panel{top:44px}
.hs-f .hs-panel{width:auto;inset-inline:0;text-align:start}
html[data-theme="dark"] .hs-panel{box-shadow:0 0 0 1px var(--hs-line),0 24px 60px -18px rgba(0,0,0,.7)}
.hs-pop .hs-panel{opacity:1;transform:none}
.hs-body{padding:8px}
.hs-list{position:relative}
.hs-hl{position:absolute;top:0;inset-inline:0;border-radius:12px;background:var(--hs-hl);opacity:0;pointer-events:none;transition:transform .32s cubic-bezier(.3,1.25,.45,1),height .32s cubic-bezier(.3,1.25,.45,1),opacity .15s}
.hs-g{font-size:11px;font-weight:800;color:var(--hs-mute);padding:10px 10px 6px;letter-spacing:.2px}
.hs-o{position:relative;z-index:1;display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;cursor:pointer;color:var(--hs-ink)}
.hs-g,.hs-o{opacity:0;transform:translateY(4px);filter:blur(3px);animation:hsIn .35s cubic-bezier(.2,1,.3,1) forwards;animation-delay:calc(var(--i,0) * 22ms)}
@keyframes hsIn{to{opacity:1;transform:none;filter:none}}
.hs-oi{flex:none;width:32px;height:32px;border-radius:10px;background:var(--hs-soft);display:inline-flex;align-items:center;justify-content:center;transition:background .2s}
.hs-oi svg{width:16px;height:16px;fill:none;stroke:var(--hs-ink);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hs-oi svg.mm-ry{fill:var(--hs-ink);stroke:none;width:14px;height:16px}
.hs-o[aria-selected="true"] .hs-oi{background:var(--hs-ink)}
.hs-o[aria-selected="true"] .hs-oi svg{stroke:var(--hs-bg)}
.hs-o[aria-selected="true"] .hs-oi svg.mm-ry{fill:var(--hs-bg)}
.hs-ot{display:flex;flex-direction:column;gap:2px;min-width:0}
.hs-ot b{font-size:13.5px;font-weight:800;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hs-ot small{font-size:11.5px;color:var(--hs-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hs-ot mark{background:none;color:inherit;box-shadow:inset 0 -.42em 0 rgba(47,165,90,.28);border-radius:2px}
.hs-empty{padding:18px 12px;display:flex;flex-direction:column;gap:4px;animation:hsIn .3s forwards;opacity:0}
.hs-empty b{font-size:13.5px;color:var(--hs-ink)}
.hs-empty small{font-size:12px;color:var(--hs-mute)}
@media(max-width:768px){.hd-search{order:-1}}
@media(prefers-reduced-motion:reduce){.hs-x .hs-shell,.hs-panel,.hs-hl,.hs-clr{transition:opacity .15s!important}.hs-g,.hs-o,.hs-empty{animation:none;opacity:1;transform:none;filter:none}}
/* الهيدر: البحث أقرب شي للروابط، ويتمدد فوق زر الدخول واللغة والوضع */
#navbar-wrap .navbar-right-cell .hd-search{order:-5}
/* الدورات: قسم البداية كان يقص اللوحة من تحت */
#page-courses .cr-hero2{overflow-x:clip;overflow-y:visible;position:relative;z-index:3}