/* Resets + CSS custom properties. Twee gescheiden groepen (zie Admin > Ontwerp): waardes
   worden per site overschreven via een inline <style> die AP_Frontend_Assets op basis van de
   instellingen genereert. */

:root {
	/* Ontwerp — instelbaar door de eigenaar (Admin > Ontwerp). */
	--ap-button-color: #25d366;
	--ap-icon-color: #76624d;
	--ap-field-border-color: #d9d9d9;
	--ap-background-color: #ffffff;
	--ap-page-background-color: #ffffff;
	--ap-background-image: none;
	--ap-title-color: #1a1a1a;
	--ap-intro-color: #6e6e6e;
	--ap-label-color: #1a1a1a;
	--ap-placeholder-color: #9a9a9a;
	--ap-select-text-color: #1a1a1a;
	--ap-info-color: #6e6e6e;

	/* Vast — niet (nog) instelbaar in de admin. */
	--ap-text-color: #1a1a1a;
	--ap-font-family: system-ui, sans-serif;
}

/* De achtergrondafbeelding hoort bij de pagina, niet bij de formulierkaart zelf (die blijft
   --ap-background-color, meestal wit) — zo blijft de kaart leesbaar boven een textuur/foto. */
/* html body (specifiek genoeg) omdat een thema met `body { background: … }` (shorthand, later geladen) anders de afbeelding wegzet. */
html body {
	background-color: var( --ap-page-background-color );
	background-image: var( --ap-background-image );
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

.ap-form,
.ap-floating-widget {
	font-family: var(--ap-font-family);
	color: var(--ap-text-color);
	box-sizing: border-box;
}

.ap-form *,
.ap-floating-widget * {
	box-sizing: inherit;
}