/* Visual rules: design doc 6-0 (colours, type). Bootstrap 5 is loaded first; this file only sets tokens. */
:root {
  --bs-body-bg: #f7f8fa;
  --bs-body-color: #1f2328;
  --bs-secondary-color: #5b6168;
  --bs-primary: #2f5fd0;
  --bs-primary-rgb: 47, 95, 208;
  --bs-link-color: #2f5fd0;
  --bs-link-hover-color: #244aa6;
  --bs-body-font-family: Pretendard, "Noto Sans KR", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bs-body-font-size: 1rem;
  --bs-body-line-height: 1.7;
  --ok-fg: #1f7a3d;   --ok-bg: #e6f4ea;
  --warn-fg: #a15c00; --warn-bg: #fff4e0;
  --fail-fg: #b3261e; --fail-bg: #fdecea;
  --lock-fg: #4a4f6a; --lock-bg: #eceef5;
  --sidebar-w: 248px;
}
.btn-primary { --bs-btn-bg: #2f5fd0; --bs-btn-border-color: #2f5fd0; --bs-btn-hover-bg: #244aa6; --bs-btn-hover-border-color: #244aa6; }
.btn, .form-control, .form-select { min-height: 44px; }   /* touch target >= 44px */

.app-shell { min-height: 100vh; }
.sidebar { width: var(--sidebar-w); background: #fff; border-right: 1px solid #e3e6eb; }
@media (min-width: 992px) { .sidebar { position: sticky; top: 0; height: 100vh; flex: 0 0 var(--sidebar-w); } }
.sidebar .brand { font-weight: 700; color: inherit; text-decoration: none; }
.sidebar .nav-link { display: flex; justify-content: space-between; align-items: center; min-height: 44px; color: #1f2328; border-radius: .5rem; }
.sidebar .nav-link:hover { background: #f0f2f5; }
.sidebar .nav-link.active { background: #e8eefc; color: #244aa6; font-weight: 600; }
.sidebar .nav-label { font-size: .8rem; color: #5b6168; padding: .5rem .75rem 0; }
.count-badge { min-width: 1.6rem; text-align: center; border-radius: 999px; padding: 0 .5rem; font-size: .8rem; font-weight: 600; }
.count-badge.danger { background: var(--fail-bg); color: var(--fail-fg); }
.count-badge.info { background: #e8eefc; color: #244aa6; }

.state { display: inline-flex; align-items: center; gap: .25rem; border-radius: .375rem; padding: .1rem .5rem; font-size: .875rem; }
.state.ok { background: var(--ok-bg); color: var(--ok-fg); }
.state.warn { background: var(--warn-bg); color: var(--warn-fg); }
.state.fail { background: var(--fail-bg); color: var(--fail-fg); }
.banner-warn { background: var(--warn-bg); color: var(--warn-fg); border: 1px solid #f1d9ad; border-radius: .5rem; }
.project-card { background: #fff; border: 1px solid #e3e6eb; border-radius: .75rem; }
.project-card a.stretched { color: inherit; text-decoration: none; }
.project-card:hover { border-color: #b7c4e6; }
.field-error { color: var(--fail-fg); font-size: .9rem; margin-top: .25rem; }
.stat b { font-size: 1.1rem; }
.sidebar .offcanvas-body { flex-grow: 1; min-height: 0; overflow-y: auto; }