/* ============================================================================
   한경국립대학교 포털 — 디자인 토큰
   색은 www.hknu.ac.kr 에서 뽑았다. (#0a4a9b 메인 블루 / #0f2c5e 딥네이비 /
   #00837c 틸 / #fcaf15 포인트 앰버)

   여기에는 "값"만 둔다. 레이아웃과 컴포넌트는 app.css 에 있다.
   ========================================================================= */

:root {
    /* ── 브랜드 ── */
    --hknu-blue: #0a4a9b;
    --hknu-blue-600: #0857b8;
    --hknu-blue-400: #3b82d6;
    --hknu-navy: #0f2c5e;
    --hknu-teal: #00837c;
    --hknu-amber: #fcaf15;
    --hknu-red: #d63f3f;

    /* 브랜드 색을 옅게 깐 배경 (선택 상태, 강조 카드) */
    --brand-tint: #eaf1fb;
    --brand-tint-strong: #d7e5f8;

    /* ── 표면 ── */
    --bg: #f2f4f7;
    --surface: #ffffff;
    --surface-2: #f7f8fa;
    --surface-sunken: #eceef2;
    --line: #e3e6ec;
    --line-strong: #cfd4dd;

    /* ── 글자 ── */
    --text: #17191d;
    --text-2: #5b6270;
    --text-3: #8b93a1;
    --text-on-brand: #ffffff;

    /* ── 상태 ── */
    --ok: #0f8a4d;
    --warn: #c77a08;
    --danger: #d63f3f;
    --info: var(--hknu-blue);

    /* ── 반경 ── */
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 18px;
    --r-xl: 24px;
    --r-pill: 999px;

    /* ── 그림자 ── */
    --sh-1: 0 1px 2px rgba(15, 44, 94, .06), 0 1px 3px rgba(15, 44, 94, .04);
    --sh-2: 0 2px 8px rgba(15, 44, 94, .08), 0 1px 3px rgba(15, 44, 94, .05);
    --sh-3: 0 8px 28px rgba(15, 44, 94, .14);
    --sh-up: 0 -2px 16px rgba(15, 44, 94, .07);

    /* ── 레이아웃 ── */
    --topbar-h: 56px;
    --bottomnav-h: 60px;
    --rail-w: 92px;          /* 태블릿 세로 레일 */
    --sidebar-w: 248px;      /* 데스크톱 사이드바 */
    --content-max: 720px;    /* 앱 본문 최대 폭 — 큰 화면에서 줄이 너무 길어지지 않게 */
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);

    /* ── 타이포 ── */
    --font: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, 'Segoe UI',
            'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;

    /* ── 모션 ── */
    --ease: cubic-bezier(.22, .61, .36, 1);
    --dur: 220ms;

    /* ── 포인터 적응 (js/app.js 가 <html data-pointer> 를 바꾼다) ──
       터치는 손가락 폭(≈9mm)을 고려해 44~48px, 마우스는 더 촘촘하게. */
    --tap: 44px;
    --row-py: 14px;
    --gap: 12px;
    --font-base: 15px;

    color-scheme: light;
}

/* 손가락 — 타깃을 키우고 여백을 넉넉히 */
html[data-pointer="touch"] {
    --tap: 48px;
    --row-py: 16px;
    --gap: 14px;
    --font-base: 15px;
}

/* 마우스 — 한 화면에 더 많이 보이도록 촘촘하게 */
html[data-pointer="mouse"] {
    --tap: 36px;
    --row-py: 10px;
    --gap: 10px;
    --font-base: 14px;
}

/* ── 다크 모드 ────────────────────────────────────────────────────────────
   설정에서 켜면 <html data-theme="dark">. 아무것도 고르지 않았으면 OS 설정을 따른다. */
:root[data-theme="dark"] {
    --bg: #101318;
    --surface: #181c23;
    --surface-2: #1f242c;
    --surface-sunken: #0c0f13;
    --line: #2a3038;
    --line-strong: #3a424e;

    --text: #eef1f5;
    --text-2: #a8b1bf;
    --text-3: #767f8d;

    --brand-tint: #17273f;
    --brand-tint-strong: #1d3454;
    --hknu-blue: #4d92e8;
    --hknu-blue-600: #6aa7f0;
    --hknu-navy: #0b1b33;

    --sh-1: 0 1px 2px rgba(0, 0, 0, .4);
    --sh-2: 0 2px 10px rgba(0, 0, 0, .45);
    --sh-3: 0 8px 30px rgba(0, 0, 0, .55);
    --sh-up: 0 -2px 16px rgba(0, 0, 0, .4);

    color-scheme: dark;
}

/* 사용자가 앱에서 명시적으로 고르지 않은 경우에만 OS 설정을 따른다 */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]):not([data-theme="dark"]) {
        --bg: #101318;
        --surface: #181c23;
        --surface-2: #1f242c;
        --surface-sunken: #0c0f13;
        --line: #2a3038;
        --line-strong: #3a424e;
        --text: #eef1f5;
        --text-2: #a8b1bf;
        --text-3: #767f8d;
        --brand-tint: #17273f;
        --brand-tint-strong: #1d3454;
        --hknu-blue: #4d92e8;
        --hknu-blue-600: #6aa7f0;
        --sh-1: 0 1px 2px rgba(0, 0, 0, .4);
        --sh-2: 0 2px 10px rgba(0, 0, 0, .45);
        --sh-3: 0 8px 30px rgba(0, 0, 0, .55);
        --sh-up: 0 -2px 16px rgba(0, 0, 0, .4);
        color-scheme: dark;
    }
}

/* 일정 종류별 색 — 캘린더와 범례가 같은 값을 쓴다 */
:root {
    --k-lecture: var(--hknu-blue);
    --k-academic: var(--hknu-teal);
    --k-exam: var(--hknu-red);
    --k-personal: #7c5cd6;
    --k-holiday: var(--hknu-amber);
}
