/* LngGo — رأس الموقع (Glassmorphism) وقائمة الجوال
   كان <style> داخل header.php يُرسل مع كلّ صفحة؛ صار ملفًّا يخبّئه المتصفّح.
   يُحمَّل بعد theme.css في الصفحات التي تستدعي header.php وحدها. */
/* ── Site Header — Glassmorphism ──────────────────────────── */
.ls-header{
  position:sticky;top:0;z-index:1000;
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:blur(18px) saturate(170%);
  backdrop-filter:blur(18px) saturate(170%);
  border-bottom:1px solid rgba(124,67,189,.12);
  box-shadow:0 2px 16px rgba(74,20,140,.08);
  direction:rtl;
}
/* Fallback لمتصفحات بدون backdrop-filter */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .ls-header{background:rgba(255,255,255,.96);}
}
.ls-header-inner{
  max-width:1200px;margin:0 auto;
  padding:0 24px;
  display:flex;align-items:center;
  height:72px;gap:20px;
}

/* Logo */
.ls-logo{
  display:flex;align-items:center;gap:10px;
  text-decoration:none;flex-shrink:0;
}
.ls-logo img{
  width:auto;height:60px;
  object-fit:contain;
  padding:0;
  box-sizing:border-box;
}
html[data-theme="dark"] .ls-logo img{
  /* خلفية فاتحة ناعمة خلف الشعار الداكن ليبقى مرئياً في الوضع الليلي */
  background:rgba(255,255,255,.9);
  border-radius:12px;
  padding:4px 6px;
  box-shadow:0 0 14px rgba(255,215,0,.22);
}
.ls-logo-text{
  display:flex;flex-direction:column;line-height:1.2;
}
.ls-logo-name{
  font-family:'Amita',sans-serif;
  font-size:1.15rem;font-weight:700;
  color:#4a148c;letter-spacing:1px;
}
.ls-logo-tagline{
  font-size:.65rem;color:#888;font-weight:600;letter-spacing:.5px;
}

/* Nav */
.ls-nav{
  display:flex;align-items:center;
  gap:4px;flex:1;justify-content:center;
  list-style:none;margin:0;padding:0;
}
.ls-nav > li{position:relative;}
.ls-nav > li > a{
  display:flex;align-items:center;gap:4px;
  padding:8px 12px;
  font-size:.88rem;font-weight:700;
  color:#1a1a2e;text-decoration:none;
  border-radius:8px;
  transition:color .2s,background .2s;
  white-space:nowrap;
  position:relative;
}
/* Underline ذهبي ينمو من المنتصف */
.ls-nav > li > a::after{
  content:'';position:absolute;bottom:2px;right:50%;
  width:0;height:2.5px;border-radius:2px;
  background:linear-gradient(90deg,#ffd700,#ffaa00);
  transform:translateX(50%);
  transition:width .32s cubic-bezier(.2,.8,.2,1);
}
.ls-nav > li > a:hover::after,
.ls-nav > li.current > a::after{width:70%;}
.ls-nav > li > a:hover,
.ls-nav > li.current > a{
  color:#4a148c;background:rgba(243,229,245,.55);
}
.ls-nav > li > a .nav-arrow{
  font-size:.6rem;transition:transform .2s;
  color:#999;
}
.ls-nav > li:hover > a .nav-arrow{transform:rotate(180deg);}

/* Dropdown */
.ls-dropdown{
  position:absolute;top:calc(100% + 6px);right:0;
  background:#fff;border:1px solid #e8e0f5;
  border-radius:12px;min-width:190px;
  box-shadow:0 8px 28px rgba(74,20,140,.14);
  padding:8px 0;
  opacity:0;visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .2s,transform .2s,visibility .2s;
  list-style:none;z-index:200;
}
.ls-nav > li:hover .ls-dropdown{
  opacity:1;visibility:visible;transform:translateY(0);
}
.ls-dropdown li a{
  display:block;padding:10px 18px;
  font-size:.84rem;font-weight:700;
  color:#1a1a2e;text-decoration:none;
  transition:background .15s,color .15s;
}
.ls-dropdown li a:hover{background:#f3e5f5;color:#4a148c;}

/* Account icon */
.ls-header-account{
  flex-shrink:0;margin-right:auto;
  display:flex;flex-direction:column;align-items:center;gap:3px;
}
.ls-header-account a{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:50%;
  background:#f3e5f5;color:#4a148c;
  text-decoration:none;transition:background .2s;
}
.ls-header-account a:hover{background:#e1bee7;}
.ls-header-account svg{width:22px;height:22px;fill:#4a148c;}
.ls-header-idk{font-size:.62rem;font-weight:900;color:#4a148c;letter-spacing:1px;line-height:1;}

/* Hamburger */
.ls-hamburger{
  display:none;flex-direction:column;gap:5px;
  cursor:pointer;padding:6px;border:none;background:none;
  margin-right:auto;
}
.ls-hamburger span{
  display:block;width:24px;height:2px;
  background:#4a148c;border-radius:2px;
  transition:transform .25s,opacity .25s;
}
.ls-hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.ls-hamburger.open span:nth-child(2){opacity:0;}
.ls-hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ── Mobile menu ─────────────────────────────────────────────── */
.ls-mobile-nav{
  overflow:hidden;
  max-height:0;
  background:#fff;
  border-top:2px solid #f0eafa;
  box-shadow:0 8px 24px rgba(74,20,140,.1);
  transition:max-height .35s cubic-bezier(.4,0,.2,1);
}
.ls-mobile-nav.open{ max-height:600px; }

.ls-mobile-nav > ul{
  list-style:none;margin:0;padding:8px 0 16px;
}

/* ── Regular item link ── */
.ls-mobile-nav > ul > li > a{
  display:flex;align-items:center;
  padding:13px 20px;
  font-size:.93rem;font-weight:700;
  color:#1a1a2e;text-decoration:none;
  border-radius:10px;
  margin:2px 10px;
  transition:color .18s,background .18s;
}
.ls-mobile-nav > ul > li > a:hover,
.ls-mobile-nav > ul > li > a:active{
  color:#4a148c;background:#f3e5f5;
}

/* ── Toggle row (item with sub-menu) ── */
.ls-mob-toggle{
  display:flex;align-items:center;justify-content:space-between;
  margin:2px 10px;
  border-radius:10px;
  cursor:pointer;
  transition:background .18s;
}
.ls-mob-toggle:hover{ background:#f3e5f5; }
.ls-mob-toggle > a{
  flex:1;
  padding:13px 10px 13px 20px;
  font-size:.93rem;font-weight:700;
  color:#1a1a2e;text-decoration:none;
  transition:color .18s;
}
.ls-mob-toggle:hover > a{ color:#4a148c; }

/* Arrow button inside toggle */
.ls-mob-arrow-btn{
  flex-shrink:0;
  width:36px;height:36px;
  margin-left:6px;
  display:flex;align-items:center;justify-content:center;
  border-radius:8px;
  background:rgba(74,20,140,.07);
  transition:background .18s,transform .28s;
}
.ls-mob-toggle.open .ls-mob-arrow-btn{
  background:rgba(74,20,140,.14);
  transform:rotate(180deg);
}
.ls-mob-arrow-btn svg{
  width:14px;height:14px;
  fill:#4a148c;
  display:block;
}

/* ── Sub-menu (dropdown) ── */
.ls-mob-sub{
  list-style:none;padding:0;margin:0 10px 4px 10px;
  background:linear-gradient(135deg,#f8f4ff,#f3ecff);
  border-radius:12px;
  border-right:3px solid #7c43bd;
  max-height:0;
  overflow:hidden;
  transition:max-height .3s cubic-bezier(.4,0,.2,1);
}
.ls-mob-sub.open{ max-height:300px; }

.ls-mob-sub li{ list-style:none; }
.ls-mob-sub li:not(:last-child){
  border-bottom:1px solid rgba(124,67,189,.1);
}
.ls-mob-sub li a{
  display:flex;align-items:center;gap:8px;
  padding:11px 18px;
  font-size:.86rem;font-weight:700;
  color:#4a148c;text-decoration:none;
  transition:background .15s,padding-right .15s;
}
.ls-mob-sub li a::before{
  content:'';
  width:6px;height:6px;
  border-radius:50%;
  background:#7c43bd;
  flex-shrink:0;
  opacity:.6;
}
.ls-mob-sub li a:hover{
  background:rgba(74,20,140,.08);
  padding-right:24px;
}

/* ── Mobile account section ── */
.ls-mob-account{
  margin:8px 12px 16px;
  border-top:1px solid rgba(124,67,189,.15);
  padding-top:14px;
}
.ls-mob-user{
  display:flex;align-items:center;gap:12px;
  padding:10px 14px;border-radius:14px;
  background:linear-gradient(135deg,#f3e5f5,#ede7f6);
  text-decoration:none;transition:background .2s;
}
.ls-mob-user:hover{background:linear-gradient(135deg,#e1bee7,#d1c4e9);}
.ls-mob-user img{width:42px;height:42px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.ls-mob-user-info{display:flex;flex-direction:column;gap:2px;}
.ls-mob-username{font-size:.9rem;font-weight:900;color:#1a1a2e;}
.ls-mob-idk{font-size:.75rem;font-weight:700;color:#4a148c;letter-spacing:1px;}
.ls-mob-auth-btns{display:flex;gap:10px;}
.ls-mob-auth-btn{
  flex:1;display:block;padding:11px;border-radius:50px;
  font-weight:800;font-size:.9rem;text-align:center;
  text-decoration:none;font-family:inherit;transition:transform .2s;
}
.ls-mob-auth-btn.login{background:linear-gradient(135deg,#4a148c,#7c43bd);color:#fff;box-shadow:0 4px 14px rgba(74,20,140,.3);}
.ls-mob-auth-btn.register{background:#fff;color:#4a148c;border:2px solid #7c43bd;}
.ls-mob-auth-btn:hover{transform:translateY(-2px);}

@media(max-width:900px){
  .ls-nav,.ls-header-account{display:none;}
  .ls-hamburger{display:flex;}
}
@media(min-width:901px){
  .ls-mobile-nav{display:none !important;}
}