/* ================================================================
   내 항공편 — 오늘 이 비행기의 여정 (features/ticket-brief/ticket-rotation.js의 모양)  v1 (2026-09-26)
   ----------------------------------------------------------------
   카드 표면은 브리핑 공용 `.tb-card`를 빌린다(첫 화면의 어두운 재정의도 그쪽 규칙이 그대로 먹는다).
   여기서는 구간 목록 줄의 배치만 정한다. ⚠ 자식에 background를 박지 않는다(v12 사고 — 첫 화면에서 그 자식만 밝게 남는다).
   ⛔ 색만으로 알리지 않는다 — 「이 편」·「비행 중」·「추정」은 글자 꼬리표로 간다(좌석 브리핑과 같은 규율).
   ================================================================ */

/* v2 (2026-09-26, 사용자 지시 「높이를 60프로 정도로」): 카드 안 여백·줄 간격을 줄이고 머리·기체를 한 줄에 — 실측 카드 높이 약 340px → 약 200px */
.tb-wrap .tr-card.tb-card {
  padding: 12px 18px;
  gap: 6px;
}

.tb-wrap .tr-card.tb-card h3 {
  margin: 0;
  font-size: 14px;
  line-height: 1.3;
}

.tr-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  font-size: 13.5px;
  font-weight: 700;
  line-height: 1.4;
  word-break: keep-all;
}

.tr-who {
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

.tr-who b {
  font-weight: 700;
  letter-spacing: .02em;
}

.tr-who small {
  color: var(--muted, #64748b);
  font-size: 11.5px;
}

.tr-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}

.tr-leg {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 2px 8px;
  align-items: baseline;
  padding: 1px 0;
  border-top: 1px solid var(--border, #e2e8f0);
  min-width: 0;
  font-size: 12px;
  line-height: 1.45;
}

.tr-card .tb-why {
  font-size: 11px;
  line-height: 1.4;
}

.tr-leg:first-child {
  border-top: 0;
  padding-top: 0;
}

.tr-t {
  font-variant-numeric: tabular-nums;
  color: var(--muted, #64748b);
  font-size: 12px;
}

.tr-od {
  display: flex;
  gap: 6px;
  align-items: baseline;
  flex-wrap: wrap;
  min-width: 0;
}

.tr-od b {
  font-weight: 700;
}

.tr-cs {
  font-size: 11px;
  color: var(--muted, #64748b);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.tr-tag {
  font-size: 10.5px;
  padding: 1px 6px;
  border: 1px solid var(--border, #dce4ec);
  border-radius: 999px;
  color: var(--muted, #64748b);
}

.tr-tag-mine {
  color: #036b86;
  border-color: #9fd6e2;
}

.tr-mine .tr-od b {
  color: #036b86;
}

.tr-ongoing .tr-t::after {
  content: ' ·';
}

.tr-more,
.tr-low {
  font-size: 11.5px;
  color: var(--muted, #64748b);
  line-height: 1.6;
}

.tr-low {
  color: #9a5b00;
}

/* 첫 화면(어두운 유리 카드) — 글자색만 바꾼다. 표면은 .tb-card 규칙이 정한다. */
.ld-search .tb-wrap .tr-leg {
  border-top-color: rgba(148, 163, 184, .22);
}

.ld-search .tb-wrap .tr-t,
.ld-search .tb-wrap .tr-cs,
.ld-search .tb-wrap .tr-tag,
.ld-search .tb-wrap .tr-more,
.ld-search .tb-wrap .tr-who small {
  color: #9fb0c6;
}

.ld-search .tb-wrap .tr-tag {
  border-color: #305369;
}

.ld-search .tb-wrap .tr-tag-mine,
.ld-search .tb-wrap .tr-mine .tr-od b {
  color: #9fe5ef;
}

.ld-search .tb-wrap .tr-low {
  color: #f1c27d;
}