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

/**

donkerpaars: #422563
 
 * **/

.grecaptcha-badge {
    visibility: hidden !important;
}

.elementskit-box-footer i.fas.fa-arrow-alt-circle-right {
    margin-left: 7px;
}

/** Tooltip z-index fix voor de modal **/
.v-popper__popper {
    z-index: 999999 !important;
}



.subfooter p {
    padding-bottom: 0;
    margin-bottom: 0;
}

#proplanner-plugin-wrapper .category-description-container {
    height: auto;
    overflow-y: auto;
    padding-bottom: 21px;
}


/** link hover fade-out oplossen **/
.elementor-kit-777 .elementor-widget-text-editor a, 
.elementor-kit-777 .elementor-tab-content a {
    text-decoration-line: underline !important;
    text-decoration-color: #422563 !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 4px !important;
    transition: text-decoration-color 0.2s ease-in-out !important;
}
.elementor-kit-777 .elementor-widget-text-editor a:hover, 
.elementor-kit-777 .elementor-tab-content a:hover {
    text-decoration-color: transparent !important;
}
.elementor-kit-777 .white.elementor-widget-text-editor a {
    text-decoration-color: white !important;
    color: white !important;
}
.elementor-kit-777 .white.elementor-widget-text-editor a:hover {
	    text-decoration-color: transparent !important;
}


/** footer links resetten **/
.elementor-kit-777  footer .elementor-widget-text-editor a,
.elementor-kit-777 footer .elementor-tab-content a,
.elementor-kit-777 footer .elementor-widget-text-editor a:hover,
.elementor-kit-777 footer .elementor-tab-content a:hover {
    text-decoration-line: revert !important;
    text-decoration-color: revert !important;
    text-decoration-thickness: 0 !important;
    text-underline-offset: revert !important;
    transition: revert !important;
	text-decoration: none !important;
}


/** Chevron perfect verticaal uitlijnen met eerste regel tekst **/
.elementor-nav-menu--layout-vertical .elementor-nav-menu > li > a {
    align-items: flex-start !important; 
}

.elementor-nav-menu--layout-vertical .elementor-nav-menu > li > a::before {
    content: '\276F';
    color: #422563;
    margin-right: 12px;
    margin-top: 0;
    font-size: 0.9em;
    font-weight: normal;
    display: inline-block !important;
    position: relative !important;
    opacity: 1 !important;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.elementor-nav-menu--layout-vertical .elementor-nav-menu > li > a:hover::before {
    transform: translateX(4px);
}

.elementor-nav-menu--layout-vertical  .elementor-nav-menu a, .elementor-nav-menu--layout-vertical  .elementor-nav-menu a:hover   {
    padding: 13px 4px;
}


.ekit-google-map h4 {
	color: #422563 !important;
}

.mybanner .e-con-full {
    position: relative;
    isolation: isolate; 
}


/** eerder blur effect: te subtiel en teveel naar rechts 

.mybanner .e-con-full::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    -webkit-backdrop-filter: blur(15px);
    backdrop-filter: blur(15px);
    -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
    mask-image: radial-gradient(ellipse at center, black 44%, transparent 80%);
}

**/

.mybanner .e-con-full::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    
    /* Iets meer blur voor betere leesbaarheid (optioneel, test wat mooi is) */
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    
    /* Centrum op 22% (horizontaal) en 50% (verticaal). 
       Zwarte (vaste) gebied is groter (60%) voor een breder effect */
    -webkit-mask-image: radial-gradient(ellipse at 22% 50%, black 60%, transparent 90%);
    mask-image: radial-gradient(ellipse at 22% 50%, black 60%, transparent 90%);
}


/* =============================================
   .tabsysteem — Elementor Tabs → ElementsKit stijl
   ============================================= */

/* 1. Wrapper achtergrond + border-radius */
.tabsysteem .elementor-tabs, .tabsysteem .e-n-tabs {
    background: #ede8f5;
    border-radius: 20px;
    padding: 50px 70px;
    display: flex;
    flex-direction: row;
    gap: 30px;
    align-items: flex-start;
}

/* 2. Nav kolom: tabs links */
.tabsysteem .elementor-tabs-wrapper,
.tabsysteem .e-n-tabs-heading {
  display: flex !important;
  flex-direction: column !important;
  gap: 19px; 
  min-width: 310px; 
  width: 310px;
  flex-shrink: 0;
  margin: 0 !important;
}

/* 3. Individuele tab-knop */
.tabsysteem .elementor-tab-title, .tabsysteem .e-n-tab-title {
    background-color: #422563 !important;
    color: #ffffff !important;
    font-family: inherit !important;
    font-weight: 700 !important;
    font-size: 20px !important;
    border-radius: 50px !important;
    padding: 24px 55px !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    justify-content: center !important;
    border: none !important;
    position: relative;
    transition: background-color 0.2s ease;
    width: 100% !important;
    line-height: 1.2 !important;
}

/* Verberg standaard Elementor iconen */
.tabsysteem .elementor-tab-title .elementor-tab-icon,
.tabsysteem .e-n-tab-title .e-n-tab-icon {
    display: none !important;
}

/* 4. Pijl-icoon (EXACTE FontAwesome Icon uit DevTools) */
.tabsysteem .elementor-tab-title::after,
.tabsysteem .e-n-tab-title::after {
  content: "\f35a"; /* fa-arrow-alt-circle-right */
  font-family: "Font Awesome 5 Free", "FontAwesome";
  font-weight: 900; 
  position: absolute;
  right: 14px; /* Positie vanaf rechts */
  top: 50%;
  transform: translateY(-50%); 
  color: #ffffff; /* Witte cirkel, transparante pijl */
  font-size: 40px; /* Exact uit jouw screenshot */
  line-height: 1;
}

/* 5. Actieve tab: gele tekst + geel icoon */
.tabsysteem .elementor-tab-title.elementor-active,
.tabsysteem .e-n-tab-title[aria-selected="true"] {
  background-color: #422563 !important;
  color: #f5c518 !important; 
}

/* Geel icoon voor actieve tab (paars schijnt door de uitgesneden pijl heen) */
.tabsysteem .elementor-tab-title.elementor-active::after,
.tabsysteem .e-n-tab-title[aria-selected="true"]::after {
  color: #f5c518 !important; 
}

/* 6. Hover op inactieve tab */
.tabsysteem .elementor-tab-title:not(.elementor-active):hover, .tabsysteem .e-n-tab-title[aria-selected="false"]:hover {
    background: #A292B6 !important;
}

/* 7. Content-gedeelte rechts */
.tabsysteem .elementor-tabs-content-wrapper,
.tabsysteem .e-n-tabs-content {
  flex: 1;
}

.tabsysteem .elementor-tab-content,
.tabsysteem .e-n-tab-content {
  padding: 0 !important;
  border: none !important;
}




/* 8. Mobile: tabs bovenaan, content eronder */
@media (max-width: 767px) {
  .tabsysteem .elementor-tabs,
  .tabsysteem .e-n-tabs {
    flex-direction: column;
    padding: 20px; 
  }

  .tabsysteem .elementor-tabs-wrapper,
  .tabsysteem .e-n-tabs-heading {
    width: 100%;
    min-width: unset;
    gap: 10px; 
  }

  .tabsysteem .elementor-tab-title,
  .tabsysteem .e-n-tab-title {
    font-size: 16px !important; 
    padding: 12px 45px 12px 45px !important; 
  }

  /* Pijl naar ONDER (fa-arrow-alt-circle-down) voor mobile */
  .tabsysteem .elementor-tab-title::after,
  .tabsysteem .e-n-tab-title::after {
    content: "\f358"; /* Exacte FA icoon voor pijl in cirkel naar beneden */
    font-size: 32px; /* Iets kleiner geschaald voor de slankere mobiele knop */
    right: 10px; 
  }

  .tabsysteem .elementor-tabs-content-wrapper,
  .tabsysteem .e-n-tabs-content {
    margin-top: 20px !important; 
  }
}

/******** OMEGA ADDITIONS ******/
.elementor-widget-n-tabs .e-n-tab-title-text {
    font-size: 20px !important;
}
.tabsysteem .elementor-element.e-flex.e-con-boxed.e-con.e-child  {
    padding-left: 17px;
    margin-left: 0;
}

@media (max-width: 1024px) {
	
.tabsysteem .elementor-element.e-flex.e-con-boxed.e-con.e-child {
    padding-left: 0;
    padding-right: 0;
    padding-top: 20px;
    margin-left: 0;
}
	
.tabsysteem .elementor-tabs, .tabsysteem .e-n-tabs {
    padding: 20px;

}	
	
}


#proplanner-plugin-wrapper {
    padding: 10px;
}





}	

html, 
body {
    overflow-x: hidden;
}

/* =============================================
   GLOBALE ZIJPADDING - ANTI-PLAK FIX EVENTUEEL AANVULLEN MET "CLAMP css"
   ============================================= */
@media (min-width: 1025px) {
  /* 1. Alle boxed containers: inner krijgt padding */
  .e-con-boxed > .e-con-inner {
    padding-left: max(1.5%, 15px);
    padding-right: max(1.5%, 15px);
  }
  /* 2. Full-width PARENT containers (geen boxed wrapper) */
  .e-con-full.e-parent {
    padding-left: max(1.5%, 15px);
    padding-right: max(1.5%, 15px);
  }
  /* 3. Horizontale scrollbar killer (ook voor animaties) */
  body:not(.elementor-editor-active) {
    overflow-x: hidden;
  }
  /* 4 Reset padding voor containers met class 'no-spacings' */
  .e-con-boxed.no-spacings > .e-con-inner,
  .e-con-full.e-parent.no-spacings {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}


.elementor-widget-text-editor  li {
margin-bottom: 12px;
}

.ekit-stylish-list-content-icon svg path {
    fill: transparent !important;
}

p strong {
	font-weight: 600 !important;
}




.ekit-wid-con .elementskit-accordion .ekit-accordion-title {
    padding-right: 39px;
}



.elementor-kit-11 button, .elementor-kit-11 input[type="button"], .elementor-kit-11 input[type="submit"], .elementor-kit-11 .elementor-button {
    text-transform: none;
}


html {
  scroll-padding-top: 100px; /* Pas aan naar je header hoogte */
}

.webdesigner a {
	text-decoration: none !important;
}


@media (max-width: 768px)  {
	
	.elementor-button-icon {
		display: none !important;
}
	

	
    .single-post.elementor-kit-777 h1 {
        font-size: 27px;
    }	
	
	
	
}



/* Add your custom styles here */
@media (min-width: 1024px) {
	
.img-full-height > div {
    height: 100%;
	}
	
	.mobile-only {
		display: none !important;
	}
	
	
}



@media (max-width: 1280px) {
	
	#topbar .right {
		display: none !important;
	}	
	
.homeblocks .elementor-button-icon {
    display: none;
}
	
	.homeblocks  .elementor-icon-box-title {
    font-size: 20px !important;
}

	
	
}