/* Ajustes de responsividade para telas pequenas (celular) e tablets.
   Aplicado em todas as paginas que usam a navbar padrao do portal
   (navbar-brand + area com nome do usuario / badge / botoes de acao). */

/* A navbar do Bootstrap nao quebra linha por padrao; em celulares estreitos
   (<=576px) o brand + botoes extras + nome do usuario podem ficar espremidos
   ou cortar. Aqui deixamos o conteudo quebrar em varias linhas quando necessario. */
@media (max-width: 576px) {
  .navbar > .container-fluid {
    flex-wrap: wrap;
    row-gap: 0.5rem;
  }
  .navbar .d-flex.align-items-center.gap-3 {
    flex-wrap: wrap;
    row-gap: 0.5rem;
    width: 100%;
    justify-content: flex-start !important;
  }
  .navbar-brand {
    font-size: 1rem;
  }
}

/* Em telas de toque (celular/tablet), aumenta um pouco a area clicavel dos
   botoes pequenos usados em linhas de tabela, para facilitar o toque com o dedo. */
@media (max-width: 991px) {
  .btn-sm {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
  }
}