/*
 * 고객관리 디자인 토큰.
 *
 * 색·간격·둥글기·그림자를 여기 한곳에 모은다. 나중에 플래너를 이쪽으로
 * 맞출 때 이 파일만 보면 된다.
 *
 * 플래너 CSS 를 물려받지 않고 새로 잡았다 — 플래너는 인라인 스타일이
 * 62곳에 흩어져 있어 기준선으로 삼기 어렵다.
 */

:root {
    /* ── 색 ────────────────────────────────────────────────────────── */
    --c-bg: #f6f7f9;
    --c-surface: #ffffff;
    --c-surface-muted: #fafbfc;

    --c-text: #1a1d21;
    --c-text-soft: #5b6570;
    --c-text-faint: #8b949e;

    --c-line: #e4e7eb;
    --c-line-strong: #d0d5dc;

    --c-accent: #0f62fe;
    --c-accent-soft: #e8f0ff;
    --c-accent-text: #0043ce;

    --c-danger: #c02b34;
    --c-danger-soft: #fdeced;

    --c-ok: #0f7b4f;
    --c-ok-soft: #e6f4ec;

    --c-warn: #9a6200;
    --c-warn-soft: #fdf3e0;

    /* 진행 단계별 색. 명도만 다르면 목록에서 스캔이 안 돼, 단계마다 다른 색을
       준다(노션식). 흐름: 새 문의(회색) → 상담(파랑) → 계약전(보라) →
       견적 전달·답 대기(노랑) → 빽콜(주황·살구, 다시 연락) →
       계약 성사(초록) → 여행중(청록) → 종료(회색). */
    --c-stage-1: #e9ebee;   /* 문의접수 — 새 문의(중립) */
    --c-stage-2: #dbeafe;   /* 상담중 — 파랑 */
    --c-stage-3: #e7e0fb;   /* 상담후계약전 — 보라 */
    --c-stage-4: #fdecc8;   /* 견적서전달완료 — 노랑(전달·답 대기) */
    --c-stage-5: #ffe3c4;   /* 빽콜예정 — 주황(다시 연락하기로 잡음) */
    --c-stage-6: #ffd3c9;   /* 빽콜후계약전 — 살구(연락함·결과 대기) */
    --c-stage-7: #cdeed9;   /* 계약완료 — 초록(성사) */
    --c-stage-8: #cbeef0;   /* 여행중 — 청록(진행) */
    --c-stage-9: #d9dde2;   /* 여행종료 — 회색(종료) */
    --c-stage-text: #2b3340;

    /* ── 간격 ──────────────────────────────────────────────────────── */
    --c-gap-1: 4px;
    --c-gap-2: 8px;
    --c-gap-3: 12px;
    --c-gap-4: 16px;
    --c-gap-5: 24px;
    --c-gap-6: 32px;

    /* ── 모양 ──────────────────────────────────────────────────────── */
    --c-radius-sm: 6px;
    --c-radius: 10px;
    --c-radius-lg: 14px;
    --c-radius-pill: 999px;

    --c-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.05);
    --c-shadow: 0 4px 14px rgba(16, 24, 40, 0.08);
    --c-shadow-panel: -8px 0 32px rgba(16, 24, 40, 0.12);

    /* ── 글자 ──────────────────────────────────────────────────────── */
    --c-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Malgun Gothic',
        'Apple SD Gothic Neo', sans-serif;
    --c-size-xs: 12px;
    --c-size-sm: 13px;
    --c-size: 14px;
    --c-size-lg: 16px;
    --c-size-title: 20px;

    /* ── 그 밖 ─────────────────────────────────────────────────────── */
    --c-nav-h: 52px;
    --c-panel-w: 460px;
    --c-ease: 180ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* 움직임을 줄여 달라는 설정을 존중한다 */
@media (prefers-reduced-motion: reduce) {
    :root {
        --c-ease: 1ms linear;
    }
}