/**
 * Correctie voor een Kadence-eigenaardigheid: de breedte-berekening van
 * .alignfull/.alignwide houdt rekening met de scrollbar-breedte
 * (`calc(100vw - 15px)`), maar de bijbehorende margin-links/rechts-
 * berekening (`calc(50% - var(--global-vw, 100vw) / 2)`) deed dat NIET
 * — waardoor volledige-breedte-elementen 1-2px scheef kwamen te staan
 * (zichtbaar bv. tussen een content-blok en een footer erna).
 *
 * BIJGEWERKT: gebruikte eerst een VASTE aanname (15px/7.5px, "typische"
 * scrollbar-breedte) — bleek niet overal te kloppen: mobiele browsers
 * gebruiken doorgaans "overlay"-scrollbars die geen ruimte in de layout
 * innemen, dus daar hoort de correctie 0px te zijn. Met een vaste
 * 7,5px-aftrek schoot content op mobiel daardoor te ver naar links
 * (gemeld probleem). Nu gebruikt dit bestand een DYNAMISCH GEMETEN
 * waarde (`--carmel-scrollbar-width`, zie assets/js/shared/
 * scrollbar-width.js) — die geeft op mobiel vanzelf 0px, op een gewone
 * desktop-browser meestal 15-17px, precies kloppend per situatie zonder
 * aannames. De vaste 15px/7.5px blijven alleen nog staan als CSS-
 * fallback-waarde, voor het (zeer korte) moment vóórdat JavaScript de
 * echte waarde heeft kunnen meten.
 *
 * BEWUST STRUCTUREEL, NIET IN patterns.css: dit corrigeert Kadence's
 * eigen thema-berekening zelf, geen content-/pattern-keuze — vandaar een
 * apart bestand, geladen op dezelfde manier (sitebreed, ook in de
 * editor, zie includes/kadence-fixes.php).
 *
 * !important is hier bewust gebruikt (i.p.v. onze gebruikelijke
 * voorkeur voor hogere specificiteit) — deze exacte combinatie is al
 * getest en bevestigd werkend op een live site; een alternatieve,
 * ongeteste specificiteits-truc zou een risico zijn op zoiets
 * layout-kritieks als dit, zonder aantoonbaar voordeel.
 */
.alignfull,
.alignwide,
.entry-content .alignwide,
.entry-content .alignfull {
	width: calc(100vw - var(--carmel-scrollbar-width, 15px)) !important;
	margin-left: calc(50% - (var(--global-vw, 100vw) - var(--carmel-scrollbar-width, 15px) / 2) / 2) !important;
	margin-right: calc(50% - (var(--global-vw, 100vw) - var(--carmel-scrollbar-width, 15px) / 2) / 2) !important;
}


.kb-row-layout-wrap:has(.carmel-nieuws-overzicht){
	width:100%;
}

/* mega menu */

.megamenucarmel > div   {
	background-color:#fff;
}

@media(min-width:1025px){
	.megamenucarmel > div   {
    	border-radius:16px ;
    }
    .megamenucarmel{
      width:840px;
    }
}

.kb-button.wp-block-button__link{
	font-size:16px;
	line-height: 16px;
}

/* fix inner padding row */
@media(min-width:1024px){
	.entry-content-wrap .entry-content.single-content > .kb-row-layout-wrap.alignfull  > .kt-row-column-wrap{
		padding-left:0;
		padding-right:0;
	}
}

@media(max-width:1024px){
	.entry-content.single-content > .kb-row-layout-wrap:not(.ptrn-onderwijsaanbod) > .kt-row-column-wrap  {
		padding-left:0; 
		padding-right:0;
	}
}

.entry-content .wp-block-kadence-rowlayout.alignfull.cta-wide{
	margin-bottom:80px;
}


/**
 * Dunne lijn onder de navigatiebalk — voorkomt dat de balk visueel
 * "samensmelt" met een daaronder liggende, ook-witte section (gemelde
 * designer-feedback). `.site-main-header-wrap` is dezelfde, al eerder
 * bevestigde vaste Kadence-classname die ook header-fade.js gebruikt.
 */
.site-main-header-wrap .site-header-row-container-inner>.site-container {
	border-bottom: 1px solid rgba(0, 0, 0, 0.25);
	border-radius:8px;
}

.dropdown-nav-toggle::after {
    margin-left: 6px;
}

.wp-block-kadence-advancedbtn .kb-svg-icon-wrap.kb-svg-icon-wrap  svg {
	width: 12px;
	height: 12px;
	aspect-ratio: 1/1;
}
:root div.cta-pattern .kb-buttons-wrap.wp-block-kadence-advancedbtn .kb-button.kt-button, .kb-button.kt-btn-has-svg-true.kb-button.kt-btn-has-svg-true{
	gap:16px;
}

.drawer-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
 
.carmel-drawer-logo {
	max-height: var(--carmel-drawer-logo-height, 32px);
	max-width:129px;
	object-fit: contain;
	width: auto;
}
div#mobile-drawer .drawer-header{
	justify-content: space-between;
}