/* =========================================================
   London Baby 2026 - Unified Apple Glass Module System
   Scope: Trip Map, Concierge, At a Glance, Ask Chat ONLY.
   Purpose: visual redesign only. Does not change JS, IDs, data,
   event handlers, map setup, prompts, filters, forms, or links.
========================================================= */

:root {
  --lb-ink: #07152b;
  --lb-ink-2: #24314a;
  --lb-muted: #66738a;
  --lb-muted-2: #7d889b;
  --lb-gold: #c99a2e;
  --lb-gold-soft: rgba(201, 154, 46, .42);
  --lb-glass: rgba(248, 252, 255, .78);
  --lb-glass-strong: rgba(255,255,255,.88);
  --lb-glass-faint: rgba(255,255,255,.52);
  --lb-border: rgba(255,255,255,.72);
  --lb-line: rgba(201,154,46,.30);
  --lb-blue-glow: rgba(166, 207, 243, .30);
  --lb-panel-shadow: 0 26px 80px rgba(25, 38, 63, .24), 0 2px 0 rgba(255,255,255,.55) inset;
  --lb-card-shadow: 0 14px 34px rgba(30, 45, 70, .12), inset 0 1px 0 rgba(255,255,255,.86);
  --lb-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, system-ui, sans-serif;
}

/* Shared module backdrops */
html body .trip-map-backdrop,
html body .nearby-concierge-backdrop,
html body .at-a-glance-backdrop,
html body .ask-chat-backdrop {
  background:
    radial-gradient(circle at 50% -8%, rgba(255,255,255,.78), rgba(233,243,252,.58) 26%, rgba(214,229,243,.72) 58%, rgba(200,216,230,.78) 100%) !important;
  backdrop-filter: blur(18px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.05) !important;
  color: var(--lb-ink) !important;
  font-family: var(--lb-font) !important;
  padding: max(16px, env(safe-area-inset-top)) 14px max(18px, env(safe-area-inset-bottom)) !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; }

/* Shared module shells */
html body .trip-map-panel,
html body .nearby-concierge-panel,
html body .at-a-glance-panel,
html body .ask-chat-panel {
  width: min(760px, 100%) !important;
  max-width: min(760px, calc(100vw - 22px)) !important;
  height: auto !important;
  max-height: calc(100dvh - max(32px, env(safe-area-inset-top)) - max(32px, env(safe-area-inset-bottom))) !important;
  border-radius: 34px !important;
  border: 1.5px solid var(--lb-line) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(239,247,254,.78) 48%, rgba(232,241,249,.86)) !important;
  box-shadow: var(--lb-panel-shadow) !important;
  color: var(--lb-ink) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  isolation: isolate !important;
}

html body .trip-map-panel::before,
html body .nearby-concierge-panel::before,
html body .at-a-glance-panel::before,
html body .ask-chat-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.70), transparent 34%),
    radial-gradient(circle at 85% 10%, rgba(195,222,244,.42), transparent 38%);
  opacity: .9;
  z-index: -1;
}

/* Shared top headers */
html body .trip-map-header,
html body .nearby-concierge-header,
html body .at-a-glance-header,
html body .ask-chat-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 22px 22px 18px !important;
  border-bottom: 1px solid rgba(201,154,46,.22) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.86), rgba(246,251,255,.74)) !important;
  color: var(--lb-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88) !important;
  backdrop-filter: blur(18px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.05) !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 5px !important;
  color: var(--lb-muted) !important;
  opacity: 1 !important;
  text-transform: uppercase !important;
  letter-spacing: .19em !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  font-weight: 850 !important;
  text-shadow: none !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(34px, 9vw, 54px) !important;
  line-height: .92 !important;
  letter-spacing: -.055em !important;
  font-weight: 900 !important;
  text-shadow: none !important;
}

/* Shared close controls */
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 {
  flex: 0 0 auto !important;
  width: 60px !important;
  height: 60px !important;
  min-width: 60px !important;
  min-height: 60px !important;
  border-radius: 999px !important;
  border: 1.25px solid rgba(201,154,46,.34) !important;
  color: var(--lb-ink) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.82), rgba(230,240,249,.64)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.90),
    0 10px 24px rgba(20,35,58,.10) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 42px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  cursor: pointer !important;
}

html body .ask-chat-new {
  width: auto !important;
  min-width: 74px !important;
  padding: 0 18px !important;
  font-size: 17px !important;
  font-weight: 850 !important;
}

/* Shared internal scroll/content regions */
html body .trip-map-list,
html body .nearby-concierge-content,
html body .at-a-glance-content,
html body .ask-chat-body {
  background: transparent !important;
  color: var(--lb-ink) !important;
  -webkit-overflow-scrolling: touch !important;
}

html body .nearby-concierge-content,
html body .at-a-glance-content,
html body .ask-chat-body {
  padding: 18px 18px 24px !important;
  overflow: auto !important;
}

/* Shared pill/chip/tabs */
html body .trip-map-legend,
html body .nearby-concierge-tabs,
html body .ask-chat-prompts,
html body .ask-chat-prompt-dock {
  display: flex !important;
  gap: 10px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  padding: 14px 18px !important;
  background: rgba(255,255,255,.44) !important;
  border-bottom: 1px solid rgba(201,154,46,.18) !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,.32) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.84), rgba(233,243,252,.68)) !important;
  color: var(--lb-ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88), 0 8px 18px rgba(22,38,62,.08) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
  padding: 10px 15px !important;
  text-shadow: none !important;
  white-space: nowrap !important;
}

html body .nearby-concierge-tabs button.active,
html body .trip-map-legend-item.active,
html body .trip-map-legend-item[aria-pressed="true"] {
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,252,255,.84)) !important;
  border-color: rgba(201,154,46,.72) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 0 0 1px rgba(201,154,46,.14),
    0 12px 24px rgba(201,154,46,.12) !important;
  color: var(--lb-ink) !important;
}

/* Trip Map */
html body .trip-map-panel {
  padding: 0 !important;
}
html body .trip-map {
  height: min(56dvh, 620px) !important;
  min-height: 390px !important;
  margin: 16px 18px 0 !important;
  border-radius: 28px !important;
  border: 1.5px solid rgba(201,154,46,.42) !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.75) !important;
  box-shadow: var(--lb-card-shadow) !important;
}
html body .leaflet-container {
  font-family: var(--lb-font) !important;
}
html body .trip-map-list {
  display: grid !important;
  gap: 12px !important;
  padding: 16px 18px 24px !important;
  overflow: auto !important;
}
html body .trip-map-location-card,
html body .trip-map-popup,
html body .leaflet-popup-content-wrapper {
  background: rgba(255,255,255,.88) !important;
  color: var(--lb-ink) !important;
  border: 1px solid rgba(201,154,46,.22) !important;
  border-radius: 22px !important;
  box-shadow: var(--lb-card-shadow) !important;
}
html body .trip-map-location-card h3,
html body .trip-map-popup strong {
  color: var(--lb-ink) !important;
  font-weight: 900 !important;
}
html body .trip-map-location-top p,
html body .trip-map-note,
html body .trip-map-popup span,
html body .trip-map-popup p {
  color: var(--lb-muted) !important;
  opacity: 1 !important;
}
html body .trip-map-card-button,
html body .trip-map-popup a {
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(239,247,254,.78)) !important;
  color: var(--lb-ink) !important;
  border: 1.25px solid rgba(201,154,46,.42) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88), 0 8px 18px rgba(22,38,62,.10) !important;
}

/* Concierge */
html body .nearby-concierge-panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.90), rgba(238,247,254,.82)) !important;
}
html body .nearby-concierge-hero-card,
html body .nearby-concierge-card {
  background: rgba(255,255,255,.84) !important;
  border: 1.25px solid rgba(201,154,46,.24) !important;
  border-radius: 28px !important;
  box-shadow: var(--lb-card-shadow) !important;
  color: var(--lb-ink) !important;
}
html body .nearby-concierge-kicker {
  color: var(--lb-muted) !important;
  letter-spacing: .22em !important;
  font-size: 12px !important;
}
html body .nearby-concierge-hero-card h3,
html body .nearby-concierge-card-copy h3 {
  color: var(--lb-ink) !important;
  letter-spacing: -.055em !important;
  text-shadow: none !important;
}
html body .nearby-concierge-hero-card p,
html body .nearby-concierge-card-copy p {
  color: var(--lb-muted) !important;
  font-weight: 720 !important;
}
html body .nearby-concierge-icon {
  color: var(--lb-ink) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(232,242,250,.64)) !important;
  border: 1px solid rgba(201,154,46,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.84) !important;
}
html body .nearby-concierge-hero-card a,
html body .nearby-concierge-card a,
html body a[href*="maps.google.com"],
html body a[href*="google.com/maps"],
html body a[href*="maps.apple.com"] {
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(234,244,252,.76)) !important;
  color: var(--lb-ink) !important;
  border: 1.25px solid rgba(201,154,46,.44) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88), 0 10px 22px rgba(22,38,62,.10) !important;
  text-shadow: none !important;
}

/* At a Glance */
html body .at-a-glance-day-title {
  color: var(--lb-ink) !important;
  font-size: 1.15rem !important;
  font-weight: 900 !important;
  text-shadow: none !important;
  letter-spacing: -.02em !important;
}
html body .at-a-glance-day-theme {
  color: var(--lb-muted) !important;
  font-weight: 650 !important;
}
html body .at-a-glance-item {
  background: rgba(255,255,255,.82) !important;
  border: 1.25px solid rgba(201,154,46,.22) !important;
  border-radius: 22px !important;
  box-shadow: var(--lb-card-shadow) !important;
}
html body .at-a-glance-time {
  color: var(--lb-gold) !important;
  text-shadow: none !important;
  font-weight: 900 !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 */
html body .ask-chat-backdrop {
  align-items: stretch !important;
}
html body .ask-chat-panel {
  min-height: min(760px, calc(100dvh - 34px)) !important;
}
html body .ask-chat-header-actions {
  display: flex !important;
  gap: 10px !important;
  align-items: center !important;
}
html body .ask-chat-message {
  border-radius: 24px !important;
  border: 1.25px solid rgba(201,154,46,.22) !important;
  background: rgba(255,255,255,.82) !important;
  color: var(--lb-ink) !important;
  box-shadow: var(--lb-card-shadow) !important;
  text-shadow: none !important;
  font-weight: 720 !important;
}
html body .ask-chat-user {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(234,244,252,.80)) !important;
  color: var(--lb-ink) !important;
  border-color: rgba(201,154,46,.44) !important;
}
html body .ask-chat-assistant {
  background: rgba(255,255,255,.80) !important;
  color: var(--lb-ink) !important;
}
html body .ask-chat-form {
  border-top: 1px solid rgba(201,154,46,.22) !important;
  background: rgba(244,250,255,.84) !important;
  box-shadow: 0 -12px 30px rgba(45,62,86,.08) !important;
  backdrop-filter: blur(18px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.04) !important;
}
html body .ask-chat-form textarea {
  color: var(--lb-ink) !important;
  background: rgba(255,255,255,.82) !important;
  border: 1.25px solid rgba(201,154,46,.24) !important;
  border-radius: 24px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88) !important;
}
html body .ask-chat-form textarea::placeholder {
  color: rgba(7,21,43,.48) !important;
}
html body .ask-chat-form button,
html body .ask-chat-link-button {
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(232,242,251,.78)) !important;
  color: var(--lb-ink) !important;
  border: 1.25px solid rgba(201,154,46,.42) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.88), 0 10px 22px rgba(22,38,62,.10) !important;
  text-shadow: none !important;
}

/* Mobile sizing and preservation of functionality/scrolling */
@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(12px, env(safe-area-inset-bottom)) !important;
    align-items: stretch !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;
    max-width: calc(100vw - 20px) !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 {
    padding: 20px 18px 16px !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;
  }

  html body .trip-map {
    height: min(52dvh, 510px) !important;
    min-height: 360px !important;
    margin: 14px 14px 0 !important;
    border-radius: 26px !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-hero-card,
  html body .nearby-concierge-card,
  html body .at-a-glance-item,
  html body .trip-map-location-card,
  html body .ask-chat-message {
    border-radius: 24px !important;
  }

  html body .nearby-concierge-hero-card h3 {
    font-size: clamp(28px, 8vw, 40px) !important;
  }

  html body .nearby-concierge-card {
    grid-template-columns: 52px 1fr !important;
  }

  html body .at-a-glance-item {
    grid-template-columns: 76px 1fr !important;
    gap: 12px !important;
    padding: 13px 14px !important;
  }

  html body .ask-chat-form {
    padding: 12px 12px max(12px, env(safe-area-inset-bottom)) !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 {
    max-width: 900px !important;
  }
  html body .nearby-concierge-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}