/**
 * 학비 정책 — 공개 페이지 폴백 라벨 CSS
 * SPEC: school-fee-policy-unification (v2)
 * Phase 4 신설 (2026-04-27)
 *
 * tokens.css의 --teal/--amber 사용
 * Q4=B 결정: 작은 회색 배지 (투명성 + 부담 적음)
 */

.fee-term-label {
  font-size: 12px;
  color: #6b7280; /* --ink-500 fallback */
  margin-top: 8px;
  display: block;
}

.fee-current-label {
  display: inline-block;
  background: var(--teal-soft, #e6f7f5);
  color: var(--teal, #0d7680);
  padding: 2px 8px;
  border-radius: 4px;
  font-weight: 500;
  font-size: 12px;
}

.fee-fallback-badge {
  display: inline-block;
  background: #f3f4f6;
  color: #6b7280;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 400;
}

.fee-fallback-badge::before {
  content: '※ ';
  color: var(--amber, #d97706);
}

.fee-no-data {
  color: #6b7280;
  font-style: italic;
  font-size: 13px;
}

/* 모바일 — 라벨이 h2와 겹치지 않도록 줄바꿈 강제 */
@media (max-width: 600px) {
  .fee-term-label {
    display: block;
    width: 100%;
    margin-top: 6px;
    clear: both;
  }
  .fee-current-label,
  .fee-fallback-badge {
    display: inline-block;
  }
  /* card-header 자식들이 세로 stack 되도록 */
  .content-card .card-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .content-card .card-header > * {
    width: 100%;
  }
}