/* Datingbutton — aanvullende stijlen bovenop de gecompileerde Tailwind-utilities. */

html { scroll-behavior: smooth; }

body {
	background-color: #FFFBF5;
	color: #271717;
	font-family: 'Be Vietnam Pro', sans-serif;
	font-size: 16px;
	line-height: 1.5;
}

.material-symbols-outlined {
	font-family: 'Material Symbols Outlined', 'Material Icons', sans-serif;
	font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
	-webkit-font-feature-settings: 'liga';
	font-feature-settings: 'liga';
	white-space: nowrap;
	overflow: hidden;
	max-width: 2em;
	max-height: 2em;
}

.soft-card-shadow { box-shadow: 0px 10px 30px rgba(45, 35, 35, 0.05); }

.dating-button-primary { box-shadow: 0px 4px 0px #E03E4D; }
.dating-button-primary:active { transform: translateY(2px); box-shadow: 0px 2px 0px #E03E4D; }

/* Afbeeldingen die hun container vullen (hero, kaarten, product) */
.db-img-fill { margin: 0; width: 100%; height: 100%; }
.db-img-fill img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Knoppen (core/button-blokken; tekst en link bewerkbaar in de editor) */
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 1rem; }
.wp-block-buttons.justify-center { justify-content: center; }
.db-hero-buttons { flex-direction: column; }
@media (min-width: 640px) { .db-hero-buttons { flex-direction: row; } }

.wp-block-button a.wp-block-button__link {
	border: none;
	text-decoration: none;
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-weight: 700;
	border-radius: 9999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	transition: all 0.15s ease;
	cursor: pointer;
}

.db-btn-primary a.wp-block-button__link {
	background-color: #b70f30;
	color: #ffffff;
	padding: 1rem 2rem;
	font-size: 24px;
	line-height: 1.3;
	box-shadow: 0px 4px 0px #E03E4D;
}
.db-btn-primary a.wp-block-button__link:hover { transform: scale(1.02); color: #ffffff; }
.db-btn-primary a.wp-block-button__link:active { transform: translateY(2px); box-shadow: 0px 2px 0px #E03E4D; }

.db-icon-cart a.wp-block-button__link::after {
	font-family: 'Material Symbols Outlined', 'Material Icons', sans-serif;
	content: 'shopping_cart';
	font-weight: 400;
	font-size: 24px;
	-webkit-font-feature-settings: 'liga';
	font-feature-settings: 'liga';
	white-space: nowrap;
	overflow: hidden;
	max-width: 1.2em;
	max-height: 1.2em;
}

.db-btn-outline a.wp-block-button__link {
	background: transparent;
	border: 2px solid #e3bebd;
	color: #271717;
	padding: 1rem 2rem;
	font-size: 24px;
	line-height: 1.3;
}
.db-btn-outline a.wp-block-button__link:hover { background-color: #ffe9e8; color: #271717; }

.db-btn-cta a.wp-block-button__link {
	background-color: #fff8f7;
	color: #b70f30;
	padding: 1.25rem 2.5rem;
	font-size: 24px;
	line-height: 1.3;
	gap: 0.75rem;
	box-shadow: 0px 4px 0px #E03E4D, 0 20px 25px -5px rgba(0, 0, 0, 0.1);
}
.db-btn-cta a.wp-block-button__link::after {
	font-family: 'Material Symbols Outlined', 'Material Icons', sans-serif;
	content: 'arrow_forward';
	font-weight: 400;
	font-size: 24px;
	-webkit-font-feature-settings: 'liga';
	font-feature-settings: 'liga';
	white-space: nowrap;
	overflow: hidden;
	max-width: 1.2em;
	max-height: 1.2em;
}
.db-btn-cta a.wp-block-button__link:hover { transform: scale(1.05); color: #b70f30; }

/* Lange tekstpagina's (privacy policy, over ons) — nette typografie zonder
   utility-classes op elk blok */
.db-prose h2 {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
	margin: 2rem 0 0.75rem;
	color: #271717;
}
.db-prose h3 {
	font-family: 'Plus Jakarta Sans', sans-serif;
	font-size: 18px;
	font-weight: 700;
	margin: 1.5rem 0 0.5rem;
	color: #271717;
}
.db-prose p { margin-bottom: 1rem; color: #5b4040; }
.db-prose ul, .db-prose ol { list-style: disc; padding-left: 1.5rem; margin-bottom: 1rem; color: #5b4040; }
.db-prose ol { list-style: decimal; }
.db-prose li { margin-bottom: 0.5rem; }
.db-prose a { color: #b70f30; text-decoration: underline; }
.db-prose strong { color: #271717; }

/* Formulier (bestelpagina) */
input:focus, select:focus { outline: none; border-color: #b70f30 !important; box-shadow: none; }

/* Tweetaligheid: elementen met data-lang tonen alleen in de actieve taal
   (body krijgt class db-en op /en/-pagina's via functions.php) */
body:not(.db-en) [data-lang="en"] { display: none !important; }
body.db-en [data-lang="nl"] { display: none !important; }

/* WordPress-admin-balk niet over de fixed nav laten vallen */
body.admin-bar nav.fixed.top-0 { top: 32px; }
@media (max-width: 782px) { body.admin-bar nav.fixed.top-0 { top: 46px; } }