/* 인재원 진로 진학 내부 포털 디자인 토큰 — DESIGN.md 녹색 브랜드 정본.
   밀도 우선 업무용 어드민. 사이드바=진녹 디밍, 콘텐츠=흰 표면.
   보라·파랑·그라데이션·네온·이모지 금지. 라인 SVG(stroke:currentColor). Pretendard 1개. keep-all. */

@font-face {
  font-family: "Pretendard";
  src: url("../fonts/PretendardVariable.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  /* ── 네이비 팔레트(대구교대 학사시스템 룩 차용) ──
     --green* 토큰명은 유지(전 템플릿 호환), 값만 네이비/블루로 리스킨. */
  --green:   #3156A5;   /* 메인 블루(구 녹색 자리) */
  --green-d: #123379;   /* 딥네이비 */
  --logo:    #123379;
  --mint:    #e5f0f9;   /* 연블루 선택/틴트(구 민트) */
  --mint-2:  #eef4fb;
  --bg:      #f4f6fa;
  --card:    #ffffff;
  --ink:     #16202e;
  --soft:    #5a6675;
  --line:    #e2e7ef;
  --ok:      #1a7f4b;
  --warn:    #b06000;
  --danger:  #c5221f;

  /* ── 네이비 사이드바 ── */
  --nav-bg:      #16294d;
  --nav-bg-2:    #1f3a70;   /* 헤더/브랜드 존 */
  --nav-line:    rgba(255,255,255,.10);
  --nav-ink:     #e6ecf7;   /* 사이드바 본문 */
  --nav-sub:     #9fb0d4;   /* 사이드바 보조·그룹 라벨 */
  --nav-active:  rgba(255,255,255,.13);
  --nav-bar:     #6f9de0;   /* active 좌측 바(연블루) */

  /* ── 어드민 표면(--i-* 유지, 네이비화) ── */
  --i-page:          #f4f6fa;
  --i-surface:       #ffffff;
  --i-sunken:        #eef4fb;   /* 표 헤더/선택 연블루 */
  --i-border:        #e2e7ef;
  --i-border-strong: #c6cede;
  --i-ink:           #16202e;
  --i-sub:           #5a6675;
  --i-accent:        #3156A5;
  --i-accent-tint:   #e5f0f9;
  --i-info:          #1395E9;   /* 액센트 브라이트 블루 */
  --i-success:       #1a7f4b;
  --i-warning:       #b06000;
  --i-danger:        #c5221f;

  /* ── 반경·고도 ── */
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --r-card: 16px;
  --r-btn: 10px;
  --shadow-raised:  0 1px 2px rgba(15,40,28,.06), 0 0 0 1px rgba(15,40,28,.04);
  --shadow-card:    0 12px 24px rgba(15,40,28,.07);
  --shadow-overlay: 0 24px 50px rgba(15,40,28,.10);

  --font: "Pretendard", -apple-system, "Segoe UI", system-ui, sans-serif;
  --font-serif: var(--font);
}

* { box-sizing: border-box; }
html, body { margin: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font); color: var(--i-ink); background: var(--i-page);
  font-weight: 400; font-size: 13.5px; line-height: 1.6;
  word-break: keep-all; -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
h1, h2, h3 { margin: 0; line-height: 1.15; letter-spacing: 0; font-weight: 800; }
h2 { font-size: 20px; }
h3 { font-size: 15px; font-weight: 700; }
p { margin: 0; }
img, svg { max-width: 100%; }

/* 한국어 방어 기본값 */
.grid { display: grid; }
.grid > * { min-width: 0; }
.tnum { font-variant-numeric: tabular-nums; }
.muted { color: var(--i-sub); }

/* 아이콘: 라인 SVG (Lucide 스타일, viewBox 24) */
.ic { width: 18px; height: 18px; flex: none; stroke: currentColor; stroke-width: 1.9;
  fill: none; stroke-linecap: round; stroke-linejoin: round; }

/* ── 버튼 ── */
.btn {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
  border: 1px solid transparent; cursor: pointer; font-family: var(--font);
  font-size: 13px; font-weight: 700; line-height: 1;
  border-radius: var(--r-btn); padding: 9px 15px; text-decoration: none;
  transition: background .14s, border-color .14s, color .14s;
}
.btn .ic { width: 16px; height: 16px; }
.btn-accent { background: var(--green); color: #fff; }
.btn-accent:hover { background: var(--green-d); }
.btn-primary { background: var(--green); color: #fff; }   /* 별칭 */
.btn-primary:hover { background: var(--green-d); }
.btn-ghost { background: var(--i-surface); border-color: var(--i-border-strong); color: var(--i-ink); }
.btn-ghost:hover { border-color: var(--green); color: var(--green-d); background: var(--mint-2); }
.btn-danger { background: var(--i-surface); border-color: var(--danger); color: var(--danger); }
.btn-danger:hover { background: var(--danger); color: #fff; }
.btn-sm { padding: 6px 11px; font-size: 12.5px; }

/* ── 카드 ── */
.card {
  background: var(--i-surface); border: 1px solid var(--i-border);
  border-radius: var(--r-card); padding: 13px 15px; box-shadow: var(--shadow-raised);
}
.card-hover { transition: border-color .14s, box-shadow .16s, transform .16s; }
.card-hover:hover { border-color: var(--green); box-shadow: var(--shadow-card); }

/* ── 카운트 카드(대시보드) ── */
.count-card {
  display: block; background: var(--i-surface); border: 1px solid var(--i-border);
  border-radius: var(--r-card); padding: 12px 14px; box-shadow: var(--shadow-raised);
  color: inherit; transition: border-color .14s, box-shadow .16s, transform .16s;
}
.count-card:hover { border-color: var(--green); box-shadow: var(--shadow-card); transform: translateY(-2px); }
.count-card .lbl { font-size: 12.5px; font-weight: 600; color: var(--i-sub); }
.count-card .num { font-size: 25px; font-weight: 800; margin-top: 4px; color: var(--i-ink); }

/* ── 테이블(헤더 연녹, 행 구분선, zebra 금지) ── */
table.tbl {
  width: 100%; border-collapse: separate; border-spacing: 0; font-size: 13px;
  background: var(--i-surface); border: 1px solid var(--i-border);
  border-radius: var(--r-card); overflow: hidden;
}
table.tbl th {
  text-align: left; color: var(--green-d); font-weight: 700; font-size: 12.5px;
  padding: 7px 12px; background: var(--mint); border-bottom: 1px solid var(--i-border);
  white-space: nowrap;
}
table.tbl td { padding: 7px 12px; border-bottom: 1px solid var(--i-border); vertical-align: middle; }
table.tbl tbody tr:last-child td { border-bottom: none; }
table.tbl tbody tr:hover td { background: var(--mint-2); }
.tbl-wrap { overflow-x: auto; }

/* ── 배지(상태 tint: 파랑 대신 녹색계열/뉴트럴, 위험=--danger) ── */
.badge {
  display: inline-block; padding: 2px 9px; border-radius: 999px;
  font-size: 12px; font-weight: 700; line-height: 1.5; white-space: nowrap;
}
.b-info    { background: var(--mint);    color: var(--green-d); }
.b-success { background: #e6f4ea;        color: var(--ok); }
.b-warning { background: #fbf0e2;        color: var(--warn); }
.b-danger  { background: #fbe9e8;        color: var(--danger); }
.b-gray    { background: var(--i-sunken); color: var(--i-sub); border: 1px solid var(--i-border); }

/* ── 칩(익명키 monospace) ── */
.chip {
  display: inline-block; font-family: "Pretendard", ui-monospace, Consolas, monospace;
  font-variant-numeric: tabular-nums; letter-spacing: .01em;
  background: var(--i-sunken); color: var(--green-d); border: 1px solid var(--i-border);
  padding: 1px 8px; border-radius: 7px; font-size: 12px; font-weight: 700;
}

/* ── 그룹 라벨 ── */
.grp { font-size: 11.5px; font-weight: 700; color: var(--i-sub); letter-spacing: .02em; }

/* ── 폼 컨트롤 ── */
input, select, textarea { font-family: var(--font); }
.field, input.field, select.field {
  min-height: 40px; border: 1px solid var(--i-border-strong); border-radius: var(--r-btn);
  padding: 9px 12px; font-size: 13.5px; background: var(--i-surface); color: var(--i-ink);
}
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--green); box-shadow: 0 0 0 3px rgba(19,147,90,.16);
}