/* Kook App — huisstijl uit het ontwerp (bladgroen, limoen, oranje, inkt; Outfit en Figtree). */
:root {
  --groen: #0B7A3B;
  --groen-donker: #075A2B;
  --limoen: #B5DB4C;
  --oranje: #C2410C;
  --oranje-donker: #9A3412;
  --inkt: #18261B;
  --grijs: #5B6A5E;
  --grijs-donker: #4A5A4D;
  --lijn: #E3E8DC;
  --rand: #D5DCCD;
  --zacht: #F4F6EF;
  --balk: #DDE3D5;
  --licht-groen: #EEF7D9;
  --rood: #B42318;
  --kop: Outfit, system-ui, sans-serif;
  --tekst: Figtree, system-ui, sans-serif;
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--zacht); color: var(--inkt); font-family: var(--tekst); font-size: 15px; line-height: 1.4; }
a { color: var(--groen); }
a:hover { color: var(--groen-donker); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
:focus-visible { outline: 3px solid var(--limoen); outline-offset: 2px; }
h1, h2, p { margin: 0; }
fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
legend { padding: 0; margin-bottom: 10px; }
img { display: block; max-width: 100%; }

.app { max-width: 480px; min-height: 100dvh; margin: 0 auto; display: flex; flex-direction: column; background: #fff; }
.inhoud { flex: 1 1 auto; display: flex; flex-direction: column; padding-bottom: 28px; }
.inhoud.met-kopbalk { padding: 12px 20px 32px; }

/* Hoofdmenu en kopbalk */
.hoofdmenu { position: sticky; bottom: 0; z-index: 5; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 6px 8px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--lijn); background: #fff; }
.hoofdmenu a { display: flex; flex-direction: column; align-items: center; gap: 4px; min-height: 44px; padding: 8px 0; text-decoration: none; color: var(--grijs); font-size: 12px; font-weight: 600; }
.hoofdmenu a[aria-current="page"] { color: var(--groen); font-weight: 700; }
.kopbalk { position: sticky; top: 0; z-index: 5; display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; padding: 12px 12px 4px; background: #fff; }
.kopbalk-titel { text-align: center; font-family: var(--kop); font-weight: 700; font-size: 17px; }
.rond-knop { width: 44px; height: 44px; border: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: transparent; color: var(--inkt); }
.rond-knop.wit { background: #fff; }
.rond-knop.grijs { color: var(--grijs); }

/* Typografie */
.merk { font-family: var(--kop); font-weight: 800; font-size: 20px; letter-spacing: -0.01em; color: var(--groen); }
.bovenkop { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--groen); }
.bovenkop-klein { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: var(--groen); }
.titel { font-family: var(--kop); font-weight: 800; font-size: 30px; line-height: 1.08; letter-spacing: -0.02em; }
.titel-28 { font-family: var(--kop); font-weight: 800; font-size: 28px; line-height: 1.1; letter-spacing: -0.02em; }
.titel-26 { font-family: var(--kop); font-weight: 800; font-size: 26px; line-height: 1.12; letter-spacing: -0.015em; }
.titel-20 { font-family: var(--kop); font-weight: 800; font-size: 20px; line-height: 1.2; }
.kop-17 { font-family: var(--kop); font-weight: 700; font-size: 17px; }
.kop-18 { font-family: var(--kop); font-weight: 700; font-size: 18px; }
.intro { font-size: 15px; line-height: 1.45; color: var(--grijs); }
.intro-14 { font-size: 14px; line-height: 1.45; color: var(--grijs); }
.naam-15 { font-size: 15px; font-weight: 600; line-height: 1.3; }
.klein { font-size: 13px; line-height: 1.35; }
.mini { font-size: 12px; line-height: 1.4; }
.grijs { color: var(--grijs); }
.groen { color: var(--groen); }
.vet { font-weight: 700; }
.doorgestreept { text-decoration: line-through; color: var(--grijs); }

/* Stapels en rijen */
.stapel-2, .stapel-3, .stapel-4, .stapel-5, .stapel-6, .stapel-8, .stapel-10, .stapel-12, .stapel-24 { display: flex; flex-direction: column; }
.stapel-2 { gap: 2px; } .stapel-3 { gap: 3px; } .stapel-4 { gap: 4px; } .stapel-5 { gap: 5px; } .stapel-6 { gap: 6px; }
.stapel-8 { gap: 8px; } .stapel-10 { gap: 10px; } .stapel-12 { gap: 12px; } .stapel-24 { gap: 24px; }
.min-0 { min-width: 0; }
.rij-6, .rij-8, .rij-10 { display: flex; align-items: center; flex-wrap: wrap; }
.rij-6 { gap: 6px; } .rij-8 { gap: 8px; } .rij-10 { gap: 10px; }
.kop-rij { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pagina-stapel { display: flex; flex-direction: column; gap: 20px; padding: 0 20px; }
.pagina-stapel-24 { display: flex; flex-direction: column; gap: 24px; }
.pagina-stapel-28 { display: flex; flex-direction: column; gap: 28px; }
.kop { padding: 20px 20px 16px; display: flex; flex-direction: column; gap: 16px; }

/* Panelen */
.paneel { padding: 14px 16px; border-radius: 16px; background: var(--zacht); }
.paneel-rand { padding: 16px; border: 1px solid var(--lijn); border-radius: 16px; }
.paneel-groen { padding: 16px; border-radius: 16px; background: var(--licht-groen); }
.melding { padding: 12px 14px; border-radius: 12px; background: var(--licht-groen); font-size: 14px; line-height: 1.45; }
.fout { padding: 12px 14px; border-radius: 12px; background: #FDECEA; color: var(--rood); font-size: 14px; font-weight: 600; }

/* Avatars en voortgang */
.avatars { display: flex; align-items: center; }
.avatar { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; border: 2px solid #fff; }
.avatar + .avatar { margin-left: -8px; }
.avatar-0 { background: var(--groen); color: #fff; }
.avatar-1 { background: var(--limoen); color: var(--inkt); }
.mini-avatar { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--limoen); color: var(--inkt); font-weight: 700; font-size: 11px; }
.stemvoortgang { display: flex; flex-direction: column; gap: 10px; }
.voortgang-rij { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.voortgang-naam { font-family: var(--kop); font-weight: 700; font-size: 15px; }
.balk { height: 8px; border-radius: 4px; background: var(--balk); overflow: hidden; }
.balk > div { height: 100%; border-radius: 4px; background: var(--groen); }

/* Weekdagen */
.weekdagen { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.weekdagen form { display: contents; }
.dag { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 56px; padding: 0; border-radius: 12px; }
.dag-claude { background: #fff; color: var(--inkt); border: 1.5px solid var(--rand); }
.dag-bekend { background: var(--limoen); color: var(--inkt); border: 1.5px solid var(--limoen); }
.dag-vrij { background: var(--zacht); color: var(--grijs-donker); border: 1.5px dashed #B8C2B0; }
.dag-id { font-weight: 700; font-size: 14px; text-transform: uppercase; }
.dag-status { font-size: 10px; font-weight: 600; }
.dag:disabled { opacity: 0.75; }
.tekstlink { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 14px; font-weight: 700; }

/* Filters en chips */
.chips { display: flex; gap: 8px; overflow-x: auto; padding: 8px 20px 14px; scrollbar-width: none; }
.chips-wrap { display: flex; flex-wrap: wrap; gap: 8px; }
.chips-wrap form { display: contents; }
.chip { flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--rand); background: #fff; color: var(--inkt); font-size: 14px; font-weight: 600; white-space: nowrap; text-decoration: none; }
.chip:hover { color: var(--inkt); }
.chip[aria-current="true"] { background: var(--inkt); color: #fff; border-color: var(--inkt); }
.chip-op { background: var(--oranje); color: #fff; border-color: var(--oranje); }

/* Gerechtkaarten */
.kaarten { display: flex; flex-direction: column; gap: 18px; padding: 0 20px; }
.kaart { position: relative; border: 1px solid var(--lijn); border-radius: 20px; overflow: hidden; background: #fff; scroll-margin-top: 16px; }
.kaart-foto-link { display: block; color: inherit; text-decoration: none; }
.foto-vlak { position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.foto-leeg { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--inkt); }
.foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kaart-foto { height: 168px; }
.label { position: absolute; top: 12px; left: 12px; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.02em; background: #fff; color: var(--inkt); }
.label-nieuw { background: var(--limoen); color: var(--inkt); }
.label-aanbieding { background: var(--oranje); color: #fff; }
.label-kids-favoriet, .label-kids { background: #fff; color: var(--inkt); }
.label-vega { background: #fff; color: var(--groen); }
.label-eerder-gegeten { background: #fff; color: var(--inkt); }
.tijd-pil { position: absolute; right: 12px; top: 124px; display: flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 999px; background: #fff; font-size: 13px; font-weight: 600; }
.kaart-tekst { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px 16px; }
.kaart-titel { font-family: var(--kop); font-weight: 700; font-size: 18px; line-height: 1.25; color: var(--inkt); text-decoration: none; }
.kaart-titel:hover { color: var(--groen); }
.score { display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--grijs); }
.score strong { color: var(--inkt); }
.score-14 { font-size: 14px; gap: 6px; }
.score-groot { display: flex; align-items: center; gap: 4px; font-weight: 700; font-size: 15px; }

/* Stemknoppen */
.stemknoppen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.stemknop { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 8px; border-radius: 12px; background: #fff; color: var(--inkt); border: 1.5px solid var(--rand); font-size: 14px; font-weight: 700; }
.stemknop.aan-nee { background: var(--rood); color: #fff; border-color: var(--rood); }
.stemknop.aan-prima { background: var(--inkt); color: #fff; border-color: var(--inkt); }
.stemknop.aan-ja { background: var(--groen); color: #fff; border-color: var(--groen); }
.stemknop:disabled:not([aria-pressed="true"]) { color: #8A968C; background: var(--zacht); border-color: var(--lijn); }
.ander-stem { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--grijs); }
.match { padding: 9px 12px; border-radius: 10px; background: var(--licht-groen); font-size: 13px; font-weight: 600; }

/* Recept */
.held { position: relative; }
.held-foto { height: 300px; padding-bottom: 24px; }
.held-terug { position: absolute; top: 16px; left: 16px; }
.held-label { top: auto; bottom: 40px; left: 20px; }
.blad { position: relative; margin-top: -24px; border-radius: 24px 24px 0 0; background: #fff; padding: 24px 20px 8px; display: flex; flex-direction: column; gap: 22px; }
.feiten { display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; color: var(--grijs); }
.feiten span { display: inline-flex; align-items: center; gap: 6px; }
.vinklijst { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.4; }
.vinklijst li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: start; }
.vinklijst svg { color: var(--groen); }
.vorige-keer { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 12px; background: #fff; }
.vorige-lijst { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 10px; row-gap: 4px; font-size: 14px; }
.vorige-lijst li { display: contents; }
blockquote { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--zacht); font-size: 14px; line-height: 1.45; }
.opsomming { margin: 0; padding: 0 0 0 18px; display: flex; flex-direction: column; gap: 8px; font-size: 14px; line-height: 1.45; }
.ingredienten { margin: 0; padding: 0; list-style: none; }
.ingredienten li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--lijn); }
.ingredienten .naam { font-size: 15px; font-weight: 600; }
.winkel-pil { padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.winkel-ah { background: #E3EEFB; color: #1E4E8C; }
.winkel-lidl { background: #FFF4CC; color: #6B5300; }
.winkel-jumbo { background: #EDE7F6; color: #4C2A85; }
.winkel-thuis { background: #EEF1EA; color: var(--grijs-donker); }
.stappen { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; line-height: 1.5; }
.hoofdknop { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; border: 0; border-radius: 14px; background: var(--groen); color: #fff; font-weight: 700; font-size: 16px; text-decoration: none; }
.hoofdknop:hover { background: var(--groen-donker); color: #fff; }

/* Weekmenu */
.ah-kaart { display: flex; flex-direction: column; gap: 12px; padding: 18px; border-radius: 18px; background: var(--groen); color: #fff; }
.ah-kaart p { font-size: 14px; line-height: 1.45; }
.witte-knop { align-self: flex-start; display: flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 12px; background: #fff; color: var(--groen); font-weight: 700; font-size: 15px; text-decoration: none; }
.menu-rij { display: grid; grid-template-columns: 44px 64px minmax(0, 1fr); align-items: center; gap: 12px; padding: 10px; border: 1px solid var(--lijn); border-radius: 16px; color: var(--inkt); text-decoration: none; }
a.menu-rij:hover { border-color: var(--rand); color: var(--inkt); }
.menu-rij-vast { border: 1.5px dashed #B8C2B0; background: var(--zacht); }
.dagkolom { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.dagkolom .dag-id { font-family: var(--kop); font-weight: 800; font-size: 16px; }
.duim { width: 64px; height: 64px; border-radius: 12px; }
.duim-vast { display: flex; align-items: center; justify-content: center; background: #fff; color: var(--groen); }
.label-klein { padding: 3px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.label-snel { background: #EEF1EA; color: var(--grijs-donker); }
.label-klein.label-kids { background: #FDEBDD; color: var(--oranje-donker); }

/* Boodschappen */
.tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 4px; border-radius: 14px; background: var(--zacht); }
.tabs a { display: flex; align-items: center; justify-content: center; gap: 4px; min-height: 44px; border-radius: 11px; border: 1.5px solid transparent; color: var(--grijs-donker); font-size: 15px; font-weight: 700; text-decoration: none; }
.tabs a[aria-current="page"] { background: #fff; color: var(--inkt); border-color: var(--rand); }
.tabs .aantal { font-weight: 500; opacity: 0.75; }
.ah-status { display: flex; flex-direction: column; gap: 6px; padding: 16px; border-radius: 16px; background: #E3EEFB; }
.ah-status-kop { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 16px; color: #1E4E8C; }
.groepkop { margin: 0 0 4px; font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grijs); }
.productlijst { margin: 0; padding: 0; list-style: none; }
.product { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 64px; padding: 8px 0; border-bottom: 1px solid var(--lijn); scroll-margin-top: 16px; }
.product.zonder-vink { grid-template-columns: minmax(0, 1fr) auto; }
.vinkvak { width: 44px; height: 44px; margin-left: -10px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; padding: 0; }
.vinkvak::before { content: ""; position: absolute; width: 22px; height: 22px; border-radius: 6px; border: 2px solid #8A968C; background: #fff; }
.vinkvak { position: relative; }
.vinkvak svg { position: relative; color: #fff; }
.vinkvak.aan::before { background: var(--groen); border-color: var(--groen); }
.advies { font-size: 12px; font-weight: 600; color: var(--oranje-donker); }
.winkelkeuze { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; width: 150px; padding: 2px; border-radius: 12px; background: var(--zacht); }
.winkelkeuze.vier { grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; gap: 3px; padding: 3px; }
.winkelkeuze button { min-height: 40px; padding: 0 2px; border-radius: 10px; border: 1.5px solid transparent; background: transparent; color: var(--grijs-donker); font-size: 13px; font-weight: 700; }
.winkelkeuze button.gekozen.winkel-ah { background: #E3EEFB; color: #1E4E8C; border-color: #1E4E8C; }
.winkelkeuze button.gekozen.winkel-lidl { background: #FFF4CC; color: #6B5300; border-color: #6B5300; }
.winkelkeuze button.gekozen.winkel-jumbo { background: #EDE7F6; color: #4C2A85; border-color: #4C2A85; }
.winkelkeuze button.gekozen.winkel-thuis { background: #fff; color: var(--grijs-donker); border-color: var(--grijs-donker); }

/* Formulieren */
.veld { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; }
.veld input, .veld select, .invoer, textarea { width: 100%; min-height: 48px; padding: 0 14px; border-radius: 12px; border: 1.5px solid var(--rand); background: #fff; font-size: 16px; }
.invoer { font-weight: 600; }
textarea { min-height: 96px; padding: 12px 14px; resize: vertical; line-height: 1.45; font-size: 15px; }
.keuze { display: flex; }
.keuze input, .segment input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.keuze span { flex: 1; display: flex; align-items: center; min-height: 52px; padding: 0 16px; border-radius: 14px; border: 1.5px solid var(--rand); background: #fff; font-size: 15px; font-weight: 700; cursor: pointer; }
.drie-kolom { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.drie-kolom .keuze span { justify-content: center; padding: 0 6px; text-align: center; }
.keuze input:checked + span { background: var(--groen); color: #fff; border-color: var(--groen); }
.keuze input:focus-visible + span, .segment input:focus-visible + span { outline: 3px solid var(--limoen); outline-offset: 2px; }
.keuze-breed + .keuze-breed { margin-top: 8px; }
.segment { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 4px; border-radius: 14px; background: var(--zacht); }
.segment span { display: flex; align-items: center; justify-content: center; min-height: 44px; border-radius: 11px; border: 1.5px solid transparent; color: var(--grijs-donker); font-weight: 700; cursor: pointer; }
.segment input:checked + span { background: #fff; color: var(--inkt); border-color: var(--rand); }
.lijnknop { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 12px; border: 1.5px solid var(--rand); background: #fff; font-size: 15px; font-weight: 700; cursor: pointer; list-style: none; }
.lijnknop::-webkit-details-marker { display: none; }
.toevoegen[open] > summary { margin-bottom: 12px; }
.vast-ingredient { display: flex; flex-direction: column; gap: 8px; padding: 10px 0 12px; border-bottom: 1px solid var(--lijn); scroll-margin-top: 16px; }
.rij-ingredient { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; gap: 8px; }

/* Instellingen */
.instelling-rij { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 12px 8px 12px 16px; border: 1px solid var(--lijn); border-radius: 16px; }
.schakelaar { width: 64px; height: 44px; padding: 0; border: 0; background: transparent; display: flex; align-items: center; justify-content: center; }
.spoor { display: flex; align-items: center; width: 52px; height: 32px; padding: 3px; border-radius: 16px; background: #B8C2B0; }
.bol { width: 26px; height: 26px; border-radius: 50%; background: #fff; transition: margin 0.15s; }
.schakelaar[aria-checked="true"] .spoor { background: var(--groen); }
.schakelaar[aria-checked="true"] .bol { margin-left: 20px; }
.stapper { display: flex; align-items: center; gap: 8px; }
.stapper button { width: 44px; height: 44px; border-radius: 12px; border: 1.5px solid var(--rand); background: #fff; font-size: 22px; font-weight: 700; line-height: 1; }
.stapper button:disabled { border-color: var(--lijn); background: var(--zacht); color: #8A968C; }
.stapper-waarde { min-width: 96px; text-align: center; font-family: var(--kop); font-weight: 700; font-size: 18px; }
.fotoknop { position: relative; display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border-radius: 12px; background: var(--groen); color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; }
.verborgen-invoer { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* Terugblik en login */
.terugblik-kop { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; align-items: center; }
.duim-88 { width: 88px; height: 88px; border-radius: 16px; }
.terugblik-kop .label-klein { align-self: flex-start; }
.login { display: flex; flex-direction: column; gap: 16px; padding: 48px 20px; }

.js .zonder-js { display: none; }

/* Tijdens het laden van een formulier */
form[aria-busy="true"] button { opacity: 0.7; }

/* Verzoeken aan Claude */
.verzoek-blok { margin: 22px 20px 0; }
div.verzoek-blok { margin-top: 12px; }
.verzoek-blok .lijnknop { align-self: flex-start; }
.verzoek-lijst { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.verzoek-item { padding: 12px 14px; border: 1px solid var(--lijn); border-radius: 14px; background: #fff; }
.verzoek-item a { word-break: break-all; }
.label-klein.status-open { background: var(--balk); color: var(--grijs-donker); }
.label-klein.status-verwerkt { background: var(--licht-groen); color: var(--groen-donker); }
.label-klein.status-afgewezen { background: #FDEBDD; color: var(--oranje-donker); }
.veld input[readonly] { background: var(--zacht); color: var(--grijs-donker); }
.veld .grijs { font-weight: 400; }