.autocomplete-host { position: relative; }
.place-suggestions { position: absolute; z-index: 1200; left: 20px; right: 0; top: calc(100% + 5px); padding: 5px; background: #fff; border: 1px solid #e4e7ec; border-radius: 12px; box-shadow: 0 14px 35px rgba(16,24,40,.14); }
.place-suggestions[hidden] { display: none; }
.place-suggestion { width: 100%; border: 0; background: transparent; display: grid; grid-template-columns: 28px 1fr; gap: 7px; align-items: center; text-align: left; padding: 9px 8px; border-radius: 8px; cursor: pointer; color: #101828; }
.place-suggestion:hover, .place-suggestion.active { background: #f2f4f7; }
.suggestion-pin { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: #fff7e6; color: #dc6803; font-weight: 900; }
.place-suggestion strong, .place-suggestion small { display: block; }
.place-suggestion strong { font-size: .82rem; }
.place-suggestion small { margin-top: 2px; color: #667085; font-size: .7rem; }

/* Monitoring is the primary next action after a successful route check. */
.watch-cta { margin-top: 16px; padding: 18px; border: 2px solid #f79009; background: linear-gradient(135deg,#fffaeb 0%,#fff4d5 100%); box-shadow: 0 8px 22px rgba(247,144,9,.12); }
.watch-icon { width: 46px; height: 46px; font-size: 1.25rem; box-shadow: 0 2px 7px rgba(16,24,40,.08); }
.watch-copy strong { font-size: .94rem; }
.watch-copy span { margin-top: 3px; font-size: .78rem; line-height: 1.4; }
.watch-cta button { min-height: 46px; padding: 0 18px; border-radius: 11px; background: #f79009; color: #101828; font-size: .8rem; box-shadow: 0 3px 8px rgba(247,144,9,.22); }
.watch-cta button:hover { background: #fdb022; transform: translateY(-1px); }

@media (max-width: 720px) {
  .watch-cta { grid-template-columns: auto 1fr; padding: 15px; }
  .watch-cta button { grid-column: 1 / -1; width: 100%; }
  .place-suggestions { left: 20px; }
}
