/* 디자인 토큰: 색·글꼴·간격·모서리 변수. 템플릿·CSS는 값을 직접 쓰지 않고 여기 변수만 참조한다.
   라이트가 기본이고, 다크 값은 아래 자리(두 곳)에서만 바꾼다. 장고 관리자 테마 변수(--body-bg 등)는 여기서만 이름을 바꿔 쓴다. */
:root {
  /* 바탕·글자(관리자 테마를 따른다 — 다크 모드에서 자동으로 바뀐다) */
  --surface: var(--body-bg, #fff);
  --surface-alt: var(--darkened-bg, #f8f8f8);
  --surface-select: var(--selected-bg, #e4e4e4);
  --ink: var(--body-fg, #333);
  --ink-quiet: var(--body-quiet-color, #666);
  --accent: var(--primary, #417690);
  --line: var(--hairline-color, #ccc);
  --line-strong: var(--border-color, #ccc);

  /* 글꼴 */
  --font-print: "Noto Sans KR", "Malgun Gothic", sans-serif;
  --font-size-small: .8rem;
  --font-size-large: 1.05rem;

  /* 간격 */
  --space-1: 4px;
  --space-2: 6px;
  --space-3: 10px;
  --space-4: 12px;
  --space-5: 18px;
  --space-6: 24px;

  /* 모서리 */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-pill: 10px;

  /* 상태 톤(core/status.py의 ok·warn·error·info·muted): 배경 / 뱃지 글자 / 본문 속 글자 */
  --tone-ok-bg: #d4edda;       --tone-ok-fg: #14532d;       --tone-ok-text: #14532d;
  --tone-warn-bg: #fff3cd;     --tone-warn-fg: #5c4400;     --tone-warn-text: #8a5a00;
  --tone-error-bg: #ffefef;    --tone-error-fg: #5c0000;    --tone-error-text: #a40000;
  --tone-info-bg: #d9e8f5;     --tone-info-fg: #0c3c60;     --tone-info-text: #0c3c60;
  --tone-muted-bg: #e2e3e5;    --tone-muted-fg: #333;       --tone-muted-text: #555;
  --plus: #14532d;             /* 증가 */
  --minus: #a40000;            /* 감소 */
  --text-faint: #888;

  /* 계약 차수 진행표 칸 */
  --stage-line: #ccc;
  --stage-done-bg: #e6f4ea;
  --stage-current-bg: #fff3cd;
  --stage-current-outline: #e0a800;
  --stage-todo-fg: #888;
  --stage-skip-fg: #aaa;
  --stage-skip-bg: #f5f5f5;

  /* 시험 환경 띠 */
  --test-banner-bg: #b45309;
  --test-banner-fg: #fff;

  /* 업무 화면(/app/)·현장 화면(/app/field/): 태블릿·휴대폰에서 손가락으로 누르는 크기(최소 48px) */
  --tap-size: 48px;
  --tap-size-lg: 56px;
  --font-size-app: 1.0625rem;
  --font-size-app-small: .9375rem;
  --font-size-app-title: 1.375rem;
  --font-size-app-big: 1.25rem;
  --tabbar-height: 64px;
  --action-bar-height: 64px;
  --backdrop: rgba(0, 0, 0, .45);
  --app-nav-width: 220px;
  --app-max-width: 1100px;
  --accent-fg: #fff;
  --app-bar-bg: #1f3b4d;
  --app-bar-fg: #fff;
  --app-shadow: rgba(0, 0, 0, .15);
  --focus-ring: #e0a800;

  /* 인쇄물(항상 흰 바탕 — 다크 값을 두지 않는다) */
  --print-ink: #111;
  --print-line: #444;
  --print-muted: #666;
  --print-bg: #fff;
  --print-box: #f4f4f4;
  --print-warn-bg: #fff3cd;
  --print-warn-fg: #5c4400;
  /* 2단계 인증 QR(인증 앱이 읽도록 다크 모드에서도 흰 바탕·검은 점) */
  --qr-bg: #fff;
  --qr-ink: #000;
  --font-code: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}

/* 다크 값 자리 ①: 운영체제가 다크일 때(관리자 테마가 라이트로 고정된 경우는 제외) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --tone-ok-bg: var(--message-success-bg, #1c3a26);      --tone-ok-fg: var(--body-fg, #eee);     --tone-ok-text: #7ed99a;
    --tone-warn-bg: var(--message-warning-bg, #4a3a00);    --tone-warn-fg: var(--body-fg, #eee);   --tone-warn-text: #f0c060;
    --tone-error-bg: var(--message-error-bg, #4a1c1c);     --tone-error-fg: var(--body-fg, #eee);  --tone-error-text: #ff8a80;
    --tone-info-bg: #1c3550;     --tone-info-fg: var(--body-fg, #eee);     --tone-info-text: #8cc4f0;
    --tone-muted-bg: #3a3a3a;    --tone-muted-fg: var(--body-fg, #eee);    --tone-muted-text: #aaa;
    --plus: #7ed99a;             --minus: #ff8a80;                         --text-faint: #999;
    --stage-line: #555;          --stage-done-bg: #1c3a26;                 --stage-current-bg: #4a3a00;
    --stage-todo-fg: #999;       --stage-skip-fg: #888;                    --stage-skip-bg: #2a2a2a;
  }
}

/* 다크 값 자리 ②: 관리자 테마를 다크로 직접 고른 경우(위와 같은 값을 둔다) */
:root[data-theme="dark"] {
  --tone-ok-bg: var(--message-success-bg, #1c3a26);      --tone-ok-fg: var(--body-fg, #eee);     --tone-ok-text: #7ed99a;
  --tone-warn-bg: var(--message-warning-bg, #4a3a00);    --tone-warn-fg: var(--body-fg, #eee);   --tone-warn-text: #f0c060;
  --tone-error-bg: var(--message-error-bg, #4a1c1c);     --tone-error-fg: var(--body-fg, #eee);  --tone-error-text: #ff8a80;
  --tone-info-bg: #1c3550;     --tone-info-fg: var(--body-fg, #eee);     --tone-info-text: #8cc4f0;
  --tone-muted-bg: #3a3a3a;    --tone-muted-fg: var(--body-fg, #eee);    --tone-muted-text: #aaa;
  --plus: #7ed99a;             --minus: #ff8a80;                         --text-faint: #999;
  --stage-line: #555;          --stage-done-bg: #1c3a26;                 --stage-current-bg: #4a3a00;
  --stage-todo-fg: #999;       --stage-skip-fg: #888;                    --stage-skip-bg: #2a2a2a;
}
