

/* vitaliteitsagenda's */
.va-scroll { overflow-x: auto; }
.va-mx { border-collapse: collapse; width: 100%; min-width: 960px; font-size: 13px; }
.va-mx th { font-weight: 600; color: #555; font-size: 12px; padding: 4px 3px; vertical-align: bottom; text-align: center; }
.va-mx td { border-bottom: 1px solid #e6ece9; padding: 4px 3px; text-align: center; white-space: nowrap; }
.va-mx .va-g { text-align: left; font-weight: 600; padding-left: 8px; }
.va-mx .va-sd td { background: #e8f5ef; color: #00805a; font-weight: 700; text-align: left; text-transform: uppercase;
                   letter-spacing: .03em; padding: 4px 8px; }
.va-mx .va-leeg { text-align: left; color: #777; font-style: italic; white-space: normal; }
.va-mx .va-n { color: #555; }
.va-mx .va-tot td { font-weight: 700; border-top: 2px solid #cfdcd6; }
.va-chip { display: inline-block; min-width: 18px; padding: 0 4px; margin: 1px; border-radius: 4px; font-weight: 700;
           font-size: 11.5px; line-height: 18px; text-align: center; }
.va-K { background: #e2f3ea; color: #1f8a5b; } .va-M { background: #fbf0dc; color: #a86a12; }
.va-L { background: #e6e9fa; color: #4a5ab8; } .va-Q { background: #eceeed; color: #6b7471; }
.va-legenda { font-size: 12.5px; color: #555; margin: 4px 0 8px; }
.va-gb { border: 1px solid #dfe8e4; border-radius: 8px; padding: 10px 14px; margin-top: 10px; }
.va-gb h5 { margin: 0 0 4px; font-size: 16px; } .va-sdnaam { color: #777; font-weight: 400; font-size: 13px; }
.va-kn { color: #555; font-size: 13px; margin: 0 0 6px; }
.va-ac { display: grid; grid-template-columns: 26px 1fr; gap: 8px; padding: 6px 0; border-top: 1px dashed #dfe8e4; }
.va-wie { color: #666; font-size: 12.5px; }
.va-paneel { margin-top: 16px; border-top: 1px solid #e2e2e2; padding-top: 10px; }
.va-hint { color: #666; font-size: 13px; }
/* contextpagina's (context_paginas.py) */
.ctx .hoofdtitel { margin: 0; }
.ctx-kop { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.ctx-titelrij { display: flex; align-items: center; gap: 10px; }
.ctx-concept { font-size: 11px; font-weight: 700; color: #7a5c00; background: #fff4cc; border: 1px solid #f0d77a;
               border-radius: 4px; padding: 1px 6px; letter-spacing: .04em; }
.ctx-label { font-size: 12.5px; font-weight: 700; color: #00805a; display: block; margin: 8px 0 4px; }
.ctx-keuze { min-width: 230px; }
.ctx-keuze.breed { width: 100%; margin-bottom: 10px; }
.ctx-blokken { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: 16px; margin-top: 10px; }
.ctx-blok { background: #fff; border: 1px solid #e1e7e4; border-radius: 10px; padding: 12px 14px; min-width: 0; }
.ctx-blok.breed { grid-column: 1 / -1; }
.ctx-bloktitel { margin: 0 0 8px; color: #00805a; font-size: 15px; }
.ctx-tegels { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.ctx-tegel { background: #f5f8f6; border-radius: 8px; padding: 10px 12px; }
.ctx-tegel.leeg { background: #f6f6f6; }
.ctx-tegel-label { font-size: 12.5px; color: #00805a; font-weight: 700; line-height: 1.3; }
.ctx-tegel-waarde { font-size: 24px; font-weight: 700; }
.ctx-tegel-eenheid { font-size: 13px; color: #555; }
.ctx-tegel.leeg .ctx-tegel-waarde { color: #aaa; }
.ctx-tegel-bron { font-size: 11.5px; color: #888; margin-top: 2px; line-height: 1.3; }
.ctx-bron { font-size: 11.5px; color: #888; margin-top: 2px; }
.ctx-grijs td { color: #9aa39f; }
.bezig { color: #b07800; font-weight: 600; }
.ctx-tussentekst { font-size: 13px; color: #444; margin: 6px 0 0; padding: 8px 12px;
                   border-left: 3px solid #0b6b2f; background: #f4f7f5; }
.ctx-leeg { color: #888; font-style: italic; }
.ctx-tekst { font-size: 13.5px; line-height: 1.5; color: #333; }
.ctx-bronnen { margin: 18px 0 30px; font-size: 13px; }
.ctx-bronnen summary { cursor: pointer; color: #00805a; font-weight: 700; }
.ctx-upload-hint { font-size: 12px; color: #777; margin-top: 4px; }
.ctx-upload-fout { border-color: #c0392b !important; background: #fdecea; }
.ctx-upload { border: 2px dashed #9fd9c3; border-radius: 8px; padding: 22px; text-align: center; margin-top: 12px;
              cursor: pointer; background: #f5fbf8; }
.ctx-melding { margin-top: 10px; font-size: 13.5px; }
.ctx-melding .fout, td.fout { color: #a11616; font-weight: 600; }
td.ok { color: #0b6b2f; font-weight: 600; }
.ctx-knop { margin-top: 10px; padding: 6px 14px; border: none; border-radius: 5px; background: #00CA8C; color: #fff;
            font-weight: 700; cursor: pointer; }
.nav-cat { margin: 10px 0 0; }
.nav-cat > summary { list-style: none; cursor: pointer; font-size: 13px; font-weight: 700; color: #1f1f1f;
                     padding: 5px 9px; border-radius: 6px; }
.nav-cat > summary::-webkit-details-marker { display: none; }
.nav-cat > summary::before { content: '▸ '; color: #00805a; }
.nav-cat[open] > summary::before { content: '▾ '; }
.nav-cat > summary:hover { background: #d7f2e6; }
.nav-cat .nav-link { padding-left: 22px; }
