.wp-block-navigation-item__label {
    text-transform: uppercase;
}

:root :where(.wp-block-navigation a:where(:not(.wp-element-button)):hover) {
	text-decoration: none;
	font-weight: 400;
}

.transparante-groep {
    background-color: transparent !important; /* Maakt de achtergrond transparant */
    padding: 0; /* Optioneel: Verwijder extra ruimte binnen de groep */
}

.transheader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px; /* Stel je gewenste hoogte in */
  background-color: #00000000;
  z-index: 9999;
  will-change: background-color;
  transition: background-color 0.5s ease-in-out;
}

.transheader.scrolled {
    background-color: #000000b0;
}

.stickyheader {
	background-color: #00000000;
	will-change: background-color;
	transition: background-color 0.5s ease-in-out;
}

.stickyheader.scrolled {
    background-color: #000000b0;
}

/* Spectra genereert de layout/marge-CSS van dit Container-block normaal per pagina
   (uag-css-<post-ID>.css). Op pagina's zonder eigen post-ID, zoals het events-archief
   (template "Kalender weergaven"), wordt dat bestand nooit geladen en valt de header
   terug op kale HTML: geen 6% marge en geen flex-layout (logo/nav onder elkaar i.p.v.
   naast elkaar). Onderstaande regels zetten dat sitewide vast, ongeacht paginatype. */
.stickyheader {
	display: flex;
	margin-left: 6%;
	margin-right: 6%;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
}

@media only screen and (max-width: 976px) {
	.stickyheader {
		margin-left: 6px;
		margin-right: 6px;
	}
}

@media only screen and (max-width: 767px) {
	.stickyheader {
		margin-left: 6px;
		margin-right: 6px;
		flex-wrap: wrap;
	}
}


/* Zorg ervoor dat de header verschuift wanneer de admin bar zichtbaar is */
body.admin-bar .transheader {
    top: 32px; /* Dit is de hoogte van de admin bar */
}

.text-shadow {
    text-shadow: 1px 1px 3px #0009;
}

.home-fixed-text {
    color: white;
	z-index: 2;
	flex: 0 auto;
	align-self: flex-end;
	text-shadow: 1px 1px 3px #0009;
	font-weight: 200;
}

.home-slider{
	flex-direction: row;
	align-items: stretch;
	width: 100vw;
	height: 100vh;
	padding: 0 6vw 1vw;
	display: flex;
	position: relative;
}

.home-slider > div:nth-child(2){
	z-index: 2;
	background-color: #0000;
	height: auto;
	position: absolute;
	inset: 0%;
	top: 0;
}

.tags_list {
	display: none;
}

.kf-slider {
	height: 100vh;
}

input, textarea, select {
    background-color: #2d2d2d;  /* Donkergrijs */
    color: #ffffff;             /* Witte tekst */
    border: 1px solid #555555;  /* Iets lichtere rand */
    border-radius: 4px;         /* Afgeronde hoeken */
    padding: 8px;
}

input::placeholder {
    color: #aaaaaa;  /* Lichtere tekst voor placeholder */
}

.wp-block-button__link {
    border-radius: 9999px; /* Volledig afgeronde knoppen */
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
  background-color:#000 !important;
}

.wp-block-navigation-item__label {
    font-weight: 300;
    transition: text-shadow 0.1s ease;
}

.wp-block-navigation-item__content:hover .wp-block-navigation-item__label {
    font-weight: 300;
    text-shadow:
        0.5px 0 0 currentColor,
        -0.5px 0 0 currentColor;
}
