/* Einschuebe und Dienststreifen (docs/konzept-zugang-2.md, Kap. 16) — eine Quelle fuer Empfaengerseite und Konsole,
   wie js/einschuebe.js und js/streifen.js. Nach app.css bzw. admin.css laden; die Seite setzt die Farben:
   --e-linie, --e-leise, --e-text, --e-hg, --e-akzent. */

/* Einschub: ein eigener Abschnitt im Text — ▲ Einstieg, ▼ Ausstieg, duenne Linien, leicht abgesetzt (zum Text hin
   gemischt: im dunklen Modus heller, im hellen dunkler). Der Autortext geht danach weiter (data-fort). */
/* Die Linien oben und unten: duenn, gelb leuchtend (Sascha 2026-10-06), damit der Einschub sofort ins Auge faellt */
.einschub { --e-grenze: #ffd84d; margin: 4px 0; padding: 2px 10px;
  border-top: 1px solid var(--e-grenze); border-bottom: 1px solid var(--e-grenze);
  box-shadow: 0 -3px 6px -3px var(--e-grenze), 0 3px 6px -3px var(--e-grenze);
  background: color-mix(in srgb, var(--e-hg), var(--e-text) 6%); }
.einschub__pfeil { display: block; font-size: 9px; line-height: 1; color: var(--e-leise); }
.einschub__text { white-space: pre-wrap; margin: 2px 0; }
.mit-blatt :is(p, h2, h3):has(+ .einschub) { margin-bottom: 0; }
.mit-blatt :is(p, h2, h3)[data-fort] { margin-top: 0; }
.einschub.hervor, .rand-notiz.hervor { outline: 1px solid var(--e-akzent); outline-offset: -1px; }

/* Beim Partner: Textfeld mit ✕, und "Einschub hier" an der geklickten Stelle */
.einschub__zeile { display: flex; gap: 6px; align-items: flex-start; }
.einschub__feld { flex: 1; min-height: 2.6em; field-sizing: content; resize: vertical; padding: 2px 0; border: 0; background: transparent;
  color: inherit; font: inherit; line-height: inherit; }
.einschub__feld:focus { outline: none; }
.einschub__weg { padding: 0 6px; border: 0; background: transparent; color: var(--e-leise); cursor: pointer; }
/* Die Stelle eines neuen Einschubs: Strich genau in der Luecke, ▼ darueber (js/einschuebe-partner.js) */
.einschub-marke { position: absolute; z-index: 5; width: 2px; margin-left: -1px; background: var(--e-akzent); cursor: ew-resize; touch-action: none; }
.einschub-marke::before { content: "▼"; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
  color: var(--e-akzent); font-size: 12px; line-height: 1; }
.einschub-hier { position: absolute; z-index: 5; padding: 3px 12px; border-radius: 14px; border: 1px solid var(--e-akzent);
  background: var(--e-hg); color: var(--e-text); font-size: 0.85rem; cursor: pointer; }

/* Dienststreifen rechts: aufgeklappt Name · Zeit, zugeklappt schmal mit dem Kuerzel — nie ganz weg. Die Breiten
   der Spalten setzt die Seite (.mit-blatt, .streifen-zu). */
.mit-blatt { position: relative; }
.mit-rand { position: relative; border-left: 1px solid var(--e-linie); }
.streifen-knopf { position: absolute; top: 0; left: 4px; padding: 0 6px; border: 0; background: transparent; color: var(--e-leise); cursor: pointer; }
.rand-notiz { position: absolute; left: 8px; right: 6px; line-height: 1.35; color: var(--e-leise); }
.rand-notiz__kurz { display: none; font-weight: 600; color: var(--e-text); }
.rand-notiz__wer { color: var(--e-text); }
.streifen-zu .rand-notiz__kurz { display: inline; }
.streifen-zu .rand-notiz__lang { display: none; }
