/* Operations feature: Admin › Reports and Admin › System. Light surfaces only. */

/* ---- date range and filters ---- */
.ops-range { align-items: center; background: #fff; border: 1px solid var(--g1); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 6px; }
.ops-range input[type="date"], .ops-range select { width: auto; max-width: 190px; padding: 7px 9px; }
.ops-inline { font-size: 13px; font-weight: 600; color: var(--navy); }
.ops-presets { display: flex; gap: 6px; flex-wrap: wrap; }
.ops-presets .chip { cursor: pointer; font: inherit; font-size: 13px; color: var(--slate); }
.ops-presets .chip.on { color: var(--navy); }
.ops-range-note { font-size: 13px; margin: 0 0 16px; }

/* ---- headline figures ---- */
.ops-figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px 16px; margin: 12px 0; }
.ops-figures > div { min-width: 0; }
.ops-figures dt { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.ops-figures dd { margin: 2px 0 0; font-size: 19px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ops-figures-wide { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); background: #fff; border: 1px solid var(--g1); border-radius: var(--radius); padding: 14px 16px; margin: 0 0 18px; }
.card .ops-figures-wide { border: 0; padding: 0; margin: 0; flex: 1; }

/* ---- report cards ---- */
.ops-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ops-card { min-width: 0; }
.ops-card-head { display: flex; gap: 14px; align-items: flex-start; }
.ops-card-head > div:first-child, .ops-card-head > dl { flex: 1; min-width: 0; }
.ops-card-head h2 { margin: 0 0 2px; }
.ops-card-head p { margin: 0; font-size: 13.5px; }
.ops-card-actions { display: flex; gap: 8px; flex: none; margin: 0; }
.ops-card-sub { font-size: 13px; margin: 14px 0 8px; color: var(--navy); }
.ops-card .table { font-size: 13px; }
.ops-card .table th, .ops-card .table td { padding: 7px 10px; }
.ops-card .empty { padding: 18px 12px; }

/* ---- tables ---- */
.ops-table td, .ops-table th { vertical-align: top; }
.ops-table tbody th { background: #fff; text-transform: none; letter-spacing: 0; font-size: 14px; color: var(--navy); font-weight: 600; border-top: 1px solid var(--g1); }
.ops-section .ops-note { padding: 0 18px 12px; margin: 0; font-size: 13px; }
.ops-count { margin-left: auto; font-size: 13px; }
.ops-nowrap { white-space: nowrap; }
.ops-break { overflow-wrap: anywhere; }
.ops-preview { color: var(--slate); font-size: 13px; overflow-wrap: anywhere; max-width: 460px; }
.ops-row-warn td, .ops-row-warn th { background: var(--bad-bg); }
.ops-note-plain { font-size: 13px; }

/* ---- lists and forms ---- */
.ops-list { margin: 6px 0 0; padding-left: 18px; font-size: 13.5px; }
.ops-list li { margin-bottom: 4px; }
.ops-plain { list-style: none; padding-left: 0; margin: 0; }
.ops-roles { display: flex; gap: 6px 14px; align-items: center; flex-wrap: wrap; margin: 0; }
.ops-roles .check { font-size: 13.5px; align-items: center; }
.ops-roles .check input { margin-top: 0; }
.ops-fieldset { border: 1px solid var(--g1); border-radius: 8px; padding: 10px 12px; margin: 0; }
.ops-fieldset legend { font-size: 13px; font-weight: 600; color: var(--navy); padding: 0 4px; }
.ops-fieldset .check { margin: 6px 0; }
.ops-filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0 14px; }
.ops-banner > svg.ico { display: block; }

/* ---- audit detail ---- */
.ops-details > summary { color: var(--info); font-size: 13px; font-weight: 600; }
.ops-details > summary:hover { text-decoration: underline; }
.ops-diff { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 6px; }
.ops-json { background: var(--g3); border: 1px solid var(--g1); border-radius: 8px; padding: 8px 10px; margin: 4px 0 0; font-size: 12px; max-height: 260px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .ops-cards { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .ops-card-head { flex-direction: column; }
  .ops-diff { grid-template-columns: 1fr; }
}