/* Mijn account, wachtwoord vergeten en AVG: kleine aanvullingen op app.css */
.account-vergeten { align-self: flex-start; font-size: 13px; font-weight: 600; color: var(--brand-primary); }
.account-vergeten:hover { color: var(--brand-secondary); }
.account-gegevens { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; margin: 0; font-size: 14px; }
.account-gegevens dt { color: var(--app-gedempt); }
.account-gegevens dd { margin: 0; color: var(--brand-text-strong); font-weight: 500; overflow-wrap: anywhere; }
.account-regels { margin: 0; padding-left: 18px; font-size: 13px; color: var(--brand-text); }
.account-regels li { margin: 2px 0; }
.account-activiteit td.wat { white-space: nowrap; }
.account-activiteit .velden { color: var(--app-gedempt); font-size: 12px; }
.account-sterkte { height: 4px; border-radius: 2px; background: var(--app-rand); overflow: hidden; margin-top: 6px; }
.account-sterkte span { display: block; height: 100%; width: 0; background: var(--brand-secondary); transition: width .2s, background .2s; }
.account-sterkte.ok span { background: var(--app-groen); }

/* AVG */
.avg-beleid { max-width: 860px; }
.avg-beleid h2 { margin-top: 0; }
.avg-beleid table.tabel td { vertical-align: top; }
.avg-beleid .termijn { white-space: nowrap; font-weight: 700; color: var(--brand-primary); }
.avg-stap { display: flex; gap: 12px; align-items: flex-start; }
.avg-stap .nr { flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--brand-primary); color: var(--app-wit); display: grid; place-items: center; font-weight: 700; font-size: 13px; }
.avg-gevaar { border: 1px solid var(--brand-secondary); }
.avg-concept { display: inline-block; background: var(--app-oranje-licht); color: var(--app-oranje-tekst); font-weight: 700; font-size: 12px; padding: 3px 10px; border-radius: 999px; }
@media print { .avg-beleid { max-width: none; } }
/* Inlogpagina: "Nog geen account? Account aanvragen" (routers/accountaanvragen.py) */
.login-aanvragen { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 1px solid var(--app-rand); padding-top: 14px; font-size: 14px; color: var(--app-gedempt); }

/* Recente activiteit op de telefoon: lijst met de actie als badge naast de tekst (organizer 30-10, A1) */
@media (max-width: 640px) {
  .activiteit-tabel thead { display: none; }
  .activiteit-tabel, .activiteit-tabel tbody { display: block; }
  .activiteit-tabel tr { display: grid; grid-template-columns: 1fr auto; column-gap: 12px; row-gap: 2px;
    padding: 12px 16px; border-bottom: 1px solid var(--brand-border-subtle); }
  .activiteit-tabel td { display: block; padding: 0; border: 0; }
  .activiteit-tabel .act-wat { grid-column: 1; grid-row: 1; }
  .activiteit-tabel .act-actie { grid-column: 2; grid-row: 1; align-self: start; }
  .activiteit-tabel .act-tijd { grid-column: 1 / -1; grid-row: 2; font-size: 12px; color: var(--brand-text-muted); }
}

/* IBAN: opslaan is de hoofdknop, verwijderen een rode tekstknop links op afstand; fout bij het veld (organizer 30-10, A2/A4) */
.iban-acties { justify-content: flex-start; }
.iban-acties .knop:last-child { margin-left: auto; }
.iban-acties .iban-verwijder { color: var(--app-rood-tekst); }
.iban-acties .iban-verwijder:hover { background: var(--app-rood-licht); }
.veld.met-fout input { border-color: var(--app-rood-tekst); box-shadow: 0 0 0 3px var(--app-rood-licht); }
.veld-fout { margin-top: 6px; font-size: 13px; color: var(--app-rood-tekst); }
.account-gegevens dd.account-email { overflow-wrap: normal; word-break: normal; }