/* Monfer 2.0 - Fase 1
   Pilotos protegidos: telas consultivas selecionadas da Fase 1.
   Camada isolada e removivel; nao altera DOM, regras ou permissoes. */

#pageClientes,
#pageRelatorios,
#pageCatalogos,
#pageDocsProdutos,
#pageRankingFornecedores,
#pageScoreFornecedor,
#pageMarketing,
#pageLinkbio,
#pageAlertasEstoque,
#pageSazonalidadeProdutos,
#pageRentabilidade,
#pagePainelVendedor {
  --m2-pilot-accent: var(--mi-accent, #f2c300);
  --m2-pilot-accent-rgb: var(--mi-accent-rgb, 242, 195, 0);
}

/* Sétimo bloco: painéis executivos existentes. Os parâmetros do dashboard
   continuam sendo apenas entradas da consulta atual, sem persistência. */
#pageExecutiveDash,
#pagePainelDono { --m2-pilot-accent: var(--mi-accent, #f2c300); --m2-pilot-accent-rgb: var(--mi-accent-rgb, 242, 195, 0); }

/* Oitavo bloco: alerta consultivo, mantendo o escopo comercial no backend. */
#pageAlertasRecompra { --m2-pilot-accent: var(--mi-accent, #f2c300); --m2-pilot-accent-rgb: var(--mi-accent-rgb, 242, 195, 0); }

/* Nono bloco: analytics existente; exportações, layout e lazy loading mantidos. */
#pageAnalytics { --m2-pilot-accent: var(--mi-accent, #f2c300); --m2-pilot-accent-rgb: var(--mi-accent-rgb, 242, 195, 0); }
#pageAnalytics > .page-header {
  min-height: 76px; margin-bottom: 14px; padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent); border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}
#pageAnalytics :is(.analytics-card, .kpi-card) {
  border-color: var(--mi-line-soft, rgba(255,255,255,.085)); border-radius: 10px;
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}
#pageAnalytics > .page-header :is(select, input) { min-height: 36px; }
#pageAnalytics > .page-header :is(select, input):focus {
  outline: none; border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16);
}
#pageAlertasRecompra > .page-header {
  min-height: 76px; margin-bottom: 14px; padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent); border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}
#pageAlertasRecompra #arContent { min-height: 96px; }
#pageAlertasRecompra :is(#arTol, #arFiltroVend select) { min-height: 36px; }
#pageAlertasRecompra :is(#arTol, #arFiltroVend select):focus {
  outline: none; border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16);
}
#pageAlertasRecompra .data-table tbody tr:hover { background: rgba(var(--m2-pilot-accent-rgb), .08); }

#pageExecutiveDash > .page-header,
#pagePainelDono > .page-header {
  min-height: 76px; margin-bottom: 14px; padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent); border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}
#pageExecutiveDash :is(.analytics-card, .exec-kpi-card),
#pagePainelDono :is(.card, .dash-widget) {
  border-color: var(--mi-line-soft, rgba(255,255,255,.085)); border-radius: 10px;
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}
#pageExecutiveDash > .page-header :is(select, input) { min-height: 36px; }
#pageExecutiveDash > .page-header :is(select, input):focus {
  outline: none; border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16);
}

/* Sexto bloco: leituras comerciais existentes. O escopo por vendedor e a
   autoridade para visualizar rentabilidade continuam no backend atual. */
#pageRentabilidade > .page-header,
#pagePainelVendedor > .page-header {
  min-height: 76px;
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent);
  border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}

#pageRentabilidade :is(#rentKpis, #rentTabela),
#pagePainelVendedor :is(#pvKpis, #pvRanking, #pvResumo) { min-height: 64px; }

#pageRentabilidade > .data-card,
#pagePainelVendedor #pvGrid > .card {
  border-color: var(--mi-line-soft, rgba(255,255,255,.085));
  border-radius: 10px;
  background: var(--mi-panel, #1d1f1f);
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}

#pageRentabilidade :is(#rentDataIni, #rentDataFim, #rentOrdenar, #rentLimite),
#pagePainelVendedor #pvFiltroVend select {
  min-height: 36px;
  border-color: var(--mi-line, #3b3e3e) !important;
  background: var(--mi-ink, #0d0e0e) !important;
  color: var(--mi-text, #f1f0eb) !important;
}

#pageRentabilidade :is(#rentDataIni, #rentDataFim, #rentOrdenar, #rentLimite):focus,
#pagePainelVendedor #pvFiltroVend select:focus {
  outline: none;
  border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16) !important;
}

#pageRentabilidade .data-table tbody tr:hover,
#pagePainelVendedor .data-table tbody tr:hover {
  background: rgba(var(--m2-pilot-accent-rgb), .08);
}

/* Quinto bloco: duas leituras complementares do estoque. Nao aciona compra,
   promocao ou alteracao cadastral a partir dos indicadores. */
#pageAlertasEstoque > .page-header,
#pageSazonalidadeProdutos > .page-header {
  min-height: 76px;
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent);
  border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}

#pageAlertasEstoque :is(#alertaEstResumo, #alertaEstTabela),
#pageSazonalidadeProdutos #sazContent { min-height: 80px; }

#pageAlertasEstoque > .card,
#pageSazonalidadeProdutos :is(.card, .data-card) {
  border-color: var(--mi-line-soft, rgba(255,255,255,.085));
  border-radius: 10px;
  background: var(--mi-panel, #1d1f1f);
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}

#pageAlertasEstoque #alertaEstDias,
#pageSazonalidadeProdutos :is(#sazDiasMinimo, #sazFiltroGrupo, #sazFiltroMarca) {
  min-height: 36px;
  border-color: var(--mi-line, #3b3e3e) !important;
  background: var(--mi-ink, #0d0e0e) !important;
  color: var(--mi-text, #f1f0eb) !important;
}

#pageAlertasEstoque #alertaEstDias:focus,
#pageSazonalidadeProdutos :is(#sazDiasMinimo, #sazFiltroGrupo, #sazFiltroMarca):focus {
  outline: none;
  border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16) !important;
}

#pageAlertasEstoque :is(.dash-table, .data-table) tbody tr:hover,
#pageSazonalidadeProdutos .data-table tbody tr:hover {
  background: rgba(var(--m2-pilot-accent-rgb), .08);
}

/* Quarto bloco: leitura de marketing e Link Bio. A camada preserva o painel
   existente e as acoes explicitas dos banners, sem criar central paralela. */
#pageMarketing > .page-header,
#pageLinkbio > .page-header {
  min-height: 76px;
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent);
  border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}

#pageMarketing :is(#mktKpis, #mktPorAno, #mktCampanhas),
#pageLinkbio #lbBody { min-height: 64px; }

#pageMarketing > .data-card,
#pageLinkbio #lbBody > .data-card {
  border-color: var(--mi-line-soft, rgba(255,255,255,.085));
  border-radius: 10px;
  background: var(--mi-panel, #1d1f1f);
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}

#pageMarketing .data-table tbody tr:hover,
#pageLinkbio .data-table tbody tr:hover {
  background: rgba(var(--m2-pilot-accent-rgb), .08);
}

#pageLinkbio #lbDias {
  min-height: 36px;
  border: 1px solid var(--mi-line, #3b3e3e);
  background: var(--mi-ink, #0d0e0e);
  color: var(--mi-text, #f1f0eb);
}

#pageLinkbio #lbDias:focus {
  outline: none;
  border-color: var(--m2-pilot-accent);
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16);
}

/* Segundo bloco: consulta documental. Os seletores ficam limitados aos
   containers existentes; upload, busca e carregamento mantem os handlers. */
#pageCatalogos > .page-header,
#pageDocsProdutos > .page-header {
  min-height: 76px;
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent);
  border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}

#pageCatalogos > .data-card,
#pageDocsProdutos > .data-card {
  border-radius: 10px;
  border-color: var(--mi-line-soft, rgba(255,255,255,.085));
  background: var(--mi-panel, #1d1f1f);
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}

#pageCatalogos > .data-card:first-of-type > div,
#pageDocsProdutos > .data-card > div:not(.data-card-header) {
  min-height: 54px;
}

#pageCatalogos #catalogoBusca,
#pageDocsProdutos :is(#docsProdFornecedor, #docsProdCategoria, #docsProdBusca) {
  min-height: 36px;
  border-radius: 7px !important;
  border-color: var(--mi-line, #3b3e3e) !important;
  background: var(--mi-ink, #0d0e0e) !important;
}

#pageCatalogos #catalogoBusca:focus,
#pageDocsProdutos :is(#docsProdFornecedor, #docsProdCategoria, #docsProdBusca):focus {
  outline: none;
  border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16) !important;
}

#pageCatalogos #catalogosTableWrapper,
#pageDocsProdutos #docsProdListWrapper { min-height: 180px; }

/* Terceiro bloco: duas leituras complementares da mesma area de compras.
   Nao cria consolidacao paralela nem altera calculo de ranking/score. */
#pageRankingFornecedores > .page-header,
#pageScoreFornecedor > .page-header {
  min-height: 76px;
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent);
  border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}

#pageRankingFornecedores :is(#rkfPeriodo, #rkfFiltro),
#pageScoreFornecedor #sfMeses {
  min-height: 36px;
  border-radius: 7px !important;
  border-color: var(--mi-line, #3b3e3e) !important;
  background: var(--mi-ink, #0d0e0e) !important;
  color: var(--mi-text, #f1f0eb) !important;
}

#pageRankingFornecedores :is(#rkfPeriodo, #rkfFiltro):focus,
#pageScoreFornecedor #sfMeses:focus {
  outline: none;
  border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16) !important;
}

#pageRankingFornecedores :is(#rkfKpis, #rkfContent),
#pageScoreFornecedor :is(#sfKpis, #sfContent) { min-height: 64px; }

#pageRankingFornecedores #rkfContent,
#pageScoreFornecedor #sfContent {
  overflow: hidden;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-radius: 10px;
  background: var(--mi-panel, #1d1f1f);
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}

#pageRankingFornecedores :is(.rkf-table, .data-table) tbody tr:hover,
#pageScoreFornecedor .data-table tbody tr:hover {
  background: rgba(var(--m2-pilot-accent-rgb), .08);
}

#pageClientes > .page-header,
#pageRelatorios > .page-header {
  min-height: 76px;
  margin-bottom: 14px;
  padding: 15px 18px;
  border: 1px solid var(--mi-line-soft, rgba(255,255,255,.085));
  border-left: 4px solid var(--m2-pilot-accent);
  border-radius: 10px;
  background: linear-gradient(110deg, rgba(var(--m2-pilot-accent-rgb), .10), transparent 38%), var(--mi-panel, #1d1f1f);
  box-shadow: 0 9px 24px rgba(0,0,0,.18);
}

#pageClientes > .page-header h1,
#pageRelatorios > .page-header h1 {
  margin: 0;
  font-size: clamp(21px, 2vw, 27px);
  font-weight: 800;
}

#pageClientes > .data-card {
  overflow: hidden;
  border-radius: 10px;
  border-color: var(--mi-line-soft, rgba(255,255,255,.085));
}

#pageClientes > .data-card > .data-card-header {
  gap: 12px;
  min-height: 58px;
  padding: 10px 13px;
  background: var(--mi-panel-2, #242626);
}

#pageClientes .search-bar {
  flex: 1 1 420px;
  justify-content: flex-end;
}

#pageClientes #cliBusca {
  width: min(430px, 100%);
  min-width: 230px;
}

#pageClientes #cliBusca:focus,
#pageClientes #cliSituacao:focus {
  border-color: var(--m2-pilot-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m2-pilot-accent-rgb), .16) !important;
}

#pageClientes #clientesTableWrapper {
  min-height: 180px;
}

#pageRelatorios .relatorios-grid {
  align-items: start;
  gap: 12px;
}

#pageRelatorios .relatorios-grid > .data-card {
  overflow: hidden;
  border-radius: 10px;
  border-color: var(--mi-line-soft, rgba(255,255,255,.085));
  background: var(--mi-panel, #1d1f1f);
  box-shadow: 0 7px 18px rgba(0,0,0,.14);
}

#pageRelatorios .relatorios-grid > .data-card > .data-card-header {
  min-height: 46px;
  padding: 9px 12px;
  border-bottom-color: var(--mi-line-soft, rgba(255,255,255,.085));
  background: var(--mi-panel-2, #242626);
}

#pageRelatorios .relatorios-grid > .data-card > .data-card-header h2 {
  font-size: 12px;
  letter-spacing: .015em;
}

#pageRelatorios .relatorio-item {
  min-height: 58px;
  padding: 9px 11px;
  border-bottom-color: var(--mi-line-soft, rgba(255,255,255,.075));
  transition: background-color .15s ease, box-shadow .15s ease;
}

#pageRelatorios .relatorio-item:hover,
#pageRelatorios .relatorio-item:focus-visible {
  outline: none;
  background: rgba(var(--m2-pilot-accent-rgb), .10);
  box-shadow: inset 3px 0 0 var(--m2-pilot-accent);
}

#pageRelatorios .relatorio-icon {
  display: grid;
  place-items: center;
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  border-radius: 7px;
  background: rgba(var(--m2-pilot-accent-rgb), .12);
}

#pageRelatorios .relatorio-info strong { color: var(--mi-text, #f1f0eb); }
#pageRelatorios .relatorio-info small { color: var(--mi-muted, #8f918d); }

@media (max-width: 760px) {
  #pageClientes > .page-header { align-items: stretch; flex-direction: column; }
  #pageClientes > .page-header .actions { display: grid; grid-template-columns: 1fr 1fr; }
  #pageClientes > .data-card > .data-card-header { align-items: stretch; flex-direction: column; }
  #pageClientes .search-bar { flex-basis: auto; }
  #pageClientes #cliBusca { width: 100%; min-width: 0; }
  #pageRelatorios .relatorios-grid { grid-template-columns: 1fr; }
  #pageCatalogos > .page-header,
  #pageDocsProdutos > .page-header { align-items: stretch; flex-direction: column; }
  #pageCatalogos > .data-card:first-of-type > div { align-items: stretch !important; flex-wrap: wrap; }
  #pageCatalogos #catalogoBusca { flex: 1 0 100% !important; width: 100%; }
  #pageDocsProdutos > .data-card > div:not(.data-card-header) { align-items: stretch !important; }
  #pageDocsProdutos :is(#docsProdFornecedor, #docsProdCategoria, #docsProdBusca) { width: 100% !important; }
  #pageRankingFornecedores > .page-header,
  #pageScoreFornecedor > .page-header { align-items: stretch; flex-direction: column; }
  #pageRankingFornecedores > .page-header .actions { display: grid; grid-template-columns: 1fr 1fr; }
  #pageRankingFornecedores > .page-header .actions .btn { grid-column: 1 / -1; }
  #pageScoreFornecedor .header-actions,
  #pageScoreFornecedor #sfMeses { width: 100% !important; }
  #pageMarketing > .page-header,
  #pageLinkbio > .page-header { align-items: stretch; flex-direction: column; }
  #pageLinkbio > .page-header .actions { display: grid; grid-template-columns: 1fr; }
  #pageLinkbio #lbDias { width: 100%; }
  #pageAlertasEstoque > .page-header,
  #pageSazonalidadeProdutos > .page-header { align-items: stretch; flex-direction: column; }
  #pageAlertasEstoque > .page-header .actions,
  #pageSazonalidadeProdutos > .page-header .actions { display: grid; grid-template-columns: 1fr; }
  #pageSazonalidadeProdutos :is(#sazDiasMinimo, #sazFiltroGrupo, #sazFiltroMarca) { width: 100% !important; }
  #pageRentabilidade > .page-header,
  #pagePainelVendedor > .page-header { align-items: stretch; flex-direction: column; }
  #pageRentabilidade > .page-header + div { align-items: stretch !important; }
  #pageRentabilidade :is(#rentDataIni, #rentDataFim, #rentOrdenar, #rentLimite) { width: 100% !important; }
  #pagePainelVendedor #pvGrid { grid-template-columns: 1fr !important; }
  #pagePainelVendedor #pvFiltroVend select { width: 100% !important; }
  #pageExecutiveDash > .page-header,
  #pagePainelDono > .page-header { align-items: stretch; flex-direction: column; }
  #pageExecutiveDash > .page-header .actions { display: grid; grid-template-columns: 1fr 1fr; }
  #pageExecutiveDash > .page-header .actions > * { width: 100%; }
  #pageExecutiveDash > .page-header .actions label { justify-content: space-between; }
  #pagePainelDono > div[style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
  #pageAlertasRecompra > .page-header { align-items: stretch; flex-direction: column; }
  #pageAlertasRecompra .header-actions { align-items: stretch !important; flex-direction: column; }
  #pageAlertasRecompra :is(#arTol, #arFiltroVend select) { width: 100% !important; }
  #pageAnalytics > .page-header { align-items: stretch; flex-direction: column; }
  #pageAnalytics > .page-header .actions { display: grid; grid-template-columns: 1fr 1fr; }
  #pageAnalytics > .page-header .actions > * { width: 100%; }
  #pageAnalytics #analyticsWidgetsGrid { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
  #pageClientes *, #pageRelatorios *, #pageCatalogos *, #pageDocsProdutos *,
  #pageRankingFornecedores *, #pageScoreFornecedor *, #pageMarketing *, #pageLinkbio *,
  #pageAlertasEstoque *, #pageSazonalidadeProdutos * { transition: none !important; }
  #pageRentabilidade *, #pagePainelVendedor * { transition: none !important; }
  #pageExecutiveDash *, #pagePainelDono * { transition: none !important; }
  #pageAlertasRecompra * { transition: none !important; }
  #pageAnalytics * { transition: none !important; }
}