.text-muted {
  color: var(--color-ink-muted);
  font-size: var(--text-x-small);
}

form:has(input[type="checkbox"]:checked) .button--delete {
  opacity: 1;
  pointer-events: auto;
}

.no-scroll {
  overflow: hidden;
  position: fixed;
}

.text-positive {
  color: var(--color-positive);
}

.text-negative {
  color: var(--color-negative);
}

.text-align-center {
  text-align: center;
}

.status-with-icons {
  display: flex;
  align-items: center;
  gap: var(--inline-space-half);
}

.status-icon {
  font-size: var(--text-small);
}

.status-icon--success {
  color: var(--color-status-success);
}

.status-icon--pending {
  color: var(--color-status-pending);
}

.status-icon--ignored {
  color: var(--color-status-ignored);
}


.margin-top {
  margin-top: var(--block-space);
}

.margin-top-double {
  margin-top: var(--block-space-double);
}

.margin-bottom-half {
  margin-bottom: var(--block-space-half);
}

.details--indicator summary {
  list-style: none;
}

.details--indicator summary::before {
  content: '▶';
  color: var(--color-grey-dark);
  margin-right: 0.5em;
  display: inline-block;
  transition: transform 0.2s;
}

.details--indicator[open] summary::before {
  transform: rotate(90deg);
}