/* Beheer: the curatiedashboard of Civios-beheer (key figures, intakes with publishing,
   onboardingpijplijn). ---- */

/* Six key figures: two per row on phones, three from 1024px. */
.civios-beheer-kpis .civios-kaart { flex-direction: column; align-items: flex-start; gap: .75rem; padding: 1.25rem; }
.civios-beheer-kpi { display: grid; gap: .375rem; }

/* Intakes: the publish form sits in the action cell, the level explanations below the table. */
.civios-intakes { min-width: 48rem; }
.civios-intakes .civios-btn { white-space: nowrap; }
.civios-publiceer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; }
.civios-publiceer .civios-input { width: auto; min-width: 10rem; padding-block: .5rem; }
.civios-niveaus-uitleg { padding-bottom: 1.25rem; border-top: 1px solid var(--civios-line); }
.civios-niveaus { margin-top: .75rem; display: grid; gap: .75rem; }
.civios-niveaus dt { font-weight: 700; color: var(--civios-teal); font-size: .875rem; }
.civios-niveaus dd { margin: .125rem 0 0; font-size: .8125rem; color: var(--civios-muted); }

/* Onboardingpijplijn: the stages that wait for Civios-beheer are tinted. */
.civios-pijplijn li.is-intake { border-color: var(--civios-sage); background: var(--civios-sage-soft); }

@media (min-width: 768px) {
  .civios-niveaus { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .civios-beheer-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}