/* tours.css — «Туры» (js/tours.js, tours-catalog.js, tours-bookings.js): фильтры выездов, группы по месяцам, полоса мест,
   карточка выезда, язык-вкладки в формах, участники в окне брони. Владелец — агент `front`.
   Правила: только var(--…) токены (tests/ui/test_ui_regulation.py), см. docs/THEMES.md. Состояние всегда несёт не только
   цвет: у полосы мест — цифры и слова («свободно N», «мест нет»), у заполненного языка — точка и подпись для скринридера. */

/* ---------- фильтры выездов ---------- */
.tr-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--s3); margin-bottom: var(--s4); }
.tr-filters .field { flex: 0 1 190px; min-width: 140px; }
.tr-filters .field[hidden] { display: none; }
.tr-stats { display: flex; flex-direction: column; gap: var(--s3); }
.tr-stats:not(:empty) { margin-bottom: var(--s5); }
.tr-countries .chips { list-style: none; margin: 0; padding: 0; gap: var(--s2); }
.tr-countries .chip { gap: var(--s2); padding: var(--s1) var(--s2); font-family: var(--font); font-size: var(--fs-sm); }
.tr-countries .chip b, .tr-by-route .chip b { font-family: var(--font-data); font-variant-numeric: tabular-nums; }
.tr-by-route > summary, .tr-adv > summary { cursor: pointer; font-weight: var(--fw-semibold); min-height: var(--control-h-sm);
  display: flex; align-items: center; gap: var(--s2); }
.tr-by-route > summary:focus-visible, .tr-adv > summary:focus-visible, .tr-people > summary:focus-visible {
  outline: var(--focus-w) solid var(--ring); outline-offset: var(--focus-offset); border-radius: var(--r-sm); }
.tr-by-route[open] > summary { margin-bottom: var(--s3); }

/* ---------- месяцы ---------- */
.tr-month + .tr-month { margin-top: var(--s5); }
.tr-month-title { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--s1) var(--s3);
  margin: 0 0 var(--s2); font-size: var(--fs-lg); }
.tr-month-title .small { font-weight: var(--fw-normal); font-variant-numeric: tabular-nums; }
.tr-table td { vertical-align: top; }
.tr-table td.num { white-space: nowrap; }
.tr-guide { overflow-wrap: anywhere; }

/* ---------- полоса мест ---------- */
.tr-seats { display: grid; gap: var(--s1); min-width: 150px; }
.tr-seats .bar { height: 8px; border: var(--border-w) solid var(--border); }
.tr-seats.big .bar { height: 12px; border-radius: var(--r-pill); }
.tr-seats.big .tr-seats-num { font-size: var(--fs-lg); }
.tr-seats .bar i { transition: width var(--dur) var(--ease); }
.tr-seats-num { font-size: var(--fs-sm); color: var(--fg-muted); font-variant-numeric: tabular-nums; }
.tr-seats-num b { color: var(--fg); font-family: var(--font-data); font-weight: var(--fw-semibold); }

/* ---------- карточка выезда ---------- */
.tr-dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: var(--s2) var(--s4); margin: 0; }
.tr-dl dt { color: var(--fg-muted); font-size: var(--fs-sm); }
.tr-dl dd { margin: 0; overflow-wrap: anywhere; }
.tr-info { padding: var(--s3); border: var(--border-w) solid var(--border); border-radius: var(--r); background: var(--surface-2); }
.tr-guide-add { margin-top: var(--s3); padding-top: var(--s3); border-top: var(--border-w) solid var(--border); }
.tr-guide-add .field { flex: 1 1 160px; }
.tr-guide-add .btn { flex: none; }
.tr-journal .tr-delta { font-family: var(--font-data); font-variant-numeric: tabular-nums; color: var(--success); }
.tr-people > summary { cursor: pointer; display: list-item; min-height: var(--control-h-sm); }
.tr-people ul { margin: var(--s1) 0 0; padding-left: var(--s4); }
.tr-people li { padding: 2px 0; overflow-wrap: anywhere; }
.row-actions .field.inline select { min-height: var(--control-h-sm); width: auto; padding-block: var(--s1); }

/* ---------- формы: языки, JSON, участники ---------- */
.tr-form { max-width: 960px; }
.tr-fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.tr-fieldset > legend { padding: 0; margin-bottom: var(--s1h); font-size: var(--fs-sm); font-weight: var(--fw-medium); }
.tr-i18n { display: flex; flex-direction: column; gap: var(--s3); }
.tr-i18n > .field[hidden], .tr-i18n .field[hidden] { display: none; }
.tr-langs { align-self: flex-start; }
.tr-langs .seg-btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--s1); min-width: 44px; }
.tr-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.tr-dot[hidden] { display: none; }
.tr-json { min-height: 120px; font-size: var(--fs-sm); line-height: 1.5; white-space: pre; overflow: auto; tab-size: 2; }
.tr-upper { text-transform: uppercase; }
.tr-narrow { flex: 0 1 120px !important; min-width: 96px; }
.tr-country-filter { width: 120px; }
.tr-push-left { margin-right: auto; }
.tr-name { font-size: var(--fs-md); font-weight: var(--fw-medium); text-align: left; text-decoration: none; color: var(--link); }
.tr-name:hover { text-decoration: underline; }
.tr-dep-filter { margin: 0 0 var(--s3); }
.tr-dep-filter .chip { gap: var(--s2); padding: var(--s1) var(--s2); font-family: var(--font); font-size: var(--fs-sm); }

.tr-people-edit { display: flex; flex-direction: column; gap: var(--s2); }
.tr-people-edit h3 { margin: 0; }
.tr-person { position: relative; min-width: 0; margin: 0; padding: var(--s3); border: var(--border-w) solid var(--border); border-radius: var(--r);
  background: var(--surface-2); display: flex; flex-direction: column; gap: var(--s2); }
.tr-person + .tr-person { margin-top: var(--s2); }
.tr-person > legend { padding: 0 var(--s1); font-size: var(--fs-sm); font-weight: var(--fw-medium); }
.tr-person-x { position: absolute; top: var(--s1); right: var(--s1); }

@media (max-width: 640px) {
  .tr-dl { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .tr-dl dt { margin-top: var(--s2); }
  .tr-filters .field { flex: 1 1 140px; }
  .tr-seats { min-width: 0; }
  .tr-narrow { flex: 1 1 96px !important; }
}
@media (prefers-reduced-motion: reduce) { .tr-seats .bar i { transition: none; } }

/* ---------- перебронирование: занято больше, чем мест ---------- */
.tr-seats .bar i.over { background: var(--warn); }
.tr-seats.over .bar { border-color: var(--warn); }
.tr-seats-num.tr-over { display: inline-flex; align-items: center; gap: var(--s1); flex-wrap: wrap; color: var(--warn); font-weight: var(--fw-medium); }
.tr-seats-num.tr-over b { color: var(--warn); }
.tr-seats-num .icon { width: 14px; height: 14px; flex: none; }

/* ---------- синхронизация с сайтами (tours-sync.js) ---------- */
.sync-site { display: flex; flex-direction: column; gap: var(--s2); }
.sync-site-title { margin: 0; font-size: var(--fs-lg); }
.sync-site .notice { margin: 0; }
.sync-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: var(--s2); }
.sync-kpi { display: flex; flex-direction: column; gap: var(--s1); padding: var(--s2) var(--s3); border-radius: var(--r-sm);
  background: var(--surface-2); border-left: calc(var(--border-w) + 2px) solid var(--border); }
.sync-kpi b { font-family: var(--font-data); font-variant-numeric: tabular-nums; font-size: var(--fs-lg); }
.sync-kpi span { color: var(--fg-muted); font-size: var(--fs-xs); }
.sync-kpi.tone-danger { border-left-color: var(--danger); }
.sync-kpi.tone-danger b { color: var(--danger); }
.sync-kpi.tone-warn { border-left-color: var(--warn); }
.sync-kpi.tone-warn b { color: var(--warn); }