/* Night Notebook — site header
   Loaded on every front-end view so the header looks identical everywhere,
   including posts and archives the page templates don't cover. */

:root{
  --dwe-navy:#12123A;
  --dwe-sun:#FCB900;
  --dwe-coral:#FF5758;
}

/* --- the bar itself --------------------------------------------------- */
header.shfb-header,
header.shfb-header .shfb-row,
header.shfb-header .shfb-row-inner{
  background-color:transparent;
}
header.shfb-header{
  background-color:var(--dwe-navy) !important;
  border-bottom:1px solid rgba(252,185,0,.22);
}
/* sticky state keeps the same colour instead of turning white */
header.shfb-header.shfb-sticky-active,
header.shfb-header.is-sticky,
.shfb-sticky-wrapper header.shfb-header{
  background-color:var(--dwe-navy) !important;
}

/* --- menu: one unbroken row ------------------------------------------- */
header.shfb-header ul.nav-menu,
header.shfb-header ul.sydney-dropdown-ul.menu{
  width:auto !important;
  max-width:none !important;
  flex-wrap:nowrap !important;
  align-items:center;
  justify-content:flex-end;
  gap:clamp(10px,1.5vw,26px);
  margin:0;
  padding:0;
}
header.shfb-header ul.nav-menu > li{
  flex:0 0 auto;
  margin:0 !important;
  padding:0 !important;
}
header.shfb-header ul.nav-menu > li > a{
  white-space:nowrap;
  color:#fff !important;
  font-size:clamp(13px,1.05vw,15.5px);
  font-weight:500;
  letter-spacing:-.005em;
  padding:8px 0 !important;
  position:relative;
  transition:color .2s ease;
}
header.shfb-header ul.nav-menu > li > a:hover,
header.shfb-header ul.nav-menu > li > a:focus-visible{
  color:var(--dwe-sun) !important;
}

/* current page marker — a short yellow rule, not a full underline */
header.shfb-header ul.nav-menu > li > a::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:2px;
  background:var(--dwe-sun);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .24s cubic-bezier(.2,.8,.3,1);
}
header.shfb-header ul.nav-menu > li > a:hover::after{transform:scaleX(1);}
header.shfb-header ul.nav-menu > li.current-menu-item > a{color:var(--dwe-sun) !important;}
header.shfb-header ul.nav-menu > li.current-menu-item > a::after{transform:scaleX(1);}

/* the last item reads as the call to action */
header.shfb-header ul.nav-menu > li:last-child > a{
  background:var(--dwe-sun);
  color:var(--dwe-navy) !important;
  border-radius:100px;
  padding:9px 18px !important;
  font-weight:700;
}
header.shfb-header ul.nav-menu > li:last-child > a:hover{
  background:#ffc721;
  color:var(--dwe-navy) !important;
}
header.shfb-header ul.nav-menu > li:last-child > a::after{display:none;}

/* dropdowns, if any submenu exists */
header.shfb-header ul.nav-menu ul.sub-menu{
  background:#0D0D2B;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  padding:6px;
}
header.shfb-header ul.nav-menu ul.sub-menu a{color:rgba(255,255,255,.78) !important;font-size:14px;}
header.shfb-header ul.nav-menu ul.sub-menu a:hover{color:var(--dwe-sun) !important;}

/* search icon + toggles pick up the light palette */
header.shfb-header .shfb-search-icon,
header.shfb-header .header-search svg,
header.shfb-header .sydney-svg-icon svg,
header.shfb-header button svg{ fill:#fff; color:#fff; }

/* --- below the desktop breakpoint, let it breathe again --------------- */
@media (max-width:1024px){
  header.shfb-header ul.nav-menu,
  header.shfb-header ul.sydney-dropdown-ul.menu{
    flex-wrap:wrap !important;
    justify-content:flex-start;
  }
  header.shfb-header ul.nav-menu > li:last-child > a{padding:7px 14px !important;}
}
