/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* ==========================================================================
   GTranslate zwevende taalswitcher - afgestemd op de huisstijl
   Selectors met #gt_float_wrapper om de inline plugin-CSS te overschrijven.
   Verwijder dit blok om terug te gaan naar de standaardstijl.
   ========================================================================== */

#gt_float_wrapper {
	bottom: 24px !important;
	left: 24px !important;
}

#gt_float_wrapper .gt_float_switcher {
	font-family: "Mona Sans", "Karla", sans-serif;
	font-size: 14px;
	line-height: 1;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
	overflow: visible;
	transition: transform .3s ease;
}

#gt_float_wrapper .gt_float_switcher:hover {
	transform: translateY(-2px);
}

/* --- gesloten knop --- */

#gt_float_wrapper .gt_float_switcher .gt-selected {
	background-color: #16351a;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(18, 36, 21, .22);
	transition: background-color .25s ease;
}

#gt_float_wrapper .gt_float_switcher:hover .gt-selected {
	background-color: #2c5f2a;
}

#gt_float_wrapper .gt_float_switcher .gt-selected .gt-current-lang {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 10px 15px;
	color: #ede3ca;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
}

#gt_float_wrapper .gt_float_switcher .gt-selected .gt-current-lang span.gt-lang-code {
	top: 0;
}

#gt_float_wrapper .gt_float_switcher img {
	width: 22px;
	height: 22px;
	margin: 0;
	border-radius: 50%;
	object-fit: cover;
	box-shadow: 0 0 0 1px rgba(237, 227, 202, .4);
}

/* pijltje in creme in plaats van grijs */
#gt_float_wrapper .gt_float_switcher .gt-selected .gt-current-lang span.gt_float_switcher-arrow {
	width: 12px;
	height: 12px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 285 285'><path d='M282 76.5l-14.2-14.3a9 9 0 0 0-13.1 0L142.5 174.4 30.3 62.2a9 9 0 0 0-13.2 0L3 76.5a9 9 0 0 0 0 13.1l133 133a9 9 0 0 0 13.1 0l133-133a9 9 0 0 0 0-13z' style='fill:%23ede3ca'/></svg>");
	background-size: 10px;
}

/* --- uitklappaneel --- */

#gt_float_wrapper .gt_float_switcher .gt_options {
	background: #f6f1e3;
	border: 1px solid #cfdcc9;
	border-radius: 16px;
	margin-bottom: 10px;
	padding: 6px;
	max-height: 260px;
	box-shadow: 0 10px 28px rgba(18, 36, 21, .18);
}

#gt_float_wrapper .gt_float_switcher .gt_options a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	border-radius: 10px;
	color: #16351a;
	font-weight: 500;
	text-transform: none;
	transition: background-color .2s ease, color .2s ease;
}

#gt_float_wrapper .gt_float_switcher .gt_options a:hover {
	background: #cfdcc9;
	color: #16351a;
}

#gt_float_wrapper .gt_float_switcher .gt_options a img {
	box-shadow: 0 0 0 1px rgba(18, 36, 21, .14);
}

#gt_float_wrapper .gt_float_switcher .gt_options::-webkit-scrollbar {
	width: 6px;
}

#gt_float_wrapper .gt_float_switcher .gt_options::-webkit-scrollbar-track {
	background: transparent;
}

#gt_float_wrapper .gt_float_switcher .gt_options::-webkit-scrollbar-thumb {
	background-color: #9bb194;
	border-radius: 3px;
}

@media (max-width: 767px) {

	#gt_float_wrapper {
		bottom: 16px !important;
		left: 16px !important;
	}

	#gt_float_wrapper .gt_float_switcher {
		font-size: 13px;
	}

	#gt_float_wrapper .gt_float_switcher .gt-selected .gt-current-lang {
		padding: 9px 13px;
	}
}

@media (prefers-reduced-motion: reduce) {

	#gt_float_wrapper .gt_float_switcher,
	#gt_float_wrapper .gt_float_switcher:hover {
		transition: none;
		transform: none;
	}
}