/* Admin content panel (2026-09-23): CRUD for course lessons + exam
   questions, built on the same vt-* component classes as the rest of the
   site (see tokens.css) -- these rules only add the bits specific to admin
   layouts (module blocks, lesson/question rows, the option-radio form). */

.ad-modules { display: flex; flex-direction: column; gap: 18px; margin-top: 18px; }

.ad-module-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ad-module-head h3 { margin: 0; font-size: 16px; }
.ad-module-head form { display: flex; gap: 8px; flex: 1; align-items: center; }
.ad-module-head input.vt-input { padding: 6px 10px; font-size: 14px; }
.ad-module-n { color: var(--ink-text-soft); font-variant-numeric: tabular-nums; }

.ad-lesson-row {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px;
  border: 1px solid var(--ink-line); border-radius: 10px; margin-bottom: 8px;
  background: var(--ink-panel-2);
}
.ad-lesson-row .ad-lesson-title { flex: 1; font-weight: 600; }
.ad-lesson-row .ad-lesson-key { color: var(--ink-text-soft); font-size: 12px; }
.ad-lesson-actions { display: flex; gap: 8px; }
.ad-lesson-actions .vt-btn { padding: 6px 12px; font-size: 13px; }

.ad-add-row { margin-top: 4px; }

.ad-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0; }
.ad-tab {
  padding: 6px 14px; border-radius: 999px; border: 1px solid var(--ink-line);
  color: var(--ink-text-soft); font-size: 13px; text-decoration: none;
}
.ad-tab.active { color: var(--mint); border-color: color-mix(in srgb, var(--mint) 40%, transparent); background: color-mix(in srgb, var(--mint) 12%, transparent); }

.ad-q-table { width: 100%; border-collapse: collapse; }
.ad-q-table td { padding: 10px 8px; border-bottom: 1px solid var(--ink-line); vertical-align: top; }
.ad-q-table .ad-q-text { max-width: 520px; }
.ad-q-table .ad-q-correct { color: var(--mint); font-size: 12px; }
.ad-q-table .ad-q-actions { white-space: nowrap; text-align: right; }
.ad-q-table .ad-q-actions .vt-btn { padding: 5px 10px; font-size: 12px; }

.ad-opt-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ad-opt-row input[type="radio"] { width: 18px; height: 18px; accent-color: var(--mint); flex: none; }
.ad-opt-row .vt-input { flex: 1; }

.ad-form textarea.vt-input { min-height: 160px; font-family: var(--font-mono); font-size: 13px; line-height: 1.5; }

.ad-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-top: 18px; }
.ad-cards .vt-card { text-align: center; }
.ad-cards .vt-card .ad-num { font-family: var(--font-display); font-size: 30px; margin: 6px 0; }