/*
Theme Name: Hello Elementor Child theme Lock Security
Theme URI: https://buro86.be/
Description: Child theme van Hello Elementor voor lock-security.be. Bevat al het maatwerk van de site (PHP in inc/, JavaScript in assets/js/).
Author: Buro 86 webdesign
Author URI: https://buro86.be/
Template: hello-elementor
Version: 2.1.2
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: hello-elementor-child
*/

/* B86-FIX: knop om foto's te kiezen in het uploadveld van het contactformulier (pagina Contact), in de huisstijl.
   Het Form-widget heeft geen stijl voor de bestandsknop, en in Custom CSS van Elementor kan deze regel niet:
   Elementor vervangt daar het woord selector, ook binnen ::file-selector-button. De tekst op de knop komt van de browser. */
.b86-form .elementor-upload-field {
	cursor: pointer;
}
.b86-form .elementor-upload-field::file-selector-button {
	margin: 0 12px 0 0;
	padding: 6px 14px;
	border: 1px solid var(--e-global-color-borderstrong);
	border-radius: 6px;
	background: var(--e-global-color-blue50);
	color: var(--e-global-color-primary);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, border-color .2s;
}
.b86-form .elementor-upload-field:hover::file-selector-button {
	background: var(--e-global-color-blue100);
	border-color: var(--e-global-color-primary);
}

/* B86-FIX: knop en statustekst van het uploadveld in de taal van de pagina (assets/js/b86-upload.js, 15 oktober 2026).
   De browser schrijft die tekst in zijn eigen taal. Het script legt er een eigen laag over, in dezelfde stijl als
   de knop hierboven; het echte veld blijft eronder liggen en vangt de klikken op. Zonder script geldt enkel het blok hierboven. */
.b86-form .b86-upload-groep {
	position: relative;
}
.b86-form .elementor-upload-field.b86-upload-klaar {
	color: transparent !important; /* !important: de veldkleur uit Theme Style heeft een sterkere selector. */
}
.b86-form .elementor-upload-field.b86-upload-klaar::file-selector-button {
	visibility: hidden; /* Houdt zijn plaats, zodat het veld even hoog blijft. */
	opacity: 0;
}
.b86-form .b86-upload {
	position: absolute;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	overflow: hidden;
	pointer-events: none;
}
.b86-form .b86-upload__knop {
	flex: none;
	margin: 0 12px 0 0;
	padding: 6px 14px;
	border: 1px solid var(--e-global-color-borderstrong);
	border-radius: 6px;
	background: var(--e-global-color-blue50);
	color: var(--e-global-color-primary);
	font-weight: 600;
	white-space: nowrap;
	transition: background .2s, border-color .2s;
}
.b86-form .b86-upload-klaar:hover + .b86-upload .b86-upload__knop {
	background: var(--e-global-color-blue100);
	border-color: var(--e-global-color-primary);
}
.b86-form .b86-upload__status {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}