/* SecureVault 디자인 시스템 — 3종 테마(vault·enia·claude)의 시맨틱 토큰. 컴포넌트는 여기 정의된 별칭만 사용한다 */

/* ───────────────────────────────────────────────
   공통: 모든 테마가 공유하는 별칭 기본값(라이트 기준)
   각 테마 블록이 필요한 값만 재정의한다.
   ─────────────────────────────────────────────── */
:root,
[data-theme="enia"] {
  color-scheme: light;

  /* 브랜드 — ENIASOFT 블루 + 오렌지(화면당 1회) */
  --brand: #20a7d4;
  --brand-hover: #1b8cb3;
  --brand-active: #176f8f;
  --brand-subtle: #eaf7fb;
  --brand-subtle-2: #cbebf5;
  --text-on-brand: #ffffff;

  --accent: #f29919;
  --accent-hover: #d07d0e;
  --accent-subtle: #fef4e6;
  --text-on-accent: #ffffff;

  /* 텍스트 */
  --text-strong: #1d1f21;
  --text-body: #52565a;
  --text-muted: #6c7176;
  --text-faint: #8b9096;
  --text-inverse: #ffffff;
  --text-brand: #1b8cb3;
  --text-link: #1b8cb3;

  /* 표면 */
  --surface-page: #f7f8f9;
  --surface-card: #ffffff;
  --surface-raised: #ffffff;
  --surface-sunken: #eef0f2;
  --surface-hover: #f2f4f6;
  --surface-inverse: #1d1f21;
  --surface-sidebar: #ffffff;
  --surface-topbar: rgba(255, 255, 255, .88);
  --surface-overlay: rgba(17, 18, 20, .45);
  --surface-code: #1d1f21;
  --text-code: #e8ecf1;

  /* 테두리 */
  --border-subtle: #e4e7ea;
  --border-default: #d0d4d9;
  --border-strong: #a7acb2;
  --border-brand: #20a7d4;

  /* 상태 */
  --success: #1fa971;
  --success-subtle: #e7f6ef;
  --success-text: #177f56;
  --warning: #f29919;
  --warning-subtle: #fef4e6;
  --warning-text: #a9630d;
  --danger: #e2483d;
  --danger-subtle: #fbeae9;
  --danger-text: #b9352c;
  --info: #20a7d4;
  --info-subtle: #eaf7fb;
  --info-text: #176f8f;
  --neutral-chip: #eef0f2;
  --neutral-chip-text: #52565a;

  /* 포커스·그림자 */
  --focus-ring: rgba(32, 167, 212, .45);
  --shadow-xs: 0 1px 2px rgba(29, 31, 33, .05);
  --shadow-sm: 0 1px 3px rgba(29, 31, 33, .08), 0 1px 2px rgba(29, 31, 33, .04);
  --shadow-md: 0 6px 16px rgba(29, 31, 33, .08), 0 2px 4px rgba(29, 31, 33, .04);
  --shadow-lg: 0 16px 40px rgba(29, 31, 33, .14), 0 4px 10px rgba(29, 31, 33, .06);
  --shadow-brand: 0 8px 24px rgba(32, 167, 212, .28);

  /* 히어로 전용 */
  --gradient-brand: linear-gradient(100deg, #20a7d4 0%, #3ab4da 45%, #f29919 100%);

  /* 타이포 */
  --font-display: "Poppins", "Pretendard Variable", "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-body: "Manrope", "Pretendard Variable", "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  --display-weight: 700;
  --display-tracking: -0.02em;

  /* 형태 */
  --radius-md: 10px;
  --radius-lg: 14px;
  --control-radius: 10px;

  /* 차트 */
  --chart-1: #20a7d4;
  --chart-2: #f29919;
  --chart-3: #1fa971;
  --chart-4: #e2483d;
  --chart-grid: #e4e7ea;
  --chart-text: #6c7176;

  /* 사이드바 내비 */
  --nav-text: #52565a;
  --nav-text-hover: #1d1f21;
  --nav-bg-hover: #f2f4f6;
  --nav-text-active: #176f8f;
  --nav-bg-active: #eaf7fb;
  --nav-section: #8b9096;
}

/* ───────────────────────────────────────────────
   vault — 다크. 기존 FileGuard Edition 계승(민트 #00d9a3),
   글로우·그라데이션 제거, 대비는 WCAG AA 기준으로 상향
   ─────────────────────────────────────────────── */
[data-theme="vault"] {
  color-scheme: dark;

  --brand: #00d9a3;
  --brand-hover: #2ee6b4;
  --brand-active: #00b388;
  --brand-subtle: rgba(0, 217, 163, .12);
  --brand-subtle-2: rgba(0, 217, 163, .22);
  --text-on-brand: #07110e;

  --accent: #4d9eff;
  --accent-hover: #6fb0ff;
  --accent-subtle: rgba(77, 158, 255, .14);
  --text-on-accent: #07111c;

  --text-strong: #e8ecf4;
  --text-body: #a9b2c6;
  --text-muted: #7c869d;
  --text-faint: #5f6880;
  --text-inverse: #0f1115;
  --text-brand: #2ee6b4;
  --text-link: #5fb3ff;

  --surface-page: #0f1115;
  --surface-card: #151821;
  --surface-raised: #1b1f2a;
  --surface-sunken: #0c0e12;
  --surface-hover: #1b1f2a;
  --surface-inverse: #e8ecf4;
  --surface-sidebar: #121419;
  --surface-topbar: rgba(15, 17, 21, .86);
  --surface-overlay: rgba(3, 4, 6, .66);
  --surface-code: #0b0d11;
  --text-code: #dfe5ef;

  --border-subtle: #222634;
  --border-default: #2d3344;
  --border-strong: #3e4660;
  --border-brand: #00d9a3;

  --success: #26d97f;
  --success-subtle: rgba(38, 217, 127, .14);
  --success-text: #5fe8a1;
  --warning: #ffa726;
  --warning-subtle: rgba(255, 167, 38, .14);
  --warning-text: #ffbd5c;
  --danger: #ff4d6d;
  --danger-subtle: rgba(255, 77, 109, .14);
  --danger-text: #ff7b93;
  --info: #4d9eff;
  --info-subtle: rgba(77, 158, 255, .14);
  --info-text: #7db7ff;
  --neutral-chip: #1f2431;
  --neutral-chip-text: #a9b2c6;

  --focus-ring: rgba(0, 217, 163, .45);
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .4);
  --shadow-md: 0 8px 20px rgba(0, 0, 0, .45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, .6);
  --shadow-brand: 0 8px 24px rgba(0, 217, 163, .18);
  --gradient-brand: linear-gradient(100deg, #00d9a3 0%, #2ee6b4 50%, #4d9eff 100%);

  --font-display: "Sora", "Pretendard Variable", "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-body: "Pretendard Variable", "Pretendard", "Sora", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --display-weight: 700;
  --display-tracking: -0.02em;

  --radius-md: 8px;
  --radius-lg: 12px;
  --control-radius: 8px;

  --chart-1: #00d9a3;
  --chart-2: #4d9eff;
  --chart-3: #ffa726;
  --chart-4: #ff4d6d;
  --chart-grid: #222634;
  --chart-text: #7c869d;

  --nav-text: #a9b2c6;
  --nav-text-hover: #e8ecf4;
  --nav-bg-hover: rgba(255, 255, 255, .04);
  --nav-text-active: #2ee6b4;
  --nav-bg-active: rgba(0, 217, 163, .10);
  --nav-section: #5f6880;
}

/* ───────────────────────────────────────────────
   claude — 따뜻한 아이보리 + 테라코타. 세리프 제목, 웜 그레이, 낮은 채도 상태색
   ─────────────────────────────────────────────── */
[data-theme="claude"] {
  color-scheme: light;

  --brand: #d97757;
  --brand-hover: #c2623f;
  --brand-active: #a44f30;
  --brand-subtle: #f8e9e2;
  --brand-subtle-2: #f0d3c6;
  --text-on-brand: #ffffff;

  --accent: #6a9bcc;
  --accent-hover: #5785b3;
  --accent-subtle: #e9f0f8;
  --text-on-accent: #ffffff;

  --text-strong: #1f1e1b;
  --text-body: #4a473f;
  --text-muted: #6b675b;
  --text-faint: #8e8a7c;
  --text-inverse: #faf9f5;
  --text-brand: #b85a3a;
  --text-link: #9a4b2f;

  --surface-page: #f4f3ee;
  --surface-card: #ffffff;
  --surface-raised: #fffdf8;
  --surface-sunken: #ecebe3;
  --surface-hover: #f6f4ed;
  --surface-inverse: #2b2925;
  --surface-sidebar: #faf9f5;
  --surface-topbar: rgba(244, 243, 238, .88);
  --surface-overlay: rgba(31, 30, 27, .42);
  --surface-code: #2b2925;
  --text-code: #ece9df;

  --border-subtle: #e6e3d8;
  --border-default: #d4d0c2;
  --border-strong: #b3ae9d;
  --border-brand: #d97757;

  --success: #4f8a5b;
  --success-subtle: #e9f1e7;
  --success-text: #3c6f47;
  --warning: #c9902e;
  --warning-subtle: #f8efdc;
  --warning-text: #8f6416;
  --danger: #b8432f;
  --danger-subtle: #f7e5e0;
  --danger-text: #943323;
  --info: #5b8dbe;
  --info-subtle: #e8eff7;
  --info-text: #3f6a95;
  --neutral-chip: #ecebe3;
  --neutral-chip-text: #4a473f;

  --focus-ring: rgba(217, 119, 87, .42);
  --shadow-xs: 0 1px 2px rgba(43, 41, 37, .06);
  --shadow-sm: 0 1px 3px rgba(43, 41, 37, .08), 0 1px 2px rgba(43, 41, 37, .04);
  --shadow-md: 0 6px 16px rgba(43, 41, 37, .09), 0 2px 4px rgba(43, 41, 37, .04);
  --shadow-lg: 0 16px 40px rgba(43, 41, 37, .14), 0 4px 10px rgba(43, 41, 37, .06);
  --shadow-brand: 0 8px 24px rgba(217, 119, 87, .26);
  --gradient-brand: linear-gradient(100deg, #d97757 0%, #e2957a 55%, #6a9bcc 100%);

  --font-display: "Source Serif 4", "Noto Serif KR", "Pretendard Variable", Georgia, "Times New Roman", serif;
  --font-body: "Pretendard Variable", "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  --display-weight: 600;
  --display-tracking: -0.01em;

  --radius-md: 10px;
  --radius-lg: 12px;
  --control-radius: 9px;

  --chart-1: #d97757;
  --chart-2: #6a9bcc;
  --chart-3: #4f8a5b;
  --chart-4: #b8432f;
  --chart-grid: #e6e3d8;
  --chart-text: #6b675b;

  --nav-text: #4a473f;
  --nav-text-hover: #1f1e1b;
  --nav-bg-hover: #f0eee6;
  --nav-text-active: #9a4b2f;
  --nav-bg-active: #f8e9e2;
  --nav-section: #8e8a7c;
}

/* 테마 전환 시 배경/글자색만 짧게 전환 (레이아웃 점프 방지) */
html[data-theme] body {
  transition: background-color var(--duration-base) var(--ease-standard), color var(--duration-base) var(--ease-standard);
}