/* Adventure Builder Build 131 — Section 11 visual polish
   Global, low-risk finishing layer loaded after all feature styles. */
:root {
  --ab-bg: #071312;
  --ab-surface: #0d211f;
  --ab-surface-2: #12302d;
  --ab-surface-3: #183b37;
  --ab-text: #f4fbfa;
  --ab-muted: #b6cbc8;
  --ab-border: rgba(210, 242, 237, .16);
  --ab-accent: #32d6bd;
  --ab-accent-strong: #20bfa8;
  --ab-warm: #f4b860;
  --ab-danger: #ff7d7d;
  --ab-radius-sm: 12px;
  --ab-radius: 18px;
  --ab-radius-lg: 26px;
  --ab-shadow: 0 18px 46px rgba(0, 0, 0, .26);
  --ab-shadow-soft: 0 10px 30px rgba(0, 0, 0, .18);
  --ab-tap: 48px;
  --ab-page-pad: clamp(16px, 3vw, 32px);
}

html { scroll-behavior: smooth; color-scheme: dark; }
body {
  background: var(--ab-bg);
  color: var(--ab-text);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body, button, input, select, textarea { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }

main > section,
main > .planning-hub,
main > .nearby-essentials,
main > .explore-around-section {
  scroll-margin-top: 88px;
}

.site-header {
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  border-bottom: 1px solid var(--ab-border);
  box-shadow: 0 10px 34px rgba(0,0,0,.2);
}

.brand-mark {
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 8px 24px rgba(50,214,189,.22);
}

button, a, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
button, [role="button"], .primary-button, .secondary-button, .text-button,
.home-v117-action, .header-signup, .saved-button, .menu-button {
  min-height: var(--ab-tap);
  border-radius: var(--ab-radius-sm);
  transition: transform .16s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease, opacity .2s ease;
}
button:not(:disabled):active, [role="button"]:active, a.home-v117-action:active { transform: translateY(1px) scale(.985); }
button:disabled, [aria-disabled="true"] { opacity: .5; cursor: not-allowed; filter: saturate(.65); }

:where(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid rgba(50, 214, 189, .72);
  outline-offset: 3px;
}
body:not(.using-keyboard) :where(button, a, input, select, textarea, summary):focus { outline: none; }

input, select, textarea {
  min-height: 48px;
  color: var(--ab-text);
  background: rgba(5, 18, 17, .72);
  border: 1px solid var(--ab-border);
  border-radius: var(--ab-radius-sm);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}
textarea { min-height: 112px; resize: vertical; }
input::placeholder, textarea::placeholder { color: rgba(214, 232, 229, .56); }
input:focus, select:focus, textarea:focus { border-color: rgba(50,214,189,.7); box-shadow: 0 0 0 4px rgba(50,214,189,.12); }

.overline {
  color: var(--ab-accent);
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.section-heading h2, section > header h2, .planning-hub-heading h2 { letter-spacing: -.025em; line-height: 1.08; }
.section-heading p, section > header p, .field-note { color: var(--ab-muted); }

/* Bring older feature cards into one shared visual language without changing layout. */
:where(.my-adventures-card, .adventure-stat, .europe-progress-card, .europe-next-card,
.nearby-essentials, .ai-planner-section, .explore-around-section, .community-card,
.stay-card, .tool-card, .destination-card, .planner-card, .journal-card,
.route-option-card, .medical-card, .roadmap-card) {
  border: 1px solid var(--ab-border);
  box-shadow: var(--ab-shadow-soft);
}

:where(.my-adventures-card, .europe-next-card, .nearby-essentials, .ai-planner-section,
.explore-around-section, .community-card, .stay-card, .tool-card, .destination-card,
.planner-card, .journal-card, .route-option-card, .medical-card, .roadmap-card) {
  border-radius: var(--ab-radius);
}

.empty-state, [data-empty-state], .ab-empty-state {
  padding: 24px;
  border: 1px dashed rgba(210,242,237,.25);
  border-radius: var(--ab-radius);
  background: rgba(13,33,31,.6);
  color: var(--ab-muted);
  text-align: center;
}

.app-menu {
  background: linear-gradient(180deg, rgba(13,33,31,.98), rgba(7,19,18,.99));
  border: 1px solid var(--ab-border);
  box-shadow: var(--ab-shadow);
}
.app-menu a, .app-menu button, .app-menu summary { border-radius: 12px; }
.app-menu a:hover, .app-menu button:hover, .app-menu summary:hover { background: rgba(50,214,189,.09); }
.app-menu-version { color: var(--ab-muted); }

.home-v117-content { isolation: isolate; }
.home-v117-actions { gap: 12px; }
.home-v117-action {
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: 0 12px 28px rgba(0,0,0,.22);
}
.home-v117-action:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0,0,0,.28); }

/* Dialog finish and mobile-safe spacing. */
dialog {
  color: var(--ab-text);
  border: 1px solid var(--ab-border);
  border-radius: var(--ab-radius-lg);
  box-shadow: 0 30px 80px rgba(0,0,0,.5);
}
dialog::backdrop { background: rgba(0, 8, 7, .72); backdrop-filter: blur(6px); }

.ab-is-loading { position: relative; pointer-events: none; }
.ab-is-loading::after {
  content: "";
  width: 18px;
  height: 18px;
  margin-left: 10px;
  display: inline-block;
  vertical-align: -3px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: ab-spin .7s linear infinite;
}
@keyframes ab-spin { to { transform: rotate(360deg); } }

.ab-page-enter { animation: ab-page-in .24s ease both; }
@keyframes ab-page-in { from { opacity: .72; transform: translateY(4px); } to { opacity: 1; transform: none; } }

@media (max-width: 760px) {
  :root { --ab-page-pad: 16px; --ab-radius: 16px; }
  main { padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
  .site-header { min-height: 64px; padding-left: max(12px, env(safe-area-inset-left)); padding-right: max(12px, env(safe-area-inset-right)); }
  .header-actions { gap: 8px; }
  .header-signup { display: none; }
  .home-v117-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-v117-action { min-width: 0; }
  dialog { width: calc(100% - 20px); max-height: calc(100dvh - 20px); margin: auto; }
  .app-menu { padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); }
}

@media (max-width: 390px) {
  .brand small { display: none; }
  .header-actions .saved-button { padding-inline: 10px; }
  .home-v117-actions { gap: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}