/* Relatório de contas a pagar — layout responsivo isolado. */
#relatorio_financeiro.pagina.ativa {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

#relatorio_financeiro {
  --rf-gap: clamp(8px, .75vw, 14px);
  --rf-radius: clamp(9px, .65vw, 13px);
  --rf-control: clamp(38px, 2.45vw, 46px);
  --rf-text: clamp(12px, .72vw, 15px);
  --rf-small: clamp(9px, .55vw, 12px);
}

#relatorio_financeiro > .page-title {
  font-size: clamp(18px, 1.25vw, 26px);
  margin-bottom: var(--rf-gap);
}

#relatorio_financeiro > .card {
  width: 100%;
  padding: clamp(13px, 1vw, 20px) !important;
  border-radius: var(--rf-radius) !important;
}

#relatorio_financeiro .relatorio-financeiro-filtros {
  display: grid !important;
  grid-template-columns:
    minmax(145px, .8fr) minmax(145px, .8fr)
    minmax(180px, 1.15fr) minmax(180px, 1.15fr)
    minmax(115px, .65fr) minmax(145px, .85fr) !important;
  gap: var(--rf-gap) !important;
  align-items: end;
}

#relatorio_financeiro .relatorio-financeiro-filtros > *,
#relatorio_financeiro .relatorio-financeiro-aplicar > * {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

#relatorio_financeiro .campo-label {
  font-size: var(--rf-small) !important;
  line-height: 1.15;
}

#relatorio_financeiro .relatorio-financeiro-filtros input,
#relatorio_financeiro .relatorio-financeiro-filtros select,
#relatorio_financeiro .relatorio-financeiro-filtros .btn,
#relatorio_financeiro .relatorio-check-filter-head {
  width: 100% !important;
  height: var(--rf-control) !important;
  min-height: var(--rf-control) !important;
  padding: 7px 11px !important;
  border-radius: var(--rf-radius) !important;
  font-size: var(--rf-text) !important;
}

#relatorio_financeiro .relatorio-check-filter-display,
#relatorio_financeiro .relatorio-check-filter-query {
  font-size: var(--rf-text) !important;
}

#relatorio_financeiro .relatorio-financeiro-acoes {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: var(--rf-gap) !important;
  margin-top: var(--rf-gap) !important;
}

#relatorio_financeiro .relatorio-financeiro-acoes .btn {
  min-width: clamp(92px, 6.5vw, 128px);
  min-height: var(--rf-control);
  font-size: var(--rf-text) !important;
  border-radius: var(--rf-radius) !important;
}

#relatorio_financeiro .relatorio-financeiro-acoes label {
  display: flex !important;
  align-items: center;
  gap: 6px !important;
  min-height: var(--rf-control);
  margin: 0 !important;
  padding: 5px 8px;
  font-size: var(--rf-text) !important;
  white-space: nowrap;
}

#relatorio_financeiro .relatorio-financeiro-aplicar {
  display: grid !important;
  grid-template-columns: minmax(280px, 520px) clamp(110px, 8vw, 150px) !important;
  align-items: end !important;
  justify-content: start !important;
  gap: var(--rf-gap) !important;
  margin-top: var(--rf-gap) !important;
}

#relatorio_financeiro .fornecedor-multi-search,
#relatorio_financeiro .relatorio-financeiro-filtrar {
  height: var(--rf-control) !important;
  min-height: var(--rf-control) !important;
  border-radius: var(--rf-radius) !important;
}

#relatorio_financeiro .fornecedor-multi-search {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  align-items: center !important;
  width: 100% !important;
  overflow: hidden;
  border: 1px solid rgba(66,91,122,.78) !important;
  background: linear-gradient(180deg,#0d1b2d 0%,#091522 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035),0 5px 14px rgba(0,0,0,.14) !important;
}

#relatorio_financeiro .fornecedor-multi-search:focus-within {
  border-color: rgba(34,197,94,.85) !important;
  box-shadow: 0 0 0 3px rgba(34,197,94,.1),0 6px 18px rgba(0,0,0,.18) !important;
}

#relatorio_financeiro .fornecedor-multi-search-icon {
  display: grid;
  place-items: center;
  height: 65%;
  border-right: 1px solid rgba(66,91,122,.55);
  color: var(--text-muted);
  font-size: 20px;
}

#relatorio_financeiro .fornecedor-multi-search-input,
#relatorio_financeiro .relatorio-financeiro-filtrar {
  font-size: var(--rf-text) !important;
}

#relatorio_financeiro .fornecedor-multi-search-input {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 7px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  text-align: left !important;
  font-weight: 600 !important;
}

#relatorio_financeiro .relatorio-financeiro-exportacoes {
  display: flex !important;
  gap: var(--rf-gap) !important;
  margin-top: var(--rf-gap) !important;
}

#relatorio_financeiro .relatorio-financeiro-exportacoes .btn {
  min-width: clamp(92px, 6.5vw, 125px);
  min-height: clamp(34px, 2.1vw, 40px);
  font-size: var(--rf-text) !important;
}

#relatorio_financeiro #cardsRelatorioFinanceiro {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: var(--rf-gap) !important;
}

#relatorio_financeiro #cardsRelatorioFinanceiro .stat-card {
  min-width: 0;
  min-height: clamp(108px, 7vw, 140px);
  padding: clamp(12px, .9vw, 18px) !important;
  border-radius: var(--rf-radius) !important;
}

#relatorio_financeiro .stat-card .s-label {
  font-size: clamp(9px, .58vw, 12px) !important;
}

#relatorio_financeiro .stat-card .s-value {
  font-size: clamp(22px, 1.65vw, 34px) !important;
  line-height: 1.15 !important;
  white-space: nowrap;
}

#relatorio_financeiro .stat-card .s-desc {
  font-size: clamp(9px, .58vw, 12px) !important;
  line-height: 1.25;
}

#relatorio_financeiro .rf-grupo-cabecalho,
#relatorio_financeiro .rf-grupo-item {
  display: grid !important;
  grid-template-columns: minmax(180px, 1.5fr) minmax(135px, 1fr) minmax(120px, .9fr) repeat(3, minmax(95px, .75fr)) minmax(55px, .3fr) !important;
  align-items: center !important;
  column-gap: clamp(14px, 1.4vw, 30px) !important;
  padding-inline: clamp(12px, 1vw, 20px) !important;
}

#relatorio_financeiro .rf-grupo-cabecalho {
  min-height: clamp(34px, 2.2vw, 42px) !important;
  font-size: clamp(9px, .58vw, 12px) !important;
}

#relatorio_financeiro .rf-grupo-item {
  min-height: clamp(54px, 3.5vw, 68px) !important;
}

#relatorio_financeiro .rf-grupo-item > * {
  font-size: clamp(12px, .72vw, 15px) !important;
}

#relatorio_financeiro .rf-grupo-fornecedor {
  color: var(--text);
  font-size: clamp(13px, .78vw, 16px) !important;
}
#relatorio_financeiro .rf-grupo-cadastro { color: var(--text-muted); }
#relatorio_financeiro .rf-grupo-vencimento { color: #f87171; font-weight: 700; }

#relatorio_financeiro .rf-grupo-pago { color: #93c5fd; }
#relatorio_financeiro .rf-grupo-aberto { color: #fb923c; font-weight: 700; }
#relatorio_financeiro .rf-grupo-total { color: #60a5fa; font-weight: 700; }
#relatorio_financeiro .rf-grupo-qtd { color: var(--text); }

/* Tablet: duas linhas de filtros, mantendo controles confortáveis. */
@media (min-width: 701px) and (max-width: 1180px) {
  #relatorio_financeiro {
    --rf-control: 38px;
    --rf-text: 11px;
    --rf-small: 9px;
  }
  #relatorio_financeiro .relatorio-financeiro-filtros {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  #relatorio_financeiro #cardsRelatorioFinanceiro {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  #relatorio_financeiro .rf-grupo-cabecalho,
  #relatorio_financeiro .rf-grupo-item {
    grid-template-columns: minmax(115px, 1.2fr) minmax(100px, .9fr) minmax(90px, .8fr) repeat(3, minmax(68px, .62fr)) 38px !important;
    column-gap: 8px !important;
  }
}

/* Celular: composição própria, sem provocar redução no desktop. */
@media (max-width: 700px) {
  #relatorio_financeiro {
    --rf-gap: 6px;
    --rf-radius: 9px;
    --rf-control: 34px;
    --rf-text: 9.5px;
    --rf-small: 8px;
  }
  #relatorio_financeiro > .page-title { font-size: 15px; }
  #relatorio_financeiro > .card { padding: 9px !important; }
  #relatorio_financeiro .relatorio-financeiro-filtros {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  #relatorio_financeiro .relatorio-financeiro-filtros > .date-filter-standard {
    display: contents !important;
  }
  #relatorio_financeiro .date-filter-start-field { grid-column: 1 / 4 !important; grid-row: 1 !important; }
  #relatorio_financeiro .date-filter-end-field { grid-column: 4 / 7 !important; grid-row: 1 !important; }
  #relatorio_financeiro .date-filter-criterion-field { grid-column: 1 / 3 !important; grid-row: 2 !important; }
  #relatorio_financeiro .campo-com-label:has(#filtroRelFinanceiroStatus) { grid-column: 3 / 5 !important; grid-row: 2 !important; }
  #relatorio_financeiro .campo-com-label:has(#filtroRelFinanceiroCategoria) { grid-column: 5 / 7 !important; grid-row: 2 !important; }
  #relatorio_financeiro .relatorio-financeiro-filtros > .btn {
    grid-column: span 3 !important;
    grid-row: 3 !important;
  }
  #relatorio_financeiro .relatorio-financeiro-acoes {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
  #relatorio_financeiro .relatorio-financeiro-atalho {
    grid-column: span 2 !important;
  }
  #relatorio_financeiro .relatorio-financeiro-acoes label {
    grid-column: span 3 !important;
    justify-content: center;
    min-height: 28px;
    padding: 2px;
    font-size: 7.5px !important;
  }
  #relatorio_financeiro .relatorio-financeiro-aplicar {
    grid-template-columns: minmax(0, 1fr) 72px !important;
  }
  #relatorio_financeiro .fornecedor-multi-search {
    grid-template-columns: 30px minmax(0,1fr) !important;
  }
  #relatorio_financeiro .fornecedor-multi-search-icon { font-size: 16px; }
  #relatorio_financeiro #cardsRelatorioFinanceiro {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #relatorio_financeiro #cardsRelatorioFinanceiro .stat-card {
    min-height: 84px;
    padding: 9px !important;
  }
  #relatorio_financeiro .stat-card .s-label { font-size: 7.5px !important; }
  #relatorio_financeiro .stat-card .s-value { font-size: clamp(18px, 5.4vw, 23px) !important; }
  #relatorio_financeiro .stat-card .s-desc { font-size: 8.5px !important; }
  #relatorio_financeiro .rf-grupo-cabecalho { display: none !important; }
  #relatorio_financeiro .rf-grupo-item {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 4px !important;
    row-gap: 6px !important;
    padding-inline: 7px !important;
  }
  #relatorio_financeiro .rf-grupo-fornecedor { grid-column: 1 / -1; }
  #relatorio_financeiro .rf-grupo-item > :not(.rf-grupo-fornecedor)::before { display:block; margin-bottom:2px; color:var(--text-muted); font-size:6px; font-weight:700; text-transform:uppercase; }
  #relatorio_financeiro .rf-grupo-cadastro::before { content:'Cadastro'; }
  #relatorio_financeiro .rf-grupo-vencimento::before { content:'Vencimento'; }
  #relatorio_financeiro .rf-grupo-pago::before { content:'Pago'; }
  #relatorio_financeiro .rf-grupo-aberto::before { content:'Em aberto'; }
  #relatorio_financeiro .rf-grupo-total::before { content:'Total'; }
  #relatorio_financeiro .rf-grupo-qtd::before { content:'Títulos'; }
  #relatorio_financeiro .rf-grupo-item { min-height: 48px !important; }
  #relatorio_financeiro .rf-grupo-item > * { font-size: 8px !important; }
  #relatorio_financeiro .rf-grupo-fornecedor { font-size: 8.5px !important; }
}