/* =========================================================
   London Baby 2026 - Module Architecture Repair Pass
   Scope: Trip Map, Concierge, At a Glance, Ask Chat
   Goal: preserve all IDs/JS/functionality while fixing the
   layout, contrast, spacing, and unified Apple-glass aesthetic.
========================================================= */

:root {
  --lb-ink: #07152b;
  --lb-ink-2: #22314a;
  --lb-muted: #647189;
  --lb-gold: #c99a2e;
  --lb-gold-line: rgba(201, 154, 46, .42);
  --lb-gold-line-strong: rgba(201, 154, 46, .70);
  --lb-glass-module: rgba(247, 251, 255, .88);
  --lb-glass-card: rgba(255, 255, 255, .78);
  --lb-module-shadow: 0 22px 60px rgba(22, 36, 58, .18), inset 0 1px 0 rgba(255,255,255,.92);
  --lb-card-shadow: 0 12px 30px rgba(22, 36, 58, .10), inset 0 1px 0 rgba(255,255,255,.90);
  --lb-radius-xl: 34px;
  --lb-radius-lg: 26px;
  --lb-radius-md: 18px;
}

/* The four module screens share one calm glass stage. */
html body .trip-map-backdrop,
html body .nearby-concierge-backdrop,
html body .at-a-glance-backdrop,
html body .ask-chat-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 9999 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: max(14px, env(safe-area-inset-top)) 12px max(14px, env(safe-area-inset-bottom)) !important;
  background:
    radial-gradient(circle at 50% -8%, rgba(255,255,255,.96), rgba(235,246,255,.82) 34%, rgba(214,228,241,.92) 100%) !important;
  color: var(--lb-ink) !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, system-ui, sans-serif !important;
}

html body .trip-map-backdrop[hidden],
html body .nearby-concierge-backdrop[hidden],
html body .at-a-glance-backdrop[hidden],
html body .ask-chat-backdrop[hidden] {
  display: none !important;
}

/* Real app-shell architecture: one scrollable panel per module. */
html body .trip-map-panel,
html body .nearby-concierge-panel,
html body .at-a-glance-panel,
html body .ask-chat-panel {
  position: relative !important;
  width: min(900px, calc(100vw - 24px)) !important;
  height: min(900px, calc(100dvh - max(30px, env(safe-area-inset-top)) - max(30px, env(safe-area-inset-bottom)))) !important;
  max-height: calc(100dvh - max(30px, env(safe-area-inset-top)) - max(30px, env(safe-area-inset-bottom))) !important;
  border-radius: var(--lb-radius-xl) !important;
  border: 1.5px solid var(--lb-gold-line) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(239,247,254,.88) 48%, rgba(229,239,248,.90)) !important;
  box-shadow: var(--lb-module-shadow) !important;
  color: var(--lb-ink) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Compact module mastheads. */
html body .trip-map-header,
html body .nearby-concierge-header,
html body .at-a-glance-header,
html body .ask-chat-header {
  flex: 0 0 auto !important;
  min-height: 118px !important;
  padding: 20px 22px 18px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 16px !important;
  border-bottom: 1px solid rgba(201,154,46,.25) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.90), rgba(246,251,255,.76)) !important;
  backdrop-filter: blur(18px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.05) !important;
  z-index: 20 !important;
}

html body .trip-map-header .eyebrow,
html body .nearby-concierge-header .eyebrow,
html body .at-a-glance-header .eyebrow,
html body .ask-chat-header .eyebrow {
  margin: 0 0 4px !important;
  color: var(--lb-muted) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 850 !important;
  letter-spacing: .20em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}

html body .trip-map-header h2,
html body .nearby-concierge-header h2,
html body .at-a-glance-header h2,
html body .ask-chat-header h2 {
  margin: 0 !important;
  color: var(--lb-ink) !important;
  font-size: clamp(36px, 8.5vw, 56px) !important;
  line-height: .95 !important;
  font-weight: 900 !important;
  letter-spacing: -.055em !important;
  text-shadow: none !important;
}

html body .trip-map-close,
html body .nearby-concierge-close,
html body .at-a-glance-close,
html body .ask-chat-close,
html body .ask-chat-new {
  border: 1.5px solid rgba(201,154,46,.42) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(235,244,252,.74)) !important;
  color: var(--lb-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 10px 24px rgba(22,36,58,.10) !important;
  text-shadow: none !important;
}

html body .trip-map-close,
html body .nearby-concierge-close,
html body .at-a-glance-close,
html body .ask-chat-close {
  width: 62px !important;
  height: 62px !important;
  min-width: 62px !important;
  min-height: 62px !important;
  border-radius: 999px !important;
  font-size: 40px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
}

/* Chips and tabs: always visible, centered, accessible contrast. */
html body .trip-map-legend,
html body .nearby-concierge-tabs,
html body .ask-chat-prompts,
html body .ask-chat-prompt-dock {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 68px !important;
  padding: 12px 18px !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  background: rgba(255,255,255,.52) !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(201,154,46,.22) !important;
  z-index: 12 !important;
}
html body .trip-map-legend::-webkit-scrollbar,
html body .nearby-concierge-tabs::-webkit-scrollbar,
html body .ask-chat-prompts::-webkit-scrollbar,
html body .ask-chat-prompt-dock::-webkit-scrollbar { display: none !important; }

html body .trip-map-legend-item,
html body .nearby-concierge-tabs button,
html body .ask-chat-prompts button,
html body .ask-chat-prompt-dock button {
  flex: 0 0 auto !important;
  min-height: 44px !important;
  border-radius: 999px !important;
  border: 1.25px solid rgba(201,154,46,.38) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(237,246,253,.76)) !important;
  color: var(--lb-ink) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  letter-spacing: .005em !important;
  line-height: 1.1 !important;
  padding: 10px 15px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 8px 16px rgba(22,36,58,.07) !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  opacity: 1 !important;
}

html body .trip-map-legend-item.active,
html body .trip-map-legend-item.is-active,
html body .trip-map-legend-item[aria-pressed="true"],
html body .nearby-concierge-tabs button.active,
html body .ask-chat-prompts button:active,
html body .ask-chat-prompt-dock button:active {
  color: var(--lb-ink) !important;
  border-color: var(--lb-gold-line-strong) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.84)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 0 0 0 1px rgba(201,154,46,.12), 0 10px 22px rgba(201,154,46,.10) !important;
}

/* Trip Map: keep controls visible, map framed, list usable underneath. */
html body .trip-map-panel {
  padding: 0 !important;
}
html body .trip-map {
  flex: 0 0 auto !important;
  height: min(48dvh, 520px) !important;
  min-height: 330px !important;
  margin: 14px 18px 0 !important;
  border-radius: 28px !important;
  border: 1.5px solid rgba(201,154,46,.50) !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.84) !important;
  box-shadow: var(--lb-card-shadow) !important;
  z-index: 1 !important;
}
html body .trip-map-list {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 14px 18px 22px !important;
  display: grid !important;
  gap: 12px !important;
  background: transparent !important;
  -webkit-overflow-scrolling: touch !important;
}
html body .trip-map-location-card {
  background: rgba(255,255,255,.82) !important;
  color: var(--lb-ink) !important;
  border: 1.25px solid rgba(201,154,46,.28) !important;
  border-radius: 24px !important;
  box-shadow: var(--lb-card-shadow) !important;
  padding: 16px !important;
}
html body .trip-map-location-card h3,
html body .trip-map-popup strong {
  color: var(--lb-ink) !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}
html body .trip-map-location-card p,
html body .trip-map-note,
html body .trip-map-popup p,
html body .trip-map-popup span {
  color: var(--lb-muted) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html body .leaflet-control-zoom a {
  color: var(--lb-ink) !important;
}

/* Concierge: same app language, no bright red CTA overrides inside module. */
html body .nearby-concierge-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 18px !important;
  display: grid !important;
  gap: 18px !important;
}
html body .nearby-concierge-hero-card,
html body .nearby-concierge-card {
  background: rgba(255,255,255,.82) !important;
  border: 1.25px solid rgba(201,154,46,.30) !important;
  border-radius: 28px !important;
  box-shadow: var(--lb-card-shadow) !important;
  color: var(--lb-ink) !important;
}
html body .nearby-concierge-hero-card a,
html body .nearby-concierge-card a {
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(237,246,253,.78)) !important;
  color: var(--lb-ink) !important;
  border: 1.5px solid rgba(201,154,46,.46) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 10px 22px rgba(22,36,58,.09) !important;
  text-shadow: none !important;
}
html body .nearby-concierge-kicker {
  color: var(--lb-muted) !important;
  opacity: 1 !important;
}
html body .nearby-concierge-hero-card h3,
html body .nearby-concierge-card-copy h3 {
  color: var(--lb-ink) !important;
  text-shadow: none !important;
}
html body .nearby-concierge-hero-card p,
html body .nearby-concierge-card-copy p {
  color: var(--lb-muted) !important;
  text-shadow: none !important;
}

/* At a Glance: premium itinerary dashboard, not purple flyer. */
html body .at-a-glance-content {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 20px 18px 24px !important;
  color: var(--lb-ink) !important;
  background: transparent !important;
}
html body .at-a-glance-day-title {
  color: var(--lb-ink) !important;
  font-weight: 900 !important;
  letter-spacing: -.025em !important;
  text-shadow: none !important;
}
html body .at-a-glance-day-theme {
  color: var(--lb-muted) !important;
  text-shadow: none !important;
}
html body .at-a-glance-item {
  display: grid !important;
  grid-template-columns: 76px 1fr !important;
  gap: 12px !important;
  background: rgba(255,255,255,.80) !important;
  border: 1.25px solid rgba(201,154,46,.28) !important;
  border-radius: 24px !important;
  box-shadow: var(--lb-card-shadow) !important;
  color: var(--lb-ink) !important;
}
html body .at-a-glance-time {
  color: var(--lb-gold) !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}
html body .at-a-glance-title {
  color: var(--lb-ink) !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}
html body .at-a-glance-meta {
  color: var(--lb-muted) !important;
  text-shadow: none !important;
}

/* Ask Chat: readable Apple-style assistant, not washed-out gradients. */
html body .ask-chat-panel {
  min-height: min(760px, calc(100dvh - 28px)) !important;
}
html body .ask-chat-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
html body .ask-chat-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 18px !important;
  background: transparent !important;
  -webkit-overflow-scrolling: touch !important;
}
html body .ask-chat-message {
  max-width: 90% !important;
  background: rgba(255,255,255,.84) !important;
  border: 1.25px solid rgba(201,154,46,.30) !important;
  color: var(--lb-ink) !important;
  border-radius: 24px !important;
  box-shadow: var(--lb-card-shadow) !important;
  text-shadow: none !important;
  font-weight: 720 !important;
}
html body .ask-chat-assistant,
html body .ask-chat-user {
  background: rgba(255,255,255,.84) !important;
  color: var(--lb-ink) !important;
}
html body .ask-chat-prompts {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  padding: 14px 0 0 !important;
  min-height: unset !important;
  border: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}
html body .ask-chat-prompts button {
  width: 100% !important;
  justify-content: center !important;
  min-height: 50px !important;
  color: var(--lb-ink) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(237,246,253,.78)) !important;
  border: 1.25px solid rgba(201,154,46,.38) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 8px 18px rgba(22,36,58,.08) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html body .ask-chat-prompt-dock {
  flex: 0 0 auto !important;
  min-height: 58px !important;
  padding: 10px 14px !important;
  background: rgba(255,255,255,.72) !important;
  border-top: 1px solid rgba(201,154,46,.24) !important;
  border-bottom: 0 !important;
  box-shadow: 0 -12px 30px rgba(22,36,58,.06) !important;
}
html body .ask-chat-prompt-dock button {
  color: var(--lb-ink) !important;
  min-height: 40px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(237,246,253,.78)) !important;
  border-color: rgba(201,154,46,.36) !important;
  text-shadow: none !important;
}
html body .ask-chat-form {
  flex: 0 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: end !important;
  padding: 12px 14px max(12px, env(safe-area-inset-bottom)) !important;
  background: rgba(247,251,255,.88) !important;
  border-top: 1px solid rgba(201,154,46,.26) !important;
  box-shadow: 0 -10px 24px rgba(22,36,58,.06) !important;
}
html body .ask-chat-form textarea {
  min-height: 54px !important;
  max-height: 128px !important;
  border-radius: 24px !important;
  color: var(--lb-ink) !important;
  background: rgba(255,255,255,.88) !important;
  border: 1.25px solid rgba(201,154,46,.36) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92) !important;
  text-shadow: none !important;
}
html body .ask-chat-form button,
html body .ask-chat-link-button {
  min-height: 54px !important;
  border-radius: 24px !important;
  color: var(--lb-ink) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(237,246,253,.78)) !important;
  border: 1.5px solid rgba(201,154,46,.46) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 8px 18px rgba(22,36,58,.08) !important;
  text-shadow: none !important;
}

@media (max-width: 720px) {
  html body .trip-map-backdrop,
  html body .nearby-concierge-backdrop,
  html body .at-a-glance-backdrop,
  html body .ask-chat-backdrop {
    padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom)) !important;
  }

  html body .trip-map-panel,
  html body .nearby-concierge-panel,
  html body .at-a-glance-panel,
  html body .ask-chat-panel {
    width: calc(100vw - 20px) !important;
    height: calc(100dvh - max(20px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))) !important;
    max-height: calc(100dvh - max(20px, env(safe-area-inset-top)) - max(20px, env(safe-area-inset-bottom))) !important;
    border-radius: 30px !important;
  }

  html body .trip-map-header,
  html body .nearby-concierge-header,
  html body .at-a-glance-header,
  html body .ask-chat-header {
    min-height: 106px !important;
    padding: 16px 18px 14px !important;
    gap: 12px !important;
  }

  html body .trip-map-header h2,
  html body .nearby-concierge-header h2,
  html body .at-a-glance-header h2,
  html body .ask-chat-header h2 {
    font-size: clamp(38px, 11vw, 52px) !important;
  }

  html body .trip-map-close,
  html body .nearby-concierge-close,
  html body .at-a-glance-close,
  html body .ask-chat-close {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    font-size: 38px !important;
  }

  html body .ask-chat-new {
    min-width: 68px !important;
    height: 58px !important;
    padding: 0 16px !important;
  }

  html body .trip-map-legend,
  html body .nearby-concierge-tabs {
    min-height: 62px !important;
    padding: 10px 14px !important;
  }

  html body .trip-map {
    height: min(43dvh, 400px) !important;
    min-height: 300px !important;
    margin: 12px 14px 0 !important;
    border-radius: 24px !important;
  }

  html body .trip-map-list,
  html body .nearby-concierge-content,
  html body .at-a-glance-content,
  html body .ask-chat-body {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  html body .nearby-concierge-content {
    gap: 14px !important;
  }

  html body .nearby-concierge-hero-card h3,
  html body .nearby-concierge-card-copy h3 {
    font-size: clamp(26px, 7.5vw, 38px) !important;
    letter-spacing: -.05em !important;
  }

  html body .at-a-glance-item {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    padding: 13px 14px !important;
  }

  html body .ask-chat-message {
    max-width: 94% !important;
  }
}

@media (min-width: 860px) {
  html body .trip-map-panel,
  html body .nearby-concierge-panel,
  html body .at-a-glance-panel,
  html body .ask-chat-panel {
    width: min(980px, calc(100vw - 48px)) !important;
  }
}