/* Aba Acessos (acessos.js), só do dono. Mesmo visual dos painéis do CRM (dpanel, act, ff) e da Central de APIs. */
#v-acessos {
  --ac-ok: #15803D; --ac-ok-bg: rgba(21, 128, 61, .10);
  --ac-at: #B45309; --ac-at-bg: rgba(180, 83, 9, .11);
  --ac-cr: #B91C1C; --ac-cr-bg: rgba(185, 28, 28, .09);
  --ac-off: #62626B; --ac-off-bg: rgba(24, 24, 27, .06);
}
#acessosAtualizar { min-height: 40px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .4); border-radius: 999px; background: rgba(255, 255, 255, .1); color: #fff; font-weight: 600; transition: background-color .2s ease; }
#acessosAtualizar:hover { background: rgba(255, 255, 255, .2); }

.ac-gerar { display: grid; gap: 12px; margin-bottom: 20px; }
.ac-gerar h2 { margin: 0; }
.ac-form { display: grid; grid-template-columns: minmax(130px, 170px) minmax(0, 1fr) auto; gap: 12px; align-items: end; }
.ac-form .act { min-height: 40px; }
.ac-erro { margin: 0; font-size: .86rem; font-weight: 600; color: var(--ac-cr); overflow-wrap: anywhere; }
.ac-erro:empty { display: none; }

.ac-novo { display: grid; gap: 8px; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--ac-ok); background: var(--ac-ok-bg); }
.ac-novo[hidden] { display: none; }
.ac-novo p { margin: 0; }
.ac-novo-tit { font-weight: 600; color: var(--ac-ok); overflow-wrap: anywhere; }

.ac-codigo-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; min-width: 0; }
.ac-codigo { flex: 1 1 auto; min-width: 0; padding: 7px 10px; border-radius: 8px; background: var(--ac-off-bg); font: 600 .92rem/1.3 ui-monospace, Consolas, monospace; letter-spacing: .03em; overflow-wrap: anywhere; user-select: all; }
.ac-copiar { min-width: 84px; justify-content: center; }
.ac-copiar.feito { background: var(--ac-ok-bg); border-color: var(--ac-ok); color: var(--ac-ok); }

.ac-resumo { margin: 0 0 12px; font-size: .86rem; color: var(--ac-off); }
.ac-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 16px; align-items: start; }
.ac-card { display: grid; gap: 12px; min-width: 0; }
.ac-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; min-width: 0; }
.ac-tit { flex: 1 1 auto; min-width: 0; margin: 0; padding: 2px 0; border: 0; background: none; text-align: left; cursor: pointer; font: inherit; color: inherit; border-radius: 6px; }
.ac-tit:focus-visible { outline: 2px solid #DC2626; outline-offset: 2px; }
.ac-nota { display: block; font: 700 1.05rem/1.3 var(--display, inherit); overflow-wrap: anywhere; }
.ac-nota.vazia { font-weight: 500; color: var(--ac-off); }
.ac-pil { flex: none; padding: 4px 10px; border-radius: 999px; font-size: .76rem; font-weight: 600; white-space: nowrap; }
.ac-pil.ok { background: var(--ac-ok-bg); color: var(--ac-ok); }
.ac-pil.at { background: var(--ac-at-bg); color: var(--ac-at); }
.ac-pil.cr { background: var(--ac-cr-bg); color: var(--ac-cr); }
.ac-pil.off { background: var(--ac-off-bg); color: var(--ac-off); }

.ac-dados { display: grid; gap: 4px; }
.ac-lin { display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; font-size: .86rem; min-width: 0; }
.ac-rot { flex: none; min-width: 96px; color: var(--ac-off); }
.ac-val { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.ac-val.off { font-weight: 500; color: var(--ac-off); }

.ac-acoes, .ac-confirma { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ac-confirma { padding: 10px 12px; border-radius: 10px; background: var(--ac-at-bg); }
.ac-confirma-tx { flex: 1 1 100%; font-size: .9rem; font-weight: 600; overflow-wrap: anywhere; }
.ac-bloq { color: var(--ac-cr); }

.ac-atv { display: grid; gap: 6px; padding-top: 10px; border-top: 1px solid var(--line, rgba(24, 24, 27, .12)); }
.ac-atv h3 { margin: 0; font-size: .84rem; text-transform: uppercase; letter-spacing: .04em; color: var(--ac-off); }
.ac-eventos { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; max-height: 320px; overflow: auto; }
.ac-eventos li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 10px; padding: 5px 0; font-size: .86rem; border-bottom: 1px solid rgba(24, 24, 27, .06); }
.ac-ev-t { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.ac-ev-d { color: var(--ac-off); font-size: .8rem; }

.ac-vazio { display: grid; justify-items: center; gap: 8px; padding: 32px 16px; border: 1px dashed var(--line, rgba(24, 24, 27, .2)); border-radius: 12px; text-align: center; color: var(--ac-off); }
.ac-vazio p { margin: 0; font-weight: 600; color: var(--ink, #18181B); }
.ac-vazio.erro { border-color: var(--ac-cr); background: var(--ac-cr-bg); }
.ac-vazio.erro p { color: var(--ac-cr); }

@media (max-width: 640px) {
  .ac-form { grid-template-columns: 1fr; }
  .ac-form .act { width: 100%; }
  .ac-grade { grid-template-columns: 1fr; }
  .ac-lin { flex-direction: column; gap: 0; }
  .ac-acoes .act, .ac-confirma .act { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) { #acessosAtualizar { transition: none; } }