/* iBlogger v91 — shared homepage header across every public page. */
html body #siteHeader.site-header.service-header, html body #siteHeader.site-header.service-header.is-scrolled{
  position: fixed !important;
  inset-block-start: 10px !important;
  inset-block-end: auto !important;
  inset-inline: 0 !important;
  top: 10px !important; bottom: auto !important; left: 0 !important; right: 0 !important;
  width: 100% !important; max-width: none !important; height: auto !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; transform: none !important; translate: none !important;
  background: transparent !important; background-color: transparent !important; background-image: none !important;
  border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  opacity: 1 !important; visibility: visible !important; z-index: 3000 !important; will-change: auto !important;
}
html body #siteHeader.site-header.service-header .header-inner{
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  direction: rtl !important; width: calc(100% - 52px) !important; max-width: 1530px !important;
  min-height: 62px !important; height: 62px !important; box-sizing: border-box !important;
  margin: 5px auto 0 !important; padding: 0 18px !important; gap: 11px !important;
  border: 1px solid rgba(238,236,251,.7) !important; border-radius: 23px !important;
  background: rgba(255,255,255,.97) !important; background-color: rgba(255,255,255,.97) !important;
  box-shadow: 0 9px 30px rgba(116,106,175,.09) !important;
  backdrop-filter: blur(18px) saturate(135%) !important; -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
}
html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header.service-header .header-inner, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header.service-header.is-scrolled .header-inner, html[data-theme="light"] body #siteHeader.site-header.service-header .header-inner{
  border-color: rgba(238,236,251,.7) !important;
  background: rgba(255,255,255,.97) !important; background-color: rgba(255,255,255,.97) !important;
  box-shadow: 0 9px 30px rgba(116,106,175,.09) !important;
}

html body #siteHeader.site-header.service-header .brand{
  display: inline-flex !important; align-items: center !important; width: 146px !important; max-width: 146px !important;
  min-width: 146px !important; flex: 0 0 146px !important; margin: 0 !important; padding: 0 !important;
}
html body #siteHeader.site-header.service-header .site-logo{
  display: inline-grid !important; align-items: center !important; width: 146px !important; max-width: 146px !important;
  min-width: 146px !important; flex: 0 0 146px !important; margin: 0 !important; padding: 0 !important;
}
html body #siteHeader.site-header.service-header .site-logo-image{
  display: block !important; width: 146px !important; max-width: 146px !important; height: auto !important;
  max-height: 42px !important; object-fit: contain !important; filter: none !important;
}
@media (min-width: 901px) {
  html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .site-logo-image.logo-light, html[data-theme="light"] body #siteHeader.site-header .site-logo-image.logo-light{
    content: url("../assets/images/desktop-reference/iblogger-logo-ref-light-v87.png") !important;
  }
  
  
}
html[data-theme="light"] body #siteHeader.site-header .desktop-nav{
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  flex: 1 1 auto !important; gap: 0 !important; min-width: 0 !important; max-width: none !important; direction: rtl !important;
  margin: 0 !important; padding: 0 !important;
}
html body #siteHeader.site-header .desktop-nav .nav-link, html body #siteHeader.site-header .desktop-nav .nav-dropdown-trigger{
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important;
  min-height: 40px !important; height: auto !important; padding: 9px 9px !important;
  border: 0 !important; border-radius: 999px !important; background: transparent !important;
  font-size: clamp(10px,.89vw,12px) !important; line-height: 1.3 !important; font-weight: 750 !important;
  white-space: nowrap !important; box-shadow: none !important; text-shadow: none !important;
  text-decoration: none !important; transform: none !important;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease !important;
}
html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-link, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-dropdown-trigger, html[data-theme="light"] body #siteHeader.site-header .desktop-nav .nav-link, html[data-theme="light"] body #siteHeader.site-header .desktop-nav .nav-dropdown-trigger{ color: #252b52 !important; }

html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-link:hover, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-link.is-active, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-dropdown-trigger:hover, html[data-theme="light"] body #siteHeader.site-header .desktop-nav .nav-link:hover, html[data-theme="light"] body #siteHeader.site-header .desktop-nav .nav-link.is-active, html[data-theme="light"] body #siteHeader.site-header .desktop-nav .nav-dropdown-trigger:hover, html[data-theme="light"] body #siteHeader.site-header .desktop-nav .nav-dropdown-trigger.is-active{
  color: #7735e9 !important; background: #f0edff !important; border-radius: 999px !important;
}

html body #siteHeader.site-header .desktop-nav .nav-link::after{ content: none !important; display: none !important; }
html body #siteHeader.site-header .nav-dropdown{ position: relative !important; }
html body #siteHeader.site-header .nav-dropdown-menu{
  min-width: 280px !important; padding: 8px !important; border-radius: 20px !important;
  border: 1px solid #e4e6f2 !important; background: #fff !important; color: #272946 !important;
  box-shadow: 0 20px 55px rgba(35,38,83,.13) !important; backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
html[data-theme="light"] body #siteHeader.site-header .nav-dropdown-menu{ border-color: #e4e6f2 !important; background: #fff !important; }

html body #siteHeader.site-header .nav-dropdown-menu > a{
  display: grid !important; grid-template-columns: 43px minmax(0,1fr) !important; align-items: center !important;
  gap: 11px !important; padding: 11px !important; margin: 0 !important; border: 0 !important;
  border-radius: 14px !important; background: transparent !important; text-decoration: none !important;
  white-space: normal !important; transition: background-color .18s ease, color .18s ease !important;
}
html[data-theme="light"] body #siteHeader.site-header .nav-dropdown-menu > a{ color: #343753 !important; }
html[data-theme="light"] body #siteHeader.site-header .nav-dropdown-menu > a strong{ color: #282a46 !important; opacity: 1 !important; }
html[data-theme="light"] body #siteHeader.site-header .nav-dropdown-menu > a small{ color: #646b84 !important; opacity: 1 !important; font-size: .72rem !important; line-height: 1.7 !important; }


html[data-theme="light"] body #siteHeader.site-header .nav-dropdown-menu > a:hover, html[data-theme="light"] body #siteHeader.site-header .nav-dropdown-menu > a.is-active{ background: #f0edff !important; color: #7735e9 !important; border-radius: 14px !important; }

html body #siteHeader.site-header .service-account{ display: flex !important; align-items: center !important; gap: 7px !important; flex: 0 0 auto !important; }
html body #siteHeader.site-header .service-account .button, html body #siteHeader.site-header .unified-auth-button{
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  height: 39px !important; min-height: 39px !important; min-width: 73px !important; padding: 0 15px !important;
  border: 0 !important; border-radius: 999px !important; color: #fff !important; font-size: 12px !important; font-weight: 800 !important;
  background: linear-gradient(125deg,#ab59ff,#7d32f2) !important; box-shadow: 0 7px 15px rgba(133,67,241,.18) !important;
}
html body #siteHeader.site-header .icon-button.favorites-trigger{
  display: inline-grid !important; place-items: center !important; width: 39px !important; height: 39px !important;
  min-width: 39px !important; min-height: 39px !important; flex: 0 0 39px !important; padding: 0 !important;
  border-radius: 50% !important; background: #fff !important; border: 1px solid #eae7fb !important;
  color: #2d315c !important; box-shadow: 0 2px 8px rgba(53,50,100,.05) !important; transform: none !important;
}

html body #siteHeader.site-header .icon-button.favorites-trigger svg{ width: 19px !important; height: 19px !important; }
html body #siteHeader.site-header .menu-toggle{
  display: none !important; place-items: center !important; width: 39px !important; height: 39px !important;
  min-width: 39px !important; min-height: 39px !important; padding: 0 !important; border-radius: 50% !important;
  border: 1px solid #eae7fb !important; background: #fff !important; color: #2d315c !important; box-shadow: none !important;
}

html body #siteHeader.site-header .icon-button:hover, html body #siteHeader.site-header .service-account .button:hover, html body #siteHeader.site-header .unified-auth-button:hover{
  border-radius: 999px !important; transform: none !important; filter: brightness(.98) !important;
}
html[data-theme="light"] body #siteHeader.site-header .icon-button:hover{ background: #f0edff !important; color: #7735e9 !important; border-color: #ded8fb !important; }






/* The mobile drawer is part of the same shared header system on every page. */
html body #mobileNavBackdrop.mobile-nav-backdrop{ position: fixed !important; inset: 0 !important; z-index: 2998 !important; }
html body #mobileNav.mobile-nav{ position: fixed !important; top: 0 !important; bottom: 0 !important; z-index: 2999 !important; width: min(86vw,360px) !important; }
html[data-theme="light"] body #mobileNav.mobile-nav{ background: #fff !important; color: #272946 !important; border-color: #e4e6f2 !important; box-shadow: 0 20px 55px rgba(35,38,83,.13) !important; }
html[data-theme="light"] body #mobileNav.mobile-nav a, html[data-theme="light"] body #mobileNav.mobile-nav summary{ color: #414360 !important; }
html[data-theme="light"] body #mobileNav.mobile-nav small{ color: #646b84 !important; opacity: 1 !important; }



html body #mobileNav.mobile-nav a:hover, html body #mobileNav.mobile-nav summary:hover{ border-radius: 14px !important; }
.site-header-spacer{ display: block !important; width: 100% !important; height: 86px !important; flex: 0 0 86px !important; pointer-events: none !important; }
.site-profile-back-row{ width: min(calc(100% - 48px),1320px) !important; margin: 0 auto 14px !important; padding-top: 4px !important; display: flex !important; justify-content: flex-start !important; position: relative !important; z-index: 1 !important; }
.site-profile-back-row .reviewer-back-link{ border-radius: 999px !important; }
body.auth-page .authn-shell{ min-height: calc(100vh - 86px) !important; }

@media (min-width: 1151px) {
  html body #siteHeader.site-header .desktop-nav{ display: flex !important; }
  html body #siteHeader.site-header .service-account{ display: flex !important; }
  html body #siteHeader.site-header .menu-toggle{ display: none !important; }
}
@media (min-width: 901px) and (max-width: 1150px) {
  html body #siteHeader.site-header .header-inner{ width: calc(100% - 52px) !important; max-width: 1530px !important; min-height: 62px !important; height: 62px !important; padding: 0 14px !important; }
  html body #siteHeader.site-header .desktop-nav, html body #siteHeader.site-header .service-account{ display: none !important; }
  html body #siteHeader.site-header .menu-toggle{ display: inline-grid !important; }
  html body #siteHeader.site-header .brand, html body #siteHeader.site-header .site-logo{ width: 146px !important; max-width: 146px !important; min-width: 146px !important; flex-basis: 146px !important; }
  html body #siteHeader.site-header .site-logo-image{ width: 146px !important; max-width: 146px !important; }
}
@media (max-width: 900px) {
  html body #siteHeader.site-header.service-header, html body #siteHeader.site-header.service-header.is-scrolled{ top: 10px !important; }
  html body #siteHeader.site-header .header-inner{ width: calc(100% - 28px) !important; max-width: 900px !important; min-height: 54px !important; height: 54px !important; margin: 5px auto 0 !important; padding: 0 10px !important; gap: 8px !important; border-radius: 19px !important; direction: ltr !important; }
  html body #siteHeader.site-header .desktop-nav, html body #siteHeader.site-header .service-account{ display: none !important; }
  html body #siteHeader.site-header .menu-toggle{ display: inline-grid !important; }
  html body #siteHeader.site-header .brand, html body #siteHeader.site-header .site-logo{ width: 112px !important; max-width: 112px !important; min-width: 112px !important; flex-basis: 112px !important; }
  html body #siteHeader.site-header .site-logo-image{ width: 112px !important; max-width: 112px !important; max-height: 34px !important; }
  html body #siteHeader.site-header .icon-button.favorites-trigger, html body #siteHeader.site-header .menu-toggle{ width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; flex-basis: 34px !important; }
  .site-header-spacer{ height: 74px !important; flex-basis: 74px !important; }
  body.auth-page .authn-shell{ min-height: calc(100dvh - 74px) !important; }
  .site-profile-back-row{ width: calc(100% - 28px) !important; }
}
@media (max-width: 620px) {
  html body #siteHeader.site-header.service-header, html body #siteHeader.site-header.service-header.is-scrolled{ top: 0 !important; }
  html body #siteHeader.site-header .header-inner{ width: calc(100% - 18px) !important; padding: 0 7px !important; gap: 6px !important; border-radius: 17px !important; margin: 0 auto !important; direction: ltr !important; }
  html body #siteHeader.site-header .brand, html body #siteHeader.site-header .site-logo{ width: 106px !important; max-width: 106px !important; min-width: 106px !important; flex-basis: 106px !important; }
  html body #siteHeader.site-header .site-logo-image{ width: 106px !important; max-width: 106px !important; }
  html body #siteHeader.site-header .icon-button.favorites-trigger, html body #siteHeader.site-header .menu-toggle{ width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; flex-basis: 32px !important; }
  .site-header-spacer{ height: 60px !important; flex-basis: 60px !important; }
  body.auth-page .authn-shell{ min-height: calc(100dvh - 60px) !important; }
}

/* Higher-specificity home-page overrides: keep hover surfaces rounded even against legacy reference CSS. */
html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-link, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-dropdown-trigger{
  border-radius: 999px !important;
}
html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-link:hover, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-link.is-active, html[data-theme="light"] body.home-page.v4-page #siteHeader.site-header .desktop-nav .nav-dropdown-trigger:hover{
  border-radius: 999px !important;
}
html body.auth-page .site-header-spacer ~ main#authMain.authn-shell{
  min-height: calc(100vh - 86px) !important;
}
@media (max-width: 900px) {
  html body.auth-page .site-header-spacer ~ main#authMain.authn-shell{
    min-height: calc(100dvh - 62px) !important;
  }
}
@media (max-width: 620px) {
  html body.auth-page .site-header-spacer ~ main#authMain.authn-shell{
    min-height: calc(100dvh - 60px) !important;
  }
}

/* Ensure the shared dropdown and mobile drawer work even on standalone/profile pages with reduced CSS bundles. */
html body #siteHeader.site-header .nav-dropdown-menu{
  position: absolute !important; top: calc(100% + 9px) !important; right: 0 !important; left: auto !important;
  z-index: 3010 !important; opacity: 0 !important; visibility: hidden !important; pointer-events: none !important;
  transform: translateY(8px) scale(.985) !important; transform-origin: top right !important;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
}
html body #siteHeader.site-header .nav-dropdown-menu::before{
  content: "" !important; position: absolute !important; top: -12px !important; right: 0 !important; left: 0 !important;
  height: 14px !important; display: block !important;
}
html body #siteHeader.site-header .nav-dropdown:hover .nav-dropdown-menu, html body #siteHeader.site-header .nav-dropdown:focus-within .nav-dropdown-menu{
  opacity: 1 !important; visibility: visible !important; pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}
html body #siteHeader.site-header .nav-dropdown-icon{
  display: grid !important; place-items: center !important; width: 43px !important; height: 43px !important;
  border-radius: 12px !important; background: #f0edff !important; color: #7735e9 !important;
}
html body #siteHeader.site-header .nav-dropdown-icon svg{ width: 22px !important; height: 22px !important; }

html body #mobileNavBackdrop.mobile-nav-backdrop{
  background: rgba(5,7,20,.52) !important; opacity: 0 !important; pointer-events: none !important;
  transition: opacity .22s ease !important; backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important;
}
html body #mobileNavBackdrop.mobile-nav-backdrop.is-open{ opacity: 1 !important; pointer-events: auto !important; }
html body #mobileNavBackdrop.mobile-nav-backdrop[hidden]{ display: none !important; }
html body #mobileNav.mobile-nav{
  display: flex !important; flex-direction: column !important; align-items: stretch !important;
  right: 0 !important; left: auto !important; inset-inline-start: auto !important; inset-inline-end: 0 !important;
  padding: 20px !important; overflow-y: auto !important; overscroll-behavior: contain !important;
  border-left: 1px solid #e4e6f2 !important; border-right: 0 !important; border-radius: 0 !important;
  transform: translateX(105%) !important; transition: transform .26s ease !important;
  direction: rtl !important; box-sizing: border-box !important;
}
html body #mobileNav.mobile-nav.is-open{ transform: translateX(0) !important; }
html body #mobileNav.mobile-nav .mobile-nav-head{
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 12px !important; padding-bottom: 18px !important; border-bottom: 1px solid #e4e6f2 !important;
}
html body #mobileNav.mobile-nav .mobile-nav-title{ font-size: 1.05rem !important; font-weight: 850 !important; }
html body #mobileNav.mobile-nav .mobile-nav-close{ width: 36px !important; height: 36px !important; min-width: 36px !important; min-height: 36px !important; border-radius: 50% !important; }
html body #mobileNav.mobile-nav .mobile-nav-links{ display: grid !important; gap: 5px !important; padding-block: 22px !important; }
html body #mobileNav.mobile-nav .mobile-nav-links > a, html body #mobileNav.mobile-nav .mobile-feedback-submenu > a{
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 3px !important;
  padding: 12px 14px !important; border-radius: 14px !important; font-weight: 750 !important; text-decoration: none !important;
}
html body #mobileNav.mobile-nav .mobile-feedback-menu > summary{
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important;
  padding: 12px 14px !important; border-radius: 14px !important; cursor: pointer !important; list-style: none !important; font-weight: 750 !important;
}
html body #mobileNav.mobile-nav .mobile-feedback-menu > summary::-webkit-details-marker{ display: none !important; }
html body #mobileNav.mobile-nav .mobile-feedback-submenu{ display: grid !important; gap: 4px !important; padding: 4px 10px 8px !important; }
html body #mobileNav.mobile-nav .mobile-feedback-submenu > a{ padding: 10px 12px !important; }
html body #mobileNav.mobile-nav .mobile-nav-actions{ display: grid !important; gap: 10px !important; margin-top: auto !important; padding-top: 14px !important; }
html body #mobileNav.mobile-nav .mobile-nav-actions .button{ min-height: 44px !important; border-radius: 999px !important; }
html[data-theme="light"] body #mobileNav.mobile-nav .mobile-nav-head{ border-color: #e4e6f2 !important; }


html[data-theme="light"] body #mobileNav.mobile-nav .mobile-nav-links > a:hover, html[data-theme="light"] body #mobileNav.mobile-nav .mobile-feedback-menu > summary:hover, html[data-theme="light"] body #mobileNav.mobile-nav .mobile-feedback-submenu > a:hover{ background: #f0edff !important; color: #7735e9 !important; }

@media (max-width: 900px) {
  html body.home-page.v4-page #siteHeader.site-header .header-inner{ width: calc(100% - 28px) !important; max-width: 900px !important; min-height: 54px !important; height: 54px !important; margin: 5px auto 0 !important; padding: 0 10px !important; gap: 8px !important; direction: ltr !important; }
  html body.home-page.v4-page #siteHeader.site-header .brand, html body.home-page.v4-page #siteHeader.site-header .site-logo{ width: 112px !important; max-width: 112px !important; min-width: 112px !important; flex-basis: 112px !important; }
  html body.home-page.v4-page #siteHeader.site-header .site-logo-image{ width: 112px !important; max-width: 112px !important; max-height: 34px !important; }
  html body.home-page.v4-page #siteHeader.site-header .icon-button.favorites-trigger, html body.home-page.v4-page #siteHeader.site-header .menu-toggle{ width: 34px !important; height: 34px !important; min-width: 34px !important; min-height: 34px !important; flex-basis: 34px !important; }
  html body.home-page.v4-page #siteHeader.site-header .desktop-nav, html body.home-page.v4-page #siteHeader.site-header .service-account{ display: none !important; }
  html body.home-page.v4-page #siteHeader.site-header .menu-toggle{ display: inline-grid !important; }
}
@media (max-width: 620px) {
  html body.home-page.v4-page #siteHeader.site-header .header-inner{ width: calc(100% - 18px) !important; padding: 0 7px !important; gap: 6px !important; margin: 0 auto !important; }
  html body.home-page.v4-page #siteHeader.site-header .brand, html body.home-page.v4-page #siteHeader.site-header .site-logo{ width: 106px !important; max-width: 106px !important; min-width: 106px !important; flex-basis: 106px !important; }
  html body.home-page.v4-page #siteHeader.site-header .site-logo-image{ width: 106px !important; max-width: 106px !important; }
  html body.home-page.v4-page #siteHeader.site-header .icon-button.favorites-trigger, html body.home-page.v4-page #siteHeader.site-header .menu-toggle{ width: 32px !important; height: 32px !important; min-width: 32px !important; min-height: 32px !important; flex-basis: 32px !important; }
}

/* iBlogger v91 — desktop drawer safety and RTL header restoration. */
@media (min-width: 1151px) {
  html body #siteHeader.site-header .header-inner{
    direction: rtl !important;
  }
  html body #mobileNav.mobile-nav, html body #mobileNav.mobile-nav.is-open{
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateX(110%) !important;
  }
  html body #mobileNavBackdrop.mobile-nav-backdrop, html body #mobileNavBackdrop.mobile-nav-backdrop.is-open{
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }
  html body #siteHeader.site-header .menu-toggle{
    display: none !important;
  }
}
