/* Code review: policy, repositories and activity. Drawn from the Sendplane design
 * system's tokens and the hosted dashboard's recipes (docs/design-system.md); no values of its own. */

.hosted-review .capitalize { text-transform: capitalize; }
.hosted-review .review-group { border-top: 1px solid var(--line); }
.hosted-review .review-group > h3 { margin: 0; padding: 14px 20px 6px; font-size: 13px; }
.hosted-review .review-group > .metadata-grid { border-top: 1px solid var(--line); }
.hosted-review .review-group > .table-wrap { border-top: 1px solid var(--line); }
.hosted-review .review-group > .panel-body { padding-top: 0; }

/* Diff of an unsaved policy: one line per change, the effect first as a status word. */
.review-diff { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.review-diff li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; min-width: 0; }
.review-diff-text { min-width: 0; overflow-wrap: anywhere; color: var(--ink); font-size: 13px; }
.review-diff-panel .notice { margin: 4px 0; }
.review-diff-panel .notice p { margin: 0 0 8px; }
.review-errors { display: grid; gap: 4px; margin: 0; padding: 10px 14px; list-style: none; border: 1px solid var(--danger-border); border-radius: var(--radius-callout); color: var(--danger-fg); background: var(--danger-bg); font-size: 13px; }

/* Workflow pins and the one-time activation code are identifiers: mono chips that wrap rather than overflow. */
.review-ref { display: block; width: fit-content; max-width: 100%; }
.review-ref + .review-ref { margin-top: 4px; }
.review-code { display: inline-block; max-width: 100%; overflow-wrap: anywhere; user-select: all; }

/* Rounds histogram: a meter per row, using the same progress recipe as the usage meters. */
.review-bar { min-width: 140px; width: 40%; }
.review-bar progress { width: 100%; height: 6px; overflow: hidden; border: 0; border-radius: var(--radius-pill); color: var(--accent); background: var(--surface-inset); appearance: none; }
.review-bar progress::-webkit-progress-bar { border-radius: inherit; background: var(--surface-inset); }
.review-bar progress::-webkit-progress-value { border-radius: inherit; background: var(--accent); }
.review-bar progress::-moz-progress-bar { border-radius: inherit; background: var(--accent); }