/* 2117 — 공통 베이스 스타일 (Phase 3)
   ──────────────────────────────────────────────────────────────
   ⚠️ 안전 불변식 (반드시 지킬 것):
   이 파일에는 (1) :root CSS 변수 와 (2) 2117 네임스페이스 클래스
   (.btn-2117*, .hdr-2117*, .font-2117), (3) 브랜드 @font-face 선언 만 둔다.
   body / button / header / a / input / * 같은 "맨몸(요소) 선택자"는
   절대 넣지 않는다. 넣으면 각 페이지의 기존 인라인 스타일과 충돌해
   렌더링이 바뀔 수 있다.
   → 이 규칙을 지키면 어떤 페이지에 <link>로 추가해도, 해당 클래스를
     실제로 붙이기 전까지는 화면에 0 영향(페이지 단위로 가역). */

/* ── 앱 화면 글꼴(Pretendard, OFL) — 자체 호스팅 동적 서브셋. @import는 다른 규칙보다 앞에 있어야 한다 ── */
@import url('../fonts/pretendard/pretendardvariable-dynamic-subset.css');

/* ── 브랜드 폰트(KoPubWorld) — url은 css/ 기준 상대경로라 ../fonts/ ── */
@font-face { font-family:'KoPubWorldDotum';  font-weight:100 550; font-display:swap; src:url('../fonts/kopub-dotum-medium.woff2') format('woff2'); }
@font-face { font-family:'KoPubWorldDotum';  font-weight:551 900; font-display:swap; src:url('../fonts/kopub-dotum-bold.woff2') format('woff2'); }
@font-face { font-family:'KoPubWorldBatang'; font-weight:100 550; font-display:swap; src:url('../fonts/kopub-batang-medium.woff2') format('woff2'); }
@font-face { font-family:'KoPubWorldBatang'; font-weight:551 900; font-display:swap; src:url('../fonts/kopub-batang-bold.woff2') format('woff2'); }

:root {
  /* ── 베이지(학생) 톤 ── */
  --c-beige-bar:    #d6cdc3;
  --c-beige-bar-2:  #c6bbae;
  --c-beige-ink:    #4a4030;
  --c-student-bg:   #f3f5fb;
  --c-student-card: #ffffff;
  --c-student-line: #e2e7f3;
  --c-student-ink:  #1f2540;
  --c-student-accent: #3b82f6;

  /* ── 다크(학습) 톤 ── */
  --c-dark-bg:     #0d1b3e;
  --c-dark-bg-2:   #0a1530;
  --c-dark-line:   #1e3168;
  --c-dark-ink:    #e8f0ff;
  --c-dark-accent: #1d4ed8;

  /* ── 관리자(극다크) 톤 ── */
  --c-admin-bg:    #0a1428;
  --c-admin-panel: #0d1f3c;
  --c-admin-line:  #1e3168;
  --c-admin-ink:   #e8f0ff;

  /* ── 공통 강조/형태 ── */
  --c-gold:    #f5c842;   /* 관리자 강조색 */
  --c-danger:  #b91c1c;
  --radius-2117: 8px;
  --font-2117: -apple-system, 'Apple SD Gothic Neo', 'Segoe UI', 'Malgun Gothic', sans-serif;

  /* ── 브랜드 폰트 토큰 ── */
  --font-ui:   'Pretendard Variable', Pretendard, -apple-system, 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
  --font-text: 'KoPubWorldBatang', 'Batang', serif;
}

/* 표준 폰트 유틸 — 원하는 요소에만 클래스로 적용 */
.font-2117 { font-family: var(--font-2117); }

/* ── 공통 버튼: .btn-2117 + 톤 변형 ── */
.btn-2117 {
  font: inherit;
  font-size: 0.84rem;
  line-height: 1.2;
  border: 1px solid transparent;
  border-radius: var(--radius-2117);
  padding: 7px 12px;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.btn-2117--beige   { background: #eef1fb; border-color: #d6deef; color: #3a4a78; }
.btn-2117--beige:hover { background: #e2e8f8; }
.btn-2117--dark    { background: var(--c-dark-line); border-color: #2d4080; color: var(--c-dark-ink); }
.btn-2117--admin   { background: var(--c-admin-line); border-color: #2d4080; color: #bae6fd; }
.btn-2117--admin:hover { border-color: var(--c-gold); }
.btn-2117--primary { background: var(--c-dark-accent); border-color: #3b82f6; color: #fff; font-weight: 700; }
.btn-2117--danger  { background: var(--c-danger); border-color: #7f1d1d; color: #fff; }

/* ── 표준 헤더 컴포넌트: 구조만 통일(색은 톤별 변수/인라인으로) ── */
.hdr-2117 {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  height: 50px;
  padding: 0 14px;
}
.hdr-2117 .hdr-title {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
}