/* ==========================================================================
   공통 스타일 1/3 — 기본 글꼴·배경, Bootstrap 색 맞춤. 디자인 토큰은 tokens.css (관리자 화면과 공유).
   tokens.css 다음에 불러오고, 이어서 app-layout.css(레이아웃) → app-components.css(컴포넌트) 순서로 불러온다
   (templates/components/app_css.html). 세 파일을 합친 순서가 곧 캐스케이드 순서다.
   기능별 스타일은 kanban.css / gantt.css / members.css / projects*.css 에 둔다.
   ========================================================================== */

:root {
  /* Bootstrap 변수는 tokens.css 의 토큰을 가리킨다 (관리자 화면은 Bootstrap 을 쓰지 않는다) */
  --bs-body-font-family: var(--font-sans);
  --bs-primary: var(--accent);
  --bs-primary-rgb: 79, 70, 229;
  --bs-link-color: var(--accent);
  --bs-link-color-rgb: 79, 70, 229;
  --bs-link-hover-color: var(--accent-hover);
  --bs-border-color: var(--border);
}

html, body { height: 100%; }

body {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--text);
  font-size: 0.9375rem;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.01em;
}

/* ---------- Bootstrap primary 색 맞춤 ---------- */
.btn-primary {
  --bs-btn-bg: var(--accent);
  --bs-btn-border-color: var(--accent);
  --bs-btn-hover-bg: var(--accent-hover);
  --bs-btn-hover-border-color: var(--accent-hover);
  --bs-btn-active-bg: var(--accent-hover);
  --bs-btn-active-border-color: var(--accent-hover);
  --bs-btn-disabled-bg: var(--accent);
  --bs-btn-disabled-border-color: var(--accent);
}
.btn-outline-primary {
  --bs-btn-color: var(--accent);
  --bs-btn-border-color: var(--accent);
  --bs-btn-hover-bg: var(--accent);
  --bs-btn-hover-border-color: var(--accent);
  --bs-btn-active-bg: var(--accent-hover);
}
.btn { font-weight: 500; border-radius: var(--radius-sm); }
.btn-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; padding: 0; font-size: 1.25rem; border: 0; background: transparent;
}
.form-control, .form-select { border-radius: var(--radius-sm); border-color: var(--border-strong); }
.form-control:focus, .form-select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.15);
}
.form-label { font-weight: 600; font-size: 0.875rem; margin-bottom: 0.35rem; }
.form-text { font-size: 0.8rem; }
.nav-pills .nav-link.active { background: var(--accent); }
