/* Admin pages (deployment admin and global admin). Extends B's idiom with tokens only. */

/* Row action cells: right-aligned, never wrapping */
td.acts, th.acts { text-align: right; white-space: nowrap; }
td.acts .hstack { justify-content: flex-end; flex-wrap: nowrap; }

/* A section whose body is a list of blocks separated by dividers */
.divide-body .region-body > * + * { border-top: var(--line); margin-top: var(--space-12); padding-top: var(--space-12); }
.pend .line { padding-top: 0; }
.pend table { margin-top: var(--space-4); }

/* Inline sentence callout above a table (warning, state) */
.callout {
  display: flex; align-items: flex-start; gap: var(--space-8);
  padding: var(--space-8) var(--space-12); border-radius: var(--radius-card);
  border: var(--line-strong); background: var(--surface-raised); font: var(--font-body); color: var(--text-secondary);
}
.callout > svg { flex: none; margin-top: var(--space-2); }
.callout.attn { background: var(--surface-raised); border-color: var(--border-strong); color: var(--text-primary); }
.attn-text { color: var(--text-primary); display: inline-flex; align-items: center; gap: var(--space-4); }

/* Plain list inside a cell or a rail section */
ul.plain { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); font: var(--font-body); }
.floor { margin: 0; font: var(--font-body); color: var(--text-secondary); }
.floor + .floor { margin-top: var(--space-8); }

/* Disclosure inside a table cell */
details.inl > summary { cursor: pointer; color: var(--text-secondary); list-style: none; }
details.inl > summary::-webkit-details-marker { display: none; }
details.inl > summary::before { content: '+'; display: inline-block; width: var(--space-12); color: var(--text-tertiary); }
details.inl[open] > summary::before { content: '\2212'; }
details.inl > ul { margin-top: var(--space-4); }

/* Form controls inside the form modal */
.chk-list { display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-12); }
.chk { display: inline-flex; align-items: center; gap: var(--space-6); font: var(--font-body); color: var(--text-primary); cursor: pointer; }
.chk input { margin: 0; accent-color: var(--action-primary); }
.field .note { font: var(--font-metadata); color: var(--text-tertiary); }
.field textarea { min-height: calc(var(--size-row-height-default) * 2); padding: var(--space-6) var(--space-8); resize: vertical; }
.modal .form-err { font: var(--font-metadata); color: var(--level-critical-text); }
.modal .form-err[hidden] { display: none; }
.modal .field .err[hidden] { display: none; }

/* Editable grids in a modal (level rules, cameras) */
.rules-grid { border-collapse: collapse; }
.rules-grid th, .rules-grid td { padding: var(--space-4) var(--space-6); height: auto; vertical-align: middle; white-space: nowrap; }
.rules-grid th:first-child, .rules-grid td:first-child { padding-left: 0; }
.rules-grid th:last-child, .rules-grid td:last-child { padding-right: 0; }
.rules-grid th { position: static; }
.rules-grid input[type=number] { width: calc(var(--space-48) * 2); }
.rules-grid input[type=text] { width: calc(var(--space-48) * 3); }
.rules-grid input[type=checkbox], .rules-grid input[type=radio] { width: auto; }
.rules-grid select { min-height: var(--size-control-height-default); }
.rules-grid .chk-list { max-width: 360px; }

@media (max-width: 45em) {
  td.acts, th.acts { text-align: left; }
  td.acts .hstack { justify-content: flex-start; flex-wrap: wrap; }
  .modal .rules-grid thead { display: none; }
  .modal .rules-grid, .modal .rules-grid tbody, .modal .rules-grid tr, .modal .rules-grid td { display: block; width: 100%; }
  .modal .rules-grid tr { padding: var(--space-8) 0; border-bottom: var(--line); }
  .modal .rules-grid td { border: 0; padding: var(--space-2) 0; }
}