/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
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: 1.0.1
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
*/

:root {
    --POP_Dark: #0D0D0D;
    --POP_Grey: #2D2D2D;
    --POP_Light: #D9D9D9;
	--POP_Gelb:  #F8F394;
	--POP_Rosa: #C179B2;
	--POP_Blau: #294B97;
	--POP_Petrol: #3A7F96;
	--POP_White: #ffffff;
	--POP_Black: #000000;

}

body, body.elementor-kit-5  {
    --headlineColor: var(--POP_Black);
    --textColor: var(--POP_Black);
	--backgroundColor: var(--POP_Light);
	--e-global-color-text: var(--textColor);
	--headerColor: rgba(217,217,217,0.8);
	--accentColor: var(--POP_Gelb);
	--secondAccentColor: var(--POP_Rosa);
	

    font-family: 'Clash Grotesk';
    font-weight: normal;
    font-style: normal;
    line-height: 1.3;
    color: var(--textColor);
	background: var(--backgroundColor);
	font-size: 26px;
	
	transition: background 0.3s ease-in-out, color: 0.3s ease-in-out;
}
p {
	-webkit-hyphens: auto;
	hyphens: auto;
}
body.darkmode {
	 --headlineColor: var(--POP_White);
    --textColor: var(--POP_White);
	--backgroundColor: var(--POP_Dark);
	--headerColor: rgba(13,13,13,0.85);
	--accentColor: var(--POP_Petrol);
	--secondAccentColor: var(--POP_Blau);
	--e-global-color-bc4e190 : var(--POP_Petrol);
	--e-global-color-primary: var(--POP_Dark);
	--e-global-color-accent: var(--secondAccentColor);
	
}
body.darkmode .elementor-element.elementor-element-bab9d40 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
	background-image: url(/wp-content/uploads/header-visual-dark.png);
}
body .smallText {font-size: 0.85em}
body .smallerText {font-size: 0.69em}

main#content {min-height: calc(100vh - 705px)}

h1,
h2,
h3 {
    font-family: 'Clash Display';
    font-weight: 600;
    font-style: normal;
    color: var(--headlineColor);
}

h1 {
    font-size: 2em;
    margin: 0;
	letter-spacing: 0.04em;
}

h2 {
    font-size: 1.5em;
    margin: 0;
	letter-spacing: 0.04em;
}

h3 {
    font-size: 1.2em;
    font-weight: 400;
	letter-spacing: 0.04em;
}


h4 {
    font-size: 1.1em;
    font-weight: 700;
}

h5 {
    font-size: 1em
}

h6 {
    font-size: 0.8em
}
p {letter-spacing: 0.04em}

@media screen and (max-width: 1024px) {
  /* … 
	h1 {font-size: 4.3em}
	h2 {font-size: 2.5em}
	h3 {font-size: 1.9em}
	h4 {font-size: 1.5em}
	*/
}

@media screen and (max-width: 767px) {
	body {font-size: 18px}
	h1 {font-size: 1.7em}
	h1, h2, h3, h4, h5 {
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	.noHyphens h1, h2, h3, h4, h5 {
		-webkit-hyphens: none;
		hyphens: none;
	}
	
	h2 {font-size: 1.3em}
	/*
	h3 {font-size: 1.6em}
	h4 {font-size: 1.5em}	*/
	
}

.m-t-20 {margin-top:20px}
.m-b-20 {margin-bottom:20px}
.m-t-25 {margin-top:25px}
.m-b-25 {margin-bottom:25px}
.m-b-30 {margin-bottom:30px}
/* HEADER */
.logo-container {max-width: 240px;height: 100%; display: flex}
#logoLink {width: 100%; display:inline-block; height: 63px; align-self:center}
svg#logo {width: 100%; height:auto; margin: 0 auto}

body ul.elementor-nav-menu--dropdown a, 
body ul.elementor-nav-menu--dropdown a:focus, 
body ul.elementor-nav-menu--dropdown a:hover { 
text-shadow: inherit; 
border-left: none;
comment: fix annoying elementor bug;
 }

header.sticky-header.e-con.elementor-element {
	--header-height: 100px; 
	--shrink-header-to: 0.6; 
	--transition-timing: .6s ease; 
	background-color: transparent;
	--min-height: var(--header-height);
	--transition: background-color var(--transition-timing),
					backdrop-filter var(--transition-timing),
					box-shadow var(--transition-timing),
					min-height var(--transition-timing);
}
header.sticky-header.e-con.elementor-element.elementor-sticky--effects, header.sticky-header.elementor-sticky--effects .elementor-nav-menu--dropdown{
	background-color: var(--headerColor); 
	box-shadow: 0px 4px 33px 1px rgba(0, 0, 0, .07); 
	-webkit-backdrop-filter: saturate(180%) blur(20px); 
	backdrop-filter: saturate(180%) blur(20px); 
	--min-height: calc( var(--header-height) * var(--shrink-header-to) );
}
header.sticky-header.e-con.elementor-element.elementor-sticky--effects #logoLink {
	height: 42px
}
header.sticky-header.e-con.elementor-element.elementor-sticky--effects .logo .ee-inline-svg, header.sticky-header.e-con.elementor-element.elementor-sticky--effects .logo-container{
	max-width: 150px;
}
@media screen and (max-width: 767px) {
	.logo-container {max-width: 140px}
	#logoLink{height: 44px}
	header.sticky-header.e-con.elementor-element.elementor-sticky--effects .logo .ee-inline-svg, header.sticky-header.e-con.elementor-element.elementor-sticky--effects .logo-container {
	max-width: 120px;
}
	header.sticky-header.e-con.elementor-element.elementor-sticky--effects #logoLink {
	height: 36px;
}
}
header .switchContainer {
	height: 100%;
}
header .darkmode {
	position:absolute;
	top:calc(50% - 20px);
	width: 40px;
	height: 40px;
	cursor:pointer;
	border:none;
	padding: 0;
	background-color:var(--textColor);
	-webkit-mask-image: url('/wp-content/uploads/icon-lightmode-switch.svg');
	mask-image: url('/wp-content/uploads/icon-lightmode-switch.svg');
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	transition: all 0s;
}
header .darkmode:hover, header .darkmode:focus, header .darkmode.active {
	outline: none;
	-webkit-mask-image: url('/wp-content/uploads/icon-darkmode-switch.svg');
	mask-image: url('/wp-content/uploads/icon-darkmode-switch.svg');
}
header .darkmode.active:hover, header .darkmode.active:focus {
	-webkit-mask-image: url('/wp-content/uploads/icon-lightmode-switch.svg');
	mask-image: url('/wp-content/uploads/icon-lightmode-switch.svg');
}
header .wpml-ls-legacy-list-horizontal {padding: 0; border:none;}
header .wpml-ls-legacy-list-horizontal a {padding: 0}
header .wpml-ls-legacy-list-horizontal .wpml-ls-flag {width: 40px}
header .wpml-ls-legacy-list-horizontal img[alt="Englisch"] {content:url(/wp-content/uploads/icon-de-switch.svg)}
header .wpml-ls-legacy-list-horizontal img[alt="Englisch"]:hover {content:url(/wp-content/uploads/icon-en-switch.svg)}
header .wpml-ls-legacy-list-horizontal img[alt="German"] {content:url(/wp-content/uploads/icon-en-switch.svg)}
header .wpml-ls-legacy-list-horizontal img[alt="German"]:hover {content:url(/wp-content/uploads/icon-de-switch.svg)}
body.darkmode header .wpml-ls-legacy-list-horizontal .wpml-ls-flag {filter:invert()}
header.header-beratung, header.header-beratung  a {color:var(--accentColor)}
header.header-beratung .darkmode {background-color:var(--accentColor);}
header.header-beratung {--headerColor: rgba(45,45,45,0.8);}
header.header-beratung .wpml-ls-legacy-list-horizontal .wpml-ls-flag {filter: invert(84%) sepia(71%) saturate(261%) hue-rotate(352deg) brightness(104%) contrast(94%);}
header.header-beratung .e-con-inner{padding-top:.5rem; padding-bottom:.5rem}
body.darkmode header.header-beratung .wpml-ls-legacy-list-horizontal .wpml-ls-flag {filter: invert(47%) sepia(19%) saturate(1218%) hue-rotate(149deg) brightness(90%) contrast(85%);}
body.darkmode header.header-beratung {--headerColor: rgba(13,13,13,0.85);}

body.darkmode .elementor-menu-toggle {background:#323232}

/* header .darkmode{
	position:absolute;
	right:2rem;
	top:calc(50% - 0.75rem);
	width:44px;
	height:15px;
	padding: 8px;
	border:2px solid var(--textColor);
	background-color:transparent;
	cursor:pointer;
	appearance:none;
}
header .darkmode:hover, header .darkmode:focus{
	background-color:transparent;
	border:2px solid var(--textColor);
	outline: none;
}
header .darkmode::before{
	content:'';
	position:absolute;
	left:4px;
	top:50%;
	width:20px;
	height:11px;
	background-color:var(--textColor);
	transform:translateY(-50%);
}
header .darkmode.active::before{
	left:auto;
	right:4px;
}*/

header .elementor-nav-menu .sub-arrow {
	padding: 10px 0 10px 5px;
}

/* ---- FOOTER --- */
footer, footer.elementor-location-footer {
	font-family: 'Maxeville';
	color: var(--POP_White);
}
footer .superSImpleLinkMenu .elementor-widget-container {display:flex; justify-content:center}

/* ---- LINKS & Buttons--- */
p a, .jet-listing-dynamic-link a {transition: background 0.2s ease-in-out, color 0.2s ease-in-out}
p a::before, .elementor-widget-text-editor a::before, .jet-listing-dynamic-link a::before {
	
	content: '\2197';
	padding-right: 10px;
}
.simpleLink .elementor-heading-title {font-size: 0.75em}
p a, {color:var(--textColor)}
p a:hover, .elementor-widget-heading .elementor-heading-title a:hover, .elementor-widget-text-editor a:hover, .superSImpleLinkMenu a:hover, .jet-listing-dynamic-link a:hover{background:var(--accentColor); color: var(--textColor)!important}

#mainMenu li.menu-item a.elementor-item-active, #mainMenu nav>ul>li.menu-item>a:hover {color:var(--secondAccentColor)!important}

.inlineButton a, a.inlineButton, .elementor-widget-heading.inlineButton .elementor-heading-title[class*=elementor-size-]>a  {font-size: 0.75em; font-family: 'Maxeville'; letter-spacing: normal}
.jet-button a {padding: 12px 24px 14px 24px; background: var(--secondAccentColor);}
.jet-button a span {font-size: 0.75em; font-family: 'Maxeville';}
.jet-button.outline a {background: none; color: var(--textColor); border: 2px solid var(--secondAccentColor); box-sizing: border-box; padding-top:10px; padding-bottom: 10px}
.jet-button.outline a:hover {border-color: var(--textColor)}
.jet-button a::before{display:none}
.jet-button a:hover {background: var(--textColor); }
.jet-button a:hover .jet-listing-dynamic-link__label {color: var(--backgroundColor)}

.badge .jet-listing-dynamic-terms__link {padding: 0 15px; background-color: var(--secondAccentColor); font-family: 'Maxeville';}

/* --- Mitgliedschaftsformular --- */
.elementor-field-group-POBformGroupDatenschutz label {font-size: 0.75em}
.elementor-field-group-POBDatenschutz::before {
	content: 'Datenschutz';
	display:block;
	font-size: 0.9em;
}
.elementor-field-group-POBVeroeffentlichung::before {
	content: 'Veröffentlichung';
	display:block;
	font-size: 0.9em;
}
.elementor-field-group-POBNewsletter::before {
	content: 'Newsletter';
	display:block;
	font-size: 0.9em;
}
.elementor-field-group-POBWeitergabe::before {
	content: 'Weitergabe';
	display:block;
	font-size: 0.9em;
}

#mitgliedschaft.elementor-form:has(div.elementor-message-success) .elementor-form-fields-wrapper, .hideFieldsAfterSuccess .elementor-form:has(div.elementor-message-success) .elementor-form-fields-wrapper {display: none}

/*--Newsletter -- */
.newsletter-popup .elementor-field-type-acceptance {font-size: 0.5em}

/* ----- Termine ---- */

.pob-tk-date {font-size: 2em; font-weight: 700; font-family: 'Maxeville';letter-spacing: normal;}
.pob-tk-headline h3 {font-size: 2em; font-weight: 700; font-family: 'Maxeville';margin:0;letter-spacing: normal;}
.pob-tk-LongDate, .pob-tk-ort {font-family: 'Maxeville';letter-spacing: normal;}
.pob-tk-terms {font-family: 'Maxeville'; font-size:0.8em; margin-bottom:10px; letter-spacing: normal;}
.pob-tk-terms .jet-listing-dynamic-terms__link {background: var(--textColor); color:var(--backgroundColor)}

/* ------//////----- Beratungspool --------- //////------ */

.elementor-kit-5 header .small-button .elementor-button {
	padding: 5px 18px 7px;
	bottom: 1px;
	position: relative;
}

.berater-grid_inner {
	color: var(--backgroundColor);
	padding: 50px 30px 30px 30px;
}
.beraterinnen_grid_image a {width: 100%}
.beraterinnen .profile_active img, body.single-berater img {filter:none}


body.single-berater .profile_inactive img, .profile_inactive img:hover {filter: saturate( 0% )}
.berater_image img {object-position: 50% 35%;}
.berater-grid_inner h3 a{color: var(--backgroundColor);}
.berater-grid_name {text-transform: uppercase}
.berater-grid_name a:before {display: none}
.berater-grid_excerpt {font-size: 0.75em; -webkit-hyphens: auto;hyphens: auto; letter-spacing: 0.04em;}

.e-con .elementor-widget.berater-grid_excerpt {margin-bottom:30px }
.berater-grid_link .jet-listing-dynamic-link__link{padding: 20px 30px 20px 30px; background: var(--accentColor); justify-content: flex-start;}
.berater-grid_link a.jet-listing-dynamic-link__link:hover {background: var(--secondAccentColor);}
.berater-grid_link a.jet-listing-dynamic-link__link:hover span {color: var(--textColor);}
.profile_inactive .berater-grid_link {opacity: 0.7}

.berater-grid_themen, .berater-detail_themen {color: var(--accentColor);font-size: 0.75em; font-family: 'Maxeville'; letter-spacing: normal; -webkit-hyphens: auto; hyphens: auto;}
.berater-grid_themen span.jet-listing-dynamic-terms__link {display:inline; hyphens:none}
.beraterinnen .berater-grid_themen span.jet-listing-dynamic-terms__link:not(:last-child):after, .jet-listing-grid .berater-grid_themen span.jet-listing-dynamic-terms__link:not(:last-child):after {content: ', '}

.berater-detail_themen {color: var(--secondAccentColor); text-transform:uppercase;}
.inlineButton.filter a{background: none; padding: 0; color: var(--textColor);}
.inlineButton.filter a:hover{background:var(--accentColor)}
#buttonExpertise a .elementor-button-text::after {content: '↓'; margin-left: 5px; display: inline-block;}
#buttonExpertise.active a .elementor-button-text::after {transform: rotate(180deg);}
#buttonSprache a .elementor-button-text::after {content: '↓'; margin-left: 5px;display: inline-block;}
#buttonSprache.active a .elementor-button-text::after {transform: rotate(180deg);}

#bookingForm .jet-form-builder__label-text, .hideLabels .jet-form-builder__label-text {display:none}
.jet-form-builder__label-text, .jet-form-builder__desc{letter-spacing: 0.04em} 
.jet-form-builder__field.wysiwyg-field button {background:none}
#bookingForm .jet-form-builder__heading.visibleLabel .jet-form-builder__label-text, .hideLabels .jet-form-builder__heading.visibleLabel .jet-form-builder__label-text {display: block;}
.simpleJetForm .jet-form-builder__field  {padding: 12px 15px;border-radius: 0}
.simpleJetForm .jet-form-builder__field.wysiwyg-field {padding: 12px 0px}
.simpleJetForm small {font-size:60%}
.simpleJetForm .jet-form-builder__field-wrap.checkboxes-wrap {display: inline-block;margin-right: 20px; margin-bottom: .25rem;font-size: 0.7em;}
#bookingForm .jet-form-builder__field-wrap.checkboxes-wrap {margin-bottom:0}
.simpleJetForm .jet-form-builder__field-label.for-checkbox>span::before {border-radius:0}
.simpleJetForm .jet-form-builder__field-label.for-checkbox :checked+span::before {border-color:var(--secondAccentColor); background-color: var(--secondAccentColor); }
.simpleJetForm .jet-form-builder__field-label.for-checkbox :not(:disabled):not(:checked):hover+span::before {border-color:var(--secondAccentColor);}
.jet-form-builder__submit {line-height: 1}
#bookingForm .wp-block-columns, .simpleJetForm .wp-block-columns{margin-bottom: 0; gap:20px}
#bookingForm .jet-form-builder-row.field-type-checkbox-field {margin-bottom: 0}
#bookingForm .jet-form-builder-row.field-type-submit-field {margin-top:20px}
.jet-form-builder__submit {border:none}
.simpleJetForm .wp-block-group {margin-bottom: 20px}
.simpleJetForm .jet-form-builder-message--success, .simpleJetForm .jet-form-builder-message--error {border:none;}
.hideFormMessages .jet-form-builder-messages-wrap {display: none}
.beratung_beschreibung {height: 8em}

@media screen and (max-width: 1360px) {
	.berater-grid_inner {padding: 30px 20px 20px 20px}
}


.beratung_list_thema a:before {display: none}
.beratung_list_thema .jet-listing-dynamic-link__label {font-size: 1.5em; }
.beratung_list_thema h3 {margin-bottom: 0}
.beratung_list_status{font-size: 0.75em}

.beratung_list_meta {font-family: font-family: 'Maxeville';font-size: 0.75em;letter-spacing: normal;}

.elementor-kit-5 .elementor-button:focus {background-color: var(--accentColor); color: var(--textColor)}
.elementor-widget-button.inactive a {opacity: 0.7}
.elementor-widget-button.inactive a:hover {opacity: 1}
@media screen and (max-width: 1024px) {
	.beratung_list_thema .jet-listing-dynamic-link__label {font-size: 1.3em; }
}
@media screen and (max-width: 768px) {
	.beratung_list_thema .jet-listing-dynamic-link__label {font-size: 1.1em; }
	.anfragenButton .elementor-button {font-size: 1rem; padding: 12px}
	.badge {font-size: 0.75em}
	.beratungen h1 {font-size: 1.4em}
}
.elementor-login a.elementor-lost-password {font-size: 0.75em; width: 100%; text-align:center}
/* CHAT */
.bp-messages-wrap .chat-header .thread-info .thread-info-data .sub-name {display: none}
.bm-reply-restricted {border-radius: 0}
.bp-messages-wrap .bm-messages-list .bm-list .bm-messages-stack .bm-content .bm-info .name span {
	letter-spacing: 0.3px;
}

.single-beratungen {
	--bm-font-family: 'Clash Grotesk';
	--main-bm-color: 13,13,13;
	--main-bm-border-color: #f1f1f1;
    --bm-border-radius: 0px;
	--bm-button-bg: 193,121,178;
    --bm-button-hover: #00000017;
    --bm-button-active: #00000027;
	
    --bm-mini-chats-border-radius: 0px 0px 0 0;
    --bm-widgets-button-radius: 0px;
    --bm-message-border-radius: 0px;
    --bm-avatar-radius: 0px;
    --bm-date-radius: 0px;
	
    --bm-bg-color: 255,255,255;
    --bm-bg-secondary: 239,239,239;
    --bm-hover-bg: 250,251,252;
	
    --bm-border-color: 215,216,219;
   
	--bm-border-active: 167, 167, 167;
	
    --bm-text-color: 0,0,0;
	--bm-message-font-size: 16px;
    --bm-message-line-height: 20px;
	
    --left-message-nickname-color: 0,0,0;
    --left-message-bg-color: 217,217,217;
    --left-message-text-color: 0,0,0;
	
    --right-message-nickname-color: 13,13,13;
    --right-message-bg-color: 193,121,178;
    --right-message-text-color: 255,255,255;
	
    --bm-sticky-date-bg: #0d0d0d;
    --bm-sticky-date-color: #fff;
    --bm-tooltip-bg: 13,13,13;
    --bm-tooltip-color: 255,255,255;	
}
.single-beratungen.darkmode {

	--main-bm-color: 255,255,255;
	--bm-bg-color: 61,61,61;
	--bm-border-color: 13,13,13;
	--bm-bg-secondary: 45,45,45;
 	--bm-border-secondary-color: 61,61,61;
	--bm-tooltip-bg: 45,45,45;
	--bm-text-color: 255,255,255;
	--bm-placeholder: 234,234,234;
	--left-message-bg-color: 45,45,45;
	--left-message-text-color: 255,255,255;
	--right-message-bg-color: 41,75,151;
    --right-message-text-color: 255,255,255;
	
	
}