/* Adrem Occasions - huisstijl voor de hele site.
 *
 * Waarom hier en niet in "Extra CSS" van de site-editor: die tekst is via de
 * REST API niet te schrijven (WordPress maakt het stijlen-record pas aan bij de
 * eerste keer handmatig opslaan). Door het hier te zetten staat de huisstijl in
 * git, en is hij terug te draaien door de plugin te deactiveren.
 *
 * Het lettertype wordt door de site zelf geserveerd, niet door Google. Dat
 * scheelt de bezoeker een verzoek naar een derde partij met zijn IP-adres erin.
 */

/* ---------- Yantramanav, hetzelfde lettertype als de huidige site ---------- */

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('fonts/yantramanav-300-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('fonts/yantramanav-300-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('fonts/yantramanav-400-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('fonts/yantramanav-400-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('fonts/yantramanav-500-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('fonts/yantramanav-500-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('fonts/yantramanav-700-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Yantramanav';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('fonts/yantramanav-700-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Het thema hangt zijn hele typografie aan deze ene variabele, dus die
   omzetten volstaat: tekst en koppen gaan mee. */
:root,
body {
	--wp--preset--font-family--manrope: 'Yantramanav', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Yantramanav is smaller dan Manrope; iets meer regelhoogte leest prettiger. */
body {
	line-height: 1.6;
}

/* ---------- kleur en opmaak ---------- */

/* Adrem Occasions — huisstijl.
   Het roze #ED3089 komt van de huidige site. Het logo zelf is een fractie
   zachter (#DA4388); we houden ED3089 aan omdat klanten die kleur kennen. */

:root {
	--adrem-roze: #ED3089;
	--adrem-roze-donker: #D7136F;
	--adrem-roze-licht: #FDEBF4;
	--adrem-tekst: #2F2F2F;
}

/* Links en accenten in de huisstijl */
/* De uitzondering op [class*="adocc"] is belangrijk: de plugin regelt de kleur
   van zijn eigen knoppen en kaarten al. Zonder die uitzondering wint deze regel
   op specificiteit, en dan staat er roze tekst op een roze knop. */
.wp-block-post-content a:not(.wp-element-button):not([class*="adocc"]),
.wp-block-group a:not(.wp-element-button):not(.wp-block-navigation-item__content):not([class*="adocc"]) {
	color: var(--adrem-roze);
	text-underline-offset: 0.2em;
}

.wp-block-post-content a:not(.wp-element-button):not([class*="adocc"]):hover {
	color: var(--adrem-roze-donker);
}

/* De kopbalk blijft meelopen bij het scrollen, zoals op de huidige site.
   Zo is het telefoonnummer altijd bereikbaar. */
.adrem-kopbalk {
	position: sticky;
	top: 0;
	z-index: 100;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

.admin-bar .adrem-kopbalk {
	top: 32px;
}

/* Menu en knoppen netjes naast elkaar, ook als het krap wordt */
.adrem-kopbalk__rechts {
	gap: 1rem;
}

.adrem-kopbalk__knoppen .wp-block-button__link {
	font-size: 0.95rem;
	white-space: nowrap;
}

/* Op de homepage staat de kop al in het openingsbeeld; de paginatitel
   "Home" erboven is dan dubbelop. */
.home .wp-block-post-title {
	display: none;
}

/* Openingsbeeld: op een telefoon niet onnodig hoog */
@media (max-width: 700px) {
	.wp-block-cover {
		min-height: 46vh !important;
	}

	.adrem-kopbalk__knoppen .wp-block-button__link {
		padding-left: 0.8rem !important;
		padding-right: 0.8rem !important;
	}
}