.clearer {clear:both;}

@font-face {
	font-family: 'Greycliff Regular';
	font-weight: 400;
	font-display: auto;
	src: url('../fonts/greycliff-cf-regular.woff2') format('woff2'), url('../fonts/greycliff-cf-regular.woff') format('woff'), url('../fonts/greycliff-cf-regular.ttf') format('truetype'), url('../fonts/greycliff-cf-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/greycliff-cf-regular.svg') format('svg');
}

@font-face {
	font-family: 'Greycliff Bold';
	font-weight: 400;
	font-display: auto;
	src: url('../fonts/greycliff-cf-bold.woff2') format('woff2'), url('../fonts/greycliff-cf-bold.woff') format('woff'), url('../fonts/greycliff-cf-bold.ttf') format('truetype'), url('../fonts/greycliff-cf-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/greycliff-cf-bold.svg') format('svg');
}

body {
	background-color: white;
	
}

h1, :root :where(h1, h2, h3, h4, h5, h6), body {
	font-family: 'Greycliff Bold'!important;
}

body.home{
	height: 100%;
}

body.home main .wp-block-post-title{
	display: none;
}

body.home .logo-banner{
	padding-right: 10px !important;
	padding-left: 10px !important;
}

body.home .logo-banner > figure{
	width: 100%;
	max-width: 1300px;
}

body.home .logo-banner figure > img{
	width: 100%;
}

body.home .welcome-image{
	max-width: 600px;
	margin: 50px 25px;
}

body.home header{
	display: none;
}

body.home main,
body.home main .entry-content{
	margin-top: 0;
	padding-top: 0;
}

body main{
	background: url("../images/Hintergrund.svg");
	background-size: cover;
	background-position: center;
	min-height: 100vh;
	background-attachment: fixed;
	margin-top:0;
	padding-top: 30px;
}

body .has-base-2-background-color {background-color: transparent!important;}

/*** TEMP ***/
#shopping-cart-data-container 
	{background: #f7f7f7;
		padding: 1px 15px 15px;
		border-radius: 15px;}

#shopping-cart-data-container button
		{font-size: 16px;
		padding: 5px 15px;border-radius: 15px;border: 1px solid #777;}

#load_order_data_cookie
	{background: #777;color:#fff;border-color: #777;}

/*** HEADER ***/
header .has-base-background-color
	{
		background: #0054a1 !important;
	padding: 0!important;
	}

header a
	{color:#fff!important;}

.custom-logo-link {padding: 10px 15px 8px 15px;background: #fff;}

main > .wp-block-group > div {padding: 0!important;height: auto!important;}
/*
h1,
:root :where(h1, h2, h3, h4, h5, h6),
body {
	font-family: Helvetica, Arial, serif !important;}
*/

body .pum-container {max-width: 800px!important;}

h1
	{font-size: 40px!important;margin: 50px auto;}

body.home .wp-block-button
	{width: 100%;display: block;margin: 0 auto;text-align: center;}

body.home .wp-block-button > a
	{
		max-width: 400px;
		margin: 0 auto;
		width: 100%;
		display: flex;
		border-radius: 0;
		align-content: center;
		align-items: center;
		background-size: contain;
		justify-content: center;
		font-size: 30px;
		text-transform: uppercase;
		flex-direction: column;
		background-color: #0054a1;
		padding: 0;
		padding-bottom: 10px;
		font-weight: 500;
		}
		
body.home .wp-block-button > a::before{
	content: "";
	width: 100%;
	aspect-ratio: 1.9;
	background-color: #ed9309;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 190%;
	border-bottom: 5px solid white;
	margin-bottom: 10px;
}

body.home .wp-block-button.order-btn > a::before{
		background-image: url("../images/Icons_1.svg");
}

body.home .wp-block-button.retour-btn > a::before{
		background-image: url("../images/Icons_4.svg");
}

body.home .wp-block-button.receipt-of-goods-btn > a::before{
		background-image: url("../images/Icons_2.svg");
}

body.home .wp-block-button.request-btn > a::before{
		background-image: url("../images/Icons_3.svg");
}



.wp-block-navigation__responsive-container {background-color: #0054a1!important;}

button:focus,
button:active,
.wp-block-navigation__responsive-container *:focus,
.wp-block-navigation__responsive-container *:active,
.wp-block-navigation__responsive-container *,
.wp-block-navigation__responsive-container a {border:0!important;outline: 0!important;}

button.wp-block-navigation__responsive-container-open  {margin-right: 15px!important;}

.wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg
	{fill:#fff!important;}

/*** FORM ***/

.autoComplete_wrapper {
  display: inline-block;
  position: relative;
}

.autoComplete_wrapper > input {
  height: 3rem;
  width: 370px;
  margin: 0;
  padding: 0 2rem 0 3.2rem;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 1rem;
  text-overflow: ellipsis;
  color: rgba(0, 0, 0, 0.3);
  outline: none;
  border-radius: 10rem;
  border: 0.05rem solid rgba(0, 0, 0, 0.5);
  background-image: url("data:image/svg+xml,%3Csvg height='20px' width='20px' viewBox='0 0 24 24' fill='none' stroke='rgba(0, 0, 0, 0.3)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' preserveAspectRatio='xMidYMid meet' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10.5' cy='10.5' r='7.5' vector-effect='non-scaling-stroke'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='15.8' y2='15.8' vector-effect='non-scaling-stroke'%3E%3C/line%3E%3C/svg%3E");
  background-size: 1.4rem;
  background-position: left 1.05rem top 0.8rem;
  background-repeat: no-repeat;
  background-origin: border-box;
  background-color: #fff;
  transition: all 0.4s ease;
  -webkit-transition: all -webkit-transform 0.4s ease;
}

.autoComplete_wrapper > input::placeholder {
  color: rgba(0, 0, 0, 0.5);
  transition: all 0.3s ease;
  -webkit-transition: all -webkit-transform 0.3s ease;
}

.autoComplete_wrapper > input:hover::placeholder {
  color: rgba(0, 0, 0, 0.6);
  transition: all 0.3s ease;
  -webkit-transition: all -webkit-transform 0.3s ease;
}

.autoComplete_wrapper > input:focus::placeholder {
  padding: 0.1rem 0.6rem;
  font-size: 0.95rem;
  color: rgba(0, 0, 0, 0.4);
}

.autoComplete_wrapper > input:focus::selection {
  background-color: rgba(0, 0, 0, 0.2);
}

.autoComplete_wrapper > input::selection {
  background-color: rgba(0, 0, 0, 0.2);
}

.autoComplete_wrapper > input:hover {
  color: rgba(114, 174, 230, 0.8);
  transition: all 0.3s ease;
  -webkit-transition: all -webkit-transform 0.3s ease;
}

.autoComplete_wrapper > input:focus {
  color: rgba(114, 174, 230, 1);
  border: 0.06rem solid rgba(114, 174, 230, 0.8);
}

.autoComplete_wrapper > ul {
  position: absolute;
  max-height: 50vh;
  overflow-y: scroll;
  box-sizing: border-box;
  left: 0;
  right: 0;
  margin: 0.5rem 0 0 0;
  padding: 0;
  z-index: 1;
  list-style: none;
  border-radius: 0.6rem;
  background-color: #fff;
  border: 1px solid rgba(33, 33, 33, 0.07);
  box-shadow: 0 3px 6px rgba(149, 157, 165, 0.15);
  outline: none;
  transition: opacity 0.15s ease-in-out;
  -moz-transition: opacity 0.15s ease-in-out;
  -webkit-transition: opacity 0.15s ease-in-out;
}

.autoComplete_wrapper > ul[hidden],
.autoComplete_wrapper > ul:empty {
  display: block;
  opacity: 0;
  transform: scale(0);
}

.autoComplete_wrapper > ul > li {
  margin: 0.3rem;
  padding: 0.3rem 0.5rem;
  text-align: left;
  font-size: 1rem;
  color: #212121;
  border-radius: 0.35rem;
  background-color: rgba(255, 255, 255, 1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.2s ease;
}

.autoComplete_wrapper > ul > li mark {
  background-color: transparent;
  color: rgba(114, 174, 230, 1);
  font-weight: bold;
}

.autoComplete_wrapper > ul > li:hover {
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.2);
}

.autoComplete_wrapper > ul > li[aria-selected="true"] {
  background-color: rgba(0, 0, 0, 0.2);
}

#autoComplete,
#autoCompleteProducts,
.autoComplete_wrapper
	{width: 100%;max-width: 1000px;}


.container {
	display: flex;
	/*border-radius: 15px;*/
	background-color: #dcdcdc;
}
.lines {
	display: inline-block;
	text-align: right;
	padding-right: 10px;
	padding-top: 8px;
	line-height: 25px;
	padding-left: 10px;
	min-width: 30px;
}
.lines span {
	cursor: pointer;
	color: red;
	font-weight: bold;
}
.textarea-container {
	position: relative;
	width: 100%;
}

textarea {
	width: 100%;
	overflow: hidden;
	overflow-x: auto;
	resize: none; /* Verhindert manuelles Ändern der Größe */
	white-space: pre; 
	/* overflow-x: scroll; */
}

.textarea-container textarea {
	background-color:#ececec;
}

/*** DISABLE QUFORM ELEMENTS ***/
div.quform-element-1_5,
div.quform-label-1_8
	{display: none;}


form input,
form textarea,
form select,
form .autoComplete_wrapper > input {
	border: 1px solid #e3e3e3;
	border-radius: 15px;
		background-color: #fad39a;
		height: auto;
		min-height: 3rem;
		font-size: 16px;
		line-height: 20px;
		padding: 5px 15px;
		font-family: Inter, sans-serif;
		color: #000!important;
	}
	
form .autoComplete_wrapper > input {
	padding-left: 50px;
}	

form input:focus,
form select:focus,
form textarea:focus,
form .autoComplete_wrapper > input:focus
	{color:#000;outline:0;border-color:#000!important;}

form button[type="submit"],
form input[type="submit"] {
	background: #ed9309;
	color: #fff!important;
	border-color:#ed9309;
	/*border-radius: 15px;*/
	padding: 10px 25px;
	text-transform: uppercase;
	font-weight: 900;
	font-size: 18px;
	border: 0;
}

.ac-p-w > input
	{width: 70px;}
.ac-p-w > .autoComplete_wrapper
	{width: calc(100% - 85px);margin-left: 15px;}

.ac-p-w > input,
.ac-p-w > .autoComplete_wrapper
	{float:left;display:inline;position:relative;}

/*** SEARCH NEW ***/

#search {
  display:block;
  width:100%;
  font-size:16px;
  box-sizing:border-box;
  height:40px;
  }
  .autocomplete-items {
	position: absolute;
	border: 1px solid #d4d4d4;
	border-bottom: none;
	border-top: none;
	z-index: 99;
	top: 40px;
	left: 0;
	right: 0;
	max-height:80vh;
	overflow-y:auto;
  }
  .autocomplete-item {
	padding: 10px;
	cursor: pointer;
	background-color: #fff;
	border-bottom: 1px solid #d4d4d4;
  }
  .autocomplete-item:hover {
	background-color: #e9e9e9;
  }


body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull))
	{max-width: 1000px!important;}


body .quform-element-textarea.quform-element-1_8
	{margin-top: 15px;}

.ac-products #productAmount
	{width: 100px;}

.ac-products #amount-label
	{width: 60px;}

.ac-products #sku-label
	{width: 150px;}

.ac-products #matchcode-label
	{width: 150px;}


.ac-products #title-label
	{width: calc(100% - 508px);}


.ac-products #add-product-button
	{width: 48px;float: right !important;}

.ac-products #productAmount,
.ac-products #amount-label,
.ac-products #title-label,
.ac-products #sku-label,
.ac-products #matchcode-label,
.ac-products #add-product-button
	{float: left;display: inline;position: relative;}

.ac-products #amount-label,
.ac-products #title-label,
.ac-products #matchcode-label,
.ac-products #sku-label
	{line-height: 48px;padding-left: 15px;}

.autoComplete_info_wrapper
	{margin-top: 15px;}

.button {
	display: inline-block;
	background: "#ed9309";
	min-width: 48px;
	text-align: center;
	height: 48px;
	line-height: 48px;
	text-decoration: none;
	font-weight: 900;
	color: #fff;
	/*border-radius: 15px;*/
	border: 0;
	font-size: 18px;
	padding: 0 15px;
}

/*** FORMS STYLING ***/

#spinner {
	position: absolute;
	margin-left: 4px;
	width: 48px;
	height: 48px;
}

.quform-option {
	display: inline-block;
}

.quform-field-radio {
	display: none;
}

.quform-option-label span {
	display: inline-block;
	width: 100%;
	height: 80px;
	line-height: 80px;
	background-color: #fad39a;
	color: #000;
	/*border-radius: 15px;*/
	text-align: center;
	cursor: pointer;
	transition: background-color 0.3s;
	margin-bottom: 20px;
}
.quform-field-radio:hover + .quform-option-label span,
.quform-field-radio:checked + .quform-option-label span {
	background-color: #ed9309;
	color: white;
}

.quform-option input.urgent + label.quform-option-label > span {
	height: auto;
	line-height: 16px;
	background-color: transparent;
	margin-bottom: 0;
}

.urgent-wrap .quform-option {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: baseline;
	align-content: center;
	justify-content: flex-start;
	column-gap: 10px;
}

.urgent-wrap .quform-label {
	display: none;
}


body .quform-description
	{font-style: normal;}

.urgent-wrap .quform-option input {
	min-height: auto;
}


.quform-option .quform-option-label
	{padding-left: 0!important;}


body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_18.quform-element-row > .quform-element:first-child,
body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_29.quform-element-row > .quform-element:first-child,
body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_47.quform-element-row > .quform-element:first-child
	{padding-left: 0;}

body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_18.quform-element-row > .quform-element:last-child,
body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_29.quform-element-row > .quform-element:last-child,
body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_47.quform-element-row > .quform-element:last-child
	{padding-right: 0;}	


#kontakt {
	padding: 50px 0 0 90px;
}

.kontaktinfos {
	line-height: 60px;	
}

body .bestellungzeiten {
	margin-top: -30px!important;
	margin-bottom:50px!important;
}

@media only screen and (max-width: 900px) {
	
	.ac-products #sku-label,
	.ac-products #matchcode-label,
		{width: calc(100% - 120px);}
	  
	.ac-products #title-label
		{width: calc(100% - 48px);}

	.autoComplete_wrapper > ul > li
		{white-space: normal}
	
}


@media only screen and (max-width: 600px) {
  body.home .entry-content{
	padding: 0px;
  }
  
  .autoComplete_wrapper > input {
	width: 18rem;
  }
  
  body .has-global-padding
  	{padding-left: 15px;padding-right: 15px;}
  
  
  .ac-p-w > input,
  .ac-p-w > .autoComplete_wrapper
	  {float:none;display:block;position:relative;width: 100%;margin-left: 0;margin-bottom: 7px;}


	.quform-option-label span {
		margin-bottom: 30px;
	}	  

#wp--skip-link--target > div.entry-content.wp-block-post-content.has-global-padding.is-layout-constrained.wp-block-post-content-is-layout-constrained > div {
		padding-left: 0px !important;
		padding-right: 0px !important;
		margin: auto;
		margin-top: 15px;
	}
	
	html,
	body {overflow-x: hidden!important;}
	
	body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_18.quform-element-row > .quform-element,
	body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_29.quform-element-row > .quform-element,
	body .quform-1 .quform-child-elements .quform-element.quform-element-row-1_47.quform-element-row > .quform-element
		{padding-left: 0!important;padding-right: 0!important;}


body.home #wp--skip-link--target > div.entry-content.wp-block-post-content.has-global-padding.is-layout-constrained.wp-block-post-content-is-layout-constrained > div {

			max-width: 100%!important;
		}
		
	body.home .wp-block-button > a
		{font-size: 24px;min-height: 130px;}	
  
}


#autocomplete-list li{
	height: auto;
	display: flex;
	justify-content: start;
	align-items: start;
	max-height: calc(3 * 1.6em);
}


/**** Product Textarea ****/
#lineNumbers > div{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

#lineNumbers > div > span{
	height: 30px;
	aspect-ratio: 1;
}

#lineNumbers > div > span > img{
	padding: 5px;
}

.container .textarea-container > textarea{
	line-height: 30px;
}

.product-img-container{
	height: 40px;
	min-width: 40px;
	aspect-ratio: 1;
	overflow: hidden;
	margin-right: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.product-img-container .product-image{
	width: 100%;
	object-fit: contain;
}

#fav-list-select{
	max-width: 100%;
}

.catalog-select-container > select{
	max-width: calc(100% - 140px);
}

#autocomplete-list li .details-container{
	white-space: normal;
}

@media only screen and (max-width: 480px) {
  #autocomplete-list li {
    font-size: 14px;
    max-height: calc(3 * 1.6em);
    overflow: hidden;
  }
}

/****** Product image preview *******/
#product-img-preview{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}

#product-img-preview img{
	width: 100%;
	max-width: 600px;
	max-height: 600px;
	object-fit: contain;
}

@media screen and (max-width: 700px) {
    #product-img-preview img {
        height: 80vw;
    }
	
	body .bestellungh1 {
		flex-direction: column-reverse;
	}
	
	body .bestellungzeiten {
		margin-bottom: 0!important;
	}
}

input, textarea, select{
	border-radius: 0px !important;
}

.baustelle-error{
	padding: 7px 0px;
}

.baustelle-error .quform-error-inner{
	padding: 3px 15px;
    margin: 0;
    background-color: #f2dede;
    color: #b94a48;
    border-left: 5px solid #c73412;
    max-width: 100%;
}
.product-not-available{
	opacity: 0.6;
}

#package-table input[type='number']{
	width: 100%;
}