/*
Theme Name: Van Santen de Hoog
Theme URI: https://vansantendehoog.nl/
Author: TriplePro Online Marketing
Author URI: https://triplepro.nl
Description: Blueprint Blocks thema voor Makelaardij van Santen de Hoog. Tokens hieronder, utilities en basisstijlen in assets/css/tailwind.css.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: vansantendehoog
*/

:root {
	/* Palette slots: the plugin reads these for the ACF colorpicker */
	--color-1: #244d57; /* primary, petrol */
	--color-2: #d1c2b0; /* secondary, sand */
	--color-3: #eb7d54; /* accent, orange */
	--color-4: #434343; /* text dark */
	--color-5: #212529; /* body text */
	--color-6: #f2f6f5; /* surface, secondary lighter */
	--color-7: #ffffff; /* white */
	--color-8: #84a59d; /* sage, taxatie form */
	--color-9: #f8f9fa; /* text light */
	--color-10: #55ad6f; /* status available */

	/* Semantic aliases */
	--brand: var(--color-1);
	--sand: var(--color-2);
	--accent: var(--color-3);
	--ink: var(--color-4);
	--body: var(--color-5);
	--surface: var(--color-6);

	/* Typography */
	--font-body: "Poppins", sans-serif;
	--font-whatsapp: Tahoma, Geneva, Verdana, sans-serif;

	/* Geometry */
	--radius: 0;
	--container: 1320px;
	--gutter: 12px;
}

/*
 * Third party markup that cannot carry utility classes: Fluent Forms and
 * Swiper internals. Unlayered on purpose so it beats the plugins' own CSS.
 * Values carried over from the original theme stylesheet.
 */
form input,
form textarea { border-radius: 0 !important; border: 0 !important; }
select,
input:not([type="checkbox"]):not([type="radio"]) { -webkit-appearance: none; }
.fluentform form { color: #ffffff !important; }
form .ff-el-form-check a { color: var(--color-2); }
form .ff-el-form-check a:hover { color: var(--color-3); }
.ff-btn.ff-btn-submit {
	display: inline-block;
	min-width: 200px;
	padding: 10px 30px;
	text-align: center;
	text-decoration: none;
	border-radius: 0;
}
form .ff-btn.ff-btn-submit {
	background-color: var(--color-3) !important;
	border: 1px solid var(--color-3) !important;
	font-size: 16px !important;
	border-radius: 0 !important;
}
form .ff-btn.ff-btn-submit:hover {
	color: #ffffff !important;
	border: 1px solid #ffffff !important;
	background-color: transparent !important;
}
.fluentform .ff-btn-submit::after { content: url("assets/img/arrow-forward.svg"); padding-left: 10px; }
.fluentform .ff-message-success { color: #ffffff !important; }
@media (max-width: 480px) { .ff-btn-submit { width: 100%; } }

.swiper { padding: 10px 4px; }