/* 신고 관리 — 패턴 위 흰 CardView(머리 카드 · 신고 목록 카드) + 신고 처리 Modal(460).
   dlab-* 컴포넌트 클래스는 덮어쓰지 않고, 감싸는 요소의 바깥 배치만 정한다. */

/* 처리 상태 필터 — 고르는 Tag 한 줄. 한 줄에 다 안 들어가면 가로로 스크롤한다(가이드 8장 Tag). */
.reports-filter-row { display: flex; flex-direction: column; gap: var(--dlab-space-10); min-width: 0; }
.reports-filter-label { color: var(--dlab-color-text-secondary); }
.reports-filter-tags {
  display: flex;
  gap: var(--dlab-space-10);
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
  /* 포커스 테두리(2px + 2px)가 잘리지 않게 안쪽 여백을 둔다 */
  padding: var(--dlab-space-5);
  margin: calc(-1 * var(--dlab-space-5));
}

/* 도구 줄 — 검색(높이 40) · 대상 Select(40) · 초기화 Text 버튼 */
.reports-search { flex-basis: 100%; }
.reports-select-filter { flex: 1 1 160px; }
.reports-results { color: var(--dlab-color-text-secondary); }

/* 표 칸 안 — 대상 이름 · 보조 정보를 세로로, 배지는 한 줄로 */
.reports-cell-stack { display: flex; flex-direction: column; gap: var(--dlab-space-5); padding: var(--dlab-space-10) 0; min-width: 140px; }
.reports-cell-title { font-weight: var(--dlab-font-weight-bold); }
.reports-secondary { color: var(--dlab-color-text-secondary); font-size: var(--dlab-font-size-description); line-height: var(--dlab-font-line-height-base); }
.reports-badges { display: flex; flex-wrap: wrap; gap: var(--dlab-space-5); }
.reports-nowrap { white-space: nowrap; }

/* Modal 본문 — 신고 내용이 길면 이 영역 안에서 스크롤한다(Modal 폭 460은 그대로). */
.reports-modal-scroll {
  max-height: calc(100vh - 220px);
  overflow-y: auto;
  /* 포커스 테두리가 잘리지 않게 안쪽 여백을 둔다 */
  padding: var(--dlab-space-5);
  margin: calc(-1 * var(--dlab-space-5));
}
.reports-modal-scroll:focus { outline: none; }
.reports-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--dlab-space-10) var(--dlab-space-20); }
.reports-facts > div { display: flex; flex-direction: column; gap: var(--dlab-space-5); min-width: 0; }
.reports-facts dt { color: var(--dlab-color-text-secondary); }
.reports-preserve { white-space: pre-wrap; }
.reports-history { display: flex; flex-direction: column; gap: var(--dlab-space-10); padding-left: var(--dlab-space-20); white-space: pre-wrap; }
.reports-radio-group { display: flex; flex-direction: column; gap: var(--dlab-space-10); }
.reports-radio-group > legend { margin-bottom: var(--dlab-space-10); }
.reports-radio-list { display: flex; flex-wrap: wrap; gap: var(--dlab-space-10) var(--dlab-space-20); }
.reports-impact { color: var(--dlab-color-text-secondary); }
.reports-impact:empty { display: none; }
.reports-summary { display: flex; flex-direction: column; gap: var(--dlab-space-10); padding: var(--dlab-space-15); background: var(--dlab-color-bg-subtle); }
.reports-summary > div { display: flex; flex-direction: column; gap: var(--dlab-space-5); }
.reports-summary dt { color: var(--dlab-color-text-secondary); }
.reports-summary dd { white-space: pre-wrap; }
.comment-moderation-content {
  min-width: 220px;
  max-width: 360px;
  white-space: pre-wrap;
  word-break: break-word;
}
.comment-moderation-meta { display: flex; flex-direction: column; gap: var(--dlab-space-5); min-width: 160px; }
.comment-moderation-review { display: flex; flex-direction: column; gap: var(--dlab-space-10); min-width: 220px; }
.comment-moderation-note { display: flex; flex-direction: column; gap: var(--dlab-space-5); }
.comment-moderation-note textarea { resize: vertical; }
.comment-moderations-pagination { display: flex; align-items: center; justify-content: center; gap: var(--dlab-space-15); }

@media (min-width: 720px) {
  .reports-search { flex-basis: 240px; max-width: 400px; }
  .reports-select-filter { flex: 0 0 180px; }
  .reports-filter-row { flex-direction: row; align-items: center; gap: var(--dlab-space-15); }
  .reports-filter-label { flex: 0 0 60px; }
}
@media (min-width: 1080px) {
  .reports-filter-tags { flex-wrap: wrap; overflow: visible; }
}

/* 모의 운영: kit Select/TextField/DataTable/460px Modal의 바깥 배치만 확장한다. */
.report-trust-filters { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--dlab-space-20); }
.report-trust-metrics { min-width: 220px; white-space: normal; }
.report-trust-report { padding-top: var(--dlab-space-20); border-top: var(--dlab-border-width-thin) solid var(--dlab-color-border-subtle); overflow-wrap: anywhere; }
@media (min-width: 720px) {
  .report-trust-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1080px) {
  .report-trust-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}