/* Wissensdatenbank: Toolbar, Split-Ansicht, Filter-Chips und Editor-Maße. */

.knowledge-view .knowledge-search-bar {
  min-width: min(22rem, 100%);
}

.knowledge-view .knowledge-search-action {
  border: 0;
  border-bottom: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: 0;
  box-shadow: none;
}

.knowledge-view .knowledge-search-action:focus-visible,
.knowledge-view .knowledge-search-bar:has([data-kb-search]:focus) .knowledge-search-action {
  border-bottom-color: var(--bs-primary);
}

.knowledge-view #knowledge-left-panel,
.knowledge-view #knowledge-right-panel {
  container-type: inline-size;
}

.knowledge-view .kb-entry .kb-entry-head {
  cursor: pointer;
  outline: none;
}

.knowledge-view .kb-entry:hover,
.knowledge-view .kb-entry:has(.kb-entry-head:focus-visible) {
  border-color: rgba(var(--bs-primary-rgb), .35);
}

.knowledge-view .kb-entry.kb-entry-selected {
  border-color: rgba(var(--bs-primary-rgb), .55);
  background-color: rgba(var(--bs-primary-rgb), .08);
}

[data-bs-theme="dark"] .knowledge-view .kb-entry.kb-entry-selected {
  background-color: rgba(var(--bs-primary-rgb), .16);
}

/* Die Vorschau bleibt bei den ersten Zeilen – der Rest kommt erst aufgeklappt. */
.knowledge-view .kb-preview {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.knowledge-view .kb-tag-chip {
  font-weight: var(--cin-tag-font-weight, 500);
}

.knowledge-view .kb-tag-chip.active {
  outline: 2px solid var(--bs-primary);
  outline-offset: 1px;
}

.knowledge-view .knowledge-detail-meta>span+span::before {
  content: '·';
  margin-inline: .5rem;
}

.knowledge-view .knowledge-detail-scroll {
  overflow-x: hidden;
}

.workspace-popup-body #knowledge-detail-view {
  min-height: min(70vh, 44rem);
}

@media (max-width: 767.98px) {
  .knowledge-view #knowledge-toolbar .card-body {
    align-items: stretch !important;
  }

  .knowledge-view #knowledge-toolbar h4 {
    width: 100%;
  }

  .knowledge-view .knowledge-search-bar {
    order: 2;
    width: 100%;
  }

  .knowledge-view #knowledge-toolbar>.card-body>.d-flex.ms-auto {
    margin-left: 0 !important;
  }
}

.knowledge-view .kb-tag-count {
  opacity: .65;
  margin-left: .2rem;
}

/*
 * Inhalts-Stile ohne .knowledge-view-Präfix: sie gelten für den ausgeklappten
 * Eintrag in der Liste UND für die Markdown-Vorschau im Editor-Modal, das
 * außerhalb der View im globalen Modal hängt.
 */
.kb-content img {
  max-width: 100%;
  height: auto;
}

/*
 * Codeblöcke: schwarzes Feld mit Kopierbutton, als eigener Block mit Abstand
 * zum Text davor und danach. Der Button kommt beim Rendern per JS dazu
 * (#decorateCodeBlocks) – im gespeicherten HTML hätte ihn der Sanitizer weg.
 */
.kb-content pre {
  background: #1e1e1e;
  color: #e6e6e6;
  padding: .875rem 1rem;
  border-radius: .5rem;
  overflow-x: auto;
  margin: 1rem 0;
}

.kb-content pre code {
  color: inherit;
  background: transparent;
  padding: 0;
}

.kb-content .kb-code {
  position: relative;
  margin: 1rem 0;
}

/* Der Abstand sitzt am Container, nicht doppelt am pre darin. */
.kb-content .kb-code pre {
  margin: 0;
}

.kb-content .kb-code .kb-copy {
  position: absolute;
  top: .45rem;
  right: .45rem;
  color: #cfcfcf;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .375rem;
  padding: .15rem .5rem;
  line-height: 1.2;
}

.kb-content .kb-code .kb-copy:hover {
  color: #ffffff;
  background: rgba(255, 255, 255, .18);
}

.kb-content .kb-code .kb-copy.copied {
  color: #7ee2a8;
  border-color: rgba(126, 226, 168, .5);
}

/* Mermaid-Diagramme: gerendertes SVG statt schwarzem Codefeld; der versteckte
   pre bleibt als Quelle für den Kopieren-Button erhalten. */
.kb-content .kb-code.kb-mermaid {
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  padding: .75rem;
}

.kb-content .kb-code.kb-mermaid .kb-copy {
  color: var(--bs-secondary-color);
  background: var(--bs-tertiary-bg);
  border: 1px solid var(--bs-border-color);
}

.kb-content .kb-mermaid-figure {
  display: flex;
  justify-content: center;
  overflow-x: auto;
}

.kb-content .kb-mermaid-figure svg {
  max-width: 100%;
  height: auto;
}

.kb-content blockquote {
  border-left: 3px solid var(--bs-border-color);
  padding-left: .75rem;
  color: var(--bs-secondary-color);
}

/* Quill 2 speichert alle visuellen Listen in einem ol und kennzeichnet die
   tatsächliche Listenart sowie Einrückung am li. Außerhalb des Editors fehlen
   dessen Zählerregeln; deshalb bildet die Ausgabe sie hier ohne Editor-Layout
   nach. Semantische ul/ol aus Markdown behalten ihre Browser-Darstellung. */
.kb-content ol:has(> li[data-list]) {
  counter-reset: kb-list-0 kb-list-1 kb-list-2 kb-list-3 kb-list-4
    kb-list-5 kb-list-6 kb-list-7 kb-list-8 kb-list-9;
  padding-inline-start: 1.5em;
}

.kb-content li[data-list] {
  counter-reset: kb-list-1 kb-list-2 kb-list-3 kb-list-4 kb-list-5
    kb-list-6 kb-list-7 kb-list-8 kb-list-9;
  list-style-type: none;
  padding-inline-start: 1.5em;
}

.kb-content li[data-list]::before {
  display: inline-block;
  width: 1.2em;
  margin-inline-start: -1.5em;
  margin-inline-end: .3em;
  text-align: end;
  white-space: nowrap;
}

.kb-content li[data-list] > .ql-ui {
  display: none;
}

.kb-content li[data-list="bullet"]::before {
  content: '\2022';
}

.kb-content li[data-list="bullet"].ql-indent-1::before,
.kb-content li[data-list="bullet"].ql-indent-4::before,
.kb-content li[data-list="bullet"].ql-indent-7::before {
  content: '\25E6';
}

.kb-content li[data-list="bullet"].ql-indent-2::before,
.kb-content li[data-list="bullet"].ql-indent-5::before,
.kb-content li[data-list="bullet"].ql-indent-8::before {
  content: '\25AA';
}

/* Quill selbst unterscheidet Bullet-Ebenen standardmäßig nicht. Die gleichen
   Marker wie in der Ausgabe verhindern einen visuellen Wechsel beim Speichern. */
.knowledge-edit .ql-editor li[data-list="bullet"].ql-indent-1 > .ql-ui::before,
.knowledge-edit .ql-editor li[data-list="bullet"].ql-indent-4 > .ql-ui::before,
.knowledge-edit .ql-editor li[data-list="bullet"].ql-indent-7 > .ql-ui::before {
  content: '\25E6';
}

.knowledge-edit .ql-editor li[data-list="bullet"].ql-indent-2 > .ql-ui::before,
.knowledge-edit .ql-editor li[data-list="bullet"].ql-indent-5 > .ql-ui::before,
.knowledge-edit .ql-editor li[data-list="bullet"].ql-indent-8 > .ql-ui::before {
  content: '\25AA';
}

.kb-content li[data-list="checked"]::before {
  content: '\2611';
}

.kb-content li[data-list="unchecked"]::before {
  content: '\2610';
}

.kb-content li[data-list="ordered"] {
  counter-increment: kb-list-0;
}

.kb-content li[data-list="ordered"]::before {
  content: counter(kb-list-0, decimal) '. ';
}

.kb-content li[data-list].ql-indent-1 {
  counter-reset: kb-list-2 kb-list-3 kb-list-4 kb-list-5 kb-list-6
    kb-list-7 kb-list-8 kb-list-9;
  padding-inline-start: 4.5em;
}

.kb-content li[data-list="ordered"].ql-indent-1 {
  counter-increment: kb-list-1;
}

.kb-content li[data-list="ordered"].ql-indent-1::before {
  content: counter(kb-list-1, lower-alpha) '. ';
}

.kb-content li[data-list].ql-indent-2 {
  counter-reset: kb-list-3 kb-list-4 kb-list-5 kb-list-6 kb-list-7
    kb-list-8 kb-list-9;
  padding-inline-start: 7.5em;
}

.kb-content li[data-list="ordered"].ql-indent-2 {
  counter-increment: kb-list-2;
}

.kb-content li[data-list="ordered"].ql-indent-2::before {
  content: counter(kb-list-2, lower-roman) '. ';
}

.kb-content li[data-list].ql-indent-3 {
  counter-reset: kb-list-4 kb-list-5 kb-list-6 kb-list-7 kb-list-8 kb-list-9;
  padding-inline-start: 10.5em;
}

.kb-content li[data-list="ordered"].ql-indent-3 {
  counter-increment: kb-list-3;
}

.kb-content li[data-list="ordered"].ql-indent-3::before {
  content: counter(kb-list-3, decimal) '. ';
}

.kb-content li[data-list].ql-indent-4 {
  counter-reset: kb-list-5 kb-list-6 kb-list-7 kb-list-8 kb-list-9;
  padding-inline-start: 13.5em;
}

.kb-content li[data-list="ordered"].ql-indent-4 {
  counter-increment: kb-list-4;
}

.kb-content li[data-list="ordered"].ql-indent-4::before {
  content: counter(kb-list-4, lower-alpha) '. ';
}

.kb-content li[data-list].ql-indent-5 {
  counter-reset: kb-list-6 kb-list-7 kb-list-8 kb-list-9;
  padding-inline-start: 16.5em;
}

.kb-content li[data-list="ordered"].ql-indent-5 {
  counter-increment: kb-list-5;
}

.kb-content li[data-list="ordered"].ql-indent-5::before {
  content: counter(kb-list-5, lower-roman) '. ';
}

.kb-content li[data-list].ql-indent-6 {
  counter-reset: kb-list-7 kb-list-8 kb-list-9;
  padding-inline-start: 19.5em;
}

.kb-content li[data-list="ordered"].ql-indent-6 {
  counter-increment: kb-list-6;
}

.kb-content li[data-list="ordered"].ql-indent-6::before {
  content: counter(kb-list-6, decimal) '. ';
}

.kb-content li[data-list].ql-indent-7 {
  counter-reset: kb-list-8 kb-list-9;
  padding-inline-start: 22.5em;
}

.kb-content li[data-list="ordered"].ql-indent-7 {
  counter-increment: kb-list-7;
}

.kb-content li[data-list="ordered"].ql-indent-7::before {
  content: counter(kb-list-7, lower-alpha) '. ';
}

.kb-content li[data-list].ql-indent-8 {
  counter-reset: kb-list-9;
  padding-inline-start: 25.5em;
}

.kb-content li[data-list="ordered"].ql-indent-8 {
  counter-increment: kb-list-8;
}

.kb-content li[data-list="ordered"].ql-indent-8::before {
  content: counter(kb-list-8, lower-roman) '. ';
}

.kb-content li[data-list].ql-indent-9 {
  padding-inline-start: 28.5em;
}

.kb-content li[data-list="ordered"].ql-indent-9 {
  counter-increment: kb-list-9;
}

.kb-content li[data-list="ordered"].ql-indent-9::before {
  content: counter(kb-list-9, decimal) '. ';
}

/* Auch echte verschachtelte HTML-/Markdown-Listen unterscheiden ihre Ebenen
   sichtbar; Bootstrap-Klassen wie list-unstyled bleiben davon unberührt. */
.kb-content ul ul {
  list-style-type: circle;
}

.kb-content ul ul ul {
  list-style-type: square;
}

/* Tabellen aus Markdown und dem visuellen Editor teilen sich eine ruhige,
   responsive Darstellung. Breite Tabellen scrollen als Einheit. */
.kb-content table {
  display: block;
  border-collapse: collapse;
  margin: .5rem 0;
  width: fit-content;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
}

.kb-content table th,
.kb-content table td {
  border: 1px solid var(--bs-border-color);
  padding: .3rem .6rem;
  overflow-wrap: anywhere;
  vertical-align: top;
}

.kb-content table.kb-md-table thead th {
  background: var(--bs-tertiary-bg);
}

/* Der Editor ist eine offene Arbeitsfläche: nur die Werkzeugleiste wird durch
   eine Linie vom Text getrennt, die Außenkante bleibt bewusst randlos. */
.knowledge-edit .ql-toolbar.ql-snow {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  align-items: flex-start;
  max-width: 100%;
  white-space: normal;
  border: 0;
  border-bottom: var(--bs-border-width) solid var(--bs-border-color);
}

.knowledge-edit .ql-toolbar.ql-snow .ql-formats {
  flex: 0 0 auto;
}

.knowledge-edit .ql-toolbar.ql-snow .kb-table-controls {
  position: relative;
}

.knowledge-edit .ql-toolbar.ql-snow .kb-table-menu {
  --bs-dropdown-min-width: 19rem;
  width: 20rem;
  max-width: calc(100vw - 2rem);
  color: var(--bs-body-color);
  white-space: normal;
  z-index: var(--bs-dropdown-zindex);
}

/* Quills Toolbar-Regeln geben allen Buttons feste Icon-Maße. Die regulären
   Bootstrap-Aktionen im Tabellenmenü müssen davon ausgenommen werden. */
.knowledge-edit .ql-toolbar.ql-snow .kb-table-menu button.btn {
  display: inline-flex;
  float: none;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 1.9375rem;
  padding: .25rem .5rem;
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
}

.knowledge-edit .ql-toolbar.ql-snow .kb-table-menu button.btn.w-100 {
  width: 100% !important;
}

.knowledge-edit .ql-toolbar.ql-snow .kb-table-menu .kb-table-border-color {
  flex: 0 0 2.5rem;
  width: 2.5rem;
  height: 1.9375rem;
  padding: .125rem;
}

.knowledge-edit-editor-column,
.knowledge-edit [data-kb-editor-pane],
.knowledge-edit .knowledge-editor-shell,
.knowledge-edit [data-kb-visual-wrap],
.knowledge-edit .knowledge-editor.ql-container.ql-snow {
  min-width: 0;
  max-width: 100%;
}

.knowledge-edit .knowledge-editor.ql-container.ql-snow {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  height: auto;
  min-height: 16rem;
  overflow: hidden;
  border: 0;
}

.knowledge-edit .knowledge-editor .ql-editor {
  flex: 1 1 auto;
  max-width: 100%;
  min-height: 16rem;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-wrap: anywhere;
  word-break: normal;
}

.knowledge-edit .knowledge-editor .ql-editor pre,
.knowledge-edit .knowledge-editor .ql-editor code,
.knowledge-edit .knowledge-editor .ql-editor a {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.knowledge-edit .knowledge-editor .ql-editor pre {
  white-space: pre-wrap;
}

.knowledge-edit .knowledge-editor .ql-editor img {
  max-width: 100%;
  height: auto;
}

.knowledge-edit .knowledge-editor .ql-editor table {
  width: fit-content;
  min-width: 0;
  max-width: 100%;
  table-layout: auto;
}

.kb-content table.kb-table-stretch,
.knowledge-edit .knowledge-editor .ql-editor table.kb-table-stretch,
.kb-content table:has(td[data-kb-table-width="stretch"]),
.knowledge-edit .knowledge-editor .ql-editor table:has(td[data-kb-table-width="stretch"]) {
  display: table;
  width: 100%;
  min-width: 100%;
  table-layout: fixed;
}

.knowledge-edit .knowledge-editor .ql-editor td {
  border: 1px solid var(--bs-border-color);
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: top;
}

/* Transparente Layout-Tabellen bleiben in der Ausgabe unsichtbar. Nur beim
   Bearbeiten macht Hover ihre Zellstruktur als gestrichelte Hilfslinie sichtbar. */
.knowledge-edit .knowledge-editor .ql-editor
table:has(td[style*="border-color: transparent"]):hover
td[style*="border-color: transparent"] {
  border-color: var(--bs-border-color) !important;
  border-style: dashed;
}

/* Markdown-Eingabe: Monospace und genug Arbeitshöhe. */
.knowledge-edit .kb-markdown-input {
  min-height: 16rem;
  font-size: .875rem;
  white-space: pre-wrap;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-wrap: anywhere;
}

.knowledge-edit [data-kb-editor-fallback] {
  min-height: 16rem;
  white-space: pre-wrap;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: auto;
  overflow-wrap: anywhere;
}

.knowledge-edit [data-kb-markdown-wrap]:not(.d-none) {
  display: flex;
  flex-direction: column;
}

/* Im Markdown-Modus bleibt die Quill-Toolbar sichtbar. Nur Formate mit einem
   eindeutigen Markdown-Pendant werden angeboten. */
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-clean,
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-font,
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-size,
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-underline,
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-color,
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-background,
.knowledge-edit .ql-toolbar.kb-markdown-mode .ql-align {
  display: none !important;
}

/* Überschrift und Zitat ergänzen nur den Markdown-Helfer; die visuelle
   Werkzeugleiste behält weiterhin die Reihenfolge des Mail-Editors. */
.knowledge-edit .ql-toolbar:not(.kb-markdown-mode) .ql-header,
.knowledge-edit .ql-toolbar:not(.kb-markdown-mode) .ql-blockquote {
  display: none !important;
}

.knowledge-edit [data-kb-visual-wrap].kb-markdown-active {
  flex-grow: 0 !important;
}

.knowledge-edit [data-kb-markdown-wrap].kb-toolbar-connected {
  margin-top: 0;
}

.knowledge-edit [data-kb-markdown-wrap].kb-toolbar-connected .kb-markdown-input {
  border-radius: 0;
}

/* Unterhalb des Zwei-Spalten-Layouts darf das Tabellenmenü den kompakten
   Editorbereich überlagern, damit seine unteren Optionen nicht abgeschnitten
   werden. Ab xl bleibt der höhenbegrenzte Editor bewusst gekapselt. */
@media (max-width: 1199.98px) {
  .knowledge-edit [data-kb-editor-pane] {
    overflow: visible !important;
  }
}

/* Erst auf breiten Desktops teilt sich das Modal. Links nutzt der Editor die
   verbleibende Höhe, rechts scrollen die Metadaten unabhängig davon. */
@media (min-width: 1200px) {
  .modal-body:has(.knowledge-edit) {
    min-height: 0;
    overflow: hidden;
  }

  .modal-body:has(.knowledge-edit) > .knowledge-editor-modal-view,
  .knowledge-editor-modal-view,
  .knowledge-edit,
  .knowledge-edit-layout,
  .knowledge-edit-editor-column,
  .knowledge-edit-meta-column {
    height: 100%;
    min-height: 0;
  }

  .knowledge-edit-meta-column {
    overflow-y: auto;
  }

  .knowledge-edit-editor-column,
  .knowledge-edit [data-kb-editor-pane] {
    overflow: hidden;
  }

  .knowledge-edit .knowledge-editor-shell,
  .knowledge-edit [data-kb-visual-wrap],
  .knowledge-edit [data-kb-markdown-wrap] {
    min-height: 0;
  }

  .knowledge-edit .knowledge-editor-shell,
  .knowledge-edit [data-kb-visual-wrap] {
    overflow: hidden;
  }

  /* Im Markdown-Modus besteht der visuelle Bereich nur aus der Toolbar. Deren
     Dropdowns dürfen über die Markdown-Fläche ragen, ohne dass die normale
     Editor- und Metadatenhöhe ihren Scroll-Vertrag verliert. */
  .knowledge-edit-editor-column:has([data-kb-visual-wrap].kb-markdown-active),
  .knowledge-edit [data-kb-editor-pane]:has([data-kb-visual-wrap].kb-markdown-active),
  .knowledge-edit .knowledge-editor-shell:has([data-kb-visual-wrap].kb-markdown-active),
  .knowledge-edit [data-kb-visual-wrap].kb-markdown-active {
    overflow: visible;
  }

  .knowledge-edit .knowledge-editor.ql-container.ql-snow,
  .knowledge-edit .knowledge-editor .ql-editor,
  .knowledge-edit .kb-markdown-input,
  .knowledge-edit [data-kb-editor-fallback] {
    min-height: 0;
  }

  .knowledge-edit .kb-markdown-input,
  .knowledge-edit [data-kb-editor-fallback] {
    flex: 1 1 auto;
    resize: none;
  }

}

/* Semantisch interne Abschnitte bleiben für berechtigte Bearbeiter sichtbar,
   sind aber klar von der öffentlichen Projektion unterscheidbar. */
.knowledge-edit .ql-editor [data-kb-visibility="internal"],
.knowledge-edit .kb-content [data-kb-visibility="internal"],
.knowledge-view .kb-content [data-kb-visibility="internal"] {
  border-inline-start: .25rem solid var(--bs-warning);
  background: rgba(var(--bs-warning-rgb), .12);
  padding: .5rem .75rem;
}

.knowledge-edit .ql-editor [data-kb-visibility="internal"]::before,
.knowledge-edit .kb-content [data-kb-visibility="internal"]::before,
.knowledge-view .kb-content [data-kb-visibility="internal"]::before {
  content: '\f47b  Nur intern';
  display: block;
  margin-bottom: .25rem;
  color: var(--bs-warning-text-emphasis);
  font-family: bootstrap-icons, var(--bs-font-sans-serif);
  font-size: .75rem;
  font-weight: 600;
}

/* Eine intern markierte Tabelle trägt den Status auf allen Zellen, zeigt den
   Hinweis aber nicht redundant in jeder einzelnen Zelle. */
.knowledge-edit .ql-editor td[data-kb-visibility="internal"]::before,
.knowledge-edit .kb-content td[data-kb-visibility="internal"]::before,
.knowledge-view .kb-content td[data-kb-visibility="internal"]::before {
  display: none;
}

.knowledge-edit .ql-editor table:has(td[data-kb-visibility="internal"]),
.knowledge-edit .kb-content table:has(td[data-kb-visibility="internal"]),
.knowledge-view .kb-content table:has(td[data-kb-visibility="internal"]) {
  outline: .125rem solid var(--bs-warning);
  outline-offset: .125rem;
}

.knowledge-edit .ql-toolbar button.ql-visual.ql-active,
.knowledge-edit .ql-toolbar button.ql-markdown.ql-active,
.knowledge-edit .ql-toolbar button.ql-table.ql-active,
.knowledge-edit .ql-toolbar button.ql-internal.ql-active {
  color: var(--bs-primary);
}

.knowledge-edit .kb-editor-preview .card-header {
  min-height: 2.75rem;
}

.knowledge-edit [data-kb-preview-toggle] {
  border: 0;
  border-radius: var(--bs-card-inner-border-radius) 0 0 0;
  box-shadow: none;
}

.knowledge-edit .kb-preview-chevron {
  transition: transform .2s ease;
}

.knowledge-edit [data-kb-preview-toggle][aria-expanded="false"] .kb-preview-chevron {
  transform: rotate(-90deg);
}

.knowledge-edit [data-kb-preview-nav] .nav-link {
  min-height: 2.75rem;
  padding: .5rem .75rem;
}

.knowledge-edit [data-kb-preview-content] {
  min-height: 5rem;
  overflow-wrap: anywhere;
}

.knowledge-edit [data-kb-preview-content] pre {
  white-space: pre-wrap;
  word-break: break-word;
}

.knowledge-history .kb-history-icon {
  width: 2rem;
  height: 2rem;
}

.kb-attachment-preview,
.kb-attachment-file-icon {
  width: 3.5rem;
  height: 2.75rem;
  flex: 0 0 auto;
  background: var(--bs-tertiary-bg);
}

.kb-attachment-preview {
  display: block;
  object-fit: cover;
}

/* Sortiergriff wie im Sidebar-Menü: greifen, ziehen, ablegen. */
.knowledge-view .kb-drag {
  color: var(--bs-secondary-color);
  border: 0;
  padding: 0 .25rem;
  cursor: grab;
}

.knowledge-view .kb-drag:active {
  cursor: grabbing;
}

.knowledge-view .kb-entry.is-dragging {
  opacity: .55;
  border-style: dashed;
}

/* Gruppenzeilen im GitLab-Stil: Ordnerzeile, Zähler, Klick öffnet die Ebene. */
.knowledge-view .kb-breadcrumb {
  --bs-breadcrumb-divider: '/';
}

.knowledge-view .kb-breadcrumb a {
  text-decoration: none;
}

.knowledge-view .kb-group {
  cursor: pointer;
}

.knowledge-view .kb-group:hover {
  border-color: rgba(var(--bs-primary-rgb), .35);
  background-color: var(--bs-tertiary-bg);
}

.knowledge-view .kb-group-icon {
  font-size: 1.25rem;
  color: var(--bs-primary);
}

/* Die Light-Badges der Zähler sollen auch im Dark-Theme lesbar bleiben. */
.knowledge-view .kb-group .badge.text-bg-light {
  background-color: var(--bs-tertiary-bg) !important;
  color: var(--bs-body-color) !important;
}

/* Editorfläche signalisiert, dass die gezogene Datei hier hochgeladen wird. */
.kb-attach-drop {
  outline: 2px dashed var(--bs-primary);
  outline-offset: -2px;
}