/* extra.css — Theme-Override für weitergehts.online Schulrecht-Skripts
   Aligning Material Design auf das bestehende v4-Design-System (base.css). */

:root {
  --md-primary-fg-color: #c2410c;
  --md-primary-fg-color--light: #fff7ed;
  --md-primary-fg-color--dark: #9a3412;
  --md-accent-fg-color: #c2410c;
  --md-accent-fg-color--transparent: rgba(194, 65, 12, 0.1);

  --md-typeset-a-color: #c2410c;

  --md-default-fg-color: #1f2937;
  --md-default-fg-color--light: #475569;
  --md-default-fg-color--lighter: #94a3b8;

  /* Norm-Hierarchie-Farben (analog Anki v4) */
  --c-bund: #1e3a8a;
  --c-bayeug: #c2410c;
  --c-vo: #ca8a04;
  --c-kmbek: #65a30d;
  --c-falle: #dc2626;

  --c-bund-bg: #eff6ff;
  --c-bayeug-bg: #fff7ed;
  --c-vo-bg: #fefce8;
  --c-kmbek-bg: #f7fee7;
  --c-falle-bg: #fef2f2;
}

[data-md-color-scheme="default"] {
  --md-primary-fg-color: #c2410c;
  --md-primary-bg-color: #ffffff;
  --md-typeset-a-color: #c2410c;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #fb923c;
  --md-typeset-a-color: #fb923c;
}

/* Lesetypografie verbessern */
.md-typeset {
  font-size: 0.78rem;
  line-height: 1.65;
}

.md-typeset h1 {
  font-weight: 700;
  letter-spacing: -0.01em;
}

.md-typeset h2 {
  font-weight: 700;
  font-size: 1.45em;
  margin-top: 2.4em;
  margin-bottom: 0.7em;
  padding: 0.4em 0 0.4em 0.8em;
  border-left: 5px solid #c2410c;
  border-bottom: 1px solid #fed7aa;
  background: linear-gradient(90deg, #fff7ed 0%, transparent 35%);
  color: #9a3412;
  letter-spacing: -0.01em;
}

.md-typeset h3 {
  font-weight: 600;
  font-size: 1.2em;
  margin-top: 2em;
  margin-bottom: 0.5em;
  padding: 0.25em 0 0.25em 0.7em;
  border-left: 3px solid #ca8a04;
  background: linear-gradient(90deg, #fefce8 0%, transparent 25%);
  color: #854d0e;
}

.md-typeset h4 {
  font-weight: 600;
  font-size: 1.05em;
  margin-top: 1.5em;
  margin-bottom: 0.4em;
  color: #475569;
  border-bottom: 1px dashed #cbd5e1;
  padding-bottom: 0.15em;
  font-style: italic;
}

[data-md-color-scheme="slate"] .md-typeset h2 {
  background: linear-gradient(90deg, rgba(194, 65, 12, 0.18) 0%, transparent 35%);
  border-bottom-color: #9a3412;
  color: #fdba74;
}

[data-md-color-scheme="slate"] .md-typeset h3 {
  background: linear-gradient(90deg, rgba(202, 138, 4, 0.18) 0%, transparent 25%);
  color: #fde047;
}

[data-md-color-scheme="slate"] .md-typeset h4 {
  color: #cbd5e1;
  border-bottom-color: #475569;
}

/* Inline-Norm-Code hervorheben */
.md-typeset code {
  background: #fff7ed;
  color: #9a3412;
  border: 1px solid #fed7aa;
  padding: 0.1em 0.4em;
  border-radius: 0.2em;
  font-size: 0.88em;
  font-weight: 500;
}

/* Choreographie-Schritt-Header (h3) als Stepper */
.md-typeset h3[id^="schritt-"] {
  background: linear-gradient(90deg, #fff7ed 0%, transparent 30%);
  padding: 0.5em 0.8em;
  border-left: 4px solid #c2410c;
  margin-top: 2em;
}

/* Falle-Tabelle: Border-Top in Rot */
.md-typeset table:has(thead th:first-child:contains("FA")) {
  border-top: 3px solid #dc2626;
}

/* Kompakte Tabellen */
.md-typeset table:not([class]) {
  font-size: 0.86em;
}

.md-typeset table:not([class]) th {
  background: #fff7ed;
  color: #9a3412;
  font-weight: 700;
}

/* Admonitions: Falle-Style */
.md-typeset .admonition.warning,
.md-typeset details.warning {
  border-color: var(--c-falle);
}

.md-typeset .warning > .admonition-title,
.md-typeset .warning > summary {
  background-color: var(--c-falle-bg);
  border-color: var(--c-falle);
}

/* Highlight-Box für Top-9-Pflichtwissen */
.md-typeset .admonition.tip {
  border-color: var(--c-kmbek);
}

.md-typeset .tip > .admonition-title {
  background-color: var(--c-kmbek-bg);
  border-color: var(--c-kmbek);
}

/* Kernnormen-Sub-Block-Header (h3 unter "Kernnormen") farb-codiert per ID-Prefix */
.md-typeset h3[id*="msd"]::before,
.md-typeset h3[id*="schulberatung"]::before {
  content: "● ";
  color: var(--c-bayeug);
}

.md-typeset h3[id*="forderzentrum"]::before,
.md-typeset h3[id*="bausteine"]::before {
  content: "● ";
  color: var(--c-vo);
}

.md-typeset h3[id*="betreuung"]::before {
  content: "● ";
  color: var(--c-bund);
}

/* Cross-Reference-Box */
.md-typeset .grid.cards > :is(ol, ul) > li,
.md-typeset .grid > .card,
.md-typeset .grid.cards > .card {
  border-radius: 0.4em;
  border: 1px solid #cbd5e1;
  padding: 1em 1.2em;
  background: #ffffff;
}

/* Lese-Container — Material-Default 61rem ist auf großen Bildschirmen zu schmal.
   Erweitern auf 88rem; .md-content nicht zusätzlich begrenzen (Material handhabt das selbst). */
.md-grid {
  max-width: 88rem;
}

/* Optional: Inhaltsspalte für sehr breite Bildschirme leicht zurücknehmen
   damit Lesefluss nicht überspannt — aber deutlich breiter als alter 70ch-Wert */
@media screen and (min-width: 100em) {
  .md-content__inner {
    max-width: 60rem;
  }
}

/* === Iter 3: Print-Stylesheet (A4 Portrait, optimiert für Endspurt-Druck) === */
@media print {
  @page {
    size: A4 portrait;
    margin: 1.5cm 1.8cm;
  }

  /* Navigation und UI-Elemente entfernen */
  .md-header, .md-tabs, .md-sidebar, .md-footer,
  .md-content__button, .md-search, .md-source,
  .md-top {
    display: none !important;
  }

  /* Volle Breite für Inhalt */
  .md-grid, .md-main__inner, .md-content, .md-content__inner {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body {
    font-size: 10pt;
    line-height: 1.45;
  }

  .md-typeset {
    font-size: 10pt;
  }

  .md-typeset h1 {
    font-size: 18pt;
    page-break-after: avoid;
    border-bottom: 2px solid #c2410c;
    padding-bottom: 0.2em;
  }

  .md-typeset h2 {
    font-size: 14pt;
    page-break-after: avoid;
    page-break-before: auto;
    margin-top: 1.5em;
    border-top: 1px solid #cbd5e1;
    padding-top: 0.4em;
  }

  .md-typeset h3 {
    font-size: 11pt;
    page-break-after: avoid;
  }

  .md-typeset table {
    page-break-inside: avoid;
    font-size: 9pt;
  }

  /* Cards-Grid: kompakter im Druck */
  .md-typeset .grid.cards > ul {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.4em !important;
  }

  .md-typeset .grid.cards > ul > li {
    box-shadow: none !important;
    page-break-inside: avoid;
    padding: 0.5em 0.7em !important;
    font-size: 9pt;
  }

  /* Admonitions: dünn, kein Hintergrund-Vollfläche */
  .md-typeset .admonition,
  .md-typeset details {
    border: 1px solid #cbd5e1;
    page-break-inside: avoid;
    box-shadow: none !important;
  }

  /* Mermaid: SVG bleibt sichtbar */
  .md-typeset .mermaid {
    page-break-inside: avoid;
    border: 1px solid #cbd5e1;
    background: #ffffff !important;
  }

  /* Kollabierte Details öffnen für Druck */
  details {
    open: true !important;
  }
  details summary {
    display: block !important;
    font-weight: 700;
  }

  /* Tabs: alle Tab-Panels sichtbar im Druck */
  .tabbed-set > input,
  .tabbed-set > label {
    display: none !important;
  }
  .tabbed-set .tabbed-content {
    display: block !important;
    page-break-inside: avoid;
    margin-bottom: 1em;
    padding: 0.5em 0.8em;
    border-left: 2px solid #c2410c;
  }

  /* Footnotes + Quellen kompakt */
  .md-typeset hr {
    border-top: 1px dashed #94a3b8;
    margin: 1em 0;
  }
}

/* Horizontaler Choreographie-Stepper am Anfang der Choreographie-Sektion */
.choreographie-stepper {
  display: flex;
  gap: 0.4em;
  margin: 1em 0 1.5em;
  flex-wrap: wrap;
}

.choreographie-stepper a {
  flex: 1 1 auto;
  min-width: 8em;
  padding: 0.6em 0.8em;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 0.4em;
  text-align: center;
  font-size: 0.78em;
  color: #9a3412;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.15s;
}

.choreographie-stepper a:hover {
  background: #c2410c;
  color: #ffffff;
  border-color: #c2410c;
}

.choreographie-stepper a .step-num {
  display: block;
  font-size: 1.4em;
  font-weight: 700;
  margin-bottom: 0.1em;
}

/* Falle-Atlas: jede Tabellen-Zeile mit Falle-Trigger-Markierung */
.md-typeset table tbody tr:has(td:first-child > strong:contains("FA")) {
  border-left: 3px solid var(--c-falle);
}

/* Norm-Hierarchie-Badges für Inline-Verweise */
.norm-bund {
  background: var(--c-bund-bg);
  color: var(--c-bund);
  padding: 0.05em 0.4em;
  border-radius: 0.25em;
  font-size: 0.85em;
  font-weight: 600;
  border: 1px solid var(--c-bund);
}

.norm-bayeug {
  background: var(--c-bayeug-bg);
  color: var(--c-bayeug);
  padding: 0.05em 0.4em;
  border-radius: 0.25em;
  font-size: 0.85em;
  font-weight: 600;
  border: 1px solid var(--c-bayeug);
}

.norm-vo {
  background: var(--c-vo-bg);
  color: #854d0e;
  padding: 0.05em 0.4em;
  border-radius: 0.25em;
  font-size: 0.85em;
  font-weight: 600;
  border: 1px solid var(--c-vo);
}

.norm-kmbek {
  background: var(--c-kmbek-bg);
  color: #3f6212;
  padding: 0.05em 0.4em;
  border-radius: 0.25em;
  font-size: 0.85em;
  font-weight: 600;
  border: 1px solid var(--c-kmbek);
}

/* Top-9-Pflichtwissen als Cheat-Card */
.md-typeset h2[id="top-9-pflichtwissen-hochprior-fur-7-tage-endspurt"] + ol {
  background: linear-gradient(135deg, #fff7ed 0%, #fefce8 100%);
  padding: 1.2em 2em 1.2em 3em;
  border-radius: 0.6em;
  border: 2px solid #c2410c;
  box-shadow: 0 2px 8px rgba(194, 65, 12, 0.1);
}

.md-typeset h2[id="top-9-pflichtwissen-hochprior-fur-7-tage-endspurt"] + ol li {
  padding: 0.4em 0;
  border-bottom: 1px dashed #fed7aa;
}

.md-typeset h2[id="top-9-pflichtwissen-hochprior-fur-7-tage-endspurt"] + ol li:last-child {
  border-bottom: none;
}

/* Footer-Bereich beruhigen */
.md-footer-meta {
  background: #1f2937;
}

/* === Iter 4: Reading-Progress-Bar (Top) === */
.reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0%;
  background: linear-gradient(90deg, #c2410c 0%, #ca8a04 100%);
  z-index: 999;
  transition: width 0.1s ease-out;
  pointer-events: none;
}

[data-md-color-scheme="slate"] .reading-progress {
  background: linear-gradient(90deg, #fb923c 0%, #facc15 100%);
}

/* === Iter 4: Sidebar Active-Highlight stärker === */
.md-nav__link--active,
.md-nav__link[aria-current="page"] {
  font-weight: 700 !important;
  color: #c2410c !important;
}

.md-nav__list .md-nav__link[aria-current="true"] {
  background: #fff7ed;
  border-left: 3px solid #c2410c;
  padding-left: 0.8em;
  margin-left: -1em;
}

[data-md-color-scheme="slate"] .md-nav__list .md-nav__link[aria-current="true"] {
  background: rgba(194, 65, 12, 0.15);
}

/* === Iter 4: Inline-Norm-Tooltips ===
   Markdown-Pattern: [Art. 41/1](# "Vollständiger Wortlaut...")
   Material-Theme aktiviert title-Attribute via abbr/tooltip plugin (md_in_html + attr_list).
   Hier visuelles Styling für inline-tooltip-Elemente. */
.md-typeset abbr[title] {
  text-decoration: underline dotted #c2410c;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 2px;
  cursor: help;
  position: relative;
}

[data-md-color-scheme="slate"] .md-typeset abbr[title] {
  text-decoration-color: #fb923c;
}

/* Material's content.tooltips: Custom-Style für längere Wortlaut-Tooltips */
.md-tooltip {
  max-width: min(28rem, 92vw);
  font-size: 0.78rem;
  line-height: 1.5;
  background: #1f2937;
  color: #f8fafc;
  padding: 0.7em 0.9em;
  border-radius: 0.4em;
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.18);
  border-left: 3px solid #c2410c;
}

.md-tooltip__inner {
  font-weight: 400;
}

[data-md-color-scheme="slate"] .md-tooltip {
  background: #0f172a;
  color: #e2e8f0;
}

/* Verfeinerte TOC-Section-Hierarchie */
.md-nav__list .md-nav__list .md-nav__link {
  font-size: 0.7rem;
  line-height: 1.4;
}

.md-nav__list .md-nav__list .md-nav__list .md-nav__link {
  font-size: 0.66rem;
  opacity: 0.85;
}

/* Verfeinerter Permalink (bessere Sichtbarkeit beim Hover über Headline) */
.md-typeset h2 .headerlink,
.md-typeset h3 .headerlink {
  color: #c2410c;
  opacity: 0.4;
  text-decoration: none;
  font-weight: 400;
  margin-left: 0.4em;
}

.md-typeset h2:hover .headerlink,
.md-typeset h3:hover .headerlink {
  opacity: 1;
}

/* Footer-Vor/Zurück-Navigation hervorheben */
.md-footer__inner.md-grid {
  background: #fff7ed;
  border-radius: 0.5em;
  margin: 1em auto;
  padding: 0.5em 0.8em;
}

.md-footer__link {
  border-radius: 0.4em;
  transition: background 0.15s;
}

.md-footer__link:hover {
  background: #fff7ed;
}

[data-md-color-scheme="slate"] .md-footer__inner.md-grid {
  background: rgba(194, 65, 12, 0.1);
}

/* === Iter 7: Visuelle Verfeinerung — Listen, Tabellen, Inline-Akzente === */

/* Bullet-Listen: größere Marker, Verschachtelungs-Indent, linke Akzent-Border */
.md-typeset ul {
  list-style: none;
  padding-left: 1.4em;
}

.md-typeset ul > li {
  position: relative;
  padding-left: 0.4em;
  margin-bottom: 0.45em;
  line-height: 1.55;
}

.md-typeset ul > li::before {
  content: "";
  position: absolute;
  left: -1em;
  top: 0.6em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #c2410c;
}

/* Sub-Listen: kleinerer Marker, andere Farbe, linke Border */
.md-typeset ul ul {
  margin-top: 0.3em;
  margin-bottom: 0.3em;
  padding-left: 1.2em;
  border-left: 2px solid #fed7aa;
  margin-left: 0.4em;
}

.md-typeset ul ul > li::before {
  background: #ca8a04;
  width: 5px;
  height: 5px;
}

.md-typeset ul ul ul > li::before {
  background: #65a30d;
  width: 4px;
  height: 4px;
}

/* Nummerierte Listen */
.md-typeset ol {
  padding-left: 1.6em;
  counter-reset: ol-counter;
}

.md-typeset ol > li {
  margin-bottom: 0.45em;
  padding-left: 0.3em;
  line-height: 1.55;
}

.md-typeset ol > li::marker {
  font-weight: 700;
  color: #c2410c;
}

/* Tabellen: Header-Akzent + Zebra-Streifen + bessere Padding */
.md-typeset table:not([class]) {
  border-radius: 0.5em;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  margin: 1.2em 0;
  font-size: 0.86em;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.md-typeset table:not([class]) thead {
  background: linear-gradient(180deg, #fff7ed 0%, #fed7aa 100%);
}

.md-typeset table:not([class]) th {
  background: transparent;
  color: #9a3412;
  font-weight: 700;
  padding: 0.7em 0.9em;
  border-bottom: 2px solid #c2410c;
  text-align: left;
}

.md-typeset table:not([class]) td {
  padding: 0.55em 0.9em;
  border-bottom: 1px solid #f1f5f9;
}

.md-typeset table:not([class]) tbody tr:nth-child(even) {
  background: #fafbfc;
}

.md-typeset table:not([class]) tbody tr:hover {
  background: #fff7ed;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) thead {
  background: linear-gradient(180deg, rgba(194, 65, 12, 0.15) 0%, rgba(194, 65, 12, 0.3) 100%);
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  color: #fdba74;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.03);
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) tbody tr:hover {
  background: rgba(194, 65, 12, 0.12);
}

/* Strong-Inline: leicht orange-getönt für visuelle Hierarchie (NICHT in Headings/Cards) */
.md-typeset p strong,
.md-typeset li strong,
.md-typeset td strong {
  color: #9a3412;
}

[data-md-color-scheme="slate"] .md-typeset p strong,
[data-md-color-scheme="slate"] .md-typeset li strong,
[data-md-color-scheme="slate"] .md-typeset td strong {
  color: #fdba74;
}

/* Pseudo-Sub-Headings: **Begriff:** am Listen-Anfang oder Paragraph-Anfang */
/* (visuell wirkt durch strong-Tönung bereits) */

/* Block-Padding zwischen Sektionen (sanfte Trennung) */
.md-typeset h2 + p,
.md-typeset h3 + p {
  margin-top: 0.4em;
}

/* Horizontale Trennlinien: deutlicher */
.md-typeset hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #c2410c 20%, #c2410c 80%, transparent 100%);
  margin: 2.5em 0;
}

[data-md-color-scheme="slate"] .md-typeset hr {
  background: linear-gradient(90deg, transparent 0%, #fb923c 20%, #fb923c 80%, transparent 100%);
}

/* Admonitions: Inset-Schatten + bessere Sichtbarkeit Title */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 0.5em;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
  margin: 1.4em 0;
}

.md-typeset .admonition-title,
.md-typeset summary {
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* Inline-Code in Norm-Refs: dezenter, weniger aufdringlich */
.md-typeset code {
  background: #fff7ed;
  color: #9a3412;
  border: 1px solid #fed7aa;
  padding: 0.08em 0.4em;
  border-radius: 0.3em;
  font-size: 0.86em;
  font-weight: 500;
}

/* Falle-Card: stärkere Border und Hover-Animation */
.falle-card {
  transition: all 0.2s ease-out;
  border-radius: 0.5em;
  margin: 0.6em 0;
}

.falle-card:hover {
  transform: translateX(2px);
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.18);
}

/* Cards-Grid: stärkerer Hover */
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid.cards > .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(194, 65, 12, 0.18);
  border-left-width: 4px;
}

/* Text-Highlight via mark-Tag */
.md-typeset mark {
  background: linear-gradient(180deg, transparent 50%, #fed7aa 50%);
  padding: 0 0.15em;
}

[data-md-color-scheme="slate"] .md-typeset mark {
  background: linear-gradient(180deg, transparent 50%, rgba(251, 146, 60, 0.4) 50%);
}

/* === Iter 4: Falle-Cards Click-to-Reveal ===
   Nutzt Material's "details" admonition-collapsible.
   Falle-Atlas-Tabelle wird optional ergänzt durch interaktive Cards. */
.falle-card {
  background: #fef2f2;
  border-left: 3px solid #dc2626;
  padding: 0.8em 1em;
  border-radius: 0.4em;
  margin: 0.5em 0;
  cursor: pointer;
  transition: all 0.15s;
}

.falle-card:hover {
  background: #fee2e2;
  border-left-color: #991b1b;
  box-shadow: 0 2px 8px rgba(220, 38, 38, 0.12);
}

.falle-card .falle-frage {
  font-weight: 600;
  color: #991b1b;
}

.falle-card .falle-antwort {
  margin-top: 0.5em;
  padding-top: 0.5em;
  border-top: 1px dashed #fca5a5;
  color: #1f2937;
  display: none;
}

.falle-card.is-open .falle-antwort {
  display: block;
}

/* === Iter 2: Cards-Grid + Mermaid === */

.md-typeset .grid.cards > ul > li,
.md-typeset .grid.cards > .card,
.md-typeset .grid > .card {
  border-radius: 0.5em;
  border: 1px solid #e2e8f0;
  border-left: 3px solid #c2410c;
  padding: 0.9em 1.1em;
  background: #ffffff;
  transition: all 0.15s;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid.cards > .card:hover {
  border-left-color: #9a3412;
  box-shadow: 0 4px 14px rgba(194, 65, 12, 0.12);
  transform: translateY(-1px);
}

.md-typeset .mermaid {
  text-align: center;
  background: #fafbfc;
  padding: 1em;
  border-radius: 0.5em;
  margin: 1.5em 0;
  border: 1px solid #e2e8f0;
}

.md-typeset .mermaid svg {
  max-width: 100%;
  height: auto;
}

[data-md-color-scheme="slate"] .md-typeset .mermaid {
  background: #1e293b;
}

/* ==========================================================================
   2026-05-05 (readability-pass): Klick-Links zu Gesetzes-Quelle
   <abbr> innerhalb <a class="norm-link"> öffnet gesetze-bayern.de etc.
   im neuen Tab. Visuell wie zuvor (gestrichelte Unterstreichung des abbr).
   ========================================================================== */
a.norm-link {
  /* Verbergen der typischen Link-Farbe; abbr behält dotted-underline */
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  border-bottom: none !important;
}

a.norm-link:hover abbr,
a.norm-link:focus abbr {
  /* Subtle hover-Indikator */
  background-color: rgba(194, 65, 12, 0.08);
  border-radius: 2px;
}

/* Externer-Link-Indikator nicht aufdringlich — kein Icon-Default */
a.norm-link:visited {
  color: inherit;
}