.public-transport-tracking-modal {
  --tracking-surface: #fff;
  --tracking-page: #f4f6f5;
  --tracking-text: #18231e;
  --tracking-muted: #63706a;
  --tracking-border: #dce7e0;
  --tracking-green: #1f7a52;
  --tracking-green-dark: #17603f;
  --tracking-green-soft: #e7f3ec;
  --tracking-danger: #b3202f;
  color-scheme: light;
}

.public-transport-tracking-modal .modal-dialog { width: min(100% - 1rem, 600px); max-width: 600px; }
.public-transport-tracking-modal .modal-content {
  max-height: calc(100dvh - 2rem);
  overflow: hidden;
  border: 1px solid var(--tracking-border);
  border-radius: 16px;
  background: var(--tracking-surface);
  color: var(--tracking-text);
  box-shadow: 0 24px 70px rgb(10 18 14 / 22%);
}
.public-transport-tracking-modal .modal-header { align-items: flex-start; gap: .75rem; padding: 1rem 1.1rem; border-color: var(--tracking-border); }
.public-transport-tracking-modal__heading { display: flex; min-width: 0; align-items: center; gap: .75rem; }
.public-transport-tracking-modal__icon { display: grid; width: 40px; height: 40px; flex: 0 0 auto; place-items: center; border-radius: 11px; background: var(--tracking-green-soft); color: var(--tracking-green-dark); }
.public-transport-tracking-modal__eyebrow { margin: 0 0 .15rem; color: var(--tracking-green-dark); font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.public-transport-tracking-modal .modal-title { margin: 0; font-size: 1.15rem; font-weight: 700; line-height: 1.25; }
.public-transport-tracking-modal .modal-body { overflow-y: auto; overscroll-behavior: contain; padding: 1rem 1.1rem; }
.public-transport-tracking-modal__description { margin: 0 0 1rem; color: var(--tracking-muted); font-size: .9rem; line-height: 1.5; }
.public-transport-tracking-modal__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; }
.public-transport-tracking-modal__field { display: grid; min-width: 0; gap: .35rem; }
.public-transport-tracking-modal__field label { font-size: .85rem; font-weight: 600; }
.public-transport-tracking-modal__field .form-control { min-height: 46px; border-color: #7b8780; border-radius: 10px; color: var(--tracking-text); font: inherit; font-size: 16px; }
.public-transport-tracking-modal__field .form-control:focus { border-color: var(--tracking-green); box-shadow: 0 0 0 .2rem rgb(31 122 82 / 18%); }
.public-transport-tracking-modal__field .form-control[aria-invalid="true"] { border-color: var(--tracking-danger); }
.public-transport-tracking-modal__error { margin: 0; color: var(--tracking-danger); font-size: .8rem; }
.public-transport-tracking-modal__message { margin: 0 0 .9rem; border: 1px solid var(--tracking-border); border-radius: 10px; padding: .7rem .8rem; background: var(--tracking-green-soft); color: var(--tracking-text); font-size: .875rem; }
.public-transport-tracking-modal__message[data-tone="error"] { border-color: #f3c6cc; background: #fdecee; color: #5b1119; }
.public-transport-tracking-modal__message[data-tone="warning"] { border-color: #f1dda3; background: #fff8e8; color: #5e3a00; }
.public-transport-tracking-modal__actions { position: sticky; bottom: 0; z-index: 2; display: flex; justify-content: flex-end; gap: .65rem; margin-top: 1.1rem; padding: .65rem 0 .15rem; background: var(--tracking-surface); }
.public-transport-tracking-modal__button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: .5rem; border: 1px solid transparent; border-radius: 10px; padding: .65rem 1rem; font: inherit; font-size: .9rem; font-weight: 600; }
.public-transport-tracking-modal__button:focus-visible { outline: 3px solid rgb(31 122 82 / 28%); outline-offset: 2px; }
.public-transport-tracking-modal__button:disabled { cursor: wait; opacity: .7; }
.public-transport-tracking-modal__button--primary { border-color: var(--tracking-green); background: var(--tracking-green); color: #fff; }
.public-transport-tracking-modal__button--primary:hover { border-color: var(--tracking-green-dark); background: var(--tracking-green-dark); color: #fff; }
.public-transport-tracking-modal__button--secondary { border-color: var(--tracking-border); background: var(--tracking-surface); color: var(--tracking-text); }
.public-transport-tracking-modal__button--secondary:hover { background: var(--tracking-page); }
.public-transport-tracking-modal__result { max-height: min(62vh, 520px); overflow-y: auto; overscroll-behavior: contain; }
.public-transport-tracking-modal__result-card { display: grid; gap: .85rem; border: 1px solid var(--tracking-border); border-radius: 12px; padding: .95rem; background: var(--tracking-surface); }
.public-transport-tracking-modal__result-head { display: flex; min-width: 0; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .6rem; }
.public-transport-tracking-modal__result-reference { margin: 0; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 1rem; font-weight: 700; }
.public-transport-tracking-modal__status { margin: 0; border: 1px solid #bfdccb; border-radius: 999px; padding: .3rem .65rem; background: var(--tracking-green-soft); color: var(--tracking-green-dark); font-size: .8rem; font-weight: 700; }
.public-transport-tracking-modal__progress { display: flex; justify-content: space-between; gap: .3rem; margin: 0; padding: 0; list-style: none; }
.public-transport-tracking-modal__progress li { flex: 1; min-width: 0; color: var(--tracking-muted); text-align: center; font-size: .66rem; }
.public-transport-tracking-modal__progress li::before { display: block; width: 1.5rem; height: 1.5rem; margin: 0 auto .25rem; border: 1px solid var(--tracking-border); border-radius: 50%; content: attr(data-step); line-height: 1.4rem; }
.public-transport-tracking-modal__progress li.is-active { color: var(--tracking-green-dark); font-weight: 700; }
.public-transport-tracking-modal__progress li.is-active::before { border-color: var(--tracking-green); background: var(--tracking-green); color: #fff; }
.public-transport-tracking-modal__details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: 0; }
.public-transport-tracking-modal__details div { min-width: 0; border: 1px solid var(--tracking-border); border-radius: 9px; padding: .6rem .7rem; }
.public-transport-tracking-modal__details dt { color: var(--tracking-muted); font-size: .72rem; }
.public-transport-tracking-modal__details dd { margin: .15rem 0 0; overflow-wrap: anywhere; font-size: .83rem; font-weight: 600; }
.public-transport-tracking-modal__privacy { margin: 0; color: var(--tracking-muted); font-size: .78rem; line-height: 1.45; }
.public-transport-tracking-modal__terminal { margin: 0; border: 1px solid var(--tracking-border); border-radius: 9px; padding: .65rem .75rem; background: var(--tracking-page); color: var(--tracking-muted); font-size: .82rem; }

html[data-bs-theme="dark"] .public-transport-tracking-modal {
  --tracking-surface: #16201a;
  --tracking-page: #0e1411;
  --tracking-text: #eaf1ed;
  --tracking-muted: #9aa9a1;
  --tracking-border: #26332b;
  --tracking-green: #1f7a52;
  --tracking-green-dark: #5fc592;
  --tracking-green-soft: #1c3327;
  --tracking-danger: #ff8c9b;
  color-scheme: dark;
}
html[data-bs-theme="dark"] .public-transport-tracking-modal__message[data-tone="error"] { border-color: #6b2a33; background: #2a1519; color: #ffd6db; }
html[data-bs-theme="dark"] .public-transport-tracking-modal__message[data-tone="warning"] { border-color: #705c2d; background: #403619; color: #ffe4ad; }
html[data-bs-theme="dark"] .public-transport-tracking-modal__status { border-color: #4db382; }
html[data-bs-theme="dark"] .public-transport-tracking-modal .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

@media (max-width: 575.98px) {
  .public-transport-tracking-modal .modal-dialog { width: calc(100% - 1.5rem); max-width: none; margin: .75rem auto; }
  .public-transport-tracking-modal .modal-content { max-height: calc(100dvh - 1.5rem); border-radius: 14px; }
  .public-transport-tracking-modal .modal-header,
  .public-transport-tracking-modal .modal-body { padding-right: .9rem; padding-left: .9rem; }
  .public-transport-tracking-modal__fields,
  .public-transport-tracking-modal__details { grid-template-columns: 1fr; }
  .public-transport-tracking-modal__actions { flex-direction: column-reverse; }
  .public-transport-tracking-modal__actions > button { width: 100%; min-height: 46px; }
}
