/*
Theme Name:     Pagecraft Child
Description:    Custom WordPress Child theme for theme "PageCraft"
Author:         Pagecraft
Author URI: 	https://pagecraft.nl
Tested up to:   6.2
Requires PHP:   8.2
Template:       pagecraft
Text Domain:    pagecraft-child
Version:        1.0.1
*/


/****************************************** GLOBAL ******************************************/

/* Variables */

:root {
	--pc-black: #000;
	--pc-white: #fff;
	--pc-transparent: #FFFFFF00;
	--light-gray: #F5F5F5;

	
	--spacing-desktop: 40px;
	--spacing-laptop: 30px;
	--spacing-tablet: 20px;
	--spacing-mobile: 20px;
	
	--gform-asterix-color: #3f3f3f;
	--gform-error-color: #ff0000;
	--gform-placeholder-color: #3f3f3f;
	--gform-border-color: #c5c5c5;
	--gform-label: #226290;
	--gform-active-border-color: #000;
	--gform-font-size: var(--e-global-typography-text-font-size);
	--gform-checkbox-size: 20px;

}

/*  Variable COLORS - globals form Elementor page builder
	var(--e-global-color-primary);
	var(--e-global-color-secondary);
	var(--e-global-color-accent);
	var(--e-global-color-text);
	var(--e-global-color-584f52f) // Globale kleur 'Zwart'
	var(--e-global-color-43f9ea8) // Globale kleur 'Wit'
*/

/*  Variable Fonts - globals form Elementor page builder
	var(--e-global-typography-primary-font-family);
	var(--e-global-typography-secondary-font-family);
*/
/*  Default Elementor colors from plugin
	var(--e-a-color-black);
	var(--e-a-color-white);
*/

/**********    Disable default styling    ***************/
ol, ul {
	padding-left: 20px;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

.elementor-widget-text-editor p:first-of-type {
    margin-top: 0;
}

img {
	object-fit: cover;
}

/* Bring highlighted hotspot to front */
.e-hotspot.highlighted-hotspot {
	z-index: 2;
}

/* Change highlighted hotspot color */
.highlighted-hotspot > div {
	background-color: #f7b30b !important;
	color: white;
}

/* Change hotspot pulse color */
.e-hotspot__button:before {
    background-color: var(--pc-white) !important;
}

/* Change highlighted hotspot pulse color */ 
.highlighted-hotspot .e-hotspot__button:before {
    background-color: var(--e-global-color-secondary) !important;
}

.elementor-widget-hotspot {
	--hotspot-min-width: max-content !important;
	--hotspot-padding: 0px 20px !important;
}


/****************************************** Spacing classes *****************************************/
.padding-section {
	padding-top: var(--spacing-desktop);
	padding-bottom: var(--spacing-desktop);
}

.padding-top {
	padding-top: var(--spacing-desktop);
}

.padding-bottom {
	padding-bottom: var(--spacing-desktop);
}

@media screen and (min-width: 1160px) {
	.padding-left {
		padding-left: calc((100vw - var(--content-width)) / 2);
	}
	
	.padding-right {
		padding-right: calc((100vw - var(--content-width)) / 2);
	}
}

@media screen and (max-width: 1024px) {
	.padding-section {
		padding-top: var(--spacing-laptop);
		padding-bottom: var(--spacing-laptop);
	}

	.padding-top {
		padding-top: var(--spacing-laptop);
	}

	.padding-bottom {
		padding-bottom: var(--spacing-laptop);
	}
}


@media screen and (max-width: 767px) {
	.padding-section {
		padding-top: var(--spacing-tablet);
		padding-bottom: var(--spacing-tablet);
	}

	.padding-top {
		padding-top: var(--spacing-tablet);
	}

	.padding-bottom {
		padding-bottom: var(--spacing-tablet);
	}
}

@media screen and (max-width: 500px) {
	.padding-section {
		padding-top: var(--spacing-mobile);
		padding-bottom: var(--spacing-mobile);
	}

	.padding-top {
		padding-top: var(--spacing-mobile);
	}

	.padding-bottom {
		padding-bottom: var(--spacing-mobile);
	}
}

/****************************************** Gravity form style ******************************************/
/*** https://docs.gravityforms.com/css-targeting-examples/ ***/
body .gform_heading .gform_required_legend,
body .gform_footer.top_label .gform-loader {
	display: none;
}

body .gform_wrapper .gform_body .gform_fields .gfield .gfield_required.gfield_required_asterisk {
	color: var(--gform-label);
	font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: var(--e-global-typography-text-letter-spacing);
}


body input::placeholder,
body textarea::placeholder,
body .gform-datepicker::placeholder {
	font-family: var(--e-global-typography-text-font-family), Sans-serif !important;
	color: var(--gform-label) !important;
	font-size: 15px !important;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']),
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select {
	box-shadow: none;
	background-color: var(--e-global-color-fa93137);//#389ABC30;
    border: 0px;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='radio']),
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select {
    border-radius: 0px;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input[type='radio'],
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input[type='checkbox'] {
	background-color: #F3912030 !important;
}


body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']):focus,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea:focus,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select:focus,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']):active,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea:active,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select:active {
/* 	box-shadow: none; */
	border: solid 1px var(--gform-active-border-color);
	outline: none;
}

body .gform_wrapper .gform_body .gform_fields .gfield label,
body .gform_wrapper .gform_body .gform_fields .gfield legend {
	color: var(--e-global-color-primary);
	font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: var(--e-global-typography-text-letter-spacing);
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container_checkbox label,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container_radio label {
	font-weight: 400 !important;
}

body .gform_wrapper .gform_body .gform_fields input.gfield-choice-input::before {
	background-color: var(--e-global-color-secondary) !important;
	width: 20px;
    height: 20px;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container .gchoice {
	align-items: center;
}




body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container .gchoice a:hover {
	transition: all ease .2s;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container .gchoice a:hover {
	color: var(--e-global-color-secondary) !important;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container .gchoice input.gfield-choice-input::before {
	color: var(--e-global-color-secondary) !important;
	font-size: var(--gform-checkbox-size) !important;
}

body .gform_wrapper .gform_footer input[type=submit] {
	font-family: var(--e-global-typography-primary-font-family);
	background-color: var(--e-global-color-secondary) !important;
	color: var(--pc-white) !important;
	font-size: 17px !important;
	border-radius: 50px 50px 50px 50px !important;
    padding: 20px 40px 20px 40px !important;
}

body .gform_wrapper .gform_footer input[type=submit]:hover {
	background-color: var(--e-global-color-primary) !important;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container label.error {
	color: var(--gform-error-color);
}

body .gform_wrapper .gform_body .gform_fields .gfield--type-section {
	border: 0px !important;
	padding: 10px 15px !important;
	background-color: var(--e-global-color-secondary) !important;
	color: var(--pc-white) !important;
}

body .gform_wrapper .gform_body .gform_fields .gfield--type-section .gsection_title {
	font-family: var(--e-global-typography-primary-font-family);
	font-size: 22px;
	margin: 0px  !important;
}


/* Swiper center align*/
.swiper-slide {
	display: flex !important;
	justify-content: center !important;
}

/* Elementor Cart Button*/
.elementor-menu-cart__toggle_button {
	background-color: var(--pc-transparent) !important;
	padding: 0 !important;
}

/* WooCommerce Buttons */

.woocommerce .button {
	color: var(--pc-white) !important;
	background-color: var(--e-global-color-primary) !important;
	transition: all ease .2s;
}

.woocommerce .button:hover {
	color: var(--pc-white) !important;
	background-color: var(--e-global-color-accent) !important;
}

/* WooCommerce My Account */

.woocommerce-MyAccount-content {
	font-family: var(--e-global-typography-text-font-family);
}

.woocommerce-MyAccount-content p {
	font-size: var(--e-global-typography-text-font-size);
}

.woocommerce-MyAccount-navigation ul,
.woocommerce-MyAccount-content-wrapper > p:first-of-type {
	margin-block-start: 0 !important;
}

.woocommerce-MyAccount-content-wrapper p a,
p.woocommerce-LostPassword.lost_password a {
	color: var(--e-global-color-accent) !important;
}

.woocommerce-MyAccount-content-wrapper p a:hover,
p.woocommerce-LostPassword.lost_password a:hover {
	color: var(--e-global-color-primary) !important;
}

/* Nav menu */

.nav-menu a {
	line-height: 1.1em !important;
}

header .elementor-sticky--effects {
	background-color: #00000050;
	backdrop-filter: blur(10px);
	box-shadow: 0px 0px 5px #00000014;
	transition: all ease .2s;
}

header .elementor-sticky--effects {
	padding-top: 0px;
	padding-bottom: 0px;
}

header .elementor-widget-theme-site-logo img {
	transition: all ease .3s;
}

header .elementor-sticky--effects .elementor-widget-theme-site-logo img {
	width: 160px !important;
}