/* Admin Reports styles */
.spar-reports-filters { background:#fff; border:1px solid #ccd0d4; padding:10px; margin:12px 0; border-radius:6px; }
/* Make the filters row a single-line flex row by default */
.spar-reports-filters { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.spar-reports-filters-grid { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0; }
.spar-reports-filters .spar-field label { display:block; margin-bottom:4px; font-weight:600; font-size:12px; color:#3c434a; }
.spar-reports-filters .spar-field input,
.spar-reports-filters .spar-field select { height:30px; padding:2px 8px; }
/* Ensure the actions group stays on the same line and pushes right */
.spar-reports-filters .actions { display:flex; gap:8px; align-items:center; flex-wrap:nowrap; margin-left:0; white-space:nowrap; flex:0 0 auto; }
.spar-reports-filters .actions .button { height:28px; line-height:26px; padding:0 10px; }
/* Prevent date inputs from stretching and causing wrap */
.spar-reports-filters input[type="date"],
.spar-reports-filters select { flex:0 0 auto; }

.spar-reports-cards { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap:16px; margin:20px 0; }
/* Points Per Method: cap to max 5 columns, responsive down on smaller viewports */
.spar-reports-cards.spar-ppm-cards { display:grid !important; grid-auto-flow: row !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
@media (max-width: 1400px) { .spar-reports-cards.spar-ppm-cards { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 1120px) { .spar-reports-cards.spar-ppm-cards { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px)  { .spar-reports-cards.spar-ppm-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .spar-reports-cards.spar-ppm-cards { grid-template-columns: 1fr; } }
.spar-card { background:#fff; border:1px solid #e2e4e7; border-radius:10px; padding:16px; display:flex; align-items:center; gap:12px; box-shadow:0 1px 0 rgba(0,0,0,0.02); }
.spar-card-icon { width:40px; height:40px; border-radius:999px; display:flex; align-items:center; justify-content:center; font-size:18px; }
.spar-card.is-earned .spar-card-icon { background:#e6f6ee; color:#0a7c3a; }
.spar-card.is-redeemed .spar-card-icon { background:#fdeeee; color:#b12727; }
.spar-card.is-net .spar-card-icon { background:#eef2ff; color:#3344cc; }
.spar-card.is-activity .spar-card-icon { background:#fff6e6; color:#a36800; }
.spar-card.is-customers .spar-card-icon { background:#eef6ff; color:#0b63b6; }
.spar-card-content { display:flex; flex-direction:column; gap:4px; }
.spar-card-label { color:#50575e; font-size:12px; text-transform:uppercase; letter-spacing:0.02em; }
.spar-card-value { font-size:22px; font-weight:700; color:#1d2327; }

.spar-reports-tables { display:grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap:20px; margin-top:20px; }
.spar-report-table table th, .spar-report-table table td { vertical-align:middle; }

/* Activity section */
.spar-report-activity { margin-top:24px; }
.spar-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; font-size:12px; font-weight:600; }
.spar-badge.add { background:#e6f6ee; color:#0a7c3a; }
.spar-badge.remove { background:#fdeeee; color:#b12727; }
