@font-face{
  font-family:'AudiType';
  font-weight:400;
  font-style:normal;
  src:url(data:font/woff2;/static/fonts/audi-normal.woff2) format('woff2');
}
@font-face{
  font-family:'AudiType';
  font-weight:700;
  font-style:normal;
  src:url(data:font/woff2;/static/fonts/audi-bold.woff2) format('woff2');
}
  :root{
    --bg:#0a0c10; --panel:#1b1f29; --panel2:#242a36; --line:#363d4b;
    --text:#e7e9ee; --muted:#9aa3b2; --accent:#e8b84b; --accent2:#3b82f6;
    --break:#2a2f3a; --danger:#ef4444; --ok:#22c55e;
    --font:'AudiType','Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.55}
  header{position:sticky;top:0;z-index:10;background:var(--panel);border-bottom:1px solid var(--line);padding:14px 20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
  header h1{font-size:18px;margin:0;letter-spacing:.5px}
  header .ver{color:var(--muted);font-size:13px}
  header .spacer{flex:1}
  .badge{font-size:12px;padding:3px 9px;border-radius:99px;border:1px solid var(--line);color:var(--muted)}
  .badge.edit{color:var(--accent);border-color:var(--accent)}
  button{font-family:inherit;font-size:14px;cursor:pointer;border:1px solid var(--line);background:var(--panel2);color:var(--text);padding:7px 13px;border-radius:8px;transition:.15s}
  button:hover{border-color:var(--accent)}
  button.primary{background:var(--accent);color:#1a1a1a;border-color:var(--accent);font-weight:600}
  button.ghost{background:transparent}
  button.danger{border-color:var(--danger);color:var(--danger)}
  button.sm{padding:4px 9px;font-size:12px}
  main{max-width:1100px;margin:0 auto;padding:22px 20px 80px}
  .day{margin-bottom:30px;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.35)}
  .day-head{display:flex;align-items:center;gap:12px;padding:13px 16px;background:var(--panel2);border-bottom:1px solid var(--line)}
  .day-head .spacer{flex:1}
  table{width:100%;border-collapse:collapse}
  th{text-align:left;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);padding:10px 16px;border-bottom:2px solid var(--line);font-weight:600}
  td{padding:13px 16px;border-bottom:1px solid var(--line);vertical-align:top}
  tr:last-child td{border-bottom:none}
  tbody tr.zebra td{background:rgba(255,255,255,.055)}
  tbody tr:not(.break):hover td{background:rgba(232,184,75,.08)}
  .col-cue{width:50px;text-align:center;color:var(--muted);font-variant-numeric:tabular-nums;font-size:13px}
  th.col-cue{text-align:center}
  .c-time{white-space:nowrap;color:var(--accent);font-variant-numeric:tabular-nums;font-weight:700;font-size:15px}
  .day-head .dtitle{font-weight:700;font-size:15px;letter-spacing:.2px}
  .footnote{margin-top:6px;padding:14px 18px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;color:var(--muted);font-size:14px;line-height:1.5}
  .footnote:empty{display:none}
  #printFooter{
    margin-top:8px; padding-top:7px;
    border-top:1px solid var(--line);
    color:var(--muted); font-size:12.5px;
  }
  #confidentialNote{margin-top:18px;padding:12px 16px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--danger);border-radius:8px;color:var(--muted);font-size:12.5px;line-height:1.5}
  #confidentialNote strong{color:var(--text)}
  .c-main{font-weight:500;color:var(--text)}
  .c-short{color:var(--muted)}
  .c-soft{color:var(--muted);white-space:pre-line;font-size:14px}
  .c-op{color:var(--text);white-space:pre-line;font-size:14px}
  .c-intern{color:#c88;white-space:pre-line;font-size:13.5px}
  .col-act{width:118px;white-space:nowrap}
  tr.break td{background:var(--break);color:var(--muted);font-style:italic;text-align:center}
  tr.break .c-main{font-weight:400;color:var(--muted)}
  .row-actions{display:flex;gap:4px;opacity:.45;transition:.15s}
  tr:hover .row-actions{opacity:1}
  /* edit inputs */
  td input,td textarea{width:100%;background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:6px;padding:7px 9px;font-family:inherit;font-size:15px;line-height:1.4}
  td.c-time textarea{font-size:14px;font-weight:700;color:var(--accent)}
  td textarea{min-height:40px;resize:none;overflow:hidden;display:block}
  .empty{padding:40px;text-align:center;color:var(--muted)}
  /* modal */
  .modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:50;padding:20px}
  .modal-bg.show{display:flex}
  .modal{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px;width:100%;max-width:380px}
  .modal h2{margin:0 0 6px;font-size:18px}
  .modal p{color:var(--muted);margin:0 0 18px;font-size:14px}
  .modal input{width:100%;background:var(--bg);border:1px solid var(--line);color:var(--text);border-radius:8px;padding:11px;font-size:15px;margin-bottom:14px}
  .modal .err{color:var(--danger);font-size:13px;margin:-8px 0 12px;min-height:16px}
  .modal-row{display:flex;gap:10px;justify-content:flex-end}
  .toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(100px);background:var(--panel2);border:1px solid var(--line);padding:12px 20px;border-radius:10px;transition:.25s;z-index:60;box-shadow:0 8px 30px rgba(0,0,0,.4)}
  .toast.show{transform:translateX(-50%) translateY(0)}
  .hint{background:#16243f;border:1px solid var(--accent2);border-radius:10px;padding:12px 16px;margin-bottom:22px;font-size:13.5px;color:#c7d2e8}
  .hint b{color:var(--text)}
  @media print{
    @page{
      margin:14mm;
    }
    *{ -webkit-print-color-adjust:exact; print-color-adjust:exact; }
    header button,.row-actions,.col-act,#adminControls,#adminHint,.toast,.modal-bg,.badge{display:none!important}
    body{background:#fff;color:#000;font-size:11pt;line-height:1.35}
    header{position:static;background:#fff;border-bottom:2px solid #000;padding:0 0 8px;margin-bottom:14px;display:block}
    header h1{color:#000;font-size:13pt;margin:0}
    header .ver{color:#000;font-size:10pt}
    main{max-width:none;padding:0 2mm;box-sizing:border-box}

    /* Tageskachel: Browser bricht selbst um, Block wird nie zerschnitten */
    .day{margin:0 0 12px;background:#fff;border:1pt solid #000;border-radius:8px;box-shadow:none;break-inside:avoid;page-break-inside:avoid;overflow:hidden}
    .day-head{background:#eee!important;border-bottom:1pt solid #000;padding:7px 11px}
    .day-head .dtitle{color:#000;font-size:10.5pt;font-weight:700}

    /* Tabelle: feste Breiten, garantiert im Druckbereich, einheitliche Linien */
    table{table-layout:fixed;width:100%;border-collapse:collapse}
    th{color:#000;background:#fff;border:1pt solid #000;font-size:9pt;font-weight:700;padding:5px 6px;text-transform:none;letter-spacing:0}
    td{border:1pt solid #000;padding:5px 6px;vertical-align:top;color:#000;font-size:9.5pt;
       white-space:normal;word-break:normal;overflow-wrap:anywhere;hyphens:auto}
    tr{break-inside:avoid;page-break-inside:avoid}

    /* Spaltenbreiten: Summe = 100% (Was = Rest) */
    .col-cue{width:6%;color:#888;font-weight:400;font-size:9pt;text-align:center}
    th.col-cue{text-align:center}
    .c-time{color:#000;font-weight:700;font-size:9pt;padding-right:9px;white-space:normal;overflow-wrap:anywhere}
    .c-main{color:#000;font-weight:600}
    .c-short{color:#000}
    .c-soft{color:#222}
    .c-op{color:#000}
    .c-intern{color:#000;font-style:italic}

    tr.break td{background:#eee!important;color:#000;font-style:italic}
    tbody tr.zebra td{background:#f4f4f4!important}

    .footnote{background:#fff;color:#000;border:1pt solid #000;border-left:1pt solid #000;border-radius:8px;margin:0 0 12px;padding:12px 16px;font-size:10.5pt;break-inside:avoid}

    /* Vertraulichkeitshinweis im Druck */
    #endBlock{ break-inside:avoid; page-break-inside:avoid; }
    #confidentialNote{
      display:block!important;
      background:#fff!important;
      margin-top:8px; padding:8px 12px;
      border:1pt solid #000; border-left:3pt solid #000; border-radius:8px;
      font-size:8pt; line-height:1.4; color:#000;
      break-inside:avoid;
    }
    #confidentialNote strong{ color:#000; }

    /* Firmen-Credit am Ende des Dokuments (kein Pfad-Konflikt, keine Überlappung) */
    #printFooter{
      display:block!important;
      margin-top:6px; padding-top:5px;
      border-top:1pt solid #000;
      font-size:8.5pt; color:#000; text-align:left;
      break-inside:avoid;
    }
  }
  @media(max-width:640px){
    .c-soft,.c-op{width:auto}
    main{padding:16px 12px 80px}
  }

/* --- Server-Version: gesperrte Zellen (Operator sieht, darf aber nicht ändern) --- */
td.locked{ color:var(--muted); }   /* kein opacity: wuerde die Rahmenlinien schwaechen */
td.locked::selection{ background:transparent; }
#fieldHint strong{ color:var(--accent); }

/* ============ Regieplan: mehr Spalten, dichtere Darstellung ============ */
body.kind-regieplan .c-soft,
body.kind-regieplan .c-op{ font-size:13px; }
body.kind-regieplan td{ padding:9px 10px; }
body.kind-regieplan .c-time{ font-size:14px; }

/* Operator-Spalten dezent voneinander absetzen */
body.kind-regieplan .col-video{ box-shadow:inset 2px 0 0 rgba(59,130,246,.35); }
body.kind-regieplan .col-audio{ box-shadow:inset 2px 0 0 rgba(34,197,94,.35); }
body.kind-regieplan .col-licht{ box-shadow:inset 2px 0 0 rgba(232,184,75,.45); }
body.kind-regieplan .col-intern{ background:rgba(200,120,120,.07); }

@media print{
  /* Regieplan quer drucken – sonst wird es bei 9 Spalten zu eng */
  body.kind-regieplan{ }
  body.kind-regieplan td{ padding:4px 5px; font-size:8pt; }
  body.kind-regieplan th{ padding:4px 5px; font-size:7.5pt; }
  body.kind-regieplan .c-time{ font-size:8pt; }
  body.kind-regieplan .col-video{ box-shadow:none; }
  body.kind-regieplan .col-audio{ box-shadow:none; }
  body.kind-regieplan .col-licht{ box-shadow:none; }
  body.kind-regieplan .col-intern{ background:#f4f4f4!important; }
}
@page regie{ size:A4 landscape; margin:12mm; }
body.kind-regieplan{ page:regie; }

/* ========== Layout-Feinschliff (Bildschirm) ========== */
table{ table-layout:fixed; }
td, th{ overflow-wrap:anywhere; }

/* Eingabefelder füllen die Zelle vollständig aus */
td textarea{
  width:100%; box-sizing:border-box;
  min-height:34px; padding:6px 8px;
  line-height:1.35;
}

/* Regieplan: kompakter, damit 9 Spalten atmen können */
body.kind-regieplan td{ padding:7px 8px; }
body.kind-regieplan td textarea{ font-size:13.5px; padding:5px 7px; min-height:32px; }
body.kind-regieplan .c-time{ font-size:14px; }
body.kind-regieplan td.c-time textarea{ font-size:13.5px; }
body.kind-regieplan th{ font-size:10px; letter-spacing:.6px; }

/* Aktion als visueller Anker der Zeile */
body.kind-regieplan .col-aktion textarea,
body.kind-regieplan td.col-aktion{ font-weight:600; }

/* Ruhigere Trennung statt harter Kästen im Lesemodus */
tbody tr:not(.break):hover td{ background:rgba(232,184,75,.05); }

/* Kopfzeilen: kompakt, kein hässlicher Umbruch bei schmalen Spalten */
th{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.kind-regieplan th{ font-size:9.5px; letter-spacing:.4px; padding:7px 6px; }
.col-cue, th.col-cue{ text-align:center; }
body.kind-regieplan .col-cue{ font-size:12px; }

/* Zeit-Spalten nie umbrechen */
.c-time, td.c-time textarea{ white-space:nowrap; }
body.kind-regieplan td.c-time textarea{ text-align:left; }

/* Druck: alle Bedienelemente ausblenden, Kopf sauber setzen */
@media print{
  header a, header button, header .badge, #fieldHint{ display:none!important; }
  header{ display:block!important; position:static!important; }
  header h1{ margin:0 0 2px!important; }
  header .ver{ margin:0!important; }
  #evtVersion{ border-bottom:none!important; }
}

@media print{
  th.col-cue{ font-size:8pt!important; letter-spacing:0; }
}

/* ============ Mehrzeilige Felder (v.a. "Details") ============ */
/* Zeilenumbrueche muessen in ALLEN Ansichten erhalten bleiben.
   Wichtig: im Druck ueberschreibt die td-Regel sonst pre-line. */
.c-multi, .c-soft, .c-op, .c-intern{ white-space:pre-line; }

/* Details bekommt mehr Luft und linksbuendige Mehrzeiligkeit */
.c-multi{ line-height:1.45; }
body.kind-regieplan td.c-multi{ font-size:13.5px; color:var(--text); }
body.kind-regieplan td.c-multi textarea{
  font-size:13.5px; line-height:1.45; min-height:56px;
}

@media print{
  /* pre-line erneut erzwingen – td setzt oben white-space:normal */
  .c-multi, .c-soft, .c-op, .c-intern{
    white-space:pre-line!important;
    overflow-wrap:anywhere;
  }
  body.kind-regieplan td.c-multi{ font-size:8pt; line-height:1.35; }
}

/* ============ Druck: alle Textfarben verbindlich dunkel ============ */
@media print{
  td, th, .c-time, .c-main, .c-short, .c-soft, .c-op, .c-multi{
    color:#000!important;
  }
  .c-intern{ color:#333!important; font-style:italic; }
  .col-cue{ color:#777!important; }
  /* Details gut lesbar, etwas groesser als die Nebenspalten */
  body.kind-regieplan td.c-multi{ font-size:8.5pt!important; color:#000!important; }
}

/* ============ Kopfzeile: einheitlich in Schrift, Groesse, Farbe ============ */
thead th{
  font-family:inherit!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.9px!important;
  text-transform:uppercase!important;
  color:var(--muted)!important;
  text-align:left;
  padding:10px 8px!important;
}
thead th.col-cue{ text-align:center; }
body.kind-regieplan thead th{ font-size:10px!important; letter-spacing:.7px!important; }

@media print{
  thead th{
    font-size:8.5pt!important;
    font-weight:700!important;
    color:#000!important;
    letter-spacing:0!important;
    text-transform:none!important;
  }
  body.kind-regieplan thead th{ font-size:8pt!important; }
}

/* ============ Bloecke (Abschnitte / Pausen) ============ */

@media print{
    }

/* Zeitspalten: kompakt, damit hh:mm immer vollstaendig passt */
body.kind-regieplan td.c-time textarea{
  font-size:12.5px; padding:5px 4px; text-align:center; letter-spacing:-.2px;
}
body.kind-regieplan .c-time{ font-size:13px; text-align:center; }
body.kind-regieplan thead th.col-start,
body.kind-regieplan thead th.col-end,
body.kind-regieplan thead th.col-dur{ text-align:center; }
/* Ende ist berechnet -> optisch ruhiger */
/* "Ende" ist berechnet -> nur der TEXT wirkt dezenter.
   Kein opacity auf der Zelle, sonst werden auch die Rahmenlinien blass. */
td.c-calc{ color:#9aa3b2; }
td.c-calc textarea{ color:#9aa3b2; }

/* ============ Spalten-Editor ============ */
#colEditor{
  margin-top:18px; padding:18px 20px;
  background:var(--panel); border:1px solid var(--line); border-radius:12px;
}
#colEditor h3{ margin:0 0 4px; font-size:16px; }
#colEditor .hintline{ color:var(--muted); font-size:13.5px; margin:0 0 14px; line-height:1.5; }
.colrow{
  display:flex; align-items:center; gap:8px;
  padding:7px 0; border-bottom:1px solid var(--line);
}
.colrow:last-of-type{ border-bottom:none; }
.colrow input[type=text]{
  flex:1; min-width:120px;
  background:var(--bg); border:1px solid var(--line); color:var(--text);
  border-radius:7px; padding:7px 9px; font-family:inherit; font-size:14px;
}
.colrow select{
  background:var(--bg); border:1px solid var(--line); color:var(--text);
  border-radius:7px; padding:7px 8px; font-family:inherit; font-size:13px;
}
.colrow .wnum{
  width:62px; text-align:center;
  background:var(--bg); border:1px solid var(--line); color:var(--text);
  border-radius:7px; padding:7px 6px; font-family:inherit; font-size:14px;
}
.colrow .pct{ color:var(--muted); font-size:13px; margin-left:-4px; }
.colrow .chk2{
  display:flex; align-items:center; gap:5px;
  color:var(--muted); font-size:13px; cursor:pointer; white-space:nowrap;
}
.colsum{ margin-top:12px; color:var(--muted); font-size:13px; }
.coladd{
  display:flex; gap:8px; align-items:center;
  margin-top:16px; padding-top:14px; border-top:1px solid var(--line);
}
.coladd input[type=text]{
  flex:1; background:var(--bg); border:1px solid var(--line); color:var(--text);
  border-radius:7px; padding:9px 11px; font-family:inherit; font-size:14px;
}
.coladd select{
  background:var(--bg); border:1px solid var(--line); color:var(--text);
  border-radius:7px; padding:9px; font-family:inherit; font-size:13px;
}
@media print{ #colEditor{ display:none!important; } }

/* Viele Spalten: waagerecht scrollen statt quetschen */
.day{ overflow-x:auto; }
.day table{ min-width:100%; }
/* Mindestbreite nur im Bearbeiten-Modus (dort braucht es Platz fuer die
   Aktionsspalte). Im Lese-Modus passt sich die Tabelle dem Fenster an,
   damit rechts nichts abgeschnitten wird. */
/* Mindestbreite nur fuer den Admin (viele Aktionsknoepfe).
   Operatoren haben eine schmale Aktionsspalte und blenden Spalten aus
   -> ihre Tabelle soll ins Fenster passen, ohne Scrollen. */
body.kind-regieplan.edit-mode:not(.op-mode) .day table{ min-width:1150px; }
body.kind-regieplan.op-mode .day table{ min-width:0; }
body.op-mode .day{ overflow-x:visible; }
body.kind-regieplan:not(.edit-mode) .day table{ min-width:0; }
body:not(.edit-mode) .day{ overflow-x:visible; }
@media print{
  .day{ overflow:visible!important; }
  body.kind-regieplan .day table{ min-width:0!important; }
}

/* Einfuege-Knoepfe deutlich sichtbar und immer erreichbar */
.row-actions .ins{
  color:var(--accent); border-color:rgba(232,184,75,.45);
  font-weight:700; letter-spacing:-1px; padding:4px 7px;
}
.row-actions .ins:hover{
  background:var(--accent); color:#1a1a1a; border-color:var(--accent);
}
.col-act{ width:170px; }

.hint .keys{
  display:block; margin-top:7px; padding-top:7px;
  border-top:1px solid rgba(255,255,255,.09);
  font-size:12.5px; opacity:.85;
}
.hint .keys b{ color:var(--accent); font-weight:600; }

/* Cue- und Aktionsspalte bleiben beim seitlichen Scrollen stehen */
.col-cue{ position:sticky; left:0; z-index:3; background:var(--panel); }
.col-act{ position:sticky; z-index:3; background:var(--panel); width:150px; }
tbody tr.zebra .col-cue,
tbody tr.zebra .col-act{ background:#242a35; }
thead th.col-cue, thead th.col-act{ background:var(--panel2); z-index:4; }

/* Aktionsknoepfe kompakt, damit die Spalte schmal bleibt */
.row-actions{ flex-wrap:nowrap; }
.row-actions .sm{ padding:3px 6px; font-size:11px; }
.row-actions .ins{ padding:3px 6px; }

@media print{
  .col-cue, .col-act, thead th.col-cue, thead th.col-act{
    position:static!important; background:transparent!important;
  }
}

/* Aktionsspalte: zwei Reihen, damit sie schmal bleibt */
.col-act{ width:96px!important; }
.row-actions{
  display:grid!important;
  grid-template-columns:repeat(3, auto);
  gap:3px; justify-content:start;
}
.row-actions .sm{
  padding:2px 5px; font-size:10.5px; line-height:1.5;
  min-width:26px; text-align:center;
}

/* ============ Bloecke: kraeftige Linien oben und unten ============ */

@media print{
  }

/* ============ Farbwaehler fuer Bloecke ============ */
.blockrow{ display:flex; align-items:center; gap:12px; }
.blockrow textarea{ flex:1; }
.cdots{ display:flex; gap:5px; flex-shrink:0; }
.cdot{
  width:16px; height:16px; border-radius:50%;
  border:2px solid transparent; cursor:pointer; padding:0;
  opacity:.55; transition:.12s;
}
.cdot:hover{ opacity:1; transform:scale(1.15); }
.cdot.on{ opacity:1; border-color:var(--text); }
@media print{ .cdots{ display:none!important; } }

/* Farbpunkte links neben den Titel statt rechts (dort schneidet es ab) */
.blockrow{ flex-direction:row-reverse; justify-content:flex-end; }
.cdots{ margin-right:4px; }
/* Zebra auch in den fixierten Spalten sichtbar */
tbody tr.zebra .col-cue,
tbody tr.zebra .col-act{ background:#242a35!important; }

/* Druck: Zebra hell, fixierte Spalten nicht dunkel durchschlagen lassen */
@media print{
  tbody tr.zebra:not([class*="mk-"]) td,
  tbody tr.zebra:not([class*="mk-"]) .col-cue,
  tbody tr.zebra:not([class*="mk-"]) .col-act{
    background:#f2f2f2!important;
    color:#000!important;
  }
  tbody tr.zebra .col-cue{ color:#777!important; }
  /* Markierte Zeilen ausnehmen – sie behalten ihre Signalfarbe */
  tbody tr:not(.zebra):not(.block):not([class*="mk-"]) td{ background:#fff!important; }
}

/* ============ Druck: durchgehende, gleichmaessige Linien ============ */
@media print{
  /* Tabelle bildet ihre Linien selbst, sauber zusammengefuehrt */
  .day table{ border-collapse:collapse!important; }
  .day table td, .day table th{
    border:0.8pt solid #000!important;
  }
  /* Kachel: abgerundete Ecken (bewusst, damit es nicht nach Excel aussieht),
     dafuer bildet die Kachel die Aussenkante und die Tabelle laesst ihre
     eigenen Aussenlinien weg -> keine abgeschnittenen Linien in den Ecken. */
  .day{
    border:1pt solid #000!important;
    border-radius:7px!important;
    overflow:hidden!important;
  }
  .day-head{
    border-bottom:1pt solid #000!important;
    border-radius:0!important;
  }
  .day table tr > *:first-child{ border-left:none!important; }
  .day table tr > *:last-child{ border-right:none!important; }
  .day table tbody tr:last-child > *{ border-bottom:none!important; }
  /* Bloecke behalten ihre kraeftige Betonung */
}

/* ============ Druck: EINHEITLICHE Schriftgroessen ============
   Setzt alle ueber die Iterationen entstandenen Sondergroessen zurueck. */
@media print{
  .day table td,
  .day table td *,
  .day table th{
    font-size:9pt!important;
    font-family:inherit!important;
    line-height:1.35!important;
  }
  .day table th{ font-weight:700!important; }
  /* Nur diese drei duerfen abweichen – bewusst und einheitlich: */
  .day table td.c-time{ font-weight:700!important; }
  .day table td.col-cue{ font-weight:400!important; color:#777!important; }
    .day-head .dtitle{ font-size:10.5pt!important; font-weight:700!important; }
}

/* Druck: Ende-Spalte mit denselben vollen Linien wie alle anderen */
@media print{
  td.c-calc, th.c-calc{
    opacity:1!important;
    color:#000!important;
    border:0.8pt solid #000!important;
  }
}

/* Sicherheitsnetz: im Druck NIE transparente Zellen (schwaecht Linien) */
@media print{
  .day table td, .day table th{ opacity:1!important; }
}

/* ============ Bloecke: Linien EINDEUTIG oben und unten ============
   Problem: bei border-collapse teilen zwei benachbarte Zeilen EINE Linie.
   Wer sie zeichnet, ist nicht verlaesslich -> darum setzen wir die
   kraeftige Linie zusaetzlich an der Folgezeile (oben) und der
   Vorgaengerzeile (unten). Dann ist sie immer da. */

@media print{
    /* Zeile direkt nach einem Block: kraeftige Oberkante erzwingen */
  }

/* Fussbereich kompakt halten, damit er moeglichst auf die letzte
   Inhaltsseite passt statt eine eigene Seite zu belegen */
@media print{
  .footnote{ margin:6px 0 6px!important; padding:8px 12px!important; font-size:9pt!important; }
  #endBlock{ break-inside:avoid; page-break-inside:avoid; }
  #confidentialNote{ margin-top:6px!important; padding:7px 11px!important; font-size:7.5pt!important; }
  #printFooter{ margin-top:5px!important; padding-top:4px!important; font-size:8pt!important; }
}

/* ═══════════════════════════════════════════════════════════════
   BLÖCKE (Abschnitte / Pausen) – EINE einzige Definition.
   Die Linien werden als Hintergrund-Balken gezeichnet, NICHT als
   Zellrahmen. Grund: bei border-collapse teilen sich benachbarte
   Zeilen eine Linie und der Browser entscheidet, wer sie zeichnet
   – das ergab unterschiedlich starke Linien. Ein Hintergrundbalken
   teilt sich mit niemandem und ist immer exakt gleich.
   ═══════════════════════════════════════════════════════════════ */

/* ---------- Bildschirm ---------- */
tr.block .blocktitle{
  font-weight:700; font-size:15px; letter-spacing:.4px;
  color:var(--block-fg, #e8b84b);
}
tr.block .blocktitle textarea{
  font-weight:700; font-size:15px; letter-spacing:.4px;
  color:var(--block-fg, #e8b84b);
  background:transparent; border-color:transparent;
}
tr.block .blocktitle textarea:focus{
  background:var(--bg); border-color:var(--line);
}
tr.block .c-time,
tr.block .c-time textarea{ color:var(--block-fg, #e8b84b); }
tr.block .col-cue{ color:transparent; }

/* ---------- Druck ---------- */
@media print{
  tr.block .blocktitle{
    font-size:9.5pt!important; font-weight:700!important; color:#000!important;
  }
  tr.block .c-time{ color:#000!important; font-weight:700!important; }
  tr.block .col-cue{ color:transparent!important; }
}

/* ═══════════════════════════════════════════════════════════════
   BLOCK-TRENNLINIEN als eigene Tabellenzeilen mit FESTER Hoehe.
   Warum so: Zellrahmen werden bei border-collapse zwischen
   Nachbarzeilen geteilt (unvorhersehbar), und Hintergrund-Balken
   runden je nach Zellhoehe unterschiedlich. Eine eigene Zeile mit
   fester Hoehe ist immer exakt gleich stark.
   ═══════════════════════════════════════════════════════════════ */
tr.blockline > td{
  padding:0!important;
  height:2px!important;
  line-height:0!important;
  font-size:0!important;
  background:var(--block-line, #e8b84b)!important;
  border:none!important;
}
tr.block > *{
  background-color:var(--block-bg, rgba(232,184,75,.10))!important;
  border-top:none!important;
  border-bottom:none!important;
}

@media print{
  tr.blockline{ height:0!important; }
  tr.blockline > td{
    height:0!important;
    padding:0!important;
    line-height:0!important;
    font-size:0!important;
    background:transparent!important;
    /* Die Linie ist ein Rahmen mit ganzzahliger pt-Angabe ->
       rundet in jedem Renderer gleich. */
    border:none!important;
    border-top:2pt solid #000!important;
  }
  tr.block > *{
    background-color:var(--block-bg-print, #e6e6e6)!important;
    border-top:none!important;
    border-bottom:none!important;
    border-left:0.8pt solid #000!important;
    border-right:0.8pt solid #000!important;
  }
}

/* ═══════════ Bearbeitbare Fuss-Texte + Formatierungsleiste ═══════════ */
.richedit{ cursor:text; transition:.12s; }
.richedit:hover{ outline:1px dashed var(--line); outline-offset:2px; }
.richedit:focus{
  outline:2px solid var(--accent); outline-offset:2px;
  background:rgba(232,184,75,.04);
}
#footnote.richedit:empty::before,
#footnote[data-ph]:empty::before{
  content:attr(data-ph); color:var(--muted); font-style:italic;
}
.fmtbar{
  display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  position:sticky; bottom:14px; z-index:20;
  margin:14px 0 6px; padding:8px 12px;
  background:var(--panel2); border:1px solid var(--line);
  border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,.35);
}
.fmtbar button{
  background:var(--bg); border:1px solid var(--line); color:var(--text);
  border-radius:6px; padding:5px 10px; font-size:13px; cursor:pointer;
  font-family:inherit;
}
.fmtbar button:hover{ border-color:var(--accent); }
.fmtbar .fdot{
  width:20px; height:20px; border-radius:50%; padding:0;
  border:2px solid var(--line);
}
.fmtbar .fdot:hover{ transform:scale(1.15); }
.fmtbar .fmtsep{ width:1px; height:20px; background:var(--line); margin:0 3px; }
.fmtbar .fmtlabel{ color:var(--muted); font-size:12.5px; }

@media print{
  .fmtbar{ display:none!important; }
  .richedit{ outline:none!important; background:transparent!important; }
  #confidentialNote strong, #confidentialNote b{ color:#000!important; }
}

/* ═══════════ Zeilen-Markierungen (temporaer hervorheben) ═══════════ */
tr.mk-achtung   > td{ background:rgba(239,68,68,.13)!important; }
tr.mk-geaendert > td{ background:rgba(232,184,75,.13)!important; }
tr.mk-erledigt  > td{ background:rgba(34,197,94,.11)!important; }

/* Farbstreifen links als zusaetzlicher Anker */
tr.mk-achtung   > td:first-child{ box-shadow:inset 3px 0 0 #ef4444; }
tr.mk-geaendert > td:first-child{ box-shadow:inset 3px 0 0 #e8b84b; }
tr.mk-erledigt  > td:first-child{ box-shadow:inset 3px 0 0 #22c55e; }

/* Der Markier-Knopf zeigt die aktuelle Farbe */
.row-actions .mark{ color:var(--muted); }
.row-actions .mark.m-achtung  { color:#ef4444; border-color:#ef4444; }
.row-actions .mark.m-geaendert{ color:#e8b84b; border-color:#e8b84b; }
.row-actions .mark.m-erledigt { color:#22c55e; border-color:#22c55e; }

@media print{
  /* Im Druck dezent grau abgestuft, damit der Text lesbar bleibt und
     es auch auf Schwarz-Weiss-Druckern erkennbar ist. */
  tr.mk-achtung   > td{ background:#f0dede!important; }
  tr.mk-geaendert > td{ background:#f2ecd8!important; }
  tr.mk-erledigt  > td{ background:#e2efe4!important; }
  tr.mk-achtung   > td:first-child,
  tr.mk-geaendert > td:first-child,
  tr.mk-erledigt  > td:first-child{ box-shadow:none!important; }
  /* Achtung-Zeilen zusaetzlich mit kraeftigerem Rahmen */
  tr.mk-achtung > td{ border-top:1.2pt solid #000!important; border-bottom:1.2pt solid #000!important; }
}

/* Operator: nur der Markier-Knopf -> schmale Aktionsspalte */
body.op-mode .col-act{ width:40px!important; }
body.op-mode .row-actions{ grid-template-columns:auto; }

/* Markierungen im Druck haben Vorrang vor Zebra-Streifen.
   Steht bewusst ganz am Ende der Datei. */
@media print{
  tbody tr.mk-achtung   > td,
  tbody tr.mk-achtung.zebra > td{ background:#f0dcdc!important; }
  tbody tr.mk-geaendert > td,
  tbody tr.mk-geaendert.zebra > td{ background:#f4eeda!important; }
  tbody tr.mk-erledigt  > td,
  tbody tr.mk-erledigt.zebra > td{ background:#e0eee4!important; }
}

/* ═══════════ Aenderungsnotiz & "Neu seit letztem Besuch" ═══════════ */
.notebar{
  display:flex; align-items:center; gap:11px;
  margin-bottom:14px; padding:12px 16px;
  background:rgba(232,184,75,.12);
  border:1px solid var(--accent); border-left:4px solid var(--accent);
  border-radius:10px;
}
.notebar .nb-icon{
  flex-shrink:0; width:22px; height:22px; border-radius:50%;
  background:var(--accent); color:#1a1a1a;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:14px;
}
.notebar .nb-text{ flex:1; color:var(--text); font-size:14.5px; font-weight:500; }
.notebar .nb-time{ color:var(--muted); font-size:12.5px; white-space:nowrap; }

.changebar{
  display:flex; align-items:center; gap:12px;
  margin-bottom:14px; padding:10px 16px;
  background:rgba(59,130,246,.12);
  border:1px solid var(--accent2); border-radius:10px;
  color:var(--text); font-size:14px;
}
.changebar button{
  margin-left:auto; background:var(--accent2); color:#fff;
  border-color:var(--accent2); font-weight:600;
}

/* Geaenderte Zeilen: blauer Streifen links + Punkt */
tr.isnew > td:first-child{ box-shadow:inset 3px 0 0 var(--accent2); }
tr.isnew > td:first-child::after{
  content:'●'; color:var(--accent2); font-size:9px;
  position:absolute; margin-left:4px; margin-top:-2px;
}
tr.isnew > td{ position:relative; }

@media print{
  /* Notiz mitdrucken (sie ist inhaltlich relevant),
     die "neu"-Markierung aber nicht (die ist persoenlich). */
  .notebar{
    background:#f4eeda!important; border:1pt solid #000!important;
    border-left:3pt solid #000!important; border-radius:7px;
    margin-bottom:10px; padding:8px 12px;
  }
  .notebar .nb-icon{ background:#000!important; color:#fff!important; }
  .notebar .nb-text{ color:#000!important; font-size:9pt!important; }
  .notebar .nb-time{ color:#333!important; font-size:8pt!important; }
  .changebar{ display:none!important; }
  tr.isnew > td:first-child{ box-shadow:none!important; }
  tr.isnew > td:first-child::after{ content:none!important; }
}

/* Aktionsspalte: sechs Knoepfe in 2x3 -> etwas mehr Breite */
.col-act{ width:110px!important; }
body.op-mode .col-act{ width:40px!important; }
.row-actions{ grid-template-columns:repeat(3, minmax(0,1fr))!important; gap:2px!important; }
.row-actions .sm{ min-width:0!important; padding:2px 3px!important; font-size:10px!important; }

/* ═══════════ Vertikale Trennlinien zwischen ALLEN Spalten ═══════════
   Dezentes Grau als Grundraster; die farbigen Gewerke-Linien bleiben
   daneben bestehen und heben sich dadurch weiter ab. */
.day table td,
.day table th{
  border-left:1px solid rgba(255,255,255,.14);
}
/* Erste Spalte ohne Linie (Kachelrand genuegt) */
.day table tr > *:first-child{ border-left:none; }

/* Farbige Gewerke-Linien haben Vorrang und bleiben deutlich */
body.kind-regieplan .col-video{ box-shadow:inset 2px 0 0 rgba(59,130,246,.32); }
body.kind-regieplan .col-audio{ box-shadow:inset 2px 0 0 rgba(34,197,94,.32); }
body.kind-regieplan .col-licht{ box-shadow:inset 2px 0 0 rgba(232,184,75,.35); }

/* Bloecke: keine vertikalen Linien, sie laufen durch */
tr.block > *{ border-left:none!important; }
tr.blockline > td{ border-left:none!important; }

/* Aktion: viel Text -> kleinere Schrift, mehrzeilig */
body.kind-regieplan td.col-aktion,
body.kind-regieplan td.col-aktion textarea{
  font-size:13px; line-height:1.35; font-weight:600;
}
/* Zeitspalten eng: kompakte Schrift, wenig Innenabstand */
body.kind-regieplan td.c-time,
body.kind-regieplan th.c-time{ padding-left:5px; padding-right:5px; }
body.kind-regieplan td.c-time textarea{ padding-left:3px; padding-right:3px; font-size:12px; }
body.kind-regieplan .c-time{ font-size:12.5px; }

@media print{
  body.kind-regieplan td.col-aktion{ font-size:8.5pt!important; font-weight:700!important; }
  body.kind-regieplan td.c-time, body.kind-regieplan th.c-time{
    padding-left:4px!important; padding-right:4px!important;
  }
}

/* Zeitspalten-Koepfe: kleiner, damit "Dauer" vollstaendig passt */
body.kind-regieplan thead th.c-time{ font-size:9px!important; letter-spacing:.3px!important; }

/* Sicherheits-Hinweis im Admin */
.secnote{
  margin:0 0 14px; padding:10px 13px;
  background:rgba(239,68,68,.10);
  border:1px solid rgba(239,68,68,.45); border-left:3px solid var(--danger);
  border-radius:8px; color:var(--muted); font-size:13px; line-height:1.5;
}
.secnote b{ color:var(--text); }
.chk.warn input:checked + *,
.chk.warn:has(input:checked){ color:var(--danger); }

/* ═══════════ Persoenliche Spaltenauswahl ═══════════ */
.colfilter{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-bottom:12px; padding:9px 14px;
  background:var(--panel); border:1px solid var(--line); border-radius:10px;
}
.colfilter .cf-label{ color:var(--muted); font-size:12.5px; }
#cfChips{ display:flex; gap:6px; flex-wrap:wrap; }
.cf-chip{
  background:var(--bg); border:1px solid var(--line); color:var(--muted);
  border-radius:99px; padding:4px 11px; font-size:12.5px; cursor:pointer;
  font-family:inherit; transition:.12s;
}
.cf-chip:hover{ border-color:var(--accent); }
.cf-chip.on{ background:var(--panel2); color:var(--text); border-color:var(--muted); }
.cf-chip.own{
  background:rgba(232,184,75,.16); color:var(--accent);
  border-color:var(--accent); cursor:default; font-weight:600;
}
.colfilter > .sm{
  margin-left:auto; background:var(--panel2); border:1px solid var(--line);
  color:var(--text); border-radius:7px; padding:4px 10px; cursor:pointer;
  font-size:12.5px; font-family:inherit;
}
@media print{ .colfilter{ display:none!important; } }

/* ═══════════ Spaltentitel: einheitlich und deutlich sichtbar ═══════════
   Steht am Ende, damit es alle frueheren Groessenangaben ueberschreibt. */
.day thead th{
  font-size:11.5px!important;
  font-weight:700!important;
  letter-spacing:.7px!important;
  text-transform:uppercase!important;
  color:var(--text)!important;
  opacity:.95;
  padding:11px 8px!important;
  background:var(--panel2)!important;
  border-bottom:2px solid var(--line)!important;
}
.day thead th.col-cue{ text-align:center!important; }
/* Auch die Zeitspalten-Koepfe gleich gross */
body.kind-regieplan .day thead th,
body.kind-regieplan .day thead th.c-time{
  font-size:11.5px!important; letter-spacing:.7px!important;
}

/* Zeitspalten-Koepfe duerfen kleiner sein, damit sie vollstaendig passen –
   der Rest bleibt einheitlich und gut sichtbar. */
body.kind-regieplan .day thead th.c-time{
  font-size:10px!important; letter-spacing:.3px!important; padding:11px 4px!important;
}

/* Druck: Kopfzeile hell mit schwarzer Schrift (Toner + Lesbarkeit).
   Die dunkle Variante gilt nur fuer den Bildschirm. */
@media print{
  .day thead th{
    background:#fff!important;
    color:#000!important;
    font-size:8.5pt!important;
    letter-spacing:0!important;
    text-transform:none!important;
    opacity:1!important;
    padding:5px 6px!important;
    border-bottom:1pt solid #000!important;
  }
  body.kind-regieplan .day thead th,
  body.kind-regieplan .day thead th.c-time{
    font-size:8pt!important; letter-spacing:0!important; padding:5px 4px!important;
  }
}

/* ═══════════ Markierungen klar von Bloecken unterscheiden ═══════════
   Problem: Eine gruen gefaerbte "Erledigt"-Zeile sah aus wie ein gruener
   Block. Loesung: Markierungen wirken ueber einen kraeftigen Streifen
   links + Symbol, die Flaeche bleibt sehr dezent. Bloecke behalten die
   flaechige Farbe – so sind beide sofort auseinanderzuhalten. */
tr.mk-achtung   > td{ background:rgba(239,68,68,.055)!important; }
tr.mk-geaendert > td{ background:rgba(232,184,75,.055)!important; }
tr.mk-erledigt  > td{ background:rgba(34,197,94,.05)!important; }

tr.mk-achtung   > td:first-child{ box-shadow:inset 5px 0 0 #ef4444!important; }
tr.mk-geaendert > td:first-child{ box-shadow:inset 5px 0 0 #e8b84b!important; }
tr.mk-erledigt  > td:first-child{ box-shadow:inset 5px 0 0 #22c55e!important; }

/* Symbol in der Cue-Spalte zeigt die Bedeutung */
tr.mk-achtung   .col-cue::before{ content:'!'; color:#ef4444; font-weight:700; margin-right:3px; }
tr.mk-geaendert .col-cue::before{ content:'~'; color:#e8b84b; font-weight:700; margin-right:3px; }
tr.mk-erledigt  .col-cue::before{ content:'✓'; color:#22c55e; font-weight:700; margin-right:3px; }

@media print{
  tr.mk-achtung   > td{ background:#fbf2f2!important; }
  tr.mk-geaendert > td{ background:#fcf8ee!important; }
  tr.mk-erledigt  > td{ background:#f2f9f3!important; }
  /* Auf Papier zaehlt das Symbol – Farben sind dort schwach */
  tr.mk-achtung   .col-cue::before{ content:'!';  color:#000!important; }
  tr.mk-geaendert .col-cue::before{ content:'~';  color:#000!important; }
  tr.mk-erledigt  .col-cue::before{ content:'✓'; color:#000!important; }
  tr.mk-achtung > td{ border-top:1pt solid #000!important; border-bottom:1pt solid #000!important; }
}