/* Расписание: таблица рейсов и виджет расчёта рядом.
   На узком экране таблица прокручивается, а не сжимается: обрезанная таблица теряет
   последнюю колонку, а это и есть срок — то, ради чего её открыли. */
@layer theme.components {

.schedule { overflow-x: auto; margin-block-start: 22px; }
.schedule table { inline-size: 100%; border-collapse: collapse; font-size: var(--font-size-small); }
.schedule caption {
  margin-block-end: 10px;
  color: var(--color-text-muted);
  font-size: var(--font-size-caption);
  text-align: start;
}
.schedule th, .schedule td {
  padding: 10px 12px;
  border-block-end: 1px solid var(--color-border-row);
  text-align: start;
  white-space: nowrap;
}
.schedule thead th {
  background: var(--color-bg-table-head);
  color: var(--color-text-muted);
  font-size: var(--font-size-caption);
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: normal;
  vertical-align: bottom;
}
.schedule tbody th { font-weight: 600; }
.schedule__arrow { margin-inline: 6px; color: var(--color-text-subtle); }
.schedule__note { margin-block-start: 12px; color: var(--color-text-muted); font-size: var(--font-size-caption); }
.schedule__after { margin-block-start: 20px; }
.schedule__slot:empty { display: none; }
.schedule__price { font-weight: 600; color: var(--color-text); white-space: nowrap; }
/* Рейса в расписании нет: строка-подсказка, а не рейс. */
.schedule tr.is-missing td, .schedule tr.is-missing .schedule__price { color: var(--color-text-muted); font-weight: 400; }

}
/* Ни одного рейса — таблицы нет: заголовки без строк ничего не сообщают. */
.schedule:not(:has(tbody tr)) { display: none; }