/**
 * OW Onboarding Tool v0.96.1
 * Kompakte Satelliten-Cluster um die zentrale Startseite, stabile Kartenmaße
 * und responsive Themencluster-Übersichten in Review und Editor.
 */

/* --------------------------------------------------------------------------
   Mindmap-Karten: feste Maße statt wachsender/verzerrter Kacheln
   -------------------------------------------------------------------------- */
.cm-node-root,
.cmp-node-root {
  width: 238px !important;
  min-width: 238px !important;
  max-width: 238px !important;
  height: 104px !important;
  min-height: 104px !important;
  max-height: 104px !important;
  padding: 10px 12px !important;
  overflow: hidden !important;
  justify-content: flex-start !important;
}

.cm-node-root .cm-root-heading,
.cmp-node-root .cmp-root-heading {
  min-height: 28px;
  align-items: center;
}

.cm-node-root h2,
.cmp-node-root h2 {
  margin: 1px 0 0 !important;
  font-size: 13px !important;
  line-height: 1.18 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden !important;
}

.cm-node-root > p,
.cmp-node-root > p {
  display: none !important;
}

.cm-node-root .cm-root-locales,
.cmp-node-root .cmp-root-locales {
  margin-top: 7px !important;
}

.cm-node-root footer,
.cmp-node-root footer {
  margin-top: auto !important;
  padding-top: 6px !important;
  gap: 7px !important;
  font-size: 8.5px !important;
  white-space: nowrap;
}

.cm-node-cluster,
.cmp-node-cluster {
  width: 212px !important;
  min-width: 212px !important;
  max-width: 212px !important;
  height: 90px !important;
  min-height: 90px !important;
  max-height: 90px !important;
  padding: 9px 11px 8px 14px !important;
  overflow: hidden !important;
}

.cm-node-cluster .cm-node-top,
.cmp-node-cluster .cmp-node-top {
  min-height: 16px !important;
}

.cm-node-cluster h3,
.cmp-node-cluster h3 {
  margin: 5px 0 4px !important;
  font-size: 12px !important;
  line-height: 1.22 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
}

.cm-node-cluster > p,
.cmp-node-cluster > p {
  display: none !important;
}

.cm-node-cluster footer,
.cmp-node-cluster footer {
  margin-top: auto !important;
  padding-top: 4px !important;
  gap: 6px !important;
  font-size: 8.5px !important;
  white-space: nowrap;
}

.cm-node-page,
.cm-node-opportunity,
.cmp-node-page,
.cmp-node-opportunity {
  width: 228px !important;
  min-width: 228px !important;
  max-width: 228px !important;
  height: 116px !important;
  min-height: 116px !important;
  max-height: 116px !important;
  padding: 9px 10px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  overflow: hidden !important;
}

.cm-node-page > .cm-content-head,
.cm-node-opportunity > .cm-content-head,
.cmp-node-page > .cmp-content-head,
.cmp-node-opportunity > .cmp-content-head {
  min-height: 18px !important;
  max-height: 18px !important;
  flex: 0 0 18px !important;
  overflow: hidden;
}

.cm-node-page > .cm-content-taxonomy,
.cm-node-opportunity > .cm-content-taxonomy,
.cmp-node-page > .cmp-content-taxonomy,
.cmp-node-opportunity > .cmp-content-taxonomy,
.cm-node-page > p,
.cm-node-opportunity > p,
.cmp-node-page > p,
.cmp-node-opportunity > p {
  display: none !important;
}

.cm-node-page h3,
.cm-node-opportunity h3,
.cmp-node-page h3,
.cmp-node-opportunity h3 {
  min-height: 31px;
  max-height: 31px;
  margin: 6px 0 3px !important;
  flex: 0 0 31px !important;
  font-size: 12.5px !important;
  line-height: 1.24 !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  overflow-wrap: anywhere;
}

.cm-content-footer,
.cmp-content-footer {
  width: 100%;
  min-width: 0;
  min-height: 31px;
  margin-top: auto !important;
  padding-top: 5px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(74px, auto) !important;
  align-items: end !important;
  gap: 6px !important;
  border-top-color: rgba(41, 41, 41, 0.08) !important;
}

.cm-content-format,
.cmp-content-format {
  min-width: 0;
  max-width: 100%;
  font-size: 8.5px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
}

.cm-content-footer-meta,
.cmp-content-footer-meta {
  min-width: 0;
  max-width: 88px !important;
  display: grid !important;
  grid-auto-flow: row !important;
  justify-items: end !important;
  align-items: end !important;
  gap: 1px !important;
  text-align: right;
}

.cm-content-action,
.cm-content-status,
.cm-content-priority,
.cmp-content-action,
.cmp-content-priority {
  max-width: 88px !important;
  font-size: 8.5px !important;
  line-height: 1.12 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Prompt-Hinweis am Cluster bleibt nutzbar, nimmt aber keine zweite Textkarte ein. */
body.content-editor-mode .cm-cluster-prompt-badge {
  right: 6px !important;
  bottom: 6px !important;
  width: 23px !important;
  height: 23px !important;
  min-height: 23px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center;
  border-width: 1px !important;
  border-radius: 7px !important;
}

body.content-editor-mode .cm-cluster-prompt-badge span {
  display: none !important;
}

body.content-editor-mode .cm-cluster-prompt-badge svg {
  width: 12px !important;
  height: 12px !important;
}

/* Auf der Gesamtübersicht bleiben nur Typ, Titel und Status sichtbar. */
.cm-world.cm-zoom-medium .cm-content-footer,
.cmp-world.cm-zoom-medium .cmp-content-footer {
  opacity: 0.9;
}

.cm-world.cm-zoom-far .cm-content-footer,
.cmp-world.cm-zoom-far .cmp-content-footer,
.cm-world.cm-zoom-far .cm-node-cluster footer,
.cmp-world.cm-zoom-far .cmp-node-cluster footer,
.cm-world.cm-zoom-far .cm-cluster-prompt-badge,
.cm-world.cm-zoom-far .cm-review-node-badge,
.cmp-world.cm-zoom-far .cmp-review-node-badge {
  display: none !important;
}

.cm-world.cm-zoom-far .cm-node-page,
.cm-world.cm-zoom-far .cm-node-opportunity,
.cmp-world.cm-zoom-far .cmp-node-page,
.cmp-world.cm-zoom-far .cmp-node-opportunity,
.cm-world.cm-zoom-far .cm-node-cluster,
.cmp-world.cm-zoom-far .cmp-node-cluster {
  min-height: inherit !important;
}

/* --------------------------------------------------------------------------
   Themencluster-Übersicht: echte responsive Matrix statt gequetschter Liste
   -------------------------------------------------------------------------- */
body.content-editor-mode .cm-sidebar,
body.content-review-mode .owr-sidebar {
  min-width: 0;
  container-type: inline-size;
}

body.content-editor-mode .cm-cluster-overview,
body.content-review-mode .owr-cluster-overview-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-content: start;
  gap: 10px !important;
}

body.content-editor-mode .cm-cluster-overview-card,
body.content-review-mode .owr-cluster-overview-card {
  min-width: 0;
  min-height: 82px !important;
  padding: 10px !important;
  grid-template-columns: 9px minmax(0, 1fr) auto !important;
  align-items: center;
  gap: 8px !important;
  border-radius: 12px !important;
}

body.content-editor-mode .cm-cluster-overview-copy,
body.content-review-mode .owr-cluster-overview-card > span {
  min-width: 0;
  display: grid;
  gap: 4px !important;
}

body.content-editor-mode .cm-cluster-overview-copy strong,
body.content-review-mode .owr-cluster-overview-card strong {
  min-width: 0;
  font-size: 11.5px !important;
  line-height: 1.25 !important;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2 !important;
  overflow: hidden;
}

body.content-editor-mode .cm-cluster-overview-copy small,
body.content-review-mode .owr-cluster-overview-card small {
  display: none !important;
}

body.content-editor-mode .cm-cluster-overview-copy > span,
body.content-review-mode .owr-cluster-overview-card em {
  min-width: 0;
  font-size: 9.5px !important;
  line-height: 1.25 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.content-editor-mode .cm-cluster-overview-card > b,
body.content-review-mode .owr-cluster-overview-card > b:not(.owr-cluster-comment-count) {
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 6px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 9.5px !important;
}

body.content-editor-mode .cm-cluster-overview-card > svg,
body.content-review-mode .owr-cluster-overview-card > svg {
  display: none !important;
}

body.content-editor-mode .cm-cluster-overview-card > .cm-sidebar-cluster-review,
body.content-review-mode .owr-cluster-comment-count {
  top: 5px !important;
  right: 5px !important;
}

@container (max-width: 389px) {
  body.content-editor-mode .cm-cluster-overview,
  body.content-review-mode .owr-cluster-overview-list {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@container (max-width: 270px) {
  body.content-editor-mode .cm-cluster-overview-card > b,
  body.content-review-mode .owr-cluster-overview-card > b:not(.owr-cluster-comment-count) {
    display: none !important;
  }

  body.content-editor-mode .cm-cluster-overview-card,
  body.content-review-mode .owr-cluster-overview-card {
    grid-template-columns: 9px minmax(0, 1fr) !important;
  }
}

/* --------------------------------------------------------------------------
   Review: breite Clusterübersicht, flexible Mitte und saubere Breakpoints
   -------------------------------------------------------------------------- */
@media (min-width: 1280px) {
  body.content-review-mode .owr-body {
    grid-template-columns: clamp(390px, 27vw, 440px) minmax(0, 1fr) clamp(330px, 23vw, 380px) !important;
  }
}

@media (min-width: 1181px) and (max-width: 1279px) {
  body.content-review-mode .owr-body {
    grid-template-columns: 340px minmax(0, 1fr) 340px !important;
  }

  body.content-review-mode .owr-cluster-overview-list {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (max-width: 1180px) {
  body.content-review-mode .owr-cluster-overview-list {
    grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)) !important;
  }
}

@media (max-width: 700px) {
  body.content-review-mode .owr-cluster-overview-list,
  body.content-editor-mode .cm-cluster-overview {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Der Anordnen-Button ist als eigenständige, nicht gequetschte Aktion sichtbar. */
body.content-review-mode .owr-zoom .owr-arrange-button,
body.content-editor-mode .cm-map-toolbar [data-action="reset-layout"] {
  white-space: nowrap;
}

body.content-review-mode .owr-zoom .owr-arrange-button {
  min-height: 34px;
  padding-inline: 10px;
}