/* Das KI-Menü in der Fußleiste der Editoren (21.08.2026).
 *
 * Peter nach dem ersten Blick: *„der ki button muss schöner sein […] die Beschriftung der
 * Möglichkeiten sind gleich groß zu sein als Buttongröße und eine Zeile für das Guthaben […]
 * auch nicht nach unten öffnen, sondern eher nach oben."*
 *
 * Drei Dinge waren daran falsch, und alle drei kamen daher, dass ich die allgemeinen
 * Dropdown-Klassen benutzt habe, ohne sie für diesen Ort zu Ende zu denken:
 *
 * 1. Die Einträge waren unterschiedlich breit, weil sie sich nach ihrem Text richteten —
 *    „Fehlende Felder füllen" brach dabei sogar um.
 * 2. Die Guthabenzeile stand ohne eigene Gestalt unter dem Kasten und wirkte abgefallen.
 * 3. Das Menü klappte nach UNTEN — in einer Fußleiste also aus dem Bild heraus.
 */

/* Nach OBEN aufklappen: Der Knopf steht am unteren Rand des Formulars. */
.ki-menue .dropdown-menu {
    top: auto;
    bottom: calc(100% + var(--space-xs));
    /* Von der LINKEN Kante des Knopfes nach rechts. Die allgemeine Regel richtet Dropdowns
       rechtsbündig aus — das passt in der Kopfzeile, wo alles am rechten Rand hängt. Hier steht
       der Knopf am linken Rand der Fußleiste, und ein rechtsbündiges Menü lief aus dem Bild
       heraus (am 21.08.2026 im Abzug gesehen, nicht vermutet). */
    left: 0;
    right: auto;
    min-width: 15rem;
    padding: var(--space-xs);
}

/* Die Fußleiste liest sich in zwei Gruppen: links, was hilft — rechts, was entscheidet. */
.editor-actions-gruppe {
    display: flex;
    gap: var(--space-sm);
    align-items: center;
}

/* Alle Einträge gleich breit und einzeilig — die Breite bestimmt der Kasten, nicht der Text. */
.ki-menue .ki-eintrag {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: var(--space-sm) var(--space-md);
    border: none;
    border-radius: var(--radius-sm);
    background: transparent;
    color: var(--color-text);
    font: inherit;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
    transition: background var(--transition-fast);
}

.ki-menue .ki-eintrag:hover,
.ki-menue .ki-eintrag:focus-visible {
    background: var(--color-dropdown-hover);
}

/* Eine Zeile, ruhig, abgesetzt: Sie sagt, was der Klick kostet — sie ist kein Eintrag. */
.ki-menue .ki-guthaben {
    display: block;
    margin-top: var(--space-xs);
    padding: var(--space-sm) var(--space-md);
    border-top: 1px solid var(--color-border);
    color: var(--color-text-light);
    font-size: 0.8125rem;
    white-space: nowrap;
}
