/* 제때 — 색·간격·글꼴 값
 *
 * 색은 로고에서 뽑았다. 진초록이 브랜드, 금색이 강조.
 * 경고색(빨강·주황)은 브랜드색과 절대 섞지 않는다 —
 * 삭감 위험을 알려주는 제품이라 경고가 브랜드에 묻히면 안 된다.
 *
 * 「급여 인정」에 초록을 쓰지 않는다. 브랜드가 초록이라 구분이 안 된다.
 * 정상인 것은 색을 안 쓰고, 문제 있는 것만 색이 붙는다. 그게 더 잘 읽힌다.
 */

:root{
  /* 브랜드 */
  --band:#303a2b;        /* 로고 바탕 초록 — 왼쪽 메뉴. 테마와 무관하게 고정 */
  --band-2:#3a4534;      /* 메뉴 안에서 한 단계 밝은 면 */
  --green:#374131;       /* 로고 획 초록 — 글자·테두리 */
  --green-lit:#8fa286;   /* 어두운 면 위의 초록 글자 */
  --gold:#cfa969;        /* 금색 — 선택된 것, 가는 선 */
  --gold-soft:#f0e6d3;

  /* 바탕 */
  --bg:#f3f1ea;          /* 작업 영역 바탕 */
  --card:#ffffff;
  --chip:#ebe6de;        /* 크림 칩 — 「급여 인정」처럼 정상 표시 */
  --bd:#ddd8cb;
  --bd-soft:#e8e4d9;

  /* 글자 */
  --tx:#2b3328;
  --tx2:#6d7568;
  --tx3:#9a9f93;
  --tx-on-band:#e6e9e2;
  --tx-on-band-2:#8b9484;

  /* 신호 — 브랜드색과 섞지 않는다 */
  --danger:#a8322a;      /* 병용금기 · 삭감 위험 */
  --danger-bg:#fbeceb;
  --warn:#b0762a;        /* 주의 */
  --warn-bg:#fbf2e4;

  /* 모양 */
  --r:10px;
  --r-sm:6px;
  --rail:212px;          /* 왼쪽 메뉴 너비 */
  --head:58px;           /* 위쪽 띠 높이 */
  --tabbar:64px;         /* 폰 아래 탭 높이 */

  /* 글꼴 */
  --font:'Pretendard','Pretendard Variable',-apple-system,'Segoe UI','Malgun Gothic',sans-serif;
  --font-num:'IBM Plex Mono',ui-monospace,'Consolas',monospace;
}

/* 어두운 화면 — 왼쪽 메뉴는 원래 어두우므로 그대로 두고 작업 영역만 뒤집는다 */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#14180f;
    --card:#1c2118;
    --chip:#252c20;
    --bd:#333c2f;
    --bd-soft:#2a3226;
    --green:#8fa286;
    --gold:#d9b87c;
    --gold-soft:#332b1d;
    --tx:#e9e6dc;
    --tx2:#9aa393;
    --tx3:#6e7668;
    --danger:#d9776c;
    --danger-bg:#2e1b18;
    --warn:#d7a05c;
    --warn-bg:#2d2415;
  }
}
:root[data-theme="dark"]{
  --bg:#14180f;
  --card:#1c2118;
  --chip:#252c20;
  --bd:#333c2f;
  --bd-soft:#2a3226;
  --green:#8fa286;
  --gold:#d9b87c;
  --gold-soft:#332b1d;
  --tx:#e9e6dc;
  --tx2:#9aa393;
  --tx3:#6e7668;
  --danger:#d9776c;
  --danger-bg:#2e1b18;
  --warn:#d7a05c;
  --warn-bg:#2d2415;
}