/* =====================================================================
   PADRÃO DE INTERFACE — vale para o sistema inteiro.
   Carregado por último no base.html. Não muda layout de nenhuma tela: só
   uniformiza foco, estados de botão/campo e o diálogo de confirmação.
   ===================================================================== */

/* ---------- Pular para o conteúdo (primeiro Tab da página) ---------- */
.pular-para-conteudo {
    position: absolute;
    left: 12px;
    top: -60px;
    z-index: 2000;
    padding: 10px 16px;
    border-radius: var(--pv-raio-campo, 10px);
    background: var(--pv-titulo, #2c3e50);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    transition: top .15s ease;
}
.pular-para-conteudo:focus { top: 12px; }
#conteudo-principal:focus { outline: none; }   /* alvo do salto, não controle */

/* ---------- Foco visível e uniforme (teclado) ----------
   :focus-visible só aparece na navegação por teclado; o clique do mouse
   continua sem contorno. Mesma cor e espessura em todas as telas. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible,
input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
    outline: 3px solid var(--pv-ciano, #3db8c6);
    outline-offset: 2px;
}

/* Campos de texto: o foco já trocava a cor da borda; agora todos ganham o
   mesmo anel suave que o formulário padrão usava — a borda sozinha é fraca
   demais para quem enxerga pouco contraste. */
input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
    border-color: var(--pv-ciano, #3db8c6);
    box-shadow: 0 0 0 3px rgba(61, 184, 198, 0.25);
}

/* ---------- Estado desabilitado, igual em todos os botões ---------- */
button:disabled,
button[aria-disabled="true"],
.btn-gradiente:disabled,
.botao-secundario:disabled,
.btn:disabled {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

/* ---------- Diálogo de confirmação ---------- */
.dialogo-confirmacao {
    width: min(440px, calc(100vw - 32px));
    padding: 0;
    border: none;
    border-radius: var(--pv-raio-cartao, 15px);
    box-shadow: 0 20px 50px rgba(15, 23, 42, .25);
    color: var(--pv-texto, #475569);
}
.dialogo-confirmacao::backdrop { background: rgba(15, 23, 42, .45); }
.dialogo-confirmacao form { padding: 22px 24px 20px; margin: 0; }
.dialogo-confirmacao h2 {
    margin: 0 0 10px;
    font-size: 1.15rem;
    color: var(--pv-titulo, #2c3e50);
}
.dialogo-confirmacao p { margin: 0 0 20px; line-height: 1.5; }
.dialogo-confirmacao-botoes {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}
.dialogo-confirmacao-botoes button { min-height: 40px; min-width: 110px; }

@media (prefers-reduced-motion: reduce) {
    .pular-para-conteudo { transition: none; }
}