/* 
Theme Name: Cladix
Theme URI: https://www.cladix.eu
Description: Cladix thema
Author: Cladix
Author URI: https://www.cladix.eu
Template: hello-elementor
Version: 2.0.0
Text Domain: cladix
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
*/

:root {
  --section-xl: 8rem 4rem;
  --section-large: 7rem 4rem;
  --section-medium: 6rem 4rem;
  --section-small: 5rem 4rem;
  --section-xs: 4rem 4rem;
  --section-xxs: 3rem 3rem;
  --section-xxxs: 2rem 2rem;
  --section-none: 0 4rem;

  --gap-0: 0;
  --gap-xxs: clamp(0.5rem, 1.5vw + 0.25rem, 1.5rem);
  --gap-xs:  clamp(1.5rem, 1.6vw + 0.8rem, 1.75rem);
  --gap-s:   clamp(2rem,   1.5vw + 1rem,   2.5rem);
  --gap-m:   clamp(2rem,   2.5vw + 1rem,   3.5rem);
  --gap-l:   clamp(2rem,   3vw + 1rem,     4.5rem);
  --gap-xl:  clamp(2rem,   4vw + 1rem,     5.5rem);
  --gap-xxl: clamp(2rem,   5vw + 1rem,     6rem);

}

@media (max-width: 1024px) {
  :root {
    --section-xl: 8rem 3rem;
    --section-large: 6rem 3rem;
    --section-medium: 5rem 3rem;
    --section-small: 4rem 3rem;
    --section-xs: 3rem 3rem;
	--section-none: 0 3rem;
  }
}

@media (max-width: 767px) {
  :root {
    --section-xl: 3rem 2rem;
    --section-large: 3rem 2rem;
    --section-medium: 3rem 2rem;
    --section-small: 3rem 2rem;
    --section-xs: 3rem 2rem;
    --section-xxs: 3rem 2rem;	  
    --section-none: 0 2rem;
  }
}
.padding-xl:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-xl); }
.padding-l:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-large); }
.padding-m:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-medium); }
.padding-s:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-small); }
.padding-xs:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-xs); }
.padding-xxs:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-xxs); }
.padding-xxxs:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-xxxs); }
.padding-0:is(.e-con, .e-con-full, .e-con-boxed) { padding: var(--section-none); }

/*** Container Column Gaps ***/ 
.uabc-gap-0.e-con, .uabc-gap-0.e-con > .e-con-inner { gap: var(--gap-0); }
.uabc-gap-xxs.e-con, .uabc-gap-xxs.e-con > .e-con-inner { gap: var(--gap-xxs); }
.uabc-gap-xs.e-con, .uabc-gap-xs.e-con > .e-con-inner { gap: var(--gap-xs); }
.uabc-gap-s.e-con, .uabc-gap-s.e-con > .e-con-inner { gap: var(--gap-s); }
.uabc-gap-m.e-con, .uabc-gap-m.e-con > .e-con-inner { gap: var(--gap-m); }
.uabc-gap-l.e-con, .uabc-gap-l.e-con > .e-con-inner { gap: var(--gap-l); }
.uabc-gap-xl.e-con, .uabc-gap-xl.e-con > .e-con-inner { gap: var(--gap-xl); }
.uabc-gap-xxl.e-con, .uabc-gap-xxl.e-con > .e-con-inner { gap: var(--gap-xxl); }

/*** Rank Math breadcrumbs ***/
.rank-math-breadcrumb a, .rank-math-breadcrumb p {
color: var(--e-global-color-e212495);
font-weight: var(--e-global-typography-89c28fd-font-weight);
font-size: var(--e-global-typography-c839737-font-size);
}
.rank-math-breadcrumb a:hover {
color: var(--e-global-color-da4bfc9);
}
/*** Inspiratie archive ***/

/*** Posts pages ***/
#toc-content .elementor-widget-theme-post-content h2 {
	margin-block-start: 3rem;
}
#toc-content .elementor-widget-theme-post-content h3 {
	margin-block-start: 2rem;
}
#toc-content .elementor-widget-theme-post-content ul, #toc-content .elementor-widget-theme-post-content ol {
	margin-block-end: 1rem;
}
figcaption {
	font-size: 0.8rem;
	color: var(--item-text-color);
	font-style: inherit;
	text-align: left;
}
/* Gutenberg Table with stripes */
table {
    font-size: inherit;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background-color: var(--e-global-color-7b1f3f5);
}
/*** Elementor Tabs correct hover color ***/
.elementor .elementor-element.elementor-widget-n-tabs:not(:has(>.elementor-widget-container))>.e-n-tabs[data-touch-mode=false]>.e-n-tabs-heading .e-n-tab-title[aria-selected=false]:hover {
    background-color: var(--e-global-color-6b39837);
}
/* Normale state */
#z-shape .e-n-tab-title {
    background-color: var(--e-global-color-2cce047);
}

/* Hover */
#z-shape .e-n-tab-title:hover {
    background-color: var(--e-global-color-2cce047);
}

/* Active */
#z-shape .e-n-tab-title[aria-selected="true"] {
    background-color: var(--e-global-color-2cce047);
}
/*** Rank Math breadcrumbs ***/
.rank-math-breadcrumb a, .rank-math-breadcrumb p {
color: var(--e-global-color-e212495);
font-weight: var(--e-global-typography-89c28fd-font-weight);
font-size: var(--e-global-typography-c839737-font-size);
}
.rank-math-breadcrumb a:hover {
color: var(--e-global-color-da4bfc9);
}
/*** Custom selection ***/
::-moz-selection { /* Code for Firefox */
  color: var(--global-palette4);
	background-color: color-mix(in srgb, var(--e-global-color-secondary), transparent 50%);
}
/*** Custom selection ***/
::selection {
  color: var(--global-palette4);
	background-color: color-mix(in srgb, var(--e-global-color-secondary), transparent 50%);
}
/*** FORMS ***/

/* Acceptance text small */
.elementor-field-type-acceptance .elementor-field-subgroup .elementor-field-option label {
	font-size: 75%!important;
}
.button-password {
	background-color: transparent!important;
	padding: 0!important;
	border-radius: 0px!important;
	color: var(--e-global-color-ab5dae4)!important;
}

/* HEADER */
#blurred-header {
  background: #ffffff;
  transition: background 220ms ease, backdrop-filter 220ms ease, -webkit-backdrop-filter 220ms ease, box-shadow 220ms ease;
  will-change: backdrop-filter, background;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
/* STICKY STATE: transparant + blur + subtiele schaduw */

.elementor-sticky--effects#blurred-header {
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* (Optioneel) iets minder intens op mobile */
@media (max-width: 767px) {
  .elementor-sticky--effects#blurred-header {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
}

/* Zorg dat de spacer transparant is (geen eigen achtergrond) */
.elementor-sticky__spacer {
  background: transparent !important;
  box-shadow: none !important;
}