﻿/* =====================================================================
   bereich-student.css – „Meine Prüfungen“ (Views/Klausur/Index.cshtml, Ergebnis.cshtml, _Remonstration.cshtml),
   Konto-Seiten und Fehlerseite. Wird später in oberflaeche.css übernommen. Farben nur über Variablen (hell/dunkel).
   ===================================================================== */

/* ---------- Prüfungsart (echte Prüfung / Examensportal) kompakt über der Liste ---------- */
.pruefungsart-kompakt .pruefungsart { gap: .5rem; }
.pruefungsart-kompakt .pruefungsart > div { padding: .6rem .9rem; }
.pruefungsart-kompakt .pruefungsart h2 { font-size: 1rem; margin-bottom: .15rem; }
.pruefungsart-kompakt .pruefungsart p { font-size: .875rem; }
@media (max-width: 575.98px) { .pruefungsart-kompakt .pruefungsart > div:not(.hier) p { display: none; } }

/* ---------- Sprungleiste innerhalb der Seite ---------- */
.seitennav { display: flex; flex-wrap: wrap; gap: .25rem .5rem; padding: .25rem 0; border-bottom: 1px solid var(--bs-border-color); }
.seitennav a { display: inline-flex; align-items: center; gap: .25rem; padding: .4rem .6rem; border-radius: var(--bs-border-radius); color: var(--bs-secondary-color); font-weight: 600; text-decoration: none; }
.seitennav a:hover, .seitennav a:focus-visible { color: var(--bs-emphasis-color); background: var(--up-soft); }
.seitennav .chip { padding: 0 .45rem; font-size: .75rem; }
.bereich-student section[id] { scroll-margin-top: 1rem; }

/* ---------- Karte je Prüfung ---------- */
.pruefungskarten { display: grid; gap: 1.25rem; }
.pruefungskarte { padding: 1.1rem 1.25rem; border: 1px solid var(--bs-border-color); border-top: 4px solid var(--up-orange);
    border-radius: var(--bs-border-radius-lg); background: var(--bs-body-bg); box-shadow: var(--up-shadow); scroll-margin-top: 1rem; }
.pruefungskarte:empty { display: none; }
.pruefungskarte[aria-busy="true"] { opacity: .6; }
.pruefungskarte-probe { border-top-color: var(--bs-info); }
.pruefung-kopf { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: .5rem 1rem; margin-bottom: .75rem; }
.pruefung-titel { min-width: 0; flex: 1 1 20rem; }
.pruefung-titel h3:focus { outline: 0; }
.pruefung-termine { color: var(--bs-secondary-color); font-size: .9rem; }
.pruefung-termin::before { content: " · "; }
.pruefung-termine > :first-child::before { content: none; }
.pruefung-termin strong { color: var(--bs-emphasis-color); }
.pruefung-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.pruefung-status { margin-bottom: .75rem; font-size: .95rem; }
.pruefung-ablauf { margin-bottom: .5rem; }
.pruefung-ablauf .band { align-items: center; }
.pruefung-ablauf .countdown { font-variant-numeric: tabular-nums; white-space: nowrap; }
.pruefung-aktion { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: 0 0 1rem; }
.pruefung-aktion .form-text { flex-basis: 100%; margin-top: 0; }

/* Erfolgsband (ergänzt .band-warnung/.band-info aus oberflaeche.css) */
.band-erfolg { border-left-color: var(--bs-success); background: var(--bs-success-bg-subtle); }
.band-erfolg > .fa-solid, .band-erfolg > .fa-duotone { color: var(--ui-success-fg, var(--bs-success)); }

/* Anmeldung zur Prüfung: Hinweis folgt dem Schalter (auch nach „Rückgängig“) */
.anmeldung { margin-bottom: 1rem; }
.anmeldung .schalter { margin-bottom: .5rem; }
.anmeldung-ja, .anmeldung-nein { display: none; font-size: .95rem; }
.anmeldung:has(.schalter input:checked) .anmeldung-ja { display: block; }
.anmeldung:has(.schalter input:not(:checked)) .anmeldung-nein { display: block; }

/* Eingangsbestätigung nach dem Hochladen */
.eingang { padding: 1rem 1.15rem; margin-bottom: 1rem; border: 1px solid var(--bs-success-border-subtle); border-radius: var(--bs-border-radius-lg); background: var(--bs-success-bg-subtle); }
.eingang h4 { margin-bottom: .5rem; }
.eingang p { margin-bottom: .5rem; }
.eingang-offen { border-color: var(--bs-warning-border-subtle); background: var(--bs-warning-bg-subtle); }
.eingang-spaet { border-color: var(--bs-danger-border-subtle); background: var(--bs-danger-bg-subtle); }

/* Abgabebereich: Erklärungen, Anträge, Ablageflächen */
.pruefung-abgabe { display: grid; gap: .75rem; margin-bottom: 1rem; }
.pruefung-abgabe > .schalter, .pruefung-abgabe .antrag > .schalter { margin-bottom: 0; }
.feldgruppe > h4 { float: none; width: auto; margin: 0 0 .5rem; font-size: 1rem; font-weight: 700; }
.feldgruppe-pflicht { border-color: var(--bs-danger-border-subtle); background: var(--bs-danger-bg-subtle); }
.eigen-bestaetigung { padding: .75rem 1rem .75rem 2.5rem; border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); background: var(--bs-tertiary-bg); }
.eigen-bestaetigung .form-check-input { width: 1.25em; height: 1.25em; }
.eigen-bestaetigung .form-check-input.is-invalid ~ .form-check-label { color: var(--bs-danger-text-emphasis); }
/* Begründung nur bei gesetztem Schalter (ohne :has()-Unterstützung bleibt sie sichtbar) */
.antrag-grund { margin: .5rem 0 0 3.1em; }
.antrag:has(> .schalter input:not(:checked)) .antrag-grund { display: none; }
.pruefung-hochladen .dropzone { min-height: 8rem; }
.pruefung-hochladen h4 { margin-bottom: .5rem; }

/* Hinweise, Unterlagen, Kontakte (aufklappbar) */
.pruefung-details { border-top: 1px solid var(--bs-border-color); padding-top: .5rem; }
.pruefung-details > summary { cursor: pointer; padding: .35rem 0; font-weight: 600; color: var(--bs-emphasis-color); }
.pruefung-details > summary:focus-visible { outline: 3px solid var(--up-orange); outline-offset: 2px; border-radius: var(--bs-border-radius); }
.pruefung-details-inhalt { padding-top: .5rem; }
.pruefung-details-inhalt h4 { margin-top: 1rem; }
.pruefliste { padding-left: 0; list-style: none; }
.pruefliste li { position: relative; padding: .2rem 0 .2rem 1.75rem; }
.pruefliste li::before { content: "\f058"; font: var(--fa-font-regular); position: absolute; left: 0; top: .35rem; color: var(--up-orange-icon, var(--up-orange)); }
.pruefung-hinweise { color: var(--bs-secondary-color); }
.pruefung-hinweise :last-child { margin-bottom: 0; }
.pruefung-kontakte { border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); }

/* ---------- Ergebnisse ---------- */
.ergebnisliste { display: grid; gap: .75rem; }
.ergebnis { padding: .9rem 1.1rem; border: 1px solid var(--bs-border-color); border-left: 4px solid var(--up-grey, var(--bs-border-color)); border-radius: var(--bs-border-radius-lg); scroll-margin-top: 1rem; }
.ergebnis:target { box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color); }
.ergebnis-bewertet { border-left-color: var(--bs-success); background: var(--bs-tertiary-bg); }
.ergebnis-kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem 1rem; margin-bottom: .4rem; }
.ergebnis-meta { color: var(--bs-secondary-color); font-size: .875rem; }
.ergebnis .note { color: var(--bs-emphasis-color); }
.ergebnis-nachgang { margin-top: .75rem; border-top: 1px solid var(--bs-border-color); padding-top: .5rem; }
.ergebnis-nachgang > summary { cursor: pointer; font-weight: 600; }
.ergebnis-nachgang .remonstration { background: var(--bs-body-bg); }
.portal-text :last-child { margin-bottom: 0; }

/* ---------- Fehlerseite ---------- */
.fehlerseite { max-width: 48rem; margin: 2rem auto; }
.fehlerseite-symbol { font-size: 3rem; color: var(--ui-danger-fg, var(--bs-danger)); }
.fehlerseite-text { padding: 1rem 1.25rem; border-radius: var(--bs-border-radius-lg); background: var(--bs-danger-bg-subtle); }
.fehlerseite-text :last-child { margin-bottom: 0; }

/* ---------- Anleitungen (E-Klausur, Safe Exam Browser) ---------- */
.anleitung-schritte { padding-left: 0; list-style: none; counter-reset: anleitung; }
.anleitung-schritte > li { position: relative; padding: 0 0 1rem 3rem; counter-increment: anleitung; }
.anleitung-schritte > li::before { content: counter(anleitung); position: absolute; left: 0; top: 0; width: 2rem; height: 2rem; border-radius: 50%;
    background: var(--up-orange); color: var(--up-on-orange, #fff); font-weight: 700; text-align: center; line-height: 2rem; }
.anleitung-schritte h2 { margin-bottom: .35rem; padding-top: .2rem; }
code.kennwort { padding: .1rem .4rem; border-radius: var(--bs-border-radius-sm); background: var(--bs-tertiary-bg); color: var(--bs-emphasis-color); font-size: 1.05em; font-weight: 700; }
