@import url("./fonts/pretendard.css");

/* ===================================================================
   Slack Archiver — Design-system tokens (dark / light)
   monitor 프로젝트와 동일한 CSS 변수 체계를 사용합니다.
   =================================================================== */

/* ---------- dark (default) ---------- */
:root {
  --bg: #1a1d21;
  --panel: #222529;
  --text: #eef1f4;
  --muted: #a6afb8;
  --line: #353b43;
  --accent: #006cb7;
  --accent-soft: #062a45;
  --accent-hover: #005a9c;
  --accent-border: #007bcf;
  --accent-text: #a8dcff;
  --danger: #f85149;
  --warn: #d29922;
  --surface-sunken: #171a1f;
  --surface-raised: #22272d;
  --surface-muted: #2a2e33;
  --surface-hover: #25292e;
  --disabled-text: #484f58;
  --brand: #d9e2ea;
  --nav-border: #495463;
  --nav-active-text: #b9e4ff;
  --purple-bg: #2d1f3d;
  --purple-border: #6e40c9;
  --purple-text: #bc8cff;
  --tag-bg: #1c2333;
  --tag-line: #30363d;
  --scroll-thumb: #3b434d;
  --scroll-thumb-hover: #4e5a66;
}

/* ---------- light ---------- */
html[data-theme="light"] {
  --bg: #f3f6f8;
  --panel: #ffffff;
  --text: #1d2935;
  --muted: #64717d;
  --line: #d7e0e7;
  --accent: #006cb7;
  --accent-soft: #e6f3fc;
  --accent-hover: #005a9c;
  --accent-border: #8bc9ed;
  --accent-text: #005a9c;
  --danger: #c83d3d;
  --warn: #a76600;
  --surface-sunken: #f6f8fa;
  --surface-raised: #ffffff;
  --surface-muted: #e9eef2;
  --surface-hover: #e3edf4;
  --disabled-text: #8a97a3;
  --brand: #ffffff;
  --nav-border: #c7d2dc;
  --nav-active-text: #005a9c;
  --purple-bg: #f1ebff;
  --purple-border: #c7b4f2;
  --purple-text: #6841b8;
  --tag-bg: #edf3f9;
  --tag-line: #cbd8e5;
  --scroll-thumb: #b8c4ce;
  --scroll-thumb-hover: #98a7b3;
}

/* ---------- global resets ---------- */
* { box-sizing: border-box; margin: 0; padding: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

body {
  font-family: "Pretendard", "Apple SD Gothic Neo", "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: radial-gradient(circle at top right, #2b3138, var(--bg) 40%);
  color: var(--text);
  min-height: 100vh;
}
html[data-theme="light"] body {
  background: radial-gradient(circle at top right, #e3edf4, var(--bg) 42%);
}

html { overflow-y: scroll; }
.app-page, .login-page { display: flex; flex-direction: column; min-height: 100vh; }
.app-page .wrap { flex: 1; width: 100%; }

/* ---------- scrollbar ---------- */
* { scrollbar-width: thin; scrollbar-color: var(--scroll-thumb) transparent; }
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: var(--scroll-thumb); border-radius: 3px; }
*::-webkit-scrollbar-thumb:hover { background: var(--scroll-thumb-hover); }