/*
Theme Name:     Devshub
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
*/


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

/* Variables */

:root {
	--pc-black: #000;
	--pc-white: #fff;
	--pc-transparent: #FFFFFF00;
	--light-gray: #F5F5F5;
	
	--spacing-desktop: 90px;
	--spacing-laptop: 70px;
	--spacing-tablet: 60x;
	--spacing-mobile: 40px;
	
	--gform-asterix-color: #3f3f3f;
	--gform-error-color: #ff0000;
	--gform-placeholder-color: #3f3f3f;
	--gform-border-color: #c5c5c5;
	--gform-active-border-color: #000;
	--gform-border-radius: 3px;
	--gform-font-size: var(--e-global-typography-text-font-size);

}

/*  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;
}

/****************************************** 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: #A9E722;
}

body .gform_wrapper .gform_body .gform_fields .gfield label.gfield_label.gform-field-label {
	color: #fff;
    font-size: 16px;
    line-height: 16px;
	font-weight: 400;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input::placeholder,
body .gform_wrapper .gform_body .gfield .ginput_container textarea::placeholder {
	font-family: var(--e-global-typography-primary-font-family);
	color: var(--gform-placeholder-color);
	font-size: var(--gform-font-size);
}

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: transparent;
    border: none;
    border-bottom: solid 1px #fff;
    border-radius: 0;
	color: #fff;
	padding: 0;
    font-size: 16px;
    line-height: 16px;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select option {
	color: #000;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select option:hover {
	background: var( --e-global-color-primary ) !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-bottom: solid 1px #A9E722;
	outline: none;
}

body .gform_wrapper .gform_footer input[type=submit] {
	font-family: var(--e-global-typography-primary-font-family) !important;
	background-color: var(--e-global-color-primary) !important;
	border-radius: 50px !important;
	font-size: 20px !important;
	line-height: 1 !important;
	font-weight: 400 !important;
	padding: 15px 20px 9px 20px !important;
}
body .gform_wrapper .gform_footer input[type=submit]:hover {
	background-color: var(--e-global-color-secondary) !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 .ginput_container input[type='file']::file-selector-button {
	background: #E3D8F9;
	border-radius: 10px;
	border: none;
}

/* pop up form */
body .elementor-location-popup .gform_wrapper .gform_body .gform_fields .gfield label.gfield_label.gform-field-label {
	color: #11052C;
}

body .elementor-location-popup .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']), 
body .elementor-location-popup .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea, 
body .elementor-location-popup .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select {
	color: #11052C;
	border-bottom: solid 1px #E3D8F9;
}

body .elementor-location-popup .gform_wrapper .gform_body .gform_fields .gfield .gfield_required.gfield_required_asterisk {
	color: #A9E722;
	font-size: 16px;
}

body .elementor-location-popup  .gform_wrapper .gform_footer input[type=submit] {
	font-size: 20px !important;
	padding: 12px 36px !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;
}

/*** Header ***/
header.elementor-sticky--active {
	transition: all ease .3s;
	backdrop-filter: blur(0px);
}

header.elementor-sticky--active .logo-sticky {
	display: none;
}

header.elementor-sticky--effects .logo-sticky {
	display: block;
}

header.elementor-sticky--effects .elementor-widget-theme-site-logo {
	display: none;
}

header.elementor-sticky--effects {
	background: #ffffffa3;
    backdrop-filter: blur(10px);
}

header.elementor-sticky--effects nav li a.elementor-item {
	color: #000 !important;
}

header.elementor-sticky--effects .cpel-switcher__lang * {
	color: #000;
}

header.elementor-sticky--active .e-con-inner {
	transition: all ease .2s;
	will-change: auto;
}

header.elementor-sticky--effects .e-con-inner {
	padding-top: 10px; 
	padding-bottom: 10px;
}

@media screen and (max-width: 1820px) {
	header .elementor-widget-polylang-language-switcher {
		right: 0 !important;
		position: relative !important;
		top: 0 !important;
	}
}

/*** Footer ***/
footer .elementor-widget-text-editor a {
	color: #11052C;
}

footer .elementor-widget-text-editor a:hover {
	color: #A9E722;
}

/*** Hero/banner section ***/
@media screen and (max-width: 600px) {
	.hero-section {
		margin-top: -116px;
	}
}

/*** Custom compare grid ***/
.compare-grid.e-grid {
    grid-template-columns: 40% [col-start] 30% [col-start] 30% [col-start];
}

.compare-grid.e-grid > .elementor-element > .elementor-widget-container {
    padding: 0 24px;
    display: flex;
    align-items: center;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(1n + 4) > .elementor-widget-container {
    border-top: solid 1px #E3D8F9;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(3n + 6)  > .elementor-widget-container {
    border-right: solid 1px #E3D8F9;
	justify-content: center;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(3n + 4) > .elementor-widget-container {
    border-left: solid 1px #E3D8F9;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(6) > .elementor-widget-container {
    border-radius: 0 10px 0 0;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(4) > .elementor-widget-container {
    border-radius: 10px 0 0 0;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(2) > .elementor-widget-container {
	border-top: solid 1px #6022E7;
	border-radius: 10px 10px 0 0;
}

.compare-grid.e-grid > .elementor-element:nth-of-type(3n - 1) > .elementor-widget-container {
    background: #F9F6FE;
	border-left: solid 1px #6022E7;
	border-right: solid 1px #6022E7;
	justify-content: center;
}

.compare-grid.e-grid .elementor-element:last-of-type > .elementor-widget-container {
    border-bottom: solid 1px #E3D8F9;
	border-radius: 0 0 10px 0;
}

.compare-grid.e-grid .elementor-element:nth-last-child(3) > .elementor-widget-container {
	border-bottom: solid 1px #E3D8F9;
	border-radius: 0 0 0 10px;
}

.compare-grid.e-grid .elementor-element:nth-last-child(2) > .elementor-widget-container {
	border-bottom: solid 1px #6022E7;
	border-radius: 0 0 10px 10px;
	transform: scaleY(1.2);
    transform-origin: top;
}

.compare-grid.e-grid .elementor-element:nth-last-child(2) > .elementor-widget-container .elementor-icon-wrapper {
	transform: scaleY(0.8);
}
.compare-grid.e-grid > .elementor-element > .elementor-widget-container .elementor-icon-wrapper {
	display: flex;
}

@media screen and (max-width: 767px) {
	.compare-grid.e-grid > .elementor-element > .elementor-widget-container  {
		padding: 0 12px;
	}
}

/*** Tabs ***/
.tab-stripes span.e-n-tab-title-text:not(:last-of-type)::after {
    content: " ";
    width: 25px;
    height: 1px;
    background: #E3D8F9;
    position: absolute;
    right: -38px;
}

/*** Remove title margins ***/
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-animated-headline .elementor-headline {
	margin: 0 !important;
}

/*** Sqaure containers ***/
.sqaure-box {
	aspect-ratio: 1/1;
}

.sqaure-box > .e-child {
	height: 100%;
}

/*** Job offer archive ***/
.term-bubble ul.elementor-post-info {
	gap: 5px;
}

.term-bubble .elementor-post-info__terms-list-item {
	padding: 7px 10px 7px 10px;
	border: solid 1px #6022E7;
	border-radius: 50px;
	display: inline-block !important;
}

.green-bubble.term-bubble .elementor-post-info__terms-list-item {
	border-color: #A9E722;
}

.count-bubble {
	position: absolute;
    font-size: 18px;
    aspect-ratio: 1 / 1;
    border: solid 1px #E3D8F9;
    border-radius: 50px;
    line-height: 1;
    padding: 8px;
    font-family: 'Karla';
	font-weight: 400;
    display: inline-flex;
    margin-left: 20px;
    align-items: center;
    justify-content: center;
}

.search-filter-field--control-type-sort {
	display: flex;
    flex-direction: row;
    align-items: center;
    gap: 20px;
}

.search-filter-field--control-type-sort .search-filter-label ,
.search-filter-field--control-type-sort .search-filter-component-combobox-base {
	width: auto;
}

.search-filter-field--control-type-sort .search-filter-component-combobox .search-filter-component-combobox__listbox-toggle::before,
.search-filter-component-combobox .search-filter-component-combobox__clear-selection {
	display: none;
}

.search-filter-component-range-slider__range-input-progress {
	--range-color: #6022E7;
}

.search-filter-component-range-slider__range-input-bar::before {
	opacity: 1;
	background: #F9F6FE;
}

.search-filter-component-range-slider__range-input::-webkit-slider-thumb,
.search-filter-component-range-slider__range-input--max::-webkit-slider-thumb,
.search-filter-component-range-slider__range-input--min::-moz-range-thumb,
.search-filter-component-range-slider__range-input--max::-moz-range-thumb {
	background: #6022E7 !important;
	border: 2px solid #6022E7 !important;
	outline: 2px solid #6022E7 !important;
	outline-offset: 8px !important;
}

/*** Single job offering ***/
.job-offers-template-default .elementor-widget-text-editor ul {
	list-style: circle;
}

.check-list ul li {
	list-style: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--%3E%3Cpath fill='%236022e7' d='M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32zM337 209L209 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L303 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z'/%3E%3C/svg%3E");
}

.check-list ul li::marker {
	font-size: 33x;
}

.job-offers-template-default .elementor-widget-text-editor ul li::marker {
	color: #6022E7; 
}

.job-offers-template-default  .term-bubble .elementor-post-info__terms-list-item {
	background: #E3D8F9;
	border-color: #E3D8F9;
	color: #6022E7 !important;
}

/*** Step section ***/
.step-section .e-con-inner .step-background.line-before::before {
    width: 5px;
    height: 100%;
    position: absolute;
    content: " ";
    background: linear-gradient(0deg, rgba(227, 216, 249, 1) 0%, rgba(227, 216, 249, 1) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0) 100%);
    left: 50%;
    background-size: 20px 20px;
    background-repeat: repeat;
    top: -60%;
    z-index: 5;
}

.step-section .e-con-inner .step-background::after {
    width: 5px;
    height: 105%;
    position: absolute;
    content: " ";
    background: linear-gradient(0deg, rgba(227,216,249,1) 0%, rgba(227,216,249,1) 50%, rgba(255,255,255,0) 50%, rgba(255,255,255,0) 100%);
    left: 50%;
    background-size: 20px 20px;
    background-repeat: repeat;
    top: 58%;
    z-index: 20;
}

.step-section .e-con-inner .step-background.last-step::after {
	z-index: 2;
	height: 65%; 
}

@media screen and (max-width: 1500px) {
	.step-section .e-con-inner .step-background::after  {
		top: 60%;
	}
}

@media screen and (max-width: 1024px) {
	.step-section .e-con-inner .step-background::after  {
		display: none;
	}
}

/*** Bold pink in text editor widget ***/
.pink-bold strong,
.pink-bold b {
	color: #E3D8F9;
}

.grecaptcha-badge {
	z-index: 9999 !important;
}