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


.elementor-custom-embed-play i,.elementor-custom-embed-play svg {
    opacity: 1 !important;
}

.swiper-slide{
	overflow: visible !important;
}


@media and screen(max-width: 767px) {
	.hero{
		height: auto !important;
	}
		}

.hero{
    height: 300px !important;
    overflow: hidden;
}

.custome_tab button{
	border-radius: 24px !important;
	
	/*
	&:hover{
		color: white !important;
		background: #1471B4 !important;
	}
	*/
}


/*Styling the searchwp Form */
 form.searchwp-form .searchwp-form-input-container .swp-input {
	 	border-radius: 16px;
		outline: none;
        border: 1px solid #646464;
	 	transition-duration: 0.1s;
	 	background: white;
      
	 &:hover,&:focus{
        box-shadow: 0px 0px 3px #333333;
	 }
}

.Searchbar_Landingpage_Hero form.searchwp-form .searchwp-form-input-container .swp-input {
	border:none;
}


/* Slide In From The Top Option*/

.header-2 {
 transform: translatey(-104px);
 -moz-transition: all .3s ease!important;
 -webkit-transition: all .3s ease!important;
 transition: all .3s ease!important;
 width: 100%!important;
}


.elementor-sticky--effects.header-2  {
 height: auto!important;
 transform: translatey(0px);
}

.elementor-sticky--effects.header-1 {
 display: none!important;
}

/* End Of Slide In From The Top Option */




.header-1{
	box-shadow: 0px 0px 10px 0px #33333369;
}

.header-2{
	box-shadow: 0px 0px 10px 0px #33333369;
}


.searchHeader{
	box-shadow: 0px 0px 10px 0px #33333369 !important;
}


#searchButtonHeader{
	background: white;
	fill: #1471B4;
	line-height:normal;
	height: 44px;
	transition: transform 0.2s ease-in-out;
	& svg{
	width: 28px;
	height: 28px;
	}
	
}

#searchButtonHeader:hover{
	transform: scale(1.1);
	
}

#searchButtonHeaderMobile{
	background: white;
	fill: #1471B4;
	padding: 0px;
	& svg{
	width: 30px;
	height: 30px;
	}
	&:hover{
	background: white;
	fill: #1471B4;
	border: none;
	& svg{
	fill: #1471B4;
	}
		
	}
}



.dd-visually-hidden{
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}


.category_Side_Menu_CTA .elementor-cta__content{
	min-height: 60px !important;
}

.custom_search_form .search-field {
	background: white;
}


@media(max-width: 767px) {
	.Hero_Description {
		background: rgba(255, 255, 255, 0.75);
	}
	}

.cta_cart_custome_container .elementor-cta__bg-wrapper{
	border-radius: 8px;

}

.custome_breadcrumb span {
	display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
	align-items: center;
	font-size: 16px;
		& > a{
			font-size: 16px;	
		}

}

@media(max-width: 2400px) {
	.custome_breadcrumb span {
		font-size: 13px;
			& > a{
			font-size: 13px;	
			}

}
}



.custome_loop_item_single_post .last_section_info{
    margin-top: auto;
}


.elementor-cta__button-wrapper{
	text-align: left;
	.elementor-cta__button{
		border: none !important;
    	color: #1471B4 !important;
    	background: none !important;
		transition: all 0.3s ease-in-out;

		&:hover{
			background: none !important;
			transform: scale(1.1);
		}
	}
}

.upload-form-projekte .elementor-field-type-upload input[type="file"]{
	background-color: white !important;
}


.upload-form-projekte .elementor-field-option {
	display: flex;
	gap: 8px;
	align-items: baseline;
}

.upload-form-projekte .elementor-field-type-upload input[type="file"]::file-selector-button {
	border: 0px solid #ccc;
	border-radius: 20px;
	background-color: #f0f0f0 !important;
	padding: 10px 15px;
	margin-right: 15px;
	cursor: pointer;
}

.upload-form-projekte .elementor-field-textual {
	border-radius: 10px !important;
	border: 1px solid #ACACAC  !important;
	background-color: #fff !important;
}


.kundenprojekt_bezeichnung_truncate {
	 display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    overflow-wrap: anywhere;
}



/* Wrapper */
.hr-card{ position:relative; }

/* Collapsed: 4 Zeilen sichtbar */
.hr-text{
  position:relative;
  overflow:hidden;
  line-height:1.6;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:4;
  max-height:calc(4 * 1.6em);
  transition:max-height .35s ease;
  will-change:max-height;
}

/* Standard: kein Fade */
.hr-card .hr-text::after{ content:none; }

/* Fade nur bei langen Texten und nicht expanded */
.hr-card.has-toggle:not(.expanded) .hr-text::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:56px;
  background:linear-gradient(to bottom, rgba(255,255,255,0), #fff);
  pointer-events:none;
}

/* Expanded: kein Clamp mehr – iOS braucht display:block */
.hr-card.expanded .hr-text{
  display:block;
  -webkit-line-clamp:unset;
}

/* Button nur bei langen Texten anzeigen */
.hr-card[data-can-toggle="0"] .hr-expand{ display:none; }
.hr-expand{ display:block; cursor:pointer; }

/* Icon Animation */
.hr-expand .elementor-button-icon{ transition:transform .25s ease; }
.hr-expand.is-open .elementor-button-icon{ transform:rotate(180deg); }



#initialen_kundenname {
	border-radius: 60px;
	
	.elementor-button-text {
		width: 50px;
        height: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
	
	.elementor-heading-title {
		width: 40px;
        height: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
		font-size: 11px;
	}
}


.kachel-vote {
	.pld-like-dislike-wrap{
		margin-bottom: 0 !important;
		.pld-common-wrap {
			display: flex;
    		align-items: center;
    		gap: 4px;
		
			 .pld-like-dislike-trigger {
				display: flex;
				margin-right: 0 !important;
				text-align: center;
				flex-direction: row;
				border: 1px solid #1471b4;
				border-radius: 4px;
				width: 100px;
				margin: 0;
				height: 42px;
				display: flex;
				justify-content: center;
				align-items: center;
				 
				 &.pld-undo-trigger {
					border: 1px solid #1471b4; 
					 
				 } 
			}
			
			.pld-like-count-wrap {
				position: absolute;
				right: 0px;
				bottom: 29px;
				background: #1471b4;
				color: white;
				border-radius: 60px;
				height: 24px;
				width: 24px;
				text-align: center;
			}
		}
	}
	
	@media (max-width:767px){
		.pld-like-dislike-wrap, .pld-common-wrap, .pld-like-dislike-trigger{
			width: 100% !important;
		}
			
		}
	
	
}

/*

.kachel-vote {
	.pld-like-dislike-wrap{
		display: flex;
    	flex-direction: row;
		gap: 24px;
		margin-bottom: 0 !important;
		
		img {
			max-width: 18px!important;
		}
		
		.pld-like-wrap, .pld-dislike-wrap{
			display: flex;
    		flex-direction: row;
			align-items: center;
			margin-right: 0 !important;
			gap: 8px;
			
			.pld-like-dislike-trigger {
				background: #fff;
				border: 1px solid #1471B4;
				border-radius: 60px;
				width: 40px;
				height: 40px;
				display: flex;
				align-items: center;
				justify-content: center;
			}
			
			.pld-like-dislike-trigger.pld-undo-trigger.pld-prevent {
				background: #fff;
			}
			
			.pld-count-wrap {
				margin-left: 0 !important;
				font-weight: 500;
				font-size: 13px;
			}
		}
	}
}
*/

#loop-sort {
    border: 1px solid #646464;
    color: #333333;
    border-radius: 8px;
	-webkit-appearance:none;
  	-moz-appearance:none;
  	appearance:none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M5 7l5 5 5-5' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  	background-repeat: no-repeat;
  	background-size: 1rem 1rem;
	background-position: right 12px center;
	padding-right: 2rem; 
	select::-ms-expand{ display:none; } /* IE/Edge alt */
}

.ugc-slot .elementor-widget-container a {
	display: block !important;
	height: 100%;
}



/* Hero-Container mit 4:3 */
.hr-acf-gallery-card .card-hero-link{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:8px;
  flex:1 1 auto;
  min-width:0;
  width:100%;
  aspect-ratio:16 / 9;
}

/* Alle möglichen Wrapper füllen den Container */
.hr-acf-gallery-card .card-hero-link > img,
.hr-acf-gallery-card .card-hero-link > picture,
.hr-acf-gallery-card .card-hero-link > picture > img,
.hr-acf-gallery-card .card-hero-link > .lazyload,
.hr-acf-gallery-card .card-hero-link > .lazyloading,
.hr-acf-gallery-card .card-hero-link > .lazyloaded{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}

/* Das eigentliche Bild füllt und croppt sauber */
.hr-acf-gallery-card .card-hero-link img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .5s ease;
}
.hr-acf-gallery-card .card-hero-link img:hover{ transform:scale(1.05) }

/* Fallback für Browser ohne aspect-ratio */
@supports not (aspect-ratio: 1 / 1){
  .hr-acf-gallery-card .card-hero-link::before{
    content:"";
    display:block;
    padding-top:75%; /* 4:3 */
  }
}

/* Row auf gleiche Höhe spannen */
.hr-acf-gallery-card .card-row{ display:flex; gap:12px; align-items:stretch }

/* Thumbs unverändert */
.hr-acf-gallery-card .card-thumbs-col{
  display:flex; flex-direction:column; gap:8px; row-gap: 16px;
  flex:0 0 auto; width:64px; height:100%; max-height:100%;
  overflow:auto; border-radius:8px; flex-wrap: wrap;
}
.hr-acf-gallery-card .card-thumb{
  width:64px; height:64px; object-fit:cover; border-radius:8px; display:block
}

/* Bottom-Layout */
.hr-acf-gallery-card .card-col.pos-bottom{ display:flex; flex-direction:column; gap:10px }
.hr-acf-gallery-card .card-col.pos-bottom .card-hero-link{ aspect-ratio:4 / 3 }
.hr-acf-gallery-card .card-col.pos-bottom .card-thumbs-col{
  flex-direction:row; width:auto; height:auto; max-height:none; overflow:visible
}

/* Position-Modifier */
.hr-acf-gallery-card .pos-left .card-thumbs-col{ order:0 }
.hr-acf-gallery-card .pos-left .card-hero-link{ order:1 }
.hr-acf-gallery-card .pos-right .card-hero-link{ order:0 }
.hr-acf-gallery-card .pos-right .card-thumbs-col{ order:1 }

/* Responsive */
@media (max-width:768px){
  .hr-acf-gallery-card .card-row{ flex-direction:column }
  .hr-acf-gallery-card .card-thumbs-col{
    flex-direction:row; width:auto; height:auto; max-height:none; overflow:visible
  }
  .hr-acf-gallery-card .card-thumb{ width:64px; height:64px }
}


.your-mail-disclaimer-upload {
	
	@media (max-width: 1024px){
		text-align: start !important;
	}
	
	text-align: end;
	margin-top: -32px;
}

#comments {
	/* ungerade Kommentare */
	ol.comment-list li.comment.odd > article.comment-body {
	  /*background: #FFFDE6;
	  border-radius: 8px;
	  border-block-end: none;*/
	  margin-bottom: 8px;
	  padding: 12px;
	}
	
	/* gerade Kommentare */
	ol.comment-list li.comment.even > article.comment-body {
	  /*background: #E8F1F8;
	  border-radius: 8px;
	  border-block-end: none;*/
	  /*border-color: #72AAD2;*/	
	  margin-bottom: 8px;
	  padding: 12px;
	}
	
	/* nur der letzte Kommentar ganz unten, oberste Ebene */
	ol.comment-list > li.comment:last-of-type > article.comment-body {
		border-block-end: none;
	}
	
	.comment-meta .avatar {
			display:none;
		}
		
	.comment-metadata {
		padding-right: 24px;
		
		time {
			color: #333333;
		}
	}

	.comment-respond {
		 box-shadow: 0px 0px 8px 0px #E8F1F8;
		padding: 24px 40px 24px 40px;
		border-radius: 8px;
		margin-top: 8px;
		margin-bottom: 8px;
		
		@media (max-width: 1024px){
		padding: 8px 16px 8px 16px;
		}
		
		#reply-title {
			font-size: 24px;
			
			small{
				margin-left: 24px;
			}
		}

		

		textarea#comment, input#author, input#email {
			margin-top: 8px;
		}
		
		input.submit {
			margin-top: 8px;
			padding: 8px 16px 8px 16px;
            height: 42px;

			
			@media (max-width:1024px){
				width: 100%
			}
		}
		
		.comment-form {
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: space-between;
			
			.comment-form-comment {width:100%;}
			.comment-form-author{width:48%;}
			.comment-form-email{width:48%;}
			.form-submit{width:100%;}
			
			@media (max-width: 767px){
			.comment-form-author{width:100%;}
			.comment-form-email{width:100%;}
			}
		}
	}
}

.hr-produkte-flex, .hr-zubehoer-flex {
	display: flex;
    flex-direction: row;
    gap: 24px;
	row-gap: 60px;
	
	@media (max-width:767px){
		flex-direction: column;
		align-items: center;	
		}	
	
	.hr-produkte-item {
		display: flex;
		flex-direction: column;
		width: 200px;
		gap: 8px;
		
		img {
			height: 200px;
			border-radius: 8px;
			transition: all 0.3s ease-in-out;
			object-fit: cover;
			box-shadow: 0px 0px 8px 8px #F7F7F7;
			
			&:hover {
				transform: scale(1.03);	
			}
		}
		
		.hr-produkte-titel {
			text-align: center;
			color: #1471B4;
		}
	}
	
}






/* Elementor Lightbox Navigation mit Chevron Icons */

.elementor-lightbox .elementor-swiper-button-next,
.elementor-lightbox .elementor-swiper-button-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  visibility: visible;
  cursor: pointer;
  z-index: 1000;
}

/* Position links und rechts */
.elementor-lightbox .elementor-swiper-button-prev {
  left: 20px;
}

.elementor-lightbox .elementor-swiper-button-next {
  right: 20px;
}