/* Page « TSA wait times » (app tsa). Valeurs : tokens.css. */
.tsa { display: flex; flex-direction: column; gap: 28px; padding-top: 36px; padding-bottom: 72px; }
.tsa__head { display: flex; flex-direction: column; gap: 14px; max-width: 860px; }
.tsa__kicker { margin: 0; font: 600 14px var(--font-mono); text-transform: uppercase; letter-spacing: .06em; color: var(--ink-soft); }
.tsa__title { margin: 0; font-family: var(--font-display); font-weight: 800; font-size: clamp(36px, 4.4vw, 56px); line-height: 0.98; }
.tsa__lead { margin: 0; font-size: 19px; line-height: 1.55; color: var(--ink-soft); }
.tsa__notice { margin: 0; padding: 12px 16px; border-radius: var(--radius-notice); background: var(--tip-cream); }
.tsa__h2 { margin: 0; font-family: var(--font-display); font-weight: 800; font-size: 32px; line-height: 1.05; }
.tsa__h3 { margin: 8px 0 0; font-size: 18px; }
.tsa__small { margin: 0; font-size: 14px; color: var(--ink-soft); }
.tsa-card { display: flex; flex-direction: column; gap: 16px; padding: 24px; border: 2px solid var(--tarmac); border-radius: var(--radius-card); background: var(--white); box-shadow: var(--shadow-hard); }
.tsa-card p { margin: 0; }
.tsa-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 16px; }
.tsa-form label { display: flex; flex-direction: column; gap: 6px; min-width: 0; max-width: 100%; font-weight: 700; }
.tsa-form select { max-width: 100%; min-height: var(--touch-min); padding: 0 12px; border: 2px solid var(--tarmac); border-radius: var(--radius-control); font: 16px var(--font-sans); background: var(--white); }
.tsa-table-wrap { overflow-x: auto; }
.tsa-table, .tsa-heat { width: 100%; border-collapse: collapse; }
.tsa-table th, .tsa-table td { padding: 10px 12px; border-bottom: 1px solid var(--table-rule); text-align: left; vertical-align: top; }
.tsa-table thead th { font: 600 13px var(--font-mono); text-transform: uppercase; color: var(--ink-soft); }
.tsa-table tr.is-best { background: var(--after-security-bg); }
.tsa-badge { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: var(--radius-pill); background: var(--tarmac); color: var(--signal-yellow); font: 700 12px var(--font-sans); }
.tsa-level { display: block; font-weight: 700; }
.tsa-level--calm { color: #1F7A3D; }
.tsa-level--moderate { color: var(--ember); }
.tsa-level--busy { color: #B3261E; }
.tsa-pax { display: block; font-size: 14px; color: var(--ink-soft); }
.tsa-heat th, .tsa-heat td { padding: 6px 4px; font: 12px var(--font-mono); text-align: center; white-space: nowrap; }
.tsa-heat tbody th { text-align: left; font-weight: 700; }
/* La colonne des jours reste visible quand on fait défiler les heures sur téléphone */
.tsa-heat tbody th, .tsa-heat thead th:first-child { position: sticky; left: 0; z-index: 1; padding-right: 8px; background: var(--white); }
.tsa-heat__cell--calm { background: #E6F4EA; }
.tsa-heat__cell--moderate { background: #FFD55C; }
.tsa-heat__cell--busy { background: var(--ember); color: var(--white); }
.tsa-heat__unit { font-size: 10px; opacity: .75; }
.tsa-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 14px; }
.tsa-legend span { padding: 2px 8px; border-radius: var(--radius-badge); font-weight: 700; }
.tsa-list { margin: 0; padding-left: 22px; }
/* Foxy (mascotte) : en tête de page et dans le verdict, selon le niveau d'affluence */
.tsa__head--foxy { flex-direction: row; align-items: center; gap: 24px; max-width: none; }
.tsa__head-text { display: flex; flex-direction: column; gap: 14px; max-width: 760px; }
.tsa__foxy { flex: none; width: 260px; height: auto; margin-left: auto; }
.tsa-verdict { display: flex; align-items: center; gap: 16px; padding: 12px 18px; border-radius: var(--radius-card); border: 2px solid var(--tarmac); }
.tsa-verdict img { flex: none; width: 96px; height: auto; }
.tsa-verdict p { margin: 0; font-size: 17px; line-height: 1.45; }
.tsa-verdict__label { display: block; font: 600 12px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-soft); }
.tsa-verdict--calm { background: #E6F4EA; }
.tsa-verdict--moderate { background: #FFF3CC; }
.tsa-verdict--busy { background: #FDE3DC; }
@media (max-width: 860px) {
  .tsa__head--foxy { flex-direction: column-reverse; align-items: flex-start; }
  .tsa__foxy { width: 160px; margin-left: 0; }
}
@media (max-width: 640px) {
  .tsa-card { padding: 16px; }
  .tsa__h2 { font-size: 26px; }
}
