/* Admin module: settings, staff & roles, audit, import, export. */
.side nav [hidden] { display: none !important; }

.ad-tabs { margin-bottom: 16px; }
.ad-h2 { margin: 22px 0 10px; font-size: 1.05rem; }
.ad-err { display: block; color: var(--bad); font-weight: 500; font-size: .82rem; }
[aria-invalid="true"] { border-color: var(--bad); background: #fffafa; }
.ad-dim { opacity: .55; }
.ad-good { color: var(--good); }
.ad-inline { display: inline; }
.ad-actions { white-space: nowrap; }
.ad-actions .btn { margin-left: 4px; }

/* dashboard role chip */
.ad-rolebar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 14px; }
.ad-rolebar small { flex: 1 1 260px; min-width: 0; }
.ad-rolechip { font-weight: 700; }

/* settings */
.ad-cols { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.ad-cols > .card { margin-bottom: 0; }
@media (max-width: 1100px) { .ad-cols { grid-template-columns: minmax(0, 1fr); } }
.ad-side h3 { margin: 0 0 6px; font-size: .95rem; }
.ad-side h3 + p { margin-top: 0; }
.ad-side h3:not(:first-child) { margin-top: 16px; }
.ad-kv { margin: 10px 0; display: grid; gap: 6px; }
.ad-kv div { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-bottom: 1px dashed var(--line); padding-bottom: 6px; }
.ad-kv dt { color: var(--muted); font-size: .85rem; }
.ad-kv dd { margin: 0; }
.ad-kv code, .ad-path { font-size: .82rem; background: #eef2f0; padding: 1px 6px; border-radius: 5px; word-break: break-all; }
.ad-list { margin: 0; padding-left: 18px; }
.ad-list li { margin: 3px 0; }

/* staff */
.badge.ad-role-owner { background: #1d3b3c; color: #fff; }
.badge.ad-role-manager { background: #e2effa; color: #1d5c96; }
.badge.ad-role-accounts { background: #fdf1d8; color: #7a5300; }
.badge.ad-role-frontdesk { background: #e3f5ec; color: #12704b; }
.ad-roles-help .card { margin-bottom: 0; }
.ad-roles-help p { margin: 8px 0 0; }
.ad-rolepick { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ad-roleopt { flex-direction: row; align-items: flex-start; gap: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; cursor: pointer; font-weight: 400; }
.ad-roleopt:has(input:checked) { border-color: var(--brand-2); background: #f1f8f6; }
.ad-roleopt input { margin-top: 4px; }
.ad-roleopt span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ad-roleopt b { color: var(--ink); }
.ad-roleopt small { color: var(--muted); font-size: .8rem; }
.ad-check { flex-direction: row; align-items: flex-start; gap: 10px; font-weight: 600; }
.ad-check input { margin-top: 5px; }
@media (max-width: 640px) { .ad-rolepick { grid-template-columns: 1fr; } }

/* permission matrix */
.ad-legend { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 12px; color: var(--ink-2); }
.ad-matrix { width: 100%; border-collapse: collapse; }
.ad-matrix th, .ad-matrix td { padding: 8px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.ad-matrix thead th { font-size: .8rem; color: var(--ink-2); background: #f8faf9; }
.ad-matrix thead th small { display: block; font-weight: 400; color: var(--muted); }
.ad-matrix .ad-group th { background: #f1f4f2; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: 6px 12px; }
.ad-page b { display: block; }
.ad-page small { font-size: .74rem; word-break: break-all; }
.ad-cell { display: block; font-weight: 400; }
.ad-cell-role { display: none; }
.ad-lv { min-height: 34px; padding: 5px 8px; font-size: .86rem; width: 100%; min-width: 120px; }
.ad-lv-full { background: var(--good-bg); border-color: #a8d8c0; }
.ad-lv-view { background: var(--info-bg); border-color: #b5cfe8; }
.ad-lv-none { background: #f5f5f4; color: var(--muted); }
.ad-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.ad-foot small { flex: 1 1 280px; }
@media (max-width: 760px) {
  .ad-matrix thead, .ad-matrix .ad-owner { display: none; }
  .ad-matrix, .ad-matrix tbody, .ad-matrix tr, .ad-matrix td { display: block; width: 100%; }
  .ad-matrix tr { border-bottom: 1px solid var(--line); padding: 8px 12px; }
  .ad-matrix td { border: 0; padding: 3px 0; }
  .ad-matrix .ad-group th { display: block; margin: 0 -12px; }
  .ad-matrix .ad-group { padding: 0 12px; }
  .ad-cell { display: grid; grid-template-columns: 110px minmax(0, 1fr); align-items: center; gap: 8px; }
  .ad-cell-role { display: block; font-size: .82rem; color: var(--ink-2); font-weight: 600; }
  .ad-lv { min-width: 0; }
}

/* audit */
.ad-inline-label { flex-direction: row; align-items: center; gap: 6px; font-weight: 500; }
.ad-inline-label input { width: auto; }
.ad-audit td { vertical-align: top; }
.ad-when { white-space: nowrap; }
.ad-fields { display: block; max-width: 260px; word-break: break-word; color: var(--ink-2); }
.ad-pager { justify-content: center; gap: 12px; margin: 14px 0; }

/* import */
.ad-doc { margin-top: 14px; }
.ad-doc summary { cursor: pointer; font-weight: 600; color: var(--brand-2); }
.ad-cols-table { width: 100%; border-collapse: collapse; margin: 10px 0; font-size: .84rem; }
.ad-cols-table th { text-align: left; font-family: ui-monospace, Consolas, monospace; font-size: .8rem; padding: 5px 10px 5px 0; vertical-align: top; white-space: nowrap; color: var(--ink); }
.ad-cols-table td { padding: 5px 0; border-bottom: 1px solid var(--line); }
.ad-codes { display: flex; flex-wrap: wrap; gap: 6px; }
.ad-codes .chip { font-size: .76rem; }
.ad-confirm { gap: 12px; flex-wrap: wrap; }
.ad-confirm > div:first-of-type { flex: 1 1 280px; }
.ad-preview td { vertical-align: top; }
.ad-row-bad { background: #fff7f6; }
.ad-checks { min-width: 220px; }
.ad-checks .ad-err { margin-bottom: 3px; }
.ad-creds { border-color: #f0d7a6; background: #fffcf4; }

/* export */
.ad-export .card { margin-bottom: 0; }
.ad-export h3, .grid-2 form h3 { margin: 0; }
.ad-export p { margin: 4px 0 12px; }
.ad-export { margin-bottom: 16px; }
.ad-range { gap: 10px; flex-wrap: wrap; }
.ad-range label { flex: 1 1 140px; }
