/* =========================================================
   LONDON BABY APPLE GLASS HEADER — 2026-05-18
   Purpose: replace neon header language with a restrained,
   frosted, skyline-backed control surface matching the new
   Apple-quality lower card system. Functionality preserved.
========================================================= */
:root {
  --lb-header-ink: #0b1730;
  --lb-header-muted: rgba(20, 34, 60, .72);
  --lb-header-gold: #c99a33;
  --lb-header-glass: rgba(245, 250, 255, .58);
  --lb-header-glass-strong: rgba(255,255,255,.70);
  --lb-header-line: rgba(255,255,255,.58);
  --lb-header-shadow: 0 18px 42px rgba(40, 58, 88, .22), 0 3px 10px rgba(12, 22, 42, .12);
}

html body > .app-header.lb-floating-header,
html body .app-header {
  background-color: #dbe8f7 !important;
  background-image:
    linear-gradient(180deg, rgba(235, 245, 255, .86) 0%, rgba(229, 240, 252, .56) 33%, rgba(230, 241, 252, .28) 100%),
    linear-gradient(90deg, rgba(255,255,255,.58), rgba(255,255,255,.08) 42%, rgba(255,255,255,.52)),
    url('/assets/london-header-panorama-20260518.jpg') !important;
  background-size: cover, cover, cover !important;
  background-position: center, center, center bottom !important;
  border-bottom: 1px solid rgba(255,255,255,.60) !important;
  box-shadow: 0 12px 34px rgba(42, 56, 82, .18) !important;
  color: var(--lb-header-ink) !important;
  padding:
    max(10px, env(safe-area-inset-top))
    clamp(12px, 2vw, 24px)
    clamp(12px, 1.8vw, 20px) !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

html body > .app-header.lb-floating-header::before,
html body .app-header::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background:
    radial-gradient(circle at 50% 4%, rgba(255,255,255,.88), transparent 34%),
    radial-gradient(circle at 12% 20%, rgba(255,255,255,.40), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.04)) !important;
  backdrop-filter: blur(1px) saturate(1.02) !important;
  -webkit-backdrop-filter: blur(1px) saturate(1.02) !important;
}

html body > .app-header.lb-floating-header::after,
html body .app-header::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 46% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background: linear-gradient(180deg, transparent, rgba(238, 247, 255, .42) 58%, rgba(247, 251, 255, .72)) !important;
}

html body .app-header > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Remove prior neon logo ghosting and sparkle overlays. */
html body .app-header .header-row::before,
html body .app-header .header-row::after,
html body #app.app-shell > header.app-header .header-row::before,
html body #app.app-shell > header.app-header .header-row::after {
  content: none !important;
  display: none !important;
}

html body .app-header .header-logo-image { display: none !important; }

html body .app-header .header-row.apple-luxury-header-brand {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
  justify-items: center !important;
  width: min(1120px, 100%) !important;
  margin: 0 auto clamp(8px, 1.3vw, 14px) !important;
  padding: clamp(6px, 1.2vw, 12px) clamp(8px, 1.4vw, 16px) 0 !important;
  min-height: auto !important;
}

.apple-luxury-brand-lockup {
  grid-column: 2 !important;
  text-align: center !important;
  color: var(--lb-header-ink) !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.75) !important;
}

.apple-luxury-crown {
  font-size: clamp(22px, 4.4vw, 34px) !important;
  line-height: .86 !important;
  color: var(--lb-header-ink) !important;
  opacity: .92 !important;
  margin-bottom: clamp(2px, .8vw, 5px) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  font-weight: 400 !important;
}

.apple-luxury-title {
  font-family: Georgia, 'Times New Roman', serif !important;
  font-size: clamp(28px, 6.2vw, 55px) !important;
  line-height: .98 !important;
  letter-spacing: .135em !important;
  font-weight: 400 !important;
  color: var(--lb-header-ink) !important;
  white-space: nowrap !important;
}
.apple-luxury-title-baby { color: var(--lb-header-gold) !important; }
.apple-luxury-subtitle {
  margin-top: clamp(4px, 1vw, 7px) !important;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', system-ui, sans-serif !important;
  color: rgba(11, 23, 48, .74) !important;
  font-size: clamp(9px, 2.1vw, 13px) !important;
  font-weight: 800 !important;
  letter-spacing: .32em !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

html body .app-header .date-lockup.apple-luxury-trip-dates {
  grid-column: 3 !important;
  justify-self: end !important;
  align-self: start !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  color: rgba(11, 23, 48, .62) !important;
  font-size: clamp(9px, 1.35vw, 12px) !important;
  font-weight: 850 !important;
  letter-spacing: .26em !important;
  background: rgba(255,255,255,.32) !important;
  border: 1px solid rgba(255,255,255,.46) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.60), 0 8px 18px rgba(65, 88, 126, .10) !important;
  backdrop-filter: blur(12px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.04) !important;
  text-shadow: none !important;
  white-space: nowrap !important;
}

/* Day navigation becomes a frosted segmented control. */
html body .app-header .day-tabs {
  width: min(920px, calc(100% - 16px)) !important;
  max-width: 920px !important;
  margin: 0 auto clamp(10px, 1.5vw, 16px) !important;
  padding: 7px !important;
  display: flex !important;
  gap: 7px !important;
  align-items: center !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.58), rgba(245,249,255,.36)) !important;
  border: 1px solid rgba(255,255,255,.62) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    inset 0 -14px 28px rgba(128, 153, 188, .10),
    0 14px 30px rgba(54, 76, 112, .18) !important;
  backdrop-filter: blur(18px) saturate(1.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.10) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
html body .app-header .day-tabs::-webkit-scrollbar { display: none !important; }
html body .app-header .day-tabs button {
  min-height: 42px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 10px 16px !important;
  flex: 0 0 auto !important;
  color: rgba(11, 23, 48, .68) !important;
  background: transparent !important;
  box-shadow: none !important;
  text-shadow: none !important;
  font-weight: 850 !important;
  letter-spacing: -.015em !important;
  font-size: clamp(13px, 2.4vw, 16px) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body .app-header .day-tabs button.active,
html body .app-header .day-tabs button[aria-selected="true"] {
  color: var(--lb-header-ink) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.95), transparent 64%),
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(244,249,255,.70)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.92),
    0 8px 18px rgba(62, 87, 125, .18),
    0 0 0 1px rgba(255,255,255,.55) !important;
}

/* Main action buttons become quiet glass tiles instead of neon capsules. */
html body .trip-map-launch-wrap.launch-glass-nav {
  width: min(920px, calc(100% - 16px)) !important;
  max-width: 920px !important;
  margin: 0 auto !important;
  padding: 0 0 clamp(3px, .8vw, 8px) !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(7px, 1.5vw, 12px) !important;
}
html body .trip-map-launch.launch-glass-button,
html body .trip-map-launch.nearby-concierge-launch.launch-glass-button,
html body .trip-map-launch.at-a-glance-launch.launch-glass-button,
html body .trip-map-launch.ask-chat-launch.launch-glass-button {
  min-height: clamp(72px, 10vw, 94px) !important;
  padding: clamp(9px, 1.5vw, 14px) 7px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 22px !important;
  color: var(--lb-header-ink) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.74), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.50), rgba(235,243,253,.32)) !important;
  border: 1px solid rgba(255,255,255,.58) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    inset 0 -20px 36px rgba(115, 142, 180, .10),
    0 12px 28px rgba(46, 69, 104, .16) !important;
  backdrop-filter: blur(18px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.05) !important;
  text-shadow: none !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: .04em !important;
  overflow: hidden !important;
}
html body .trip-map-launch.launch-glass-button::before,
html body .trip-map-launch.launch-glass-button::after { display: none !important; content: none !important; }
html body .trip-map-launch.launch-glass-button .launch-icon {
  width: 31px !important;
  height: 31px !important;
  flex: 0 0 31px !important;
  border-radius: 999px !important;
  color: var(--lb-header-ink) !important;
  background: rgba(255,255,255,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.62), 0 6px 14px rgba(49, 70, 104, .12) !important;
}
html body .trip-map-launch.launch-glass-button .launch-svg {
  width: 60% !important;
  height: 60% !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.85 !important;
  filter: none !important;
}
html body .trip-map-launch.launch-glass-button .launch-label {
  color: var(--lb-header-ink) !important;
  font-size: clamp(9px, 1.9vw, 12px) !important;
  font-weight: 850 !important;
  letter-spacing: .06em !important;
  white-space: nowrap !important;
  text-transform: uppercase !important;
  transform: none !important;
}
html body .trip-map-launch.launch-glass-button:active {
  transform: translateY(1px) scale(.985) !important;
}
html body .trip-map-launch.at-a-glance-launch {
  border-color: rgba(148, 205, 255, .80) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    0 0 0 1px rgba(131, 202, 255, .48),
    0 0 22px rgba(120, 195, 255, .28),
    0 12px 28px rgba(46, 69, 104, .16) !important;
}

@media (max-width: 700px) {
  html body > .app-header.lb-floating-header,
  html body .app-header {
    padding:
      max(8px, env(safe-area-inset-top))
      10px
      11px !important;
    background-size: cover, cover, auto 100% !important;
    background-position: center, center, center bottom !important;
  }
  html body .app-header .header-row.apple-luxury-header-brand {
    grid-template-columns: 1fr !important;
    padding-top: 4px !important;
    margin-bottom: 8px !important;
  }
  .apple-luxury-brand-lockup { grid-column: 1 !important; }
  .apple-luxury-crown { font-size: 22px !important; margin-bottom: 2px !important; }
  .apple-luxury-title {
    font-size: clamp(26px, 8.4vw, 36px) !important;
    letter-spacing: .12em !important;
  }
  .apple-luxury-subtitle {
    font-size: clamp(8px, 2.5vw, 10px) !important;
    letter-spacing: .24em !important;
  }
  html body .app-header .date-lockup.apple-luxury-trip-dates {
    display: none !important;
  }
  html body .app-header .day-tabs {
    width: calc(100% - 8px) !important;
    padding: 6px !important;
    gap: 6px !important;
    margin-bottom: 9px !important;
  }
  html body .app-header .day-tabs button {
    min-height: 38px !important;
    padding: 9px 14px !important;
    font-size: 14px !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav {
    width: calc(100% - 8px) !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }
  html body .trip-map-launch.launch-glass-button,
  html body .trip-map-launch.nearby-concierge-launch.launch-glass-button,
  html body .trip-map-launch.at-a-glance-launch.launch-glass-button,
  html body .trip-map-launch.ask-chat-launch.launch-glass-button {
    min-height: 68px !important;
    border-radius: 18px !important;
    padding: 9px 4px !important;
    gap: 6px !important;
  }
  html body .trip-map-launch.launch-glass-button .launch-icon {
    width: 28px !important;
    height: 28px !important;
    flex-basis: 28px !important;
  }
  html body .trip-map-launch.launch-glass-button .launch-label {
    font-size: clamp(8px, 2.45vw, 10px) !important;
    letter-spacing: .025em !important;
  }
}

@media (max-width: 390px) {
  .apple-luxury-title { font-size: clamp(24px, 7.6vw, 30px) !important; }
  .apple-luxury-subtitle { letter-spacing: .18em !important; }
  html body .trip-map-launch.launch-glass-button .launch-label { font-size: 8px !important; }
  html body .trip-map-launch.launch-glass-button .launch-icon { width: 25px !important; height: 25px !important; flex-basis: 25px !important; }
  html body .trip-map-launch.launch-glass-button,
  html body .trip-map-launch.nearby-concierge-launch.launch-glass-button,
  html body .trip-map-launch.at-a-glance-launch.launch-glass-button,
  html body .trip-map-launch.ask-chat-launch.launch-glass-button { min-height: 62px !important; }
}

/* =========================================================
   HEADER ACTION BUTTON UNIFORMITY PATCH — 2026-05-18 B
   Purpose: make Trip Map / Concierge / At a Glance / Ask Chat
   visually uniform on iPhone. Preserves all functionality.
========================================================= */
html body .trip-map-launch-wrap.launch-glass-nav {
  align-items: stretch !important;
}
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
  aspect-ratio: auto !important;
  display: grid !important;
  grid-template-rows: 31px auto !important;
  place-items: center !important;
  justify-items: center !important;
  align-items: center !important;
  text-align: center !important;
  column-gap: 0 !important;
  row-gap: 7px !important;
  color: var(--lb-header-ink) !important;
}
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-icon,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button .launch-icon,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button .launch-icon,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-icon {
  grid-row: 1 !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  color: var(--lb-header-ink) !important;
  opacity: .96 !important;
}
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-label,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button .launch-label,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button .launch-label,
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-label {
  grid-row: 2 !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--lb-header-ink) !important;
  opacity: .98 !important;
  text-align: center !important;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Inter', system-ui, sans-serif !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
  letter-spacing: .02em !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
  transform: none !important;
}
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-label {
  color: var(--lb-header-ink) !important;
}
html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-svg * {
  stroke: currentColor !important;
}

@media (max-width: 700px) {
  html body .trip-map-launch-wrap.launch-glass-nav {
    width: calc(100% - 8px) !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button {
    min-height: 72px !important;
    height: 72px !important;
    border-radius: 18px !important;
    padding: 10px 3px 9px !important;
    grid-template-rows: 29px 12px !important;
    row-gap: 7px !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-icon,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button .launch-icon,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button .launch-icon,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-icon {
    width: 29px !important;
    height: 29px !important;
    min-width: 29px !important;
    min-height: 29px !important;
    flex: none !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-label,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button .launch-label,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button .launch-label,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-label {
    font-size: clamp(7.7px, 2.08vw, 9.2px) !important;
    letter-spacing: .005em !important;
  }
}

@media (max-width: 390px) {
  html body .trip-map-launch-wrap.launch-glass-nav {
    gap: 6px !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button {
    min-height: 68px !important;
    height: 68px !important;
    padding: 9px 2px 8px !important;
    grid-template-rows: 27px 11px !important;
    row-gap: 6px !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-icon,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button .launch-icon,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button .launch-icon,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-icon {
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    min-height: 27px !important;
  }
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.launch-glass-button .launch-label,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.nearby-concierge-launch.launch-glass-button .launch-label,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.at-a-glance-launch.launch-glass-button .launch-label,
  html body .trip-map-launch-wrap.launch-glass-nav > .trip-map-launch.ask-chat-launch.launch-glass-button .launch-label {
    font-size: 7.5px !important;
    letter-spacing: 0 !important;
  }
}