/* /assets/css/pages/courses.css?v=1 */

/* ─────────────────────────────────────────────────────────────
  Bright + Compact UI for courses pages
  - filter inputs too wide  → compact grid(4 columns), max page width
  - course name wrapping    → wider course column + ellipsis option
────────────────────────────────────────────────────────────── */

:root{
  --bg: #f6f8fc;
  --card: #ffffff;
  --text: #111827;
  --muted: #6b7280;
  --border: #e6ebf5;

  --primary: #2563eb;
  --primary-2: #1d4ed8;

  --danger: #ef4444;
  --danger-2: #dc2626;

  --shadow: 0 8px 24px rgba(17,24,39,.06);
  --radius: 14px;
}

/* [CRS-BULK-COPY-20260723-101] 1학기→2학기 일괄 개설 전용 미리보기 레이아웃 */
.course-bulk-copy-page{display:grid;gap:18px}
.course-bulk-copy-filter{display:flex;align-items:end;gap:12px;flex-wrap:wrap}
.course-bulk-copy-filter label{display:grid;gap:6px;min-width:170px}
.course-bulk-copy-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.course-bulk-copy-summary>div{display:grid;gap:5px;padding:14px 16px;border:1px solid #dbe7f6;border-radius:12px;background:#f8fbff}
.course-bulk-copy-summary span{font-size:13px;color:#64748b}
.course-bulk-copy-summary strong{color:#0f172a}
.course-bulk-copy-group{margin-top:16px;border:1px solid #dbe7f6;border-radius:16px;background:#fff;overflow:hidden}
.course-bulk-copy-group>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-bottom:1px solid #e5edf7;background:#f8fbff}
.course-bulk-copy-group h2,.course-bulk-copy-group p{margin:0}
.course-bulk-copy-group h2{font-size:18px;color:#0f172a}
.course-bulk-copy-group p{margin-top:3px;font-size:13px;color:#64748b}
.course-bulk-copy-group-actions{display:flex;gap:8px}
.course-bulk-copy-table-wrap{overflow-x:auto}
.course-bulk-copy-table{min-width:1080px;margin:0}
.course-bulk-copy-table th:first-child{width:64px}
.course-bulk-copy-table th:nth-child(2){width:150px}
.course-bulk-copy-table th:nth-child(4){width:130px}
.course-bulk-copy-table th:nth-child(5){width:230px}
.course-bulk-copy-table th:nth-child(6){width:90px}
.course-bulk-copy-table th:nth-child(7){width:110px}
.course-bulk-copy-table th:nth-child(8){width:90px}
.course-bulk-copy-table tr.is-existing{background:#f8fafc;color:#64748b}
.course-bulk-copy-table tr.is-edited{background:#f8fbff}
.course-bulk-copy-category{margin-top:4px;color:#64748b;font-size:12px}
.course-bulk-copy-draft-meta{min-height:16px;margin-top:3px;color:#64748b;font-size:11px}
.course-bulk-copy-draft-change{max-width:300px;min-height:16px;margin-top:2px;overflow:hidden;color:#334155;font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.course-bulk-copy-edit-field>span small{margin-left:5px;color:#64748b;font-size:11px;font-weight:600}
.course-bulk-copy-edited-badge{display:inline-flex;margin-left:6px;padding:3px 7px;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:11px;font-weight:800}
.course-bulk-copy-edited-badge[hidden]{display:none}
.course-bulk-copy-status{display:inline-flex;padding:5px 9px;border-radius:999px;background:#e8f2ff;color:#1d4ed8;font-size:12px;font-weight:800}
.course-bulk-copy-status.is-existing{background:#e2e8f0;color:#475569;text-decoration:none}
.course-bulk-copy-dialog{width:min(760px,calc(100vw - 28px));max-height:calc(100vh - 36px);padding:0;border:1px solid #cbd5e1;border-radius:18px;background:#fff;box-shadow:0 24px 64px rgba(15,23,42,.25);overflow:auto}
.course-bulk-copy-dialog::backdrop{background:rgba(15,23,42,.45)}
.course-bulk-copy-dialog-head{position:sticky;top:0;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid #e2e8f0;background:#fff;z-index:2}
.course-bulk-copy-dialog-head h2,.course-bulk-copy-dialog-head p{margin:0}
.course-bulk-copy-dialog-head h2{font-size:20px;color:#0f172a}
.course-bulk-copy-dialog-head p{margin-top:5px;color:#64748b;font-size:13px}
.course-bulk-copy-dialog-close{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:0;border-radius:9px;background:#f1f5f9;color:#334155;font-size:24px;cursor:pointer}
.course-bulk-copy-dialog-body{padding:20px}
.course-bulk-copy-edit-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(130px,1fr);gap:14px}
.course-bulk-copy-edit-field{display:grid;gap:7px;min-width:0}
.course-bulk-copy-edit-field>span,.course-bulk-copy-edit-fixed>span,.course-bulk-copy-hours-total>span{color:#475569;font-size:13px;font-weight:800}
.course-bulk-copy-edit-field input,.course-bulk-copy-edit-field select,.course-bulk-copy-edit-field textarea{width:100%;min-width:0;padding:10px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:#0f172a;font:inherit}
.course-bulk-copy-edit-field textarea{resize:vertical}
.course-bulk-copy-edit-field.is-wide{grid-column:1 / 2}
.course-bulk-copy-edit-field.is-hours{max-width:180px}
.course-bulk-copy-edit-field.is-full{grid-column:1 / -1}
.course-bulk-copy-edit-fixed,.course-bulk-copy-hours-total{display:grid;align-content:center;gap:7px;padding:10px 12px;border:1px solid #dbe7f6;border-radius:10px;background:#f8fbff}
.course-bulk-copy-edit-fixed strong,.course-bulk-copy-hours-total strong{color:#0f172a}
.course-bulk-copy-hours-total{grid-column:2 / 3}
.course-bulk-copy-dialog-notice{margin-top:16px;padding:12px 14px;border-radius:10px;background:#f1f5f9;color:#475569;font-size:13px}
.course-bulk-copy-dialog-actions{position:sticky;bottom:0;display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid #e2e8f0;background:#fff}
.course-bulk-copy-submit{position:sticky;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px;padding:16px 18px;border:1px solid #bfdbfe;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 12px 30px rgba(15,23,42,.12);z-index:3}
.course-bulk-copy-submit p{margin:4px 0 0;color:#64748b}
.course-bulk-copy-empty{padding:32px;border:1px dashed #cbd5e1;border-radius:14px;text-align:center}
@media (max-width:900px){
  .course-bulk-copy-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .course-bulk-copy-submit{align-items:stretch;flex-direction:column}
  .course-bulk-copy-edit-grid{grid-template-columns:1fr}
  .course-bulk-copy-edit-field.is-wide,.course-bulk-copy-edit-field.is-full,.course-bulk-copy-hours-total{grid-column:1}
  .course-bulk-copy-edit-field.is-hours{max-width:none}
}
/* [CRS-BULK-COPY-EDIT-20260723-101] 일괄 개설 행별 수정 상태와 반응형 팝업 편집 UI */

*{ box-sizing:border-box; }
.page{
  max-width: 1320px;         /* [CRS-LAPTOP-20260327-001] 노트북 화면에서 우측 답답함 완화 */
  margin: 18px auto 60px;
  padding: 0 14px;
  color: var(--text);
}

/* ── Head */
.page__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.page__title{
  margin:0;
  font-size:22px;
  font-weight:800;
  letter-spacing:-.2px;
}
.page__desc{
  margin:6px 0 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
}
.page__actions{ display:flex; gap:8px; flex-wrap:wrap; }

/* ── Card */
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.card + .card{ margin-top:14px; }
.card__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  background: linear-gradient(to bottom, #ffffff, #fbfcff);
}
.card__title{
  margin:0;
  font-size:15px;
  font-weight:800;
}
.card__meta{
  color:var(--muted);
  font-size:12px;
}
.card__body{ padding:14px; }

/* ── Alerts */
.alert{
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px 12px;
  margin: 0 0 12px;
  font-size:13px;
  background:#fff;
}
.alert-success{ border-color:#bbf7d0; background:#f0fdf4; color:#166534; }
.alert-danger { border-color:#fecaca; background:#fef2f2; color:#991b1b; }
.alert--ok{ border-color:#bbf7d0; background:#f0fdf4; color:#166534; }
.alert--err{ border-color:#fecaca; background:#fef2f2; color:#991b1b; }

.muted{ color:var(--muted); font-size:13px; }
.hint, .form__hint{ color:var(--muted); font-size:12px; line-height:1.35; margin-top:6px; }

/* ── Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  height:32px;               /* ✅ 더 컴팩트 */
  padding:0 12px;
  border-radius:10px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text);
  text-decoration:none;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  transition: all .12s ease;
}
.btn:hover{ border-color:#cfd7ea; transform: translateY(-1px); }

/* [CRS-OVR-20260115-203] Override section toolbar */
.override-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:8px;
  padding:8px 10px;
  border:1px dashed var(--border);
  border-radius:10px;
  background:#fbfdff;
  flex-wrap:wrap;
}
.override-toolbar .muted{ margin:0; }
.override-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
.override-sum{
  font-size:12px;
  font-weight:800;
  color:#0f172a;
  background:#eef2ff;
  border:1px solid #c7d2fe;
  padding:4px 8px;
  border-radius:999px;
}

/* [CRS-OVR-20260115-204] Override table grouping + remove duplicate row numbers */
#overrideTable tbody tr[data-module-row] td{
  background:#f8fafc;
  font-weight:600;
}
#overrideTable tbody tr[data-module-row] td:first-child{
  color:#1f2937;
}
#overrideTable tbody tr.override-details > td{
  background:#fff;
  padding-top:6px;
  padding-bottom:12px;
}
#overrideTable tbody tr.override-details .table{
  border:1px solid var(--border);
  border-radius:10px;
  overflow:hidden;
  background:#fff;
}
#overrideTable tbody tr.override-details .table th{
  background:#f3f7ff;
  font-size:12px;
}
#overrideTable tbody tr.override-details .table td:first-child,
#overrideTable tbody tr.override-details .table th:first-child{
  display:none;
}
#overrideTable tbody tr.is-pass td{
  background:#fefce8;
}
#overrideTable tbody tr.is-pass select[name="override_mode"]{
  border-color:#facc15;
}
#overrideTable tbody tr.override-details.is-pass .table th:last-child,
#overrideTable tbody tr.override-details.is-pass .table td:last-child{
  display:none;
}
/* [CRS-OVR-20260115-505] Section color bands */
#overrideTable tbody tr[data-module-row]{
  border-left:4px solid transparent;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n+1){
  border-left-color:#60a5fa;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n+2){
  border-left-color:#f59e0b;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n+3){
  border-left-color:#10b981;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n){
  border-left-color:#a78bfa;
}
#overrideTable tbody tr.override-details{
  border-left:4px solid transparent;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n+1) + tr.override-details{
  border-left-color:#60a5fa;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n+2) + tr.override-details{
  border-left-color:#f59e0b;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n+3) + tr.override-details{
  border-left-color:#10b981;
}
#overrideTable tbody tr[data-module-row]:nth-of-type(4n) + tr.override-details{
  border-left-color:#a78bfa;
}
/* [CRS-OVR-20260115-401] Wider inputs in override sections */
#overrideTable input.control,
#overrideTable select.control{
  width:100%;
  min-width:0;
}
#overrideTable tbody tr.override-details .table td:nth-child(2) input{
  width:100%;
}
#overrideTable tbody tr.override-details .table td:last-child input{
  width:100%;
}
.btn:active{ transform:none; }
.btn-primary, .btn--primary{
  background:var(--primary);
  border-color:var(--primary);
  color:#fff;
}
.btn-primary:hover, .btn--primary:hover{ background:var(--primary-2); border-color:var(--primary-2); }

.btn-danger, .btn--danger{
  background:#fff;
  border-color:#fecaca;
  color:var(--danger-2);
}
.btn-danger:hover, .btn--danger:hover{
  background:#fff5f5;
  border-color:#fca5a5;
}
.btn-sm, .btn--sm{
  height:28px;
  padding:0 10px;
  border-radius:9px;
  font-size:12px;
}

/* ── Form (✅ “칸이 너무 넓다” 해결: 4칸 그리드 + 더 작은 padding) */
.form--grid{
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap:10px 12px;
}
.form__row{
  grid-column: span 3;        /* ✅ 4개/줄 → 폭 줄어듦 */
  min-width: 0;
}
.form__row--wide{ grid-column: 1 / -1; }
.form__actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  align-items:center;
}
.form__label{
  display:block;
  font-size:12px;
  font-weight:800;
  margin:0 0 6px;
  color:#1f2937;
}

.input, .select, textarea{
  width:100%;
  height:34px;               /* ✅ 컴팩트 */
  padding: 6px 10px;
  border-radius:10px;
  border:1px solid var(--border);
  background:#fff;
  font-size:13px;
  outline:none;
}
textarea{
  height:auto;
  min-height: 72px;
  resize: vertical;
}
.input:focus, .select:focus, textarea:focus{
  border-color:#b9c7f5;
  box-shadow: 0 0 0 3px rgba(37,99,235,.10);
}
.is-disabled{ opacity:.6; }

/* Checkbox */
.checkbox{
  display:flex;
  gap:10px;
  align-items:center;
  font-size:13px;
  color:var(--text);
}
.checkbox input{ width:16px; height:16px; }

/* ── Table */
.table-wrap{
  width:100%;
  overflow:auto;              /* 화면 좁으면 가로 스크롤 */
  border-radius: 12px;
  border:1px solid var(--border);
}
.table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width: 980px;
  background:#fff;
}
.table thead th{
  position:sticky;
  top:0;
  background:#f8fbff;
  border-bottom:1px solid var(--border);
  font-size:12px;
  font-weight:900;
  color:#334155;
  text-align:left;
  padding:10px 12px;
  white-space:nowrap;
}
.table td{
  border-bottom:1px solid var(--border);
  padding:10px 12px;
  font-size:13px;
  vertical-align:middle;
}
.selective-overview-page .table td:last-child{
  line-height:1.30;
} /* [CRS-SEL-OVERVIEW-20260309-231] 신청자 명단 줄간격 확대(증가폭 절반 조정) */

/* [CRS-SEL-MATERIAL-FEE-LAYOUT-20260813-001] 7열 현황표의 화면 너비를 고정해 신청자 명단 열 쪼아짐 방지 */
.selective-overview-page .selective-overview-course-card .table{
  min-width:1190px;
  table-layout:fixed;
}
.selective-overview-page .selective-overview-course-card .table th:nth-child(1),
.selective-overview-page .selective-overview-course-card .table td:nth-child(1){ width:175px !important; white-space:nowrap; }
.selective-overview-page .selective-overview-course-card .table th:nth-child(2),
.selective-overview-page .selective-overview-course-card .table td:nth-child(2){ width:75px !important; white-space:nowrap; }
.selective-overview-page .selective-overview-course-card .table th:nth-child(3),
.selective-overview-page .selective-overview-course-card .table td:nth-child(3){ width:230px !important; }
.selective-overview-page .selective-overview-course-card .table th:nth-child(4),
.selective-overview-page .selective-overview-course-card .table td:nth-child(4){ width:110px !important; white-space:nowrap; }
.selective-overview-page .selective-overview-course-card .table th:nth-child(5),
.selective-overview-page .selective-overview-course-card .table td:nth-child(5){ width:175px !important; }
.selective-overview-page .selective-overview-course-card .table th:nth-child(6),
.selective-overview-page .selective-overview-course-card .table td:nth-child(6){ width:90px !important; white-space:nowrap; }
.selective-overview-page .selective-overview-course-card .table th:nth-child(7),
.selective-overview-page .selective-overview-course-card .table td:nth-child(7){ width:auto !important; min-width:360px; }
.selective-overview-page .selective-overview-course-card td form{
  min-width:0;
  max-width:100%;
}
.selective-overview-page .selective-overview-course-card td form input{
  min-width:0 !important;
  width:100%;
}
.selective-overview-page .selective-overview-course-card .table td:nth-child(5) form input{
  width:82px !important;
  flex:0 0 82px;
} /* [CRS-SEL-MATERIAL-FEE-LAYOUT-20260813-002] 교재비·재료비 숫자 입력칸 축소 */

.selective-overview-page .print-only{
  display:none;
}
.selective-overview-page .screen-only{
  display:inline;
} /* [CRS-SEL-PRINT-20260309-302] 화면/출력 텍스트 분기 기본값 */
.selective-overview-page dialog:not([open]){
  display:none !important;
} /* [CRS-SEL-APP-DESC-DIALOG-20260813-001] 설명 팝업을 버튼 클릭 전에는 반드시 숨김 */
.table tbody tr:hover td{ background:#fbfdff; }

#itemsTable {
  min-width: 1010px; /* [CRS-NEW-WEEKLY-20260609-001] 장소 열 숨김 후 주당 시수 입력 폭 확보 */
}

#itemsTable thead th,
#itemsTable td {
  padding: 7px 8px; /* [CRS-NEW-WEEKLY-20260609-002] 과목 입력 행을 더 촘촘하게 정리 */
}

#itemsTable input,
#itemsTable select {
  min-height: 32px;
  padding-left: 8px;
  padding-right: 8px;
}

#itemsTable input[name="item_note"] {
  min-width: 0;
}

#itemsTable input[name="item_weekly_sessions"] {
  min-width: 72px;
  text-align: center;
  font-weight: 800;
}

.course-items-wrap{
  overflow:visible;
  border:0;
  border-radius:0;
}

#itemsTable.course-items-table{
  min-width:0;
  border-collapse:separate;
  border-spacing:0 8px;
  background:transparent;
}

#itemsTable.course-items-table td.course-item-card-cell{
  padding:0;
  border:0;
  background:transparent;
}

.course-item-card{
  display:grid;
  gap:6px;
  padding:8px;
  border:1px solid #dbe6f5;
  border-radius:12px;
  background:#fff;
}

.course-item-card__line{
  display:flex;
  align-items:end;
  gap:8px;
  min-width:0;
}

.course-item-field{
  display:grid;
  gap:4px;
  min-width:0;
}

.course-item-field > span{
  color:#475569;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}

.course-item-field--name{
  flex:0 1 280px;
  width:min(32vw, 280px);
}

.course-item-field--category{
  flex:0 1 180px;
  width:min(20vw, 180px);
}

.course-item-field--teacher{
  grid-template-columns:48px minmax(90px, 130px) 68px auto;
  column-gap:7px;
  align-items:center;
  flex:0 1 292px;
  width:min(100%, 292px);
} /* [CRS-HOURS-WIDTH-20260723-001] 넓어진 시수 입력칸만큼 담당자 그룹 내부 열 확장 */

.course-item-field--teacher > span{
  min-width:50px;
}

.course-item-field--teacher input[type="number"]{
  width:68px;
  min-width:0;
  text-align:center;
  font-weight:800;
} /* [CRS-HOURS-WIDTH-20260723-002] 낮은 해상도에서도 숫자가 잘리지 않도록 시수 입력 폭 확대 */

.course-item-field--teacher em{
  color:#64748b;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}

.course-item-field--teacher .course-student-assignee-name{
  grid-column:2 / 5;
  width:100%;
  min-width:0;
} /* [CSS-CRS-STUDENT-NAME-20260825-001] 학생 담당자 이름 입력을 담당자 선택 아래 한 줄로 표시 */

.course-item-card__line--teachers{
  gap:24px;
} /* [CRS-TEACHER-SPACING-20260723-003] 담당자1과 담당자2 그룹 사이 간격 확대 */

.course-item-total{
  flex:0 0 auto;
  min-width:72px;
  padding:8px 10px;
  border-radius:9px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:12px;
  font-weight:800;
  text-align:center;
  white-space:nowrap;
} /* [CRS-CATEGORY-GUIDE-20260723-005] 오른쪽 설명 공간 확보를 위해 입력 카드 폭과 간격 추가 축소 */

@media (max-width: 760px){
  .course-item-card__line{
    flex-wrap:wrap;
  }
  .course-item-field--name{
    flex-basis:calc(65% - 4px);
  }
  .course-item-field--category{
    flex:1 1 calc(35% - 4px);
  }
  .course-item-field--teacher{
    flex-basis:100%;
  }
  .course-item-total{
    margin-left:auto;
  }
} /* [CRS-TEACHER-HOURS-20260723-006] 좁은 화면에서는 담당자 줄 내부만 자연스럽게 줄바꿈 */

/* [CRS-LVL-TABS-20260116-003] */
.level-tabs{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.level-tabs .tabs{
  display:flex;
  gap:8px;
}
.level-tabs .tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:32px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid #d6e0f0;
  background:#fff;
  color:#0f172a;
  font-weight:800;
}
.level-tabs .tab.is-active{
  background:#0f172a;
  border-color:#0f172a;
  color:#fff;
}
.level-select-hidden{ /* [CRS-LVL-TABS-20260116-007] */
  display:none;
}
.is-hidden{ display:none !important; } /* [CRS-TPL-20260115-040] 템플릿 UI 숨김 */

.course-teacher-extra-cell {
  min-width: 140px;
} /* [CRS-TEACHER-PICKER-20260630-035] 담당2/3 팝업 버튼 셀 */

.course-teacher-extra-btn {
  width: 100%;
  justify-content: center;
  white-space: nowrap;
} /* [CRS-TEACHER-PICKER-20260630-036] 추가 담당 선택 버튼 */

.course-teacher-extra-summary {
  margin-top: 6px;
  color: #475569;
  font-size: 12px;
  line-height: 1.35;
  word-break: keep-all;
} /* [CRS-TEACHER-PICKER-20260630-037] 담당2/3 선택 요약 */

.course-teacher-dialog {
  width: min(520px, calc(100vw - 32px));
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 0;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .22);
} /* [CRS-TEACHER-PICKER-20260630-038] 담당 선택 팝업 */

.course-teacher-dialog::backdrop {
  background: rgba(15, 23, 42, .36);
} /* [CRS-TEACHER-PICKER-20260630-039] 팝업 배경 */

.course-teacher-dialog__head,
.course-teacher-dialog__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  background: #f8fafc;
} /* [CRS-TEACHER-PICKER-20260630-040] 팝업 상하단 */

.course-teacher-dialog__body {
  display: grid;
  gap: 12px;
  padding: 16px;
} /* [CRS-TEACHER-PICKER-20260630-041] 팝업 입력 영역 */

.course-student-selection-summary{
  position:relative;
  min-height:42px;
  padding:11px 12px;
  border:1px solid #dbe6f5;
  border-radius:10px;
  background:#f8fafc;
  color:#475569;
  font-size:13px;
  font-weight:700;
} /* [CRS-STUDENT-POPUP-20260723-005] 본문 학생 선택 결과 요약 */

.course-student-selection-summary:focus{
  outline:2px solid #60a5fa;
  outline-offset:2px;
}

.course-student-selection-tooltip{
  position:absolute;
  z-index:30;
  top:calc(100% + 7px);
  left:0;
  display:none;
  width:min(440px, calc(100vw - 48px));
  max-height:280px;
  overflow:auto;
  padding:12px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#334155;
  box-shadow:0 14px 35px rgba(15, 23, 42, .18);
  font-size:12px;
  font-weight:500;
}

.course-student-selection-summary:hover .course-student-selection-tooltip,
.course-student-selection-summary:focus .course-student-selection-tooltip,
.course-student-selection-summary:focus-within .course-student-selection-tooltip{
  display:block;
}

.course-student-selection-tooltip__title{
  display:block;
  margin-bottom:7px;
  color:#0f172a;
  font-size:13px;
}

.course-student-selection-tooltip ul{
  display:grid;
  gap:6px;
  margin:0;
  padding:0;
  list-style:none;
}

.course-student-selection-tooltip li{
  display:grid;
  grid-template-columns:max-content max-content max-content;
  justify-content:start;
  gap:9px;
  padding-bottom:6px;
  border-bottom:1px solid #f1f5f9;
} /* [CRS-STUDENT-TOOLTIP-20260723-005] 이름 바로 옆에 학번·학년·반을 밀착 배치 */

.course-student-selection-tooltip li:last-child{
  padding-bottom:0;
  border-bottom:0;
}

.course-student-selection-tooltip li strong{
  color:#111827;
  white-space:nowrap;
}

.course-student-selection-tooltip li span{
  color:#111827;
  text-align:left;
} /* [CRS-STUDENT-TOOLTIP-20260723-008] 학년·이름·학번을 모두 검은색으로 표시 */

.course-student-dialog{
  width:min(720px, calc(100vw - 32px));
}

.course-student-dialog__body{
  display:grid;
  gap:14px;
  padding:16px;
}

.course-student-dialog__grades{
  display:grid;
  gap:8px;
} /* [CRS-STUDENT-POPUP-20260723-009] 팝업 내 대상 학년 영역 */

.course-student-dialog__grades .item{
  max-width:220px;
}

.course-student-dialog__committed{
  padding:9px 11px;
  border-radius:9px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:12px;
  font-weight:800;
} /* [CRS-STUDENT-BY-GRADE-20260723-009] 학년별 추가 결과와 전체 누적 인원 표시 */

.course-student-dialog__list{
  min-height:160px;
  max-height:min(56vh, 520px);
  overflow:auto;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
  padding:10px;
} /* [CRS-STUDENT-POPUP-20260723-006] 학생 명단 팝업 스크롤 영역 */

/* [CRS-NEW-STEPS-20260609-001] Course creation guided steps */
.course-create-shell{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 280px;
  gap:14px;
  align-items:start;
}

.course-create-shell--single{
  grid-template-columns:minmax(680px, 1fr) minmax(280px, 420px);
  gap:16px;
} /* [CRS-LONG-GUIDE-20260723-009] 설명 카드에서 줄인 폭을 왼쪽 1~4단계 카드가 모두 사용 */

.course-create-guide{
  position:sticky;
  top:76px;
  overflow:hidden;
  border:1px solid #dbe6f5;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 20px rgba(15, 23, 42, .04);
}

.course-create-guide__head{
  padding:16px;
  border-bottom:1px solid #dbe6f5;
  background:#f8fafc;
}

.course-create-guide__head h2{
  margin:0;
  color:#0f172a;
  font-size:17px;
}

.course-create-guide__head p{
  margin:5px 0 0;
  color:#64748b;
  font-size:12px;
  line-height:1.5;
}

.course-create-guide__step{
  display:grid;
  grid-template-columns:30px minmax(0, 1fr);
  gap:10px;
  padding:16px;
  border-bottom:1px solid #e2e8f0;
}

.course-create-guide__step:last-child{
  border-bottom:0;
}

.course-create-guide__step > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:999px;
  background:#0f172a;
  color:#fff;
  font-size:13px;
  font-weight:900;
}

.course-create-guide__step h3{
  margin:3px 0 5px;
  color:#1e293b;
  font-size:14px;
}

.course-create-guide__step p{
  margin:0;
  color:#64748b;
  font-size:12px;
  line-height:1.55;
}

.course-create-guide__category{
  display:none;
  margin:7px 0;
  padding:8px 10px;
  border-radius:9px;
  background:#eff6ff;
}

.course-create-guide[data-level="elem"] [data-guide-level="elem"],
.course-create-guide[data-level="mid"] [data-guide-level="mid"],
.course-create-guide[data-level="high"] [data-guide-level="high"]{
  display:block;
}

.course-create-guide__category strong{
  color:#1d4ed8;
  font-size:12px;
}

.course-create-guide__category p{
  margin-top:3px;
  color:#334155;
  font-weight:700;
} /* [CRS-LONG-GUIDE-20260723-003] 오른쪽 긴 카드의 번호별 설명과 학교급별 분류 */

@media (max-width: 1220px){
  .course-create-shell--single{
    grid-template-columns:1fr;
  }
  .course-create-guide{
    position:static;
  }
} /* [CRS-LONG-GUIDE-20260723-004] 좁은 화면에서는 두 독립 카드를 세로 배치 */

.course-steps{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-width:0;
}

.course-step{
  background:#fff;
  border:1px solid #dbe6f5;
  border-radius:14px;
  padding:14px;
  box-shadow:0 8px 20px rgba(15, 23, 42, .04);
}

.course-step__head{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-bottom:12px;
}

.course-step__num{
  flex:0 0 30px;
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#0f172a;
  color:#fff;
  font-weight:900;
  font-size:14px;
}

.course-step__head h2{
  margin:0;
  font-size:17px;
  line-height:1.25;
  font-weight:900;
}

.course-step__head p{
  margin:4px 0 0;
  color:#64748b;
  font-size:13px;
  line-height:1.4;
}

.course-step__grid{
  display:grid;
  gap:12px;
  align-items:end;
}

.course-step__grid--basic{
  grid-template-columns:160px 160px minmax(260px, 1fr);
}

.course-step__grid--target{
  grid-template-columns:190px 150px 150px;
  justify-content:start;
} /* [CRS-COMPACT-FILTER-20260723-003] 반 선택창을 학년과 동일한 150px로 고정 */

.course-type-field{
  grid-column:span 1;
}

.course-class-select{
  min-width:0;
} /* [CRS-COMPACT-FILTER-20260723-004] 기존 반 선택창 최소폭 제거 */

.course-selective-field{
  grid-column:1 / -1;
}

.course-selective-label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.course-grade-picks{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:10px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#f8fafc;
}

.course-grade-picks .chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:30px;
  padding:0 10px;
  border:1px solid #dbe6f5;
  border-radius:999px;
  background:#fff;
  font-size:13px;
  font-weight:800;
  color:#1e293b;
}

.course-grade-picks .chip input{
  width:14px;
  height:14px;
}

.course-advanced{
  grid-column:1 / -1;
  border:1px dashed #cbd5e1;
  border-radius:12px;
  background:#fbfdff;
  padding:10px 12px;
}

.course-advanced summary{
  cursor:pointer;
  font-weight:900;
  color:#334155;
}

.course-advanced__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:10px;
}

.course-step--save{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.course-step--save .course-step__head{
  margin-bottom:0;
}

.course-save-btn{
  min-width:180px;
  height:42px !important;
  border-radius:12px !important;
  font-size:15px;
}

.course-guide{
  position:sticky;
  top:14px;
  background:#f8fafc;
  border:1px solid #dbe6f5;
  border-radius:14px;
  padding:14px;
  color:#1e293b;
}

.course-guide h2{
  margin:0 0 10px;
  font-size:18px;
  font-weight:900;
}

.course-guide ol{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:8px;
}

.course-guide li{
  font-size:14px;
  line-height:1.5;
}

.course-guide__note{
  margin-top:12px;
  padding:12px;
  border-radius:12px;
  background:#eff6ff;
  color:#1d4ed8;
  font-size:13.5px;
  font-weight:800;
  line-height:1.55;
}

.course-guide__note ul{
  margin:8px 0 0;
  padding-left:18px;
  display:grid;
  gap:5px;
}

.course-guide__note li{
  font-size:13px;
  line-height:1.45;
}

.course-guide__note--workload{
  background:#f0fdf4;
  color:#166534;
}

.course-guide__note--category{
  background:#fff7ed;
  color:#9a3412;
}

.course-category-map{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:8px;
  margin:12px 0;
  padding:10px;
  border:1px solid #dbeafe;
  border-radius:12px;
  background:#f8fbff;
} /* [CRS-CAT-FOUR-20260702-010] 고등 과목분류 기준표 */
.course-category-map div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-height:38px;
  padding:8px 10px;
  border:1px solid #d7e3f8;
  border-radius:10px;
  background:#fff;
}
.course-category-map strong{
  color:#111827;
  font-size:13px;
}
.course-category-map span{
  color:#475569;
  font-size:12px;
  font-weight:800;
}

.course-level-tabs .tabs{
  flex-wrap:wrap;
}

/* ✅ 과목명 줄바꿈 방지 + 너무 길면 말줄임(원하면 제거 가능) */
.td-course a{
  display:inline-block;
  max-width: 100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  vertical-align:bottom;
}
.course-sub{
  color:var(--muted);
  font-size:12px;
  margin-left:8px;
  white-space:nowrap;
}

/* ── Badges */
.badge{
  display:inline-flex;
  align-items:center;
  height:24px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#fff;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.badge--soft{
  background:#eff6ff;
  border-color:#c7ddff;
  color:#1d4ed8;
}
.badge--outline{
  background:#fff;
  border-color:#dbe6ff;
  color:#1d4ed8;
}

/* Actions in table */
.actions{
  display:flex;
  gap:6px;
  justify-content:flex-end;
  flex-wrap:wrap;
}

/* ── Enroll page pick UI */
.grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
.field label{
  display:block;
  font-size:12px;
  font-weight:800;
  margin:0 0 6px;
}
.pickArea{
  margin-top:10px;
  display:grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap:8px 10px;
}
.pickItem{
  display:flex;
  gap:10px;
  align-items:center;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
}
.pickItem:hover{ background:#fbfdff; }

/* ── Responsive */
@media (max-width: 980px){
  .form__row{ grid-column: span 4; }  /* 3개/줄 */
  .grid{ grid-template-columns: 1fr; }
  .pickArea{ grid-template-columns: 1fr; }
  .course-create-shell{ grid-template-columns:1fr; }
  .course-guide{ position:static; order:-1; }
  .course-step__grid--basic,
  .course-step__grid--target,
  .course-advanced__grid{
    grid-template-columns:1fr 1fr;
  }
  .course-level-tabs,
  .course-selective-field,
  .course-advanced{
    grid-column:1 / -1;
  }
}
@media (max-width: 640px){
  .page__head{ flex-direction:column; align-items:stretch; }
  .page__actions{ justify-content:flex-end; }
  .form__row{ grid-column: 1 / -1; }  /* 1개/줄 */
  .course-step__grid--basic,
  .course-step__grid--target,
  .course-advanced__grid{
    grid-template-columns:1fr;
  }
  .course-step--save{
    align-items:stretch;
    flex-direction:column;
  }
  .course-save-btn{
    width:100%;
  }
}

/* [CRS-LIST-STYLE-001] Courses list filters - compact 2-row layout */
.filters {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 14px;
  background: var(--panel, #fff);
}

.filters .row {
  display: flex;
  gap: 10px;
  align-items: end;
  flex-wrap: wrap;
}

.filters .row + .row {
  margin-top: 10px;
}

.filters .item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 140px;
}

.filters .item.grow {
  flex: 1 1 280px;
  min-width: 220px;
}

.filters .item.course-search-filter {
  flex: 0 0 190px;
  min-width: 190px;
}

.filters .label {
  font-size: 12px;
  color: var(--muted, #6b7280);
  line-height: 1;
  white-space: nowrap;
}

/* inputs */
.filters input[type="number"],
.filters input[type="text"],
.filters select {
  height: 36px;
  padding: 0 10px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 10px;
  background: var(--bg, #fff);
  color: inherit;
  outline: none;
}

.filters input[type="number"]:focus,
.filters input[type="text"]:focus,
.filters select:focus {
  border-color: var(--focus, #93c5fd);
  box-shadow: 0 0 0 3px rgba(147,197,253,0.35);
}

/* apply button align */
.filters .btn.primary,
.filters button.btn.primary,
.filters button[type="submit"] {
  height: 36px;
  padding: 0 14px;
  border-radius: 10px;
  white-space: nowrap;
}

/* small screens */
@media (max-width: 720px) {
  .filters .item { min-width: 48%; }
  .filters .item.grow { min-width: 100%; }
  .filters .item.course-search-filter {
    flex: 1 1 100%;
    min-width: 100%;
  }
}

/* [CRS-LIST-STYLE-002] Filters: brighter palette override */
.filters {
  background: #f8fafc;         /* 아주 밝은 배경 */
  border-color: #e2e8f0;        /* 더 연한 테두리 */
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
}

.filters .label {
  color: #64748b;              /* 밝고 선명한 회색 */
}

.filters input[type="number"],
.filters input[type="text"],
.filters select {
  background: #ffffff;
  border-color: #cbd5e1;        /* input 테두리도 조금 더 밝게 */
}

.filters input[type="number"]:focus,
.filters input[type="text"]:focus,
.filters select:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.25);
}

/* 적용 버튼도 살짝 더 밝게 */
.filters .btn.primary,
.filters button.btn.primary,
.filters button[type="submit"] {
  background: #3b82f6;
  border-color: #3b82f6;
}
.filters .btn.primary:hover,
.filters button.btn.primary:hover,
.filters button[type="submit"]:hover {
  background: #2563eb;
  border-color: #2563eb;
}

@media print{
  @page{
    size:A4 landscape;
    margin:3mm 6mm 5mm 6mm;
  } /* [CRS-SEL-OVERVIEW-20260309-215] 신청현황 출력 기본 용지/여백 고정 */
  body > *:not(.app){
    display:none !important;
  } /* [CRS-SEL-OVERVIEW-20260309-227] 본문 외(고정 위젯/오버레이) 출력 제외 */
  .topbar,
  #app-sidebar,
  #pageTabs,
  .page-tabs{
    display:none !important;
  } /* [CRS-SEL-OVERVIEW-20260309-213] 출력 시 상단바/사이드바/탭바 제거 */
  .app{
    display:block !important;
    padding-top:0 !important;
    min-height:0 !important;
    height:auto !important;
  } /* [CRS-SEL-OVERVIEW-20260309-225] topbar 숨김 시 app 상단 여백 제거 */
  html, body{
    margin:0 !important;
    padding:0 !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  } /* [CRS-SEL-OVERVIEW-20260309-226] 브라우저 기본 인쇄 여백 영향 최소화 */
  .content{
    margin:0 !important;
    padding:0 !important;
    width:100% !important;
    max-width:none !important;
  } /* [CRS-SEL-OVERVIEW-20260309-214] 출력 페이지 본문 영역 전체폭 사용 */
  .selective-overview-page{
    max-width:none;
    margin:4mm 0 0 0 !important; /* [CRS-SEL-OVERVIEW-20260309-229] 요청 반영: 출력 시작 위치를 아래로 소폭 이동 */
    padding:0;
  } /* [CRS-SEL-OVERVIEW-20260309-204] 선택수업 신청현황 출력 레이아웃 확장 */
  .selective-overview-page > *{
    display:none !important;
  } /* [CRS-SEL-OVERVIEW-20260309-210] 출력 시 기본적으로 전체 섹션 숨김 */
  .selective-overview-page .selective-overview-course-card{
    display:block !important;
    margin-top:0 !important;
    padding:6px 8px !important;
    zoom:1 !important; /* [CRS-SEL-OVERVIEW-20260309-228] 폰트 실크기 유지 */
    break-inside:auto;
    page-break-inside:auto;
    break-after:avoid-page;
    page-break-after:avoid;
  } /* [CRS-SEL-OVERVIEW-20260309-211] 출력은 과목별 신청 현황 카드만 노출 */
  .selective-overview-page .selective-overview-course-card h2{
    margin:0 0 4px 0 !important;
    font-size:25px !important;
    line-height:1.1 !important;
  } /* [CRS-SEL-OVERVIEW-20260309-224] 출력 상단 제목 영역 축소 */
  .selective-overview-page .selective-overview-toolbar{
    display:none !important;
  } /* [CRS-SEL-OVERVIEW-20260309-205] 조회 툴바/버튼 출력 제외 */
  .selective-overview-page .selective-overview-summary-card,
  .selective-overview-page .selective-overview-student-card{
    display:none !important;
  } /* [CRS-SEL-OVERVIEW-20260309-212] 요약/학생별 카드 출력 제외 */
  .selective-overview-page .filters{
    box-shadow:none;
    border-color:#cbd5e1;
    background:#fff;
  }
  .selective-overview-page .table-wrap{
    overflow:visible;
    border-color:#cbd5e1;
  }
  .selective-overview-page .table{
    min-width:0;
    table-layout:fixed;
  } /* [CRS-SEL-OVERVIEW-20260309-216] 출력시 컬럼 폭 고정으로 열 밀림 방지 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(1),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(1){
    width:160px !important;
  } /* [CRS-SEL-OVERVIEW-20260309-219] 출력 시 과목 열 폭 축소 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(2),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(2){
    width:64px !important;
  } /* [CRS-SEL-OVERVIEW-20260309-220] 출력 시 교시 열 폭 축소 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(3),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(3){
    width:82px !important;
  } /* [CRS-SEL-OVERVIEW-20260309-221] 출력 시 장소 열 폭 축소 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(4),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(4){
    width:74px !important;
  } /* [CRS-SEL-OVERVIEW-20260309-222] 출력 시 담당 열 폭 축소 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(5),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(5){
    width:92px !important;
  } /* [CRS-SEL-MATERIAL-FEE-PRINT-20260813-001] 출력 시 교재비·재료비 열 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(6),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(6){
    width:70px !important;
  } /* [CRS-SEL-OVERVIEW-20260309-223] 출력 시 신청 인원 열 폭 축소 */
  .selective-overview-page .selective-overview-course-card .table th:nth-child(7),
  .selective-overview-page .selective-overview-course-card .table td:nth-child(7){
    width:auto !important;
  } /* [CRS-PLACE-20260309-102] 출력 시 신청자 명단 열 최대 확장(장소 열 추가 반영) */
  .selective-overview-page .table thead{
    display:table-header-group;
  } /* [CRS-SEL-OVERVIEW-20260309-217] 페이지 넘어가도 헤더 반복 */
  .selective-overview-page .table tr{
    break-inside:avoid;
    page-break-inside:avoid;
  } /* [CRS-SEL-OVERVIEW-20260309-218] 행 중간 분할 방지 */
  .selective-overview-page .table td{
    word-break:keep-all;
    overflow-wrap:anywhere;
  }
  .selective-overview-page .table thead th,
  .selective-overview-page .table td{
    font-size:13.5px;
    line-height:1.12;
    padding:2px 4px;
  } /* [CRS-SEL-OVERVIEW-20260309-206] 출력 시 표 글자/패딩 최적화 */ /* [CRS-SEL-OVERVIEW-20260309-232] 출력 글자 0.5pt 축소 */
  .selective-overview-page .selective-overview-print-btn{
    display:none !important;
  }
  .selective-overview-page .print-only{
    display:inline !important;
  }
  .selective-overview-page .screen-only{
    display:none !important;
  } /* [CRS-SEL-PRINT-20260309-303] 출력 시 신청 인원만 노출 */
}