/* =====================================================================
   Bewuste aanpassingen op de overgenomen OTYS-styling.
   Staat los van otys.css, zodat een nieuwe extractie dit niet overschrijft.
   Elke afwijking staat ook in DEVIATIONS.md.
   ===================================================================== */

/* Vacaturedetail: de pagina scrollt als pagina, niet in een kader van 650px.
   De contactkolom blijft staan, zodat "Solliciteer direct" in beeld blijft. */
@media (min-width: 1000px) {
	.jobDetailLeft { height: auto !important; max-height: none !important; overflow: visible !important; }
	.jobDetailContent, .jobDetailContentFrame { height: auto !important; overflow: visible !important; }
	.jobDetailConsultant { position: sticky; top: calc(var(--ye-header-h, 76px) + 20px); align-self: flex-start; }
}
/* Omdat de pagina nu doorloopt, moet de achtergrond meelopen: vast en donker
   (de template zet hem inline op "no-repeat 50% 0", vandaar de hogere specificiteit). */
html body.vacancy-template-default {
	overflow: visible !important; height: auto !important;
	background: #111 url(../img/H3-wide.jpg) 50% 0 / cover no-repeat fixed !important;
}

/* Zoekbalk op de vacaturepagina's (was een Elementor-formulier) */
.ye-zoeker--balk { width: 100%; max-width: none; gap: 2px; }
.ye-zoeker--balk .ye-zoeker__veld--functie { flex: 0 0 calc(62.2% - 2px); }
.ye-zoeker--balk .ye-zoeker__veld--postcode { flex: 1 1 auto; }
.ye-zoeker--balk input { height: 56px; }
.ye-zoeker--balk .ye-zoeker__knop { flex: 0 0 56px; width: 56px; height: 56px; padding: 0; }
.ye-zoeker__knop--pijl { display: grid; place-items: center; }
.ye-zoeker__knop--pijl svg { width: 21px; height: 24px; fill: #fff; }

@media (max-width: 767px) {
	.ye-zoeker--balk .ye-zoeker__veld--functie, .ye-zoeker--balk .ye-zoeker__veld--postcode { flex: 1 1 100%; }
	.ye-zoeker--balk .ye-zoeker__knop { flex: 1 1 100%; width: auto; }
}

/* Vacaturepagina's hebben een eigen achtergrondfoto (stond bovenaan com.css). */
body:not(.vacancy-template-default) {
	background: #000 url(../img/vo-bg-2.jpg) center / cover no-repeat fixed;
}
