/*
Theme Name: Elbnetz
Template: Impreza
Version: 1.0
Author:	Elbnetz GmbH
Theme URI: https://elbnetz.com/
Author URI: https://elbnetz.com/
*/

/*Add your own styles here:*/

:root {
  --radius: 0.3em;
  --blur: blur(6px);
  --shadow: ;
  --border: var(--border-width) solid var(--color-white);
	--border-width: 0.2rem;
	--padding-kasten: 2rem;
	--color-focus: var(--color-white);
	--font-size-h1: clamp(2.222rem, 1.348rem + 2.049vw, 3.056rem)!important;
	--font-size-h2: clamp(1.389rem, 1.097rem + 0.683vw, 1.667rem)!important;
	--font-size-h3: clamp(1.111rem, 0.82rem + 0.683vw, 1.389rem)!important;
	--font-size-h4: clamp(1.111rem, 0.82rem + 0.683vw, 1.389rem)!important;
 
	/* Abstände */
	/*128px*/
	--padding-2xl: clamp(2.4rem, -0.118rem + 6.557vw, 4.8rem);
	/*96px*/
	--padding-xl: clamp(5.333rem, 5.333rem + 0vw, 5.333rem);
	/*64px*/
	--padding-l: clamp(3.556rem, 3.556rem + 0vw, 3.556rem);
	/*36px*/
	--padding-m: clamp(2rem, 2rem + 0vw, 2rem);
	/*16px*/
	--padding-s: clamp(0.6rem, 0.39rem + 0.546vw, 0.8rem);
}

/* ---
 * Schriften 
 * --- */
/* --- Wortumbruch - hyphens/Silbentrennung --- */
h1, h2, h3, h4  {
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto; 
  hyphenate-limit-chars: 12 3 4; /*Trenne ab 12 Buchstaben, frühestens aber nach dem 3. und lasse am Ende mind. 4 stehen */
}

/* --- Uppercase --- */
span.en_uppercase {
	text-transform: uppercase;
}


/* Wert min-viewport 768px
 * Wert max-viewport 1500px
h: 30 - 55
h2: 25 - 30
h3: 20 - 25
*/

/* --- H1 --- */
body .en_like_h1 {
font-size: var(--font-size-h1)!important;
}

/* --- H2 --- */
body .en_like_h2 {
font-size: var(--font-size-h2);
}

/* --- H3 --- */
body .en_like_h3 {
font-size: var(--font-size-h3)!important;
}

body .en_like_h4 {
font-size: var(--font-size-h4);
	color: var(--color-white);
}

/* Bechreibungskasten weg wenn kein Produktinhalt */
.en_description:not(:has(.post_content)) {
	display:none;
}

/* hält den btn unten */
.w-vwrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/* Filter Produkte Shop */
.w-filter-item select {
	border-radius: 0!important;
	background: var(--color-black);
	border: 0.2rem solid var(--color-accent);
	text-transform: uppercase;
	font-weight: 700;
	color: var(--color-white)!important;
}
.w-filter.state_desktop.layout_hor .w-filter-item.type_dropdown .w-filter-item-values:after {
	right: 0;
	color: var(--color-white)!important;
}
.w-filter-item select:hover {
	border-radius: 0!important;
	background: var(--color-accent);
	border: 0.1rem solid var(--color-accent);
	color: var(--color-black)!important;
}
.input:not([type=submit]), select {
	line-height: 1!important;
}
.w-filter-item.type_dropdown .w-filter-item-values:hover::after {
	color: var(--color-black)!important;
}
.w-filter.state_desktop.layout_hor .w-filter-item.type_dropdown .w-filter-item-values:Hover:after {
	color: var(--color-black)!important;
}

/* Filter Mobile Ansicht */
.state_mobiles .w-filter-list {
	background: var(--color-black)!important;
	padding-top: 5rem!important;
}
.w-filter.state_mobile .w-filter-list {
	bottom: 0;
} 

/* ---
* Theme-Korrektur 
* —-- */
/* Fix für feststehende Bilder mobil iOS */
@media only screen and (max-device-width: 1300px) {
	.state_mobiles section {
	background-attachment: initial!important;
	}
}
/* Horizontales Seitenscrolling verhindern */
.l-canvas {
	overflow: hidden;
}

/* Farben für Markierungen */
::-moz-selection { 
	background: var(--color-content-secondary);
	color: var(--color-white);
}
::selection { 
	background: var(--color-content-secondary);
	color: var(--color-black);
}


/* --- 
 * Design Standards
 * --- */
.w-btn-wrapper.woocommerce a {
	display: flex;
	align-items: center;
	height: 100%;
}

/* --- Schatten --- */
.en_shadow {
	box-shadow: var(--shadow);
}

/* --- Blur --- */
.en_blur {
    -webkit-backdrop-filter: var(--blur); /* Safari */
	backdrop-filter: var(--blur);
	background: rgba(255,255,255,0.5);
}

/* ---
 * Header 
 * --- */
#page-header {
	border-bottom: var(--border-width) solid var(--color-white);
	background: var(--color-black);
	padding-bottom: 30px;
}

#page-header .l-subheader.at_bottom {
	padding-top: 20px;
}

.state_tablets #page-header {
	padding-top: 20px;
	padding-bottom: 20px;
}
.state_mobiles #page-header {
	padding-top: 20px;
	padding-bottom: 20px;
}

.l-section:first-child {
	margin-top: calc(var(--padding-2xl)*1.5);
}

/* --- Submenu --- */
nav.type_desktop .en_hide_desktop  {
	display: none;
}

/* ---
 * Footer
 * --- */
#page-footer {
	background: var(--color-black);
	border-top: var(--border);
}
#page-footer .l-section:first-child {
  margin-top: unset;
}
#page-footer {
	max-width: unset;
}

/* --- 
 * Karussell / Slider 
 * --- */
/* --- Button --- */
.owl-carousel .owl-nav button {
	top: 100%;
	width: 30px!important;
	height: 40px!important;
	font-size: 1rem!important;
}
.owl-carousel .owl-nav button.owl-prev {
	left: calc(1.5rem + var(--border-width));
}
.owl-carousel .owl-nav button.owl-next {
	right: calc(1.5rem + var(--border-width));
}
/* Nav dots */
.owl-carousel .owl-dot span {
	background: none;
	border: 1px solid var(--color-accent);
	border-radius: 0;
	height: 0.5rem;
}
.owl-carousel .owl-dot.active span {
	background: var(--color-accent)!important;
}
.state_mobiles .owl-prev, .state_mobiles .owl-next {
	margin-top: 1rem!important;
}

/* --- Dots --- */
.owl-dots button span {
	width: 30px!important;
	border-radius: 2px;
	background: var(--color-blue);
	box-shadow: none!important;
	transition: all 0.4s ease-in-out;
}
.owl-dots button.active span {
	width: 40px!important;
	background: var(--color-green)!important;
	box-shadow: none!important;
}

/* ---
 * FAQ / Akkordeon 
 * --- */
.en_acc.accordion>div>.w-tabs-section {
	background: var(--color-black);
	border-width: 0.2rem 0 0 0;
}

.en_acc .w-tabs-sections:last-child {
	border-bottom: 0.2rem solid var(--color-white);
}

.en_acc .w-tabs-section-header.active .w-tabs-section-title {
	color: var(--color-accent);
}

.en_acc .w-tabs-section-header:hover {
	color: var(--color-accent);
}

/* --- 
 * Filter / Search & Filter (Plugin)
 * --- */

/* ---
 * Teaser (Raster / Karussell)
 * --- */
.en_teaser_produktkategorie {
	background: var(--color-black)!important;
	border: var(--border-width) solid var(--color-white);
	padding: 2rem;
	height: 100%;
}
.en_teaser_produktkategorie.w-hwrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between!important;
}

/* --- 
 * Kontaktformular
 * --- */
::-ms-input-placeholder { /* Edge 12-18 */
  color: var(--color-black);
  /*opacity: 1;*/
}

::placeholder {
  color: var(--color-black);
  /*opacity: 1;*/
}


/* --- 
 * WooCommerce 
 * --- */
.w-grid-item-h .w-vwrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/* Nach Kasse/Bestellbestätigung*/
.woocommerce-order-received main .l-section-h .g-cols{
	background: var(--color-black);
	border: var(--border);
	padding-left: var(--padding-m);
	padding-right: var(--padding-m);
	padding-top: var(--padding-l);
	padding-bottom: var(--padding-l);
	margin-bottom: 5rem;
}
.woocommerce-table--order-details {
	background: var(--color-black)!important;
}
.woocommerce-bacs-bank-details {
	border-top: calc(var(--border-width)/2) solid var(--color-white);
	padding-top: 3rem;
		width: 50%;
}

.woocommerce-order-details {
	border-top: calc(var(--border-width)/2) solid var(--color-white);
	padding-top: 3rem;
	width: 50%;
} 

.state_mobiles .woocommerce-order-details, .state_mobiles .woocommerce-bacs-bank-details {
	width: 100%!important;
} 
.wc-bacs-bank-details-account-name {
	color: var(--color-white);
}

.state_mobiles .woocommerce-table--order-details {
	border: none;
	width: 100%!important;
}


/* Border um Produktbilder herum */ 
.en_product_single .w-post-elm img {
	border: var(--border-width) solid var(--color-accent);
	height: 400px!important;
	width: 400px!important;
	object-fit: contain!important;
	background: var(--color-black);
}
.w-post-elm.en_product_page_img img {
	border: var(--border-width) solid var(--color-accent);					background: var(--color-black);
}

.en_kasten {
	background: var(--color-black);
	border: var(--border);
}

table.variations div.woocommerce-select {
	/border: 0.1rem solid white;
	background: black;
}

.en_product_details .w-tabs-sections {
	background: var(--color-black);
	padding: var(--padding-kasten);
}
.w-tabs.style_default.layout_hor>.w-tabs-list .w-tabs-item.active{
	background: var(--color-black);
	border-width: var(--border-width) 0 0 0;
}

.w-tabs-list .w-tabs-item {
	border-width: 4px 0 0 0;
}

.w-tabs-section-content {
	padding-top: unset;
}

/* Buttons sollen beide 50% einnehmen */
.w-hwrapper {
	display: flex;
}
.w-btn-wrapper {
	flex: 1!important;
	text-align: center!important;
}
.w-btn.en_btn_details {
	display: flex;
  align-items: center;
  justify-content: center; 
  height: 100%;
}

/* Warenkorb Anzeige hinter Button */
.added_to_cart.wc-forward {
	margin:0!important;
}
.order-tax {
	display: none!important;
}
.w-cart-totals tr.woocommerce-shipping-totals {
	flex-wrap: nowrap!important;
}
.w-cart-totals .shop_table tr.woocommerce-shipping-totals td{
	padding-top: 13px!important;
}
.state_mobiles .w-cart-totals {
	padding-left:1rem!important;
	padding-right:1rem!important;
	padding-bottom:1rem!important;
}

/* Rundungen entfernt bei Optionauswahl */
.woocommerce-select select {
	border-radius: 0;
	background: var(--color-black);
	color: var(--color-white);
}

/* Kasse - Rechnungsdetails */
.select2-dropdown {
	background: var(--color-black)!important;
	//border: 3px solid white;
}
.select2-results__option--highlighted {
	color: var(--color-black)!important;
	background: var(--color-input)!important;
}
.order-total th, .order-total .woocommerce-Price-amount{
	color: var(--color-accent);
}

/* Zahlungsart */
#order_payment_heading::before {
    content: "Zahlungsart";
    display: block;
    visibility: visible;
    position: relative;
	margin-bottom: -40px;
}
#order_payment_heading {
    visibility: hidden;
    position: relative;
}

.dhl-preferred-service-content {
	display: none;
}

.form-row.place-order {
	margin-top: var(--padding-l)!important;
}

.form-row.place-order button {
	margin-top: var(--padding-s)!important;
}

/*Ausverkauft Funktion*/ 
.stock.out-of-stock {
	text-transform: uppercase!important;
	margin: 0!important;
}

/* Kleinunternehmerregelung kleiner */
.small-business-info {
	font-size: 1rem!important;
}

/* Warenkorb Seite */
.woocommerce .cart_totals {
	padding: unset;
}

/* Shop Table Head volle opacity */
.woocommerce .shop_table thead th {
	opacity: 1;
}

/* ---
 * Barrierefreiheit
 * ---*/

.pum-content:focus {
	display: none!important;
}

*:focus:not(:focus-visible) {
	outline: none!important;
} 

*:focus-visible {
	outline: 2px solid var(--color-focus)!important;
    outline-offset: 2px;
}

/* --- Impreza-Standard --- */
a:focus-visible, button:focus-visible, input[type=checkbox]:focus-visible + i, input[type=checkbox]:focus-visible + .w-color-switch-box, input[type=submit]:focus-visible {
	outline: 2px solid var(--color-focus)!important; 
}
/* --- Grids/Raster & Karussell --- */
article .w-grid-item-h:focus-within  {
	border: var(--border) solid var(--color-focus)!important;
outline-offset: 4px!important;
}
/* --- Dots & Arrows --- */

/* --- Links --- */
p > a:focus {
	outline: 1px solid var(--color-focus)!important;
outline-offset: 2px!important;
	color: var(--color-focus);
}
/* --- Button (a) --- */
.w-btn:focus-visible  {
	outline: 2px solid var(--color-focus)!important;
}

/* --- Formulare --- */
form input:focus-visible {
	outline: 2px solid var(--color-focus-2)!important;
}
form button:focus-visible {
	outline: 2px solid var(--color-focus-2)!important;
}

/* Triggerwarnung Popup */
.pum-container{
	padding-bottom:6.5rem!important;
	padding-top: var(--padding-kasten)!important;
	padding-left: var(--padding-kasten)!important;
	padding-right: var(--padding-kasten)!important;
}
.state_mobiles .pum-container {
	padding-bottom: 6rem!important;
	padding-top: 2rem!important;
	padding-left: 1rem!important;
	padding-right: 1rem!important;
}
.pum-content {
	margin-top: 2rem!important;
	font-size: 1rem!important;
}
.pum-close {
	margin-bottom: 2rem!important;
	font-size: 1rem!important;
	text-transform: uppercase!important;
	font-weight: 700!important;
	padding-left: 1rem!important;
	padding-right: 1rem!important;
	padding-bottom: 0.7rem!important;
	padding-top: 0.7rem!important;
}
.state_mobiles .pum-close {
	width: 90%!important;
}

/* Zurück nach oben Button */
.fa-angle-up:before {
	color: var(--color-white);
}
.fa-angle-up:hover:before {
	color: var(--color-black);
}
.w-toplink:hover {
	background: var(--color-accent)!important;
}

/* --- Responsive ---*/
.state_mobiles .vc_column-inner, .state_mobiles .g-cols.vc_row { 
	padding-left: 1.2rem!important;
	padding-right: 1.2rem!important;
}
.state_mobiles .w-vwrapper {
	padding-left: 0.8rem!important;
	padding-right: 0.8rem!important;
}
.state_mobiles .woocommerce-gzd-legal-checkbox-text {
	font-weight: 400;
	font-size: 0.8rem;
}
.state_mobiles .order-total {
	font-size: 1.2rem!important;
}
.state_mobiles .wc-gzd-additional-info, .state-mobiles .woocommerce table.shop_table td {
	text-align: left;
}

table.woocommerce-checkout-review-order-table {
    border-spacing: 0 1rem; 
    border-collapse: separate; 
}

@media (min-width: 1025px) and (max-width: 1280px) {
	.g-cols.via_flex.type_default>div[class*="vc_col-lg-"] {
		margin-top: 0!important; 
		margin-bottom: 0!important;
	}
}
.button .w-btn-label {
   display: flex!important;
   justify-content: center!important; 
   height: 100%!important; 
   width: 100%!important; 
}

.state_mobiles {
	--padding-kasten: 0.8rem;
}

.state_tablets .g-cols.stacking_default.via_flex > div:not([class*="vc_col-xs"]){
	margin: 0 0 0.2rem!important;
}