/* Letzte Cleaning Prüfung: 16.10.2026 | Letztes Cleaning: - */
/*
 * Vorlage der Eingabebox (Chatbox) für alle confacAI-Werkzeuge mit Chatbox: KI-Video, KI-Bild, Social-Posts, Creator Coach
 * (WL16-13, Betreiber 16.10.2026: „wieso sind das jetzt doch unterschiedliche Chatboxen? Du solltest doch ein Template
 * benutzen“). Movie Studio und Werbestudio sind ausgenommen.
 *
 * Gestaltung und Aufbau stehen nur hier, das Verhalten (Wachsen bis vier Zeilen, Scrollen, Platz auf der Seite) in
 * contentfactory-eingabebox.js. Vorbild ist KI-Video. Jede Box hat dieselben Teile an derselben Stelle:
 *
 *   ┌ Rand 4 px ──────────────────────────────────────────────┐
 *   │ ┌ helle Fläche ───────────────────────────────────────┐ │
 *   │ │ Text (2 bis 4 Zeilen, danach Scrollbalken) [Zauber] [Knopf] │
 *   │ │ Leiste mit Chips                            [        ]  │
 *   │ └─────────────────────────────────────────────────────┘ │
 *   └─────────────────────────────────────────────────────────┘
 *
 * Die Werkzeuge liefern ihre Teile in eigenem HTML; ihre Zwischenebenen werden hier durchlässig (display: contents), so
 * dass alle Teile im selben Raster stehen. Ein neues Werkzeug mit Chatbox trägt nur seine Selektoren in die Listen unten ein.
 * Präfix mit vier IDs: schlägt die älteren Einzelregeln der Werkzeuge (bis zwei IDs, teils !important).
 */

/* Die Box */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) {
  --eb-knopf-breite: 120px;
  --eb-knopf-hoehe: 80px;
  align-items: start !important;
  background: #12131a !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  column-gap: 16px !important;
  display: grid !important;
  grid-template-areas: var(--eb-raster, "text zauber knopf" "leiste leiste knopf") !important;
  grid-template-columns: var(--eb-spalten, minmax(0, 1fr) auto var(--eb-knopf-breite)) !important;
  grid-template-rows: auto auto !important;
  height: auto !important;
  isolation: isolate;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 14px 16px 16px !important;
  position: relative !important;
  row-gap: 14px !important;
}
/* Helle Fläche mit feinem Rahmen, 4 px innerhalb – auf allen Seiten gleich. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form)::before {
  background: #171922;
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
  content: "";
  inset: 4px;
  pointer-events: none;
  position: absolute;
  z-index: -1;
}

/* Zwischenebenen der Werkzeuge: durchlässig, ihre Teile stehen im Raster der Box. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-generator-prompt, .video-chat-actions, .tk-thema-feld, .tk-eingabe-aktionen, .tk-leiste-rechts, label:has(> textarea), footer) {
  display: contents !important;
}
/* Frühere Abdeckung unter der Leiste – die Leiste steht jetzt unter dem Text. */
:is(html, #eb#vorlage#der#box) body :is(.thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) > .textfeld-deckel { display: none !important; }

/* Text: ohne eigenen Innenabstand – keine Lücke, kein Text unter der Leiste, Scrollbalken links vom Zauberstab bzw. Knopf.
   --eb-grund: Grundhöhe zwei Zeilen; der Baustein lässt das Feld bis auf vier Zeilen wachsen. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) textarea[data-eingabebox-feld] {
  --eb-grund: 40px;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  clip-path: none !important;
  color: #f4f6fb;
  font: 14px/20px "DM Sans", Arial, sans-serif !important;
  grid-area: text !important;
  margin: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
  outline: 0;
  padding: 0 !important;
  position: relative !important;
  resize: none !important;
  width: 100% !important;
}

/* Zauberstab (Prompt-Helfer) rechts neben dem Text. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-prompt-optimize-button, .tk-prompt-assistent) {
  grid-area: zauber !important;
  height: 34px !important;
  inset: auto !important;
  margin: 0 !important;
  position: relative !important;
  transform: none !important;
  width: 34px !important;
}

/* Leiste mit den Einstellungen unter dem Text. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-param-chips, .tk-konfig-halter, .coach-mode-picker) {
  grid-area: leiste !important;
  inset: auto !important;
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  position: relative !important;
  transform: none !important;
}
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe) :is(.video-param-chips, .tk-konfig-halter) { justify-self: stretch !important; width: auto !important; }
:is(html, #eb#vorlage#der#box) body #workspace-body .coach-form .coach-mode-picker { justify-self: start !important; }

/* Knopf mit Preis rechts, oben bündig mit dem Text. Absolut in seinem Rasterbereich: über beide Reihen, ohne deren Höhe
   zu bestimmen (sonst bekäme die Textreihe die 80 px des Knopfs und zwischen Text und Leiste stünde eine Lücke). */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-chat-actions > .cc-button.primary, .tk-leiste-rechts > button, .coach-send) {
  align-self: start !important;
  grid-area: knopf !important;
  height: var(--eb-knopf-hoehe) !important;
  inset: 0 0 auto auto !important;
  margin: 0 !important;
  max-width: none !important;
  min-height: var(--eb-knopf-hoehe) !important;
  min-width: 0 !important;
  position: absolute !important;
  transform: none !important;
  width: var(--eb-knopf-breite) !important;
}

/* Auswahl der Chips klappt nach unten auf (WL16-01, Betreiber 16.10.2026: „die Params müssen nach unten aufklappen, weil sie
   sonst nicht zu sehen sind“) – auch wenn die Box beim Scrollen oben klebt. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe) :is(.cf-param-liste, .cf-param-text, .tk-param-popover) {
  bottom: auto !important;
  top: calc(100% + 8px) !important;
}

/* Die Box ist eine eigene Ebene (isolation), die Kachel „Referenzbilder“ darunter folgt erst danach und lag deshalb über dem
   offenen Menü (WL22-39). Nur bei offenem Menü nach vorn – sonst lägen die Pfeile der Chip-Leiste (z-index 5) dahinter. */
:is(html, #eb#vorlage#der#box) body .thumbnail-production-modal.ist-eingebettet .tk-box > .tk-eingabe:has(.tk-param-popover) {
  z-index: 6 !important;
}

/* Unter dem Zauberstab nur der kreisende Kringel am Knopf, kein Text (WL22-35, Betreiber 22.10.2026: „mach einfach nur einen
   kreisenden kringel als ladezeicehn“). Der Fehlertext lag unter dem Startknopf und war nicht lesbar; er steht weiter im
   Hinweis am Zauberstab. Der Sicherheitshinweis bleibt sichtbar – dann weicht der Prompt von der Eingabe ab. */
:is(html, #eb#vorlage#der#box) body .thumbnail-production-modal.ist-eingebettet .tk-prompt-status.is-error {
  display: none !important;
}

/* Klebt die Box beim Scrollen oben, liegt hinter Box und Bildkacheln ein weicher, dunkler Schatten (WL16-24, Betreiber
   16.10.2026: „wie ein geblurter Schatten, keine Kanten, ein sanfter Übergang“ – die erste Fassung mit runden Ecken wirkte wie
   eine extra Box). Die Fläche selbst ist stark weichgezeichnet (filter: blur) und läuft nach außen aus; keine Rundung, kein
   Rand, kein backdrop-filter (der zeichnet eine harte Kante). Lage und Größe setzt contentfactory-eingabebox.js (--eb-hg-*);
   ganz oben in Ruhe gibt es den Schatten nicht. Der Coach scrollt nicht mit. */
:is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet[data-eingabebox-klebt]::before {
  background: rgba(6, 7, 10, .82);
  content: "";
  filter: blur(26px);
  height: calc(var(--eb-hg-hoehe, 0px) + 36px);
  left: calc(var(--eb-hg-links, 0px) - 18px);
  pointer-events: none;
  position: absolute;
  top: calc(var(--eb-hg-oben, 0px) - 18px);
  width: calc(var(--eb-hg-breite, 0px) + 36px);
  z-index: -1;
}

/* Griff zum Ein- und Aufklappen (MOB17-43) gibt es nur auf Handy und Tablet (Block bis 1024 px unten). */
.eb-klappe { display: none; }

/* Handy und schmale Fenster (MOB17-28, Betreiber 17.10.2026: „die chatbox beim movie studio sieht super aus. bitte für die
   anderen tools so abgucken“): Aufbau wie im Movie Studio – Text über die ganze Breite, darunter Zauberstab und die Leiste (sie
   scrollt samt Modell, Pfeil am Ende), darunter der Knopf mit Preis über die ganze Breite. Die Box nutzt die Bildschirmbreite
   bis auf 8 px. */
@media (max-width: 760px) {
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) {
    --eb-knopf-hoehe: 52px;
    --eb-raster: "text text" "zauber leiste" "knopf knopf";
    --eb-spalten: auto minmax(0, 1fr);
    column-gap: 10px !important;
    padding: 12px !important;
    row-gap: 10px !important;
  }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-prompt-optimize-button, .tk-prompt-assistent) { align-self: center !important; height: 28px !important; width: 28px !important; }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-chat-actions > .cc-button.primary, .tk-leiste-rechts > button, .coach-send) {
    inset: auto !important;
    position: relative !important;
    width: 100% !important;
  }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet {
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    width: auto !important;
  }
}

/* Tablet hochkant (MOB19-21, 19.10.2026): Neben Zauberstab und 120-px-Knopf blieben der Leiste rund 250 px – nur drei Chips,
   der Rest hinter dem Pfeil. Aufbau wie am Handy (Movie-Studio-Vorbild), aber ohne die volle Bildschirmbreite: die Leiste
   bekommt die ganze Breite der Box, der Knopf steht darunter. */
@media (min-width: 761px) and (max-width: 959px) {
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) {
    --eb-knopf-hoehe: 52px;
    --eb-raster: "text text" "zauber leiste" "knopf knopf";
    --eb-spalten: auto minmax(0, 1fr);
    column-gap: 10px !important;
    row-gap: 12px !important;
  }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-prompt-optimize-button, .tk-prompt-assistent) { align-self: center !important; }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-chat-actions > .cc-button.primary, .tk-leiste-rechts > button, .coach-send) {
    inset: auto !important;
    position: relative !important;
    width: 100% !important;
  }
  /* Auch die volle Breite reicht nicht für alle Chips (KI-Video braucht rund 614 px): Sie brechen in eine zweite Zeile um,
     statt seitlich zu scrollen; die Scrollpfeile entfallen. */
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe) :is(.video-param-chips, .tk-param-chips) { flex-wrap: wrap !important; overflow: visible !important; row-gap: 6px !important; }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe) .cf-param-pfeil:not(.ist-kacheln) { display: none !important; }
}

/* MOB19-32 (Betreiber 19.10.2026, iPad 6 quer): „bitte den Apstand entfernen und den hässlicjhen schwarzen hintergrund
   entfernen". Am Tablet trug die klebende Hülle der Eingabebox einen deckenden Grund, der breiter war als die Box, und
   darunter 24 px Abstand – ein schwarzer Block. Dort jetzt ohne Grund und Schatten und ohne den Außenabstand darunter;
   Nachtrag 20.10.2026: Auch der verbliebene untere Rand entfällt vollständig. Gilt für alle
   Werkzeuge mit eingebetteter Eingabebox; am Handy bleibt der Grund (dort füllt die Box die Breite). */
@media (min-width: 761px) and (max-width: 1024px) {
  :is(html, #eb#tablet#ohne#grund#mob1932) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet { background: transparent !important; box-shadow: none !important; }
  :is(html, #eb#tablet#ohne#grund#mob1932) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet > :is(.video-production-dialog, .thumbnail-production-dialog) { margin-bottom: 0 !important; }
  :is(html, #eb#tablet#ohne#grund#mob1932) body #workspace-body > :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet { padding-bottom: 0 !important; }
}

/* Handy und Tablet (MOB17-26, Betreiber 17.10.2026: „bei allen tools außer werbe und movie studio sollte die chatbox da unten
   mitfliegen“): Die Box steht am Ende des Werkzeugbereichs und klebt am unteren Rand – sie bleibt beim Scrollen sichtbar und
   verdeckt am Ende nichts. Der Inhalt dahinter läuft unter einem dunklen Grund aus; Auswahllisten klappen nach oben auf. */
@media (max-width: 1024px) {
  :is(html, #eb#vorlage#der#box) body #workspace-body:has(> :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet) { display: flex !important; flex-direction: column !important; }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet {
    /* Kennzeichen für Skripte (Richtung der Auswahllisten) - so steht die Grenze 1024 px nur hier. */
    --eb-klebt-unten: 1;
    /* Ohne Streifen über der Box (MOB17-52, Betreiber 17.10.2026: „was ist das für eine lücke die muss weg“): kein Innenabstand
       oben, fester Grund mit weichem Schatten nach oben. */
    background: var(--cf-bg, #08090d) !important;
    bottom: 0 !important;
    box-shadow: 0 -12px 18px -10px rgba(0, 0, 0, .7) !important;
    order: 1;
    padding-top: 0 !important;
    top: auto !important;
  }
  /* KI-Bild und Social-Posts: das Raster über der Box trägt nur versteckte Felder, sein Innenabstand stand als Lücke da. */
  :is(html, #eb#vorlage#der#box) body .thumbnail-production-modal.ist-eingebettet fieldset > .workspace-group-grid { padding-top: 0 !important; }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet[data-eingabebox-klebt]::before { display: none; }
  /* MOB18-02/03 (18.10.2026): Die Box steht hier am Ende, direkt unter dem Einstieg folgt der Verlauf. Der kleine Abstand
     aus WL16-10 (gedacht für die Box darunter) wäre dann die Lücke zum Verlauf; wie ohne Box (WL14-36, Handy) 48 px. */
  :is(html, #eb#vorlage#der#box) body #workspace-body > .cf-einstieg-rahmen:has(+ .ist-eingebettet) { margin-bottom: 48px !important; }
  /* Auch im Produktionsfenster (nicht eingebettet) öffnen Auswahllisten bis 1024 px nach oben - wie vor MOB17-26
     (/code-review 17.10.2026). Das Kennzeichen liest contentfactory-video-generator-rebuild.js. */
  .video-production-modal:not(.ist-eingebettet) { --eb-klebt-unten: 1; }
  /* Ganz unten angedockt (MOB17-43, Betreiber 17.10.2026: „bitte die große Lücke entfernen und die chatbox ganz unten
     andocken“): kein Innenabstand unter dem Werkzeugbereich, unter der Box nur ein schmaler Rand. */
  :is(html, #eb#vorlage#der#box) body #workspace-body:has(> :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet) { padding-bottom: 0 !important; }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet { padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important; }
  /* KI-Video hält unter dem Formular Platz für seine Bildkacheln frei (margin-bottom); der Rand der Hülle kommt nicht dazu. */
  :is(html, #eb#vorlage#der#box) body .video-production-modal.ist-eingebettet:not([data-eingabebox-eingeklappt]):has(.video-chat-frame-dock:not([hidden])) { padding-bottom: env(safe-area-inset-bottom, 0px) !important; }

  /* Preis im Knopf mittig unter der Beschriftung (MOB17-46, Betreiber 17.10.2026: „bitte die creditanzeige im button zentriert
     ausrichten. aktuell ist sie ganz links“). */
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.video-chat-actions > .cc-button.primary, .tk-leiste-rechts > button, .coach-send) :is(.media-credit-button-cost, .tk-start-credit) { justify-content: center !important; }

  /* Eingeklappt (MOB17-43: „zu beginn sollte die chatbox eingeklappt sein. Man sollte sie irgendwie aufklappen können“): nur
     Text und Knopf mit Preis; Zauberstab, Leiste und Bildkacheln erscheinen nach dem Aufklappen. Den Griff oben an der Box
     setzt contentfactory-eingabebox.js. */
  :is(html, #eb#vorlage#der#box) body #workspace-body > :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet[data-eingabebox-eingeklappt] :is(.video-generator-form.is-chat-composer, .tk-eingabe) {
    --eb-raster: "text knopf";
    --eb-spalten: minmax(0, 1fr) var(--eb-knopf-breite);
    grid-template-rows: auto !important;
    min-height: calc(var(--eb-knopf-hoehe) + 30px) !important;
  }
  :is(html, #eb#vorlage#der#box) body #workspace-body > :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet[data-eingabebox-eingeklappt] :is(.video-prompt-optimize-button, .tk-prompt-assistent, .video-param-chips, .tk-konfig-halter, .video-generator-form > .video-chat-frame-dock, .tk-anhang-dock, .sp-anhang-kachel) { display: none !important; }
  /* Auch Video bearbeiten zeigt die Kachel zur Videowahl erst nach dem Aufklappen, wie alle Werkzeuge (MOB18-05, Betreiber
     18.10.2026: „sollte eingeklappt sein und erst sichtbar werden beim aufklappen“; ersetzt die Ausnahme aus MOB17-50).
     Der Weg zum Video führt über die Lasche; der freigehaltene Platz unter der Box entfällt eingeklappt. */
  :is(html, #eb#vorlage#der#box) body #workspace-body > .video-production-modal.ist-eingebettet[data-eingabebox-eingeklappt] .video-generator-form.is-chat-composer { margin-bottom: 0 !important; }
  :is(html, #eb#vorlage#der#box) body #workspace-body > :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet[data-eingabebox-eingeklappt] { padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important; }
  /* Griff: kleine Lasche mit runden Ecken auf der Oberkante der Box, drei Griffrillen (MOB17-57, Betreiber 17.10.2026: „c bitte
     aber etwas kleiner dann doch“). Hochschieben klappt auf, Herunterziehen zu, Antippen schaltet um (contentfactory-eingabebox.js).
     Die Greiffläche (::after) ist größer als die sichtbare Lasche; touch-action: none, damit beim Schieben die Seite nicht scrollt. */
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet > .eb-klappe {
    align-items: center;
    background: #20232e;
    border: 0;
    border-radius: 11px 11px 0 0;
    cursor: grab;
    display: flex;
    height: 16px;
    justify-content: center;
    left: 50%;
    padding: 0;
    position: absolute;
    top: -15px;
    touch-action: none;
    transform: translateX(-50%);
    width: 64px;
    z-index: 3;
  }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet > .eb-klappe::before {
    background: rgba(255, 255, 255, .5);
    border-radius: 2px;
    box-shadow: 0 4px 0 rgba(255, 255, 255, .5), 0 8px 0 rgba(255, 255, 255, .5);
    content: "";
    height: 2px;
    transform: translateY(-4px);
    width: 22px;
  }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal, .thumbnail-production-modal).ist-eingebettet > .eb-klappe::after {
    content: "";
    inset: -10px -28px -6px;
    position: absolute;
  }
  :is(html, #eb#vorlage#der#box) body :is(.video-production-modal.ist-eingebettet .video-generator-form.is-chat-composer, .thumbnail-production-modal.ist-eingebettet .tk-eingabe, #workspace-body .coach-form) :is(.cf-param-liste, .cf-param-text, .tk-param-popover) {
    bottom: calc(100% + 8px) !important;
    top: auto !important;
  }
}