/* Sore Haarkliniek — Theme CSS custom properties (Vamtam options) */

body {
	--vamtam-body-link-regular: #070807E6;
	--vamtam-body-link-visited: #070807E6;
	--vamtam-body-link-hover: #417572;
	--vamtam-body-link-active: #417572;
	--vamtam-input-border-radius: 24px 24px 24px 24px;
	--vamtam-input-border-color: #00000026;
	--vamtam-btn-text-color: #070807E6;
	--vamtam-btn-hover-text-color: #FFFFFF;
	--vamtam-btn-bg-color: #D5E8DF;
	--vamtam-btn-hover-bg-color: #417572;
	--vamtam-btn-border-radius: 24px 24px 24px 24px;
	--vamtam-site-max-width: 1280px;
	--vamtam-icon-symbol-oval: '\e900';
	--vamtam-icon-symbol: '\e901';
	--vamtam-icon-quote: '\e902';
	--vamtam-icon-percent: '\e903';
	--vamtam-icon-arrow-solid-bottom: '\e904';
	--vamtam-icon-arrow-solid-top: '\e905';
	--vamtam-icon-arrow-bottom: '\e906';
	--vamtam-icon-arrow-top: '\e907';
	--vamtam-icon-arrow-diagonal-bottom: '\e908';
	--vamtam-icon-arrow-diagonal-top: '\e909';
	--vamtam-icon-arrow-left: '\e90a';
	--vamtam-icon-arrow-right: '\e90b';
	--vamtam-icon-clock: '\e90c';
	--vamtam-icon-location: '\e90d';
	--vamtam-icon-mail: '\e90e';
	--vamtam-icon-shield: '\e910';
	--vamtam-icon-close: '\e91c';
	--vamtam-icon-plus: '\e920';
	--vamtam-icon-minus: '\e921';
	--vamtam-icon-mobile-nav: '\e91d';
	--vamtam-icon-individual: '\e911';
	--vamtam-icon-Facilities: '\e912';
	--vamtam-icon-care: '\e913';
	--vamtam-icon-pdf: '\e914';
	--vamtam-icon-gift: '\e915';
	--vamtam-loading-animation: url('/assets/images/loader-ring.gif');
}

/* Sore Haarkliniek — Brand design tokens */

:root {
	/* --- Colour palette --- */
	--sore-primary:          #054977;
	--sore-accent:           #6795AC;
	--sore-hover:            #417572;
	--sore-sage:             #D5E8DF;
	--sore-bg-light:         #F4FBFF;
	--sore-text:             #070807E6;
	--sore-text-muted:       #07080799;
	--sore-white:            #FFFFFF;
	--sore-white-glass:      #FFFFFF33;
	--sore-border:           #00000026;
	--sore-overlay:          #FFFFFFCC;

	/* --- Border radius --- */
	--sore-radius:           24px;
	--sore-radius-sm:        12px;
	--sore-radius-lg:        32px;

	/* --- Shadows --- */
	--sore-shadow-card:      0 2px 20px rgba(5, 73, 119, 0.07);
	--sore-shadow-btn:       0 4px 16px rgba(5, 73, 119, 0.15);

	/* --- Spacing scale --- */
	--sore-space-xs:         4px;
	--sore-space-sm:         8px;
	--sore-space-md:         16px;
	--sore-space-lg:         24px;
	--sore-space-xl:         40px;
	--sore-space-2xl:        64px;

	/* --- Section padding (vertical rhythm) --- */
	--sore-section-pad-lg:   80px;
	--sore-section-pad-md:   50px;
	--sore-section-pad-sm:   40px;

	/* --- Typography — font families --- */
	--sore-font-heading:     "Ovo", serif;
	--sore-font-body:        "Manrope", sans-serif;

	/* --- Typography — size scale (from Elementor global tokens) --- */
	--sore-text-body:        14px;
	--sore-text-sm:          12px;
	--sore-text-lg:          18px;
	--sore-text-h4:          24px;
	--sore-text-h3:          34px;
	--sore-text-h2:          48px;
	--sore-text-h1:          60px;

	/* --- Typography — line heights --- */
	--sore-lh-body:          1.6em;
	--sore-lh-heading:       1.1em;
	--sore-lh-h2:            1em;
	--sore-lh-h3:            1.2em;
	--sore-lh-h4:            1.5em;

	/* --- Layout --- */
	--sore-max-width:        1280px;
	--sore-content-width:    840px;
}
