/* Horizon Drive shell integration v52
   Same Horizon-family shell proportions; Drive keeps its own nav, controls and footer links.
*/
.site-header{
  box-sizing:border-box!important;
  position:sticky!important;
  top:0!important;
  z-index:900000!important;
  width:100%!important;
  height:65px!important;
  min-height:65px!important;
  max-height:65px!important;
  padding:5px clamp(14px,2.4vw,34px)!important;
  display:grid!important;
  grid-template-columns:minmax(270px,1fr) auto minmax(88px,1fr)!important;
  grid-template-rows:55px!important;
  align-items:center!important;
  gap:18px!important;
  overflow:visible!important;
  color:var(--ink)!important;
  background:color-mix(in srgb,var(--brand) 92%,transparent)!important;
  border:0!important;
  border-bottom:1px solid color-mix(in srgb,var(--line) 80%,transparent)!important;
  box-shadow:none!important;
}
.site-header.logged-out{grid-template-columns:1fr!important}

.horizon-brand-link{
  min-width:0!important;
  width:max-content!important;
  max-width:100%!important;
  height:54px!important;
  display:flex!important;
  align-items:center!important;
  color:inherit!important;
  text-decoration:none!important;
}

.primary-nav{
  grid-column:2!important;
  grid-row:1!important;
  min-width:0!important;
  height:55px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:18px!important;
  overflow:visible!important;
  scrollbar-width:none!important;
}
.primary-nav::-webkit-scrollbar{display:none!important}
.primary-nav a{
  position:relative!important;
  min-width:0!important;
  height:42px!important;
  padding:0 6px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border-radius:0!important;
  color:var(--muted)!important;
  background:transparent!important;
  text-decoration:none!important;
  font-size:clamp(.82rem,var(--nav-size),1rem)!important;
  font-weight:760!important;
  white-space:nowrap!important;
}
.primary-nav a:hover,.primary-nav a.nav-active{color:var(--ink)!important;background:transparent!important}
.primary-nav a::after{
  content:""!important;
  position:absolute!important;
  left:6px!important;
  right:6px!important;
  bottom:-7px!important;
  height:3px!important;
  border-radius:3px!important;
  background:transparent!important;
}
.primary-nav a.nav-active::after{background:var(--brand2)!important}
.primary-nav .horizon-icon{width:18px!important;height:18px!important;flex:0 0 18px!important;color:var(--brand2)!important}

.header-actions{
  grid-column:3!important;
  grid-row:1!important;
  min-width:max-content!important;
  height:55px!important;
  justify-self:end!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  overflow:visible!important;
}

.site-footer{
  box-sizing:border-box!important;
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  height:65px!important;
  min-height:65px!important;
  max-height:65px!important;
  margin:0!important;
  padding:5px clamp(14px,2.4vw,34px)!important;
  display:grid!important;
  grid-template-columns:auto 1fr!important;
  grid-template-rows:55px!important;
  align-items:center!important;
  gap:18px!important;
  overflow:hidden!important;
  color:var(--muted)!important;
  background:color-mix(in srgb,var(--brand) 92%,transparent)!important;
  border:0!important;
  border-top:1px solid color-mix(in srgb,var(--line) 80%,transparent)!important;
}
.horizon-footer-brand{
  min-width:0!important;
  height:54px!important;
  display:flex!important;
  align-items:center!important;
}
.site-footer nav{
  min-width:0!important;
  justify-self:end!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:5px 14px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}
.site-footer a{
  min-height:28px!important;
  display:inline-flex!important;
  align-items:center!important;
  color:var(--brand2)!important;
  font-size:.70rem!important;
  font-weight:720!important;
  text-underline-offset:3px!important;
  white-space:nowrap!important;
}
.footer-current-name{font-weight:500!important;color:var(--muted)!important}

@media(max-width:900px){
  .site-header{
    grid-template-columns:minmax(230px,1fr) auto minmax(82px,auto)!important;
    gap:10px!important;
    padding-inline:12px!important;
  }
  .primary-nav{gap:10px!important}
  .primary-nav a{font-size:.78rem!important;padding-inline:4px!important}
  .site-footer{padding-inline:12px!important;gap:10px!important}
  .site-footer nav{gap:4px 10px!important}
  .site-footer a{font-size:.60rem!important}
  .footer-current-name{display:none!important}
}

/* 65px still stays fixed on phone; the same three Drive destinations become icon-compact. */
@media(max-width:620px){
  .site-header{grid-template-columns:auto 1fr auto!important;gap:6px!important;padding:5px 8px!important}
  .horizon-brand-link{height:48px!important}
  .primary-nav{height:55px!important;gap:4px!important}
  .primary-nav a{width:29px!important;height:38px!important;padding:0!important;gap:0!important}
  .primary-nav a span{
    position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
    overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
  }
  .primary-nav a::after{left:3px!important;right:3px!important;bottom:-5px!important}
  .primary-nav .horizon-icon{width:17px!important;height:17px!important;flex-basis:17px!important}
  .header-actions{height:55px!important;gap:5px!important}
  .display-settings-trigger,.profile-menu-trigger{
    width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;
  }
  .profile-initial{width:29px!important;height:29px!important}
  .site-footer{grid-template-columns:auto 1fr!important;gap:7px!important;padding:5px 8px!important}
  .site-footer nav{gap:3px 7px!important}
  .site-footer a{font-size:.52rem!important;min-height:24px!important}
}
@media(max-width:360px){
  .site-footer nav{gap:3px 5px!important}
  .site-footer a{font-size:.47rem!important}
}

/* ========================================================================
   Horizon Drive approved footer color restore — 2026-08-22
   Keep footer as a branded Horizon surface in both appearance modes. This
   intentionally wins over older Travel-family footer rules in drive.css.
   ======================================================================== */
html[data-theme="dark"] .site-footer,
html[data-theme="light"] .site-footer,
.site-footer{
  background:#0b1d34!important;
  color:#dbe8f6!important;
  border-top:1px solid color-mix(in srgb,var(--brand2) 28%,transparent)!important;
}
.site-footer a{
  color:color-mix(in srgb,var(--brand2) 68%,white)!important;
}
.site-footer .footer-current-name{
  color:rgba(219,232,246,.68)!important;
}


/* Final footer color lock — 2026-08-22.
   --brand is a light text token in some theme states, so never use it as the
   footer surface. Keep the footer dark Horizon navy in every appearance mode. */
html[data-theme="dark"] body .site-footer,
html[data-theme="light"] body .site-footer,
body .site-footer{
  background:#0b1d34!important;
  background-color:#0b1d34!important;
  color:#dbe8f6!important;
  border-top:1px solid #244765!important;
}
body .site-footer .horizon-family-tagline{color:#eef4fb!important}
body .site-footer .horizon-family-name{
  --horizon-family-start:#f3f6f9;
  --horizon-family-mid:#d8ecf1;
  --horizon-family-end:#74c6dc;
}
body .site-footer a{color:#78a9ff!important}
body .site-footer .footer-current-name{color:#93a8bd!important}