/**
 * OW Onboarding Tool v0.93.0
 * Cluster-Feedback, sichere Cluster-Wechsel, erweiterte Status-/Quellenlogik
 * und entscheidungsorientierter Review-Workflow.
 */

/* --------------------------------------------------------------------------
   Gemeinsame Status- und Quellenfarben
   -------------------------------------------------------------------------- */
:root {
  --cm-status-existing: #3157d5;
  --cm-status-planned: #168653;
  --cm-status-candidate: #7b62c8;
  --cm-status-discussion: #a56b12;
  --cm-status-revision: #c35c2d;
  --cm-status-hidden: #747780;
  --cm-status-reference: #24708a;
  --cm-status-merge: #8a5b20;
  --cm-status-discard: #a84646;
  --cm-status-low-priority: #73766f;
}

.cm-content-type.status-existing,
.cm-content-type.existing,
.cmp-content-type.status-existing,
.cmp-content-type.existing { color: var(--cm-status-existing); }
.cm-content-type.status-planned,
.cm-content-type.planned,
.cmp-content-type.status-planned,
.cmp-content-type.planned { color: var(--cm-status-planned); }
.cm-content-type.status-candidate,
.cm-content-type.candidate,
.cmp-content-type.status-candidate,
.cmp-content-type.candidate { color: var(--cm-status-candidate); }
.cm-content-type.status-discussion,
.cm-content-type.discussion,
.cmp-content-type.status-discussion,
.cmp-content-type.discussion { color: var(--cm-status-discussion); }
.cm-content-type.status-revision,
.cm-content-type.revision,
.cmp-content-type.status-revision,
.cmp-content-type.revision { color: var(--cm-status-revision); }
.cm-content-type.status-hidden,
.cm-content-type.hidden,
.cmp-content-type.status-hidden,
.cmp-content-type.hidden { color: var(--cm-status-hidden); }
.cm-content-type.status-reference,
.cm-content-type.reference,
.cmp-content-type.status-reference,
.cmp-content-type.reference { color: var(--cm-status-reference); }
.cm-content-type.status-merge,
.cm-content-type.merge,
.cmp-content-type.status-merge,
.cmp-content-type.merge { color: var(--cm-status-merge); }
.cm-content-type.status-discard,
.cm-content-type.discard,
.cmp-content-type.status-discard,
.cmp-content-type.discard { color: var(--cm-status-discard); }
.cm-content-type.status-low-priority,
.cm-content-type.low-priority,
.cmp-content-type.status-low-priority,
.cmp-content-type.low-priority { color: var(--cm-status-low-priority); }

.cm-content-status.status-existing { color: var(--cm-status-existing) !important; }
.cm-content-status.status-planned { color: var(--cm-status-planned) !important; }
.cm-content-status.status-candidate { color: var(--cm-status-candidate) !important; }
.cm-content-status.status-discussion { color: var(--cm-status-discussion) !important; }
.cm-content-status.status-revision { color: var(--cm-status-revision) !important; }
.cm-content-status.status-hidden { color: var(--cm-status-hidden) !important; }
.cm-content-status.status-reference { color: var(--cm-status-reference) !important; }
.cm-content-status.status-merge { color: var(--cm-status-merge) !important; }
.cm-content-status.status-discard { color: var(--cm-status-discard) !important; }
.cm-content-status.status-low-priority { color: var(--cm-status-low-priority) !important; }

/* Keep the established card geometry but let workflow states remain visible. */
.cm-node-page.status-candidate,
.cm-node-opportunity.status-candidate,
.cmp-node-page.status-candidate,
.cmp-node-opportunity.status-candidate,
.owr-node.status-candidate {
  --cm-card-accent: var(--cm-status-candidate);
  --cm-card-soft: #faf8ff;
  --cm-card-border: #cfc4ec;
}
.cm-node-page.status-discussion,
.cm-node-opportunity.status-discussion,
.cmp-node-page.status-discussion,
.cmp-node-opportunity.status-discussion,
.owr-node.status-discussion {
  --cm-card-accent: var(--cm-status-discussion);
  --cm-card-soft: #fffbf2;
  --cm-card-border: #e7cf9e;
}
.cm-node-page.status-revision,
.cm-node-opportunity.status-revision,
.cmp-node-page.status-revision,
.cmp-node-opportunity.status-revision,
.owr-node.status-revision {
  --cm-card-accent: var(--cm-status-revision);
  --cm-card-soft: #fff8f4;
  --cm-card-border: #e8bca7;
}
.cm-node-page.status-hidden,
.cm-node-opportunity.status-hidden,
.cmp-node-page.status-hidden,
.cmp-node-opportunity.status-hidden,
.owr-node.status-hidden {
  --cm-card-accent: var(--cm-status-hidden);
  --cm-card-soft: #f7f7f6;
  --cm-card-border: #cfd0d2;
}
.cm-node-page.status-reference,
.cm-node-opportunity.status-reference,
.cmp-node-page.status-reference,
.cmp-node-opportunity.status-reference,
.owr-node.status-reference {
  --cm-card-accent: var(--cm-status-reference);
  --cm-card-soft: #f4fbfd;
  --cm-card-border: #abd1dd;
}
.cm-node-page.status-merge,
.cm-node-opportunity.status-merge,
.cmp-node-page.status-merge,
.cmp-node-opportunity.status-merge,
.owr-node.status-merge {
  --cm-card-accent: var(--cm-status-merge);
  --cm-card-soft: #fdf9f2;
  --cm-card-border: #dcc79f;
}
.cm-node-page.status-discard,
.cm-node-opportunity.status-discard,
.cmp-node-page.status-discard,
.cmp-node-opportunity.status-discard,
.owr-node.status-discard {
  --cm-card-accent: var(--cm-status-discard);
  --cm-card-soft: #fff7f7;
  --cm-card-border: #e0b1b1;
  opacity: .76;
}
.cm-node-page.status-low-priority,
.cm-node-opportunity.status-low-priority,
.cmp-node-page.status-low-priority,
.cmp-node-opportunity.status-low-priority,
.owr-node.status-low-priority {
  --cm-card-accent: var(--cm-status-low-priority);
  --cm-card-soft: #f8f8f6;
  --cm-card-border: #d1d2cd;
}

.cm-node-page.status-hidden,
.cm-node-opportunity.status-hidden,
.cmp-node-page.status-hidden,
.cmp-node-opportunity.status-hidden,
.owr-node.status-hidden { opacity: .82; }

.cm-sidebar-content-item.status-candidate { border-left-color: var(--cm-status-candidate) !important; }
.cm-sidebar-content-item.status-discussion { border-left-color: var(--cm-status-discussion) !important; }
.cm-sidebar-content-item.status-revision { border-left-color: var(--cm-status-revision) !important; }
.cm-sidebar-content-item.status-hidden { border-left-color: var(--cm-status-hidden) !important; opacity: .8; }
.cm-sidebar-content-item.status-reference { border-left-color: var(--cm-status-reference) !important; }
.cm-sidebar-content-item.status-merge { border-left-color: var(--cm-status-merge) !important; }
.cm-sidebar-content-item.status-discard { border-left-color: var(--cm-status-discard) !important; opacity: .7; }
.cm-sidebar-content-item.status-low-priority { border-left-color: var(--cm-status-low-priority) !important; }

/* Extended source badges. */
.cm-source-badge.news,
.cmp-source-badge.news,
.owr-source-badge.news { background: #fff4ed; border-color: #edc8ad; color: #92501f; }
.cm-source-badge.help-center,
.cmp-source-badge.help-center,
.owr-source-badge.help-center { background: #eef6ff; border-color: #bfd7ef; color: #245f8e; }
.cm-source-badge.trust-center,
.cmp-source-badge.trust-center,
.owr-source-badge.trust-center { background: #eef8f1; border-color: #bedcc7; color: #28643b; }
.cm-source-badge.external-article,
.cmp-source-badge.external-article,
.owr-source-badge.external-article { background: #f6f0ff; border-color: #d3c0eb; color: #674794; }
.cm-source-badge.landing-page,
.cmp-source-badge.landing-page,
.owr-source-badge.landing-page { background: #f5f5f2; border-color: #d7d7d1; color: #555650; }
.cm-source-badge.solutions-page,
.cmp-source-badge.solutions-page,
.owr-source-badge.solutions-page { background: #eef2ff; border-color: #c4ccef; color: #3e52a2; }

/* Legacy class aliases remain visually consistent during migration. */
.cm-source-badge.docs,
.cmp-source-badge.docs,
.owr-source-badge.docs { background: #eef6ff; border-color: #bfd7ef; color: #245f8e; }
.cm-source-badge.trust,
.cmp-source-badge.trust,
.owr-source-badge.trust { background: #eef8f1; border-color: #bedcc7; color: #28643b; }

/* --------------------------------------------------------------------------
   Editor filter and cluster review counters
   -------------------------------------------------------------------------- */
.cm-filter-select-wrap,
.owr-filter-select {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.cm-filter-select-wrap {
  margin: 0 12px 12px;
}

.cm-filter-select-wrap > span,
.owr-filter-select > span {
  color: #8a8a84;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: .035em;
}

.cm-filter-select,
.owr-filter-select select {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 32px 0 10px;
  border: 1px solid #dfdfda;
  border-radius: 9px;
  background-color: #fff;
  color: #292929;
  font: inherit;
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
}

.cm-filter-select:focus,
.owr-filter-select select:focus {
  outline: none;
  border-color: #9ca7c8;
  box-shadow: 0 0 0 3px rgba(49, 87, 213, .09);
}

.owr-filter-select {
  margin: 0 16px 12px;
}

body.content-editor-mode .cm-sidebar-cluster-main {
  grid-template-columns: 9px minmax(0, 1fr) auto auto;
}

.cm-sidebar-cluster-review,
.owr-sidebar-group > button em {
  min-width: 24px;
  height: 22px;
  padding: 0 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: 1px solid #d7d9df;
  border-radius: 999px;
  background: #fff;
  color: #4a5267;
  font-size: 10px;
  line-height: 1;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
}

.cm-sidebar-cluster-review svg,
.owr-sidebar-group > button em svg {
  width: 11px;
  height: 11px;
}

body.content-review-mode .owr-sidebar-group > button {
  grid-template-columns: 10px minmax(0, 1fr) auto auto;
}

/* --------------------------------------------------------------------------
   Safe drag-and-drop between clusters
   -------------------------------------------------------------------------- */
[data-content-drag-key] {
  cursor: grab;
}

[data-content-drag-key]:active {
  cursor: grabbing;
}

.content-dragging {
  opacity: .42 !important;
  transform: scale(.985);
}

.content-drag-active [data-content-drop-cluster] {
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.content-drag-active [data-content-drop-cluster].content-drop-hover,
.content-drag-active .content-drop-hover [data-content-drop-cluster] {
  border-color: color-mix(in srgb, var(--cluster-color, #3157d5) 68%, #fff) !important;
  background: color-mix(in srgb, var(--cluster-color, #3157d5) 7%, #fff) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--cluster-color, #3157d5) 15%, transparent), 0 12px 28px rgba(35, 35, 35, .09) !important;
}

.cm-node-cluster.content-drop-hover {
  transform: translateY(-2px);
}

.cm-sidebar-cluster-group.content-drop-hover {
  border-radius: 10px;
}

/* --------------------------------------------------------------------------
   Inspector cluster selector and move dialog
   -------------------------------------------------------------------------- */
.cm-cluster-move-field {
  padding: 12px;
  border: 1px solid #e3e3de;
  border-radius: 12px;
  background: #fafaf8;
}

.cm-cluster-move-field small {
  display: block;
  margin-top: 6px;
  color: #85857f;
  font-size: 10px;
  line-height: 1.45;
}

.cm-move-content-button {
  justify-content: center;
}

.cm-content-move-modal {
  width: min(660px, calc(100vw - 32px));
}

.cm-content-move-modal .cm-modal-body {
  display: grid;
  gap: 16px;
}

.cm-content-move-modal > footer {
  align-items: center;
  gap: 16px;
}

.cm-content-move-modal > footer > div {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.cm-move-summary {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid #dfdfda;
  border-radius: 13px;
  background: #fafaf8;
}

.cm-move-summary > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.cm-move-summary strong,
.cm-move-summary small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.cm-move-summary strong {
  color: #292929;
  font-size: 13px;
  font-weight: 600;
}

.cm-move-summary small {
  color: #81817b;
  font-size: 11px;
}

.cm-move-scope {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.cm-move-scope legend {
  margin-bottom: 7px;
  color: #5d5d5d;
  font-size: 11px;
  font-weight: 600;
}

.cm-move-scope label {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid #e1e1dc;
  border-radius: 11px;
  background: #fff;
  cursor: pointer;
}

.cm-move-scope label:has(input:checked) {
  border-color: #aeb9d9;
  background: #f7f9ff;
  box-shadow: inset 3px 0 0 #3157d5;
}

.cm-move-scope input {
  margin: 3px 0 0;
  accent-color: #292929;
}

.cm-move-scope label > span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.cm-move-scope strong {
  color: #292929;
  font-size: 12px;
  font-weight: 600;
}

.cm-move-scope small {
  color: #85857f;
  font-size: 10px;
  line-height: 1.4;
}

.cm-move-warning {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  padding: 12px 13px;
  border: 1px solid #ead2a2;
  border-radius: 11px;
  background: #fffaf0;
  color: #805814;
}

.cm-move-warning > svg {
  width: 16px;
  height: 16px;
  margin-top: 1px;
}

.cm-move-warning p {
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
}

.cm-move-warning p + p {
  margin-top: 5px;
}

.cm-move-note {
  color: #85857f;
  font-size: 10px;
  line-height: 1.45;
}

/* --------------------------------------------------------------------------
   Internal review decisions and direct change tools
   -------------------------------------------------------------------------- */
.cm-review-comment-row {
  position: relative;
}

.cm-review-comment-row.decision-discussion { border-left: 3px solid #b17a22; }
.cm-review-comment-row.decision-deferred { border-left: 3px solid #777b83; }
.cm-review-comment-row.decision-accepted { border-left: 3px solid #168653; }
.cm-review-comment-row.decision-rejected { border-left: 3px solid #a84646; }
.cm-review-comment-row.decision-resolved { border-left: 3px solid #3157d5; }

.cm-review-content-type,
.owr-submitted-target {
  display: inline-flex;
  align-items: center;
  min-height: 21px;
  padding: 0 7px;
  border: 1px solid #d8d9dc;
  border-radius: 999px;
  background: #f7f7f5;
  color: #5f6166;
  font-size: 9px;
  line-height: 1;
  font-weight: 700;
  white-space: nowrap;
}

.cm-review-content-type.type-cluster,
.owr-submitted-target.type-cluster { background: #f0f3ff; border-color: #cbd3ef; color: #40549a; }
.cm-review-content-type.type-opportunity,
.owr-submitted-target.type-opportunity { background: #f0f8f3; border-color: #c2ddcb; color: #286b43; }
.cm-review-content-type.type-page,
.owr-submitted-target.type-page { background: #f3f6ff; border-color: #cbd5ef; color: #345a9e; }
.cm-review-content-type.type-missing { background: #f7f1f1; border-color: #e2c8c8; color: #8a4848; }

.cm-review-decision-bar {
  min-width: 0;
  display: grid;
  gap: 9px;
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid #ecece8;
}

.cm-review-decision-label {
  color: #85857f;
  font-size: 10px;
}

.cm-review-decision-label b {
  color: #3e3e3a;
  font-weight: 700;
}

.cm-review-decision-bar > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.cm-review-decision-bar button {
  min-height: 31px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 9px;
  border: 1px solid #dededa;
  border-radius: 8px;
  background: #fff;
  color: #676762;
  font: inherit;
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .14s ease, background .14s ease, color .14s ease, transform .14s ease;
}

.cm-review-decision-bar button:hover {
  transform: translateY(-1px);
  border-color: #bfc0bc;
  color: #292929;
}

.cm-review-decision-bar button svg {
  width: 12px;
  height: 12px;
}

.cm-review-decision-bar .decision-accepted.active,
.cm-review-decision-bar .decision-accepted:hover { border-color: #9fc8ae; background: #eef8f1; color: #256b3e; }
.cm-review-decision-bar .decision-discussion.active,
.cm-review-decision-bar .decision-discussion:hover { border-color: #dfc48e; background: #fff9ed; color: #845c14; }
.cm-review-decision-bar .decision-deferred.active,
.cm-review-decision-bar .decision-deferred:hover { border-color: #c7c8cc; background: #f4f4f3; color: #595c63; }
.cm-review-decision-bar .decision-rejected.active,
.cm-review-decision-bar .decision-rejected:hover { border-color: #ddb1b1; background: #fff2f2; color: #963f3f; }
.cm-review-decision-bar .decision-resolved.active,
.cm-review-decision-bar .decision-resolved:hover { border-color: #bcc8eb; background: #f0f4ff; color: #3157a8; }
.cm-review-decision-bar .decision-open:hover { border-color: #c7c8cb; background: #f7f7f5; }

.cm-review-change-tools {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.cm-review-change-box {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 11px;
  border: 1px solid #e3e3df;
  border-radius: 11px;
  background: #fafaf8;
}

.cm-review-change-box > strong {
  color: #555550;
  font-size: 10px;
  font-weight: 700;
}

.cm-review-change-box select {
  width: 100%;
  min-width: 0;
  height: 34px;
  padding: 0 29px 0 9px;
  border: 1px solid #ddddda;
  border-radius: 8px;
  background: #fff;
  color: #343431;
  font: inherit;
  font-size: 10px;
}

.cm-review-change-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.cm-review-change-check {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #73736e;
  font-size: 10px;
}

.cm-review-change-check input {
  margin: 0;
  accent-color: #292929;
}

/* --------------------------------------------------------------------------
   Review cluster feedback
   -------------------------------------------------------------------------- */
body.content-review-mode .owr-cluster-comments {
  margin-top: 14px;
}

body.content-review-mode .owr-cluster-content-item.status-candidate { border-left-color: var(--cm-status-candidate); background: #faf8ff; }
body.content-review-mode .owr-cluster-content-item.status-discussion { border-left-color: var(--cm-status-discussion); background: #fffbf2; }
body.content-review-mode .owr-cluster-content-item.status-revision { border-left-color: var(--cm-status-revision); background: #fff8f4; }
body.content-review-mode .owr-cluster-content-item.status-hidden { border-left-color: var(--cm-status-hidden); opacity: .8; }
body.content-review-mode .owr-cluster-content-item.status-reference { border-left-color: var(--cm-status-reference); background: #f4fbfd; }
body.content-review-mode .owr-cluster-content-item.status-merge { border-left-color: var(--cm-status-merge); background: #fdf9f2; }
body.content-review-mode .owr-cluster-content-item.status-discard { border-left-color: var(--cm-status-discard); background: #fff7f7; opacity: .72; }
body.content-review-mode .owr-cluster-content-item.status-low-priority { border-left-color: var(--cm-status-low-priority); background: #f8f8f6; }

body.content-review-mode .owr-node-review-actions .kind-improvement:hover,
body.content-review-mode .owr-node-review-actions .kind-improvement:focus-visible {
  color: #7c5514;
  border-color: #e4ca92;
  background: #fff9eb;
}

body.content-review-mode .owr-submitted-kind.kind-improvement {
  background: #fff8e9;
  border-color: #ead19d;
  color: #805716;
}

/* --------------------------------------------------------------------------
   Responsive refinements
   -------------------------------------------------------------------------- */
@media (max-width: 900px) {
  .cm-review-change-tools,
  .cm-review-change-grid {
    grid-template-columns: 1fr;
  }

  .cm-content-move-modal > footer {
    align-items: stretch;
    flex-direction: column;
  }

  .cm-content-move-modal > footer > div {
    width: 100%;
  }

  .cm-content-move-modal > footer .cm-button {
    flex: 1 1 0;
  }
}

@media (max-width: 620px) {
  body.content-editor-mode .cm-sidebar-cluster-main,
  body.content-review-mode .owr-sidebar-group > button {
    grid-template-columns: 9px minmax(0, 1fr) auto;
  }

  .cm-sidebar-cluster-review,
  .owr-sidebar-group > button em {
    display: none;
  }

  .cm-review-decision-bar button span {
    display: none;
  }

  .cm-review-decision-bar button {
    width: 32px;
    padding: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-content-drag-key],
  .content-drag-active [data-content-drop-cluster],
  .cm-review-decision-bar button {
    transition: none !important;
  }
}
