/* _content/bettERFramework.KNOW.UI/Components/Editor/KnowLinkPicker.razor.rz.scp.css */
/* ---- Dialog „Verweis einfügen" ----
   Gleiche Sprache wie die Verweis-Chips der Infobox (scharfe Kante, Gelb nur als Rahmen der
   Auswahl): Was man hier wählt, sieht nachher in der Seitenleiste genauso aus. */

.know-pick__lead[b-tm8e8wx3wk] {
    margin: 0 0 0.9rem;
    color: var(--bp-text-muted);
    font-size: 0.86rem;
    line-height: 1.5;
}

.know-pick__tabs[b-tm8e8wx3wk] {
    margin-bottom: 0.75rem;
}

.know-pick__search[b-tm8e8wx3wk],
.know-pick__input[b-tm8e8wx3wk] {
    width: 100%;
    padding: 0.5rem 0.7rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-panel-border);
    color: var(--bp-text);
    font: inherit;
    font-size: 0.9rem;
}

.know-pick__search[b-tm8e8wx3wk]::placeholder,
.know-pick__input[b-tm8e8wx3wk]::placeholder {
    color: var(--bp-text-muted);
}

.know-pick__search:focus[b-tm8e8wx3wk],
.know-pick__input:focus[b-tm8e8wx3wk] {
    outline: none;
    border-color: var(--bp-yellow);
}

/* Feste Höhe statt mitwachsend: Der Dialog soll beim Tippen nicht pumpen — sonst springt der
   Einfügen-Knopf unter dem Mauszeiger weg. */
.know-pick__results[b-tm8e8wx3wk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    height: 17rem;
    margin-top: 0.5rem;
    padding: 2px;
    overflow-y: auto;
    border: 1px solid var(--bp-panel-border);
    scrollbar-color: var(--bp-panel-border) transparent;
    scrollbar-width: thin;
    transition: opacity 160ms ease-out;
}

/* Neue Treffer unterwegs: die alten bleiben stehen, nur leiser — ein Wechsel auf ein Skelett je
   Tastendruck flackerte. */
.know-pick__results.is-busy[b-tm8e8wx3wk] {
    opacity: 0.55;
}

.know-pick__row[b-tm8e8wx3wk] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.1rem;
    width: 100%;
    padding: 0.45rem 0.65rem;
    background: none;
    border: 1px solid transparent;
    color: var(--bp-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.know-pick__row:hover[b-tm8e8wx3wk] {
    background: color-mix(in srgb, var(--bp-text) 5%, transparent);
}

.know-pick__row.is-selected[b-tm8e8wx3wk] {
    border-color: var(--bp-yellow);
    background: color-mix(in srgb, var(--bp-text) 4%, transparent);
}

.know-pick__title[b-tm8e8wx3wk] {
    font-size: 0.88rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.know-pick__subtitle[b-tm8e8wx3wk] {
    font-size: 0.76rem;
    color: var(--bp-text-muted);
}

.know-pick__note[b-tm8e8wx3wk] {
    font-size: 0.76rem;
    color: var(--bp-warn);
}

/* Überholt/abgeschlossen: wählbar, aber ruhig — wie der gedimmte Chip in der Infobox. */
.know-pick__row.is-inactive .know-pick__title[b-tm8e8wx3wk] {
    color: var(--bp-text-muted);
    font-weight: 500;
}

/* Nicht als Verweis schreibbar: sichtbar (sonst sucht man ihn), aber erkennbar nicht einfügbar. */
.know-pick__row.is-blocked[b-tm8e8wx3wk] {
    cursor: default;
}

.know-pick__row.is-blocked .know-pick__title[b-tm8e8wx3wk] {
    color: var(--bp-text-muted);
}

.know-pick__message[b-tm8e8wx3wk] {
    margin: auto;
    padding: 1rem;
    max-width: 34ch;
    color: var(--bp-text-muted);
    font-size: 0.86rem;
    line-height: 1.5;
    text-align: center;
}

.know-pick__message--error[b-tm8e8wx3wk] {
    color: var(--bp-debit);
}

.know-pick__keys[b-tm8e8wx3wk] {
    margin: 0.35rem 0 1rem;
    color: var(--bp-text-muted);
    font-size: 0.74rem;
}

.know-pick__field[b-tm8e8wx3wk] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.know-pick__label[b-tm8e8wx3wk] {
    color: var(--bp-text-muted);
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Der Verweis, wie er in den Text geht — in der Schrift des Editors, denn genau dort steht er
   gleich. Wer ihn hier zweimal gesehen hat, kann ihn auch tippen. */
.know-pick__preview[b-tm8e8wx3wk] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin-top: 0.9rem;
}

.know-pick__code[b-tm8e8wx3wk] {
    padding: 0.45rem 0.7rem;
    background: color-mix(in srgb, var(--bp-text) 4%, transparent);
    border: 1px dashed var(--bp-panel-border);
    color: var(--bp-text);
    font-family: ui-monospace, SFMono-Regular, "Cascadia Mono", Consolas, monospace;
    font-size: 0.84rem;
    overflow-wrap: anywhere;
}

.know-pick__code--empty[b-tm8e8wx3wk] {
    color: var(--bp-text-muted);
    font-family: inherit;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowAreaAccess.razor.rz.scp.css */
/* Bereichsrechte: eine Kartenliste, keine Tabelle — Zustand, Seitenzahl und Personenliste eines
   Bereichs gehören zusammen und sind keine Spalten. */

.know-areas__title[b-2qmecju5e3] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-areas__lead[b-2qmecju5e3] {
    margin: 0.25rem 0 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-area[b-2qmecju5e3] {
    padding: 0;
    overflow: hidden;
}

/* Die Kopfzeile ist die ganze Klickfläche — ein kleiner Pfeil als einziges Ziel wäre eine
   Geduldsprobe. */
.know-area__head[b-2qmecju5e3] {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.85rem 1.15rem;
    border: 0;
    background: none;
    color: var(--bp-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.know-area__head:hover[b-2qmecju5e3] { background: var(--bp-panel); }

.know-area__head:focus-visible[b-2qmecju5e3] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: -2px;
}

.know-area__name[b-2qmecju5e3] {
    font-size: 0.95rem;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.know-area__state[b-2qmecju5e3] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    color: var(--bp-text-muted);
    white-space: nowrap;
}

.know-area__count[b-2qmecju5e3] {
    font-size: 0.78rem;
    color: var(--bp-text-muted);
    white-space: nowrap;
}

.know-area__body[b-2qmecju5e3] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 0 1.15rem 1.15rem;
    border-top: 1px solid var(--bp-panel-border);
    padding-top: 0.85rem;
}

/* Der Sperrschalter: die erste Entscheidung im Rumpf, deshalb etwas kräftiger als der Rest. */
.know-area__lock[b-2qmecju5e3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    font-weight: 500;
    cursor: pointer;
}

.know-area__explain[b-2qmecju5e3] {
    margin: 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

/* Der Hinweis auf die Wirkung: sichtbar, aber kein Fehler — deshalb Warn-Ton statt roter Fläche. */
.know-area__warn[b-2qmecju5e3] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--bp-warn);
    color: var(--bp-warn);
    font-size: 0.82rem;
}

.know-area__users[b-2qmecju5e3] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    gap: 0.3rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.know-area__user[b-2qmecju5e3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.6rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid transparent;
}

.know-area__user:hover[b-2qmecju5e3] { border-color: var(--bp-panel-border); }

.know-area__pick[b-2qmecju5e3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    cursor: pointer;
}

.know-area__user-name[b-2qmecju5e3] {
    font-size: 0.85rem;
    overflow-wrap: anywhere;
}

/* Zwei Stufen, ein Umschalter: nebeneinander statt Auswahlfeld — bei genau zwei Werten ist das
   Aufklappen ein Klick zu viel. */
.know-area__levels[b-2qmecju5e3] {
    display: inline-flex;
    flex-shrink: 0;
}

.know-area__level[b-2qmecju5e3] {
    padding: 0.2rem 0.55rem;
    border: 1px solid var(--bp-panel-border);
    background: none;
    color: var(--bp-text-muted);
    font: inherit;
    font-size: 0.72rem;
    cursor: pointer;
}

.know-area__level + .know-area__level[b-2qmecju5e3] { border-left: 0; }

.know-area__level:hover[b-2qmecju5e3] { color: var(--bp-text); }

.know-area__level.is-active[b-2qmecju5e3] {
    border-color: var(--bp-yellow);
    color: var(--bp-yellow);
}

.know-area__actions[b-2qmecju5e3] {
    display: flex;
    justify-content: flex-end;
    gap: 0.6rem;
}

/* ---- Bereichsverwaltung: Farbpunkt, Umbenennen, Palette ---- */

/* Derselbe Punkt wie auf /know — die Maske zeigt den Bereich so, wie er in der Ablage erscheint. */
.know-area__dot[b-2qmecju5e3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    background: color-mix(in srgb, var(--area-color) 22%, transparent);
    border: 1px solid var(--area-color);
    color: var(--area-color);
    font-size: 0.72rem;
}

.know-area__manage[b-2qmecju5e3] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 1rem;
    padding-bottom: 0.9rem;
    margin-bottom: 0.9rem;
    border-bottom: 1px solid var(--bp-panel-border);
}

.know-area__field[b-2qmecju5e3] { flex: 1 1 16rem; }
.know-area__field--colour[b-2qmecju5e3] { flex: 0 0 auto; }

.know-area__rename[b-2qmecju5e3] {
    display: flex;
    gap: 0.5rem;
}

.know-area__rename .know-field__input[b-2qmecju5e3] { flex: 1 1 auto; }

.know-area__swatches[b-2qmecju5e3] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

/* Die Palette statt eines freien Farbwählers: Freie Wahl brächte Töne, die auf der Navy-Fläche
   nicht lesbar sind, und zwei Bereiche in fast gleichem Grün. */
.know-area__swatch[b-2qmecju5e3] {
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    background: var(--swatch);
    border: 2px solid transparent;
    cursor: pointer;
}

.know-area__swatch:hover[b-2qmecju5e3] { border-color: var(--bp-text-muted); }

.know-area__swatch.is-active[b-2qmecju5e3] {
    border-color: var(--bp-text);
    box-shadow: inset 0 0 0 2px var(--bp-panel);
}

.know-area__swatch:focus-visible[b-2qmecju5e3] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-area__delete[b-2qmecju5e3] { flex: 0 0 auto; }

/* Der Warnsatz vor dem Zusammenführen: gelb, weil er eine Folge ankündigt, die niemand zurückholt. */
.know-area__warn[b-2qmecju5e3] {
    margin-top: 0.6rem;
    color: var(--bp-yellow);
    font-size: 0.85rem;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowHome.razor.rz.scp.css */
/* Einstieg der Wissensablage: das Suchfeld führt, alles andere ordnet sich ihm unter.
   Wiederverwendbare Bausteine (Meta-Zeile, Panel, Liste) liegen in bp-components.css. */

.know-home__title[b-cj7hv5kqbt] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bp-text);
}

/* ---- Suchfeld ---- */

.know-search[b-cj7hv5kqbt] {
    margin-bottom: 1.5rem;
}

.know-search__field[b-cj7hv5kqbt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: min(760px, 100%);
    padding: 0.85rem 1.1rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    transition: border-color 120ms ease-out;
}

/* Fokus trägt die Marke — das Suchfeld ist der Ort, an dem diese Seite arbeitet. */
.know-search__field:focus-within[b-cj7hv5kqbt] {
    border-color: var(--bp-yellow);
}

.know-search__icon[b-cj7hv5kqbt] {
    font-size: 1.1rem;
    color: var(--bp-text-muted);
}

.know-search__input[b-cj7hv5kqbt] {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--bp-text);
    font-size: 1.05rem;
    font-family: inherit;
}

.know-search__input[b-cj7hv5kqbt]::placeholder {
    color: var(--bp-text-muted);
}

/* Der Browser zeichnet in ein type=search sein eigenes Kreuz — es passt in keine Designwelt. */
.know-search__input[b-cj7hv5kqbt]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
}

.know-search__filters[b-cj7hv5kqbt] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

.know-search__count[b-cj7hv5kqbt] {
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

/* ---- Trefferliste ---- */

.know-hits[b-cj7hv5kqbt] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin: 0;
    padding: 0;
    list-style: none;
    max-width: 72ch;
}

.know-hits__title[b-cj7hv5kqbt] {
    font-size: 1.02rem;
    font-weight: 600;
}

.know-hits__snippet[b-cj7hv5kqbt] {
    margin: 0.4rem 0 0;
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--bp-text);
}

/* Der Treffer im Ausschnitt: Markierung ohne Farbfläche — Gelb gehört der Navigation. */
.know-hits__snippet mark[b-cj7hv5kqbt] {
    padding: 0 0.1em;
    background: transparent;
    color: var(--bp-text);
    font-weight: 600;
    box-shadow: inset 0 -0.35em 0 color-mix(in srgb, var(--bp-ci-yellow) 22%, transparent);
}

/* ---- Übersicht (ohne Suchbegriff) ---- */

/* Zwei oder drei Kästen, je nachdem ob „Meine Seiten" etwas zu zeigen hat — deshalb auto-fit
   statt einer festen Spaltenzahl. Unter 22rem je Spalte bricht die Zeile um, statt die Titel
   zu Buchstabensäulen zu quetschen. */
.know-columns[b-cj7hv5kqbt] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
    gap: 1rem;
    align-items: start;
}

/* ---- Seitenbaum (Nebenansicht) ---- */

.know-tree[b-cj7hv5kqbt] {
    margin-top: 1rem;
}

.know-tree__toggle[b-cj7hv5kqbt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0;
    border: 0;
    background: none;
    color: var(--bp-text-muted);
    font: inherit;
    font-size: 0.85rem;
    cursor: pointer;
}

.know-tree__toggle:hover[b-cj7hv5kqbt] {
    color: var(--bp-text);
}

.know-tree__body[b-cj7hv5kqbt] {
    margin-top: 0.5rem;
    padding: 1rem 1.25rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
}

/* ---- Verzeichnis: nach Bereich gruppiert, mehrspaltig ---- */

.know-areas-grid[b-cj7hv5kqbt] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(21rem, 1fr));
    gap: 0.75rem;
    margin-top: 0.75rem;
    align-items: start;
}

.know-areacard[b-cj7hv5kqbt] {
    padding: 0.85rem 1rem;
}

.know-areacard__head[b-cj7hv5kqbt] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.55rem;
    margin: 0 0 0.5rem;
    font-size: 0.9rem;
    font-weight: 600;
}

/* Der Bereichspunkt trägt die gepflegte Farbe; ein Symbol sitzt darin statt daneben, damit die
   Zeilen unabhängig davon bündig bleiben, ob ein Bereich eines hat. */
.know-areacard__dot[b-cj7hv5kqbt] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    background: color-mix(in srgb, var(--area-color) 22%, transparent);
    border: 1px solid var(--area-color);
    color: var(--area-color);
    font-size: 0.72rem;
}

.know-areacard__name[b-cj7hv5kqbt] { overflow-wrap: anywhere; }

.know-areacard__count[b-cj7hv5kqbt] {
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--bp-text-muted);
}

.know-areacard__list[b-cj7hv5kqbt] {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Die Einrückung zeigt die Baumtiefe — sie bleibt die Ordnung, nur innerhalb des Bereichs. */
.know-areacard__row[b-cj7hv5kqbt] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.45rem;
    padding: 0.22rem 0 0.22rem calc(var(--depth, 0) * 0.85rem);
    font-size: 0.85rem;
}

.know-areacard__link[b-cj7hv5kqbt] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Der Vorschau-Knopf erscheint erst beim Überfahren der Zeile: In einer Liste mit achtzig Zeilen
   wären achtzig sichtbare Knöpfe eine Wand. */
.know-areacard__peek[b-cj7hv5kqbt] {
    padding: 0.1rem 0.25rem;
    border: 0;
    background: none;
    color: var(--bp-text-muted);
    font: inherit;
    cursor: pointer;
    opacity: 0;
}

.know-areacard__row:hover .know-areacard__peek[b-cj7hv5kqbt],
.know-areacard__peek:focus-visible[b-cj7hv5kqbt] { opacity: 1; }

.know-areacard__peek:hover[b-cj7hv5kqbt] { color: var(--bp-yellow); }

/* ---- Vorschau-Panel ---- */

.know-peek[b-cj7hv5kqbt] {
    position: sticky;
    bottom: 1rem;
    margin-top: 1rem;
    padding: 0.9rem 1.1rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-yellow);
}

.know-peek__head[b-cj7hv5kqbt] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.5rem;
}

.know-peek__title[b-cj7hv5kqbt] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.know-peek__close[b-cj7hv5kqbt] {
    border: 0;
    background: none;
    color: var(--bp-text-muted);
    font: inherit;
    cursor: pointer;
}

.know-peek__close:hover[b-cj7hv5kqbt] { color: var(--bp-text); }

.know-peek__meta[b-cj7hv5kqbt] { margin-top: 0.4rem; }

.know-peek__excerpt[b-cj7hv5kqbt] {
    margin: 0.6rem 0 0;
    font-size: 0.85rem;
    line-height: 1.5;
    color: var(--bp-text);
}

.know-peek__excerpt--empty[b-cj7hv5kqbt] { color: var(--bp-text-muted); font-style: italic; }

.know-peek__facts[b-cj7hv5kqbt] {
    margin-top: 0.5rem;
    font-size: 0.78rem;
    color: var(--bp-text-muted);
}

.know-peek__open[b-cj7hv5kqbt] {
    display: inline-block;
    margin-top: 0.6rem;
    font-size: 0.85rem;
}

/* Herkunft eines Treffers aus einem Anhang — gelb wie die Verweise, weil es dieselbe Aussage ist:
   „hier geht es weiter, aber woanders hin, als du denkst". */
.know-hits__source[b-cj7hv5kqbt] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--bp-yellow);
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowImport.razor.rz.scp.css */
/* Übernahme aus Notion: zwei Karten untereinander, Datei oben, Vorschau darunter.
   Wiederverwendbare Bausteine (Karte, Chip, Meta-Zeile) liegen in bp-components.css. */

.know-import__lead[b-d5qdw183bx] {
    margin: 0.35rem 0 0;
    color: var(--bp-text-muted);
    font-size: 0.9rem;
}

.know-import__panel[b-d5qdw183bx] {
    padding: 1.25rem 1.5rem;
}

.know-import__panel-head[b-d5qdw183bx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.know-import__panel-title[b-d5qdw183bx] {
    margin: 0 0 0.9rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-import__panel-head .know-import__panel-title[b-d5qdw183bx] {
    margin-bottom: 0;
}

.know-import__quiet[b-d5qdw183bx] {
    color: var(--bp-text-muted);
    font-size: 0.875rem;
}

/* ---- Datei wählen ---- */

/* Das Feld ist ein <label> um ein verstecktes <input type=file> — ein Klick irgendwo darauf
   öffnet den Dateidialog, ohne dass die Seite dafür JavaScript braucht. */
.know-import__drop[b-d5qdw183bx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 2.25rem 1.5rem;
    border: 1px dashed var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    background: var(--bp-panel);
    cursor: pointer;
    transition: border-color 120ms ease-out;
}

.know-import__drop:hover[b-d5qdw183bx],
.know-import__drop:focus-within[b-d5qdw183bx] {
    border-color: var(--bp-yellow);
}

.know-import__drop input[type="file"][b-d5qdw183bx] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.know-import__drop-icon[b-d5qdw183bx] {
    font-size: 1.6rem;
    color: var(--bp-text-muted);
}

.know-import__drop-text[b-d5qdw183bx] {
    font-weight: 600;
    color: var(--bp-text);
}

.know-import__howto[b-d5qdw183bx] {
    margin: 1rem 0 0;
    padding-left: 1.25rem;
    color: var(--bp-text-muted);
    font-size: 0.875rem;
    line-height: 1.7;
}

.know-import__file[b-d5qdw183bx] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.know-import__file-name[b-d5qdw183bx] {
    font-weight: 600;
    color: var(--bp-text);
    word-break: break-all;
}

.know-import__skipped[b-d5qdw183bx] {
    margin-top: 0.9rem;
    color: var(--bp-text-muted);
    font-size: 0.875rem;
}

.know-import__skipped ul[b-d5qdw183bx] {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
    line-height: 1.6;
}

/* ---- Zahlen der Vorschau ---- */

.know-import__counts[b-d5qdw183bx] {
    display: flex;
    gap: 2.5rem;
    margin: 1.25rem 0 0.75rem;
    flex-wrap: wrap;
}

.know-import__count[b-d5qdw183bx] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.know-import__count-value[b-d5qdw183bx] {
    font-size: 1.75rem;
    font-weight: 600;
    line-height: 1;
    color: var(--bp-text);
}

/* Übersprungenes ist kein Erfolg und kein Fehler — es tritt zurück, statt mitzuzählen. */
.know-import__count--quiet .know-import__count-value[b-d5qdw183bx] {
    color: var(--bp-text-muted);
}

.know-import__count-label[b-d5qdw183bx] {
    font-size: 0.8rem;
    color: var(--bp-text-muted);
}

.know-import__note[b-d5qdw183bx] {
    margin: 0.25rem 0 0;
    color: var(--bp-text-muted);
    font-size: 0.875rem;
}

.know-import__note--done[b-d5qdw183bx] {
    color: var(--bp-text);
}

/* Hinweis auf einen grossen Lauf: sichtbar, aber kein Fehler — deshalb der Warn-Ton und keine
   rote Flaeche. Er haelt niemanden auf, er sagt nur, was der Lauf kostet. */
.know-import__warn[b-d5qdw183bx] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0.25rem 0 0;
    padding: 0.6rem 0.75rem;
    border: 1px solid var(--bp-warn);
    color: var(--bp-warn);
    font-size: 0.875rem;
}

.know-import__sub[b-d5qdw183bx] {
    margin: 1.5rem 0 0.6rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-import__messages[b-d5qdw183bx] {
    margin: 0;
    padding-left: 1.25rem;
    color: var(--bp-text-muted);
    font-size: 0.875rem;
    line-height: 1.7;
}

.know-import__messages > li + li[b-d5qdw183bx] {
    margin-top: 0.6rem;
}

.know-import__entry-title[b-d5qdw183bx] {
    color: var(--bp-text);
    font-weight: 600;
    margin-right: 0.5rem;
}

.know-import__done-actions[b-d5qdw183bx] {
    margin-top: 1.5rem;
}

/* ---- Quellenauswahl ---- */

.know-sources[b-d5qdw183bx] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
    gap: 0.6rem;
    margin-top: 0.75rem;
}

.know-source[b-d5qdw183bx] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.7rem;
    padding: 0.7rem 0.8rem;
    border: 1px solid var(--bp-panel-border);
    background: transparent;
    color: var(--bp-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.know-source:hover:not(:disabled)[b-d5qdw183bx] { border-color: var(--bp-yellow); }

.know-source:focus-visible[b-d5qdw183bx] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

/* Die gewählte Quelle trägt den CI-Rahmen — gefüllt wäre sie eine gelbe Fläche, und die gehört
   der Navigation (DESIGN.md, Anti-Patterns). */
.know-source.is-active[b-d5qdw183bx] {
    border-color: var(--bp-yellow);
    box-shadow: inset 0 0 0 1px var(--bp-yellow);
}

/* Noch nicht gebaut: sichtbar, aber erkennbar nicht wählbar. */
.know-source--soon[b-d5qdw183bx] {
    cursor: not-allowed;
    opacity: 0.55;
}

/* Das Format-Kürzel trägt die Kennfarbe der Quelle — sie leistet hier, was sonst ein Anbieterlogo
   leistete: acht Kacheln auf einen Blick unterscheidbar machen. Bewusst KEINE Anbieterfarben
   nachgebaut, sondern dieselbe Palette wie die Bereichspunkte auf /know. */
.know-source__format[b-d5qdw183bx] {
    min-width: 3.1rem;
    padding: 0.3rem 0.4rem;
    background: color-mix(in srgb, var(--source-color) 18%, transparent);
    border: 1px solid var(--source-color);
    color: var(--source-color);
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-align: center;
}

/* Eine noch nicht gebaute Quelle wird grau: Die Kachel ist ohnehin ausgegraut, und eine kräftige
   Farbe daneben sähe aus wie ein Angebot, das sie nicht ist. */
.know-source--soon .know-source__format[b-d5qdw183bx] {
    background: transparent;
    border-color: var(--bp-panel-border);
    color: var(--bp-text-muted);
}

.know-source__body[b-d5qdw183bx] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.know-source__name[b-d5qdw183bx] {
    font-size: 0.9rem;
    font-weight: 500;
}

.know-source__hint[b-d5qdw183bx] {
    font-size: 0.74rem;
    color: var(--bp-text-muted);
    overflow-wrap: anywhere;
}

.know-source__badge[b-d5qdw183bx] { font-size: 0.65rem; }

/* Solange keine Quelle gewählt ist, ist das Ablagefeld sichtbar zu. */
.know-import__drop--disabled[b-d5qdw183bx] {
    cursor: not-allowed;
    opacity: 0.5;
}

/* Fortschritt: Zahlen über dem Balken. Ein Balken allein sagt „es läuft"; die Zahl darüber sagt
   „wie lange noch" — das ist die Frage, die man bei einem minutenlangen Lauf stellt. */
.know-import__progress[b-d5qdw183bx] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-top: 0.75rem;
}

.know-import__running[b-d5qdw183bx] {
    margin: 0;
    font-size: 0.85rem;
    color: var(--bp-text);
}

.know-import__current[b-d5qdw183bx] {
    margin-left: 0.35rem;
    color: var(--bp-text-muted);
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowLearning.razor.rz.scp.css */
/* „Meine Schulungen" — Karten je Schulung, jede eine Arbeitsliste. */

.know-learning[b-ny59rdfbh8] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
    gap: 1rem;
    align-items: start;
}

.know-learning__course[b-ny59rdfbh8] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
    padding: var(--bp-space-4);
}

.know-learning__head[b-ny59rdfbh8] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--bp-space-3);
}

.know-learning__title[b-ny59rdfbh8] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-learning__count[b-ny59rdfbh8] {
    font-size: 0.82rem;
    color: var(--bp-text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.know-learning__count.is-done[b-ny59rdfbh8] {
    color: var(--bp-credit);
}

.know-learning__lessons[b-ny59rdfbh8] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.know-learning__lesson[b-ny59rdfbh8] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: var(--bp-space-3);
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--bp-panel-border);
    font-size: 0.88rem;
}

.know-learning__lesson:last-child[b-ny59rdfbh8] {
    border-bottom: 0;
}

.know-learning__time[b-ny59rdfbh8] {
    color: var(--bp-text-muted);
    font-size: 0.78rem;
    white-space: nowrap;
}

.know-learning__next[b-ny59rdfbh8] {
    align-self: flex-start;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowLesson.razor.rz.scp.css */
/* Lektion lesen und beantworten — eine Spalte in Lesebreite. */

.know-lesson__course[b-5rejek2o08] {
    font-size: 0.82rem;
}

.know-lesson__meta[b-5rejek2o08] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-lesson__body[b-5rejek2o08] {
    padding: 1.5rem 2rem 3rem;
    max-width: 46rem;
}

.know-quiz[b-5rejek2o08] {
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--bp-panel-border);
}

.know-quiz__title[b-5rejek2o08] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--bp-text);
}

/* Gesperrt sichtbar statt versteckt: Wer die Fragen sucht, sieht, dass und wann sie kommen. */
.know-quiz__locked[b-5rejek2o08] {
    margin: 0;
    padding: var(--bp-space-3) var(--bp-space-4);
    border: 1px dashed var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    color: var(--bp-text-muted);
    font-size: 0.88rem;
}

.know-quiz__questions[b-5rejek2o08] {
    margin: 0;
    padding-left: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.know-quiz__question[b-5rejek2o08] {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.know-quiz__question legend[b-5rejek2o08] {
    padding: 0;
    margin-bottom: 0.5rem;
    color: var(--bp-text);
    font-weight: 500;
    line-height: 1.45;
}

.know-quiz__option[b-5rejek2o08] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.45rem 0.6rem;
    border-radius: 6px;
    color: var(--bp-text);
    cursor: pointer;
    line-height: 1.4;
}

.know-quiz__option:hover[b-5rejek2o08] {
    background: var(--bp-panel);
}

.know-quiz__option input[b-5rejek2o08] {
    margin-top: 0.2rem;
    accent-color: var(--bp-yellow);
}

.know-quiz__option:focus-within[b-5rejek2o08] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 1px;
}

.know-quiz__option.is-correct[b-5rejek2o08] {
    color: var(--bp-credit);
}

.know-quiz__option.is-wrong[b-5rejek2o08] {
    color: var(--bp-debit);
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}

.know-quiz__question:disabled .know-quiz__option[b-5rejek2o08] {
    cursor: default;
}

.know-quiz__result[b-5rejek2o08] {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-3);
    margin-bottom: 1.25rem;
    padding: var(--bp-space-3) var(--bp-space-4);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    color: var(--bp-text-muted);
    font-size: 0.88rem;
}

.know-quiz__verdict[b-5rejek2o08] {
    font-weight: 600;
    font-size: 1rem;
}

.know-quiz__result.is-passed .know-quiz__verdict[b-5rejek2o08] {
    color: var(--bp-credit);
}

.know-quiz__result.is-failed .know-quiz__verdict[b-5rejek2o08] {
    color: var(--bp-warn);
}

.know-quiz__actions[b-5rejek2o08] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    margin-top: 1.5rem;
}

.know-lesson__language[b-5rejek2o08] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
}

/* Hinweis über einer übersetzten Geschichte: ruhig, mit KI-Zeichen und dem Weg zurück zum Original. */
.know-lesson__translated[b-5rejek2o08] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    margin: 0 0 1rem;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-lesson__original[b-5rejek2o08] {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: var(--bp-text);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: var(--bp-text-muted);
    cursor: pointer;
}

.know-lesson__original:focus-visible[b-5rejek2o08] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowLessonPreview.razor.rz.scp.css */
/* Vorschau einer Lektion: dieselbe Optik wie die Lernansicht (KnowLesson.razor.css, CSS-Isolierung verhindert
   das Teilen) — plus der Streifen, der sagt, dass nichts gespeichert wird. */


.know-lesson__course[b-bb97bb1ek0] {
    font-size: 0.82rem;
}

.know-lesson__meta[b-bb97bb1ek0] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-lesson__body[b-bb97bb1ek0] {
    padding: 1.5rem 2rem 3rem;
    max-width: 46rem;
}

.know-quiz[b-bb97bb1ek0] {
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--bp-panel-border);
}

.know-quiz__title[b-bb97bb1ek0] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--bp-text);
}

/* Gesperrt sichtbar statt versteckt: Wer die Fragen sucht, sieht, dass und wann sie kommen. */
.know-quiz__locked[b-bb97bb1ek0] {
    margin: 0;
    padding: var(--bp-space-3) var(--bp-space-4);
    border: 1px dashed var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    color: var(--bp-text-muted);
    font-size: 0.88rem;
}

.know-quiz__questions[b-bb97bb1ek0] {
    margin: 0;
    padding-left: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.know-quiz__question[b-bb97bb1ek0] {
    margin: 0;
    padding: 0;
    border: 0;
    min-width: 0;
}

.know-quiz__question legend[b-bb97bb1ek0] {
    padding: 0;
    margin-bottom: 0.5rem;
    color: var(--bp-text);
    font-weight: 500;
    line-height: 1.45;
}

.know-quiz__option[b-bb97bb1ek0] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.45rem 0.6rem;
    border-radius: 6px;
    color: var(--bp-text);
    cursor: pointer;
    line-height: 1.4;
}

.know-quiz__option:hover[b-bb97bb1ek0] {
    background: var(--bp-panel);
}

.know-quiz__option input[b-bb97bb1ek0] {
    margin-top: 0.2rem;
    accent-color: var(--bp-yellow);
}

.know-quiz__option:focus-within[b-bb97bb1ek0] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 1px;
}

.know-quiz__option.is-correct[b-bb97bb1ek0] {
    color: var(--bp-credit);
}

.know-quiz__option.is-wrong[b-bb97bb1ek0] {
    color: var(--bp-debit);
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}

.know-quiz__question:disabled .know-quiz__option[b-bb97bb1ek0] {
    cursor: default;
}

.know-quiz__result[b-bb97bb1ek0] {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-3);
    margin-bottom: 1.25rem;
    padding: var(--bp-space-3) var(--bp-space-4);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    color: var(--bp-text-muted);
    font-size: 0.88rem;
}

.know-quiz__verdict[b-bb97bb1ek0] {
    font-weight: 600;
    font-size: 1rem;
}

.know-quiz__result.is-passed .know-quiz__verdict[b-bb97bb1ek0] {
    color: var(--bp-credit);
}

.know-quiz__result.is-failed .know-quiz__verdict[b-bb97bb1ek0] {
    color: var(--bp-warn);
}

.know-quiz__actions[b-bb97bb1ek0] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    margin-top: 1.5rem;
}


.know-preview__banner[b-bb97bb1ek0] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    margin: 0 0 1rem;
    padding: 0.6rem 1rem;
    border-radius: var(--bp-radius);
    background: color-mix(in srgb, var(--bp-blue) 14%, transparent);
    color: var(--bp-text);
    font-size: 0.85rem;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowPages.razor.rz.scp.css */
/* Tabellensicht auf die Ablage. Raster, Zeilen und Pager kommen aus dem gethemten Grid
   (bp-components.css) — hier steht nur, was diese Seite darüber legt. */

.know-pages__title[b-3otlir5kdh] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-pages__subtitle[b-3otlir5kdh] {
    margin: 0.25rem 0 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-pages__filters[b-3otlir5kdh] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Das Filterfeld trägt die Breite der Seite, nicht die eines Formularfelds: Es ist der
   Haupteinstieg in die Tabelle, nicht eine Angabe unter vielen. */
.know-pages__search[b-3otlir5kdh] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--bp-panel-border);
    background: var(--bp-panel);
    color: var(--bp-text);
    font-family: inherit;
    font-size: 0.88rem;
}

.know-pages__search[b-3otlir5kdh]::placeholder {
    color: var(--bp-text-muted);
}

.know-pages__search:focus[b-3otlir5kdh] {
    outline: none;
    border-color: var(--bp-yellow);
}

/* Die Reiter stehen dicht unter der Filterzeile — sie sind ihre zweite Achse, nicht ein
   eigener Abschnitt. */
.know-pages__areas[b-3otlir5kdh] {
    margin: 0;
}

.know-pages__status[b-3otlir5kdh] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.know-pages__tags[b-3otlir5kdh] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

/* Aktionsleiste über der Tabelle — erscheint erst mit Auswahl. Gelber Rahmen, weil sie einen
   Zustand anzeigt, der auf eine Handlung wartet. */
.know-pages__bulk[b-3otlir5kdh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding: 0.7rem 0.9rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-yellow);
}

.know-pages__bulk-count[b-3otlir5kdh] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--bp-text);
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowPageView.razor.rz.scp.css */
/* Eine Wissensseite: Lesen ist der Normalfall, Bearbeiten der Ausnahmezustand derselben Seite.
   Fließtext, Meta-Zeile und Listen liegen in bp-components.css. */

.know-page__crumbs[b-m7qabafgg1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    color: var(--bp-text-muted);
}

.know-page__title[b-m7qabafgg1] {
    margin: 0.15rem 0 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--bp-text);
}

/* Im Bearbeiten-Modus bleibt der Titel an seinem Platz — er wird zum Feld, nicht zu einer Zeile
   weiter unten; sonst springt die Seite beim Umschalten. */
.know-page__title-input[b-m7qabafgg1] {
    width: min(48rem, 100%);
    margin: 0.15rem 0 0;
    padding: 0.15rem 0;
    border: 0;
    border-bottom: 1px solid var(--bp-panel-border);
    background: transparent;
    color: var(--bp-text);
    font-family: inherit;
    font-size: 1.5rem;
    font-weight: 600;
}

.know-page__title-input:focus[b-m7qabafgg1] {
    outline: none;
    border-bottom-color: var(--bp-yellow);
}

.know-page__body[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.know-page__meta[b-m7qabafgg1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

.know-page__facts[b-m7qabafgg1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-page__fact[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.know-page__fact--author[b-m7qabafgg1] {
    margin-left: auto;
}

/* ---- Eigenschaften im Bearbeiten-Modus ---- */

.know-field[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 12rem;
    flex: 1 1 12rem;
}

.know-field--wide[b-m7qabafgg1] {
    flex: 1 1 100%;
}

.know-field__label[b-m7qabafgg1] {
    font-size: 0.75rem;
    color: var(--bp-text-muted);
}

.know-field__input[b-m7qabafgg1] {
    padding: 0.4rem 0.6rem;
    background: var(--bp-surface);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius);
    color: var(--bp-text);
    font: inherit;
    font-size: 0.9rem;
}

.know-field__input:focus[b-m7qabafgg1] {
    outline: none;
    border-color: var(--bp-yellow);
}

/* ---- Markdown-Editor mit Vorschau ---- */

.know-editor[b-m7qabafgg1] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
    min-height: 26rem;
}

.know-editor__input[b-m7qabafgg1] {
    width: 100%;
    min-height: 26rem;
    padding: 1rem 1.1rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    color: var(--bp-text);
    font-family: ui-monospace, SFMono-Regular, "Cascadia Mono", Consolas, monospace;
    font-size: 0.88rem;
    line-height: 1.6;
    resize: vertical;
    tab-size: 2;
}

.know-editor__input:focus[b-m7qabafgg1] {
    outline: none;
    border-color: var(--bp-yellow);
}

.know-editor__preview[b-m7qabafgg1] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
    background: var(--bp-panel);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
}

/* ---- Dateien an der Seite ---- */

.know-files[b-m7qabafgg1] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
}

/* Der Browser zeichnet für ein <input type=file> einen eigenen Knopf, der in keiner Designwelt
   sitzt — das Feld wird versteckt, die Beschriftung ist der Knopf. */
.know-files__add[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.8rem;
    background: var(--bp-panel);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    color: var(--bp-text);
    font-size: 0.85rem;
    cursor: pointer;
}

.know-files__add:hover[b-m7qabafgg1] {
    border-color: var(--bp-yellow);
}

.know-files__add:focus-within[b-m7qabafgg1] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-files__add input[type="file"][b-m7qabafgg1] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.know-files__hint[b-m7qabafgg1],
.know-files__size[b-m7qabafgg1] {
    font-size: 0.78rem;
    color: var(--bp-text-muted);
}

.know-files__list[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.know-files__item[b-m7qabafgg1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
}

.know-files__action[b-m7qabafgg1] {
    border: 0;
    background: none;
    padding: 0;
    color: var(--bp-text-muted);
    font: inherit;
    font-size: 0.78rem;
    text-decoration: underline;
    cursor: pointer;
}

.know-files__action:hover[b-m7qabafgg1] {
    color: var(--bp-text);
}

.know-files__action--danger:hover[b-m7qabafgg1] {
    color: var(--bp-debit);
}

.know-page__children[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--bp-panel-border);
}

/* --- Lesesicht: Text links, Infobox rechts ------------------------------------------------ */

/* Der Text bekommt die Breite, die Fakten die Kante. 2fr/1fr statt fester Spalten: die Infobox
   soll auf einem schmalen Fenster mitgehen, nicht den Fließtext unter die Messgrenze drücken. */
.know-page__split[b-m7qabafgg1] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 1.5rem;
    align-items: start;
    min-width: 0;
}

.know-page__main[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-width: 0;
}

/* Die Infobox klebt beim Scrollen: Wer in einem langen Text steht, will Status und Gliederung
   sehen, ohne zurückzuspringen. */
.know-aside[b-m7qabafgg1] {
    position: sticky;
    top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    /* Höher als das Fenster (langes Verzeichnis, viele Verweise): Die Leiste scrollt in sich,
       sonst bliebe ihr unteres Ende beim Kleben unerreichbar. */
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--bp-text-faint) transparent;
}

.know-aside__card[b-m7qabafgg1] {
    padding: 1rem 1.15rem;
}

/* --- Faktenliste (Hausmuster dl/dt/dd wie XrmAccountDetail) -------------------------------- */

.know-facts[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    margin: 0.5rem 0 0;
}

.know-facts__row[b-m7qabafgg1] {
    display: grid;
    grid-template-columns: 7.5rem 1fr;
    gap: 0.5rem;
    padding: 0.42rem 0;
    border-bottom: 1px solid var(--bp-panel-border);
}

.know-facts__row:last-child[b-m7qabafgg1] {
    border-bottom: 0;
}

.know-facts dt[b-m7qabafgg1] {
    margin: 0;
    font-size: 0.78rem;
    color: var(--bp-text-muted);
}

.know-facts dd[b-m7qabafgg1] {
    margin: 0;
    font-size: 0.84rem;
    color: var(--bp-text);
    overflow-wrap: anywhere;
}

.know-facts__author[b-m7qabafgg1] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
}

/* Der Kreis behält seine Größe: Als Flex-Kind schrumpfte er neben einem langen Namen zur Ellipse,
   und Name und Kreis schoben sich übereinander. */
.know-facts__author[b-m7qabafgg1]  .bp-avatar {
    flex: 0 0 auto;
}

.know-facts__who[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.3;
}

.know-facts__when[b-m7qabafgg1] {
    font-size: 0.76rem;
    color: var(--bp-text-muted);
    font-variant-numeric: tabular-nums;
}

.know-facts__tags[b-m7qabafgg1] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

/* Ein Schlagwort führt in die Tabellensicht, auf den eigenen Filter — deshalb ein echter Link
   und kein reiner Anzeige-Chip. */
.know-tag[b-m7qabafgg1] {
    text-decoration: none;
}

.know-tag:hover[b-m7qabafgg1] {
    border-color: var(--bp-yellow);
    color: var(--bp-yellow);
}

/* --- Objektverweise ------------------------------------------------------------------------ */

.know-links[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin: 0.5rem 0 0;
    padding: 0;
    list-style: none;
}

.know-link[b-m7qabafgg1] {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
    border: 1px solid var(--bp-panel-border);
    color: var(--bp-text);
    font-size: 0.82rem;
    text-decoration: none;
}

a.know-link:hover[b-m7qabafgg1] {
    border-color: var(--bp-yellow);
}

/* Das Modul-Kürzel trägt die Herkunft — klein, ruhig, immer an derselben Stelle, damit die
   Spalte beim Überfliegen eine Spalte bleibt. */
.know-link__module[b-m7qabafgg1] {
    font-size: 0.68rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--bp-text-muted);
    text-transform: uppercase;
}

.know-link__title[b-m7qabafgg1] {
    overflow-wrap: anywhere;
}

.know-link__subtitle[b-m7qabafgg1] {
    grid-column: 2;
    font-size: 0.74rem;
    color: var(--bp-text-muted);
}

/* Abgeschlossen/archiviert: der Verweis gilt noch, das Ziel ruht. */
.know-link--inactive .know-link__title[b-m7qabafgg1] {
    color: var(--bp-text-muted);
}

/* Gelöscht oder nicht sichtbar: sichtbar bleiben, aber nicht anklickbar aussehen. Das
   Durchstreichen sagt „war einmal" — ein verschwundener Verweis sagte gar nichts. */
.know-link--missing[b-m7qabafgg1] {
    border-style: dashed;
}

.know-link--missing .know-link__title[b-m7qabafgg1] {
    color: var(--bp-text-muted);
    text-decoration: line-through;
}

/* --- Inhaltsverzeichnis -------------------------------------------------------------------- */

.know-outline[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    margin-top: 0.5rem;
}

.know-outline__item[b-m7qabafgg1] {
    padding: 0.28rem 0 0.28rem 0.6rem;
    border-left: 1px solid var(--bp-panel-border);
    color: var(--bp-text-muted);
    font-size: 0.82rem;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.know-outline__item:hover[b-m7qabafgg1] {
    border-left-color: var(--bp-yellow);
    color: var(--bp-text);
}

.know-outline__item--h3[b-m7qabafgg1] {
    padding-left: 1.4rem;
    font-size: 0.78rem;
}

/* --- Hinweis unter dem Editor --------------------------------------------------------------- */

.know-editor__hint[b-m7qabafgg1] {
    margin: 0;
    font-size: 0.78rem;
    color: var(--bp-text-muted);
}

/* Knopf und Schreibweise in einer Zeile: Klicken und Tippen sind zwei Wege zum selben Verweis. */
.know-editor__linkbar[b-m7qabafgg1] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}

/* Ruhiger Umriss-Knopf: Werkzeug am Feld, keine Seitenaktion — die gelbe Primäraktion bleibt
   „Speichern" im Kopf. */
.know-editor__link[b-m7qabafgg1] {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.45rem;
    padding: 0.35rem 0.6rem;
    background: none;
    border: 1px solid var(--bp-panel-border);
    color: var(--bp-text);
    font: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 160ms ease-out;
}

.know-editor__link:hover[b-m7qabafgg1] {
    border-color: var(--bp-text-muted);
}

.know-editor__link:focus-visible[b-m7qabafgg1] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-editor__link .e-icons[b-m7qabafgg1] {
    color: var(--bp-text-muted);
    font-size: 0.9rem;
}

.know-editor__kbd[b-m7qabafgg1] {
    padding: 0 0.3rem;
    border: 1px solid var(--bp-panel-border);
    color: var(--bp-text-muted);
    font-family: inherit;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.5;
}

/* Unter 1200px hat die Infobox keine sinnvolle Breite mehr — sie wandert unter den Text und
   gibt das Kleben auf (eine klebende Leiste, die den halben Schirm füllt, ist eine Sperre). */
@media (max-width: 1200px) {
    .know-page__split[b-m7qabafgg1] {
        grid-template-columns: minmax(0, 1fr);
    }

    .know-aside[b-m7qabafgg1] {
        position: static;
        max-height: none;
        overflow: visible;
    }
}

/* ---- KI-Zusammenfassung der Anhänge ---- */

/* Der Schalter trägt LILA und das KI-Zeichen — Hausregel für jede KI-Aktion, ohne Ausnahme. */
.know-files__ai[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.6rem;
    font-size: 0.85rem;
    cursor: pointer;
}

.know-files__row[b-m7qabafgg1] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

/* Der Kurztext steht eingerückt UNTER der Datei — er gehört zu ihr, konkurriert aber nicht mit
   dem Dateinamen, der das Sprungziel ist. */
.know-files__summary[b-m7qabafgg1] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    margin: 0.2rem 0 0 1.4rem;
    color: var(--bp-text-muted);
    font-size: 0.82rem;
    line-height: 1.45;
}

.know-files__progress[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.know-files__progress-text[b-m7qabafgg1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 0.85rem;
}

.know-files__progress-count[b-m7qabafgg1] { color: var(--bp-text-muted); }

/* Läuft gerade die KI, wird der Schritt lila — dieselbe Farbe wie der Schalter, damit sichtbar
   bleibt, WOFÜR gerade Geld ausgegeben wird. */
.know-files__ai-active[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--bp-purple);
}

/* Der Nachrüst-Knopf dreht sich, solange die KI arbeitet. */
.know-files__spin[b-m7qabafgg1] {
    display: inline-block;
    animation: know-files-spin-b-m7qabafgg1 1.2s linear infinite;
}

@keyframes know-files-spin-b-m7qabafgg1 {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .know-files__spin[b-m7qabafgg1] { animation: none; }
}

/* ---- KI-Entwurf des Seitentextes ---- */

.know-editor__tools[b-m7qabafgg1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.know-editor__tools-hint[b-m7qabafgg1] {
    color: var(--bp-text-muted);
    font-size: 0.8rem;
}

/* Der Entwurfs-Knopf spricht dieselbe Sprache wie der Zusammenfassen-Schalter ueber der Ablage:
   lila Flaeche, eigenes Feld fuer das KI-Zeichen, Preis in der zweiten Zeile. Zwei KI-Aktionen auf
   einer Seite, die verschieden aussehen, lesen sich wie zwei verschiedene Dinge. */
.know-editor__ai[b-m7qabafgg1] {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 0.6rem;
    width: 100%;
    padding: 0.6rem 0.9rem;
    background: color-mix(in srgb, var(--bp-purple) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--bp-purple) 35%, transparent);
    text-align: left;
    cursor: pointer;
}

.know-editor__ai:hover:not(:disabled)[b-m7qabafgg1],
.know-editor__ai:focus-visible:not(:disabled)[b-m7qabafgg1] {
    background: color-mix(in srgb, var(--bp-purple) 14%, transparent);
    border-color: var(--bp-purple);
}

/* Waehrend die KI laeuft, ist der Knopf gesperrt — das muss man sehen, sonst klickt man erneut. */
.know-editor__ai:disabled[b-m7qabafgg1] {
    opacity: 0.55;
    cursor: default;
}

.know-editor__ai-mark[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    background: color-mix(in srgb, var(--bp-purple) 22%, transparent);
    border: 1px solid var(--bp-purple);
    color: var(--bp-purple);
    font-size: 1.6rem;
}

.know-editor__ai-text[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.know-editor__ai-label[b-m7qabafgg1] {
    color: var(--bp-text);
    font-size: 0.9rem;
    font-weight: 600;
}

.know-editor__ai-hint[b-m7qabafgg1] {
    color: var(--bp-text-muted);
    font-size: 0.76rem;
    line-height: 1.35;
}

.know-draft__header[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.know-draft__lead[b-m7qabafgg1] {
    margin: 0 0 0.8rem;
    color: var(--bp-text-muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.know-draft__input[b-m7qabafgg1] {
    width: 100%;
    padding: 0.5rem 0.6rem;
    background: var(--bp-input-bg, var(--bp-panel));
    border: 1px solid var(--bp-panel-border);
    color: var(--bp-text);
    font: inherit;
    resize: vertical;
}

.know-draft__input:focus-visible[b-m7qabafgg1] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 1px;
}

.know-draft__files[b-m7qabafgg1] {
    margin: 0.6rem 0 0;
    color: var(--bp-purple);
    font-size: 0.82rem;
}

/* Der Hinweis steht VOR dem Klick, nicht erst am Ergebnis: Wer erzeugt, soll wissen, dass eine
   Maschine schreibt — und dass sie plausibel irren kann. */
.know-draft__note[b-m7qabafgg1] {
    margin: 0.6rem 0 0;
    padding: 0.5rem 0.6rem;
    background: color-mix(in srgb, var(--bp-purple) 12%, transparent);
    border-left: 2px solid var(--bp-purple);
    color: var(--bp-text-muted);
    font-size: 0.8rem;
    line-height: 1.45;
}

.know-draft__progress[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-top: 0.8rem;
}

/* ---- Ablagebereich: Datei wählen und KI-Schalter als EINE Einheit ---- */

.know-upload[b-m7qabafgg1] {
    display: grid;
    /* auto statt fester Spanne: Ohne den nativen Dateitext ist das Ablagefeld so breit wie
       sein Inhalt — eine feste Mindestbreite liesse daneben eine Lücke stehen. Der gap sorgt
       für den Abstand, den das überlaufende Feld vorher aufgefressen hat. */
    grid-template-columns: auto 1fr;
    gap: 1rem;
    align-items: stretch;
    margin-bottom: 0.75rem;
}

@media (max-width: 720px) {
    .know-upload[b-m7qabafgg1] { grid-template-columns: 1fr; }
}

.know-upload__drop[b-m7qabafgg1] { margin: 0; }

/* Das native Dateifeld wird VERSTECKT, nicht nur mitgeführt: Der Browser rendert darin seinen
   eigenen Knopf plus „Keine Datei ausgewählt" — zwei Bedienelemente und ein Statustext, die
   niemand entworfen hat. Sie liefen aus der Spalte heraus und stiessen an den KI-Schalter
   daneben, sodass beide zusammenklebten.

   Das Feld bleibt im DOM und bedienbar: Es liegt deckungsgleich über dem gestalteten Label
   (deshalb absolut und durchsichtig, nicht display:none) — damit funktionieren Klick, Tastatur
   und Drag-and-drop weiter, nur eben auf der Flaeche, die wir gezeichnet haben. */
.know-files__add[b-m7qabafgg1] {
    position: relative;
    overflow: hidden;
}

.know-files__add input[type="file"][b-m7qabafgg1] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* Der Schalter trägt die KI-Farbe sichtbar — nicht als Randnotiz. Er entscheidet über Geld,
   und was Geld kostet, darf nicht wie eine Nebeneinstellung aussehen. */
.know-upload__ai[b-m7qabafgg1] {
    display: grid;
    grid-template-columns: auto auto 1fr;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 0.9rem;
    background: color-mix(in srgb, var(--bp-purple) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--bp-purple) 35%, transparent);
    cursor: pointer;
}

.know-upload__ai:hover[b-m7qabafgg1] {
    background: color-mix(in srgb, var(--bp-purple) 14%, transparent);
    border-color: var(--bp-purple);
}

/* Eingeschaltet: deutlich kräftiger, damit im Vorbeigehen erkennbar ist, dass KI mitläuft. */
.know-upload__ai.is-on[b-m7qabafgg1] {
    background: color-mix(in srgb, var(--bp-purple) 20%, transparent);
    border-color: var(--bp-purple);
    box-shadow: inset 0 0 0 1px var(--bp-purple);
}

/* Das KI-Zeichen war bei 0.45em kaum zu sehen. Hier trägt es die Aussage — also groß, in einem
   eigenen Feld, in voller Markenfarbe. */
.know-upload__ai-mark[b-m7qabafgg1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    background: color-mix(in srgb, var(--bp-purple) 22%, transparent);
    border: 1px solid var(--bp-purple);
    color: var(--bp-purple);
    font-size: 1.6rem;
}

.know-upload__ai.is-on .know-upload__ai-mark[b-m7qabafgg1] {
    background: var(--bp-purple);
    color: var(--bp-surface, #0f1720);
}

.know-upload__ai-text[b-m7qabafgg1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.know-upload__ai-label[b-m7qabafgg1] {
    color: var(--bp-text);
    font-size: 0.9rem;
    font-weight: 600;
}

.know-upload__ai-hint[b-m7qabafgg1] {
    color: var(--bp-text-muted);
    font-size: 0.76rem;
    line-height: 1.35;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowTrainingAssignments.razor.rz.scp.css */
/* Teilnehmer einer Schulung: oben zuweisen, darunter der Stand je Mitarbeiter. */

.know-assign__course[b-rb2rp4q1dx] {
    font-size: 0.82rem;
}

.know-assign__meta[b-rb2rp4q1dx] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-assign__body[b-rb2rp4q1dx] {
    padding: 1.5rem 2rem 3rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 64rem;
}

.know-assign__form[b-rb2rp4q1dx] {
    padding: 1rem 1.25rem;
}

.know-assign__subhead[b-rb2rp4q1dx] {
    margin: 0 0 0.75rem;
    font-family: var(--bp-font-head);
    font-size: 1rem;
    font-weight: 600;
    color: var(--bp-text);
}

/* Mitarbeiter breit, Frist schmal, Knopf auf Höhe der Felder. */
.know-assign__fields[b-rb2rp4q1dx] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--bp-space-3);
}

.know-assign__field[b-rb2rp4q1dx] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    min-width: 11rem;
}

.know-assign__field--people[b-rb2rp4q1dx] {
    flex: 1 1 24rem;
}

.know-assign__field label[b-rb2rp4q1dx] {
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-assign__note[b-rb2rp4q1dx] {
    margin: 0.75rem 0 0;
}

.know-assign__scroll[b-rb2rp4q1dx] {
    overflow-x: auto;
}

.know-assign__table[b-rb2rp4q1dx] {
    width: 100%;
}

.know-assign__num[b-rb2rp4q1dx] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    width: 8rem;
}

.know-assign__actions[b-rb2rp4q1dx] {
    width: 3rem;
    text-align: right;
}

.know-assign__remove[b-rb2rp4q1dx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: var(--bp-radius);
    background: none;
    color: var(--bp-text-muted);
    cursor: pointer;
}

.know-assign__remove:hover[b-rb2rp4q1dx],
.know-assign__remove:focus-visible[b-rb2rp4q1dx] {
    color: var(--bp-danger);
    background: color-mix(in srgb, var(--bp-danger) 12%, transparent);
}

.know-assign__remove:focus-visible[b-rb2rp4q1dx] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-assign__remove:disabled[b-rb2rp4q1dx] {
    opacity: 0.4;
    cursor: default;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowTrainingEditor.razor.rz.scp.css */
/* Schulungsassistent — nur, was über bp-steps, bp-setting und bp-chip hinaus nötig ist. */

.know-trainer__meta[b-ld49do4n6f] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    margin: 0.35rem 0 0;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-trainer__steps[b-ld49do4n6f] {
    padding: 0 2rem;
    margin-top: 1rem;
}

/* Schritte sind Knöpfe (erledigte bleiben anklickbar) — ohne Knopf-Optik des Browsers. Die Textfarbe ausdrücklich
   setzen, nicht erben: Der Knopf bekam sonst das Schwarz des Browsers (auch „inherit“ landete dort, die Vorfahren
   tragen keine helle Farbe), und erledigte Schritte sahen auf dem dunklen Grund gesperrt aus. */
.know-trainer__step[b-ld49do4n6f] {
    border: 0;
    background: none;
    color: var(--bp-text);
    font: inherit;
    padding: 0;
    cursor: pointer;
}

.know-trainer__step:disabled[b-ld49do4n6f] {
    cursor: default;
}

.know-trainer__step:focus-visible[b-ld49do4n6f] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 3px;
}

.know-trainer__body[b-ld49do4n6f] {
    padding: 1.5rem 2rem 2rem;
    max-width: 62rem;
}

.know-trainer__lead[b-ld49do4n6f] {
    margin: 0 0 1rem;
    max-width: 70ch;
    color: var(--bp-text-muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.know-trainer__subhead[b-ld49do4n6f] {
    margin: 0 0 0.75rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-trainer__actions[b-ld49do4n6f] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--bp-space-3);
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bp-panel-border);
}

.know-trainer__actions--top[b-ld49do4n6f] {
    margin: 0 0 1rem;
    padding: 0;
    border-top: 0;
}

.know-trainer__spacer[b-ld49do4n6f] {
    flex: 1 1 auto;
}

/* ---- Schritt 2: Lektionsplan ---- */

.know-plan[b-ld49do4n6f] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
}

.know-plan__row[b-ld49do4n6f] {
    display: grid;
    grid-template-columns: 9rem minmax(0, 1fr) auto;
    gap: var(--bp-space-3);
    align-items: start;
    padding: var(--bp-space-3);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
}

/* Freigegeben ist der ruhige Zustand; offene Vorschläge tragen die Fläche, weil dort Arbeit wartet. */
.know-plan__row:not(.is-approved)[b-ld49do4n6f] {
    background: var(--bp-panel);
}

.know-plan__fields[b-ld49do4n6f] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    min-width: 0;
}

.know-plan__tools[b-ld49do4n6f] {
    display: flex;
    gap: 0.25rem;
}

.know-plan__tool[b-ld49do4n6f] {
    width: 2rem;
    height: 2rem;
    border: 1px solid transparent;
    border-radius: 6px;
    background: none;
    color: var(--bp-text-muted);
    cursor: pointer;
}

.know-plan__tool:hover[b-ld49do4n6f] {
    color: var(--bp-text);
    border-color: var(--bp-panel-border);
}

.know-plan__tool:focus-visible[b-ld49do4n6f] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 1px;
}

/* ---- Schritt 3: Lektionen ---- */

.know-lessons[b-ld49do4n6f] {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--bp-panel-border);
}

.know-lessons__item[b-ld49do4n6f] {
    border-bottom: 1px solid var(--bp-panel-border);
    padding: var(--bp-space-3) 0;
}

.know-lessons__head[b-ld49do4n6f] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
}

.know-lessons__toggle[b-ld49do4n6f] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-2);
    flex: 1 1 auto;
    min-width: 0;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: var(--bp-text);
    text-align: left;
    cursor: pointer;
}

.know-lessons__toggle:disabled[b-ld49do4n6f] {
    cursor: default;
    color: var(--bp-text-muted);
}

.know-lessons__toggle:focus-visible[b-ld49do4n6f] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-lessons__title[b-ld49do4n6f] {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.know-lessons__detail[b-ld49do4n6f] {
    padding: var(--bp-space-3) 0 var(--bp-space-2) 1.75rem;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
}

.know-lessons__qhead[b-ld49do4n6f] {
    margin: var(--bp-space-2) 0 0;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--bp-text);
}

.know-questions[b-ld49do4n6f] {
    margin: 0;
    padding-left: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
    font-size: 0.86rem;
}

.know-questions ul[b-ld49do4n6f] {
    list-style: none;
    margin: 0.35rem 0 0;
    padding: 0;
    color: var(--bp-text-muted);
}

.know-questions .is-correct[b-ld49do4n6f] {
    color: var(--bp-credit);
}

.know-questions__text[b-ld49do4n6f] {
    color: var(--bp-text);
}

/* ---- Schritt 4: Hinderungsgründe ---- */

.know-blockers[b-ld49do4n6f] {
    margin: 0;
    padding-left: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    color: var(--bp-text);
    font-size: 0.88rem;
    max-width: 70ch;
}

.know-blockers li[b-ld49do4n6f]::marker {
    color: var(--bp-warn);
}

/* Werkzeuge einer aufgeklappten Lektion: ansehen links, abnehmen rechts — die Abnahme ist der letzte Handgriff. */
.know-lessons__tools[b-ld49do4n6f] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--bp-space-2);
    margin: 1rem 0;
}

/* Fragen von Hand: je Frage eine Karte; der Kreis vor einer Antwort markiert die richtige. */
.know-qedit[b-ld49do4n6f] {
    margin-top: 0.5rem;
}

.know-qedit__list[b-ld49do4n6f] {
    list-style: none;
    padding: 0;
    margin: 0.75rem 0;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-3);
}

.know-qedit__item[b-ld49do4n6f] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    padding: 0.85rem 1rem;
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius);
}

.know-qedit__row[b-ld49do4n6f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.know-qedit__label[b-ld49do4n6f] {
    font-weight: 600;
    color: var(--bp-text);
}

.know-qedit__options[b-ld49do4n6f] {
    border: 0;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
}

.know-qedit__option[b-ld49do4n6f] {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--bp-space-2);
}

.know-qedit__option input[type="radio"][b-ld49do4n6f] {
    accent-color: var(--bp-yellow);
    width: 1.1rem;
    height: 1.1rem;
}

.know-qedit__remove[b-ld49do4n6f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: var(--bp-radius);
    background: none;
    color: var(--bp-text-muted);
    cursor: pointer;
}

.know-qedit__remove:hover[b-ld49do4n6f],
.know-qedit__remove:focus-visible[b-ld49do4n6f] {
    color: var(--bp-danger);
}

.know-qedit__add[b-ld49do4n6f] {
    align-self: flex-start;
}

/* Abnahme als Tabelle: eine Zeile je Lektion, eine Spalte je Prüfung — wer drüberliest, sieht in einer Spalte,
   wo es hängt. Erledigte Zeilen treten zurück, offene bleiben hell. */
.know-release__scroll[b-ld49do4n6f] {
    overflow-x: auto;
    margin-bottom: 1rem;
}

.know-release[b-ld49do4n6f] {
    width: 100%;
}

.know-release td[b-ld49do4n6f] {
    vertical-align: top;
}

.know-release tr.is-done td[b-ld49do4n6f] {
    color: var(--bp-text-muted);
}

.know-release__lesson[b-ld49do4n6f] {
    border: 0;
    background: none;
    padding: 0;
    font: inherit;
    color: var(--bp-text);
    text-align: left;
    cursor: pointer;
}

.know-release__lesson:hover[b-ld49do4n6f] {
    color: var(--bp-yellow);
}

.know-release__lesson:focus-visible[b-ld49do4n6f],
.know-release__review:focus-visible[b-ld49do4n6f],
.know-release__icon:focus-visible[b-ld49do4n6f] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-release__no[b-ld49do4n6f] {
    display: inline-block;
    min-width: 1.5rem;
    color: var(--bp-text-muted);
    font-variant-numeric: tabular-nums;
}

.know-release__ok[b-ld49do4n6f] {
    color: var(--bp-text-muted);
    font-size: 0.85rem;
}

.know-release__muted[b-ld49do4n6f] {
    color: var(--bp-text-muted);
}

.know-release__missing[b-ld49do4n6f] {
    margin: 0.35rem 0 0;
    padding-left: 1rem;
    font-size: 0.82rem;
    color: var(--bp-text-muted);
}

.know-release__num[b-ld49do4n6f] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    width: 5rem;
}

.know-release__review[b-ld49do4n6f] {
    display: block;
    margin-top: 0.35rem;
    border: 0;
    background: none;
    padding: 0;
    font: inherit;
    font-size: 0.85rem;
    color: var(--bp-yellow);
    cursor: pointer;
}

.know-release__review:disabled[b-ld49do4n6f] {
    opacity: 0.5;
    cursor: default;
}

.know-release__actions[b-ld49do4n6f] {
    width: 5rem;
    text-align: right;
    white-space: nowrap;
}

.know-release__icon[b-ld49do4n6f] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--bp-radius);
    color: var(--bp-text-muted);
}

.know-release__icon:hover[b-ld49do4n6f] {
    color: var(--bp-text);
    background: color-mix(in srgb, var(--bp-text) 8%, transparent);
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowTrainingResults.razor.rz.scp.css */
/* Zahlen rechtsbündig mit gleich breiten Ziffern. */
.know-results__num[b-yaiykod3u8] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
/* _content/bettERFramework.KNOW.UI/Components/Pages/KnowTrainings.razor.rz.scp.css */
/* Zahlen rechtsbündig mit gleich breiten Ziffern — sonst springt die Spalte von Zeile zu Zeile. */
.know-trainings__num[b-sokgp7mdn7] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    width: 7rem;
}

.know-trainings__actions[b-sokgp7mdn7] {
    width: 5rem;
    text-align: right;
    white-space: nowrap;
}

.know-trainings__icon[b-sokgp7mdn7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--bp-radius);
    color: var(--bp-text-muted);
}

.know-trainings__icon:hover[b-sokgp7mdn7],
.know-trainings__icon:focus-visible[b-sokgp7mdn7] {
    color: var(--bp-text);
    background: color-mix(in srgb, var(--bp-text) 8%, transparent);
}

/* Leises Symbol in der Zeile; Rot erst beim Zeigen — Löschen soll auffindbar sein, aber nicht rufen. */
.know-trainings__delete[b-sokgp7mdn7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border: 0;
    border-radius: var(--bp-radius);
    background: none;
    color: var(--bp-text-muted);
    cursor: pointer;
}

.know-trainings__delete:hover[b-sokgp7mdn7],
.know-trainings__delete:focus-visible[b-sokgp7mdn7] {
    color: var(--bp-danger);
    background: color-mix(in srgb, var(--bp-danger) 12%, transparent);
}

.know-trainings__delete:focus-visible[b-sokgp7mdn7] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

.know-trainings__delete:disabled[b-sokgp7mdn7] {
    opacity: 0.4;
    cursor: default;
}
/* _content/bettERFramework.KNOW.UI/Components/Settings/KnowSettingsEditor.razor.rz.scp.css */
/* Einstellungen von betterKNOW — nur, was diese Seite über die gemeinsame SettingsShell hinaus braucht.
   Felder, Raster und Speicherleiste kommen aus bp-components.css (.bp-settings, .bp-setting). */

/* Eingabe und ihre Einheit bzw. ihr Zustand stehen auf einer Linie; die Zahlfelder bleiben schmal,
   weil dreistellige Werte in einer halben Seitenbreite verloren wirken. */
.know-settings__control[b-6wu9yfv3dd] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
    min-height: 2.25rem;
}

[b-6wu9yfv3dd] .know-settings__number.e-input-group {
    width: 7.5rem;
    flex: 0 0 auto;
}

.know-settings__unit[b-6wu9yfv3dd],
.know-settings__state[b-6wu9yfv3dd] {
    font-size: 0.82rem;
    color: var(--bp-text-muted);
    font-variant-numeric: tabular-nums;
}

.know-settings__languages[b-6wu9yfv3dd] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    width: 100%;
}

/* Abweichung von der Vorgabe: ruhig, aber mit dem Rückweg direkt daneben. */
.know-settings__default[b-6wu9yfv3dd] {
    display: flex;
    align-items: baseline;
    gap: var(--bp-space-3);
    font-size: 0.78rem;
    color: var(--bp-text-muted);
}

.know-settings__reset[b-6wu9yfv3dd] {
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    color: var(--bp-text);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: var(--bp-text-muted);
    cursor: pointer;
}

.know-settings__reset:hover[b-6wu9yfv3dd] {
    text-decoration-color: var(--bp-text);
}

.know-settings__reset:focus-visible[b-6wu9yfv3dd] {
    outline: 2px solid var(--bp-yellow);
    outline-offset: 2px;
}

/* Hinweis zur Mitbestimmung: steht vor den Schaltern, rahmt sich schlicht ein (1px, keine farbige
   Kante) — die Warnfarbe trägt nur der Titel, damit der Absatz lesbar bleibt. */
.know-settings__notice[b-6wu9yfv3dd] {
    padding: var(--bp-space-3) var(--bp-space-4);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
    background: var(--bp-panel);
}

.know-settings__notice-title[b-6wu9yfv3dd] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--bp-warn);
}
/* _content/bettERFramework.KNOW.UI/Components/Settings/KnowVoicesEditor.razor.rz.scp.css */
/* Eigene Stimmen — Arbeitsliste oben, Formular darunter. Felder und Raster aus bp-components.css. */

.know-voices__list[b-fduz36a8oe] {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--bp-panel-border);
}

.know-voices__item[b-fduz36a8oe] {
    display: flex;
    flex-direction: column;
    gap: var(--bp-space-2);
    padding: var(--bp-space-3) 0;
    border-bottom: 1px solid var(--bp-panel-border);
}

.know-voices__head[b-fduz36a8oe] {
    display: flex;
    align-items: center;
    gap: var(--bp-space-3);
}

.know-voices__name[b-fduz36a8oe] {
    font-weight: 600;
    color: var(--bp-text);
}

.know-voices__actions[b-fduz36a8oe] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--bp-space-2);
}

.know-voices__audio[b-fduz36a8oe] {
    width: 100%;
    max-width: 28rem;
}

.know-voices__form[b-fduz36a8oe] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--bp-space-4);
}

.know-voices__consent[b-fduz36a8oe] {
    padding: var(--bp-space-3) var(--bp-space-4);
    border: 1px solid var(--bp-panel-border);
    border-radius: var(--bp-radius-lg);
}