/* Forgenia-LMS — strato discente. Componenti specifici sopra il design system
   Forgenia (styles.css + app.css). Brand NEUTRO Forgenia (accent amber). */

/* shell semplice del discente (no sidebar operatore) */
.lms-header {
  display: flex; align-items: center; gap: 16px;
  padding: 14px 28px; background: var(--al-white);
  border-bottom: 1px solid var(--al-border-soft);
}
.lms-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.lms-brand .nm {
  font-family: var(--al-font-display); font-weight: 500; font-size: 20px; color: var(--al-ink);
}
.lms-header .sep { border-left: 1px solid var(--al-border-soft); padding-left: 16px; }
.lms-nav { margin-left: auto; display: flex; align-items: center; gap: 18px; font-size: 14px; }
.lms-nav a { text-decoration: none; color: var(--al-text-muted); }
.lms-nav a:hover, .lms-nav a.is-active { color: var(--al-ink); }

/* griglia catalogo */
.course-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.course-card { display: flex; flex-direction: column; gap: 12px; padding: 20px; cursor: pointer; text-decoration: none; color: inherit; }
.course-card:hover { box-shadow: var(--al-shadow-md); }
.course-card h2 { font-size: 18px; }
.course-card .desc { font-size: 14px; color: var(--al-text-muted); line-height: 1.5; flex: 1; }

/* player: iframe responsivo 16:9 */
.video-frame { position: relative; aspect-ratio: 16/9; border-radius: var(--al-radius-lg); overflow: hidden; background: var(--al-ink); }
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-unavailable { aspect-ratio: 16/9; display: flex; align-items: center; justify-content: center; border-radius: var(--al-radius-lg); background: var(--al-cloud); color: var(--al-text-muted); font-size: 15px; }

/* elenco lezioni / capitoli */
.lesson-row { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--al-border-soft); text-decoration: none; color: var(--al-text); }
.lesson-row:last-child { border-bottom: none; }
.lesson-row:hover { background: var(--al-cloud-50); }
.lesson-row.is-current { background: var(--al-glow); }
.lesson-row.is-locked { color: var(--al-text-faint); cursor: not-allowed; pointer-events: none; }
.lesson-row .t { flex: 1; font-size: 14px; }
.lesson-row .ico.done { color: var(--al-success); }
.lesson-row .ico.cur { color: var(--al-amber-deep); }

/* quiz */
.quiz-q { margin-bottom: 26px; }
.quiz-q h3 { font-size: 17px; margin-bottom: 14px; }
.quiz-opt { display: block; }
.quiz-opt label {
  display: flex; align-items: center; gap: 12px; padding: 12px 16px; margin-bottom: 10px;
  font-size: 15px; border: 1px solid var(--al-border); border-radius: var(--al-radius-md);
  cursor: pointer; transition: border-color var(--al-dur) var(--al-ease), background var(--al-dur) var(--al-ease);
}
.quiz-opt label:hover { border-color: var(--al-amber-deep); }
.quiz-opt input:checked + label,
.quiz-opt label:has(input:checked) { border-color: var(--al-amber-deep); background: var(--al-glow); }
.quiz-opt input { accent-color: var(--al-amber-deep); }

/* esito test */
.score-circle {
  width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 20px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-family: var(--al-font-display); font-size: 30px; color: var(--al-white);
}
.score-circle.pass { background: var(--al-success); }
.score-circle.fail { background: var(--al-error); }
.score-circle small { font-size: 12px; font-family: var(--al-font-text); opacity: .9; }

/* attestato */
.cert-card { overflow: hidden; max-width: 760px; margin: 0 auto; }
.cert-card .topbar-bar { height: 6px; background: var(--accent-strong-gradient); }
.cert-body { padding: 40px 44px; text-align: center; }
.cert-name { font-family: var(--al-font-display); font-weight: 500; font-size: 32px; color: var(--al-ink); margin: 6px 0; }
.cert-meta { display: flex; justify-content: center; gap: 48px; margin: 24px 0 8px; }
.cert-meta .lbl { font-size: 12px; color: var(--al-text-muted); }
.cert-meta .val { font-family: var(--al-font-mono); font-size: 14px; color: var(--al-ink); }

@media print {
  .lms-header, .no-print { display: none !important; }
  .content { padding: 0 !important; }
}
