/* css/reports.css - /reports (submit + my reports) and /admin/reports
   (moderation). Page width, list containers, filters and status chips
   come from base.css; form controls from forms.css. */

/* ── Submit a report ──────────────────────────────────────────────────── */

.report-submit {
  margin-bottom: var(--space-6);
  padding: var(--space-5);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
}

.report-submit__heading { margin: 0 0 var(--space-1); font-size: var(--font-size-base); }

.report-submit__hint {
  margin: 0 0 var(--space-4);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.report-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  max-width: 520px;
}
.report-form > .btn { align-self: flex-start; }

/* ── My reports ───────────────────────────────────────────────────────── */

.report-history__heading { margin: var(--space-6) 0 var(--space-3); }

.report-list__empty,
.report-list__loading {
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.report-item {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: 14px var(--space-4);
}

.report-item__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}

.report-item__type { color: var(--color-ink); font-weight: 600; }

.report-item__status--open { --dot: var(--color-warning); }
.report-item__status--resolved { --dot: var(--color-success); }
.report-item__status--dismissed { --dot: var(--color-text-subtle); }

.report-item__description {
  margin: 0;
  color: var(--color-text);
  font-size: var(--font-size-sm);
  white-space: pre-wrap;
  word-break: break-word;
}

.report-item__date {
  margin: 0;
  color: var(--color-text-subtle);
  font-size: var(--font-size-xs);
}

/* ── Admin: moderation queue ──────────────────────────────────────────── */

.admin-reports-filter .form-label { color: var(--color-text-muted); }
.admin-reports-filter__select.form-input { width: auto; min-width: 180px; }

.admin-report-row {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-4);
}

.admin-report-row__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}

.admin-report-type { color: var(--color-ink); font-weight: 600; }

.admin-report-status--open { --dot: var(--color-warning); }
.admin-report-status--resolved { --dot: var(--color-success); }
.admin-report-status--dismissed { --dot: var(--color-text-subtle); }

.admin-report-row__date {
  margin-left: auto;
  color: var(--color-text-subtle);
  font-size: var(--font-size-xs);
}

.admin-report-row__reporter,
.admin-report-row__target {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
  word-break: break-word;
}

/* The reported text, quoted. */
.admin-report-row__description {
  margin: var(--space-1) 0 0;
  padding: var(--space-2) 0 var(--space-2) var(--space-3);
  border-left: 2px solid var(--color-border-strong);
  color: var(--color-text);
  font-size: var(--font-size-sm);
  white-space: pre-wrap;
  word-break: break-word;
}

.admin-report-row__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin-top: var(--space-2);
}

.admin-report-row__error { flex-basis: 100%; }

/* Clickable stat tile (admin dashboard "Open reports") */
.admin-stat-tile--link { cursor: pointer; }
.admin-stat-tile--link:hover { background: var(--color-hover); }

/* ── Appeals and undone-action reports: the proof, and the decision (021) */

.admin-proof {
  margin-top: var(--space-3);
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}
.admin-proof__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.admin-proof__head strong {
  min-width: 0;
  overflow: hidden;
  color: var(--color-ink);
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-proof__meta { margin: 2px 0 0; color: var(--color-text-muted); font-size: var(--font-size-sm); }
.admin-proof .submission-card__proof { background: transparent; }

.admin-report-row__actions--proof {
  flex-direction: column;
  align-items: stretch;
  margin-top: var(--space-3);
}
.admin-proof__buttons { display: flex; flex-wrap: wrap; gap: var(--space-2); }