/*
 * V5.7.6 public additions: the theory lesson plan (theorieplan.php, the "next lessons" list of the
 * theory page, A4 print layout), the local challenge and the e-mail typo hint of the forms.
 * Everything reads the surface tokens (--bg, --fg, --line ...) and adapts to every tone and theme.
 */

/* ---------- status badges ---------- */
.v576-status {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  padding: 0.2em 0.65em;
  border-radius: 999px;
  font-size: var(--fs-xs, 0.78rem);
  font-weight: 650;
  line-height: 1.4;
  white-space: nowrap;
  border: 1px solid var(--line-strong);
}
.v576-status::before {
  content: "";
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  background: currentColor;
}
.v576-status--scheduled { color: #1f7a4a; background: rgb(31 122 74 / 0.1); border-color: rgb(31 122 74 / 0.35); }
.v576-status--cancelled { color: #b3361c; background: rgb(179 54 28 / 0.1); border-color: rgb(179 54 28 / 0.35); }
.v576-status--holiday { color: var(--fg-2); background: rgb(127 120 110 / 0.12); }
.tone-dark .v576-status--scheduled, .tone-dark-2 .v576-status--scheduled, .tone-deep .v576-status--scheduled { color: #7fd6a3; }
.tone-dark .v576-status--cancelled, .tone-dark-2 .v576-status--cancelled, .tone-deep .v576-status--cancelled { color: #ff9c84; }

/* ---------- month plan ---------- */
.v576-plan { display: grid; gap: 1.25rem; }
.v576-monthnav {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 0.75rem;
}
.v576-monthnav > :first-child { justify-self: start; }
.v576-monthnav > :last-child { justify-self: end; }
.v576-monthnav__label { font-size: var(--fs-h3, 1.35rem); text-align: center; }
.v576-tools { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.v576-printhead { display: none; }
.v576-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius, 14px); background: var(--bg-raised); }
.v576-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.v576-table th,
.v576-table td { padding: 0.8rem 1rem; text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); }
.v576-table thead th { font-size: var(--fs-small, 0.88rem); text-transform: uppercase; letter-spacing: 0.04em; color: var(--fg-2); }
.v576-table tbody tr:last-child > * { border-bottom: 0; }
.v576-table tbody th { font-weight: 700; }
.v576-row--cancelled td strong { text-decoration: line-through; text-decoration-thickness: 1px; }
.v576-row--holiday > * { color: var(--fg-2); }
.v576-topic-label,
.v576-note { display: block; font-size: var(--fs-small, 0.88rem); color: var(--fg-2); margin-top: 0.15rem; }
.v576-note { font-style: italic; }
.v576-empty { padding: 1.5rem; border: 1px dashed var(--line-strong); border-radius: var(--radius, 14px); text-align: center; color: var(--fg-2); }
.v576-plan__note { color: var(--fg-2); }
.v576-plan__stamp { font-size: var(--fs-xs, 0.78rem); color: var(--fg-2); }

/* month calendar - a visual alternative for wide screens; the table stays the accessible source */
.v576-cal { display: none; }
@media (min-width: 900px) {
  .v576-cal { display: block; }
  .v576-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.35rem; }
  .v576-cal__head { font-size: var(--fs-xs, 0.78rem); font-weight: 700; text-transform: uppercase; color: var(--fg-2); padding: 0 0.4rem; }
  .v576-cal__cell {
    min-height: 5.6rem;
    padding: 0.4rem;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm, 8px);
    background: var(--bg-raised);
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
  }
  .v576-cal__cell--pad { background: transparent; border-style: dashed; opacity: 0.4; }
  .v576-cal__cell.has-lesson { border-color: var(--line-strong); }
  .v576-cal__cell.is-today { outline: 2px solid var(--accent-ink); outline-offset: -2px; }
  .v576-cal__day { font-weight: 700; font-size: var(--fs-small, 0.88rem); }
  .v576-cal__lesson { white-space: normal; border-radius: var(--radius-xs, 4px); font-size: 0.74rem; }
}

/* phones: every lesson as a card (the labels come from data-label) */
@media (max-width: 699px) {
  .v576-table-wrap { border: 0; background: transparent; overflow: visible; }
  .v576-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .v576-table,
  .v576-table tbody,
  .v576-table tr,
  .v576-table th,
  .v576-table td { display: block; width: 100%; }
  .v576-table tr {
    margin-bottom: 0.75rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--line);
    border-radius: var(--radius, 14px);
    background: var(--bg-raised);
  }
  .v576-table th,
  .v576-table td { padding: 0.2rem 0; border: 0; display: flex; gap: 0.75rem; justify-content: space-between; }
  .v576-table td > strong,
  .v576-table td > span { text-align: end; }
  .v576-table [data-label]::before { content: attr(data-label); font-size: var(--fs-xs, 0.78rem); text-transform: uppercase; color: var(--fg-2); font-weight: 600; }
  .v576-table td[data-label] { flex-wrap: wrap; }
  .v576-topic-label,
  .v576-note { flex-basis: 100%; text-align: end; }
  .v576-monthnav { grid-template-columns: 1fr 1fr; }
  .v576-monthnav__label { grid-column: 1 / -1; grid-row: 1; }
}

/* ---------- "next lessons" on the theory page ---------- */
.v576-next-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.v576-next {
  display: grid;
  grid-template-columns: minmax(7.5rem, auto) 1fr auto auto;
  align-items: center;
  gap: 0.5rem 1rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius, 14px);
  background: var(--bg-raised);
}
.v576-next__date { display: grid; }
.v576-next__date time,
.v576-next__topic small { font-size: var(--fs-small, 0.88rem); color: var(--fg-2); }
.v576-next__topic { display: grid; }
.v576-next__time { font-variant-numeric: tabular-nums; }
.v576-next--cancelled .v576-next__topic strong { text-decoration: line-through; }
@media (max-width: 699px) {
  .v576-next { grid-template-columns: 1fr auto; }
  .v576-next__topic { grid-column: 1 / -1; grid-row: 2; }
}

/* ---------- forms: accessible first-party challenge and e-mail typo hint ---------- */
.v576-challenge { margin-top: 0.75rem; max-width: 28rem; }
.v576-challenge[hidden] { display: none; }
.v576-challenge__label { display: grid; gap: 0.45rem; font-weight: 700; }
.v576-challenge__answer { max-width: 8rem; }
.v576-typo { margin-top: 0.35rem; }
.v576-typo .link-btn {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-weight: 700;
  color: var(--accent-ink);
  text-decoration: underline;
  cursor: pointer;
}

/* ---------- A4 print view (theorieplan.php?print=1 or the "Drucken" button) ---------- */
@media print {
  @page { size: A4 portrait; margin: 14mm 14mm 16mm; }
  html, body { background: #fff !important; color: #111 !important; }
  body > *:not(main),
  .site-header, .site-footer, .topbar, .skip-link, .appt-cta, .quick-dock, .consent, [data-consent],
  .v576-hero, .v576-monthnav, .v576-tools, .v576-cal, .breadcrumbs { display: none !important; }
  main, .section, .wrap { padding: 0 !important; margin: 0 !important; max-width: none !important; background: #fff !important; color: #111 !important; }
  .v576-plan { --fg: #111; --fg-2: #4b4741; --line: #c9c2b6; --line-strong: #8f877b; --bg-raised: #fff; gap: 6mm; }
  .v576-printhead { display: block; border-bottom: 3px solid #d98900; padding-bottom: 4mm; }
  .v576-printhead__brand { margin: 0; font-size: 10pt; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #8a3b12; }
  .v576-printhead__title { margin: 1mm 0; font-size: 20pt; color: #111; }
  .v576-printhead__time { margin: 0; font-size: 12pt; font-weight: 700; }
  .v576-table-wrap { border: 1px solid #8f877b; border-radius: 0; overflow: visible; }
  .v576-table { font-size: 11pt; }
  .v576-table th, .v576-table td { padding: 2.2mm 3mm; border-bottom: 1px solid #c9c2b6; display: table-cell !important; width: auto !important; }
  .v576-table thead { position: static !important; width: auto !important; height: auto !important; clip: auto !important; display: table-header-group !important; }
  .v576-table thead th { background: #1d1f23 !important; color: #fff !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .v576-table tr { display: table-row !important; page-break-inside: avoid; break-inside: avoid; border: 0 !important; padding: 0 !important; margin: 0 !important; }
  .v576-table tbody, .v576-table { display: table !important; width: 100% !important; }
  .v576-table tbody { display: table-row-group !important; }
  .v576-table [data-label]::before { content: none !important; }
  .v576-status { border: 1px solid #8f877b; color: #111 !important; background: none !important; }
  .v576-row--cancelled > * { color: #8a2a17 !important; }
  .v576-plan__stamp { font-size: 9pt; }
}