/* ==========================================================================
   CareMetrix — Incident Report. Search + Category/Status filters + a date
   range "More filters" panel, a live table with pagination, and a read-only
   View Incident drawer. Reuses global components (.page-head, .stat-grid,
   .toolbar, .select, .card, .commonstyletabletwo, .pagination, .badge,
   .dot-meta, .drawer, .overlay) — this file only covers what's specific to
   this page.
   ========================================================================== */

.ir-filters { padding: 18px 24px 20px; background: var(--surface-2); border: 1px solid var(--border); border-top: none; border-radius: 0 0 var(--r-lg) var(--r-lg); margin-top: -14px; }
.ir-filters[hidden] { display: none; }
.ir-filters__row { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap; }
.ir-filter { display: flex; flex-direction: column; gap: 6px; flex: 1 1 0; min-width: 160px; }
.ir-filter__label { font-size: 12px; font-weight: 600; color: var(--text-2); }
.ir-filters__actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; margin-left: auto; }

.ir-listrow-note { text-align: center; color: var(--text-3); padding: 40px 16px; }
.ir-listrow-note svg { width: 30px; height: 30px; color: var(--text-3); margin-bottom: 8px; }

/* -------------------------------------------------------------- drawer -- */
.ir-section { font-size: 11.5px; font-weight: 600; color: var(--brand-purple); text-transform: uppercase; letter-spacing: .05em; margin: 22px 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.ir-section:first-child { margin-top: 0; }
.ir-detailgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ir-detailgrid div { display: flex; flex-direction: column; gap: 3px; }
.ir-detailgrid span { font-size: 11.5px; color: var(--text-3); }
.ir-detailgrid b { font-size: 13px; color: var(--text); font-weight: 700; }
.ir-note { font-size: 12.5px; color: var(--text-2); background: var(--surface-2); border-radius: 10px; padding: 10px 12px; line-height: 1.5; margin: 0; }
.ir-viewfoot__spacer { flex: 1; }

@media (max-width: 760px) {
  .ir-filters__row { flex-direction: column; align-items: stretch; }
  .ir-filters__actions { margin-left: 0; }
  .ir-detailgrid { grid-template-columns: 1fr; }
}