/* ============================================================
   Betriebs-Portal Logemann – ruhiges, feines Design.
   Grundsätze: kaum Fettschrift, kein Rot als Fläche (nur Logo-Punkt
   und echte Warnungen), feine Linien, weiche Schatten, viel Luft.
   Barrierefreiheit: gute Kontraste, sichtbarer Fokus, keine
   Information nur über Farbe, 200–400 % Zoom ohne Querscrollen.
   ============================================================ */

:root {
  --rot: #b3121f;            /* Firmenrot: Logo-Punkt und Warnungen */
  --rot-dunkel: #8c0e18;
  --aktion: #364152;         /* ruhige Aktionsfarbe für Knöpfe */
  --aktion-hover: #26303f;
  --tinte: #23272e;
  --tinte-leise: #667085;
  --papier: #f7f8fa;
  --karte: #ffffff;
  --linie: #e7eaee;          /* feine Trennlinien */
  --linie-stark: #d4d9df;    /* Ränder von Eingabefeldern */
  --gruen: #1e7a3c;
  --gelb-grund: #fdf6e3;
  --gelb-rand: #8a6d00;
  --blau: #1a5276;
  --fokus: #2e6da4;
  --radius: 12px;
  --radius-klein: 8px;
  --schatten: 0 1px 2px rgba(16, 24, 40, 0.04), 0 2px 6px rgba(16, 24, 40, 0.05);
}

* { box-sizing: border-box; }

html { font-size: 15px; }

body {
  margin: 0;
  font-family: "Segoe UI", system-ui, Arial, sans-serif;
  background: var(--papier);
  color: var(--tinte);
  line-height: 1.6;
}

/* Großansicht: pro Benutzer zuschaltbar – größere Schrift und Abstände */
body.gross { font-size: 1.3rem; }
body.gross .inhalt { max-width: 100%; }
body.gross td, body.gross th { padding: 0.8em 0.7em; }
body.gross .knopf { padding: 0.7em 1.2em; }

/* Sichtbarer Tastatur-Fokus – überall */
:focus-visible {
  outline: 2px solid var(--fokus);
  outline-offset: 2px;
  border-radius: 3px;
}

.sprungmarke {
  position: absolute;
  left: -999px;
  top: 0;
  background: var(--tinte);
  color: #fff;
  padding: 0.6em 1em;
  z-index: 100;
}
.sprungmarke:focus { left: 8px; }

/* ---------- Marke ---------- */

.marke {
  font-weight: 600;
  font-size: 1.05em;
  letter-spacing: 0.01em;
  display: flex;
  align-items: center;
  gap: 0.5em;
}
.marke-punkt {
  width: 0.6em;
  height: 0.6em;
  background: var(--rot);
  border-radius: 50%;
  display: inline-block;
}

/* ---------- Kopfzeile (nur Anmeldeseite) ---------- */

.kopf {
  background: var(--karte);
  border-bottom: 1px solid var(--linie);
}
.kopf-innen {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0.8rem 1.2rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 1.5rem;
}

/* ---------- Seitenleiste (angemeldete Ansicht) ---------- */

.rahmen {
  display: flex;
  min-height: 100vh;
  align-items: stretch;
}
.seitenleiste {
  width: 212px;
  flex-shrink: 0;
  background: var(--karte);
  border-right: 1px solid var(--linie);
  padding: 1.1rem 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
}
.seitenleiste .marke {
  color: var(--tinte);
  text-decoration: none;
  padding: 0.15rem 0.55rem 0.85rem;
  border-bottom: 1px solid var(--linie);
}
.hauptnav {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.15rem;
  margin: 0;
  padding: 0;
}
.seitenleiste .hauptnav {
  flex-direction: column;
}
.nav-gruppe { margin-bottom: 0.9rem; }
.nav-gruppe:last-child { margin-bottom: 0; }
.nav-gruppe-titel {
  margin: 0 0 0.3rem;
  padding: 0 0.8em;
  font-size: 0.68em;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--tinte-leise);
}
.hauptnav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5em;
  padding: 0.42em 0.75em;
  border-radius: var(--radius-klein);
  color: var(--tinte-leise);
  text-decoration: none;
  font-size: 0.95em;
  font-weight: 450;
  transition: background 0.12s, color 0.12s;
}
.hauptnav a:hover { text-decoration: none; }
.nav-zahl {
  background: #e6eff5;
  color: var(--blau);
  font-size: 0.78em;
  font-weight: 600;
  padding: 0.05em 0.55em;
  border-radius: 999px;
}
.hauptnav a:hover {
  background: var(--papier);
  color: var(--tinte);
}
.hauptnav a[aria-current="page"] {
  background: #eef1f5;
  color: var(--tinte);
  font-weight: 600;
}
.seitenleiste .schnell-aufgabe {
  margin-top: auto;   /* Schnelleingabe und Benutzer unten andocken */
  border-top: 1px solid var(--linie);
  padding-top: 1rem;
}
.leiste-fuss {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  color: var(--tinte-leise);
  font-size: 0.92em;
  border-top: 1px solid var(--linie);
  padding-top: 0.85rem;
}
.inhalt-spalte {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.inhalt-spalte .inhalt { width: 100%; }
.inhalt-spalte .fuss { margin-top: auto; }

/* Aufgaben-Schnelleingabe (Modul 4) */
.schnell-aufgabe {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.45rem;
}
.schnell-aufgabe input[type="text"],
.schnell-aufgabe select {
  width: 100%;
  padding: 0.42em 0.6em;
  font: inherit;
  font-size: 0.92em;
  border: 1px solid var(--linie-stark);
  border-radius: var(--radius-klein);
  background: var(--papier);
  color: var(--tinte);
}

/* ---------- Inhalt ---------- */

.inhalt {
  max-width: 1160px;
  margin: 0 auto;
  padding: 1.6rem 1.6rem 3.5rem;
}

h1 {
  font-size: 1.45em;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin: 0.2em 0 1em;
}
h2 {
  font-size: 1.12em;
  font-weight: 600;
  margin: 1.8em 0 0.7em;
}
strong, b { font-weight: 600; }

/* Links ruhig: unterstrichen erst beim Überfahren */
a { color: var(--blau); text-decoration: none; }
a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }

/* Feine Scrollbalken statt der breiten Windows-Balken */
* { scrollbar-width: thin; scrollbar-color: var(--linie-stark) transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: var(--linie-stark);
  border-radius: 99px;
  border: 2px solid transparent;
  background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover { background-color: var(--tinte-leise); }

.karte {
  background: var(--karte);
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  box-shadow: var(--schatten);
  padding: 1.15rem 1.3rem;
  margin-bottom: 1.1rem;
}

.kartenreihe {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 1.1rem;
}
.kartenreihe .karte { margin-bottom: 0; }

/* ---------- Einklappbare Abschnitte ---------- */

details.karte > summary {
  cursor: pointer;
  font-size: 1em;
  font-weight: 600;
  list-style: none;
  user-select: none;
  margin: -0.35rem -0.4rem;
  padding: 0.35rem 0.4rem;
  border-radius: var(--radius-klein);
  transition: background 0.12s;
}
details.karte > summary:hover { background: var(--papier); }
details.karte > summary::-webkit-details-marker { display: none; }
details.karte > summary::before {
  content: "▸";
  display: inline-block;
  width: 1.15em;
  color: var(--tinte-leise);
  transition: transform 0.12s;
}
details.karte[open] > summary::before { content: "▾"; }
details.karte[open] > summary {
  margin-bottom: 0.7rem;
  border-bottom: 1px solid var(--linie);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding-bottom: 0.7rem;
}
summary .zusammenfassung {
  font-weight: 400;
  font-size: 0.92em;
  color: var(--tinte-leise);
}
.zusammenfassung { font-weight: 400; font-size: 0.92em; color: var(--tinte-leise); }

/* Dezente erklärende Hinweiszeile unter Überschriften */
.hinweis {
  color: var(--tinte-leise);
  font-size: 0.9em;
  margin-top: -0.4rem;
}

/* ---------- Meldungen ---------- */

.meldung {
  border-radius: var(--radius-klein);
  padding: 0.7em 1em;
  border-left: 3px solid;
  font-size: 0.95em;
  font-weight: 500;
  box-shadow: var(--schatten);
}
.meldung-ok { background: #e9f6ee; border-color: var(--gruen); color: #155c2e; }
.meldung-fehler { background: #fdeceb; border-color: var(--rot); color: var(--rot-dunkel); }

/* ---------- Tabellen ---------- */

.tabellen-rahmen {
  overflow-x: auto;
  background: var(--karte);
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  box-shadow: var(--schatten);
  margin-bottom: 1.1rem;
}
table {
  width: 100%;
  border-collapse: collapse;
}
caption {
  text-align: left;
  font-size: 0.9em;
  font-weight: 500;
  color: var(--tinte-leise);
  padding: 0.8em 1em 0.2em;
}
th, td {
  text-align: left;
  padding: 0.65em 1em;
  border-bottom: 1px solid var(--linie);
  vertical-align: top;
}
th {
  font-size: 0.75em;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--tinte-leise);
  border-bottom: 1px solid var(--linie-stark);
}
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover { background: var(--papier); }
/* Sekundärinfos in Tabellenzellen (Datum, "von Hannes", Kd-Nr) treten zurück */
td > span:not(.badge) {
  color: var(--tinte-leise);
  font-size: 0.88em;
}

/* ---------- Angebots-Positionen: direkt editierbare Zeilen ---------- */

.pos-tabelle td { padding: 0.32em 0.45em; vertical-align: middle; }
.pos-tabelle input { padding: 0.35em 0.5em; font-size: 0.95em; }
.pos-tabelle .pos-nr { color: var(--tinte-leise); white-space: nowrap; }
.pos-tabelle td.schmal { width: 11em; }
.pos-tabelle td.mini { width: 6.4em; }
.pos-tabelle .pos-gesamt {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.pos-tabelle tfoot td { border-bottom: none; padding-top: 0.6em; }
.pos-tabelle .pos-summe { font-weight: 600; }
.pos-tabelle input[type="checkbox"] { width: auto; }
/* Bezeichnung + „in die Vorschlagsliste“-Knopf nebeneinander */
.bez-zeile { display: flex; gap: 0.3rem; align-items: center; }
.bez-zeile input { flex: 1; }

/* Vorschlagsliste unter der Positionstabelle: Suche immer sichtbar */
.vorschlag-suchzeile {
  display: flex;
  gap: 0.6rem;
  align-items: center;
}
/* Live-Suche: dezentes Zeichen, dass gerade nachgeladen wird */
form.laedt input[type="search"] { border-color: var(--fokus); }
.vorschlag-suchzeile input[type="search"] { flex: 1; }
.vorschlag-liste {
  list-style: none;
  margin: 0.7rem 0 0;
  padding: 0;
}
.vorschlag-liste li { border-bottom: 1px dashed var(--linie); }
.vorschlag-liste li:last-child { border-bottom: none; }
.vorschlag-liste form {
  display: flex;
  gap: 0.6rem;
  align-items: center;
  flex-wrap: wrap;
  padding: 0.4em 0;
}
.vorschlag-text { flex: 1; min-width: 14em; }

/* ---------- Formulare ---------- */

label {
  display: block;
  font-weight: 500;
  font-size: 0.94em;
  margin-bottom: 0.3em;
}
.feld { margin-bottom: 1rem; }
.feldzeile {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0 1.1rem;
}
input[type="text"], input[type="password"], input[type="email"], input[type="date"],
input[type="number"], input[type="search"], input[type="url"], select, textarea {
  width: 100%;
  padding: 0.5em 0.7em;
  font: inherit;
  border: 1px solid var(--linie-stark);
  border-radius: var(--radius-klein);
  background: var(--karte);
  color: var(--tinte);
  transition: border-color 0.12s, box-shadow 0.12s;
}
input:hover, select:hover, textarea:hover { border-color: var(--tinte-leise); }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--fokus);
  box-shadow: 0 0 0 3px rgba(46, 109, 164, 0.15);
}
textarea { min-height: 5.5em; }
fieldset {
  border: 1px solid var(--linie);
  border-radius: var(--radius-klein);
  margin: 0 0 1rem;
  padding: 0.8rem 1rem;
}
legend { font-weight: 600; font-size: 0.94em; padding: 0 0.4em; }

/* ---------- Knöpfe ---------- */

.knopf {
  display: inline-block;
  padding: 0.5em 1.05em;
  font: inherit;
  font-size: 0.95em;
  font-weight: 500;
  border-radius: var(--radius-klein);
  border: 1px solid var(--aktion);
  background: var(--aktion);
  color: #fff;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.12s, border-color 0.12s;
}
a.knopf:hover { text-decoration: none; }
.knopf:hover { background: var(--aktion-hover); border-color: var(--aktion-hover); }
.knopf-zweit {
  background: var(--karte);
  color: var(--tinte);
  border-color: var(--linie-stark);
}
.knopf-zweit:hover {
  background: var(--papier);
  border-color: var(--tinte-leise);
  color: var(--tinte);
}
.knopf-klein { padding: 0.32em 0.75em; font-size: 0.85em; }

/* ---------- Status-Badges (immer Symbol + Wort, nie nur Farbe) ---------- */

.badge {
  display: inline-block;
  padding: 0.16em 0.6em;
  border-radius: 999px;
  font-weight: 500;
  font-size: 0.8em;
  white-space: nowrap;
}
.badge-gruen { background: #e5f3ea; color: #155c2e; }
.badge-rot { background: #fbe9e8; color: var(--rot-dunkel); }
.badge-gelb { background: #f8efd4; color: #6d5600; }
.badge-blau { background: #e6eff5; color: var(--blau); }
.badge-grau { background: #edeff2; color: #4d5561; }

/* Überfälliges deutlich markieren (Farbe + Wort im Inhalt) */
.ueberfaellig { border-left: 3px solid var(--rot); }
.bald-faellig { border-left: 3px solid var(--gelb-rand); }

/* ---------- Datei-Upload ---------- */

.upload-knoepfe {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
}
/* Kamera-Eingabefeld visuell versteckt – der Knopf (label) löst es aus */
.nur-kamera {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.foto-knopf { text-align: center; }
/* Auf großen Bildschirmen gibt es keine Rückkamera – Knopf ausblenden */
@media (min-width: 701px) {
  .foto-knopf { display: none; }
}

/* Ziehen-und-Ablegen-Fläche um Dateifelder (baut app.js automatisch) */
.drop-zone {
  border: 1.5px dashed var(--linie-stark);
  border-radius: var(--radius-klein);
  padding: 0.9rem;
  background: var(--papier);
  transition: border-color 0.15s, background 0.15s;
}
.drop-zone.aktiv {
  border-color: var(--fokus);
  background: #e9f1f8;
}
.drop-hinweis {
  margin: 0.45rem 0 0;
  font-size: 0.9em;
  color: var(--tinte-leise);
}
.datei-liste {
  list-style: none;
  margin: 0.6rem 0 0;
  padding: 0;
}
.datei-liste li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.35em 0;
  border-bottom: 1px dashed var(--linie);
  font-size: 0.94em;
}

/* ---------- Einfache Ansicht (pro Benutzer zuschaltbar) ---------- */

.pos-titel {
  margin: 0 0 0.3rem;
  font-size: 1.15em;
  line-height: 1.4;
}
.pos-menge { margin: 0 0 0.5rem; }

.einfach-pruefung {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: stretch;
}
.einfach-knopf {
  flex: 1 1 8.5em;
  font-size: 1.1em;
  padding: 0.85em 1em;
  text-align: center;
}
/* Ampelfarben bleiben bewusst: sie sind Information, keine Deko */
.einfach-gruen { background: var(--gruen); border-color: var(--gruen); color: #fff; }
.einfach-gruen:hover { background: #16552a; border-color: #16552a; }
.einfach-rot { background: var(--rot); border-color: var(--rot); color: #fff; }
.einfach-rot:hover { background: var(--rot-dunkel); border-color: var(--rot-dunkel); }
.einfach-gelb {
  background: var(--gelb-grund);
  border-color: var(--gelb-rand);
  color: var(--gelb-rand);
}
.einfach-gelb:hover { background: #f5e7b8; border-color: var(--gelb-rand); }
.einfach-teil {
  flex: 2 1 13em;
  display: flex;
  gap: 0.5rem;
}
.einfach-teil input {
  width: 5.5em;
  font-size: 1.1em;
  text-align: center;
  border: 1px solid var(--linie-stark);
  border-radius: var(--radius-klein);
  padding: 0.4em;
}
.einfach-teil .einfach-knopf { flex: 1; }

/* ---------- Dunkelmodus (pro Benutzer zuschaltbar) ----------
   Helle Schrift auf dunklem Grund; Kontraste bewusst hoch gewählt.
   Die Druckansicht bleibt immer Schwarz auf Weiß (siehe @media print). */

body.dunkel {
  color-scheme: dark; /* dunkle Datums-/Zahlenfelder u. a. vom Browser */
  --aktion: #49566b;
  --aktion-hover: #58667e;
  --tinte: #e9ebee;
  --tinte-leise: #9aa4b2;
  --papier: #101317;
  --karte: #181c21;
  --linie: #262b32;
  --linie-stark: #39404a;
  --rot: #c9313d;
  --rot-dunkel: #e0525e;
  --gruen: #63c288;
  --gelb-grund: #322908;
  --gelb-rand: #e6c655;
  --blau: #6db3e8;
  --fokus: #7fb2e5;
  --schatten: none;
}
body.dunkel .sprungmarke { background: var(--karte); color: var(--tinte); }
body.dunkel .hauptnav a[aria-current="page"] { background: #232932; }
body.dunkel .nav-zahl { background: #12293a; color: #7cc4ea; }
body.dunkel tbody tr:hover { background: #1d2229; }
body.dunkel input[type="text"], body.dunkel input[type="password"],
body.dunkel input[type="email"], body.dunkel input[type="date"],
body.dunkel input[type="number"], body.dunkel input[type="search"],
body.dunkel input[type="url"], body.dunkel select, body.dunkel textarea,
body.dunkel .einfach-teil input,
body.dunkel .schnell-aufgabe input[type="text"], body.dunkel .schnell-aufgabe select {
  background: #12161a;
}
body.dunkel input:focus, body.dunkel select:focus, body.dunkel textarea:focus {
  box-shadow: 0 0 0 3px rgba(127, 178, 229, 0.2);
}
body.dunkel .knopf-zweit { background: var(--karte); color: var(--tinte); border-color: var(--linie-stark); }
body.dunkel .knopf-zweit:hover { background: #22272e; color: var(--tinte); }
body.dunkel .meldung-ok { background: #12301d; color: #7fd69a; }
body.dunkel .meldung-fehler { background: #38141a; color: #ff9ba3; }
body.dunkel .badge-gruen { background: #12301d; color: #7fd69a; }
body.dunkel .badge-rot { background: #38141a; color: #ff9ba3; }
body.dunkel .badge-gelb { background: #322908; color: #e6c655; }
body.dunkel .badge-blau { background: #12293a; color: #7cc4ea; }
body.dunkel .badge-grau { background: #262b32; color: #aab2bd; }
body.dunkel .drop-zone.aktiv { background: #12293a; }
body.dunkel .einfach-gruen { background: #1e6b34; border-color: #1e6b34; color: #fff; }
body.dunkel .einfach-gruen:hover { background: #248041; border-color: #248041; }
body.dunkel .einfach-gelb:hover { background: #443a12; }

/* ---------- Fußzeile ---------- */

.fuss {
  border-top: 1px solid var(--linie);
  color: var(--tinte-leise);
  font-size: 0.85em;
  text-align: center;
  padding: 1.1rem;
}

/* ---------- Anmeldeseite ---------- */

.login-kasten {
  max-width: 400px;
  margin: 10vh auto;
  padding: 1.6rem 1.8rem;
}
.login-marke {
  justify-content: center;
  margin: 0.2rem 0 1.3rem;
  color: var(--tinte-leise);
  font-size: 0.98em;
}
.login-kasten .knopf { width: 100%; text-align: center; padding: 0.6em; }

/* ---------- Mobile Ansicht (Handy) ---------- */

@media (max-width: 700px) {
  .kopf-innen { padding: 0.5rem 0.8rem; gap: 0.4rem 1rem; }
  /* Seitenleiste wird zum kompakten Kopfbereich */
  .rahmen { display: block; }
  .seitenleiste {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    border-right: none;
    border-bottom: 1px solid var(--linie);
    gap: 0.7rem;
  }
  .seitenleiste .marke { border-bottom: none; padding-bottom: 0; }
  /* Gruppen fließen am Handy zu einer Zeile zusammen */
  .seitenleiste nav { display: flex; flex-wrap: wrap; gap: 0.15rem; }
  .nav-gruppe { margin-bottom: 0; display: contents; }
  .nav-gruppe-titel { display: none; }
  .seitenleiste .hauptnav {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .seitenleiste .hauptnav a { padding: 0.5em 0.55em; font-size: 0.95em; }
  .seitenleiste .schnell-aufgabe {
    flex-direction: row;
    margin-top: 0;
    padding-top: 0.6rem;
  }
  .schnell-aufgabe input[type="text"] { flex: 2 1 12em; width: auto; }
  .schnell-aufgabe select { flex: 0 1 auto; width: auto; }
  .leiste-fuss { padding-top: 0.5rem; }
  .inhalt { padding: 0.9rem 0.8rem 2.5rem; }
  .karte { padding: 0.85rem 0.9rem; }
  .feldzeile { grid-template-columns: 1fr; }
  /* Fingerfreundliche Knöpfe */
  .knopf { padding: 0.65em 1.1em; }
  .knopf-klein { padding: 0.35em 0.8em; }
}

/* ---------- Druckansicht (Schwarz-Weiß, große Schrift, Kästchen) ---------- */

@media print {
  .kopf, .fuss, .kein-druck, .sprungmarke, .seitenleiste, script { display: none !important; }
  /* Auch im Dunkelmodus wird immer Schwarz auf Weiß gedruckt */
  body, body.dunkel { background: #fff; color: #000; font-size: 14pt; color-scheme: light; }
  body.dunkel input, body.dunkel select, body.dunkel textarea { background: #fff; color: #000; }
  .inhalt { max-width: 100%; padding: 0; }
  .karte, .tabellen-rahmen { box-shadow: none; border: none; }
  table, th, td { border: 1.5pt solid #000 !important; background: #fff !important; color: #000 !important; }
  th { text-transform: none; font-size: inherit; letter-spacing: 0; }
  .badge { background: none !important; color: #000 !important; }
  a { color: #000; text-decoration: none; }
}

.druck-kaestchen {
  display: inline-block;
  width: 1.1em;
  height: 1.1em;
  border: 2pt solid #000;
  vertical-align: middle;
}