/* ============================================================
   tokens.css — 색을 한곳에 모아둔 곳
   ============================================================
   여태까지는 색을 규칙마다 직접 적어 넣었다(전체 3,400곳 남짓).
   그래서 "카드 배경을 바꾸자"는 한마디가 수십 개 파일을 뒤지는 일이 됐고,
   같은 자리인데 파일마다 색이 조금씩 다른 곳도 생겼다.
   (다크 카드 배경만 해도 #1e2130 / #1a1d2e / #181a27 / #1a1e30 네 가지였다)

   이제 이름으로 부른다. 색을 바꿀 일이 있으면 이 파일만 고치면 된다.

   ★ 이 시스템은 다크가 기본이다(hi_theme 없으면 'dark').
     그래서 :root 에 다크 값을 두고, .light-mode 가 덮어쓴다.
     기존 CSS 도 같은 구조였으므로 그대로 따른다.

   ★ 인쇄에는 쓰지 않는다.
     점검표·개선조치·완료보고서·결과보고서는 흰 종이에 검은 글씨가 원칙이고,
     화면 색이 종이로 넘어가면 안 된다. 인쇄 CSS 는 이 토큰을 부르지 않는다.
   ============================================================ */

:root {
  /* ── 바탕 ── */
  --t-bg:          #0f1523;   /* 페이지 배경 */
  --t-bg-side:     #0b101c;   /* 사이드바 */
  --t-surface:     #141c2e;   /* 카드·패널 */
  --t-surface-2:   #1a2338;   /* 카드 위에 한 겹 더 (강조 영역) */
  --t-border:      #232e45;   /* 카드 테두리 */
  --t-divider:     #1d2536;   /* 구분선 */
  --t-row-line:    #1a2233;   /* 표의 행 구분선 */
  --t-row-hover:   #16213a;   /* 표 행에 마우스 올렸을 때 */

  /* ── 입력칸 ── */
  --t-input-bg:    #0f1523;
  --t-input-bd:    #2a3450;
  --t-input-bd-on: #3a4868;   /* 포커스 */

  /* ── 글자 ── */
  --t-text:        #f1f5fd;   /* 본문 */
  --t-text-2:      #aebada;   /* 보조 */
  --t-text-3:      #6b7a97;   /* 흐림 */
  --t-text-4:      #5d6c8f;   /* 매우 흐림 — 시안값 #4a5875 는 대비 2.6:1 로 안 읽혀서 3.5:1 로 올렸다 */

  /* ── 주 색 ── */
  --t-primary:     #3b82f6;
  --t-primary-2:   #1d4ed8;   /* 그라데이션 반대쪽 */
  --t-primary-grad: linear-gradient(135deg, #1d4ed8, #3b82f6);
  --t-primary-soft: rgba(79,142,247,.14);   /* 칩·배지 바탕 */
  --t-primary-bd:  rgba(79,142,247,.30);
  --t-primary-tx:  #8db4f9;                 /* 파란 글자 */

  /* ── 상태 ── */
  --t-success:     #4ade80;
  --t-success-bg:  rgba(34,197,94,.14);
  --t-success-bd:  rgba(34,197,94,.30);
  --t-danger:      #f87171;
  --t-danger-bg:   rgba(239,68,68,.12);
  --t-danger-bd:   rgba(239,68,68,.35);
  --t-warn:        #fbbf24;
  --t-warn-bg:     rgba(230,126,34,.14);
  --t-warn-bd:     rgba(230,126,34,.35);
  --t-purple:      #a78bfa;
  --t-purple-bg:   rgba(167,139,250,.14);

  /* ── 그림자 ── */
  --t-shadow:      0 12px 40px rgba(0,0,0,.35);
  --t-shadow-modal: 0 20px 60px rgba(0,0,0,.50);

  /* ── 옛 이름 (예전 CSS 가 부르던 것) ──
     새로 쓰는 곳은 --t-* 를 쓰고, 아래는 남아 있는 호출을 위해 둔다. */
  --text:          #f1f5fd;
  --text-primary:  #f1f5fd;
  --text-muted:    #6b7a97;
  --surface:       #141c2e;
  --border:        #232e45;
  --border-color:  #232e45;
  --hover-bg:      rgba(255,255,255,.045);
  --tag-bg:        rgba(79,142,247,.14);

  /* ── 모양 ── */
  --t-radius:      14px;   /* 카드 */
  --t-radius-sm:   9px;    /* 버튼·입력칸 */
  --t-radius-xs:   8px;    /* 작은 버튼 */
  --t-radius-pill: 99px;   /* 칩·배지 */
}

body.light-mode {
  --t-bg:          #eef1f6;
  --t-bg-side:     #14283c;   /* ★ 라이트에서도 사이드바는 짙은 남색을 유지한다 */
  --t-surface:     #ffffff;
  --t-surface-2:   #f8fafc;
  --t-border:      #e3e8f0;
  --t-divider:     #eef1f6;
  --t-row-line:    #f2f5f9;
  --t-row-hover:   #f4f8fc;

  --t-input-bg:    #f8fafc;
  --t-input-bd:    #d5dbe5;
  --t-input-bd-on: #1a4f7a;

  --t-text:        #1a1d24;
  --t-text-2:      #4a5060;
  --t-text-3:      #6f757e;   /* 시안 #8a9099 는 흰 바탕에서 3.2:1 — 4.7:1 로 올렸다 */
  --t-text-4:      #8a9099;   /* 시안 #bdc3cb 는 1.7:1 로 안 읽힌다 — 3.2:1 로 올렸다 */

  --t-primary:     #1a4f7a;
  --t-primary-2:   #123458;
  --t-primary-grad: #1a4f7a;   /* 라이트는 단색 — 시안이 그렇다 */
  --t-primary-soft: #e8f0f8;
  --t-primary-bd:  #cddbe9;
  --t-primary-tx:  #1a4f7a;

  --t-success:     #2e7d32;
  --t-success-bg:  #e8f5e9;
  --t-success-bd:  #cfe3d2;
  --t-danger:      #c0392b;
  --t-danger-bg:   #fdecea;
  --t-danger-bd:   #f0c9c4;
  --t-warn:        #e67e22;
  --t-warn-bg:     #fff4e8;
  --t-warn-bd:     #f3d9bd;
  --t-purple:      #7c3aed;
  --t-purple-bg:   #f3edfb;

  --t-shadow:      0 12px 40px rgba(20,30,60,.16);
  --t-shadow-modal: 0 20px 60px rgba(20,30,60,.22);

  --text:          #1a1d24;
  --text-primary:  #1a1d24;
  --text-muted:    #8a9099;
  --surface:       #ffffff;
  --border-color:  #d5dbe5;
  --hover-bg:      rgba(26,79,122,.05);
  --tag-bg:        #e8f0f8;
  /* --border 는 여기서 정하지 않는다 — 아래 참고 */
}

/* ★ --border 만 점검표를 뺀다.
   점검표(style.css)는 자체 :root 에 --border: #222 을 두고 표 테두리에
   쓴다. 그 선은 종이에 인쇄된다. 여기서 덮으면 인쇄물의 표 선이
   흐려지므로 점검표 페이지만 제외한다.
   (다크에서는 style.css 가 뒤에 실려 자연히 이기지만, body.light-mode 는
    :root 보다 특정도가 높아 그냥 두면 이겨버린다) */
body.light-mode:not([data-page="checklist"]) {
  --border: #e3e8f0;
}