/* ══════════════════════════════════════════════════════
 *  BLOOM — DESIGN TOKENS (루트 존 단일 소스)
 *  /css/tokens.css
 *  ※ 이 파일이 루트 토큰의 유일한 정의처다. global.css 에는 정의하지 않는다.
 *  ※ 반응형 --nav-h 재정의는 global.css 의 @media 블록에 있다.
 * ══════════════════════════════════════════════════════ */

/* ─── DESIGN TOKENS (v4 — Clean White / Indigo) ─── */
:root {
  --ink:        #111827;
  --ink-60:     #6B7280;
  --ink-30:     #D1D5DB;
  --ink-10:     #F3F4F6;
  --paper:      #FFFFFF;
  --warm:       #FAFAFA;
  --terracotta: #4F46E5;
  --terra-lt:   #EEF2FF;
  --terra-dk:   #3730A3;
  --sage:       #059669;
  --sage-lt:    #ECFDF5;
  --gold:       #D97706;
  --gold-lt:    #FFFBEB;
  --danger:     #EF4444;          /* place --place-danger 와 동일값으로 통일 */
  --danger-lt:  #FEE2E2;

  /* ─ danger 음영 단계 (Tailwind red 램프, 실사용 단계만) ─ */
  --danger-50:   #FEF2F2;
  --danger-100:  var(--danger-lt);   /* #FEE2E2 */
  --danger-200:  #FECACA;
  --danger-300:  #FCA5A5;
  --danger-500:  var(--danger);      /* #EF4444 */
  --danger-600:  #DC2626;           /* 흰 글씨 버튼 배경용 4.83:1 (텍스트로도 AA) */
  --danger-700:  #B91C1C;
  --danger-800:  #991B1B;
  --danger-900:  #7F1D1D;

  /* ─ warning 음영 단계 (Tailwind amber 램프) ─ */
  --warning-50:  var(--gold-lt);     /* #FFFBEB */
  --warning-100: #FEF3C7;
  --warning-400: #FBBF24;
  --warning-500: #F59E0B;
  --warning-600: var(--gold);        /* #D97706 */
  --warning-700: #B45309;
  --warning-800: #92400E;

  /* ─ ink 램프 보강 (기존 페이지가 사용 중이나 미정의였던 단계) ─
     값은 모두 프로젝트에서 이미 다량 사용 중인 gray 계열 hex 사용 */
  --ink-70:     #374151;          /* 본문 보조 텍스트 (terms/privacy toc·highlight) */
  --ink-50:     var(--ink-60);    /* 설명 텍스트 (guide 탭·login/signup 설명) */
  --ink-40:     #9CA3AF;          /* 연한 보조 텍스트 (couple-review) */
  --ink-15:     #E5E7EB;          /* 연한 경계선 */
  --ink-08:     var(--ink-10);    /* 아주 연한 경계선 (info-table 외곽) */
  --ink-06:     var(--ink-10);    /* 아주 연한 경계선 (info-table 행) */
  --ink-05:     #F9FAFB;          /* 연한 배경 (guide hover·step-card) */
  --ink-5:      var(--ink-05);    /* --ink-05 별칭 (couple-review 표기) */

  /* ─ 접근성: 텍스트 전용 색 (WCAG AA 4.5:1) ─
     흰 배경 기준 실측값. 이보다 밝게 하면 11~14px 텍스트가 기준 미달이 된다.
     --ink-30/-40 은 테두리·배경 전용으로 남긴다(텍스트로 쓰면 1.47~2.54:1). */
  --ink-hint:   #6B7280;   /* 보조·힌트 텍스트  4.83:1  (= --ink-60 과 동일값) */
  --sage-dk:    #047857;   /* 성공 텍스트       5.48:1  (--sage 는 3.77:1) */
  --info-dk:    #1D4ED8;   /* 정보 텍스트       6.70:1 */
  --border-input: #8E959E; /* 입력 테두리 3.02:1 — WCAG 1.4.11(UI 경계 3:1) 하한.
                              더 밝게 하면 저시력 사용자가 입력칸 경계를 못 본다. */
  --rose:       #F43F5E;          /* danger 계열 (tokens.css 와 동일) */
  --font-sans:  'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --r-sm:   12px;
  --r-md:   16px;
  --r-lg:   24px;
  --r-xl:   32px;
  --r-full: 999px;

  --shadow-sm: 0 1px 3px rgba(0,0,0,.06);
  --shadow-md: 0 4px 20px rgba(0,0,0,.06);
  --shadow-lg: 0 12px 40px rgba(0,0,0,.08);

  --nav-h:       72px;
  --sidebar-w:   260px;
  --content-max: 1200px;
  --bottom-nav-h: 0px;

  --ease:   cubic-bezier(.4,0,.2,1);
  --spring: cubic-bezier(.34,1.56,.64,1);

  /* ─ 타입 스케일 (현재 코드가 실제로 쓰는 크기 1:1, 시각 변화 없음) ─
     통합이 필요하면 여기 값만 바꾸면 전 페이지에 반영된다. ─ */
  --fs-9 :  9px;
  --fs-10:  10px;
  --fs-11:  11px;
  --fs-12:  12px;
  --fs-13:  13px;
  --fs-14:  14px;
  --fs-15:  15px;
  --fs-16:  16px;
  --fs-17:  17px;
  --fs-18:  18px;
  --fs-20:  20px;
  --fs-22:  22px;
  --fs-24:  24px;
  --fs-26:  26px;
  --fs-28:  28px;
  --fs-30:  30px;
  --fs-32:  32px;
  --fs-36:  36px;
  --fs-40:  40px;
  --fs-42:  42px;
  --fs-48:  48px;
  --fs-8:  8px;   /* 캘린더 이벤트·마이크로 배지 (접근성 개선 후보) */
  --fs-56:  56px;
  --fs-64:  64px;
  --fs-80:  80px;
  /* 아이콘·이모지 글리프 크기 (텍스트 아님) */
  --fs-34:  34px;
  --fs-38:  38px;
  --fs-44:  44px;
  --fs-52:  52px;

  /* ─ 브레이크포인트 ─
     ⚠ CSS 변수는 @media 조건에 쓸 수 없다. var(--bp-*) 는 동작하지 않는다.
        (이 프로젝트는 빌드 단계가 없어 @custom-media 도 불가)
        아래는 값을 통일하기 위한 *참조용* 이다. 새 @media 는 이 목록에서만 고른다.

       360px  소형 폰        (16건)
       480px  폰             (10건)
       640px  폰 가로/패블릿 (74건) ← 주력
       768px  태블릿 세로    (40건) / 짝: min-width:769px
       900px  태블릿 가로    (25건)
      1024px  소형 데스크톱  ( 6건)
      1100px  데스크톱       ( 9건) / 짝: min-width:1400px

     비표준 잔재 3종(총 5건) — 병합 시 해당 폭 구간의 반응형 동작이 바뀌므로 보류:
       380px  css/landing.css:519
       400px  css/page-planner-profile.css:350
       780px  css/couple-budget.css:205, css/mobile-fix.css:99, css/planner-notifications.css:166
  */
}

/* ── 다크모드: 토큰만 대비(현재 미적용). data-theme="dark" 지정 시에만 활성 ── */
:root[data-theme="dark"] {
  --ink:    #F3F4F6;  --ink-70: #E2E8F0;  --ink-60: #CBD5E1;  --ink-40: #94A3B8;
  --ink-30: #475569;  --ink-15: #334155;  --ink-10: #1E293B;  --ink-05: #0F172A;
  --paper:  #0B1220;  --warm:   #111827;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.4);
  --shadow-md: 0 4px 20px rgba(0,0,0,.45);
  --shadow-lg: 0 12px 40px rgba(0,0,0,.5);
}
