/*
Theme Name: morntag – Child Hello Elementor
Author: morntag
Description: A child theme for Hello Elementor, with some superpowers added by morntag.
Version: 1.0
Template: hello-elementor

This is the child theme for Hello Elementor theme.

(optional values you can add: Theme URI, Author URI, License, License URI, Tags, Text Domain)
*/

/* Custom styling for outline of focused elements when navigating 
 with keyboard */
*:focus-visible,
input:focus-visible + label {
  outline: 2px solid var(--e-global-color-secondary) !important;
  outline-offset: 2px !important;
}

/********** Button with Arrow-Icon **********/

/*** Gutenberg Button ***/

.wp-block-button .wp-block-button__link {
	text-decoration:none;
	color: var(--e-global-color-text);
	font-family: "GT Flexa Extended Light";
	text-transform: uppercase;
	display: flex;
    align-items: center;
	padding:0px;
}
.wp-block-button .wp-block-button__link::before {
    content: '';
    display: inline-block;
    width: 2em;
    height: 2em;
    margin-right: 10px;
    background-color: currentColor; /* This is the key change */
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: left;
    mask-size: contain;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: left;
    -webkit-mask-size: contain;
    transition: transform 0.3s ease;
    transform: translateX(0);
}
.wp-block-button .wp-block-button__link:hover::before {
   transform: translateX(1em);
}

/*** Elementor Button ***/

.elementor-element .elementor-button-text:not(.elementor-form-spinner)::before {
    content: '';
    display: inline-block;
    width: 2em;
    height: 2em;
    margin-right: 10px;
    background-color: currentColor;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: left;
    mask-size: contain;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: left;
    -webkit-mask-size: contain;
    transition: transform 0.4s cubic-bezier(0.45,0.05,0.55,0.95);
    transform: translateX(0);
}

.elementor-element .elementor-button-text {
    display: flex;
    align-items: center;
}
.elementor-element .elementor-button-text:hover::before {
   transform: translateX(.8em);
}

@-moz-document url-prefix() {
	 .elementor-button-text::before,
	.elementor-button-text::after{
    margin-bottom: 3px;  /* Adjust for Firefox only */
  }
}

/* Reverse button/icon for off canvas close button */

#button-close-off-canvas .elementor-button-text:before{
    width: unset;
    height:unset;
    mask-image: unset;
    -webkit-mask-image: unset;
}

#button-close-off-canvas .elementor-button-text:after {
    content: '';
    display: inline-block;
    width: 2em;
    height: 2em;
    margin-left: 18px;
    background-color: currentColor;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: left;
    mask-size: contain;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: right;
    -webkit-mask-size: contain;
    transition: transform 0.4s cubic-bezier(0.45,0.05,0.55,0.95);
	rotate: 180deg;
    transform: translateX(0);
}

#button-close-off-canvas .elementor-button-text:hover:after {
   transform: translateX(.8em);
}

/********** Akkordeon Buttons **********/
/* Button color depending on page background */
.e-n-accordion {
	--morntag-accordion-button-color: var(--e-global-color-text);
}
body.page-id-189 .e-n-accordion{
	--morntag-accordion-button-color: var(--e-global-color-88b111d);
}




.elementor-widget-n-accordion summary.e-n-accordion-item-title[aria-expanded="false"]{
	padding-bottom: 120px;
}

.e-n-accordion-item-title::after,
.e-n-accordion-item-title::before{
	z-index: 100;
}

.e-n-accordion-item-title::after{
	position: absolute;
	left: 50%;
	font-family: "GT Flexa Extended Light", sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: var(--morntag-accordion-button-color);

	text-transform: uppercase;
	transform: translateX(-50%);
}

.e-n-accordion-item-title[aria-expanded="false"]::after{
	content: 'Mehr Infos';
	bottom: 60px;
}

.e-n-accordion-item-title[aria-expanded="false"] ~ *{
	opacity: 0;
	transition: opacity 800ms;
}

.e-n-accordion-item-title[aria-expanded="true"] ~ *{
	opacity: 1;
	transition: opacity 800ms;
}

.e-n-accordion-item-title[aria-expanded="true"]::after{
	content: 'Schliessen';
	bottom: 12px;
}

.e-n-accordion-item-title::before{
    content: '';
	position: absolute;
	left: 50%;
    width: 2em;
    height: 2em;
	background: var(--morntag-accordion-button-color);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-position: left;
    mask-size: contain;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24.26 39.07'%3E%3Cpath d='M0,0v6.32l21.77,13.21L0,32.75v6.32l24.26-15.08v-8.83L0,0Z'%3E%3C/path%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: left;
    -webkit-mask-size: contain;
    transition: transform 0.4s cubic-bezier(0.45,0.05,0.55,0.95);
	transform-origin: center center;
}


.e-n-accordion-item-title[aria-expanded="false"]::before{
	bottom: 12px;
	transform: translateX(-50%) rotate(90deg);
}

.e-n-accordion-item-title[aria-expanded="true"]::before{
	bottom: 50px;
	transform: translateX(-50%) rotate(-90deg);
} 

/* Backdrop filter for off canvas overlay */
.e-off-canvas__overlay {
	background: rgba(0,0,0,0.15) !important;
	backdrop-filter: blur(8px);
}

/* Z-indexes for fixed footer effect */
[data-elementor-type="footer"]{
	z-index: 1;
	position: relative;
}
[data-elementor-type="search-results"],
[data-elementor-type="wp-page"] > *:not([data-elementor-type="footer"]),
[data-elementor-type="single-post"],
[data-elementor-type="single-page"],
main >*{
	z-index: 2;
	position: relative;
}

/* Color vars header */
body{
	--header-color-foreground: var(--e-global-color-88b111d);
	--header-color-background: rgba(22, 31, 47, 0.6) ;
}

/* Color vars header for bright pages */
body.page-id-205,
body.page-id-5150,
body.page-id-5131,
body.page-id-6421,
body.page-id-185,
body.page-id-3260,
body.page-id-183,
body.search,
body.post-template-default,
body.projektwoche-template-default,
body.sport-care-template-default,
body.allgemeiner-event-template-default {
	--header-color-foreground: var(--e-global-color-text);
	--header-color-background: rgba(227, 224, 224, 0.6) ;
}


/* Menu Popup Height Fix */
body .dialog-widget.elementor-popup-modal .dialog-widget-content .dialog-message:has(.m-menu-popup) {
    height: 100dvh !important;
    max-height: 100dvh;
    
    & .m-menu-popup{
     	height: 100dvh !important;
    	max-height: 100dvh;
   		min-height: 100dvh;
    }
}

#cmplz-manage-consent .cmplz-manage-consent.cmplz-show {
	background-color: var(--e-global-color-88b111d);
	color: var(--e-global-color-text);
}

/* Search input focus outline cutoff fix (bb) */
.search-filter-input-text:has(:focus-visible) {
	overflow: visible;
}