/* utility-common.css — 공통 레이아웃·타이포·버튼·카드 (§6.3, §6.4) */

/* 공개 사이트의 모든 텍스트·폼 컨트롤은 Pretendard로 통일한다.
   Font Awesome 아이콘은 자체 폰트를 사용하므로 별도 선언을 유지한다. */
html, body,
h1, h2, h3, h4, h5, h6,
input, button, select, textarea, optgroup, option,
table, pre, code, kbd, samp {
  font-family: var(--font-sans);
}

.ucalc-scope, .ucalc-detail, .ucalc-list, .ucalc-home {
  font-family: var(--font-sans);
  color: var(--color-text);
  line-height: 1.6;
}
.ucalc-detail, .ucalc-list, .ucalc-home { -webkit-font-smoothing: antialiased; }
.ucalc-scope *, .ucalc-scope *::before, .ucalc-scope *::after,
.ucalc-detail *, .ucalc-detail *::before, .ucalc-detail *::after,
.ucalc-list *, .ucalc-list *::before, .ucalc-list *::after,
.ucalc-home *, .ucalc-home *::before, .ucalc-home *::after { box-sizing: border-box; }

/* 컨테이너 */
.u-container { max-width: var(--container); margin: 0 auto; padding: 0 var(--sp-8); }

/* 타이포 */
.ucalc-h1 { font-size: 34px; font-weight: 700; line-height: 1.3; margin: 0 0 var(--sp-3); }
.ucalc-lead { font-size: 17px; color: var(--color-text-secondary); margin: 0 0 var(--sp-2); }
.ucalc-asof { font-size: 14px; color: var(--color-text-secondary); margin: 0; }
.ucalc-content h2 { font-size: 24px; font-weight: 700; margin: var(--sp-8) 0 var(--sp-4); }
.ucalc-content h3, .ucalc-content h4 { font-size: 18px; font-weight: 600; margin: var(--sp-6) 0 var(--sp-2); }
.ucalc-content p { margin: 0 0 var(--sp-3); }

/* 숫자 가독성 */
.ucalc-primary-value, .ucalc-breakdown td, .ucalc-schedule-table td { font-variant-numeric: tabular-nums; }

/* 카드 */
.ucalc-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-card);
  padding: var(--sp-6);
}
.ucalc-card + .ucalc-card { margin-top: var(--sp-4); }
.ucalc-detail .ucalc-card-title, .ucalc-card-title {
  font-size: 18px; font-weight: 700; line-height: 1.4;
  margin: 0 0 20px; color: var(--color-text);
}

/* 버튼 (높이 48, 터치 44+) */
.ucalc-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 0 var(--sp-6); border-radius: var(--radius-input);
  font-size: 16px; font-weight: 600; cursor: pointer; border: 1px solid transparent;
  text-decoration: none;
  transition: background-color var(--transition-fast), border-color var(--transition-fast),
              color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}
.ucalc-btn-primary { background: var(--color-primary); color: #fff !important; }
.ucalc-btn-primary:hover { background: var(--color-primary-hover); transform: translateY(-1px); }
.ucalc-btn-secondary { background: var(--color-surface); color: var(--color-text); border-color: var(--color-border); }
.ucalc-btn-secondary:hover { background: var(--color-surface-soft); border-color: var(--color-border-strong); }
.ucalc-btn:active { transform: translateY(0); }
.ucalc-btn:disabled, .ucalc-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }

/* 포커스 링 — 제거하지 않고 선명하게 */
.ucalc-detail a:focus-visible, .ucalc-btn:focus-visible, .ucalc-input:focus-visible,
.ucalc-home a:focus-visible, .ucalc-list a:focus-visible,
input:focus-visible, select:focus-visible, button:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
}

/* 태그/배지 (pill) */
.ucalc-tag, .ucalc-card-asof {
  display: inline-block; font-size: 12px; padding: 2px 10px; border-radius: var(--radius-pill);
  background: var(--color-surface-soft); color: var(--color-text-secondary);
}

/* 표 */
.ucalc-table-scroll { overflow-x: auto; }

/* 접근성 */
.sound_only, .ucalc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* 푸터 유틸 링크 */
.ucalc-foot-links { width: 100%; max-width: none; margin: 0; padding: var(--sp-4) var(--sp-8) var(--sp-6);
  box-sizing: border-box; display: flex; justify-content: center; flex-wrap: wrap; gap: var(--sp-4);
  background: var(--color-surface); font-size: 13px; }
.ucalc-foot-links a { color: var(--color-text-secondary); text-decoration: none; }
.ucalc-foot-links a:hover { color: var(--color-primary); text-decoration: underline; }

/* 쿠키 배너 */
.ucalc-cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 1000;
  max-width: 720px; margin: 0 auto; background: var(--color-surface); color: var(--color-text);
  border: 1px solid var(--color-border); border-radius: var(--radius-card); box-shadow: 0 8px 30px rgba(16,24,40,.18);
  padding: var(--sp-4); display: flex; gap: var(--sp-4); align-items: center; flex-wrap: wrap; }
.ucalc-cookie-banner[hidden] { display: none; }
.ucalc-cookie-text { font-size: 13px; margin: 0; flex: 1 1 320px; }
.ucalc-cookie-actions { display: flex; gap: var(--sp-2); }
.ucalc-cookie-actions .ucalc-btn { min-height: 40px; padding: 0 var(--sp-4); font-size: 14px; }

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}