/* =====================================================================
   AGGalvão · Componente — Botões
   ===================================================================== */

.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
    padding: .55rem 1.05rem;
    border: 1px solid transparent;
    border-radius: var(--raio);
    font: inherit;
    font-size: .78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    cursor: pointer;
    transition: background .12s, border-color .12s, color .12s, transform .06s;
    white-space: nowrap;
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; }

.btn-primario  { background: var(--vermelho); color: #fff; }
.btn-primario:hover  { background: var(--vermelho-escuro); color: #fff; }
.btn-sucesso   { background: var(--verde); color: #fff; }
.btn-sucesso:hover   { background: #0aa847; color: #fff; }
.btn-neutro    { background: var(--superficie); color: var(--texto); border-color: var(--borda-forte); }
.btn-neutro:hover    { background: var(--superficie-2); border-color: var(--cinza); color: var(--preto); }
.btn-perigo    { background: #fff; color: var(--vermelho); border-color: #f0b8b8; }
.btn-perigo:hover    { background: var(--vermelho); color: #fff; border-color: var(--vermelho); }
.btn-sm { padding: .34rem .7rem; font-size: .7rem; }
.btn-bloco { width: 100%; }
.btn .icone { width: 15px; height: 15px; opacity: 1; }