/* ===== Rayna nav-pro: منوی دخترانه، استاندارد و راحت ===== */
:root{
  --np-pink:#ff4f9a; --np-pink-d:#b0306f; --np-lilac:#c084fc;
  --np-soft:#fff0f7; --np-line:#ffd1e8; --np-text:#7a1f4d;
}

/* هدر: دو ردیف مرتب؛ بالا لوگو + عنوان، پایین منو */
html body header{
  display:flex!important; flex-direction:column!important; align-items:stretch!important;
  gap:8px!important; padding:8px 14px 10px!important; direction:rtl!important;
}
html body header .hbrand,html body header>.brand{
  align-self:center!important; margin:0!important; justify-content:center!important;
}
html body header .brand{font-size:1.15rem!important}
html body header .rlogo,html body header .rlogo img{width:46px!important;height:46px!important}

/* ظرف منو */
html body header .nav,html body header .nav.ncol{
  display:flex!important; flex-wrap:wrap!important; align-items:center!important;
  justify-content:center!important; gap:6px!important;
  width:100%!important; max-width:1280px!important; margin:0 auto!important;
  padding:8px 10px!important; overflow:visible!important;
  background:rgba(255,255,255,.82)!important;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:2px solid var(--np-line)!important; border-radius:22px!important;
  box-shadow:0 6px 20px rgba(255,79,154,.18), inset 0 1px 0 #fff!important;
  -webkit-mask-image:none!important; mask-image:none!important;
}

/* دکمه‌ها */
html body header .nav a,html body header .nav.ncol a,html body header .nav.ncol a:not(.on),
html body header .nav .sbwrap>a{
  flex:0 0 auto!important; width:auto!important; height:auto!important; min-height:40px!important;
  max-width:none!important; min-width:0!important; margin:0!important; opacity:1!important;
  display:inline-flex!important; align-items:center!important; justify-content:center!important; gap:6px!important;
  padding:6px 13px!important; font-size:.88rem!important; font-weight:700!important; line-height:1.4!important;
  white-space:nowrap!important; overflow:visible!important; text-overflow:clip!important;
  color:var(--np-text)!important; text-decoration:none!important;
  background:transparent!important; border:2px solid transparent!important; border-radius:14px!important;
  box-shadow:none!important; transform:none!important;
  transition:background .18s,color .18s,border-color .18s,box-shadow .18s!important;
}
html body header .nav a:hover{
  background:var(--np-soft)!important; border-color:var(--np-line)!important; color:var(--np-pink-d)!important;
}
html body header .nav a:focus-visible,html body header .nav .ntog:focus-visible{
  outline:3px solid var(--np-lilac)!important; outline-offset:2px!important;
}
/* صفحه‌ی فعال */
html body header .nav a.on,html body header .nav.ncol a.on{
  color:#fff!important; border-color:#fff!important; font-weight:800!important;
  background:linear-gradient(135deg,#ff6fb1,#c084fc)!important;
  box-shadow:0 4px 14px rgba(192,132,252,.55)!important;
}

/* جداکننده‌ی گروه‌ها (قبل از «سایت» و «خروج») */
html body header .nav a[href="/"]{margin-inline-start:auto!important;color:#0a7d6a!important}
html body header .nav a[href="/"]:hover{background:#e6fbf5!important;border-color:#a7ecd9!important}
html body header .nav a[href*="logout"]{color:#d6285f!important}
html body header .nav a[href*="logout"]:hover{background:#ffe3ec!important;border-color:#ffb3c9!important}

/* نشان تعداد خوانده‌نشده */
html body header .nav .bdg{
  margin-inline-start:2px!important; min-width:20px; padding:0 6px!important; font-size:.72rem!important;
  background:var(--np-pink)!important; box-shadow:0 0 0 2px #fff;
}

/* زیرمنو «تعاریف پایه» */
html body header .sbwrap{position:relative!important;display:inline-flex!important}
html body header .sbpanel{
  display:none!important; position:absolute!important; top:calc(100% + 8px)!important; right:0!important; left:auto!important;
  z-index:60!important; min-width:230px!important; padding:8px!important; gap:4px!important; flex-direction:column!important;
  background:#fff!important; border:2px solid var(--np-line)!important; border-radius:18px!important;
  box-shadow:0 14px 34px rgba(192,132,252,.4)!important;
}
html body header .sbwrap.open .sbpanel{display:flex!important;animation:npPop .16s ease-out}
html body header .sbpanel::before{
  content:"";position:absolute;top:-8px;right:26px;width:14px;height:14px;background:#fff;
  border-top:2px solid var(--np-line);border-left:2px solid var(--np-line);transform:rotate(45deg);
}
html body header .sbpanel a{width:100%!important;justify-content:flex-start!important;border-radius:12px!important}
@keyframes npPop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* دکمه‌ی منو در موبایل */
html body header .ntog{display:none!important}
.np-burger{display:none}

/* ===== موبایل / تبلت ===== */
@media (max-width:900px){
  .np-burger{
    display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
    min-height:46px; font:inherit; font-weight:800; font-size:1rem; color:#fff; cursor:pointer;
    background:linear-gradient(135deg,#ff6fb1,#c084fc); border:2px solid #fff; border-radius:16px;
    box-shadow:0 4px 14px rgba(255,79,154,.4);
  }
  html body header .nav,html body header .nav.ncol{
    display:none!important; padding:10px!important; border-radius:20px!important;
    grid-template-columns:1fr 1fr; gap:8px!important;
  }
  html body header.np-open .nav,html body header.np-open .nav.ncol{display:grid!important}
  html body header .nav a,html body header .nav.ncol a,html body header .nav.ncol a:not(.on),
  html body header .nav .sbwrap>a{
    width:100%!important; min-height:48px!important; white-space:normal!important; text-align:center!important;
    font-size:.9rem!important; background:#fff!important; border:2px solid var(--np-line)!important;
  }
  html body header .nav a[href="/"]{margin-inline-start:0!important}
  html body header .sbwrap{display:block!important;grid-column:1/-1}
  html body header .sbpanel{position:static!important;box-shadow:none!important;margin-top:6px!important;min-width:0!important}
  html body header .sbpanel::before{display:none}
}
@media (prefers-reduced-motion:reduce){html body header .sbwrap.open .sbpanel{animation:none}}

/* حذف حلقه‌ی زرد/سبز قدیمیِ دور آیتم فعال */
html body header .nav a.on::before,html body header .nav a.on::after{display:none!important;content:none!important}
