.purchase-reports-page {
  .filter-bar {
    display: flex; gap: 0.75rem; margin-bottom: 1rem; flex-wrap: wrap; align-items: center;
    ::ng-deep .filter-input { min-width: 250px; }
  }

  .loading-wrap { display: flex; justify-content: center; padding: 3rem; }
  .no-data { text-align: center; padding: 3rem; color: var(--color-text-muted); }

  .stat-cards {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.75rem; margin-bottom: 1rem;
  }
  .stat-mini {
    background: var(--color-surface-card, white); border: 1px solid var(--color-surface-border, rgba(0,0,0,0.05));
    border-radius: 10px; padding: 0.75rem 1rem; display: flex; flex-direction: column; gap: 0.15rem;
    .stat-num { font-size: 1.3rem; font-weight: 800; color: var(--color-text-primary); font-family: 'Courier New', monospace; }
    .stat-lbl { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; color: var(--color-text-muted); }
    .stat-val { font-size: 0.75rem; color: var(--color-text-secondary); font-family: 'Courier New', monospace; }
    &.highlight { border-color: var(--color-brand, #1a237e); background: rgba(26,35,126,0.04);
      .stat-num { color: var(--color-brand, #1a237e); }
    }
  }

  .chart-wrap {
    background: var(--color-surface-card, white); border: 1px solid var(--color-surface-border, rgba(0,0,0,0.05));
    border-radius: 10px; padding: 1rem; margin-bottom: 1rem;
    h4 { margin: 0 0 0.75rem; font-size: 0.85rem; font-weight: 700; }
    &.chart-wide { max-width: 100%; }
  }

  .table-toolbar { display: flex; justify-content: flex-end; margin-bottom: 0.5rem; }
  .mono { font-family: 'Courier New', monospace; font-weight: 600; font-size: 0.8rem; }
  .amount { font-family: 'Courier New', monospace; font-weight: 600; text-align: end; }

  .aging-cards {
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.75rem; margin-bottom: 1rem;
  }
  .aging-card {
    background: var(--color-surface-card, white); border: 1px solid var(--color-surface-border);
    border-radius: 10px; padding: 0.75rem; text-align: center;
    .aging-label { display: block; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; color: var(--color-text-muted); }
    .aging-val { display: block; font-size: 1.2rem; font-weight: 800; font-family: 'Courier New', monospace; margin-top: 0.25rem; }
    &.warn { border-color: #f59e0b; .aging-val { color: #f59e0b; } }
    &.danger { border-color: #ef4444; .aging-val { color: #ef4444; } }
    &.critical { border-color: #991b1b; background: #fef2f2; .aging-val { color: #991b1b; } }
  }
}
