/* Non-critical styles loaded asynchronously. */
/* Move large, below-the-fold component CSS here (charts, analytics). */

/* Responsive grid for filter inputs (replaces Tailwind "grid grid-cols-1 lg:grid-cols-3 gap-3 items-end") */
.noncritical-filters {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  align-items: end;
}
@media (min-width: 768px) {
  .noncritical-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Row container replaced for Tailwind "flex flex-col md:flex-row gap-6 items-stretch mb-6" */
.noncritical-row {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  align-items: stretch;
  margin-bottom: 1.5rem;
}
@media (min-width: 768px) {
  .noncritical-row { flex-direction: row; }
}

/* Column widths for analytics layout */
.noncritical-left { width: 100%; }
.noncritical-right { width: 100%; }
@media (min-width: 768px) {
  .noncritical-left { width: 60%; }
  .noncritical-right { width: 40%; }
}

/* Half width columns (md: 50%) */
.noncritical-half { width: 100%; }
@media (min-width: 768px) {
  .noncritical-half { width: 50%; }
}

/* Generic card spacing used for data panels */
.noncritical-card { margin-bottom: 1rem; }

/* Utility for two-column grids used in some card content */
.noncritical-2col { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) {
  .noncritical-2col { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

/* Minimal chart wrapper sizing (chart components still control internal sizing) */
.analytics-chart-wrapper { width: 100%; }

/* End non-critical rules */