/* =========================================================
   V73 — Ajustes profissionais de UI/UX
   - Remove poluição visual da exportação.
   - Estabiliza layout ao alterar toggles.
   - Garante botão de limpar filtros apenas onde faz sentido.
   ========================================================= */
:root{
  --v73-ink:#0f172a;
  --v73-muted:#475569;
  --v73-border:#dbeafe;
  --v73-border-strong:#93c5fd;
  --v73-blue:#2563eb;
  --v73-blue-soft:#eff6ff;
  --v73-green:#059669;
  --v73-green-soft:#ecfdf5;
  --v73-purple:#7c3aed;
  --v73-purple-soft:#f5f3ff;
  --v73-surface:#ffffff;
  --v73-bg:#f8fbff;
  --v73-shadow:0 18px 38px rgba(15,23,42,.08);
  --v73-radius:18px;
}

/* Botão de limpar filtros: nunca deve virar card grande nas páginas institucionais. */
body:not(.route-conferencia) #btnResetFiltros,
body:not([data-route="conferencia"]) #btnResetFiltros,
body.route-home #btnResetFiltros,
body.route-regras #btnResetFiltros,
body.route-parametros #btnResetFiltros,
body[data-route="home"] #btnResetFiltros,
body[data-route="regras"] #btnResetFiltros,
body[data-route="parametros"] #btnResetFiltros,
body[data-route="exportar"] #btnResetFiltros,
body.route-exportar #btnResetFiltros{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
  width:0 !important;
  height:0 !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  opacity:0 !important;
}

body:not(.route-conferencia) #btnFloatingClearFiltersV7118,
body:not(.route-exportar) #btnExportClearPro,
body:not(.route-exportar) #btnExportClearV7125Fix,
body[data-route="home"] #btnFloatingClearFiltersV7118,
body[data-route="regras"] #btnFloatingClearFiltersV7118,
body[data-route="parametros"] #btnFloatingClearFiltersV7118,
body[data-route="estatisticas"] #btnFloatingClearFiltersV7118{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
  opacity:0 !important;
}

/* Remove o card de status inserido na versão anterior. */
#uxExportSummary,
.ux-export-summary,
#uxExportStatusChip{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Exportar: acabamento mais corporativo, limpo e sem aparência de tutorial. */
body[data-route="exportar"] #modalExportar,
body.route-exportar #modalExportar{
  background:linear-gradient(180deg,#f8fbff 0%,#eef6ff 100%) !important;
}

body[data-route="exportar"] #modalExportar .export-page-card,
body.route-exportar #modalExportar .export-page-card{
  border:1px solid rgba(37,99,235,.24) !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:var(--v73-shadow) !important;
  padding:22px !important;
}

body[data-route="exportar"] #modalExportar .export-pro-titlebar,
body.route-exportar #modalExportar .export-pro-titlebar{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  min-height:auto !important;
  margin:0 0 18px !important;
  padding:0 0 16px !important;
  border-bottom:1px solid rgba(148,163,184,.24) !important;
  background:transparent !important;
  box-shadow:none !important;
}

body[data-route="exportar"] #modalExportar .export-pro-titlebar h2,
body.route-exportar #modalExportar .export-pro-titlebar h2{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin:0 !important;
  color:var(--v73-ink) !important;
  font-size:clamp(22px,2vw,32px) !important;
  letter-spacing:-.03em !important;
}

body[data-route="exportar"] #modalExportar .export-pro-titlebar h2 .material-icons,
body.route-exportar #modalExportar .export-pro-titlebar h2 .material-icons,
body[data-route="exportar"] #modalExportar .export-pro-card-head > .material-icons,
body.route-exportar #modalExportar .export-pro-card-head > .material-icons{
  width:42px !important;
  height:42px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 auto !important;
  border-radius:14px !important;
  color:#fff !important;
  background:linear-gradient(135deg,#2563eb,#0ea5e9) !important;
  box-shadow:0 12px 24px rgba(37,99,235,.22) !important;
}

body[data-route="exportar"] #modalExportar .export-pro-titlebar p,
body.route-exportar #modalExportar .export-pro-titlebar p{
  margin:4px 0 0 54px !important;
  color:var(--v73-muted) !important;
  font-weight:700 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-steps,
body.route-exportar #modalExportar .export-pro-steps{
  display:none !important;
}

body[data-route="exportar"] #modalExportar .export-pro-dashboard,
body.route-exportar #modalExportar .export-pro-dashboard{
  gap:0 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-grid-131,
body.route-exportar #modalExportar .export-pro-grid-131{
  display:grid !important;
  grid-template-columns:minmax(240px,300px) minmax(560px,1fr) minmax(280px,340px) !important;
  grid-template-areas:"scope main zip" !important;
  gap:16px !important;
  align-items:stretch !important;
}

body[data-route="exportar"] #modalExportar .export-pro-scope-card{grid-area:scope !important;}
body[data-route="exportar"] #modalExportar .export-pro-main{grid-area:main !important;}
body[data-route="exportar"] #modalExportar .export-pro-zip-card{grid-area:zip !important;}

body[data-route="exportar"] #modalExportar .export-pro-card,
body.route-exportar #modalExportar .export-pro-card,
body[data-route="exportar"] #modalExportar .export-pro-main,
body.route-exportar #modalExportar .export-pro-main{
  border:1px solid rgba(147,197,253,.72) !important;
  border-radius:20px !important;
  background:#fff !important;
  box-shadow:0 12px 26px rgba(15,23,42,.055) !important;
}

body[data-route="exportar"] #modalExportar .export-pro-card,
body.route-exportar #modalExportar .export-pro-card{
  padding:18px !important;
}

body[data-route="exportar"] #modalExportar .export-pro-main,
body.route-exportar #modalExportar .export-pro-main{
  padding:18px !important;
}

body[data-route="exportar"] #modalExportar .export-pro-section-head,
body.route-exportar #modalExportar .export-pro-section-head,
body[data-route="exportar"] #modalExportar .export-pro-card-head,
body.route-exportar #modalExportar .export-pro-card-head{
  display:flex !important;
  align-items:flex-start !important;
  gap:12px !important;
  margin:0 0 14px !important;
}

body[data-route="exportar"] #modalExportar .export-pro-section-head .material-icons,
body.route-exportar #modalExportar .export-pro-section-head .material-icons{
  width:38px !important;
  height:38px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:13px !important;
  color:var(--v73-blue) !important;
  background:var(--v73-blue-soft) !important;
}

body[data-route="exportar"] #modalExportar .export-pro-card h3,
body[data-route="exportar"] #modalExportar .export-pro-main h3,
body.route-exportar #modalExportar .export-pro-card h3,
body.route-exportar #modalExportar .export-pro-main h3{
  margin:0 !important;
  color:var(--v73-ink) !important;
  font-size:16px !important;
  letter-spacing:-.01em !important;
}

body[data-route="exportar"] #modalExportar .export-pro-card p,
body[data-route="exportar"] #modalExportar .export-pro-main p,
body.route-exportar #modalExportar .export-pro-card p,
body.route-exportar #modalExportar .export-pro-main p{
  color:var(--v73-muted) !important;
  line-height:1.45 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-main-grid,
body.route-exportar #modalExportar .export-pro-main-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
}

body[data-route="exportar"] #modalExportar .export-pro-download-card,
body.route-exportar #modalExportar .export-pro-download-card{
  min-height:260px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  border-color:rgba(16,185,129,.28) !important;
}

body[data-route="exportar"] #modalExportar .export-pro-download-card:nth-child(2),
body.route-exportar #modalExportar .export-pro-download-card:nth-child(2){
  border-color:rgba(37,99,235,.28) !important;
}
body[data-route="exportar"] #modalExportar .export-pro-download-card:nth-child(3),
body.route-exportar #modalExportar .export-pro-download-card:nth-child(3),
body[data-route="exportar"] #modalExportar .export-pro-zip-card,
body.route-exportar #modalExportar .export-pro-zip-card{
  border-color:rgba(124,58,237,.28) !important;
}

body[data-route="exportar"] #modalExportar .export-pro-button,
body.route-exportar #modalExportar .export-pro-button{
  width:100% !important;
  min-height:48px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;
  border-radius:14px !important;
  border:1px solid rgba(37,99,235,.28) !important;
  background:linear-gradient(180deg,#fff,#f8fbff) !important;
  color:#1e3a8a !important;
  font-weight:900 !important;
  box-shadow:none !important;
  transition:transform .18s ease-in-out, box-shadow .18s ease-in-out, border-color .18s ease-in-out !important;
}

body[data-route="exportar"] #modalExportar .export-pro-button:not(:disabled):hover,
body.route-exportar #modalExportar .export-pro-button:not(:disabled):hover{
  transform:translateY(-1px) !important;
  box-shadow:0 12px 22px rgba(15,23,42,.10) !important;
  border-color:rgba(37,99,235,.52) !important;
}
body[data-route="exportar"] #modalExportar .export-pro-button:not(:disabled):active,
body.route-exportar #modalExportar .export-pro-button:not(:disabled):active{transform:scale(.985) !important;}

body[data-route="exportar"] #modalExportar .export-pro-button:disabled,
body.route-exportar #modalExportar .export-pro-button:disabled{
  opacity:.46 !important;
  cursor:not-allowed !important;
  box-shadow:none !important;
}

body[data-route="exportar"] #modalExportar .export-pro-toggle-row,
body.route-exportar #modalExportar .export-pro-toggle-row{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin:12px 0 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-toggle,
body.route-exportar #modalExportar .export-pro-toggle{
  min-height:42px !important;
  padding:8px 10px !important;
  border-radius:14px !important;
  border:1px solid rgba(147,197,253,.72) !important;
  background:#f8fbff !important;
  box-shadow:none !important;
}

body[data-route="exportar"] #modalExportar select,
body.route-exportar #modalExportar select{
  height:42px !important;
  border-radius:12px !important;
  border:1px solid rgba(147,197,253,.86) !important;
  background:#fff !important;
  color:var(--v73-ink) !important;
  font-weight:800 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-field,
body.route-exportar #modalExportar .export-pro-field{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  color:var(--v73-ink) !important;
  font-weight:900 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-scope-badge,
body.route-exportar #modalExportar .export-pro-scope-badge{
  display:inline-flex !important;
  justify-content:center !important;
  margin:0 0 12px !important;
  padding:9px 12px !important;
  border-radius:999px !important;
  background:var(--v73-blue-soft) !important;
  color:#1d4ed8 !important;
  font-weight:900 !important;
}

body[data-route="exportar"] #modalExportar .export-pro-mini-note,
body.route-exportar #modalExportar .export-pro-mini-note{
  border-radius:14px !important;
  background:#f8fafc !important;
  border:1px solid #e2e8f0 !important;
  padding:12px !important;
}

@media(max-width:1320px){
  body[data-route="exportar"] #modalExportar .export-pro-grid-131,
  body.route-exportar #modalExportar .export-pro-grid-131{
    grid-template-columns:1fr !important;
    grid-template-areas:"scope" "main" "zip" !important;
  }
}
@media(max-width:980px){
  body[data-route="exportar"] #modalExportar .export-pro-main-grid,
  body.route-exportar #modalExportar .export-pro-main-grid{
    grid-template-columns:1fr !important;
  }
  body[data-route="exportar"] #modalExportar .export-pro-titlebar p,
  body.route-exportar #modalExportar .export-pro-titlebar p{
    margin-left:0 !important;
  }
}
