/* ds-botao */
.ds-botao {
  --_fundo: var(--ds-cor-destaque);
  --_texto: var(--ds-cor-sobre-destaque);
  --_borda: var(--_fundo);
  display: inline-flex; align-items: center; justify-content: center; gap: var(--ds-espaco-2);
  min-height: 44px;
  padding: var(--ds-botao-pad-y) var(--ds-botao-pad-x);
  border: var(--ds-borda-largura-forte) solid var(--_borda);
  border-radius: var(--ds-raio-botao);
  background: var(--_fundo); color: var(--_texto);
  font-family: var(--ds-botao-fonte); font-size: var(--ds-botao-tamanho); font-weight: var(--ds-peso-forte);
  line-height: 1.2; text-align: center; text-decoration: none;
  cursor: pointer;
  box-shadow: var(--ds-sombra-sm);
  transition: transform var(--ds-duracao) var(--ds-curva), box-shadow var(--ds-duracao) var(--ds-curva), filter var(--ds-duracao) var(--ds-curva);
}
.ds-botao:hover { transform: translateY(-1px); box-shadow: var(--ds-sombra-md); filter: brightness(1.08); }
.ds-botao:active { transform: none; box-shadow: none; }
.ds-botao:disabled, .ds-botao[aria-disabled="true"] { cursor: not-allowed; opacity: 0.5; transform: none; box-shadow: none; filter: none; }

.ds-botao--secundario { --_fundo: var(--ds-cor-destaque-2); --_texto: var(--ds-cor-sobre-destaque-2); }
.ds-botao--contorno { --_fundo: transparent; --_texto: var(--ds-cor-titulo); --_borda: currentColor; box-shadow: none; }
.ds-botao--link {
  --_fundo: transparent; --_texto: var(--ds-cor-texto-destaque); --_borda: transparent;
  padding-inline: 0; box-shadow: none;
  text-decoration: underline; text-underline-offset: 0.25em;
}
.ds-botao--link:hover { box-shadow: none; transform: none; filter: none; text-decoration-thickness: 2px; }
.ds-botao--grande { padding: calc(var(--ds-botao-pad-y) * 1.4) calc(var(--ds-botao-pad-x) * 1.4); font-size: var(--ds-tamanho-texto-grande); }
.ds-botao--bloco { display: flex; width: 100%; }

.ds-botao-grupo { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ds-espaco-3); margin-block: var(--ds-espaco-4); }
@media (max-width: 479px) {
  .ds-botao-grupo--empilhar { flex-direction: column; align-items: stretch; }
}