/* ============================================================
   Legehennenbetrieb — gemeinsames Stylesheet
   Wird von allen Seiten eingebunden. Seiten-spezifische Regeln
   stehen ganz unten in eigenen Abschnitten.
   ============================================================ */

:root{
  --bg: #F6F3EA; --surface: #FFFFFF; --surface-sunken: #EFEAD9;
  --ink: #23271D; --ink-soft: #706C58; --ink-faint: #9A9683; --line: #E1DBC5;
  --green: #33512E; --green-dark: #2A4326; --green-soft: #E4EBDD;
  --gold: #D69A1F; --gold-soft: #FBF0D9;
  --rust: #B8451D; --rust-soft: #F8E2D6;
  --clay: #9C7A54; --sky: #4E7787;
  --radius-s: 8px; --radius-m: 14px; --radius-l: 20px;
  --shadow: 0 1px 2px rgba(35,39,29,0.04), 0 8px 24px -12px rgba(35,39,29,0.12);
}

*{ box-sizing: border-box; }
html, body{ margin:0; padding:0; }
body{
  background: var(--bg); color: var(--ink);
  font-family: 'Inter', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased; min-height: 100vh;
}
h1,h2,h3,.font-display{ font-family:'Fraunces', serif; font-weight:580; letter-spacing:-0.01em; }
.mono{ font-family:'IBM Plex Mono', monospace; }
a{ color: inherit; text-decoration: none; }
button{ font-family: inherit; }
:focus-visible{ outline: 2px solid var(--green); outline-offset: 2px; border-radius: 4px; }

@media (prefers-reduced-motion: reduce){
  *{ transition: none !important; animation: none !important; }
}

/* ---------- Grundgerüst ---------- */
.shell{ display: grid; grid-template-columns: 248px 1fr; min-height: 100vh; }

.sidebar{
  background: var(--surface-sunken); border-right: 1px solid var(--line);
  padding: 24px 16px 16px; display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.brand{ display:flex; align-items:center; gap:10px; padding: 4px 8px 22px; }
.brand-mark{ width:30px; height:30px; border-radius:9px; background: var(--green);
  display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.brand-mark svg{ width:16px; height:16px; }
.brand-name{ font-family:'Fraunces',serif; font-weight:580; font-size:17px; line-height:1.1; }
.brand-sub{ font-size:11px; color: var(--ink-faint); letter-spacing:.03em; }

.nav-group{ margin-bottom: 18px; }
.nav-label{ font-size:11px; text-transform:uppercase; letter-spacing:.08em;
  color: var(--ink-faint); padding: 0 10px 6px; font-weight:600; }
.nav-item{ display:flex; align-items:center; gap:10px; padding: 9px 10px;
  border-radius: var(--radius-s); font-size:14px; font-weight:500; color: var(--ink-soft);
  cursor:pointer; transition: background .12s ease, color .12s ease; position:relative; }
.nav-item svg{ width:17px; height:17px; flex-shrink:0; opacity:.8; }
.nav-item:hover{ background: rgba(51,81,46,0.07); color: var(--ink); }
.nav-item.active{ background: var(--green); color:#F6F3EA; }
.nav-item.active svg{ opacity:1; }
.nav-item.soon{ color: var(--ink-faint); }
.nav-soon-dot{ margin-left:auto; width:5px; height:5px; border-radius:50%;
  background: var(--line); flex-shrink:0; }

.nav-user{ margin-top:auto; padding-top:14px; border-top:1px solid var(--line); }
.nav-user-row{ display:flex; align-items:center; gap:10px; padding: 6px 8px 10px; }
.nav-avatar{ width:30px; height:30px; border-radius:50%; background: var(--green-soft);
  color: var(--green); display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; flex-shrink:0; }
.nav-user-name{ font-size:13px; font-weight:600; line-height:1.2; }
.nav-user-rolle{ font-size:11px; color: var(--ink-faint); text-transform:capitalize; }
.btn-logout{ width:100%; border:1px solid var(--line); background: transparent;
  border-radius: var(--radius-s); padding: 8px 10px; font-size:13px; font-weight:600;
  color: var(--ink-soft); cursor:pointer; display:flex; align-items:center; gap:8px; }
.btn-logout:hover{ background: var(--surface); color: var(--rust); border-color: var(--rust-soft); }
.btn-logout svg{ width:15px; height:15px; }

.main{ padding: 30px 40px 60px; max-width: 1200px; min-width: 0; }
.topline{ display:flex; justify-content:space-between; align-items:flex-end;
  margin-bottom: 22px; gap: 20px; flex-wrap: wrap; }
.eyebrow{ font-size:12px; color: var(--ink-faint); font-weight:600;
  text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; }
.page-title{ font-size:26px; margin:0; }
.page-sub{ font-size:13px; color: var(--ink-faint); margin-top:6px; }

/* ---------- Bausteine ---------- */
.kpi-row{ display:grid; grid-template-columns: repeat(4, 1fr); gap:14px; margin-bottom:24px; }
.kpi-card{ background: var(--surface); border:1px solid var(--line); border-radius: var(--radius-m);
  padding: 16px 18px; box-shadow: var(--shadow); }
.kpi-label{ font-size:12.5px; color: var(--ink-soft); margin-bottom:8px; }
.kpi-value{ font-family:'IBM Plex Mono',monospace; font-size:22px; font-weight:600;
  display:flex; align-items:baseline; gap:6px; }
.kpi-unit{ font-size:13px; color: var(--ink-faint); font-weight:400; }
/* Vergleichszeile unter dem Kennwert, z.B. Durchschnitt der abgeschlossenen
   Durchgaenge. Bleibt leer, wenn es keinen Vergleichswert gibt. */
.kpi-note{ font-size:11.5px; color: var(--ink-faint); margin-top:6px;
  line-height:1.5; }
/* Aufklappknopf vor einer Hauptposition. Bewusst schmal, damit die Zeile
   ihre Ausrichtung behaelt. */
.aufklapp{ min-width:24px; padding:1px 6px;
  font-family:'IBM Plex Mono',monospace; font-weight:600; margin-right:4px; }
.unterposition td{ background: rgba(0,0,0,.025); }
/* Sortierbarer Spaltenkopf: sieht aus wie die Ueberschrift, verhaelt sich
   wie ein Knopf. */
.sortkopf{ background:none; border:0; padding:0; font:inherit; color:inherit;
  cursor:pointer; text-align:inherit; }
.sortkopf:hover{ text-decoration:underline; }
/* Liniendiagramme. Handgezeichnetes SVG - fuer vier Kurven lohnt keine
   Bibliothek, und die Anwendung bleibt ohne fremde Skripte. */
.diagramm{ margin-top:16px; color: var(--ink); }
.diagramm svg{ width:100%; height:260px; display:block; }
.diag-legende{ display:flex; flex-wrap:wrap; gap:16px; align-items:center;
  margin-top:10px; font-size:12.5px; color: var(--ink-soft); }
.diag-legende-eintrag{ display:inline-flex; align-items:center; gap:7px; }
.diag-strich{ width:18px; height:3px; border-radius:2px; display:inline-block; }
.diag-einheit{ margin-left:auto; color: var(--ink-faint); font-size:11.5px; }
@media (max-width: 700px){ .diagramm svg{ height:200px; } }

.card{ background: var(--surface); border:1px solid var(--line); border-radius: var(--radius-l);
  box-shadow: var(--shadow); padding: 22px 24px; margin-bottom: 20px; }
.card-head{ display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.card-head-left{ display:flex; align-items:center; gap:10px; }
.card-head .ic{ width:32px; height:32px; border-radius:9px; background: var(--surface-sunken);
  display:flex; align-items:center; justify-content:center; color: var(--green); flex-shrink:0; }
.card-head .ic svg{ width:16px; height:16px; }
.card-title{ font-size:15.5px; margin:0; }
.card-sub{ font-size:12px; color: var(--ink-faint); margin-top:1px; }

.field-grid{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap:14px; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-size:12px; font-weight:600; color: var(--ink-soft); }
.field input{ width:100%; font-family:'IBM Plex Mono',monospace; font-size:14px; font-weight:500;
  color: var(--ink); border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); padding: 9px 11px; }
.field input.text{ font-family:'Inter', sans-serif; font-weight:400; }
.field input:focus{ border-color: var(--green); box-shadow: 0 0 0 3px var(--green-soft); outline:none; }

.form-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }
.btn{ font-size:13.5px; font-weight:600; border-radius: var(--radius-s);
  padding: 10px 18px; cursor:pointer; border:1px solid transparent; }
.btn:disabled{ opacity:.55; cursor:default; }
.btn-ghost{ background: transparent; border-color: var(--line); color: var(--ink-soft); }
.btn-ghost:hover:not(:disabled){ background: var(--surface-sunken); }
.btn-primary{ background: var(--green); color:#F6F3EA; }
.btn-primary:hover:not(:disabled){ background: var(--green-dark); }
.btn-small{ font-size:12.5px; font-weight:600; border-radius: var(--radius-s);
  padding: 7px 13px; cursor:pointer; border:1px solid var(--line);
  background: var(--surface); color: var(--ink-soft); }
.btn-small:hover:not(:disabled){ background: var(--surface-sunken); }
.btn-small:disabled{ opacity:.55; cursor:default; }

/* Meldungen */
.notice{ border-radius: var(--radius-s); padding: 11px 14px; font-size:13px; margin-bottom:16px; }
.notice-error{ background: var(--rust-soft); color: var(--rust); }
.notice-info{ background: var(--surface-sunken); color: var(--ink-soft); }
.notice-ok{ background: var(--green-soft); color: var(--green); }

.empty-state{ background: var(--surface); border:1.5px dashed var(--line);
  border-radius: var(--radius-l); padding: 40px 30px; text-align:center; }
.empty-state h3{ font-size:16px; margin: 0 0 6px; }
.empty-state p{ font-size:13.5px; color: var(--ink-faint); margin: 0 0 18px; max-width: 430px;
  margin-left:auto; margin-right:auto; line-height:1.55; }

.skeleton{ background: var(--surface); border:1px solid var(--line);
  border-radius: var(--radius-l); padding: 26px; color: var(--ink-faint); font-size:13.5px; }

/* Toast */
.toast{ position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%);
  background: var(--ink); color: var(--bg); font-size:13px; font-weight:500;
  padding: 11px 18px; border-radius: 30px; box-shadow: var(--shadow); z-index: 60; }
.toast.error{ background: var(--rust); }

/* ---------- Ställe ---------- */
.stall-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(300px,1fr));
  gap:16px; margin-bottom: 30px; }
.stall-card{ background: var(--surface); border:1px solid var(--line);
  border-radius: var(--radius-l); box-shadow: var(--shadow); padding: 20px 22px; }
.stall-top{ display:flex; align-items:flex-start; justify-content:space-between;
  gap:10px; margin-bottom:16px; }
.stall-title-block{ display:flex; align-items:center; gap:12px; }
.stall-icon{ width:40px; height:40px; border-radius:11px; background: var(--surface-sunken);
  color: var(--green); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stall-icon svg{ width:20px; height:20px; }
.stall-name{ font-size:17px; margin:0; }
.stall-standort{ font-size:12px; color: var(--ink-faint); margin-top:2px; }
.status-pill{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  padding:4px 10px; border-radius:20px; white-space:nowrap; }
.status-pill.belegt{ background: var(--green-soft); color: var(--green); }
.status-pill.leer{ background: var(--surface-sunken); color: var(--ink-soft); }

.capacity-bar-wrap{ height:10px; border-radius:6px; background: var(--surface-sunken);
  overflow:hidden; margin-bottom:8px; }
.capacity-bar{ height:100%; background: var(--green); border-radius:6px 0 0 6px; }
.capacity-bar.leer{ background: var(--line); }
.capacity-label{ display:flex; justify-content:space-between; font-size:12px;
  color: var(--ink-soft); margin-bottom:16px; }
.capacity-label .v{ font-family:'IBM Plex Mono',monospace; font-weight:600; color: var(--ink); }

.stall-info{ display:flex; flex-direction:column; gap:8px; padding-top:14px;
  border-top:1px solid var(--line); font-size:13px; }
.stall-info-row{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.stall-info-row .k{ color: var(--ink-soft); }
.stall-info-row .v{ font-family:'IBM Plex Mono',monospace; font-weight:600; }
.stall-info-row .v.plain{ font-family:'Inter',sans-serif; }

.stall-empty-note{ font-size:12.5px; color: var(--ink-faint); font-style:italic;
  padding-top:14px; border-top:1px solid var(--line); }

.inline-edit{ display:flex; align-items:center; gap:6px; }
.inline-edit input{ width:82px; font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  border:1px solid var(--line); border-radius:6px; padding:4px 7px; }
.inline-edit input:focus{ border-color: var(--green); outline:none; }
.edit-icon-btn{ border:none; background:transparent; color: var(--ink-faint);
  cursor:pointer; padding:3px; border-radius:5px; display:flex; }
.edit-icon-btn:hover{ background: var(--surface-sunken); color: var(--green); }
.edit-icon-btn svg{ width:13px; height:13px; }
[hidden]{ display:none !important; }

/* ---------- Login ---------- */
body.login-page{ display:flex; align-items:center; justify-content:center;
  min-height:100vh; padding: 24px; }
.login-card{ background: var(--surface); border:1px solid var(--line);
  border-radius: var(--radius-l); box-shadow: var(--shadow);
  padding: 36px 34px; width:100%; max-width:380px; }
.login-card .brand{ padding: 0 0 26px; }
.login-card .brand-mark{ width:34px; height:34px; border-radius:10px; }
.login-card .brand-mark svg{ width:18px; height:18px; }
.login-card .brand-name{ font-size:18px; }
.login-card h1{ font-size:20px; margin: 0 0 6px; }
.login-card .sub{ font-size:13px; color: var(--ink-faint); margin-bottom:24px; }
.login-card .field{ margin-bottom:16px; }
.login-card .field label{ font-size:12.5px; }
.login-card .field input{ font-family:'Inter', sans-serif; font-weight:400;
  font-size:14px; padding: 11px 12px; }
.btn-login{ width:100%; margin-top:8px; padding:12px; border:none;
  border-radius: var(--radius-s); background: var(--green); color:#F6F3EA;
  font-weight:600; font-size:14px; cursor:pointer; }
.btn-login:hover:not(:disabled){ background: var(--green-dark); }
.btn-login:disabled{ opacity:.6; cursor:default; }

/* ---------- Responsiv ---------- */
@media (max-width: 1100px){ .kpi-row{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 900px){
  .shell{ grid-template-columns: 76px 1fr; }
  .brand-name, .brand-sub, .nav-label, .nav-item span,
  .nav-user-text, .btn-logout span{ display:none; }
  .nav-item{ justify-content:center; }
  .nav-soon-dot{ position:absolute; margin-left:0; transform: translate(11px,-9px); }
  .nav-user-row{ justify-content:center; }
  .btn-logout{ justify-content:center; }
  .main{ padding: 24px 18px 50px; }
}
@media (max-width: 620px){
  .field-grid{ grid-template-columns: 1fr; }
  .kpi-row{ grid-template-columns: 1fr; }
}

/* ---------- Dialoge (Einstallen / Ausstallen) ---------- */
dialog{ border:1px solid var(--line); border-radius: var(--radius-l); padding:0;
  background: var(--surface); color: var(--ink); box-shadow: 0 24px 60px -20px rgba(35,39,29,.35);
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100vh - 40px); overflow: hidden; }
/* display gehört ausdrücklich an [open]: ein geschlossener Dialog ist vom
   Browser aus display:none, und eine Regel auf "dialog" allein würde das
   überschreiben - dann stünden alle Dialoge dauerhaft offen. */
dialog[open]{ display: flex; flex-direction: column; }
dialog > form{ display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.dialog-body{ overflow-y: auto; min-height: 0; flex: 1; }
.dialog-head, .dialog-foot{ flex-shrink: 0; }
.dialog-foot{ border-top: 1px solid var(--line); background: var(--surface); }
dialog::backdrop{ background: rgba(35,39,29,.42); }
.dialog-head{ padding: 22px 24px 0; }
.dialog-head h2{ font-size:18px; margin:0; }
.dialog-head .sub{ font-size:12.5px; color: var(--ink-faint); margin-top:4px; }
.dialog-body{ padding: 18px 24px 0; }
.dialog-foot{ display:flex; justify-content:flex-end; gap:10px; padding: 20px 24px 22px; }
.dialog-body .field-grid{ grid-template-columns: 1fr 1fr; }
.dialog-body .field-grid.voll{ grid-template-columns: 1fr; }
.hinweis{ font-size:12.5px; color: var(--ink-soft); background: var(--surface-sunken);
  border-radius: var(--radius-s); padding: 10px 12px; margin-top:14px; line-height:1.5; }

/* ---------- Tabelle (abgeschlossene Durchgänge) ---------- */
.tabelle-wrap{ overflow-x:auto; }
table.liste{ width:100%; border-collapse: collapse; font-size:13px; }
table.liste th{ text-align:left; font-size:11.5px; text-transform:uppercase;
  letter-spacing:.05em; color: var(--ink-faint); font-weight:600;
  padding: 0 12px 9px; white-space:nowrap; }
table.liste td{ padding: 11px 12px; border-top:1px solid var(--line); white-space:nowrap; }
table.liste td.num{ font-family:'IBM Plex Mono',monospace; text-align:right; }
table.liste th.num{ text-align:right; }
table.liste tbody tr:hover{ background: var(--surface-sunken); }

/* ---------- Durchgangs-Karte ---------- */
.dg-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(340px,1fr)); gap:16px; }
.dg-card{ background: var(--surface); border:1px solid var(--line);
  border-radius: var(--radius-l); box-shadow: var(--shadow); padding: 20px 22px; }
.dg-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.dg-stall{ font-family:'Fraunces',serif; font-weight:580; font-size:17px; }
.dg-rasse{ font-size:12px; color: var(--ink-faint); margin-top:2px; }
.dg-woche{ font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:600;
  background: var(--green-soft); color: var(--green); padding:4px 10px; border-radius:20px;
  white-space:nowrap; }
.dg-kennzahlen{ display:grid; grid-template-columns: repeat(3,1fr); gap:10px;
  margin: 18px 0; padding: 14px 0; border-top:1px solid var(--line);
  border-bottom:1px solid var(--line); }
.dg-kz-label{ font-size:11px; color: var(--ink-faint); margin-bottom:3px; }
.dg-kz-wert{ font-family:'IBM Plex Mono',monospace; font-size:15px; font-weight:600; }
.dg-zeilen{ display:flex; flex-direction:column; gap:7px; font-size:12.5px; }
.dg-zeile{ display:flex; justify-content:space-between; gap:8px; }
.dg-zeile .k{ color: var(--ink-soft); }
.dg-zeile .v{ font-family:'IBM Plex Mono',monospace; font-weight:600; }
.dg-zeile .v.plain{ font-family:'Inter',sans-serif; font-weight:500; }
.dg-aktionen{ display:flex; gap:8px; margin-top:16px; }
.warnhinweis{ font-size:12px; color: var(--rust); background: var(--rust-soft);
  border-radius: var(--radius-s); padding: 8px 11px; margin-top:14px; }

.abschnitt-titel{ font-family:'Fraunces',serif; font-weight:580; font-size:17px;
  margin: 30px 0 14px; }
.abschnitt-titel:first-child{ margin-top:0; }

@media (max-width: 620px){
  .dialog-body .field-grid{ grid-template-columns: 1fr; }
  .dg-kennzahlen{ grid-template-columns: 1fr 1fr; }
}

/* ---------- Tageserfassung ---------- */
.tag-kopf{ display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap;
  margin-bottom:20px; }
.tag-kopf .field{ gap:5px; }
.tag-kopf select, .tag-kopf input[type=date]{ font-family:'Inter',sans-serif;
  font-size:14px; padding:9px 11px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); color: var(--ink); }
.tag-nav{ display:flex; gap:6px; align-items:center; }
.tag-nav button{ width:36px; height:38px; border:1px solid var(--line);
  background: var(--surface); border-radius: var(--radius-s); cursor:pointer;
  font-size:16px; color: var(--ink-soft); }
.tag-nav button:hover:not(:disabled){ background: var(--surface-sunken); }
.tag-nav button:disabled{ opacity:.4; cursor:default; }
.wochentag{ font-size:12px; color: var(--ink-faint); margin-top:5px; }

.erfassung-layout{ display:grid; grid-template-columns: 1.35fr 1fr; gap:20px;
  align-items:start; }
.eingabe-gruppe{ margin-bottom:20px; }
.eingabe-gruppe:last-of-type{ margin-bottom:0; }
.gruppe-titel{ font-size:12px; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; color: var(--ink-faint); margin-bottom:10px; }
.eingabe-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.eingabe-grid input{ font-family:'IBM Plex Mono',monospace; font-size:16px;
  font-weight:500; padding:11px 12px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); width:100%; }
.eingabe-grid input:focus{ border-color: var(--green);
  box-shadow:0 0 0 3px var(--green-soft); outline:none; }
.feld-hilfe{ font-size:11px; color: var(--ink-faint); margin-top:3px; }

.rechenwert{ display:flex; justify-content:space-between; align-items:baseline;
  gap:10px; padding:9px 0; border-bottom:1px solid var(--line); font-size:13px; }
.rechenwert:last-child{ border-bottom:none; }
.rechenwert .k{ color: var(--ink-soft); }
.rechenwert .v{ font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:14px; }
.rechenwert .soll{ font-size:11px; color: var(--ink-faint); font-weight:400;
  font-family:'Inter',sans-serif; }
.abw-gut{ color: var(--green); }
.abw-schlecht{ color: var(--rust); }

.abholung-zeile{ display:flex; justify-content:space-between; align-items:center;
  gap:10px; padding:9px 0; border-bottom:1px solid var(--line); font-size:13px; }
.abholung-zeile:last-of-type{ border-bottom:none; }

tr.luecke td{ background: var(--gold-soft); }
tr.luecke td:first-child::after{ content:' ⚠'; color: var(--gold); }
tr.aktiv td{ background: var(--green-soft); }
table.liste tbody tr{ cursor:pointer; }

@media (max-width: 1000px){ .erfassung-layout{ grid-template-columns:1fr; } }
@media (max-width: 620px){ .eingabe-grid{ grid-template-columns:1fr; } }

/* ---------- Lieferscheine in der Tageserfassung ---------- */
.ls-eintrag{ padding: 12px 0; border-bottom: 1px solid var(--line); }
.ls-eintrag:last-of-type{ border-bottom: none; padding-bottom: 0; }
.ls-kopf{ display:flex; justify-content:space-between; align-items:baseline;
  gap:10px; margin-bottom:6px; }
.ls-nummer{ font-size:13px; font-weight:600; }
.ls-abnehmer{ font-weight:400; color: var(--ink-faint); }
.ls-summe{ font-family:'IBM Plex Mono',monospace; font-size:15px; font-weight:600; }
.ls-klassen{ display:flex; gap:18px; font-size:12.5px; color: var(--ink-soft);
  margin-bottom:9px; }
.ls-klassen b{ font-family:'IBM Plex Mono',monospace; color: var(--ink); }
.ls-aktionen{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.ls-aktionen .feld-hilfe{ margin-top:0; }

.field input[type=file]{ font-family:'Inter',sans-serif; font-size:13px;
  padding: 9px 11px; border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); width:100%; }
.field input[type=file]::file-selector-button{ font-family:'Inter',sans-serif;
  font-size:12.5px; font-weight:600; margin-right:10px; padding:6px 12px;
  border:1px solid var(--line); border-radius:6px; background: var(--surface-sunken);
  color: var(--ink-soft); cursor:pointer; }

/* Mengentabelle im Lieferschein-Dialog */
table.mengen-tabelle{ width:100%; border-collapse:collapse; margin-top:4px; }
table.mengen-tabelle th{ font-size:11.5px; text-transform:uppercase;
  letter-spacing:.05em; color: var(--ink-faint); font-weight:600;
  text-align:left; padding:0 8px 7px 0; }
table.mengen-tabelle th.num, table.mengen-tabelle td.num{ text-align:right; }
table.mengen-tabelle tbody th{ text-transform:none; letter-spacing:0;
  font-size:13px; color: var(--ink); font-weight:600; padding-right:12px;
  white-space:nowrap; }
table.mengen-tabelle td{ padding: 4px 8px 4px 0; }
table.mengen-tabelle td:last-child{ padding-right:0; }
table.mengen-tabelle input{ width:100%; min-width:70px;
  font-family:'IBM Plex Mono',monospace; font-size:15px; padding:9px 10px;
  border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); }
table.mengen-tabelle input:focus{ border-color: var(--green);
  box-shadow:0 0 0 3px var(--green-soft); outline:none; }
table.mengen-tabelle td.num{ font-family:'IBM Plex Mono',monospace;
  font-size:14px; font-weight:600; white-space:nowrap; }
table.mengen-tabelle tfoot th{ text-transform:none; letter-spacing:0;
  font-size:13px; color: var(--ink); padding-top:10px;
  border-top:1px solid var(--line); }
table.mengen-tabelle tfoot td{ font-family:'IBM Plex Mono',monospace;
  font-size:16px; font-weight:700; padding-top:10px;
  border-top:1px solid var(--line); text-align:right; }
.ls-pal{ color: var(--ink-faint); font-family:'Inter',sans-serif; font-weight:400; }

/* ---------- Termine & Maßnahmen ---------- */
.steuerleiste{ display:flex; gap:16px; align-items:flex-end; flex-wrap:wrap;
  margin-bottom:18px; }
.steuerleiste select{ font-family:'Inter',sans-serif; font-size:14px;
  padding:9px 11px; border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); color: var(--ink); }

.ansicht-wahl{ display:inline-flex; background: var(--surface-sunken);
  border:1px solid var(--line); border-radius: var(--radius-s); padding:3px; }
.ansicht-wahl button{ border:none; background:transparent; font-size:13.5px;
  font-weight:600; color: var(--ink-soft); padding:7px 16px;
  border-radius:6px; cursor:pointer; }
.ansicht-wahl button.aktiv{ background: var(--surface); color: var(--ink);
  box-shadow:0 1px 2px rgba(35,39,29,.08); }

/* Kategoriefarben */
.kat-untersuchung{ --kat: var(--sky); --kat-soft: #E2EDF1; }
.kat-behandlung{ --kat: var(--rust); --kat-soft: var(--rust-soft); }
.kat-prophylaxe{ --kat: var(--green); --kat-soft: var(--green-soft); }
.kat-stallarbeit{ --kat: #7A6A4F; --kat-soft: #EDE7DA; }
.kat-sonstiges{ --kat: var(--clay); --kat-soft: #EFE6DA; }

/* Kalender */
.kal-kopf{ display:flex; align-items:center; gap:8px; margin-bottom:14px;
  flex-wrap:wrap; }
.kal-monat{ font-family:'Fraunces',serif; font-weight:580; font-size:17px;
  min-width:170px; }
.kal-legende{ margin-left:auto; display:flex; align-items:center; gap:6px;
  font-size:11.5px; color: var(--ink-faint); flex-wrap:wrap; }
.legende-punkt{ width:9px; height:9px; border-radius:3px; background: var(--kat);
  display:inline-block; margin-left:8px; }
.legende-punkt:first-child{ margin-left:0; }

.kal-wochentage{ display:grid; grid-template-columns: repeat(7,1fr); gap:4px;
  margin-bottom:4px; }
.kal-wochentage div{ font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:.06em; color: var(--ink-faint); padding:0 4px; }

.kal-raster{ display:grid; grid-template-columns: repeat(7,1fr); gap:4px; }
.kal-tag{ min-height:92px; background: var(--surface); border:1px solid var(--line);
  border-radius:9px; padding:5px; display:flex; flex-direction:column; gap:3px; }
.kal-tag.fremd{ background: var(--bg); opacity:.55; }
.kal-tag.heute{ border-color: var(--green); box-shadow:0 0 0 2px var(--green-soft); }
.kal-tag.sperre{ background: var(--gold-soft); }
.kal-tagzahl{ font-family:'IBM Plex Mono',monospace; font-size:12px;
  font-weight:600; color: var(--ink-soft); padding-left:2px; }
.kal-tag.heute .kal-tagzahl{ color: var(--green); }
.kal-chips{ display:flex; flex-direction:column; gap:3px; }

.chip{ text-align:left; border:none; cursor:pointer; width:100%;
  background: var(--kat-soft); color: var(--kat);
  border-left:3px solid var(--kat); border-radius:5px;
  padding:4px 6px; font-size:11.5px; font-weight:600; line-height:1.25;
  font-family:'Inter',sans-serif; }
.chip:hover{ filter: brightness(.96); }
.chip-alarm{ box-shadow: inset 0 0 0 1.5px var(--rust); }
.chip-stall{ display:block; font-weight:400; font-size:10.5px; opacity:.8; }

/* Mehrtaegiger Termin im Kalender.
   Er erscheint an jedem Tag seines Zeitraums, an jedem Tag mit Namen. Damit
   die Tage als ein Vorgang lesbar bleiben, wird daraus ein durchgehendes
   Band: kraeftig gefuellt, an den Innenkanten ohne Rundung, sodass die
   Zellen optisch zusammenwachsen. */
.chip-zeitraum{ background: var(--kat); color:#fff;
  border-left:none; border-radius:0; }
.chip-zeitraum .chip-stall{ color:#fff; opacity:.85; }
.chip-zeitraum.chip-start{ border-top-left-radius:5px;
  border-bottom-left-radius:5px; }
.chip-zeitraum.chip-ende{ border-top-right-radius:5px;
  border-bottom-right-radius:5px; }

/* Folgetage tragen den Namen etwas leiser, damit der erste Tag den
   Vorgang anfuehrt, ohne dass die Fortsetzung untergeht. */
.chip-zeitraum:not(.chip-start){ font-weight:500; opacity:.92; }

/* Zeitstrahl */
.zs-zeile{ display:grid; grid-template-columns: 14px 92px 130px 1fr 160px 1fr;
  gap:12px; align-items:center; width:100%; text-align:left; cursor:pointer;
  background:transparent; border:none; border-bottom:1px solid var(--line);
  padding:11px 2px; font-family:'Inter',sans-serif; font-size:13px;
  color: var(--ink); }
.zs-zeile:last-child{ border-bottom:none; }
.zs-zeile:hover{ background: var(--surface-sunken); }
.zs-punkt{ width:10px; height:10px; border-radius:3px; background: var(--kat); }
.zs-datum{ font-family:'IBM Plex Mono',monospace; font-weight:600; }
.zs-frist{ color: var(--ink-soft); }
.zs-name{ font-weight:600; }
.zs-stall{ color: var(--ink-soft); }
.zs-zusatz{ font-size:11.5px; color: var(--ink-faint); text-align:right; }

.verschieben-reihe{ display:flex; gap:8px; flex-wrap:wrap; }

/* Futterreichweite */
.futter-zeile{ display:grid;
  grid-template-columns: 1.4fr 100px 120px 150px 1fr; gap:12px;
  align-items:center; padding:10px 0; border-bottom:1px solid var(--line);
  font-size:13px; }
.futter-zeile:last-child{ border-bottom:none; }
.futter-name{ font-weight:600; }
.futter-wert{ font-family:'IBM Plex Mono',monospace; text-align:right;
  color: var(--ink-soft); }
.futter-wert.schmal{ font-size:12px; }
.futter-reichweite{ font-family:'IBM Plex Mono',monospace; font-weight:700;
  font-size:15px; text-align:right; }
.warn-gold{ color: var(--gold); }

/* Einrichtungsdialog */
dialog.breit{ width: min(900px, calc(100vw - 32px)); }
.einrichtung-form{ background: var(--surface-sunken); border-radius: var(--radius-m);
  padding:16px; margin-top:14px; }
.field-grid.drei{ grid-template-columns: repeat(3, 1fr); }

@media (max-width: 900px){
  .kal-tag{ min-height:70px; }
  .chip-stall{ display:none; }
  .zs-zeile{ grid-template-columns: 14px 1fr 1fr; row-gap:4px; }
  .zs-zusatz, .zs-frist{ display:none; }
  .futter-zeile{ grid-template-columns: 1fr 1fr; row-gap:4px; }
  .field-grid.drei{ grid-template-columns: 1fr 1fr; }
}

/* Futterbestellung */
.kat-futter{ --kat: var(--gold); --kat-soft: var(--gold-soft); }
.futter-zeile{ grid-template-columns: 1.3fr 95px 110px 130px 1.4fr 90px; }
.futter-bestellt{ font-size:12.5px; color: var(--green); font-weight:600; }
.futter-zeile .feld-hilfe{ margin-top:2px; }
@media (max-width: 900px){
  .futter-zeile{ grid-template-columns: 1fr 1fr; row-gap:4px; }
}

/* Auswahlkasten im Termin-Dialog */
.kasten-wahl{ display:flex; align-items:center; gap:9px; margin-top:14px;
  padding:10px 12px; background: var(--surface-sunken);
  border-radius: var(--radius-s); font-size:13px; color: var(--ink-soft);
  cursor:pointer; }
.kasten-wahl input{ width:16px; height:16px; accent-color: var(--green);
  cursor:pointer; }

/* Textfeld im Importdialog */
dialog textarea{ width:100%; font-family:'IBM Plex Mono',monospace; font-size:13px;
  line-height:1.5; padding:11px 12px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); color: var(--ink);
  resize:vertical; }
dialog textarea:focus{ border-color: var(--green);
  box-shadow:0 0 0 3px var(--green-soft); outline:none; }

table.liste tr[data-art]:hover{ background: var(--surface-sunken); }

/* Erledigte Maßnahmen und Vorschau im Kalender */
.chip-erledigt{ background: transparent; border-left-color: var(--line);
  color: var(--ink-faint); text-decoration: line-through; cursor: default; }
.chip-erledigt .chip-stall{ text-decoration: none; }
.chip-vorschau{ background: transparent; border:1px dashed var(--kat);
  border-left:3px solid var(--kat); color: var(--kat); opacity:.75; cursor: default; }
.kal-legende .legende-strich{ display:inline-block; width:14px; height:0;
  border-top:2px dashed var(--ink-faint); margin-left:10px; margin-right:4px;
  vertical-align:middle; }
.zs-zeile.zs-vorschau{ cursor:default; color: var(--ink-faint); }
.zs-zeile.zs-vorschau:hover{ background: transparent; }
.zs-zeile.zs-vorschau .zs-punkt{ background: transparent;
  border: 1.5px dashed var(--kat); }

/* Rollen-Kennzeichnung in der Nutzerverwaltung */
.rolle-pill{ font-size:11.5px; font-weight:700; padding:3px 9px; border-radius:20px;
  white-space:nowrap; text-transform:capitalize; }
.rolle-admin{ background: var(--rust-soft); color: var(--rust); }
.rolle-mitarbeiter{ background: var(--green-soft); color: var(--green); }
.rolle-berater{ background: #E2EDF1; color: var(--sky); }
.rolle-tageserfasser{ background: var(--surface-sunken); color: var(--ink-soft); }

/* Breite Auswertungsseiten dürfen mehr Platz nutzen */
.main.breit{ max-width: 1700px; }
td.nowrap, th.nowrap{ white-space: nowrap; }

/* Tabelle mit fixierter Kopfzeile und erster Spalte.
   Beim Scrollen bleiben Überschriften und Lebenswoche stehen - sonst weiß man
   in der Mitte einer breiten Tabelle nicht mehr, welche Spalte man ansieht. */
.tabelle-wrap.fixiert{ max-height: calc(100vh - 300px); overflow: auto; }
table.liste.fixiert thead th{ position: sticky; top: 0; z-index: 2;
  background: var(--surface); box-shadow: inset 0 -1px 0 var(--line); }
table.liste.fixiert tbody td:first-child,
table.liste.fixiert thead th:first-child{ position: sticky; left: 0; z-index: 1;
  background: var(--surface); box-shadow: inset -1px 0 0 var(--line); }
table.liste.fixiert thead th:first-child{ z-index: 3; }
/* Die fixierte Spalte behält ihren eigenen Hintergrund, deshalb muss die
   Zeilenmarkierung dort gesondert gesetzt werden. */
table.liste.fixiert tbody tr:hover td:first-child{ background: var(--surface-sunken); }
table.liste.fixiert tbody tr.luecke td:first-child{ background: var(--gold-soft); }

/* Gebinde-Eingabe für Tageserfasser */
table.mengen-tabelle.gebinde tbody th{ font-weight:500; }
table.mengen-tabelle.gebinde tbody th .ls-pal{ font-size:11.5px; }
table.mengen-tabelle.gebinde td:last-child{ min-width:80px; color: var(--ink-soft); }
table.mengen-tabelle.gebinde input{ font-size:17px; padding:11px 12px; }
table.mengen-tabelle.gebinde tfoot td{ font-size:18px; }

/* Lieferungen */
tr.offen td{ background: var(--gold-soft); }
table.liste tr.offen:hover td{ background: #F5E7C6; }
.ls-auswahl{ max-height: 240px; overflow-y: auto; display:flex;
  flex-direction:column; gap:4px; }
.ls-auswahl .kasten-wahl{ margin-top:0; padding:8px 11px; font-size:12.5px; }
#rePositionen input, #rePositionen select{ width:100%; min-width:72px;
  font-family:'IBM Plex Mono',monospace; font-size:13px; padding:7px 8px;
  border:1px solid var(--line); border-radius:6px; background: var(--surface); }
#rePositionen input:focus, #rePositionen select:focus{ border-color: var(--green);
  box-shadow:0 0 0 2px var(--green-soft); outline:none; }
#rePositionen td{ padding:5px 6px; }
#rePositionen tfoot th, #rePositionen tfoot td{ padding-top:12px;
  border-top:1px solid var(--line); font-family:'IBM Plex Mono',monospace;
  font-weight:700; }
#rePositionen tfoot th{ font-family:'Inter',sans-serif; text-transform:none;
  font-size:13px; color: var(--ink); }

/* ---------- Dashboard: Anstehendes ----------
   Zwei Karten nebeneinander (Futterbestellungen | Maßnahmen). Ab 1200px
   Breite untereinander, sonst wird jede Zeile zu schmal. */
.dash-spalten{ display:grid; grid-template-columns: 1fr 1fr; gap:16px;
  align-items:start; }
.dash-spalten > .card{ margin-bottom:4px; }
@media (max-width: 1200px){ .dash-spalten{ grid-template-columns: 1fr; } }

.dash-zeile{ display:grid; grid-template-columns: 10px 1fr auto; gap:11px;
  align-items:center; padding:11px 0; border-bottom:1px solid var(--line);
  font-size:13px; }
.dash-zeile:last-child{ border-bottom:none; }
.dash-punkt{ width:10px; height:10px; border-radius:3px;
  background: var(--kat, var(--clay)); flex-shrink:0; }
.dash-name{ font-weight:600; }
.dash-sub{ font-size:11.5px; color: var(--ink-faint); margin-top:2px; }
.dash-rechts{ display:flex; align-items:center; gap:10px; justify-self:end; }
.dash-frist{ font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  color: var(--ink-soft); white-space:nowrap; }
.dash-frist.dringend{ color: var(--rust); font-weight:700; }
.dash-frist.erledigt{ font-family:'Inter',sans-serif; font-size:12.5px;
  color: var(--green); font-weight:600; }
.dash-mehr{ font-size:12px; color: var(--ink-faint); padding-top:11px; }

/* Die Futterkarte trägt kat-futter, damit ihre Punkte golden sind. Ohne
   Kategorieklasse (Maßnahmen ohne bekannte Kategorie) bleibt es bei Clay. */
.card.kat-futter .dash-punkt{ background: var(--gold); }

@media (max-width: 700px){
  .dash-zeile{ grid-template-columns: 10px 1fr; row-gap:6px; }
  .dash-rechts{ grid-column: 2; justify-self:start; }
}

/* ---------- Belegungsplan ----------
   Zeitleiste je Stall. Die Namensspalte ist fest 200px breit, die Spur
   nimmt den Rest - so fluchten alle Zeilen untereinander. */
.bp-plan{ position:relative; overflow-x:hidden; }
.bp-zeile{ display:grid; grid-template-columns:200px 1fr; align-items:center;
  gap:0; min-height:44px; border-bottom:1px solid var(--line); }
.bp-zeile:last-child{ border-bottom:none; }
.bp-kopf{ min-height:28px; border-bottom:1px solid var(--line); }

.bp-name{ padding:8px 14px 8px 0; font-size:13px; font-weight:600; }
.bp-name-sub{ font-size:11px; font-weight:400; color:var(--ink-faint);
  margin-top:2px; }

.bp-spur{ position:relative; height:100%; min-height:44px; }
.bp-raster{ min-height:28px; }

.bp-monat{ position:absolute; top:0; bottom:0; border-left:1px solid var(--line); }
.bp-monat-text{ position:absolute; top:6px; left:5px; font-size:10.5px;
  color:var(--ink-faint); white-space:nowrap;
  font-family:'IBM Plex Mono',monospace; }


.bp-balken{ position:absolute; top:9px; height:26px; border-radius:5px;
  display:flex; align-items:center; padding:0 8px; overflow:hidden;
  font-size:11px; font-weight:600; color:#fff; white-space:nowrap; }
.bp-balken[data-plan]{ cursor:pointer; }
.bp-balken[data-plan]:hover{ filter:brightness(1.08); }
.bp-balken-text{ overflow:hidden; text-overflow:ellipsis; }

.bp-laufend{ background:var(--green); }
.bp-geplant{ background:var(--clay); opacity:.75;
  background-image:repeating-linear-gradient(45deg,
    rgba(255,255,255,.16) 0 6px, transparent 6px 12px); }
.bp-vorbei{ background:var(--ink-faint); opacity:.45; }

/* Leerstand liegt flacher und tiefer, damit er die Herdenbalken nicht
   verdeckt, wenn sich Ränder berühren. */
.bp-leer{ top:17px; height:10px; background:var(--line);
  border:1px solid var(--ink-faint); color:transparent; }
.bp-eng{ background:var(--rust); border-color:var(--rust); opacity:.65; }
.bp-konflikt{ outline:2px solid var(--rust); outline-offset:1px; }

/* Überlagerung für alles, was quer durch alle Stallzeilen laufen soll:
   Monatslinien und die Markierung für heute. Sie beginnt dort, wo die
   Namensspalte endet - dadurch stimmen die Prozentwerte mit denen der
   Balken überein, ohne dass in calc() Prozent mal Prozent gerechnet
   werden müsste (das ginge in CSS gar nicht). */
.bp-overlay{ position:absolute; left:200px; right:0; top:0; bottom:0;
  pointer-events:none; }
.bp-overlay .bp-linie{ position:absolute; top:0; bottom:0; width:1px;
  background:var(--line); }
.bp-heute{ position:absolute; top:0; bottom:0; width:2px;
  background:var(--rust); }
.bp-heute::after{ content:'heute'; position:absolute; top:-2px; left:4px;
  font-size:10px; font-weight:700; color:var(--rust);
  font-family:'IBM Plex Mono',monospace; }

.bp-legende{ display:flex; flex-wrap:wrap; gap:16px; margin-top:16px;
  padding-top:14px; border-top:1px solid var(--line);
  font-size:11.5px; color:var(--ink-soft); }
.bp-legende span{ display:flex; align-items:center; gap:6px; }
.bp-muster{ width:16px; height:10px; border-radius:3px; display:inline-block; }

@media (max-width: 800px){
  .bp-zeile{ grid-template-columns:130px 1fr; }
  .bp-overlay{ left:130px; }
  .bp-name{ font-size:12px; }
  .bp-balken-text{ display:none; }
}

/* ---------- Planungsrechnung ----------
   Dreispaltige Gegenüberstellung: was feststeht, was erwartet wird, Summe.
   Die mittlere Spalte ist die Annahme - sie wird optisch abgesetzt, damit
   auf einen Blick klar ist, welcher Teil der Zahl geraten ist. */
.pl-tabelle tr.gruppe th{ padding-top:18px; padding-bottom:6px;
  font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.06em; color:var(--ink-faint);
  border-bottom:1px solid var(--line); text-align:left; }
.pl-tabelle tr.gruppe:first-child th{ padding-top:4px; }

.pl-tabelle .pl-rest{ background:var(--surface-sunken); }
.pl-tabelle thead th.num:nth-child(5){
  background:var(--surface-sunken); }

.pl-tabelle .pl-betont{ font-weight:700; }
.pl-tabelle tr.summe td{ border-top:2px solid var(--ink);
  border-bottom:2px solid var(--ink); font-size:14px; }

.pl-tabelle td.unterposition{ padding-left:22px; color:var(--ink-soft);
  font-size:12.5px; }

/* Die Bezeichnung darf umbrechen - sonst bestimmt der längste Name die
   Breite der ganzen Tabelle. Sieben Zahlenspalten brauchen jeden Pixel,
   deshalb etwas weniger Innenabstand als in anderen Tabellen. */
.pl-tabelle td:first-child{ white-space:normal; min-width:130px; }
.pl-tabelle td, .pl-tabelle th{ padding-left:8px; padding-right:8px; }
.pl-tabelle thead th{ white-space:normal; vertical-align:bottom; }
.pl-tabelle td.unterposition{ padding-left:22px; }
.pl-tabelle .pl-klein{ font-size:11.5px; color:var(--ink-faint); font-weight:400;
  white-space:nowrap; }
/* Futterquelle: kurzer Name, Einzelheiten auf Klick */
.pl-quelle{ background:none; border:0; padding:0; font:inherit; color:inherit;
  cursor:pointer; text-decoration:underline dotted; text-underline-offset:3px;
  text-align:left; }
.pl-quelle:hover{ color:var(--green); }

/* Dashboard: Notizen */
.card.kat-notiz .notiz-offen .dash-punkt{ background: var(--line); }
.card.kat-notiz .notiz-bald .dash-punkt{ background: var(--gold); }
.card.kat-notiz .notiz-faellig .dash-punkt{ background: var(--rust); }
.card.kat-notiz .notiz-erledigt .dash-punkt{ background: var(--green-soft); }
.notiz-erledigt .notiz-text{ text-decoration: line-through; color: var(--ink-faint); }
.notiz-inhalt{ cursor:pointer; min-width:0; }
.notiz-inhalt:hover .notiz-text{ color: var(--green); }
.notiz-text{ font-weight:500; white-space:pre-line; overflow-wrap:anywhere;
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.notiz-link{ display:block; background:none; border:0; padding-left:0; padding-right:0;
  cursor:pointer; font:inherit; font-size:12px; text-align:left; }
.notiz-link:hover{ color: var(--green); text-decoration: underline; }
.no-schnell{ display:flex; gap:6px; flex-wrap:wrap; margin:-4px 0 12px; }

/* Dashboard: Maßnahme abhaken */
.dash-haken{ width:28px; height:28px; border-radius:50%; flex:0 0 28px;
  border:1.5px solid var(--line); background:var(--surface); color:var(--ink-faint);
  font-size:14px; font-weight:700; line-height:1; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; }
.dash-haken:hover{ border-color:var(--green); color:var(--green); background:var(--green-soft); }

/* Geschätzte Reinigung: kein Plan, sondern eine Ableitung aus der
   Standard-Leerstandszeit. Deshalb nur umrandet statt gefüllt - sie soll
   sich auf den ersten Blick von einem geplanten Leerstand unterscheiden. */
.bp-schaetzung{ top:11px; height:22px; background:transparent;
  border:1px dashed var(--ink-faint); color:var(--ink-faint);
  font-weight:500; font-size:10px; }
.bp-muster.bp-schaetzung{ height:10px; top:auto; border:1px dashed var(--ink-faint); }

/* Belegung mit offenem Ende: der Balken laeuft bis zum Rand des Fensters
   und franst rechts aus, damit er nicht wie ein festes Datum wirkt. */
.bp-offenes-ende{ border-top-right-radius:0; border-bottom-right-radius:0;
  -webkit-mask-image:linear-gradient(to right, #000 75%, transparent 100%);
  mask-image:linear-gradient(to right, #000 75%, transparent 100%); }

/* Aufgeklappte Einzelposten unter einer zusammengefassten Zeile.
   Etwas leiser als die Hauptzeile, damit die Summe darüber führend
   bleibt und die Aufgliederung nicht mit ihr konkurriert. */
.pl-tabelle tr.unterzeile td{ color: var(--ink-soft); font-size:12.5px;
  background: var(--surface-sunken); }

/* ---------- Übersicht: Leistung und Futter ----------
   Zweizeilige Kopfzeile mit Gruppen darüber. Die Trennlinien zwischen den
   Gruppen machen auf einen Blick klar, welche Spalten zusammengehören -
   ohne sie verschwimmt die Tabelle zu einer Zahlenwand. */
.ue-tabelle thead th.ue-gruppe{
  text-align:center; font-size:11px; text-transform:uppercase;
  letter-spacing:.06em; color:var(--ink-faint);
  border-bottom:1px solid var(--line); padding-bottom:4px; }
.ue-tabelle thead th.ue-gruppe + th.ue-gruppe,
.ue-tabelle thead tr:last-child th:nth-child(3),
.ue-tabelle thead tr:last-child th:nth-child(6){
  border-left:1px solid var(--line); }
.ue-tabelle tbody td:nth-child(3),
.ue-tabelle tbody td:nth-child(5),
.ue-tabelle tbody td:nth-child(8),
.ue-tabelle tfoot th:nth-child(3),
.ue-tabelle tfoot th:nth-child(5),
.ue-tabelle tfoot th:nth-child(8){
  border-left:1px solid var(--line); }

/* Die Durchschnittszeile hebt sich ab, ist aber keine Summe - sie steht
   fuer die abgeschlossenen Durchgaenge und nicht fuer die Spalte darueber. */
.liste tfoot tr.summe th{
  border-top:2px solid var(--ink); background:var(--surface-sunken);
  font-size:13px; }

/* ---------- Analyse: Durchgang ----------
   Futter und Verluste nebeneinander, ab 900px untereinander - darunter
   wird die Vergleichsspalte zu schmal fuer lesbare Zahlen. */
.ue-spalten{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:16px; align-items:start; }
@media (max-width: 900px){ .ue-spalten{ grid-template-columns:1fr; } }

/* Der Balken ist ein optischer Anker: er laesst die Verteilung erfassen,
   ohne Prozentzahlen gegeneinander halten zu muessen. */
.ue-balken{ background:var(--line); height:6px; border-radius:3px;
  overflow:hidden; }
.ue-balken-fuellung{ background:var(--green); height:6px; border-radius:3px; }

/* Anklickbare Tabellenzeile. Der Zeiger allein reicht nicht als Hinweis -
   die Hervorhebung beim Ueberfahren macht sichtbar, dass etwas passiert. */
.liste tr.klickbar{ cursor:pointer; }
.liste tr.klickbar:hover td{ background:var(--surface-sunken); }

/* Schmale Vergleichstabellen (Futter, Verluste) nebeneinander.
   table-layout:fixed verteilt die Spalten fest, statt sie am laengsten
   Inhalt auszurichten - sonst schiebt ein Stallname wie
   "Stall 1 - Am Hoelln 8" die Tabelle ueber den Rand und erzwingt einen
   waagerechten Rollbalken. */
.ue-schmal{ table-layout:fixed; width:100%; }
.ue-schmal th:first-child, .ue-schmal td:first-child{ width:34%; }
.ue-schmal th:not(:first-child), .ue-schmal td:not(:first-child){ width:22%; }
.ue-schmal td, .ue-schmal th{ padding-left:6px; padding-right:6px; }

/* Der Stallname darf umbrechen und steht kleiner - er ist Beschriftung,
   nicht Inhalt.

   Der Selektor muss table.liste th schlagen, das weiter oben nowrap setzt -
   eine einzelne Klasse waere weniger spezifisch und bliebe wirkungslos. */
table.liste th.ue-kopf{
  white-space:normal; word-break:break-word; hyphens:auto;
  font-size:11.5px; line-height:1.25; vertical-align:bottom;
  text-transform:none; letter-spacing:0; }

/* In den schmalen Tabellen duerfen auch die Beschriftungen umbrechen. */
table.liste.ue-schmal td:first-child{ white-space:normal; }

/* Verweis in einer Tabellenzelle: sieht aus wie ein Link, ist aber ein
   Knopf - er oeffnet einen Dialog und navigiert nicht. */
.verweis{ background:none; border:0; padding:0; font:inherit;
  color:var(--sky); text-decoration:underline; cursor:pointer;
  text-align:left; }
.verweis:hover{ color:var(--green); }

/* Mengen- und Preisspalte der Planungsrechnung: Beiwerk zur Zahl, deshalb
   leiser gesetzt. Sie beantworten die Frage "woher kommt der Betrag". */
.pl-tabelle td.pl-menge, .pl-tabelle th.pl-menge{
  font-size:11.5px; color:var(--ink-faint);
  font-family:'IBM Plex Mono',monospace; }

/* Die je-AH-Spalte ist der Vergleichsmaßstab und steht abgesetzt rechts. */
.pl-tabelle td.pl-jeah, .pl-tabelle th.pl-jeah,
.pl-tabelle thead th:last-child{
  border-left:1px solid var(--line); }

/* ---------- Liquiditätsplan ----------
   Die Matrix folgt der Planungsrechnung: Gruppenzeilen als leise
   Zwischenüberschrift, Einzelposten eingerückt, Kontostand am Monatsende
   als Summe mit Doppellinie. */
.lq-steuer{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.lq-steuer select, dialog.lq .field select{ font-family:'Inter',sans-serif;
  font-size:14px; color: var(--ink); border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); padding: 9px 11px; }
dialog.lq .field select{ width:100%; }
.lq-steuer select:focus, dialog.lq .field select:focus{ border-color: var(--green);
  box-shadow: 0 0 0 3px var(--green-soft); outline:none; }

.lq-diagramm{ width:100%; height:auto; display:block; }

.lq-matrix tr.gruppe th{ padding-top:18px; padding-bottom:6px; font-size:11px;
  font-weight:700; letter-spacing:.06em; color: var(--ink-faint);
  border-bottom:1px solid var(--line); text-align:left; background: var(--surface); }
.lq-matrix tr.gruppe:hover{ background: transparent; }
.lq-matrix tbody tr{ cursor: default; }
.lq-matrix td.unterposition{ padding-left:22px; color: var(--ink-soft); font-size:12.5px; }
.lq-matrix tr.summe td{ border-top:2px solid var(--ink); border-bottom:2px solid var(--ink);
  font-size:14px; }
.lq-matrix td.lq-null{ color: var(--ink-faint); }
.lq-matrix td.lq-klick{ cursor:pointer; }
.lq-matrix td.lq-klick:hover{ text-decoration: underline; color: var(--green); }
.lq-matrix th.lq-kopf span{ font-size:10px; font-weight:400; color: var(--ink-faint);
  text-transform:none; letter-spacing:0; }
.lq-matrix th.lq-ist, .lq-matrix th.lq-laufend{ color: var(--ink); }

.notice-warn{ background: var(--gold-soft); color: var(--ink); }
.lq-liste{ margin:6px 0 0; padding-left:18px; line-height:1.55; }
.lq-details summary{ cursor:pointer; font-weight:600; }

.lq-annahmen .dg-zeile{ align-items:flex-start; }
.lq-annahmen .dg-zeile .k{ flex:0 0 250px; }
.lq-annahmen .dg-zeile .v{ text-align:left; flex:1; line-height:1.5; }
@media (max-width: 800px){
  .lq-annahmen .dg-zeile{ flex-direction:column; gap:2px; }
  .lq-annahmen .dg-zeile .k{ flex-basis:auto; }
}

.lq-leer{ font-size:13px; color: var(--ink-faint); line-height:1.55; }
table.liste tr.lq-inaktiv td{ color: var(--ink-faint); }
table.liste.lq-staende tbody tr, table.liste.lq-detail tbody tr{ cursor: default; }
.lq-detail td.lq-posten{ white-space:normal; }
.lq-detail td.lq-leise{ color: var(--ink-faint); font-size:12px; }
.lq-quelle{ font-size:11px; font-weight:600; padding:2px 8px; border-radius:20px; }
.lq-q-ist{ background: var(--green-soft); color: var(--green); }
.lq-q-plan{ background: var(--surface-sunken); color: var(--ink-soft); }
.lq-q-hand{ background: var(--gold-soft); color: var(--ink); }

.lq-abschnitt{ font-size:13.5px; margin:18px 0 10px; }
.lq-abschnitt:first-child{ margin-top:0; }
.dialog-body .field-grid.lq-drei{ grid-template-columns: 1fr 1fr 1fr; }
@media (max-width: 700px){ .dialog-body .field-grid.lq-drei{ grid-template-columns: 1fr; } }
/* Die Matrix ist kurz genug für die volle Höhe - und ihre wichtigste Zeile
   steht ganz unten. Sie darf deshalb nicht in einem Rollbereich verschwinden. */
.tabelle-wrap.fixiert.lq-wrap{ max-height:none; }
dialog.lq .dialog-body > .field,
dialog.lq .dialog-body > .field-grid{ margin-bottom:14px; }
dialog.lq .dialog-body > .feld-hilfe{ margin:-8px 0 14px; }

/* ---------- Fütterungsplan ---------- */
.fp-plan select, .fp-plan input[type=number]{ font-family:'Inter',sans-serif; font-size:13.5px;
  color: var(--ink); border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); padding: 6px 8px; }
.fp-plan select:focus, .fp-plan input:focus{ border-color: var(--green);
  box-shadow: 0 0 0 3px var(--green-soft); outline:none; }
.fp-plan select{ min-width: 190px; }
.fp-plan input.fp-lw{ width: 64px; }
.fp-plan input[data-feld=anteil]{ width: 64px; }
.fp-plan tbody tr{ cursor: default; }
.fp-plan tbody tr:hover{ background: transparent; }
.fp-plan td{ vertical-align: middle; }
.fp-split{ display:flex; align-items:center; gap:8px; margin:3px 0; }
.fp-rolle{ width:52px; font-size:12px; color: var(--ink-soft); }
.fp-rest{ font-size:13px; color: var(--ink-soft); padding-left:4px; }
.fp-schalter{ display:inline-flex; align-items:center; gap:6px; font-size:13px; cursor:pointer; }
.fp-weg{ border:none; background:none; font-size:18px; color: var(--ink-faint); cursor:pointer; }
.fp-weg:hover{ color: var(--rust); }
.fp-leise{ font-size:11.5px; color: var(--ink-faint); font-weight:400; text-transform:none; letter-spacing:0; }
.fp-knoepfe{ display:flex; gap:10px; justify-content:flex-end; align-items:center; margin-top:14px; flex-wrap:wrap; }
.fp-knoepfe .btn-small:first-child{ margin-right:auto; }
.fp-herkunft{ font-size:13px; line-height:1.55; padding:10px 14px; border-radius: var(--radius-s);
  margin-bottom:14px; background: var(--surface-sunken); color: var(--ink-soft); }
.fp-herkunft.fp-betrieb{ background: var(--green-soft); color: var(--ink); }
.fp-herde{ border-top:1px solid var(--line); padding:14px 0; }
.fp-herde:first-child{ border-top:none; padding-top:0; }
.fp-herde-kopf{ display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:13.5px; }
.fp-herde-kopf + div:not(:empty){ margin-top:12px; }
table.liste.fp-historie tbody tr{ cursor: default; }

/* ---------- Normkarten ---------- */
.nk-steuer{ display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.nk-steuer select{ font-family:'Inter',sans-serif; font-size:14px; color: var(--ink);
  border:1px solid var(--line); border-radius: var(--radius-s); background: var(--surface);
  padding: 9px 11px; min-width: 210px; }
.nk-steuer select:focus{ border-color: var(--green); box-shadow: 0 0 0 3px var(--green-soft); outline:none; }
.nk-kurve{ margin-top:18px; }
.nk-kurve:first-of-type{ margin-top:6px; }
.nk-kurve-titel{ font-size:13px; font-weight:600; color: var(--ink); margin-bottom:2px; }
.nk-kurve-titel span{ font-weight:400; color: var(--ink-faint); }
.nk-kurve svg{ width:100%; height:auto; display:block; }
.nk-soll{ font-size:13.5px; line-height:1.55; padding:10px 14px; border-radius: var(--radius-s);
  background: var(--green-soft); color: var(--ink); margin-bottom:14px; }
.nk-leer{ font-size:13px; color: var(--ink-faint); }
table.liste.nk-tage tbody tr, table.liste.nk-tabelle tbody tr{ cursor: default; }
.nk-tabelle tr.nk-jetzt td{ background: var(--gold-soft); font-weight:600; }
.nk-tabelle th.nk-ist, .nk-tabelle td.nk-ist{ background: var(--green-soft); }
.nk-tabelle tr.nk-jetzt td.nk-ist{ background: var(--gold-soft); }
.nk-gleich{ color: var(--ink-faint); font-size:12px; }
.nk-gegen{ font-weight:400; color: var(--gold); font-size:13px; }
.nk-tabelle th.nk-zwei, .nk-tabelle td.nk-zwei{ background: var(--gold-soft); }
.nk-tabelle tr.nk-jetzt td.nk-zwei{ background: var(--gold-soft); }
dialog.nk .field select, dialog.nk textarea, .nk-spalten select{ font-family:'Inter',sans-serif;
  font-size:14px; color: var(--ink); border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); padding: 9px 11px; width:100%; }
dialog.nk .field select:focus, dialog.nk textarea:focus, .nk-spalten select:focus{
  border-color: var(--green); box-shadow: 0 0 0 3px var(--green-soft); outline:none; }
dialog.nk .dialog-body > .field, dialog.nk .dialog-body > .field-grid{ margin-bottom:14px; }
table.liste.nk-spalten tbody tr{ cursor:default; }
.nk-spalten td.nk-bsp{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; color: var(--ink-soft); }
.nk-spalten select{ min-width:240px; }

/* ---------- Belegeingang ---------- */
.be-steuer{ display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end; }
.be-postfach{ font-size:13px; color: var(--ink-soft); margin-bottom:14px; }
.be-liste{ padding:6px 18px; }
.be-eintrag{ padding:14px 0; border-top:1px solid var(--line); }
.be-eintrag:first-child{ border-top:none; }
.be-kopf{ display:flex; justify-content:space-between; gap:14px; align-items:flex-start; }
.be-zeile1{ display:flex; align-items:center; gap:10px; margin-bottom:4px; }
.be-angaben{ font-size:14px; color: var(--ink); line-height:1.5; }
.be-leise{ font-size:12px; color: var(--ink-faint); margin-top:3px; }
.be-hinweis{ font-size:12.5px; color: var(--ink-soft); background: var(--surface-sunken);
  border-radius: var(--radius-s); padding:6px 10px; margin-top:8px; }
.be-knoepfe{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.be-los{ padding:7px 14px; }
.be-art{ font-family:'Inter',sans-serif; font-size:13.5px; font-weight:600; color: var(--ink);
  border:1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); padding:5px 8px; }
.be-sicher{ font-size:11px; font-weight:600; padding:2px 8px; border-radius:20px; }
.be-hoch{ background: var(--green-soft); color: var(--green); }
.be-mittel{ background: var(--gold-soft); color: var(--ink); }
.be-niedrig{ background: var(--rust-soft, #f6e0da); color: var(--rust); }
.be-fremd{ opacity:.85; }
table.liste.be-absender tr.be-aus td{ color: var(--ink-faint); }
@media (max-width: 760px){ .be-kopf{ flex-direction:column; } .be-knoepfe{ justify-content:flex-start; } }

/* ---------- Durchgang und Belegungsplan (Paket 59) ---------- */
.plan-wahl{ margin-top:14px; }
.plan-wahl select{ width:100%; }
.planhinweis{ font-size:12px; color: var(--ink); background: var(--gold-soft);
  border-radius: var(--radius-s); padding: 10px 12px; margin-top:14px; line-height:1.45; }
.planhinweis-zeile{ display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-top:8px; }
.planhinweis-abstand{ display:block; color: var(--ink-soft); font-size:11.5px; }
.planhinweis-fuss{ color: var(--ink-soft); margin-top:8px; font-size:11.5px; }
.planhinweis .btn-small{ flex-shrink:0; }
.pd-verknuepfen{ margin:0 0 16px; }
.pd-verknuepfen select{ flex:1; min-width:0; }
.bp-zuordnung{ margin:0 0 18px; font-size:12.5px; }

/* ---------- Kontoauszüge (Paket 63) ---------- */
.ka-filter{ display:flex; justify-content:space-between; align-items:flex-end; gap:16px;
  flex-wrap:wrap; margin:18px 0 14px; }
.ka-tabelle td{ vertical-align:top; }
.ka-tabelle td.ka-zweck{ white-space:normal; min-width:280px; max-width:520px; }
.ka-tabelle td.ka-zweck .feld-hilfe{ overflow-wrap:anywhere; }
.ka-tabelle td.ka-beleg{ white-space:normal; min-width:220px; }
.ka-tabelle select.ka-kat{ font-family:'Inter',sans-serif; font-size:13px; padding:6px 8px;
  border:1px solid var(--line); border-radius: var(--radius-s); background: var(--surface);
  max-width:230px; }
.ka-tabelle tfoot td{ border-top:2px solid var(--line); }
.ka-link{ background:none; border:none; padding:0; color: var(--green); cursor:pointer;
  font-size:11px; text-decoration:underline; }
.ka-offen summary, details.card summary{ cursor:pointer; }
.ka-offen{ margin-bottom:18px; }
.ka-offen .tabelle-wrap{ margin-top:12px; }

/* ---------- Biogas: Fütterung ---------- */
.eingabe-grid input.bg-gross{ font-size:20px; font-weight:600; }
.bg-rest-wert{ font-family:'IBM Plex Mono',monospace; font-size:30px; font-weight:600;
  margin: 2px 0 12px; }
.bg-anteil{ padding:7px 0; font-size:13px; }
.bg-anteil-kopf{ display:flex; justify-content:space-between; gap:10px; }
.bg-anteil-kopf .mono{ font-size:12.5px; color: var(--ink-soft); }
.bg-balken{ height:6px; border-radius:3px; background: var(--surface-sunken);
  margin-top:5px; overflow:hidden; }
.bg-balken-fuellung{ height:100%; background: var(--green); border-radius:3px; }
.bg-balken-fuellung.bg-rest{ background: var(--gold); }
table.bg-tabelle td.bg-stark{ font-weight:600; }
table.db-tabelle .bg-prozent{ display:block; font-size:11px; font-weight:400;
  color: var(--ink-faint); margin-top:2px; }
table.bg-tabelle .bg-prozent{ display:block; font-size:11px; font-weight:400;
  color: var(--ink-faint); margin-top:2px; }
table.bg-tabelle tfoot .bg-prozent{ color: var(--ink-soft); font-weight:600; }
table.bg-tabelle tr.bg-fehlt td{ color: var(--ink-faint); font-size:12px; }
table.bg-tabelle td.bg-bemerkung{ max-width:220px; overflow:hidden;
  text-overflow:ellipsis; color: var(--ink-soft); }
table.bg-tabelle tfoot th{ text-align:left; text-transform:none; letter-spacing:0;
  font-size:12.5px; color: var(--ink); padding: 9px 12px; }
table.bg-tabelle tfoot td{ padding: 9px 12px; font-weight:600; }
table.bg-tabelle tfoot tr:first-child th, table.bg-tabelle tfoot tr:first-child td{
  border-top:2px solid var(--ink); }
table.bg-substrate td{ padding:6px 8px; vertical-align:middle; }
table.bg-substrate tbody tr{ cursor:default; }
table.bg-substrate tbody tr:hover{ background:transparent; }
table.bg-substrate input.bg-name{ width:100%; min-width:140px; font-size:14px;
  padding:7px 9px; border:1px solid var(--line); border-radius: var(--radius-s); }
table.bg-substrate select{ font-size:13.5px; padding:6px 8px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); }
table.bg-substrate input[type=checkbox]{ width:16px; height:16px; accent-color: var(--green); }
.bg-knoepfe{ display:flex; gap:4px; }
.bg-knoepfe .btn-small{ min-width:28px; padding:4px 6px; }
/* Schmale Bildschirme: Tag-Auswahl darf umbrechen statt über den Rand zu ragen */
.tag-nav input[type=date]{ min-width:0; }
@media (max-width: 440px){ .tag-nav{ flex-wrap:wrap; } }

/* ---------- Bereiche: Umschalter Legehennen | Biogas ---------- */
.brand-mark.bm-biogas{ background: var(--sky); color:#F6F3EA; }
.bereich-wahl{ display:flex; gap:3px; background: var(--surface); border:1px solid var(--line);
  border-radius: var(--radius-s); padding:3px; margin: -8px 0 20px; }
.bereich-wahl a{ flex:1; display:flex; align-items:center; justify-content:center; gap:6px;
  font-size:12.5px; font-weight:600; color: var(--ink-soft); padding:6px 6px;
  border-radius:6px; transition: background .12s ease, color .12s ease; }
.bereich-wahl a svg{ width:14px; height:14px; flex-shrink:0; }
.bereich-wahl a:hover{ background: var(--surface-sunken); color: var(--ink); }
.bereich-wahl a.aktiv{ background: var(--green); color:#F6F3EA; }
.bereich-wahl a.aktiv[data-bereich=biogas]{ background: var(--sky); }
.sidebar.bereich-biogas .nav-item.active{ background: var(--sky); }
@media (max-width: 900px){
  .bereich-wahl{ flex-direction:column; margin-top:-10px; }
  .bereich-wahl a span{ display:none; }
  .bereich-wahl a{ padding:7px 0; }
}

/* ---------- Biogas: Stromerlöse ---------- */
.bs-link{ color: var(--green); text-decoration: underline; font-weight:600; }
.bs-fehlt{ color: var(--gold); font-size:12px; font-weight:600;
  font-family:'Inter',sans-serif; }
.bs-warn{ color: var(--rust); font-weight:700; cursor:help; }
.bs-pfeil{ color: var(--ink-faint); display:inline-block; width:12px; }
input.bs-stunden{ width:72px; text-align:right; font-family:'IBM Plex Mono',monospace;
  font-size:13px; padding:5px 7px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); color: var(--ink); }
input.bs-stunden:focus{ border-color: var(--green); box-shadow:0 0 0 3px var(--green-soft); outline:none; }
table.bs-tabelle tr.bs-details > td{ white-space:normal; background: var(--surface-sunken);
  padding:18px 20px; cursor:default; }
table.bs-tabelle tbody tr.bs-details:hover{ background: transparent; }
.bs-detail-raster{ display:flex; flex-direction:column; gap:20px; }
.bs-detail-raster > div{ min-width:0; overflow-x:auto; }
.bs-beleg .be-knoepfe{ flex-shrink:0; }
table.bs-posten{ background: var(--surface); border-radius: var(--radius-s); }
table.bs-posten th{ padding: 8px 10px 6px; }
table.bs-posten td{ padding: 7px 10px; }
table.bs-posten tbody tr{ cursor:default; }
table.bs-posten tfoot th, table.bs-posten tfoot td{ border-top:2px solid var(--ink); }
.bs-beleg{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px;
  padding:10px 0; border-bottom:1px solid var(--line); font-size:13px; }
.bs-beleg:last-child{ border-bottom:none; }
.bs-ergebnis{ list-style:none; margin:8px 0 0; padding:0; }
.bs-ergebnis li{ margin:5px 0; }
.bs-sym{ display:inline-block; width:18px; text-align:center; font-weight:700; }
.bs-uebernommen{ color: var(--green); }
.bs-pruefen{ color: var(--gold); }
.bs-fehler{ color: var(--rust); }

/* ---------- Biogas: HTK-Abrechnung ---------- */
.htk-haken{ display:inline-flex; align-items:center; gap:7px; cursor:pointer; font-size:13px; }
.htk-haken input{ width:16px; height:16px; accent-color: var(--green); cursor:pointer; }
table.htk-tabelle tbody tr{ cursor:default; }
.htk-einstellungen{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:28px; }
.htk-form{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-top:12px; }
.htk-form .field{ width:150px; }
table.htk-preise{ width:auto; }
table.htk-preise td{ padding:7px 12px 7px 0; }
table.htk-preise tbody tr{ cursor:default; }
@media (max-width: 900px){ .htk-einstellungen{ grid-template-columns:1fr; } }

/* ---------- Biogas: Kosten & Preise ---------- */
#buchungDialog select, #kaGruppe{ width:100%; font-family:'Inter',sans-serif; font-size:14px;
  padding:9px 11px; border:1px solid var(--line); border-radius: var(--radius-s);
  background: var(--surface); color: var(--ink); }
.bk-zeitraum{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; }
.bk-zeitraum .feld-hilfe{ margin-top:0; }
table.bk-tabelle tbody tr, table.bk-preise tbody tr{ cursor:default; }
table.bk-tabelle td.bk-text, table.bk-preise td.bk-text{ white-space:normal; min-width:180px; }
.bk-gruppe{ display:inline-block; margin-left:8px; font-size:10.5px; font-weight:700;
  padding:2px 7px; border-radius:20px; text-transform:uppercase; letter-spacing:.04em; }
.bk-leistung{ background: var(--green-soft); color: var(--green); }
.bk-variabel{ background: var(--gold-soft); color: #8a6212; }
.bk-fest{ background: var(--surface-sunken); color: var(--ink-soft); }
table.bk-tabelle tfoot th, table.bk-tabelle tfoot td{ padding:8px 12px; font-size:12.5px; }
table.bk-tabelle tfoot tr:first-child th, table.bk-tabelle tfoot tr:first-child td{ border-top:2px solid var(--ink); }
table.bk-tabelle tfoot td{ font-family:'IBM Plex Mono',monospace; text-align:right; font-weight:600; }
.bk-verlauf{ display:flex; gap:12px; align-items:center; justify-content:space-between;
  padding:6px 0; border-bottom:1px solid var(--line); font-size:13px; }
.bk-kostenarten summary{ cursor:pointer; list-style:none; }
.bk-kostenart{ display:flex; gap:12px; align-items:center; padding:5px 0; font-size:13px; }
.bk-kostenart .htk-haken{ min-width:260px; }
.bk-erledigt{ text-decoration: line-through; color: var(--ink-faint); }

/* ---------- Biogas: Deckungsbeitrag und Jahresauswertung ---------- */
table.db-tabelle tbody tr{ cursor:default; }
table.db-tabelle tbody tr:hover{ background: transparent; }
table.db-tabelle td.db-ein{ padding-left:26px; white-space:normal; }
table.db-tabelle tr.db-abschnitt th{ padding:18px 12px 6px; font-size:11.5px; color: var(--ink-faint);
  border-top:none; }
table.db-tabelle tr.db-summe th, table.db-tabelle tr.db-summe td{ border-top:1px solid var(--ink-soft);
  font-weight:600; font-size:13px; color: var(--ink); text-transform:none; letter-spacing:0;
  padding:9px 12px; }
table.db-tabelle tr.db-ergebnis th, table.db-tabelle tr.db-ergebnis td{ border-top:2px solid var(--ink);
  border-bottom:2px solid var(--ink); background: var(--surface-sunken); font-weight:700;
  font-size:14px; color: var(--ink); text-transform:none; letter-spacing:0; padding:11px 12px; }
table.db-tabelle th{ text-align:left; }
td.db-vj, th.db-vj{ color: var(--ink-faint); }
table.liste tr.db-aus td{ color: var(--ink-faint); }
table.ja-tabelle th{ white-space:normal; line-height:1.3; vertical-align:bottom; }
table.ja-tabelle td.ja-flex{ background: rgba(78,119,135,.06); }
table.ja-tabelle tfoot tr.ja-vorjahr th, table.ja-tabelle tfoot tr.ja-vorjahr td{
  color: var(--ink-faint); border-top:1px solid var(--line); }
table.ja-tabelle tfoot tr.ja-jahr th, table.ja-tabelle tfoot tr.ja-jahr td{ border-top:2px solid var(--ink); }
table.ja-tabelle tfoot th, table.ja-tabelle tfoot td{ padding:9px 12px; font-size:12.5px; }
table.ja-tabelle tfoot td{ font-family:'IBM Plex Mono',monospace; text-align:right; font-weight:600; }

/* ---------- Drucken ---------- */
@media print{
  body{ background:#fff; }
  .shell{ display:block; }
  .sidebar, .kein-druck, .toast{ display:none !important; }
  .main, .main.breit{ padding:0; max-width:none; }
  .card{ box-shadow:none; padding:10px 12px; margin-bottom:10px; }
  .kpi-card{ box-shadow:none; break-inside: avoid; padding:8px 10px; }
  .kpi-row{ margin-bottom:10px; }
  .topline{ margin-bottom:10px; }
  table.liste tr{ break-inside: avoid; }
  .kpi-row{ grid-template-columns: repeat(4, 1fr); }
  .tabelle-wrap{ overflow: visible; }
  table.liste td, table.liste th{ padding:5px 7px; font-size:10.5px; }
  @page{ size: A4 landscape; margin: 12mm; }
}

/* ---------- PDFs ablegen (Ziehen und Ablegen) ---------- */
.lhb-ablage{ display:flex; align-items:center; gap:12px; padding:14px 18px; margin-bottom:16px;
  border:1.5px dashed var(--line); border-radius: var(--radius-m); background: var(--surface);
  color: var(--ink-soft); font-size:13.5px; cursor:pointer; transition: background .12s, border-color .12s; }
.lhb-ablage svg{ width:22px; height:22px; flex-shrink:0; color: var(--green); }
.lhb-ablage:hover, .lhb-ablage:focus-visible{ border-color: var(--green); background: var(--green-soft); }
body.lhb-ziehen .lhb-ablage{ border-color: var(--green); background: var(--green-soft); }
body.lhb-ziehen::after{ content:'PDFs loslassen zum Einlesen'; position:fixed; inset:14px;
  border:3px dashed var(--green); border-radius: var(--radius-l); background: rgba(228,235,221,.72);
  display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif;
  font-size:24px; font-weight:580; color: var(--green); z-index:80; pointer-events:none; }
.nav-version{ font-size:10.5px; color: var(--ink-faint); text-align:center; margin-top:8px; }
@media (max-width: 900px){ .nav-version{ font-size:9px; } }

/* ---------- Biogas: Einspeiseplanung ---------- */
input.ep-kw{ width:110px; font-family:'IBM Plex Mono',monospace; font-size:14px; padding:9px 11px;
  border:1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); }
.ep-balken{ position:relative; display:flex; height:22px; border-radius:11px; overflow:visible;
  background: var(--surface-sunken); margin-top:6px; }
.ep-ist{ background: var(--green); border-radius:11px 0 0 11px; }
.ep-plan{ background: repeating-linear-gradient(45deg, var(--green-soft), var(--green-soft) 6px,
  #cfdcc6 6px, #cfdcc6 12px); }
.ep-marke{ position:absolute; top:-5px; bottom:-5px; width:3px; margin-left:-1px; background: var(--gold);
  border-radius:2px; }
.ep-legende{ display:flex; gap:18px; flex-wrap:wrap; margin-top:10px; font-size:12.5px; color: var(--ink-soft); }
.ep-farbe{ display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.ep-f-ist{ background: var(--green); }
.ep-f-plan{ background: repeating-linear-gradient(45deg, var(--green-soft), var(--green-soft) 3px, #cfdcc6 3px, #cfdcc6 6px); }
.ep-f-marke{ background: var(--gold); width:4px; }
table.ep-tabelle tbody tr{ cursor:default; }
table.ep-tabelle tr.ep-offen td{ background: rgba(214,154,31,.05); }
input.ep-eingabe{ width:80px; text-align:right; font-family:'IBM Plex Mono',monospace; font-size:13px;
  padding:5px 7px; border:1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); }
input.ep-eingabe:focus, input.ep-kw:focus{ border-color: var(--green); box-shadow:0 0 0 3px var(--green-soft); outline:none; }
input.ep-eingabe::placeholder{ color: #c9a65a; }
table.ep-tabelle tfoot th, table.ep-tabelle tfoot td{ border-top:2px solid var(--ink); padding:9px 12px; font-size:12.5px; }
table.ep-tabelle tfoot td{ font-family:'IBM Plex Mono',monospace; text-align:right; font-weight:600; }
.ep-prognose{ margin-top:14px; font-size:13px; color: var(--ink-soft); background: var(--surface-sunken);
  border-radius: var(--radius-s); padding:10px 12px; line-height:1.55; }

/* ---------- Bereich Ackerbau ---------- */
.brand-mark.bm-ackerbau{ background: var(--clay); color:#F6F3EA; }
.bereich-wahl a.aktiv[data-bereich=ackerbau]{ background: var(--clay); }
.sidebar.bereich-ackerbau .nav-item.active{ background: var(--clay); }
.bereich-wahl a{ min-width:0; }
.bereich-wahl a span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bereich-wahl.eng a{ padding:6px 2px; }
.bereich-wahl.eng a svg{ display:none; }
@media (max-width: 900px){
  .bereich-wahl.eng a svg{ display:block; }
}
body[data-ablage=csv].lhb-ziehen::after{ content:'CSV loslassen zum Einlesen'; }
body[data-ablage=csvpdf].lhb-ziehen::after{ content:'Dateien loslassen zum Einlesen'; }

.ak-select{ font-family:'Inter',sans-serif; font-size:14px; padding:9px 11px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); color: var(--ink); width:100%; }
.ak-select.ak-klein{ width:auto; font-size:13px; padding:6px 8px; }
.ak-suche{ font-family:'Inter',sans-serif; font-size:13px; padding:6px 10px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); min-width:180px; }
.ak-suche:focus, .ak-select:focus, .ak-in:focus{ border-color: var(--green); box-shadow:0 0 0 3px var(--green-soft); outline:none; }
.ak-filter{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.ak-links{ margin-right:auto; color: var(--rust); }
.ak-leer{ color: var(--ink-faint); }
.ak-rot{ color: var(--rust); font-weight:600; }
.ak-gelb{ color: #9a6b0c; font-weight:600; }
.kpi-value.ak-wert-warn{ color: var(--rust); }
.ak-umbruch{ white-space:normal !important; min-width:160px; }
.ak-rechts{ text-align:right; }
.ak-mitte{ text-align:center; }
table.ak-tabelle tbody tr{ cursor:default; }
table.ak-tabelle tfoot th, table.ak-tabelle tfoot td{ border-top:2px solid var(--ink); padding:9px 12px;
  font-size:12.5px; text-align:left; text-transform:none; letter-spacing:0; color: var(--ink); }
table.ak-tabelle tfoot td.num{ text-align:right; font-family:'IBM Plex Mono',monospace; font-weight:600; }
table.ak-tabelle tfoot tr + tr th, table.ak-tabelle tfoot tr + tr td{ border-top:1px solid var(--line); }
table.liste tr.ak-inaktiv td{ color: var(--ink-faint); }
.ak-kultur{ display:inline-flex; align-items:center; gap:7px; }
.ak-farbe{ display:inline-block; width:11px; height:11px; border-radius:3px; flex-shrink:0; vertical-align:-1px; }
.ak-badge{ display:inline-block; font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:20px;
  background: var(--surface-sunken); color: var(--ink-soft); letter-spacing:.02em; white-space:nowrap; }
.ak-badge.ak-neu{ background: var(--green-soft); color: var(--green); }
.ak-badge.ak-geaendert{ background: var(--gold-soft); color:#8a6212; }
.ak-badge.ak-gleich{ background: var(--surface-sunken); color: var(--ink-faint); }

/* Eingabetabellen in Dialogen */
table.ak-eingabe td{ padding:5px 6px; vertical-align:middle; }
table.ak-eingabe tbody tr{ cursor:default; }
table.ak-eingabe tbody tr:hover{ background:transparent; }
.ak-in{ font-family:'Inter',sans-serif; font-size:13.5px; padding:6px 8px; border:1px solid var(--line);
  border-radius: var(--radius-s); background: var(--surface); color: var(--ink); width:100%; min-width:70px; }
.ak-in.ak-name{ min-width:150px; }
.ak-in.ak-zahl{ font-family:'IBM Plex Mono',monospace; text-align:right; width:80px; min-width:60px; }
.ak-in.ak-einheit{ width:100px; }
table.ak-eingabe input[type=color]{ width:34px; height:30px; padding:0 2px; border:1px solid var(--line);
  border-radius:6px; background: var(--surface); cursor:pointer; }
table.ak-eingabe input[type=checkbox]{ width:16px; height:16px; accent-color: var(--green); }
dialog.ak-breiter{ width: min(1180px, calc(100vw - 32px)); }
/* Chrome fokussiert beim Öffnen den scrollbaren Dialoginhalt - ohne Rahmen */
.dialog-body:focus, .dialog-body:focus-visible{ outline:none; }

/* Flächen & Pacht */
.ak-zwei{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap:24px; }
.ak-auswahl{ margin-top:8px; max-height:360px; overflow-y:auto; border:1px solid var(--line);
  border-radius: var(--radius-s); padding:6px 4px; }
.ak-wahl{ display:flex; align-items:baseline; gap:6px; padding:5px 8px; font-size:13px; border-radius:6px; cursor:pointer; }
.ak-wahl:hover{ background: var(--surface-sunken); }
.ak-wahl input{ accent-color: var(--green); }
.ak-wahl-nr{ font-family:'IBM Plex Mono',monospace; font-size:12px; color: var(--ink-faint); min-width:28px; text-align:right; }
table.ak-antrag td{ padding:7px 10px; vertical-align:top; }
table.ak-antrag tbody tr{ cursor:default; }
table.ak-antrag tr.ak-st-gleich td{ color: var(--ink-faint); }
.ak-badge.ak-zugeordnet{ background:#E1EAF0; color: var(--sky); }
.ak-badge.ak-groesse{ background: var(--rust-soft); color: var(--rust); }
table.ak-antrag td.ak-flaeche-neu{ background: var(--gold-soft); white-space:nowrap; }
table.ak-antrag td.ak-flaeche-neu.ak-flaeche-aus strong{ text-decoration: line-through; color: var(--ink-faint); }
.ak-flaeche-alt{ font-size:11.5px; color: var(--ink-soft); margin-top:2px; }
.ak-mehr{ color: var(--green); font-weight:600; }
.ak-weniger{ color: var(--rust); font-weight:600; }
.ak-flaeche-haken{ display:inline-flex; align-items:center; gap:5px; margin-top:4px; font-family:'Inter',sans-serif;
  font-size:12px; font-weight:600; color: var(--ink); cursor:pointer; }
.ak-flaeche-haken input{ width:15px; height:15px; accent-color: var(--green); }
.ak-zuordnen{ max-width:240px; margin-bottom:4px; }
.zf-liste{ max-height:260px; overflow:auto; border:1px solid var(--line); border-radius: var(--radius-s); padding:4px; }
.tl-rest{ font-family:'IBM Plex Mono',monospace; font-size:14px; font-weight:600; padding:10px 0; color: var(--ink); }
.ak-groesse-hinweis{ line-height:1.55; }
.ak-groesse-knoepfe{ display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap; margin-left:6px; vertical-align:middle; }
.ak-groesse-knoepfe .btn-small{ padding:4px 10px; }
#aZahlen{ display:flex; gap:6px; flex-wrap:wrap; }
#antragDialog .ak-filter{ justify-content:space-between; margin-bottom:10px; }
@media (max-width: 760px){ .ak-zwei{ grid-template-columns:1fr; } }

/* Pachtvertrag mit Flurstücken */
.ak-vier{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px; }
.ak-vier .ak-doppelt{ grid-column: span 2; }
.ak-vier .ak-voll{ grid-column: 1 / -1; }
.kpi-row.ak-fuenf{ grid-template-columns: repeat(5, 1fr); }
.ak-kpi-zwei{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; margin-top:2px; }
.ak-kpi-teil{ display:flex; flex-direction:column; }
.ak-kpi-teil .ak-kpi-name{ font-size:11.5px; color: var(--ink-soft); font-weight:600; }
.ak-kpi-teil .kpi-value{ font-size:22px; }
@media (max-width: 1300px){ .kpi-row.ak-fuenf{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 1100px){ .kpi-row.ak-fuenf{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px){ .kpi-row.ak-fuenf{ grid-template-columns: 1fr; } }
.ak-flst-kopf{ display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin:24px 0 8px; }
table.ak-flst th{ padding:0 6px 7px; }
table.ak-flst .ak-in.ak-gem{ min-width:140px; }
table.ak-flst .ak-in.ak-kurz{ width:84px; min-width:56px; }
table.ak-flst .ak-in.ak-nutz{ width:auto; min-width:96px; }
table.ak-flst .ak-in.ak-schlagwahl{ min-width:220px; }
table.ak-flst td.num{ min-width:70px; color: var(--ink-soft); }
.ak-x{ border:none; background:transparent; color: var(--ink-faint); font-size:19px; line-height:1;
  cursor:pointer; padding:3px 7px; border-radius:6px; }
.ak-x:hover{ color: var(--rust); background: var(--rust-soft); }
table.liste td.ak-wrap{ white-space:normal; min-width:110px; }
table.ak-tabelle td.ak-besitz{ min-width:150px; white-space:normal; }
.ak-feldhinweis{ font-size:11.5px; color: var(--ink-soft); line-height:1.4; }
.ak-feldhinweis:empty{ display:none; }
table.ak-flst .ak-in.ak-preis{ width:72px; }
table.ak-flst .ak-in.ak-preis:disabled{ background: var(--surface-sunken); }
table.ak-flst tr.ak-gelesen td{ background: var(--gold-soft); }
.ak-lesen-knopf{ border-color: var(--green); color: var(--green); }
.ak-lesen-info .btn-small{ margin-left:6px; padding:4px 10px; }
.ak-verworfen{ margin-top:8px; }
.ak-verworfen summary{ cursor:pointer; font-weight:600; }
.ak-verworfen pre{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; white-space:pre-wrap; margin:6px 0 0; }
.ak-lesen-bilder{ margin-top:10px; display:flex; flex-direction:column; gap:8px; max-height:420px; overflow:auto; }
.ak-lesen-bilder img{ max-width:100%; border:1px solid var(--line); border-radius:6px; background:#fff; }
dialog.ak-ziehen{ outline:3px dashed var(--green); outline-offset:-6px; }
.be-leise.ak-text{ font-family:'Inter',sans-serif; }
.ak-preis-art{ font-family:'Inter',sans-serif; font-size:11px; color: var(--ink-faint); }
table.ak-eng td{ padding:7px 10px; }
@media (max-width: 760px){
  .ak-vier{ grid-template-columns: 1fr 1fr; }
  #vertragDialog .dialog-foot, #schlagDialog .dialog-foot{ flex-wrap:wrap; }
  #vertragDialog .dialog-foot .ak-links, #schlagDialog .dialog-foot .ak-links{ margin-right:0; }
}

/* Fruchtfolge */
.ak-jahre{ font-family:'IBM Plex Mono',monospace; font-size:14px; font-weight:600; padding:0 10px; white-space:nowrap; }
.ak-pinsel{ font-size:12.5px; color: var(--ink-soft); display:flex; align-items:center; gap:6px; }
table.ak-ff{ border-collapse:separate; border-spacing:0; }
table.ak-ff td{ padding:3px 4px; vertical-align:middle; }
table.ak-ff td.num, table.ak-ff td.ak-ff-name{ padding:3px 8px; }
table.ak-ff tbody tr{ cursor:default; }
table.ak-ff tbody tr:hover td{ background: rgba(239,234,217,.55); }
table.ak-ff th.ak-ff-jahr{ text-align:center; padding:0 4px 9px; }
table.ak-ff .ak-jetzt{ background: rgba(214,154,31,.07); }
table.ak-ff th.ak-jetzt{ color: var(--ink); }
.ak-ff-name{ position:sticky; left:0; background: var(--surface); z-index:1; max-width:210px;
  overflow:hidden; text-overflow:ellipsis; }
td.ak-ff-zelle{ min-width:112px; }
.ak-zelle{ position:relative; display:flex; flex-direction:column; justify-content:center; width:100%; min-height:38px;
  padding:4px 8px; border:1px solid transparent; border-left:4px solid var(--f, var(--line)); border-radius:6px;
  background: color-mix(in srgb, var(--f, #ffffff) 20%, #ffffff); font-family:'Inter',sans-serif;
  font-size:12.5px; color: var(--ink); text-align:left; cursor:pointer; line-height:1.25; }
.ak-zelle:hover{ border-color: var(--ink-faint); border-left-color: var(--f, var(--ink-faint)); }
.ak-zelle.ak-zelle-leer{ background:transparent; border:1px dashed var(--line); color: var(--ink-faint); text-align:center;
  align-items:center; }
.ak-zelle.ak-zelle-leer .ak-hf{ font-weight:400; }
.ak-hf{ font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.ak-zf{ font-size:10.5px; color: var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.ak-zelle.ak-verstoss{ border:2px solid var(--rust); border-left-width:4px; }
.ak-warn{ position:absolute; top:-7px; right:-6px; width:16px; height:16px; border-radius:50%; background: var(--rust);
  color:#fff; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.ak-notiz{ position:absolute; bottom:3px; right:4px; width:5px; height:5px; border-radius:50%; background: var(--ink-soft); }
.ak-verlauf{ display:grid; grid-template-columns: repeat(9, minmax(0,1fr)); gap:4px; }
.ak-verlauf-jahr{ font-size:11.5px; padding:6px 5px; border-radius:6px; background: var(--surface-sunken);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ak-verlauf-jahr .ak-farbe{ width:8px; height:8px; margin-right:3px; }
.ak-verlauf-jahr.ak-hier{ outline:2px solid var(--clay); background: var(--surface); }
@media (max-width: 640px){ .ak-verlauf{ grid-template-columns: repeat(5, minmax(0,1fr)); } }

/* Fruchtfolge: Auswahl, Vorschläge, GLÖZ 7, Ziele */
.ak-ff-kopf{ border:none; background:none; font:inherit; color:inherit; letter-spacing:inherit; text-transform:inherit;
  padding:4px 10px; border-radius:6px; cursor:pointer; }
.ak-ff-kopf:hover{ background: var(--surface-sunken); color: var(--ink); }
.ak-ff-zeile{ display:block; max-width:100%; border:none; background:none; padding:0; font:inherit; color:inherit;
  text-align:left; cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ak-ff-zeile:hover{ color: var(--green); text-decoration: underline dotted; text-underline-offset:3px; }
.ak-zelle{ -webkit-user-select:none; user-select:none; }
.ak-zelle.ak-gewaehlt{ outline:3px solid var(--sky); outline-offset:1px; }
.ak-zelle.ak-zelle-leer.ak-gewaehlt{ background: rgba(78,119,135,.10); }
.ak-zelle.ak-vorschlag{ border:1px dashed var(--f, var(--gold)); border-left:4px dashed var(--f, var(--gold));
  background: color-mix(in srgb, var(--f, #ffffff) 7%, #ffffff); color: var(--ink-soft); text-align:left; align-items:stretch; }
.ak-zelle.ak-vorschlag .ak-hf{ font-style:italic; font-weight:500; }
.ak-zelle.ak-vorschlag small{ font-size:10.5px; font-style:normal; color: var(--ink-faint); }
.ak-zelle.ak-gloez{ border:2px dashed #D9822B; border-left:4px solid var(--f, #D9822B); }
.ak-zelle.ak-gloez.ak-verstoss{ border:2px solid var(--rust); border-left-width:4px; }
.ak-warn.ak-warn-g{ width:auto; min-width:16px; padding:0 4px; border-radius:8px; background:#D9822B; font-size:9.5px; }
.ff-orange{ color:#B5651D; font-weight:600; }
.ff-link{ border:none; background:none; padding:0; font:inherit; font-size:inherit; color: var(--green); cursor:pointer;
  text-decoration: underline dotted; text-underline-offset:3px; }
.ff-link:hover{ color: var(--green-dark); text-decoration-style: solid; }
.ak-ff-tipp{ margin-top:10px; font-size:11.5px; color: var(--ink-faint); }

.ff-leiste{ position:sticky; bottom:14px; z-index:30; display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px;
  margin:-6px 0 18px; padding:10px 14px 10px 18px; border-radius: var(--radius-m); background: var(--ink); color:#F6F3EA;
  box-shadow: 0 16px 34px -14px rgba(35,39,29,.6); font-size:13px; }
.ff-leiste[hidden]{ display:none; }
.ff-leiste-info strong{ font-weight:700; }
.ff-leise{ color: rgba(246,243,234,.6); }
.ff-leiste-teil{ display:flex; align-items:center; gap:6px; }
.ff-leiste .ak-select{ border-color: transparent; max-width:210px; }
.ff-leiste .btn-small{ padding:6px 12px; border-color: rgba(246,243,234,.3); background: transparent; color:#F6F3EA; }
.ff-leiste .btn-small:hover:not(:disabled){ background: rgba(246,243,234,.12); }
.ff-leiste .btn-small.ff-los{ background: var(--gold); border-color: var(--gold); color: var(--ink); }
.ff-leiste .btn-small.ff-los:hover:not(:disabled){ background:#E5AC33; }
.ff-leiste .btn-small:disabled{ opacity:.4; }
.ff-leiste .ff-weg{ margin-left:auto; }
.ff-leiste-ziel{ flex-basis:100%; font-size:12.5px; line-height:1.55; color: rgba(246,243,234,.82); }
.ff-leiste-ziel b{ color:#fff; font-family:'IBM Plex Mono',monospace; font-weight:600; }
.ff-l-fehlt{ color:#F4A988; font-weight:600; }
.ff-l-ueber{ color:#F2CF7F; font-weight:600; }
.ff-l-ok{ color:#B9DCA9; font-weight:600; }

table.ff-summen{ table-layout:fixed; min-width:780px; }
table.ff-summen th:first-child{ width:210px; }
table.ff-summen tbody td{ vertical-align:top; }
table.ff-summen td:first-child{ overflow:hidden; text-overflow:ellipsis; }
.ff-ziel{ display:block; margin:2px -6px 0 auto; padding:1px 6px; border:none; border-radius:6px; background:none;
  font-family:'Inter',sans-serif; font-size:11.5px; line-height:1.35; color: var(--ink-soft); text-align:right; cursor:pointer;
  white-space:normal; max-width:170px; }
.ff-ziel:hover{ background: var(--surface-sunken); }
.ff-ziel-wert{ display:block; font-weight:500; color: var(--ink-soft); }
.ff-ziel-fehlt{ color: var(--rust); font-weight:600; }
.ff-ziel-ueber{ color:#9a6b0c; font-weight:600; }
.ff-ziel-ok{ color: var(--green); font-weight:600; }
.ff-ziel-neu{ margin-right:6px; padding:0 5px; border:none; border-radius:5px; background:none; font-family:'Inter',sans-serif;
  font-size:11px; font-weight:600; color: var(--green); cursor:pointer; opacity:0; }
.ff-ziel-neu:hover{ background: var(--green-soft); }
table.ff-summen tr:hover .ff-ziel-neu, .ff-ziel-neu:focus-visible{ opacity:1; }
@media (hover: none){ .ff-ziel-neu{ opacity:.75; } }
.ff-ziel-in{ display:block; width:84px; margin:3px 0 0 auto; padding:3px 6px; border:1px solid var(--green); border-radius:6px;
  font-family:'IBM Plex Mono',monospace; font-size:13px; text-align:right; background: var(--surface); color: var(--ink);
  box-shadow:0 0 0 3px var(--green-soft); outline:none; }
table.ff-summen tr.ff-neue-zeile td{ padding-top:8px; padding-bottom:8px; }
table.ff-summen tr.ff-neue-zeile:hover td{ background:none; }
table.ff-summen tfoot .ff-link{ font-family:'Inter',sans-serif; font-size:12px; font-weight:500; white-space:nowrap; }
table.ff-summen tr.ff-gl-zeile th, table.ff-summen tr.ff-gl-zeile td{ border-top:1px solid var(--line); vertical-align:top; }
table.ff-summen tr.ff-gl-zeile th .be-leise{ display:block; text-transform:none; letter-spacing:0; font-weight:400; }
.ff-gl{ font-weight:700; white-space:nowrap; }
.ff-gl-ok{ color: var(--green); }
.ff-gl-nein{ color: var(--rust); }
.ff-gl-offen{ color: var(--ink-soft); }
.ff-gl-ha{ display:block; font-size:11px; font-weight:400; color: var(--ink-faint); white-space:nowrap; }
.ff-gl-hinweis{ margin-top:12px; }
.ff-vorschlag-hinweis{ margin:14px 0 0; line-height:1.5; }
@media print{
  .ak-zelle.ak-vorschlag, .ak-zelle.ak-zelle-leer{ border:1px dashed var(--line); background:none; }
  .ak-zelle.ak-vorschlag .ak-hf, .ak-zelle.ak-zelle-leer .ak-hf{ visibility:hidden; }
  .ak-zelle.ak-gewaehlt{ outline:none; }
  .ak-ff-kopf{ padding:0; }
  .ff-ziel{ padding:0; margin-right:0; }
  .ff-ziel-neu, .ff-neue-zeile{ display:none !important; }
  .ak-warn{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Saatgut & Düngung */
table.ak-plan tr.ak-gruppe th, table.ak-plan tr.ak-gruppe td{ padding-top:16px; border-top:2px solid var(--line);
  text-transform:none; letter-spacing:0; font-size:13.5px; color: var(--ink); text-align:left; }
table.ak-plan tr.ak-summe td{ font-weight:600; border-top:1px solid var(--ink-soft); }
table.ak-plan tbody tr{ cursor:default; }
table.ak-saat input{ margin:-4px 0; }
table.liste th.ak-chem{ text-transform:none; letter-spacing:0; font-size:12px; }
.ak-ohne-plan{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:14px; font-size:13px; }
.ak-chip-knopf{ display:inline-flex; align-items:center; gap:6px; font-family:'Inter',sans-serif; font-size:12.5px;
  padding:4px 10px; border:1px dashed var(--line); border-radius:20px; background: var(--surface); color: var(--ink); cursor:pointer; }
.ak-chip-knopf:hover{ border-color: var(--green); background: var(--green-soft); }

/* Saatgut: Sorten je Schlag, Bestellung */
table.ss-tabelle tbody tr{ cursor:default; }
table.ss-tabelle tr.ss-gruppe th, table.ss-tabelle tr.ss-gruppe td{ padding-top:16px; border-top:2px solid var(--line);
  text-transform:none; letter-spacing:0; font-size:13.5px; color: var(--ink); text-align:left; vertical-align:bottom; }
table.ss-tabelle tbody tr.ss-gruppe:first-child th, table.ss-tabelle tbody tr.ss-gruppe:first-child td{ border-top:none; }
.ss-alle{ display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; font-size:12.5px; }
.ss-alle input{ width:180px; }
input.ss-sorte{ width:220px; max-width:100%; }
table.ss-tabelle td input.ak-zahl{ width:80px; }
input.ss-gespeichert{ border-color: var(--green); box-shadow:0 0 0 3px var(--green-soft); transition: box-shadow .3s; }
table.ss-best tbody tr{ cursor:default; }
table.ss-best tr.ss-ohne td{ background: rgba(184,69,29,.04); }
table.ss-best tr.ss-summe td{ font-weight:600; border-top:1px solid var(--ink-soft); }
input.ss-bestellt{ width:84px; }
.ss-fehlt{ color: var(--rust); font-weight:600; white-space:nowrap; }
.ss-mehr{ color:#9a6b0c; font-weight:600; white-space:nowrap; }
.ss-ok{ color: var(--green); font-weight:600; white-space:nowrap; }
.ss-details{ border:none; background:none; padding:0; font:inherit; font-size:12.5px; color: var(--ink-soft); text-align:left;
  cursor:pointer; text-decoration: underline dotted; text-underline-offset:3px; }
.ss-details:hover{ color: var(--green); }
.ss-details .kein-druck{ color: var(--green); }
@media print{
  table.ss-tabelle input, table.ss-best input{ border:none; padding:0; background:none; box-shadow:none; }
  input.ss-sorte{ width:auto; }
}

/* Kalkung */
.ak-stufe{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:6px;
  font-size:12px; font-weight:700; color:#fff; }
.ak-sA{ background:#A2361A; }
.ak-sB{ background:#D9822B; }
.ak-sC{ background:#4E8F4A; }
.ak-sD{ background:#4E7787; }
.ak-sE{ background:#5B4E87; }
.ak-stufen-karte{ padding:16px 20px; }
.ak-stufenbalken{ display:flex; height:22px; border-radius:11px; overflow:hidden; background: var(--surface-sunken); }
.ak-sb{ height:100%; }
.ak-sbA{ background:#A2361A; } .ak-sbB{ background:#D9822B; } .ak-sbC{ background:#4E8F4A; }
.ak-sbD{ background:#4E7787; } .ak-sbE{ background:#5B4E87; } .ak-sb0{ background: var(--line); }
table.ak-kalk tr.ak-bedarf td{ background: rgba(217,130,43,.06); }
table.ak-kalk input[type=checkbox]{ width:16px; height:16px; accent-color: var(--green); }
.ak-geplant{ font-size:12px; font-weight:600; color: var(--clay); }
.ak-ph{ display:inline-flex; align-items:center; gap:8px; font-family:'IBM Plex Mono',monospace; }
.ak-naehr{ display:inline-flex; gap:10px; font-size:11.5px; color: var(--ink-soft); }
.ak-naehr > span{ display:inline-flex; align-items:center; gap:4px; }
.ak-naehr .ak-stufe{ width:19px; height:19px; font-size:11px; }
table.ak-kalk td.ak-umbruch{ min-width:0; }
table.ak-kalk td, table.ak-kalk th{ padding-left:9px; padding-right:9px; }
.ak-hoch{ color: var(--green); font-size:10px; }
.ak-runter{ color: var(--rust); font-size:10px; }
.ak-wahlleiste{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:10px 14px; margin-bottom:12px;
  background: var(--gold-soft); border-radius: var(--radius-s); font-size:13px; }
.ak-ph-verlauf{ display:flex; flex-wrap:wrap; gap:8px; }
.ak-ph-punkt{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; padding:5px 9px;
  background: var(--surface-sunken); border-radius:6px; }
.ak-ph-punkt .ak-stufe{ width:18px; height:18px; font-size:11px; }
.ak-zu-zeile{ display:grid; grid-template-columns: 220px minmax(0,1fr); gap:14px; padding:12px 0;
  border-bottom:1px solid var(--line); align-items:start; }
.ak-zu-schlaege{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ak-chip{ display:inline-flex; align-items:center; gap:6px; font-size:13px; padding:4px 4px 4px 10px; border-radius:20px;
  background: var(--green-soft); border:1px solid transparent; }
.ak-chip.ak-vorschlag{ background: var(--surface); border:1px dashed var(--gold); }
.ak-chip button{ border:none; background:transparent; color: var(--ink-soft); font-size:15px; line-height:1; cursor:pointer;
  width:20px; height:20px; border-radius:50%; }
.ak-chip button:hover{ background: rgba(0,0,0,.07); color: var(--rust); }
@media (max-width: 640px){ .ak-zu-zeile{ grid-template-columns:1fr; gap:6px; } }
@media print{
  .ak-zelle{ border-width:1px; min-height:0; padding:2px 4px; }
  table.ak-ff td{ padding:1px 2px; }
  .ak-stufe, .ak-sb, .ak-zelle{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Überweisungsplan Pacht */
table.pz-tabelle td{ vertical-align:top; }
table.pz-tabelle th.pz-jahr{ text-align:left; min-width:150px; }
table.pz-tabelle th.pz-aktuell{ color: var(--ink); }
td.pz-zelle{ white-space:nowrap; }
td.pz-leer{ color: var(--ink-faint); }
td.pz-bezahlt{ background: var(--green-soft); }
.pz-haken{ display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.pz-haken input{ width:18px; height:18px; accent-color: var(--green); cursor:pointer; }
.pz-haken input:disabled{ cursor:default; }
.pz-betrag{ font-family:'IBM Plex Mono',monospace; font-weight:600; }
td.pz-offen .pz-betrag{ color: var(--ink); }
.pz-info{ display:block; margin-top:3px; padding:0; border:none; background:none; font-size:12px; color: var(--green);
  cursor:pointer; text-decoration: underline dotted; text-underline-offset:3px; font-family:'Inter',sans-serif; }
.pz-iban{ border:none; background:none; padding:0; font-family:'IBM Plex Mono',monospace; font-size:12px; color: var(--ink-soft);
  cursor:copy; white-space:nowrap; }
.pz-iban:hover{ color: var(--green); }
table.pz-tabelle tfoot td.num.ak-rot{ color: var(--rust); }
@media print{
  td.pz-bezahlt{ background:none; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pz-info{ color: var(--ink); text-decoration:none; }
  .pz-haken input{ width:12px; height:12px; }
}

/* Kalkplan: Schläge × Jahre */
table.kp-tabelle td{ vertical-align:middle; }
table.kp-tabelle th.kp-jahr{ text-align:center; border-left:2px solid var(--line); padding-bottom:4px; }
table.kp-tabelle th.kp-zeit{ text-align:right; font-size:10.5px; min-width:88px; padding-top:0; }
table.kp-tabelle th.kp-zeit.kp-fruehjahr, table.kp-tabelle td.kp-fruehjahr{ border-left:2px solid var(--line); }
table.kp-tabelle td.kp-herbst{ border-left:1px dashed var(--line); }
.kp-leiste{ margin:-4px 0 14px; }
.kp-modus{ padding:2px; }
.kp-modus button{ padding:5px 11px; font-size:12.5px; }
table.kp-tabelle tr.kp-jahressumme th, table.kp-tabelle tr.kp-jahressumme td{ border-top:1px solid var(--line); }
table.kp-tabelle tr.kp-jahressumme td.kp-fuss{ text-align:center; border-left:2px solid var(--line); max-width:none; }
table.kp-tabelle th.kp-aktiv{ color: var(--ink); }
td.kp-zelle{ text-align:right; cursor:pointer; padding:6px 10px; min-width:88px; }
td.kp-zelle:hover{ background: var(--surface-sunken); }
td.kp-zelle.kp-aktiv{ box-shadow: inset 0 0 0 9999px rgba(78,143,74,.035); }
td.kp-geplant{ background: var(--gold-soft); }
td.kp-erledigt{ background: var(--green-soft); }
td.kp-geplant:hover, td.kp-erledigt:hover{ filter: brightness(.97); }
.kp-plus{ color: var(--ink-faint); opacity:0; font-weight:600; }
td.kp-zelle:hover .kp-plus{ opacity:1; }
.kp-eintrag{ line-height:1.25; }
.kp-menge{ font-family:'IBM Plex Mono',monospace; font-weight:600; color: var(--ink); }
.kp-einheit{ font-size:11px; color: var(--ink-faint); }
.kp-ges{ display:block; font-family:'IBM Plex Mono',monospace; font-size:11.5px; color: var(--ink-soft); }
.kp-haken{ color: var(--green); font-weight:700; margin-right:4px; }
td.kp-edit{ background: var(--surface) !important; box-shadow: inset 0 0 0 2px var(--green); cursor:default; }
.kp-eingabe{ display:flex; align-items:center; justify-content:flex-end; gap:5px; }
.kp-in{ width:64px; font-family:'IBM Plex Mono',monospace; font-size:13.5px; font-weight:600; text-align:right;
  padding:4px 6px; border:1px solid var(--line); border-radius:6px; background: var(--surface); color: var(--ink); }
.kp-in:focus{ outline:none; border-color: var(--green); }
.kp-vorschau{ font-size:11.5px; color: var(--ink-soft); margin-top:3px; white-space:nowrap; }
.kp-vorschau strong{ font-family:'IBM Plex Mono',monospace; color: var(--ink); }
td.kp-fuss{ text-align:right; vertical-align:top; }
td.kp-fuss.kp-fruehjahr{ border-left:2px solid var(--line); }
td.kp-fuss.kp-herbst{ border-left:1px dashed var(--line); }
.kp-summe{ font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:13.5px; }
table.kp-tabelle tfoot .be-leise{ font-family:'Inter',sans-serif; font-weight:400; white-space:normal; line-height:1.35; }
table.kp-tabelle tfoot td.kp-fuss{ white-space:normal; max-width:150px; text-align:right; }
table.kp-tabelle tfoot th, table.kp-tabelle tfoot td{ vertical-align:top; }
.kp-schlag{ border:none; background:none; padding:0; font: inherit; font-weight:600; color: var(--ink); cursor:pointer;
  text-align:left; }
.kp-schlag:hover{ color: var(--green); text-decoration: underline; text-underline-offset:3px; }
.kp-kalkwahl{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color: var(--ink-soft); max-width:100%; min-width:0; }
.kp-kalkwahl select{ min-width:0; max-width:100%; text-overflow:ellipsis; }
/* Kalkung: Jetzt kalken */
.jk-karte .card-head{ flex-wrap:wrap; gap:10px; }
.jk-titel{ margin-top:22px; }
.jk-titel .be-leise{ display:inline; font-weight:400; text-transform:none; letter-spacing:0; }
table.jk-tabelle td{ vertical-align:middle; }
.jk-menge{ font-family:'IBM Plex Mono',monospace; font-weight:600; color: var(--ink); white-space:nowrap; }
.jk-ok{ color: var(--green); font-weight:600; white-space:nowrap; }
table.jk-tabelle tr.jk-erledigt td{ background: var(--green-soft); }
table.jk-tabelle tr.jk-aus td:not(:first-child){ opacity:.42; }
input.jk-gabe{ width:56px; }
.jk-hinweis{ font-size:12px; color: var(--ink-soft); min-width:180px; }
table.jk-tabelle tfoot td.jk-fuss{ text-align:right; white-space:normal; }
.jk-aktion{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:12px;
  padding:10px 14px; background: var(--gold-soft); border-radius: var(--radius-s); font-size:13px; }
.jk-leer{ padding:12px 14px; background: var(--surface-sunken); border-radius: var(--radius-s); font-size:13px; color: var(--ink-soft); }
.jk-ohne{ margin-top:14px; font-size:12.5px; color: var(--ink-soft); }
.jk-ohne summary{ cursor:pointer; font-weight:600; }
.jk-ohne ul{ margin:8px 0 0; padding-left:18px; line-height:1.6; }
.jk-quelle{ margin-top:14px; }
.jk-labor{ font-size:11.5px; font-weight:600; color: var(--green); margin-top:2px; }
.nur-druck{ display:none; }
@media print{
  .nur-druck{ display:inline; }
  body.druck-jetzt .main > :not(#jetzt):not(.topline){ display:none !important; }
  body.druck-jetzt .topline .steuerleiste, body.druck-jetzt .page-sub, body.druck-jetzt .jk-quelle,
  body.druck-jetzt .jk-ohne{ display:none !important; }
  table.jk-tabelle tr.jk-aus{ display:none; }
  input.jk-gabe{ border:none; padding:0; width:40px; background:none; }
  table.jk-tabelle tr.jk-erledigt td{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
@media print{
  td.kp-geplant, td.kp-erledigt{ -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .kp-plus{ display:none; }
}