/* =========================================================
   Wanted Design System — Bootstrap bridge
   Bootstrap 5.3 의 CSS 변수를 Wanted 토큰으로 매핑.
   이 한 파일만 적용되면 .btn-primary, .alert-primary,
   .text-primary, .bg-primary, .border-primary,
   .form-control, .card, .badge 등이 자동으로 Wanted 톤으로 바뀜.
   ========================================================= */

:root,
[data-bs-theme="light"] {
  /* ── Brand & color ─────────────────────────────────── */
  --bs-primary: var(--blue-50);
  --bs-primary-rgb: 0, 102, 255;
  --bs-primary-text-emphasis: var(--blue-30);
  --bs-primary-bg-subtle: var(--blue-95);
  --bs-primary-border-subtle: var(--blue-90);

  --bs-link-color: var(--blue-50);
  --bs-link-color-rgb: 0, 102, 255;
  --bs-link-hover-color: var(--blue-45);
  --bs-link-hover-color-rgb: 0, 94, 235;

  --bs-success: var(--green-50);
  --bs-success-rgb: 0, 191, 64;
  --bs-success-text-emphasis: var(--green-40);
  --bs-success-bg-subtle: var(--green-95);

  --bs-danger: var(--red-50);
  --bs-danger-rgb: 255, 66, 66;
  --bs-danger-text-emphasis: var(--red-40);
  --bs-danger-bg-subtle: var(--red-95);

  --bs-warning: var(--orange-50);
  --bs-warning-rgb: 255, 146, 0;
  --bs-warning-text-emphasis: var(--orange-40);
  --bs-warning-bg-subtle: var(--orange-95);

  --bs-info: var(--cyan-50);
  --bs-info-rgb: 0, 189, 222;
  --bs-info-text-emphasis: var(--cyan-40);

  /* ── Body & surface ────────────────────────────────── */
  --bs-body-bg: var(--bg-alternative);
  --bs-body-bg-rgb: 247, 247, 248;
  --bs-body-color: var(--label-normal);
  --bs-body-color-rgb: 23, 23, 25;
  --bs-secondary-color: var(--label-neutral);
  --bs-secondary-bg: var(--fill-normal);
  --bs-tertiary-color: var(--label-alternative);
  --bs-tertiary-bg: var(--fill-alternative);
  --bs-emphasis-color: var(--label-normal);

  /* ── Borders & lines ───────────────────────────────── */
  --bs-border-color: var(--line-solid-normal);
  --bs-border-color-translucent: var(--line-normal);

  /* ── Radius ─────────────────────────────────────────── */
  --bs-border-radius: 12px;
  --bs-border-radius-sm: 8px;
  --bs-border-radius-lg: 14px;
  --bs-border-radius-xl: 20px;
  --bs-border-radius-2xl: 24px;
  --bs-border-radius-pill: 999px;

  /* ── Typography ─────────────────────────────────────── */
  --bs-font-sans-serif: var(--font-sans);
  --bs-body-font-family: var(--font-sans);
  --bs-body-font-size: 14px;
  --bs-body-font-weight: 500;
  --bs-body-line-height: 1.5;

  /* ── Form ───────────────────────────────────────────── */
  --bs-form-control-bg: var(--bg-elevated-normal);

  /* ── Headings ───────────────────────────────────────── */
  --bs-heading-color: var(--label-normal);
}

[data-bs-theme="dark"] {
  --bs-primary: var(--blue-60);
  --bs-primary-rgb: 51, 133, 255;
  --bs-primary-text-emphasis: var(--blue-70);
  --bs-primary-bg-subtle: rgba(0, 102, 255, 0.16);
  --bs-primary-border-subtle: rgba(0, 102, 255, 0.32);

  --bs-link-color: var(--blue-60);
  --bs-link-color-rgb: 51, 133, 255;
  --bs-link-hover-color: var(--blue-65);
  --bs-link-hover-color-rgb: 79, 149, 255;

  --bs-success: var(--green-60);
  --bs-success-rgb: 30, 212, 90;
  --bs-danger: var(--red-60);
  --bs-danger-rgb: 255, 99, 99;
  --bs-warning: var(--orange-60);
  --bs-warning-rgb: 255, 169, 56;
  --bs-info: var(--cyan-60);
  --bs-info-rgb: 40, 208, 237;

  --bs-body-bg: var(--bg-alternative);
  --bs-body-bg-rgb: 15, 15, 16;
  --bs-body-color: var(--label-normal);
  --bs-body-color-rgb: 247, 247, 248;
  --bs-secondary-color: var(--label-neutral);
  --bs-secondary-bg: var(--fill-normal);
  --bs-tertiary-color: var(--label-alternative);
  --bs-tertiary-bg: var(--fill-alternative);
  --bs-emphasis-color: var(--label-strong);

  --bs-border-color: var(--line-solid-normal);
  --bs-border-color-translucent: var(--line-normal);

  --bs-form-control-bg: var(--bg-elevated-normal);
  --bs-heading-color: var(--label-normal);
}

/* Body 폰트/색 적용 (Bootstrap 변수에 기반) */
html,
body {
  font-family: var(--bs-body-font-family);
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 본문 글자 weight: Wanted 는 body 가 500 */
body {
  font-weight: 500;
}

/* 제목 weight 700, 자간 negative — Wanted display 규칙 */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 700;
  letter-spacing: var(--tracking-h, -0.006em);
}
