/* Opmaak van de webapp, bovenop tokens.css en components.css (brandbook). */
.rq-pagina { max-width: 1120px; margin: 0 auto; padding: var(--space-6) var(--space-4) var(--space-12); }
.rq-header { margin-bottom: var(--space-6); }
.rq-header a { color: inherit; text-decoration: none; }
.rq-nav { display: flex; gap: var(--space-4); align-items: center; margin-left: var(--space-6); }
.rq-nav a { font-size: 13px; font-weight: 500; color: #2B364F; text-decoration: none; padding: var(--space-1) 0; border-bottom: 2px solid transparent; }
.rq-nav a[aria-current="page"] { border-bottom-color: #A4C546; }
.rq-header-meta { display: flex; align-items: center; gap: var(--space-3); }
.rq-header-meta form { margin: 0; }

h1 { font-family: var(--font-serif); font-weight: 600; font-size: 26px; line-height: 34px; margin: 0 0 var(--space-2); color: var(--ink); }
h2 { font-family: var(--font-serif); font-weight: 600; font-size: 19px; line-height: 26px; margin: var(--space-8) 0 var(--space-3); color: var(--ink); }
.rq-lead { color: var(--ink-muted); margin: 0 0 var(--space-6); }
a { color: var(--amanah-navy); }

/* Tabellen */
.rq-tabel-wrap { background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow-card); overflow-x: auto; }
.rq-tabel { width: 100%; border-collapse: collapse; font-size: 13px; line-height: 20px; }
.rq-tabel th { text-align: left; font-weight: 500; font-size: 12px; color: var(--ink-muted); padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); white-space: nowrap; }
.rq-tabel td { padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--line); vertical-align: middle; }
.rq-tabel tr:last-child td { border-bottom: none; }
.rq-tabel td.rq-getal, .rq-tabel th.rq-getal { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.rq-tabel td.rq-nowrap { white-space: nowrap; }
.rq-leeg { padding: var(--space-6) var(--space-4); color: var(--ink-muted); }

/* Formulieren */
.rq-formulier { max-width: 420px; }
.rq-veld { display: flex; flex-direction: column; gap: var(--space-1); margin-bottom: var(--space-4); }
.rq-veld label { font-size: 13px; font-weight: 500; }
.rq-veld small { font-size: 12px; color: var(--ink-muted); }
.rq-veld input, .rq-veld select { font: inherit; font-size: 14px; height: 40px; padding: 0 var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); }
.rq-veld input:focus-visible, .rq-veld select:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.rq-code { letter-spacing: 0.3em; font-variant-numeric: tabular-nums; }
.rq-fout { background: var(--status-critical-soft); color: var(--status-critical); border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: 13px; }

/* Inlogscherm */
.rq-login { max-width: 420px; margin: var(--space-12) auto; }
.rq-login .rq-header { justify-content: center; }

/* Kerncijfers */
.rq-cijfers { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-3); margin-bottom: var(--space-4); }

/* Rapport */
.rq-rapport { background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); padding: var(--space-6); }
.rq-rapport h1 { font-size: 22px; }
.rq-rapport table { border-collapse: collapse; margin: var(--space-3) 0 var(--space-4); font-size: 13px; }
.rq-rapport th, .rq-rapport td { border-bottom: 1px solid var(--line); padding: var(--space-2) var(--space-3); text-align: left; }
.rq-figure .rq-badge { display: inline-flex; margin-top: var(--space-1); }
.rq-rapport td:first-child { white-space: nowrap; }

/* Review */
.rq-review { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-4); align-items: start; }
@media (max-width: 900px) { .rq-review { grid-template-columns: 1fr; } }
.rq-klein { font-size: 12px; line-height: 18px; margin: 0 0 var(--space-3); }
.rq-regels { margin-bottom: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.rq-aandacht { background: var(--status-warning-soft); color: var(--status-warning); border-radius: var(--radius-sm); padding: var(--space-2) var(--space-3); font-size: 13px; margin-bottom: var(--space-3); }
.rq-aandacht ul, .rq-fout ul { margin: var(--space-1) 0 0; padding-left: var(--space-4); }
.rq-acties { display: flex; flex-direction: column; gap: var(--space-3); border-top: 1px solid var(--line); padding-top: var(--space-4); }
.rq-details summary { cursor: pointer; font-size: 13px; font-weight: 500; color: var(--amanah-navy); }
.rq-details[open] summary { margin-bottom: var(--space-3); }
.rq-details ul { margin: var(--space-2) 0 0; padding-left: var(--space-4); font-size: 13px; }
.rq-knop-link { display: inline-flex; align-items: center; text-decoration: none; }
.rq-notice + p { margin: 0 0 var(--space-4); }
.rq-inline { display: inline; margin-left: var(--space-3); }
.rq-btn-klein { font-size: 12px; padding: 2px var(--space-2); min-height: 0; }
.rq-origineel { display: block; max-width: 100%; max-height: 520px; margin-bottom: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); }
.rq-veld textarea { font: inherit; font-size: 14px; padding: var(--space-2) var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); color: var(--ink); resize: vertical; }
.rq-veld textarea:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }