/* ============================================================
   FIXES — select width, alinhamento e responsivo mobile
   Carregado por último, sobrescreve tudo
   ============================================================ */

/* ── Selects: sempre texto à esquerda, largura total ── */
select,
select.form-control,
.form-control[multiple],
.rfilt select,
.filters-bar select,
.form-group select,
.form-row select {
  width: 100% !important;
  display: block !important;
  text-align: left !important;
  text-align-last: left !important;        /* Chrome/Edge */
  -moz-text-align-last: left !important;   /* Firefox */
  -webkit-appearance: menulist !important; /* Safari: força alinhamento nativo */
  box-sizing: border-box !important;
}

/* ── Containers dos selects: largura total ── */
.form-group,
.form-row > div,
.rfilt form > div,
.filters-bar > div {
  width: 100%;
  box-sizing: border-box;
}

/* ================================================================
   MOBILE (≤ 767px)
   - filters-bar: empilha em coluna, todos os filhos ocupam 100%
   - Isso inclui filhos de <form style="display:contents"> porque
     display:contents faz o <form> "sumir" e seus filhos viram
     filhos diretos do .filters-bar no layout flex
   ================================================================ */
@media (max-width: 767px) {

  /* ── Todos os campos: largura total ── */
  select,
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="datetime-local"],
  input[type="tel"],
  input[type="search"],
  input[type="url"],
  textarea,
  .form-control {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* ── form-row empilha ── */
  .form-row {
    display: flex !important;
    flex-direction: column !important;
    gap: .65rem !important;
  }
  .form-row > * {
    width: 100% !important;
    min-width: 0 !important;
  }

  /* ── filters-bar: coluna, cada filho ocupa 100% ──
     Inclui filhos diretos E filhos de form[display:contents]      */
  .filters-bar {
    flex-direction: column !important;
  }
  .filters-bar > *,
  .filters-bar > form > *,
  .filters-bar > div {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
  }
  /* botões dentro do filters-bar também esticam */
  .filters-bar .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  /* ── rfilt (relatórios): mesma lógica ── */
  .rfilt form {
    flex-direction: column !important;
  }
  .rfilt form > div,
  .rfilt > div {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  .rfilt .btn {
    width: 100% !important;
    justify-content: center !important;
  }
}