/* Inloggen, en het rechtenraster in Beheer: wat met accounts te maken heeft. */

/* ── Inloggen ───────────────────────────────────────────────────────────── */

.inlogvak {
  width: 100%;
  max-width: 420px;
  padding: var(--ruimte-7);
  border-radius: var(--radius-groot);
  background: var(--kleur-vlak);
  box-shadow: var(--schaduw);
}

.inlogvak-logo {
  width: 56px;
  height: 56px;
  margin-bottom: var(--ruimte-4);
}

.inlogvak-onder {
  margin: var(--ruimte-4) 0 0;
  text-align: center;
}

.qr {
  display: block;
  width: 200px;
  height: 200px;
  margin: var(--ruimte-3) auto;
}

.herstelcodes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--ruimte-2);
  margin: 0 0 var(--ruimte-4);
  padding: var(--ruimte-4);
  border-radius: var(--radius);
  list-style: none;
  background: var(--kleur-vlak-zacht);
}

/* ── Rechtenraster ──────────────────────────────────────────────────────── */

.rechtenraster {
  margin: 0;
  padding: 0;
  border: 0;
}

.rechtenraster legend {
  margin-bottom: var(--ruimte-2);
  font-weight: 600;
}

.rechtenraster th[scope="row"] span {
  display: block;
  font-weight: 400;
  font-size: var(--tekst-klein);
}

.rechtenraster td {
  text-align: center;
}

.rechtenraster input {
  width: 20px;
  height: 20px;
}