/* Aanvullingen op theme.json: wat daar niet in te zetten is. */

.oh-demobalk {
	background: #14243B;
	color: #FFE3CF;
	font-size: 0.85rem;
	text-align: center;
	padding: 0.45rem 1rem;
}
.oh-demobalk a { color: #FFFFFF; text-decoration: underline; }

.oh-kop { border-bottom: 1px solid var(--wp--preset--color--lijn); }
.oh-logo { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.oh-logo img { width: 44px; height: 44px; }
.oh-logo .wp-block-site-title a { text-decoration: none; color: var(--wp--preset--color--nacht); }

.oh-hero { position: relative; overflow: hidden; }
.oh-hero .wp-block-cover__inner-container { max-width: 1200px; }
.oh-hero h1 { color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.35); max-width: 16ch; }
.oh-hero p { color: #fff; max-width: 46ch; text-shadow: 0 1px 10px rgba(0,0,0,.35); }

.oh-kaart {
	background: #fff;
	border: 1px solid var(--wp--preset--color--lijn);
	border-radius: 18px;
	overflow: hidden;
	height: 100%;
	transition: transform .18s ease, box-shadow .18s ease;
}
.oh-kaart:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(20,36,59,.12); }
.oh-kaart .wp-block-post-featured-image { margin: 0; }
.oh-kaart .wp-block-post-featured-image img { border-radius: 0; aspect-ratio: 4/3; object-fit: cover; }
.oh-kaart-tekst { padding: 1.1rem 1.25rem 1.4rem; }
.oh-kaart-tekst h3 { margin: 0 0 .35rem; font-size: 1.35rem; }
.oh-kaart-tekst h3 a { color: var(--wp--preset--color--nacht); text-decoration: none; }
.oh-label {
	display: inline-block;
	background: var(--wp--preset--color--zand);
	color: var(--wp--preset--color--oranje-donker);
	font-weight: 600;
	font-size: .85rem;
	border-radius: 999px;
	padding: .2rem .75rem;
	margin: 0;
}
.oh-prijs { font-weight: 700; color: var(--wp--preset--color--oranje-donker); margin-top: .5rem; }

.oh-usp .wp-block-column { background: var(--wp--preset--color--zand); border-radius: 18px; padding: 1.5rem; }
.oh-usp h3 { font-size: 1.25rem; margin-top: .25rem; }
.oh-usp-icoon { font-size: 1.8rem; line-height: 1; margin: 0; }

.oh-reiskader {
	background: var(--wp--preset--color--zand);
	border-radius: 18px;
	padding: 1.5rem;
	position: sticky;
	top: 1.5rem;
}
.oh-reiskader p { margin: .25rem 0; }

.buslinq-beschikbaarheid {
	display: inline-block;
	background: #E7F6EC;
	color: #1D6B3A;
	font-weight: 600;
	border-radius: 999px;
	padding: .25rem .85rem;
	margin: .15rem 0;
}
.buslinq-beschikbaarheid.buslinq-vol { background: #FDE8E8; color: #9B1C1C; }
.buslinq-formulier-vol { background: #FDE8E8; color: #9B1C1C; border-radius: 12px; padding: 1rem 1.25rem; font-weight: 600; }

/* Ninja Forms in de huisstijl. */
.nf-form-cont .nf-field-element input:not([type=checkbox]):not([type=radio]):not([type=submit]),
.nf-form-cont .nf-field-element select,
.nf-form-cont .nf-field-element textarea {
	border: 1px solid #D9C8B6;
	border-radius: 10px;
	padding: .65rem .8rem;
	font: inherit;
	background: #fff;
}
.nf-form-cont .nf-field-element input:focus,
.nf-form-cont .nf-field-element select:focus,
.nf-form-cont .nf-field-element textarea:focus { outline: 2px solid var(--wp--preset--color--oranje); border-color: transparent; }
.nf-form-cont input[type=submit], .nf-form-cont input[type=button].nf-next, .nf-form-cont input[type=button].nf-previous {
	background: var(--wp--preset--color--oranje);
	color: #fff;
	border: 0;
	border-radius: 999px;
	padding: .85rem 1.8rem;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}
.nf-form-cont input[type=submit]:hover { background: var(--wp--preset--color--oranje-donker); }
.nf-form-cont .nf-field-label label { font-weight: 600; }
.nf-form-cont h3 { margin-top: 1.5rem; }

.oh-voet { background: var(--wp--preset--color--nacht); color: #D8E0EC; }
.oh-voet a { color: #fff; }
.oh-voet h3 { color: #fff; font-size: 1.15rem; }
.oh-voet .wp-block-navigation a { color: #D8E0EC; }

@media (max-width: 781px) {
	.oh-reiskader { position: static; }
}

/* In een cover zet WordPress alle tekst wit; het label houdt zijn eigen kleur. */
.wp-block-cover .oh-label, .oh-hero .oh-label { color: var(--wp--preset--color--oranje-donker) !important; }

/* De kop van de homepage: alles links uitgelijnd, niet half gecentreerd door de lay-out. */
.oh-hero .wp-block-cover__inner-container > * { margin-left: 0 !important; margin-right: auto !important; }
.oh-hero .wp-block-cover__inner-container { margin-left: auto; margin-right: auto; width: 100%; }