/* ===================================================
   نوار بالای مشترک بابی‌فلای - یه فایل، همه‌ی صفحات ازش می‌خونن.
   برای تغییر ظاهر منو/لاگین/پروفایل تو کل سایت، فقط همین فایل
   (و shared-nav.js) رو ویرایش کن - نیازی به دست‌زدن به تک‌تک صفحات نیست.
   ظاهر: سبک اپ هواشناسی (کارت شیشه‌ای، گوشه‌های گرد، فیروزه‌ای/نارنجی)
   =================================================== */

#shared-nav-root{
  position:relative;z-index:9000;
  width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  padding:14px max(3vw, calc((100% - 1200px) / 2 + 2vw)) 4px;
}

#shared-nav-root .top-nav{
  display:flex;align-items:center;justify-content:flex-start;
  flex-wrap:nowrap;gap:10px;position:relative;
  max-width:1200px;margin:0 auto;
  padding:14px 20px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.13);
  border-radius:28px;
  box-shadow:0 18px 50px rgba(0,0,0,.28);
  min-height:120px;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
#shared-nav-root .top-nav::after{display:none;}

/* ---------- شبکه‌ی ابزارها (تو همون ردیف، بین پروفایل و خانه) ---------- */
#shared-nav-root .sn-tools{
  display:flex;align-items:flex-start;gap:6px;flex-wrap:wrap;justify-content:center;
  flex:1;margin-top:4px;
}
#shared-nav-root .sn-tools a{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  text-decoration:none;flex-shrink:0;width:74px;padding:8px 2px 7px;border-radius:18px;
  transition:transform .15s ease, background .15s ease;
}
#shared-nav-root .sn-tool-icon{
  width:54px;height:54px;
  display:flex;align-items:center;justify-content:center;
}
#shared-nav-root .sn-tool-icon img{width:100%;height:100%;object-fit:contain;}
#shared-nav-root .sn-tool-label{
  font-size:.7rem;color:rgba(247,250,252,.68);font-weight:700;text-align:center;white-space:nowrap;
  transition:color .15s ease;
}
#shared-nav-root .sn-tools a:hover{transform:translateY(-2px);background:rgba(255,255,255,.07);}
#shared-nav-root .sn-tools a:hover .sn-tool-label{color:#19CBE3;}

/* ---------- دکمه‌های ورود/ثبت‌نام (مهمون) ---------- */
#shared-nav-root .sn-guest{display:flex;align-items:center;gap:10px;flex-shrink:0;position:relative;}
#shared-nav-root .sn-icon-btn{
  width:54px;height:54px;border-radius:18px;display:flex;align-items:center;justify-content:center;
  background:transparent;color:var(--cloud);text-decoration:none;border:none;cursor:pointer;
  flex-shrink:0;transition:background .15s ease, transform .15s ease;
}
#shared-nav-root .sn-icon-btn img{width:100%;height:100%;object-fit:contain;}
#shared-nav-root .sn-cta{
  background:#FF9F1C;color:#0B2545;padding:9px 18px;border-radius:999px;
  font-weight:800;font-size:.85rem;text-decoration:none;white-space:nowrap;
  box-shadow:0 8px 22px rgba(255,159,28,.28);
}
#shared-nav-root .sn-register-btn{background:transparent;}
#shared-nav-root .sn-register-btn:hover{background:rgba(255,159,28,.12);}
#shared-nav-root .sn-back-btn:hover,
#shared-nav-root .sn-home-btn:hover,
#shared-nav-root .sn-guest-btn:hover{background:rgba(255,255,255,.08);transform:translateY(-1px);}
#shared-nav-root .sn-home-btn.sn-disabled{opacity:.35;cursor:default;pointer-events:none;}

/* ---------- آواتار + پاپ‌آپ پروفایل (کاربر لاگین‌شده) ---------- */
#shared-nav-root .sn-workspace{display:none;align-items:center;position:relative;flex-shrink:0;}
#shared-nav-root .sn-avatar-btn{
  width:54px;height:54px;border-radius:18px;border:none;cursor:pointer;
  background:transparent;color:#0B2545;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  box-shadow:0 0 0 2px rgba(25,203,227,.45),0 6px 18px rgba(0,0,0,.35);
  transition:box-shadow .15s ease;
}
#shared-nav-root .sn-avatar-btn:hover{box-shadow:0 0 0 2px #19CBE3,0 6px 18px rgba(0,0,0,.35);}
#shared-nav-root .sn-avatar-btn img{width:100%;height:100%;object-fit:contain;}
#shared-nav-root .sn-avatar-btn img.sn-avatar-photo{width:100%;height:100%;object-fit:cover;border-radius:50%;}
#shared-nav-root .sn-dropdown{
  display:none;position:absolute;top:calc(100% + 14px);right:0;left:auto;z-index:9500;
  width:230px;background:#10294B;border:1px solid rgba(255,255,255,.13);border-radius:22px;padding:8px;
  box-shadow:0 24px 60px rgba(0,0,0,.45);
}
#shared-nav-root .sn-dropdown.show{display:block;animation:sn-pop .16s ease-out;}
@keyframes sn-pop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
#shared-nav-root .sn-dropdown a{
  display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;color:#F7FAFC;
  text-decoration:none;font-size:.88rem;font-weight:700;transition:background .12s ease;
}
#shared-nav-root .sn-dropdown a img{width:20px;height:20px;flex-shrink:0;object-fit:contain;}
#shared-nav-root .sn-dropdown a:hover{background:rgba(255,255,255,.07);}
#shared-nav-root .sn-dropdown a.sn-logout{color:#FF8FA3;margin-top:4px;border-top:1px solid rgba(255,255,255,.08);border-radius:0 0 14px 14px;padding-top:12px;}

/* ---------- موبایل ---------- */
@media(max-width:820px){
  #shared-nav-root{padding:0;}
  #shared-nav-root .top-nav{display:none;}

  /* نوار پایین شناور - تو همه‌ی صفحات، فقط موبایل */
  body{padding-bottom:104px;}
  .sn-bottom-nav{
    display:flex;justify-content:space-around;align-items:center;
    position:fixed !important;top:auto !important;z-index:9000;
    left:10px !important;right:10px !important;bottom:calc(10px + env(safe-area-inset-bottom)) !important;
    background:rgba(16,41,75,.92);
    border:1px solid rgba(255,255,255,.13);border-radius:26px;
    padding:6px 2px;
    box-shadow:0 14px 40px rgba(0,0,0,.45);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  }
  .sn-bottom-nav .bn-item{
    display:flex;flex-direction:column;align-items:center;gap:2px;
    text-decoration:none;color:rgba(247,250,252,.68);font-size:.55rem;font-weight:700;
    flex:1 1 0;min-width:0;padding:4px 1px;text-align:center;border-radius:16px;
    background:transparent;border:none;font-family:inherit;cursor:pointer;
    transition:background .12s ease, color .12s ease;
  }
  /* با هفت آیتم، برچسب‌ها نباید بشکنند یا از نوار بیرون بزنند */
  .sn-bottom-nav .bn-item > span:last-child{
    display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .sn-bottom-nav .bn-item:active{background:rgba(255,255,255,.08);color:#F7FAFC;}
  .sn-bottom-nav .bn-icon{display:flex;align-items:center;justify-content:center;}
  .sn-bottom-nav .bn-icon img{width:33px;height:33px;object-fit:contain;}
}
@media(max-width:360px){
  .sn-bottom-nav .bn-icon img{width:28px;height:28px;}
  .sn-bottom-nav .bn-item{font-size:.5rem;}
}
@media(min-width:821px){
  .sn-bottom-nav{display:none;}
}

/* ---------- پاپ‌آپ «این بخش مخصوص اعضاست» ---------- */
#sn-locked-modal{
  display:none;position:fixed;inset:0;z-index:99999;
  background:rgba(4,12,24,.7);backdrop-filter:blur(4px);
  align-items:center;justify-content:center;padding:20px;
}
#sn-locked-modal.show{display:flex;}
.sn-locked-box{
  position:relative;background:#10294B;border:1px solid rgba(255,255,255,.13);border-radius:28px;
  padding:36px 28px 26px;max-width:370px;width:100%;text-align:center;
  box-shadow:0 30px 80px rgba(0,0,0,.55);
}
.sn-locked-icon{font-size:2.4rem;margin-bottom:12px;}
.sn-locked-box h3{color:#F7FAFC;font-size:1.15rem;font-weight:900;margin-bottom:10px;}
.sn-locked-box p{color:rgba(247,250,252,.68);font-size:.88rem;line-height:1.9;margin-bottom:22px;}
.sn-locked-actions{display:flex;flex-direction:column;gap:10px;}
.sn-locked-cta{
  display:block;background:#FF9F1C;color:#0B2545;
  text-decoration:none;padding:13px;border-radius:999px;font-weight:900;font-size:.94rem;
  box-shadow:0 8px 22px rgba(255,159,28,.3);
}
.sn-locked-secondary{
  display:block;color:#F7FAFC;text-decoration:none;padding:12px;font-size:.86rem;font-weight:700;
  border:1px solid rgba(255,255,255,.14);border-radius:999px;
}
.sn-locked-secondary:hover{border-color:rgba(25,203,227,.6);background:rgba(25,203,227,.08);}
.sn-locked-close{
  position:absolute;top:14px;left:14px;width:36px;height:36px;border-radius:50%;
  background:transparent;border:1px solid rgba(255,255,255,.14);color:rgba(247,250,252,.68);
  font-size:.95rem;cursor:pointer;padding:0;
}
.sn-locked-close:hover{color:#F7FAFC;}

/* ---------- پاپ‌آپ پروفایل موبایل (از پایین باز می‌شه) ---------- */
#bn-profile-sheet{
  display:none;position:fixed;inset:0;z-index:9990;
  background:rgba(4,12,24,.6);align-items:flex-end;justify-content:center;
}
#bn-profile-sheet.show{display:flex;}
.bn-sheet-box{
  width:100%;max-width:480px;background:#10294B;border:1px solid rgba(255,255,255,.13);border-bottom:0;
  border-radius:28px 28px 0 0;padding:10px 16px calc(104px + env(safe-area-inset-bottom)); /* clears the floating bottom nav */
  box-shadow:0 -20px 60px rgba(0,0,0,.45);animation:sn-up .22s ease-out;
}
@keyframes sn-up{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
.bn-sheet-handle{width:44px;height:5px;background:rgba(255,255,255,.22);border-radius:100px;margin:6px auto 14px;}
.bn-sheet-item{
  display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:16px;
  color:#F7FAFC;text-decoration:none;font-size:.94rem;font-weight:700;
}
.bn-sheet-item img{width:24px;height:24px;object-fit:contain;flex-shrink:0;}
.bn-sheet-item:active{background:rgba(255,255,255,.07);}
.bn-sheet-logout{color:#FF8FA3;border-top:1px solid rgba(255,255,255,.08);margin-top:4px;padding-top:16px;border-radius:0;}
#bn-sheet-close{
  width:100%;margin-top:10px;padding:13px;border-radius:999px;
  background:transparent;border:1px solid rgba(255,255,255,.14);color:rgba(247,250,252,.75);
  font-family:inherit;font-size:.88rem;font-weight:700;cursor:pointer;
}
@media(min-width:821px){
  #bn-profile-sheet{display:none !important;}
}

/* ---------- فرم ورود داخل پاپ‌آپ ---------- */
#shared-nav-root .sn-login-dropdown{width:280px;padding:18px;}
.sn-login-field{margin-bottom:12px;}
.sn-login-field label{display:block;font-size:.78rem;color:rgba(247,250,252,.68);margin-bottom:6px;font-weight:700;}
.sn-login-field input{
  width:100%;padding:11px 14px;border-radius:14px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);color:#F7FAFC;font-family:'Vazirmatn',sans-serif;font-size:.88rem;
  box-sizing:border-box;transition:border-color .15s ease, box-shadow .15s ease;
}
.sn-login-field input::placeholder{color:rgba(247,250,252,.4);}
.sn-login-field input:focus{outline:none;border-color:#19CBE3;box-shadow:0 0 0 3px rgba(25,203,227,.18);}
#shared-nav-root .sn-login-submit, .bn-sheet-box .sn-login-submit{
  width:100%;background:#FF9F1C;color:#0B2545;border:none;
  padding:12px;border-radius:999px;font-weight:900;font-size:.9rem;cursor:pointer;
  font-family:'Vazirmatn',sans-serif;margin-top:4px;box-shadow:0 8px 22px rgba(255,159,28,.28);
}
#shared-nav-root .sn-login-submit:disabled{opacity:.6;cursor:default;box-shadow:none;}
#shared-nav-root #sn-login-status{display:none;margin-top:10px;padding:8px 10px;border-radius:12px;font-size:.8rem;text-align:center;}
.sn-login-status-err{display:block !important;background:rgba(255,90,118,.14);color:#FF8FA3;}
.sn-login-status-ok{display:block !important;background:rgba(61,220,151,.14);color:#7FEBBE;}
.sn-login-divider{height:1px;background:rgba(255,255,255,.1);margin:14px 0 12px;}
#shared-nav-root .sn-login-register-link{
  display:block;text-align:center;color:#19CBE3 !important;text-decoration:none;
  font-size:.86rem;font-weight:800;
}
#shared-nav-root .sn-login-register-link:hover{color:#7DE6F2 !important;}