/* #149 · Super Admin v2 — abas por tipo de login, ficha lateral e matriz
   editável. Prefixo `sap-` (as classes `sa-` antigas moram em web/styles.css).
   Só tokens: var(--ds-*) e as variáveis do tema. */

.sap-tipos { display: flex; gap: var(--ds-s1); margin: 0 0 var(--ds-s3); border-bottom: 1px solid var(--line-soft); }
.sap-tipo { background: none; border: 0; border-bottom: 2px solid transparent; padding: var(--ds-s2) var(--ds-s3);
            color: var(--muted); font: inherit; cursor: pointer; }
.sap-tipo:hover { color: var(--ink); }
.sap-tipo.ativa { color: var(--ink); border-bottom-color: var(--ds-pri); font-weight: 600; }

.sap-corpo { margin-top: var(--ds-s2); }
.sa-linha { cursor: pointer; }
.sa-linha.sap-sel > td { background: var(--panel-2); }
.sa-linha:focus-visible { outline: 2px solid var(--ds-pri); outline-offset: -2px; }

.sap-papel { background: none; border: 0; padding: 0; color: var(--ink); font: inherit; cursor: pointer; }
.sap-papel:hover { text-decoration: underline; }
.sap-sem-papel { display: inline-flex; gap: var(--ds-s2); align-items: center; }

.sap-dim { color: var(--muted); }
.sap-titulo { display: flex; flex-direction: column; min-width: 0; }
.sap-email { font-weight: 400; font-size: var(--ds-fs-sm); overflow: hidden; text-overflow: ellipsis; }
.sap-bloco h4 { margin: 0 0 var(--ds-s1); font-size: var(--ds-fs-sm); text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.sap-bloco h5 { margin: var(--ds-s2) 0 var(--ds-s1); font-size: var(--ds-fs-sm); }
.sap-bloco p { margin: 0 0 var(--ds-s1); }
.sap-linha { display: flex; gap: var(--ds-s2); align-items: center; margin-top: var(--ds-s1); }
.sap-dl { display: grid; grid-template-columns: max-content 1fr; gap: 2px var(--ds-s3); margin: 0; }
.sap-dl dt { color: var(--muted); }
.sap-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.sap-missao { font-style: italic; }
.sap-lista { margin: 0; padding-left: 1.1em; }
.sap-lista li { margin: 2px 0; }
.sap-nao li::marker { color: var(--red); }
.sap-acessos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--ds-s1); }
.sap-acessos li { display: grid; grid-template-columns: 1fr auto; gap: 0 var(--ds-s2); align-items: center; }
.sap-telas { grid-column: 1 / -1; font-size: var(--ds-fs-sm); }
.sap-auditoria { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--ds-s1); font-size: var(--ds-fs-sm); }

.sap-barra { display: flex; gap: var(--ds-s2); align-items: center; margin: var(--ds-s2) 0; }
.sap-cel { background: none; border: 1px solid transparent; border-radius: var(--ds-r-sm); padding: 2px var(--ds-s2);
           font: inherit; font-size: var(--ds-fs-sm); cursor: pointer; white-space: nowrap; color: var(--muted); }
.sap-cel:hover:not(:disabled) { border-color: var(--line); }
.sap-cel:disabled { cursor: not-allowed; opacity: .75; }
.sap-cel-write { color: var(--green); font-weight: 600; }
.sap-cel-read { color: var(--blue); }
.sa-celula.sap-mudou { background: var(--panel-2); box-shadow: inset 0 0 0 2px var(--ds-pri); }
.sap-diff { list-style: none; margin: 0 0 var(--ds-s3); padding: 0; max-height: 320px; overflow: auto; display: flex; flex-direction: column; gap: var(--ds-s1); }

@media (prefers-reduced-motion: no-preference) {
  .sap-tipo, .sap-cel { transition: color .15s, border-color .15s; }
}