/* ===========================================================================
   Analyse-Werkzeuge (Vertrags-, Honorarbescheid-, Personal-, Umfeldanalyse)

   Wird NACH style.css und style-nav.css geladen. Alle Klassen tragen die
   Vorsilbe „an-", damit sich die vier Werkzeuge nicht gegenseitig und keine
   der übrigen Seiten stören.

   Die Farben kommen aus den Variablen in style.css — hier steht keine neue
   Hausfarbe.
   =========================================================================== */

/* ===========================================================================
   Die Dokumentauswahl — im Layout der Anforderungsliste
   ---------------------------------------------------------------------------
   Ausdrücklicher Wunsch des Betreibers: „Bitte bei den Listen der Analysetools
   an dem gleichen Layout wie bei der IRL orientieren vom Aussehen."

   Die Werte hier spiegeln public/style-irl.css. Die Klassen heißen trotzdem
   „anx-" und nicht „irlx-": Zwei Bereiche, die sich dieselben Regeln teilen,
   laufen früher oder später auseinander — und dann steht in der einen Datei
   eine Regel, die in der anderen etwas kaputt macht. Doppelte Werte sind der
   kleinere Preis.

   Vorher stand hier ein Raster aus Kästen (.an-ordner als <fieldset>), in dem
   jeder Ordner eine eigene Kachel war. Bei dreißig Ordnern war das eine Wand
   aus Rahmen, und die Frage „was ist gewählt?" war darin nicht zu beantworten.
   =========================================================================== */
:root {
  --anx-pick: 34px;
  --anx-mark: 230px;
}

.anx-liste { margin: 8px 0 18px; }

/* Eine Spaltenüberschrift für die ganze Liste. Sie liegt außerhalb der
   Tabellen und hält deren Breiten über dieselben Werte ein. */
.anx-spaltenkopf {
  display: flex; align-items: center;
  padding: 3px 0 4px; border-bottom: 1px solid var(--soft);
  font-size: 10.5px; letter-spacing: .4px; text-transform: uppercase; color: var(--slate);
}
.anx-spaltenkopf > span { padding: 0 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.anx-spaltenkopf .anx-c-pick { flex: 0 0 var(--anx-pick); }
.anx-spaltenkopf .anx-c-name { flex: 1 1 auto; }
.anx-spaltenkopf .anx-c-mark { flex: 0 0 var(--anx-mark); }

/* ---------- Ordner als Abschnitt ---------- */
.anx-kat { border-bottom: 1px solid var(--soft); }
.anx-kat:last-child { border-bottom: 0; }
.anx-kat-kopf {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 4px 6px; cursor: pointer; list-style: none;
  font-size: 12.5px; line-height: 1.3;
}
.anx-kat-kopf::-webkit-details-marker { display: none; }
.anx-kat-kopf:hover { background: var(--bg); }
.anx-kat-pfeil { display: inline-flex; color: var(--slate); transition: transform .15s; }
.anx-kat[open] > .anx-kat-kopf .anx-kat-pfeil { transform: rotate(90deg); }
.anx-kat-name { font-weight: 600; color: var(--navy); overflow-wrap: anywhere; }
.anx-kat-zahl { color: var(--slate); font-variant-numeric: tabular-nums; }
/* Das Kästchen „ganzer Ordner" sitzt im Kopf und braucht eine Trefferfläche,
   die auch mit der Maus zu erwischen ist. */
.anx-kat-alle { display: inline-flex; align-items: center; padding: 2px; cursor: pointer; }
.anx-kat-alle input { margin: 0; }
/* Der vorgeschlagene Ordner ist erkennbar, aber nicht vorausgewählt im Sinne
   von „egal, drück einfach". Die Auswahl bleibt eine Entscheidung. */
.anx-kat.anx-vorschlag > .anx-kat-kopf { background: #FFF9F9; }

/* ---------- Die Tabelle ----------
   table-layout: fixed ist die Voraussetzung dafür, dass ein langer Dateiname
   die Spalte NICHT breiter macht, sondern abgeschnitten wird. Ohne sie
   bestimmte der längste Name die Breite und die Tabelle liefe über den
   rechten Rand. */
.anx-tab { width: 100%; table-layout: fixed; border-collapse: collapse; }
.anx-tab td { padding: 0 6px; vertical-align: middle; }

.anx-pos { border-top: 1px solid var(--bg); }
.anx-pos > td {
  height: 24px; font-size: 13px; line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.anx-pos:hover { background: var(--bg); }
.anx-tab .anx-c-pick { width: var(--anx-pick); text-align: center; }
.anx-tab .anx-c-pick input { margin: 0; vertical-align: middle; }
.anx-tab .anx-c-name { color: var(--ink); }
/* Der Name ist zugleich der Griff: ein Klick darauf kreuzt an. Das <label>
   trägt die Kürzung, nicht die Zelle — sonst reichte die Trefferfläche nur so
   weit wie der Text. */
.anx-tab .anx-c-name label {
  display: block; cursor: pointer;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.anx-tab .anx-c-mark { width: var(--anx-mark); text-align: right; }
.anx-tab .anx-c-mark .badge { margin-left: 4px; }
/* Ohne Text wird die Unterlage beim Lauf übersprungen — der Name tritt zurück. */
.anx-pos.anx-ohnetext .anx-c-name label { color: var(--grey); }

/* Was einbezogen wird, muss man sehen. Ein Häkchen von dreizehn Bildpunkten
   ist in einer Liste von vierzig Zeilen keine Auskunft. */
.anx-pos.an-gewaehlt { background: var(--rose-bg); }
.anx-pos.an-gewaehlt .anx-c-name label { color: var(--navy); font-weight: 500; }
.anx-pos.an-gewaehlt > td:first-child { box-shadow: inset 2px 0 0 var(--red); }

/* Auf schmalen Geräten fällt die Merkmalsspalte weg: Drei Marken neben einem
   Dateinamen passen auf einem Telefon nicht in eine Zeile, und der Name ist
   die wichtigere Angabe. */
@media (max-width: 700px) {
  :root { --anx-mark: 96px; }
  .anx-tab .anx-c-mark .badge { display: none; }
  .anx-tab .anx-c-mark .badge:first-child { display: inline-block; }
}

.an-zaehlzeile { font-weight: 500; color: var(--navy); margin: 6px 0 2px; }

/* ---------- Kopfzeile der Auswahl (views/analyse/auswahlliste.ejs) ---------- */
.an-kopf {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px;
  padding: 10px 12px; margin: 10px 0 4px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--bg);
}
/* Die Zählzeile ist die wichtigste Angabe der Leiste und bekommt den Platz,
   der übrig bleibt — Marken und Knöpfe stehen rechts. */
.an-kopf .an-zaehlzeile { flex: 1 1 200px; margin: 0; }
.an-kopf-marken { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.an-kopf-knoepfe { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.an-kopf-knoepfe[hidden] { display: none; }
.an-kein-vorschlag { margin: 2px 0 8px; }

/* ---------- Vertraulichkeit ---------- */
.an-vertraulich {
  border: 1px solid var(--line); border-left: 3px solid var(--red);
  border-radius: var(--radius-sm); background: #fff;
  padding: 14px 16px; margin: 4px 0 16px;
}
.an-vertraulich h3 { margin: 0 0 6px; font-size: 15px; color: var(--navy); }
.an-vertraulich p { margin: 0 0 10px; }
.an-schalter {
  display: flex; align-items: flex-start; gap: 9px;
  margin: 8px 0; cursor: pointer; line-height: 1.45;
}
.an-schalter input { margin-top: 3px; flex: 0 0 auto; }
.an-knopfzeile { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

/* ---------- Warnung: Patientendaten ----------
   Nicht wegklickbar und deutlich: Die Farbe allein trägt die Aussage nicht,
   Überschrift und Text stehen daneben. */
.an-patwarnung {
  border: 2px solid var(--red); border-radius: var(--radius);
  background: var(--rose-bg); padding: 16px 18px; margin-bottom: 18px;
}
.an-patwarnung h2 { margin: 0 0 8px; font-size: 17px; color: var(--red); }
.an-patwarnung p { margin: 0 0 10px; }
.an-pattabelle { background: #fff; border-radius: var(--radius-sm); }
.an-pattabelle td, .an-pattabelle th { overflow-wrap: anywhere; }

/* ---------- Ergebnis ---------- */
.an-laufkopf {
  display: flex; justify-content: space-between; align-items: baseline;
  flex-wrap: wrap; gap: 10px;
}
.an-laufkopf h2 { margin: 0; }
/* Die Aussagenüberschrift der Folie, so wie sie in der Präsentation steht. */
.an-aussage {
  font-size: 18px; line-height: 1.35; color: var(--navy);
  border-left: 3px solid var(--red); padding: 4px 0 4px 12px;
  margin: 14px 0 16px;
}

/* Waagerechtes Rollen statt Überlauf: Die Mietvertragstabelle hat je Standort
   eine Spalte und passt auf schmalen Geräten sonst nicht. */
.an-tabellenrahmen { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.an-tabellenrahmen > table { min-width: 640px; }

.an-miettabelle th[scope="row"] {
  background: var(--rose-bg); color: var(--red); font-weight: 600;
  width: 190px; text-align: left; vertical-align: middle;
}
.an-miettabelle td { vertical-align: top; overflow-wrap: anywhere; white-space: pre-line; }
.an-miettabelle tr.an-hervor td, .an-miettabelle tr.an-hervor th { background: #FFF4F4; font-size: 13px; }
.an-luecke { color: var(--grey); font-style: italic; }
.an-beleg { display: block; color: var(--grey); font-size: 11.5px; font-style: italic; margin-top: 3px; }
.an-zitat { font-style: italic; color: var(--slate); overflow-wrap: anywhere; }

/* Einstufung eines Risikos: Form und Text, nicht nur Farbe. */
.an-stufe {
  display: inline-block; padding: 2px 9px; border-radius: 999px;
  font-size: 12.5px; font-weight: 500; white-space: nowrap;
}
.an-stufe-hoch { background: var(--rose-bg); color: var(--red); }
.an-stufe-mittel { background: #FFF3C4; color: #7A5A00; }
.an-stufe-niedrig { background: var(--green-bg); color: var(--green); }

/* Der Warnkasten der Folie, hier auf dem Bildschirm wiederholt. */
.an-warnkasten {
  display: inline-block; border: 1px solid #D9A400; background: #FFF3C4;
  border-radius: var(--radius-sm); padding: 7px 12px; margin: 14px 0 0;
  font-size: 13px; font-weight: 600; color: var(--ink);
}
.an-warnkasten span { font-weight: 400; color: var(--slate); }

.an-aus { border-left: 3px solid var(--line); }
/* Der Balken der Fortschrittsanzeige atmet, damit erkennbar ist, dass etwas
   geschieht. Wer Bewegung abgeschaltet hat, sieht einen ruhigen Balken. */
.an-puls { animation: an-puls 1.6s ease-in-out infinite; }
@keyframes an-puls { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .an-puls { animation: none; } }

/* ---------- Schmale Bildschirme ---------- */
@media (max-width: 900px) {
  .an-miettabelle th[scope="row"] { width: 150px; }
}
@media (max-width: 560px) {
  .an-aussage { font-size: 16px; }
  .an-knopfzeile .btn { width: 100%; text-align: center; }
}

/* ===========================================================================
   Umfeld-Analyse (Vorsilbe „uf-")
   Ergänzt die Klassen oben, ohne eine von ihnen zu ändern. Vorbild ist
   Originalfolie 34: eine Spalte je Standort, darin Karte, Kasten
   „Mitbewerber" und Kasten „Zuweiser".
   =========================================================================== */

/* ---------- Schalter der Webrecherche ----------
   Steht oberhalb des Startknopfes. Die Warnung ist nicht wegklickbar; sie
   trägt die Aussage im Text, nicht in der Farbe. */
.uf-web { border-left: 3px solid var(--grey); }
.uf-web.uf-web-an { border-left-color: var(--red); }
.uf-web-warn {
  border: 1px solid #D9A400; background: #FFF3C4; border-radius: var(--radius-sm);
  padding: 10px 13px; margin: 6px 0 12px; line-height: 1.5;
}
.uf-webform { margin-top: 10px; }

/* ---------- Betriebsart ---------- */
.uf-betrieb {
  border: 1px solid var(--line); border-left: 3px solid var(--navy);
  border-radius: var(--radius-sm); background: #fff;
  padding: 14px 16px; margin: 4px 0 16px;
}
.uf-betrieb h3 { margin: 0 0 6px; font-size: 15px; color: var(--navy); }
.uf-zweite {
  border-top: 1px solid var(--line); margin-top: 10px; padding-top: 8px;
}
.uf-zweite[hidden] { display: none; }

/* ---------- Betriebsart des fertigen Laufs ---------- */
.uf-betriebszeile { margin: 12px 0 6px; }
/* Kein white-space: nowrap — die Betriebsart ist ein ganzer Satz („ohne
   Webrecherche — ausschließlich Unterlagen des Datenraums") und lief auf
   390 px sonst über den rechten Rand hinaus. */
.uf-modus {
  display: inline-block; padding: 2px 10px; border-radius: 999px;
  font-size: 13px; font-weight: 500; max-width: 100%; overflow-wrap: anywhere;
}
.uf-modus-aus { background: var(--soft); color: var(--slate); }
.uf-modus-anonym { background: var(--green-bg); color: var(--green); }
.uf-modus-namentlich { background: var(--rose-bg); color: var(--red); }

/* ---------- Positionierung je Standort ----------
   Eine Spalte je Standort wie auf der Folie; auf schmalen Geräten
   untereinander. Kein waagerechtes Rollen: Die Kästen sind Fließtext. */
.uf-spalten {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px; margin: 14px 0 10px;
}
.uf-spalte { min-width: 0; }
.uf-standort { margin: 0 0 8px; font-size: 15px; color: var(--red); }

/* Der leere, beschriftete Kartenrahmen. Eine erfundene Karte wäre schlimmer
   als gar keine — hier steht deshalb, was fehlt und wer es einsetzt. */
.uf-karte {
  border: 1px dashed var(--line); border-radius: var(--radius-sm);
  background: #FBFBFC; padding: 18px 12px; margin-bottom: 10px;
  text-align: center; color: var(--grey); display: grid; gap: 3px;
  min-height: 96px; align-content: center;
}
.uf-karte b { font-size: 13.5px; color: var(--slate); }
.uf-karte span { font-size: 12.5px; }
.uf-karte em { font-size: 11.5px; }

/* Kasten mit senkrechtem Beschriftungsbalken wie auf der Originalfolie. */
.uf-kasten {
  display: flex; align-items: stretch; margin-bottom: 10px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: #fff; overflow: hidden; min-width: 0;
}
.uf-balken {
  flex: 0 0 26px; display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: 600; font-size: 12px;
}
.uf-balken span { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; }
.uf-kasten-mit .uf-balken { background: var(--red); }
.uf-kasten-zuw .uf-balken { background: var(--slate); }
.uf-inhalt { padding: 10px 12px; min-width: 0; flex: 1 1 auto; }
.uf-inhalt p { margin: 0 0 7px; font-size: 13.5px; line-height: 1.45; }
.uf-webtext { color: var(--slate); }

.uf-liste { margin: 4px 0 0; padding-left: 18px; }
.uf-liste li { margin-bottom: 6px; font-size: 13.5px; line-height: 1.45; overflow-wrap: anywhere; }

/* Herkunft einer Angabe. Sie steht an JEDER Angabe, nicht nur in einer
   Legende — der Unterschied Datenraum/Netz ist der Kern dieses Werkzeugs. */
.uf-herkunft {
  display: block; font-size: 11.5px; font-style: italic; color: var(--grey);
  margin-top: 2px; overflow-wrap: anywhere;
}
.uf-herkunft-web { color: var(--slate); font-style: normal; }
.uf-herkunft-web a { overflow-wrap: anywhere; }

/* ---------- Steckbriefe und Markttreiber ---------- */
.uf-steckbriefe {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px; margin: 12px 0;
}
.uf-steckbrief {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 12px 14px; background: #fff; min-width: 0;
}
.uf-steckbrief h4 { margin: 0 0 4px; font-size: 14.5px; color: var(--navy); overflow-wrap: anywhere; }
.uf-steckbrief p { margin: 0 0 5px; }

.uf-anteil { font-weight: 600; color: var(--red); }

/* ---------- Suchprotokoll ---------- */
.uf-anfrage { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; overflow-wrap: anywhere; }
.uf-gefiltert td { background: #FFF7F7; }
.uf-gesperrt { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 0; }

/* ---------- Schmale Bildschirme ---------- */
@media (max-width: 900px) {
  .uf-spalten { grid-template-columns: 1fr; }
  .uf-steckbriefe { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .uf-inhalt { padding: 9px 10px; }
  .uf-webform .btn { width: 100%; text-align: center; }
}

/* ===========================================================================
   Honorarbescheid-Analyse (hn.) und Personal-Analyse (pl.)
   Ergänzungen zum Vorhandenen. Keine der obigen Regeln wird umgeschrieben;
   die Farben kommen weiterhin aus den Variablen in style.css.
   =========================================================================== */

/* ---------- Zahlentabellen ----------
   Beide Werkzeuge zeigen überwiegend Zahlen. Sie stehen mittig unter der
   Spaltenüberschrift und brechen nicht um: Eine umgebrochene Zahl ist in einer
   Due Diligence unlesbar. Die erste Spalte bleibt der Zeilenkopf. */
.an-zahlen th[scope="row"] {
  background: var(--rose-bg); color: var(--red); font-weight: 600;
  text-align: left; vertical-align: middle; white-space: normal;
  overflow-wrap: anywhere; min-width: 120px;
}
.an-zahlen td { text-align: center; vertical-align: middle; white-space: nowrap; }
.an-zahlen td.small { white-space: normal; overflow-wrap: anywhere; text-align: left; }
.an-zahlen tr.an-hervor td, .an-zahlen tr.an-hervor th { background: #FFF4F4; }

/* Abweichung gegen eine Vergleichslinie: Vorzeichen und Farbe zugleich – die
   Farbe allein trägt die Aussage nicht. */
.an-delta { display: block; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.an-plus { color: var(--green, #1D6B34); }
.an-minus { color: var(--red); }

/* Eine herausgehobene Kennzahl (Top-3-Anteil). */
.an-kennzahl {
  font-size: 16px; color: var(--navy); font-weight: 500;
  border-left: 3px solid var(--red); padding: 4px 0 4px 12px; margin: 10px 0 14px;
}
.an-kennzahl span { display: block; font-weight: 400; }

/* Aufzählungen der Prüfblöcke. */
.an-liste { margin: 6px 0 14px; padding-left: 20px; }
.an-liste li { margin: 4px 0; line-height: 1.45; overflow-wrap: anywhere; }
.an-pruefkarte h3 { margin: 18px 0 4px; font-size: 15px; color: var(--navy); }
.an-pruefkarte h3:first-of-type { margin-top: 6px; }

/* ---------- Personal: was hinausgegangen ist ----------
   Steht vor dem Ergebnis. Wer die Auswertung liest, soll zuerst sehen, unter
   welchen Bedingungen sie entstanden ist. */
.an-abfluss { border-left: 3px solid var(--navy); }
.an-abfluss p { margin: 0 0 8px; display: flex; flex-wrap: wrap; gap: 6px; }
.an-abfluss p.small.muted, .an-abfluss p.notice { display: block; }

/* Der Schalter „Namen pseudonymisieren" ist der wichtigste auf der Seite. */
.an-vertraulich-personal { border-left-width: 4px; }
.an-schalter-stark {
  background: var(--rose-bg); border: 1px solid var(--rose, #F2C3C3);
  border-radius: var(--radius-sm); padding: 9px 11px; margin: 10px 0 4px;
}
.an-schalter-stark b { color: var(--navy); }

/* ---------- Personenkacheln je Standort (Folien 42–44) ---------- */
.an-personen {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 12px; margin: 12px 0 8px;
}
.an-person {
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 11px 13px; background: #fff; min-width: 0;
}
.an-person-kopf {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 2px; color: var(--navy);
}
.an-person-kopf b { overflow-wrap: anywhere; }
.an-person-rolle { margin-bottom: 8px; overflow-wrap: anywhere; }
/* Beschriftung links, Wert rechts – wie auf der Originalfolie. */
.an-person-daten {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 3px 10px; margin: 0 0 8px; font-size: 13.5px;
}
.an-person-daten dt { color: var(--grey); overflow-wrap: anywhere; }
.an-person-daten dd { margin: 0; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.an-person-daten dd .small { font-weight: 400; }
.an-person-kommentar {
  margin: 0 0 6px; padding-top: 7px; border-top: 1px solid var(--line);
  line-height: 1.45; overflow-wrap: anywhere;
}
.an-person .an-beleg { margin: 0; }

/* ---------- Schmale Bildschirme ----------
   Die Zahlentabellen rollen bereits waagerecht (.an-tabellenrahmen). Hier geht
   es nur um die Kacheln und die Mindestbreite: Bei 390 px darf nichts über den
   Rand laufen. */
@media (max-width: 900px) {
  .an-personen { grid-template-columns: 1fr; }
  .an-zahlen th[scope="row"] { min-width: 104px; }
}
@media (max-width: 560px) {
  .an-kennzahl { font-size: 15px; }
  .an-person-daten { grid-template-columns: 1fr; gap: 1px; }
  .an-person-daten dt { margin-top: 5px; }
}

/* Zweite Stufe der Vorprüfung: gefunden, aber nicht gesperrt. Die Farbe ist
   bewusst nicht das Rot der Sperre — sonst wäre nicht unterscheidbar, was
   blockiert und was nur anzusehen ist. Überschrift und Text tragen die
   Aussage; die Farbe allein reicht nie. */
.an-patpruefen {
  border: 2px solid #D9A400; border-radius: var(--radius);
  background: #FFFBEF; padding: 16px 18px; margin-bottom: 18px;
}
.an-patpruefen h2 { margin: 0 0 8px; font-size: 17px; color: #7A5A00; }
.an-patpruefen p { margin: 0 0 10px; }

/* Der Beleg steht auch in einem Zeilenkopf. Die Tabellenköpfe der Anwendung
   sind in Versalien gesetzt — ein Zitat in Versalien wäre kein Zitat mehr. */
.an-zahlen th .an-beleg,
.an-person .an-beleg { text-transform: none; letter-spacing: normal; font-weight: 400; }