.beheer-keuzebalk{position:sticky;top:0;z-index:40;margin-top:0!important;box-shadow:0 3px 8px #0002;padding:10px 16px!important}
.beheer-keuzebalk label{display:flex;align-items:center;gap:12px;margin:0;flex-wrap:wrap;text-align:left}
.beheer-keuzebalk select,.beheer-keuzebalk input{width:min(420px,100%);min-width:0;max-width:100%;box-sizing:border-box}
.beheer-keuzebalk [role=status]:empty{display:none}
[data-beheer-pagina] [data-lokale-organisatie]{display:none!important}
.beheer-onderdeel{border:1px solid var(--kleur-icoontekst,#888);border-radius:10px;padding:16px;margin:16px 0;min-width:0;text-align:left}
.beheer-onderdeel>h2,.beheer-onderdeel>h3{margin-top:0}
.instellingen-kaart label{display:block;text-align:left;margin-block:12px 6px}
.instellingen-kaart label>input:not([type=checkbox]):not([type=radio]),.instellingen-kaart label>select{display:block;box-sizing:border-box;max-width:100%;margin-top:5px}
.instellingen-kaart .beheer-checkbox,.instellingen-kaart .radio-keuze{display:flex;align-items:center;gap:8px}
.informatie-acties{align-items:center}
.informatie-acties>button,.informatie-acties>a.standaard-knop{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:40px;margin:0;padding:8px 14px;font:inherit;line-height:1.2;vertical-align:middle}
.beheer-keuzebalk label{margin:0}.beheer-keuzebalk label>select,.beheer-keuzebalk label>input{margin:0}
@media(max-width:600px){.beheer-keuzebalk{padding:8px!important}.beheer-keuzebalk label{gap:4px}.beheer-onderdeel{padding:12px}.informatie-acties{display:flex;flex-wrap:wrap}}

.instellingen-kaart [hidden],[data-beheer-pagina] [hidden]{display:none!important}

.beheer-filterkaart{background:var(--kleur-icoontekst,#f0f0f0);color:var(--vlak-tekst,#000);border:1px solid #bbcdd7;border-radius:10px;padding:16px}
body .gebruikers-filters label{margin:0}
/* Na de algemene kaartlabels: deze scope hoort naast het veld te blijven. */
body .instellingen-kaart label.beheer-inline-label{display:flex;align-items:center;flex-wrap:nowrap;gap:10px;margin:0;text-align:left;min-width:0}
.beheer-inline-label>span{flex:none;white-space:nowrap}
body .instellingen-kaart label.beheer-inline-label>select,body .instellingen-kaart label.beheer-inline-label>input{flex:0 1 420px;width:420px;min-width:0;margin:0}
@media(max-width:600px){body .instellingen-kaart label.beheer-inline-label{gap:6px}.beheer-inline-label>span{font-size:.9em}}

/* Ruimte voor onderlengen en dezelfde inspringing als de veldinhoud. */
[data-beheer-overzicht] .overzicht-filterlabel{display:block;padding:2px 13px 5px;line-height:1.5;overflow:visible}

/* Afdelingsbeheer gebruikt dezelfde kaarten, knoppen en checkboxen. */
[data-afdelingen] .scherm-acties{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
[data-afdelingen] .beheer-checkbox>span{min-width:160px}

.indeling-soort label:not(.beheer-checkbox){display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:.7rem 0;flex-wrap:wrap}.indeling-soort input:not([type=checkbox]){min-height:40px;max-width:100%;box-sizing:border-box}

/* Gedeelde standaardlabels volgen de indeling van het organisatiebeheer. */
[data-beheer-overzicht] .overzicht-filterlabel{padding:0;margin:0}
[data-beheer-overzicht] .overzicht-filterregel{display:grid;grid-template-columns:110px auto;align-items:center;gap:16px}
[data-beheer-overzicht] .ja-nee-keuze input{width:18px;min-width:18px;height:18px;flex:none}
[data-emailbeleid]>label:not([data-lokale-organisatie]){display:grid;grid-template-columns:minmax(180px,1fr) 110px;align-items:center;gap:16px}
.applicatie-inhoud:has([data-beheer-overzicht]){display:flex;flex-direction:column;overflow:hidden;min-height:0}
[data-beheer-overzicht]{flex:1;min-height:0}
.kleur-keuzeregel .beheer-checkbox{margin:0;align-items:center}
.kleur-keuzeregel{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}.kleur-keuzeregel>button{max-width:145px;white-space:normal}.kleur-keuzeregel .beheer-checkbox{min-width:0}.kleur-keuzeregel input[type=checkbox]{flex:0 0 auto}

/* Vaste bediening; een begrensde tabel is de enige verticale scrollcontainer. */
.applicatie-inhoud:has(:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie])){display:flex;flex-direction:column;min-height:0;overflow:hidden}
.applicatie-inhoud:has(:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie]))>.systeem-pagina{display:flex;flex-direction:column;flex:1 1 0;min-height:0;overflow:hidden;width:100%;box-sizing:border-box}
.systeem-pagina:has(:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie]))>.systeem-afbeelding{width:56px;max-height:56px;margin:0 auto 8px;flex-shrink:0}
:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie]){display:flex;flex-direction:column;flex:1 1 0;min-height:0;overflow:hidden;margin-top:0;max-height:none}
:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie])>.gebruikers-tabelvak{flex:1 1 0;min-height:80px;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y}
:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie])>:not(.gebruikers-tabelvak){flex-shrink:0}
:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie]) .gebruikers-tabel th{position:sticky;top:0;z-index:2;background:var(--kleur-icoontekst,#f0f0f0);color:var(--vlak-tekst,#000)}
[data-beheer-overzicht="gebruikers"] .gebruikers-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:center}
[data-beheer-overzicht="gebruikers"] .gebruikers-filters>label:first-child{grid-row:auto}
[data-beheer-overzicht="gebruikers"] .overzicht-filterregel{grid-column:auto;display:flex;align-items:center;gap:10px}
[data-beheer-overzicht="gebruikers"] .gebruikers-filters>label:not(:has([data-ja-nee])) :is(select,.zoekkeuze){width:100%;max-width:none;flex:1;min-width:0}
[data-beheer-overzicht="gebruikers"] .overzicht-filterregel:has([data-ja-nee]){grid-column:1/-1;justify-content:flex-start}
[data-beheer-overzicht] .ja-nee-keuze{width:auto;flex:none}
.import-knoppen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
.import-knoppen>button{width:100%;height:100%;margin:0;white-space:normal;box-sizing:border-box}
.taal-bewerkdialog{width:min(600px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box}
[data-taalbeheer] td.taal-acties{position:relative;padding:0;width:88px;min-width:88px}
.taal-actieknoppen{position:absolute;inset:0;display:flex}
body .taal-actieknoppen>button{border-radius:0;flex:1;min-width:44px;min-height:44px;margin:0;padding:8px;display:flex;align-items:center;justify-content:center}
.taal-actieknoppen svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}
[data-taalbeheer] tbody tr{height:48px}
[data-taalbeheer] td:last-child input{width:20px;height:20px;margin:0;pointer-events:none}
.taal-verwijderdialog{width:min(720px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;box-sizing:border-box}
body th.tabel-actiekop{width:88px;min-width:88px;padding:0}
body :is(th.tabel-actueel,[data-taalbeheer] td:last-child){width:1%;white-space:nowrap;text-align:center}
.tabel-actiecel{position:relative;padding:0!important;width:calc(var(--aantal-acties,3)*44px);min-width:calc(var(--aantal-acties,3)*44px)}
.tabel-actieknoppen{position:absolute;inset:0;display:flex!important;gap:0!important;flex-wrap:nowrap!important}
body .tabel-actieknoppen>button{flex:1;min-width:44px;min-height:44px;margin:0;padding:8px;border-radius:0;display:flex;align-items:center;justify-content:center}
.tabel-actieknoppen :is(svg,img){width:22px;height:22px;object-fit:contain;pointer-events:none}
.tabel-actieknoppen svg{fill:none;stroke:currentColor;stroke-width:2}
[data-gebruikersoverzicht] tbody tr{height:48px}
@media(max-width:540px){[data-beheer-overzicht="gebruikers"] .gebruikers-filters{grid-template-columns:1fr}.import-knoppen{grid-template-columns:1fr}}

[data-gebruikersoverzicht] .tabel-actueel{width:1%;white-space:nowrap;text-align:center}


/* Reserveer boven een tabel ruimte voor de hulpbediening. */
.heeft-help:has(>table){padding-top:56px!important;box-sizing:border-box}
/* Beheertabellen: acties links, smalle statuskolommen rechts. */
[data-tabelstandaard] .tabel-vinkkop,[data-tabelstandaard] .tabel-vinkcel{width:42px!important;min-width:42px!important;max-width:70px;padding:4px!important;text-align:center;vertical-align:middle}
body [data-tabelstandaard] button.tabel-informatie{display:inline-flex;align-items:center;justify-content:center;width:28px;min-width:28px;height:28px;min-height:28px;padding:0;margin:0;border-radius:50%;font-family:Georgia,serif;font-size:19px;font-weight:bold}
.tabel-kolomuitleg{position:fixed;inset:auto;margin:0;max-width:240px;padding:12px;border:1px solid currentColor;border-radius:8px;background:var(--kleur-icoontekst,#fff);color:var(--vlak-tekst,#111);box-shadow:0 4px 16px #0004}
[data-tabelstandaard] .tabel-rijacties{white-space:nowrap;width:1%;padding:0!important;height:1px;vertical-align:middle}
[data-tabelstandaard] .tabel-rijacties>form{display:flex!important;flex-direction:row!important;align-items:stretch!important;height:100%;margin:0!important;gap:0}
body [data-tabelstandaard] .tabel-rijicoon{display:inline-flex;align-items:center;justify-content:center;width:44px;min-width:44px;min-height:44px;height:100%;border-radius:0;margin:0!important;padding:8px!important;vertical-align:middle}
.tabel-rijicoon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;pointer-events:none}
/* De hele pagina schuift; de onderbalk kleeft alleen binnen zijn eigen overzicht. */
.applicatie-inhoud:has([data-tabelstandaard]){display:block!important;overflow:auto!important}
.applicatie-inhoud:has([data-tabelstandaard])>.systeem-pagina{display:block!important;overflow:visible!important;min-height:100%;height:auto}
:is([data-beheer-overzicht],[data-gebruikersoverzicht],[data-chat-moderatie]){display:block!important;overflow:visible!important;max-height:none!important}
:is(.gebruikers-tabelvak,.wp-toestemmingen-scroll,.wp-lijst,.aanvraag-tabel,.eigen-links-tabel,.radio-tabel-scroll):has([data-tabelstandaard]){overflow:visible!important;max-height:none!important}
.tabel-onderbalk{position:sticky!important;bottom:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px;background:var(--kleur-icoontekst,#f4f4f4);color:var(--vlak-tekst,#111);border-top:1px solid var(--kleur-icoon,#aaa)}
.tabel-onderbalk>button{margin:0!important}
body .tabel-onderbalk>button{min-height:44px;min-width:145px;padding:8px 16px;font:inherit}
.tabel-onderbalk>p{order:2;flex-basis:100%;margin:0}.tabel-onderbalk>p:empty{display:none}
.tabel-onderbalk{left:0;box-sizing:border-box;max-width:100%}
.tabel-vastfilter{position:sticky!important;top:0;z-index:40;background:var(--kleur-icoontekst,#f0f0f0)}
.tabel-vastfilter .beheer-keuzebalk{position:static}
body [data-tabelstandaard] thead th{position:sticky;top:var(--tabel-kop-top,0px)!important;z-index:4}
.instellingen-kaart:has(>[data-tabelstandaard]){overflow:visible!important}
/* Gebruikersoverzicht: filter en tabel rechtstreeks in het hoofdblok. */
body [data-beheer-overzicht="gebruikers"]>.overzicht-compactfilter{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;padding:8px 0!important;border:0;border-radius:0;box-shadow:none;margin:0 0 8px!important}
body [data-beheer-overzicht="gebruikers"]>.overzicht-compactfilter>label{flex:0 1 250px;min-width:160px;width:auto;display:flex;align-items:center;gap:8px}
body [data-beheer-overzicht="gebruikers"]>.overzicht-compactfilter>.overzicht-filterregel:has([data-ja-nee]){flex:0 0 auto;min-width:0}
body [data-beheer-overzicht="gebruikers"]>.gebruikers-tabelvak{border:0;border-radius:0;padding:0;background:transparent}
[data-tabelstandaard] .wp-acties{display:flex;flex-wrap:nowrap;gap:0;align-items:stretch}

/* Vaste bedieningsblokken sluiten de vensterrand af, zonder doorschijnende inhoud. */
body .beheer-keuzebalk{top:-10px;background:var(--kleur-icoontekst,#f0f0f0);color:var(--vlak-tekst,#111);border-radius:10px;padding-top:16px!important;padding-bottom:8px!important}
body .beheer-keuzebalk label{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:12px}
body .beheer-keuzebalk select{width:auto;max-width:min(360px,70vw);flex:0 1 360px}
.chat-instellingenformulier .chat-enkele-optie,.chat-instellingenformulier>.chat-hoofdvlak:not(:last-of-type) .chat-dagenregel{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}
.chat-instellingenformulier .chat-enkele-optie input{width:auto}
.chat-instellingenformulier .chat-dagenregel input{text-align:center;width:7em;min-width:0}
.chat-instellingenformulier [data-chat-maximum]{text-align:center;width:7em;margin-left:calc(min(55%, 420px) + 12px);font-size:inherit}
.chat-instellingenformulier .chat-dagenregel{display:grid;grid-template-columns:minmax(0,min(55%,420px)) 7em;gap:12px;align-items:center}
.chat-instellingenformulier [data-chat-onderdeelgroepen]{padding-left:20px}
.chat-instellingenformulier [hidden]{display:none!important}
.chat-beheerpagina{display:block!important;min-width:0}.chat-beheerhelp{display:flex;justify-content:flex-end;min-height:38px;padding:3px 12px}.chat-beheerhelp.heeft-help{padding-right:12px}.chat-beheerhelp>.help-vraagteken{position:static;margin:0}
body .chat-beheerpagina .tabel-filter label{flex-wrap:wrap}

body .chat-instellingenformulier .chat-enkele-optie{display:flex!important;justify-content:center!important}
body .chat-instellingenformulier .chat-dagenregel{grid-template-columns:minmax(0,min(55%,420px)) 7em}
body .chat-instellingenformulier>.chat-hoofdvlak:not(:last-of-type) .chat-dagenregel{display:flex!important;justify-content:center!important}
body .chat-instellingenformulier [data-chat-maximum]{margin-top:-10px}
body [data-chat-moderatie] table{table-layout:auto}
body [data-chat-moderatie] :is(.tabel-vinkkop,.tabel-vinkcel){width:1%;white-space:nowrap}

body .chat-instellingenformulier .chat-termijnwaarde{display:flex;flex-direction:column;width:7em;align-items:center}
body .chat-instellingenformulier .chat-termijnwaarde input{width:100%;box-sizing:border-box}
body .chat-instellingenformulier .chat-termijnwaarde [data-chat-maximum]{margin:4px 0 0;width:100%;text-align:center;font-size:.85em}
body .chat-beheerpagina{overflow:visible}
