/* 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);
}

/* Markdown-Tabellen (GitLab-Stil): schlicht, mit Linien, Kopf abgesetzt. */
.kb-content table.kb-md-table {
  border-collapse: collapse;
  margin: .5rem 0;
  min-width: 50%;
}

.kb-content table.kb-md-table th,
.kb-content table.kb-md-table td {
  border: 1px solid var(--bs-border-color);
  padding: .3rem .6rem;
}

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

/* Markdown-Eingabe: Monospace und genug Arbeitshöhe. */
.knowledge-edit .kb-markdown-input {
  min-height: 16rem;
  font-size: .875rem;
}

/* 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 .ql-toolbar {
  border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
}

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

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

/* Der Editor im Modal braucht Arbeitshöhe. */
.knowledge-edit .knowledge-editor .ql-container {
  min-height: 16rem;
}

.knowledge-edit .knowledge-editor .ql-editor {
  min-height: 16rem;
}

/* 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;
}

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

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

/* 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;
}