:root {
  --af-shell-nav-bg: rgba(255, 255, 255, .72);
  --af-shell-nav-border: rgba(226, 232, 240, .7);
  --af-shell-nav-shadow: 0 8px 32px rgba(15, 23, 42, .08);
  --af-shell-ease: cubic-bezier(.16, 1, .3, 1);
  --af-shell-nav-pad-x: clamp(14px, 4vw, 32px);
  --af-shell-brand-mark-size: 36px;
  --af-shell-brand-gap: 10px;
}

html.dark {
  --af-shell-nav-bg: rgba(10, 13, 22, .78);
  --af-shell-nav-border: rgba(255, 255, 255, .06);
  --af-shell-nav-shadow: 0 8px 32px rgba(0, 0, 0, .25);
}

body.af-pax-shell {
  padding-top: 68px !important;
  min-height: 100vh;
}

#navbar.af-pax-topbar,
#navbar.glass-nav {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  z-index: 1000 !important;
  height: 68px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: .75rem !important;
  padding: 0 var(--af-shell-nav-pad-x) !important;
  background: var(--af-shell-nav-bg) !important;
  border-bottom: none !important;
  backdrop-filter: blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
  transition: height .28s var(--af-shell-ease), box-shadow .28s var(--af-shell-ease), background-color .28s var(--af-shell-ease) !important;
}

#navbar.af-pax-topbar::after,
#navbar.glass-nav::after {
  content: none !important;
  display: none !important;
}

#navbar.af-pax-topbar.scrolled,
#navbar.glass-nav.scrolled {
  height: 60px !important;
  box-shadow: var(--af-shell-nav-shadow) !important;
}

#navbar.af-pax-topbar a,
#navbar.glass-nav a {
  text-decoration: none !important;
}

.af-pax-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: var(--af-shell-brand-gap) !important;
  height: 100% !important;
  color: inherit;
  text-decoration: none !important;
  min-width: 0;
  flex: 0 1 auto;
}

.af-pax-brand > img,
.af-pax-brand > div:first-child {
  width: var(--af-shell-brand-mark-size) !important;
  height: var(--af-shell-brand-mark-size) !important;
  flex: 0 0 var(--af-shell-brand-mark-size) !important;
}

.af-pax-brand > div:first-child {
  border-radius: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.af-pax-brand > div:last-child {
  justify-content: center !important;
}

.af-pax-nav-desktop .af-pax-nav-link-mobile,
.af-pax-nav-mobile .af-pax-nav-link-desktop {
  display: none !important;
}

.af-pax-nav-link {
  text-decoration: none !important;
  position: relative;
  white-space: nowrap;
}

.af-pax-nav-link:focus-visible,
#theme-toggle:focus-visible,
.global-lang-select:focus-visible + * {
  outline: 2px solid var(--theme-primary, #e11d48);
  outline-offset: 3px;
}

.af-pax-actions {
  flex-shrink: 0;
}

.af-passenger-footer {
  margin-top: auto;
  border-top: 1px solid rgba(226, 232, 240, .5);
  background: rgba(255, 255, 255, .72);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
}

html.dark .af-passenger-footer {
  border-top-color: rgba(255, 255, 255, .05);
  background: rgba(10, 13, 22, .78);
}

html.dark .af-legal-page {
  color: rgb(203, 213, 225);
}

html.dark .af-legal-page .prose,
html.dark .af-legal-page .text-slate-600,
html.dark .af-legal-page .text-slate-500 {
  color: rgb(203, 213, 225) !important;
}

html.dark .af-legal-page .text-slate-400 {
  color: rgb(148, 163, 184) !important;
}

html.dark .af-legal-page h1,
html.dark .af-legal-page h2,
html.dark .af-legal-page h3,
html.dark .af-legal-page strong,
html.dark .af-legal-page .text-slate-900 {
  color: rgb(248, 250, 252) !important;
}

html.dark .af-legal-page .bg-white,
html.dark .af-legal-page .bg-slate-100,
html.dark .af-legal-page .bg-slate-100\/50,
html.dark .af-legal-page .bg-blue-50\/50 {
  background-color: rgba(15, 23, 42, .72) !important;
}

html.dark .af-legal-page .bg-primary\/10 {
  background-color: color-mix(in srgb, var(--theme-primary, #e11d48) 16%, transparent) !important;
}

html.dark .af-legal-page .border-slate-100,
html.dark .af-legal-page .border-slate-200,
html.dark .af-legal-page .border-blue-100 {
  border-color: rgba(255, 255, 255, .08) !important;
}

html.dark .af-legal-page .shadow-sm {
  box-shadow: 0 18px 45px rgba(0, 0, 0, .18) !important;
}

html.dark .af-legal-page section h2 > span:first-child {
  border: 1px solid rgba(255, 255, 255, .08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

@media (max-width: 767px) {
  #navbar.af-pax-topbar,
  #navbar.glass-nav {
    --af-shell-nav-pad-x: 12px;
    --af-shell-brand-mark-size: 32px;
    --af-shell-brand-gap: 8px;
    padding-inline: 12px !important;
    gap: .35rem !important;
    height: 58px !important;
  }

  #navbar.af-pax-topbar.scrolled,
  #navbar.glass-nav.scrolled {
    height: 52px !important;
  }

  body.af-pax-shell {
    padding-top: 58px !important;
  }

  .af-pax-brand {
    max-width: 46px;
    overflow: hidden;
  }

  .af-pax-nav-mobile {
    max-width: calc(100vw - 160px) !important;
  }

  .af-lang-switcher {
    width: 32px !important;
    height: 32px !important;
  }

  .af-lang-switcher::after {
    content: "LANG";
    position: absolute;
    right: -5px;
    top: -6px;
    z-index: 11;
    pointer-events: none;
    padding: 1px 4px;
    border-radius: 999px;
    background: var(--theme-primary, #e11d48);
    color: #fff;
    font-size: 7px;
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: 0;
    box-shadow: 0 4px 10px rgba(15, 23, 42, .18);
  }
  
  .af-lang-switcher > div {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    justify-content: center !important;
    border-radius: 10px !important;
    background: rgba(226, 232, 240, 0.4) !important;
    border-color: rgba(226, 232, 240, 0.6) !important;
  }
  
  html.dark .af-lang-switcher > div {
    background: rgba(255, 255, 255, .05) !important;
    border-color: rgba(255, 255, 255, .08) !important;
  }

  .af-lang-switcher span.global-lang-display,
  .af-lang-switcher div.absolute {
    display: none !important;
  }

  .af-lang-switcher svg {
    width: 15px !important;
    height: 15px !important;
    margin: 0 !important;
  }

  #theme-toggle {
    width: 32px !important;
    height: 32px !important;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.8) !important;
    border-color: rgba(226, 232, 240, 0.6) !important;
  }
  
  html.dark #theme-toggle {
    background: rgba(255, 255, 255, .05) !important;
    border-color: rgba(255, 255, 255, .08) !important;
  }

  #theme-toggle svg {
    width: 14px !important;
    height: 14px !important;
  }
}