/* Fares Profile v27 — shared responsive, modal, safe-area and accessibility refinements. */
:root {
  --v27-safe-bottom: env(safe-area-inset-bottom, 0px);
  --v27-safe-top: env(safe-area-inset-top, 0px);
}

/* Keep the last interactive control fully reachable without creating a giant blank tail. */
body {
  padding-block-end: max(0px, var(--v27-safe-bottom));
}
main {
  min-block-size: calc(100svh - var(--header-height, 80px));
}

/* Central action feedback always floats above modal backdrops and mobile browser chrome. */
#fares-toast-root-v26 {
  z-index: 2147483600 !important;
  inset-block-end: calc(14px + var(--v27-safe-bottom)) !important;
  pointer-events: none;
}
.fares-toast-v26 { pointer-events: auto; }
.fares-toast-v26-close {
  min-inline-size: 44px !important;
  min-block-size: 44px !important;
}

/* Dialog containers are not focus targets; controls inside them retain visible focus. */
:where(.share-dialog, .feedback-dialog):focus { outline: none !important; }
:where(.share-dialog-panel, .feedback-dialog-panel) {
  background: color-mix(in srgb, var(--bg-elevated, #111827) 98%, #000) !important;
  opacity: 1;
}
html[data-theme="light"] :where(.share-dialog-panel, .feedback-dialog-panel) {
  color: #172033;
  background: #fff !important;
  border-color: rgba(36, 95, 197, .22) !important;
}

/* Share suggestion is compact and opaque, so selected text never bleeds through. */
.share-nudge {
  background: color-mix(in srgb, var(--bg-elevated, #111827) 98%, #000) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html[data-theme="light"] .share-nudge { background: #fff !important; }
.share-nudge-close {
  min-inline-size: 36px;
  min-block-size: 36px;
}

/* Snapchat is offered only when the runtime identifies a mobile share device. */
.share-mobile-only { display: none !important; }
html[data-mobile-share="true"] .share-mobile-only:not([hidden]) { display: flex !important; }

/* Desktop light-mode signal needs a little more definition, without altering mobile or dark mode. */
@media (min-width: 761px) {
  html[data-theme="light"] .hero-signal {
    filter: contrast(1.12) saturate(1.06);
  }
  html[data-theme="light"] .signal-ring {
    border-color: color-mix(in srgb, var(--accent) 42%, rgba(15, 23, 42, .14));
  }
  html[data-theme="light"] .signal-core {
    box-shadow: 0 18px 48px rgba(36, 95, 197, .18), inset 0 0 0 1px rgba(36, 95, 197, .16);
  }
}

/* Shared touch targets. */
:where(button, [role="button"], input[type="button"], input[type="submit"], a.share-profile, a.back-to-top) {
  min-block-size: 44px;
}

/* Fixed/sticky UI never hides the final content. */
.site-footer {
  padding-block-end: calc(20px + var(--v27-safe-bottom));
}

@media (max-width: 760px) {
  #fares-toast-root-v26 {
    inset-block-end: calc(10px + var(--v27-safe-bottom)) !important;
  }
  .share-dialog,
  .feedback-dialog {
    inline-size: calc(100vw - 20px) !important;
    max-inline-size: 520px !important;
    max-block-size: calc(var(--visual-viewport-height, 100dvh) - var(--v27-safe-top) - var(--v27-safe-bottom) - 16px) !important;
  }
  .share-dialog-panel,
  .feedback-dialog-panel {
    max-block-size: inherit !important;
    padding: 16px 14px !important;
    gap: 11px !important;
    border-radius: 20px !important;
  }
  .share-dialog-options {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    max-block-size: min(48dvh, 410px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .share-dialog-options button {
    min-block-size: 58px !important;
    padding: 9px 7px !important;
  }
  .feedback-dialog-panel h2 { font-size: clamp(1.35rem, 6.8vw, 1.85rem) !important; }
  .feedback-notes textarea {
    min-block-size: 78px !important;
    max-block-size: 25dvh !important;
  }
  .feedback-actions {
    position: sticky;
    inset-block-end: 0;
    padding-block-start: 8px;
    background: inherit;
  }
  .site-footer {
    padding-block: 22px calc(14px + var(--v27-safe-bottom)) !important;
  }
  .site-footer .container { gap: 14px !important; }
  .footer-meta { gap: 8px !important; }
  .footer-meta :where(.share-profile, .back-to-top) {
    min-block-size: 46px !important;
    padding-block: 9px !important;
  }
  .share-nudge {
    inset-inline: 10px !important;
    inline-size: auto !important;
    max-inline-size: none !important;
    inset-block-end: calc(10px + var(--v27-safe-bottom)) !important;
    padding: 12px 34px 12px 12px !important;
    gap: 9px !important;
  }
}

@media (max-width: 360px) {
  .share-dialog-options button { font-size: .78rem; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-signal { filter: none !important; }
}
