/* History: compact, time-ordered list of changes (js/history.js). */

.cwh {
  font-size: var(--cw-fs, 13px);
  line-height: var(--cw-lh, 1.4);
  color: var(--cw-text, #1b1f24);
}

.cwh-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cwh-item {
  display: flex;
  align-items: baseline;
  gap: var(--cw-pad-3, 8px);
  padding: var(--cw-pad, 4px) 0;
  border-bottom: 1px solid var(--cw-border, #d4d8de);
}

.cwh-item:last-child {
  border-bottom: 0;
}

.cwh-mark {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  align-self: center;
  border-radius: var(--cw-radius, 0);
  background: var(--cw-border-strong, #9aa3ad);
}

.cwh-mark--comment { background: var(--cw-accent, #1d4ed8); }
.cwh-mark--drawing { background: var(--cw-warn, #b26a00); }
.cwh-mark--page { background: var(--cw-ok, #2e7d32); }
.cwh-mark--diagram { background: var(--cw-purple, #5e35b1); }
.cwh-mark--context { background: var(--cw-muted, #5b6570); }
.cwh-mark--workflow { background: var(--cw-text, #1b1f24); }
.cwh-mark--person { background: var(--cw-k-change, #ef6c00); }
.cwh-mark--assignment { background: var(--cw-k-add, #6a1b9a); }

.cwh-text {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.cwh-actor {
  font-weight: 600;
}

.cwh a.cwh-link,
.cwh a.cwh-link:hover {
  color: inherit;
  text-decoration: none;
}

.cwh a.cwh-link:hover .cwh-rest,
.cwh a.cwh-link:focus-visible .cwh-rest {
  text-decoration: underline;
}

.cwh a.cwh-link:focus-visible {
  outline: 2px solid var(--cw-accent, #1d4ed8);
  outline-offset: 1px;
}

.cwh-time {
  flex: 0 0 auto;
  color: var(--cw-muted, #5b6570);
  font-size: var(--cw-fs-sm, 12px);
  white-space: nowrap;
}

.cwh-status {
  color: var(--cw-muted, #5b6570);
  padding: var(--cw-pad, 4px) 0;
}

.cwh-status:empty {
  display: none;
}

.cwh-status--error {
  color: var(--cw-danger, #c62828);
}

.cwh .cwh-more,
.cwh .cwh-retry,
.cwh .cwh-group {
  font: inherit;
  font-size: var(--cw-fs-sm, 12px);
  color: var(--cw-accent, #1d4ed8);
  background: var(--cw-surface, #ffffff);
  border: 1px solid var(--cw-border, #d4d8de);
  border-radius: var(--cw-radius, 0);
  padding: 2px var(--cw-pad-3, 8px);
  cursor: pointer;
}

.cwh .cwh-more {
  margin-top: var(--cw-pad, 4px);
}

.cwh .cwh-more[hidden] {
  display: none;
}

.cwh .cwh-more:hover,
.cwh .cwh-retry:hover,
.cwh .cwh-group:hover {
  border-color: var(--cw-border-strong, #9aa3ad);
  background: var(--cw-surface-2, #f8f9fa);
}

.cwh .cwh-more:focus-visible,
.cwh .cwh-retry:focus-visible,
.cwh .cwh-group:focus-visible {
  outline: 2px solid var(--cw-accent, #1d4ed8);
  outline-offset: 1px;
}

.cwh .cwh-more:disabled {
  color: var(--cw-muted, #5b6570);
  cursor: default;
}

/* A run of similar changes collapsed into one row; "+ 38 more" opens it. */
.cwh .cwh-group {
  flex: 0 0 auto;
  align-self: center;
  padding: 0 var(--cw-pad, 4px);
  white-space: nowrap;
}

.cwh .cwh-group[aria-expanded="true"] {
  color: var(--cw-muted, #5b6570);
}

.cwh-item--sub {
  padding-left: var(--cw-pad-3, 8px);
  background: var(--cw-surface-2, #f8f9fa);
}

.cwh-item--sub .cwh-mark {
  opacity: 0.5;
}

@media (pointer: coarse) {
  .cwh-item {
    padding: var(--cw-pad-2, 6px) 0;
  }

  .cwh .cwh-more,
  .cwh .cwh-retry,
  .cwh .cwh-group {
    min-height: var(--cw-tap, 40px);
    padding: 0 var(--cw-pad-3, 8px);
  }
}