/*
Theme Name: FTW Gaming Child
Theme URI: https://ftw-gaming.de
Description: FTW Gaming Theme Child für die individuelle Anpassung der Website.
Author: Dustin Sommerfeld
Author URI: https://dustin-sommerfeld.de
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
*/

/* ### GENERAL ### */

/** general **/

/* form input */

.elementor-field-group .elementor-field-textual:focus {
	box-shadow: none;
}

/* page content width 1200px */

@media (min-width: 1200px) {
	.page-header .entry-title, 
	.site-footer .footer-inner, 
	.site-footer:not(.dynamic-footer), 
	.site-header .header-inner, 
	.site-header:not(.dynamic-header), 
	body:not([class*=elementor-page-]) .site-main {
		max-width: 1200px;
	}

	main {
		padding: 20px 0 40px 0;
	}
}

/** Slide Out Mobile Menu **/

/* edit the hamburger and close icon colors here */

.lytbox-button {
	--hamburger-color: #FFF;
	--close-x-color: #222;
	display: block;
	height: 18px;
	cursor: pointer;
	position: relative;
	z-index: 101;
}

/* must add in elementor template ID number to make the menu full width */
.elementor-572 {
	width: 100%;
}

/* end editing */

.lytbox-navigation {
	position: fixed;
	top: 0;
	left: 0;
	transform: translateX(-100%);
	overflow: hidden;
	transition: transform .5s;
	width: 100%;
	height: 100vh;
	z-index: 100;
}

.lytbox-navigation {
	display: flex;
	justify-content: center;
	align-items: center;
}

/* toggle hamburger*/

.lytbox-button .hamburguer {
	position: relative;
}

.lytbox-button .hamburguer span{
	display: block;
	height: 1px;
	width: 24px;
	background: var(--hamburger-color);
	transform-origin: 50% 50%;
	transition: all 0.1s 0.2s ease, transform 0.2s ease;
}

.lytbox-button .hamburguer span:nth-child(2) {
	transform: translate(0, 6px);
}

.lytbox-button .hamburguer span:nth-child(3) {
	transform: translate(0, 12px);

}

.lytbox-nav_control {
	position: absolute;
	left: -9999px;
	width: 100%;
	clip: rect(0, 0, 0, 0);
}

.lytbox-nav_control:checked~.lytbox-navigation {
	transform: translateX(0);
	opacity: 1;
	transition: transform .5s, opacity .5s;
}

.lytbox-nav_control:checked~.lytbox-button .hamburguer {
	transition: all 0.1s 0s ease;
}

/* closed X */

.lytbox-nav_control:checked~.lytbox-button .hamburguer span {
	background: var(--close-x-color);
	transition: all 0.1s ease, transform 0.1s 0.2s ease;
}

.lytbox-nav_control:checked~.lytbox-button .hamburguer span:first-child {
	opacity: 0;
}

.lytbox-nav_control:checked~.lytbox-button  .hamburguer span:nth-child(2) {
	transform: translate(0, 5px) rotate(45deg);
}

.lytbox-nav_control:checked~.lytbox-button .hamburguer span:nth-child(3) {
	transform: translate(0, 4px) rotate(-45deg);
}

@media only screen and (max-width: 1024px) {
	span.woocommerce-Price-amount.amount {
		display: none;
	}
}

/* Menu Item Cart Header */

#elementor-menu-cart__toggle_button:focus {
	background-color: transparent;
}

/* Configurator */

.wpc-form.wpc-cart-form.cart {
	margin-left: 10px;
	margin-bottom: 0 !important;
}

span.wpc-primary-btn {
	background-color: transparent !important;
	color: #FFF !important;
	border: 1px solid #FFF !important;
}

span.wpc-primary-btn:hover {
	background-color: #FFF !important;
	color: #222 !important;
	border: 1px solid #FFF !important;
}

.woocommerce-message {
	background-color: #111;
	color: #fff;
	padding: 16px 24px;
	border-radius: 0px;
	border: 0;
	font-size: 16px;
	font-family: 'Exo', sans-serif;
	text-align: center;
	margin: 80px auto 30px;
	width: fit-content;
	max-width: 90%;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	animation: none !important;
	transition: none !important;

}

.woocommerce-message a.button {
	background-color: #dd1817;
	color: #fff !important;
	font-weight: 500;
	padding: 12px 36px;
	border-radius: 16px 0;
	text-decoration: none;
	transition: background 0.3s ease;
	outline: none !important;
	box-shadow: none !important;
}

.woocommerce-message a.button:hover,
.woocommerce-message a.button:focus {
	background-color: #b01312;
	color: #fff;
	outline: none !important;
	box-shadow: none !important;
}

@media (min-width: 768px) {
	.woocommerce-message {
		width: 680px;
		max-width: 680px;
	}
}

@media (min-width: 1024px) {
	.woocommerce-message {
		width: 720px;
		max-width: 720px;
	}
}

@media (min-width: 1440px) {
	.woocommerce-message {
		width: 850px;
		max-width: 850px;
	}
}

/* next level feature page */

.next-level-feature-grid-box {
	text-decoration: none !important;
}

/* home - stickdrift section */

.stickdrift-headline-custom-size h2 {
	font-size: var(--fs-h2);
	overflow-wrap: break-word;
	word-break: break;
}

/* top bar carousel */

.topbar-header-carousel {
	max-height: 44px;
}

@media (max-width: 1023px) {
	.topbar-header-carousel {
		max-height: 40px;
	}
}

@media (max-width: 599px) {
	.topbar-header-carousel {
		max-height: 36px;
	}
}

/* home slider */

.home-carousel-slider .swiper-slide {
	height: 85vh;
}

.home-carousel-slider .swiper-pagination {
	padding-bottom: 5%;
}

@media screen and (max-width: 767px)  {
	.mobile-break { 
		display: none; 
	}

	.home-carousel-slider .swiper-pagination {
		padding-bottom: 15%!important;
	}
}

@media screen and (max-width: 479px)  {
	.mobile-break { 
		display: none; 
	}

	.home-carousel-slider .swiper-pagination {
		padding-bottom: 10%!important;
	}
}

/* home slider - win tag */

.home-slider-carousel-win-tag {
	color: #DD1817!important; 
	text-shadow: 0px 0px 48px #DD1817!important;
}

/* Blog */

hr.wp-block-separator {
	margin: 2rem 0;
	border: 1px solid rgba(255, 255, 255, .1) !important;
}

.wp-block-quote {
	border-left: 5px solid #DD1817;
	padding-left: 1rem;
}

article.elementor-post.has-post-thumbnail {
	flex-direction: row;
}

@media screen and (max-width: 1439px) {
	.wp-block-list li {
		font-size: 14px!important;
	}

	article.elementor-post.has-post-thumbnail {
		flex-direction: row!important;
	}
}

@media screen and (max-width: 767px) {
	.wp-block-list li {
		font-size: 14px!important;
	}

	article.elementor-post.has-post-thumbnail {
		flex-direction: column!important;
	}
} 

@media screen and (max-width: 599px) {
	.wp-block-list li {
		font-size: 12px!important;
	}

	article.elementor-post.has-post-thumbnail {
		flex-direction: column!important;
	}
}

/* Header - Cart Text */

@media screen and (max-width: 1023px) {
	a#elementor-menu-cart__toggle_button {
		padding: 4px 0 0 0!important;
	}

	.elementor-menu-cart__toggle .elementor-button .elementor-button-text {
		display: none;
	}
}

/* Header - Sticky Top Bar */

.home-top-bar {
	--gap: 24px;
	overflow: hidden;
}

.home-top-bar__track {
	display: flex;
	gap: var(--gap);
}

.home-top-bar-column {
	flex: 0 0 auto;
	box-sizing: border-box;
	margin: 0 !important;
	text-align: center;
}

@media (min-width: 768px) {
	.home-top-bar__track {
		justify-content: space-around;
		align-items: center;
		gap: 0;
	}
	
	.home-top-bar-column {
		flex: 1 1 auto;
		max-width: none;
	}

	body { 
		padding-top: 0; 
	}
}

@media (max-width: 767px) {
	:root { 
		--topbar-h: 40px; 
	}

	.home-top-bar {
		--gap: 0;
		position: fixed;
		top: 0; left: 0; right: 0;
		height: var(--topbar-h);
		z-index: 2000;
		background: #000;
		box-shadow: 0 2px 6px rgba(0,0,0,.25);
		padding-top: env(safe-area-inset-top, 0px); /* iOS Notch */
	}

	body {
		padding-top: calc(var(--topbar-h) + env(safe-area-inset-top, 0px));
	}

	.home-top-bar__track {
		justify-content: center;
		align-items: center;
		height: 100%;
	}

	.home-top-bar-column {
		display: none !important;
		width: 100%;
	}
	
	.home-top-bar__track > .home-top-bar-column:first-child {
		display: flex !important;
		justify-content: center;
		align-items: center;
		gap: 8px;
		height: 100%;
		text-align: center;
	}
}

/* ### SHOP ENGINE + WOOCOMMERCE ### */

/* WooCommerce Messages */

.woocommerce-message {
  transition: all 0.5s ease;
}

.woocommerce-message.fade-out {
  opacity: 0;
  transform: translateY(-20px);
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

/* Product Single Page Tabs

.woocommerce-tabs h2 {
    display: none;
}

.woocommerce div.product.elementor .woocommerce-tabs .panel {
	padding: 0px;
}

.dwspecs-product-table .dwspecs-product-table-group .group-title {
    font-size: 1.5rem;
    margin-bottom: 1.5rem;
    color: #222;
}

.woocommerce-tabs.wc-tabs-wrapper {
    display: flex;
    flex-direction: row;
	gap: 60px;
	padding: 0 5px;
}

.woocommerce-tabs ul.tabs.wc-tabs {
    display: flex;
    flex-direction: column;
    width: 100%;
	max-width: 250px;
    gap: 10px;
}

.woocommerce-tabs ul.wc-tabs {
    padding: 0 10px!important;
	margin-right: 10px;
}

.woocommerce-tabs ul.wc-tabs li a {
	width: 100%;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	background: #CCC;
}

.woocommerce-tabs .elementor-column-gap-wide>.elementor-column>.elementor-element-populated {
    padding: 0px;
}

div#tab-description .elementor-col-50,
div#tab-dwspecs_product_specifications,
div#tab-reviews {
    width: 100%;
}

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .stock {
	color: #f3ac49;
	font-weight: 500;
}

.woocommerce #reviews #comments ol.commentlist {
	padding: 0;
    padding-inline-start: 0px;
}

span#reply-title {
    display: none;
}

div#tab-dwspecs_product_specifications {
    font-size: 13px;
}

@media only screen and (max-width: 1240px) {
	.single-product-content-top,
	.single-product-breadcrumbs-top {
		padding: 0 25px;
	}
	
	.woocommerce-tabs.wc-tabs-wrapper {
		padding: 0 20px;
		gap: 20px;
	}
	
}


@media only screen and (max-width: 1024px) {
	.woocommerce-tabs.wc-tabs-wrapper {
		padding: 0 20px;
	}
}

@media only screen and (max-width: 992px) {
	.woocommerce-tabs.wc-tabs-wrapper {
		flex-direction: column;
		padding: 0 25px;
	}
	
	.woocommerce-tabs ul.tabs.wc-tabs {
		flex-direction: row;
		max-width: none;
	}
	
	
	.woocommerce div.product .woocommerce-tabs ul.tabs li {
		margin-right: -7px;
	}
	
	.woocommerce-tabs ul.wc-tabs {
		padding: 0 5px !important;
	}
}


@media only screen and (max-width: 767px) {
	.single-product-content-top {
		padding: 0;
	}
}

@media only screen and (max-width: 565px) {
	.woocommerce-tabs ul.tabs.wc-tabs {
		flex-direction: column;
		max-width: none;
		padding-right: 10px !important;
	}
}

*/

/* Paypal */

.ppcp-messages {
    margin-top: 16px;
}

/* Rating link */

.woocommerce-review-link {
	padding-top: 6px;
}

/* Product Archive Sortierung */

.woocommerce-ordering select {
    background-color: transparent;
    color: #222;
    border-radius: 0px;
	border-top: none;
	border-right: none;
	border-bottom: 1px solid #222;
	border-left: none;
    padding: 12px 0;
	margin-bottom: 20px;
}

.woocommerce a.added_to_cart {
	display: none;
}

.custom-single-product-cart-button a.span::after {
	font-family: WooCommerce;
    content: "\e017";
    margin-left: .53em;
    vertical-align: bottom;
}

/* Delete Icon on cart page */

.shopengine-widget .shopengine-cart-table .shopengine-table__body-item--td:first-child .product-thumbnail .product-remove a {
    background-color: #222;
    opacity: 1 !important;
}

.shopengine-widget .shopengine-cart-table .shopengine-table__body-item--td:first-child .product-thumbnail .product-remove a:hover {
	background-color: #000;
}

/* Product Name change to German */

#order_review th.product-name {
    font-size: 0;
}

#order_review th.product-name::before {
    content: "Produkt";
	font-size: 14.4px;
    display: block;
}

/* Customized Dropdown */

.shopengine-widget .select2.select2-container .select2-selection--single .select2-selection__arrow > b {
	display: none;
}

span.select2-dropdown.select2-dropdown--below {
    background: #f7f8fb;
    border: 1px solid #ccc;
}

/* Customized Submit order box */

span.woocommerce-terms-and-conditions-checkbox-text {
    margin-top: -6px;
}

.shopengine-widget .shopengine-checkout-payment #payment .wc_payment_method label, .shopengine-widget .shopengine-checkout-payment #payment .woocommerce-terms-and-conditions-wrapper label {
    align-items: flex-start!important;
}

.shopengine-widget .shopengine-checkout-payment #payment .wc_payment_method label abbr.required, .shopengine-widget .shopengine-checkout-payment #payment .woocommerce-terms-and-conditions-wrapper label abbr.required {
    margin-top: -10px;
}

.woocommerce-terms-and-conditions,
.woocommerce-terms-and-conditions h2 {
	margin-top: 20px;
    color: #222;
}

label.woocommerce-form__label.woocommerce-form__label-for-checkbox.checkbox {
    margin-top: 20px !important;
}

.shopengine-widget .shopengine-checkout-payment #payment ul {
    padding: 16px 16px 0 16px !important;
}

.shopengine-widget .shopengine-checkout-payment #payment ul li:not(:last-child) {
    margin-bottom: 10px;
}

.shopengine-widget .shopengine-checkout-payment a.woocommerce-privacy-policy-link {
	color: var( --e-global-color-accent )!important;
}

.shopengine-widget .shopengine-checkout-payment a.woocommerce-privacy-policy-link:hover {
	color: var( --e-global-color-05467f2 )!important;
}

.shopengine-widget .shopengine-checkout-payment #payment .wc_payment_method .payment_box, 
.shopengine-widget .shopengine-checkout-payment #payment .woocommerce-terms-and-conditions-wrapper .payment_box {
	max-width: 100%;
}

/* Summary Cart Item Layout */
/* Show the configuration with a better design */

dl.variation {
	display: block;
	grid-template-columns: auto 1fr;
	column-gap: 12px;
	row-gap: 6px;
	margin-top: 10px;
	font-size: 14px!important;
	line-height: 1.6;
	font-weight: 500!important;
	letter-spacing: 0;
	color: #222!important;
}

dl.variation dt {
	text-align: left!important; 
	font-size: 14px!important;
	font-weight: 500!important;
	display: inline-block;
	vertical-align: top;
	width: 48%;
	margin: 0 1%;
	padding-bottom: 4px;
	letter-spacing: 0;
	color: #222!important;
}

dl.variation dd {
	font-size: 14px!important;
	display: inline-block;
	font-weight: 500!important;
	vertical-align: top;
	width: 48%;
	margin: 0 1%;
	padding-bottom: 4px;
	letter-spacing: 0;
	color: #222!important;
}

dl.variation dt span {
	font-size: 14px!important;
	color: #222!important;
	font-weight: 500!important;
	letter-spacing: 0;
}

dl.variation dd span {
	font-size: 14px!important;
	color: #222!important;
	font-weight: 500!important;
	letter-spacing: 0;
}

/* Remove buttons to show configuration and change the configuration on desktop in the slide out cart menu from the right */

@media (min-width: 768px) {
  .elementor-menu-cart__product-name .wpc-cart-after-title-link-wrapper {
    display: none !important;
  }
}

/* Elementor Menu Cart Slide Out delete icon */

.elementor-menu-cart__product-remove {
	background: #222!important;
	color: #FFF!important;
	border: 0!important;
}

.elementor-menu-cart__product-remove:after, 
.elementor-menu-cart__product-remove:before {
	background: #FFF!important;
}

/* Display Order and Customer Details on thank you page */

section.woocommerce-order-details,
section.woocommerce-customer-details {
    display: block !important;
}

/* Disable list style element in menu on account page */

.shopengine-widget .shopengine-account-navigation ul li a::before {
	display: none!important;
}

/* Margin Top Fix for account page */

.mein-konto-login-register-margin-top {
	margin-top: 20px!important;
}

/* Make Create Account label visible */

.create-account {
    color: #000;
    font-weight: bold;
}

/* Mollie Components for paying */

.mollie-components .mollie-component {
    padding: 8px;
	max-height: 34px;
	border-radius: 0px!important;
	box-shadow: none;
	border: 1px solid #CCC!important;
}

/* Product Page - Price Tag */

.woocommerce-variation-price {
    font-size: 32px;
	line-height: 32px!important;
}

@media only screen and (max-width: 1024px) {
    span.woocommerce-Price-amount.amount {
        display: block!important;
    }
	
	.woocommerce-variation-price {
		font-size: 26px!important;
		line-height: 26px!important;
	}
}

@media screen and (max-width: 599px) {
	.woocommerce-variation-price {
		font-size: 20px!important;
		line-height: 20px!important;
	}
}

/* Product Page - Variation Swatches */

@media screen and (max-width: 1024px) {
	.shopengine-swatches .variations tr {
		flex-direction: column !important;
		align-items: flex-start !important;
		gap: 2px !important;
	}
}

/* Product Page - Zoom Icon */

.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
	z-index: 20!important;
}

/* Cross Sell Popup Cart Page */

.cross-sell-popup .dialog-close-button svg {
	fill: #FFF!important;
}

@media screen and (max-width: 767px) {
	.cross-sell-popup .dialog-close-button svg {
		fill: #222!important;
	}
}

/* Order Page */

.shopengine-account-orders th.woocommerce-orders-table__cell.woocommerce-orders-table__cell-order-number {
	border: 0 !important;
	background: none !important;
	align-items: center;
	display: flex;
}

.shopengine-account-orders .woocommerce-orders-table thead {
	background: #f7f8fb!important;
}

/* Order Details Page */

.shopengine-account-order-details section.woocommerce-columns.woocommerce-columns--2.woocommerce-columns--addresses.col2-set.addresses {
	margin-top: 40px !important;
	background-color: #f7f8fb;
	padding: 20px;
	display: flex!important;
}

.shopengine-account-order-details section.woocommerce-order-details {
	background-color: #f7f8fb;
	padding: 20px 20px 5px 20px;
}

/* Disable Downloads Section */

.shopengine-account-navigation li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--downloads {
	display: none!important;
}

/* Billing Address */

.shopengine-account-order-details .woocommerce-column.woocommerce-column--1.woocommerce-column--billing-address.col-1 {
	width: 50%!important;
}

.shopengine-account-order-details .woocommerce-column.woocommerce-column--2.woocommerce-column--shipping-address.col-2 {
	width: 50%!important;
}

/* Adresses */

.shopengine-account-address-form form button.button {
	border-radius: 16px 0 !important;
}

.u-columns.woocommerce-Addresses.col2-set.addresses h2,
.shopengine-account-address.billing.shopengine-account-address-form h2,
.shopengine-account-address.shipping.shopengine-account-address-form h2 {
	color: #222;
}

/* Product Carousel */

.shopengine-widget .shopengine-product-carousel .shopengine-single-product-item .product-title a {
	text-decoration: none!important;
}

/* Checkout Button */ 

.shopengine-widget .shopengine-cart-totals .cart_totals .wc-proceed-to-checkout .button,
.shopengine-widget .shopengine-cart-totals .cart_totals .wc-proceed-to-checkout .button:hover,
.shopengine-widget .shopengine-cart-totals .cart_totals .wc-proceed-to-checkout .button:focus,
.shopengine-widget .shopengine-cart-totals .cart_totals .wc-proceed-to-checkout .button:active,
#place_order,
#place_order:hover,
#place_order:focus,
#place_order:active {
	font-size: 16px!important;
	background-color: #dd1817!important;
	color: #fff!important;
	position: relative;
}

#place-order {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.shopengine-widget .shopengine-cart-totals .cart_totals .wc-proceed-to-checkout .button::after,
#place_order::after {
    content: ""!important;
	display: inline-block;
    width: 0.01em;
    height: 0.01em;
    background-color: #FFF;
    -webkit-mask: url("https://ftw-gaming.de/wp-content/uploads/2025/09/gg_spinner.svg") no-repeat center;
    -webkit-mask-size: contain;
    mask: url("https://ftw-gaming.de/wp-content/uploads/2025/09/gg_spinner.svg") no-repeat center;
    mask-size: contain;
	opacity: 0;
    animation: spin 1s linear infinite;
}

.shopengine-widget .shopengine-cart-totals .cart_totals .wc-proceed-to-checkout .button.loading::after,
#place_order.loading::after {
	opacity: 1;
	width: 1.4em;
    height: 1.4em;
	animation: spin 1s linear infinite;
	transform: translateY(-50%);
}

@keyframes spin {
  from { transform: translateY(-50%) rotate(0deg); }
  to   { transform: translateY(-50%) rotate(360deg); }
}

/* ### ORDER TIP PLUGIN ### */

/* Order Tip CSS */

div#wooot_order_tip_form {
    display: flex;
    gap: 20px;
	width: 100%;
	flex-flow: wrap;
}

#wooot_order_tip_form button {
	font-size: 13px;
	font-weight: 500;
    height: 40px;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 12px;
    background-color: #AAA;
    color: #FFF;
    border-radius: 0px;
    border: 0;
    box-shadow: none;
}

#wooot_order_tip_form button:hover {
    background-color: var( --e-global-color-9f196bb );
}

#wooot_order_tip_form button.active {
	background-color: var( --e-global-color-9f196bb );
}

#wooot_order_tip_form button.woo_order_tip_remove,
#wooot_order_tip_form button.woo_order_tip_apply {
    background-color: var( --e-global-color-primary );
	border-radius: 16px 0;
	padding: 12px 36px;
}

#wooot_order_tip_form button.woo_order_tip_remove:hover,
#wooot_order_tip_form button.woo_order_tip_apply:hover {
    background-color: var( --e-global-color-secondary );
}

span.tip-label-suffix {
    background-color: #f7f8fb;
    color: #222;
    padding: 2px 8px;
    border-radius: 0px;
    margin-left: 6px;
}

p.form-row.woo_order_tip_custom_text_field {
    margin: 0;
    padding: 0;
}

input.input-text.woo_order_tip_custom_text {
    max-width: 100px;
}

.woocommerce form .form-row.woocommerce-validated input.input-text, 
.woocommerce form .form-row.woocommerce-validated select {
    border-radius: 0px !important;
    height: 40px !important;
	border: 1px solid var( --e-global-color-116ff49 );
}

.woocommerce form .form-row.woocommerce-validated input:focus, 
.woocommerce form .form-row.woocommerce-validated select:focus {
	outline: none;
	box-shadow: none;
}

/* ### KONFIGURATOR ### */

@media screen and (max-width: 1024px) {
	.wpc-floating-icons {
		display: none!important;
	}
}

@media screen and (max-width: 1024px) {
	.wpc-preview-parent-wrap {
		margin-top: -20px;
		margin-right: auto;
	}
}

.wpc-sub-controls .wpc-control-lists .wpc-control-lists-inner > li.current {
	box-shadow: inset 100vh 0em #111!important;
}

/* Mobile Layout */

.mobile-only {
	display: block;
}

.desktop-only {
	display: none;
}

img.wpc-control-item-icon {
	width: 40px;
	height: 40px;
}

@media (min-width: 769px) {
	.mobile-only {
		display: none;
	}

	.desktop-only {
		display: flex;
	}

	.wpc-parent-control {
		display: none;
	}
	
	.wpc-control-item .wpc-layer-img img {
		display: block;
		width: 42px;
		height: 40px;
		object-fit: cover;
		border-radius: 0px;
	}
}

@media (max-width: 768px) {
	.wpc-sub-control.wpc-current-opened-group {
		border-left: 1px solid #FFF;
	}
	
	.wpc-controls-wrap {
		border-left: none;
	}
	
	.wpc-layer-title-wrap.wpc-group-opened.wpc-current-opened-group {
        outline: none!important;
        background: #ddd!important;
        border-radius: 0px!important;
    }
	
	button.wpc-primary-btn.js-wpc-submit-cart-form {
		padding: 4px 18px;
		font-size: 12px;
		text-transform: none;
		height: 36px;
	}
	
	body.wpc-step-single-configurator {
		padding-top: 0px;
	}
	
	.wpc-parent-control .wpc-layer-title-wrap .wpc-layer-img {
		margin: 0 8px!important;
	}
	
	.wpc-parent-control {
		display: block;
		padding: 0 10px;
	}

	.wpc-setup-skin-controls {
		padding: 10px;
	}

	.wpc-control-next-previous {
		justify-content: flex-end;
		gap: 16px
	}

	.wpc-control-item-breadcrumbs {
		margin-top: 0px!important;
		margin: 0px!important;
		align-items: center;
		height: 27px;
		display: flex;
	}

	.wpc-control-lists.wpc-parent-control.wpc-show-control-set {
		overflow-x: hidden !important;
	}

	.wpc-control-lists {
		overflow-x: hidden !important;
	}

	.wpc-control-lists-inner {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		padding: 0.5rem 0;
		margin: 0;
		list-style: none;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
	}

	.wpc-control-lists .wpc-close {
		display: none;
	}
	
	.wpc-parent-control li {
		margin-bottom: 0px;
	}

	.wpc-control-lists-inner::-webkit-scrollbar {
		height: 0;
	}

	.wpc-control-item {
		scroll-snap-align: start;
		flex: 0 0 auto;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
	}

	.wpc-control-item .wpc-layer-title-wrap {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		min-width: 64px;
		padding: 0.5rem 0.25rem;
		border-radius: 0.5rem;
		cursor: pointer;
		text-align: center;
		background: transparent;
	}

	.wpc-control-item .wpc-layer-img {
		display: block;
		line-height: 0;
	}

	.wpc-control-item .wpc-layer-img img {
		display: block;
		width: 42px;
		height: 40px;
		object-fit: cover;
		border-radius: 0px;
	}

	.wpc-control-item .wpc-layer-title-inner,
	.wpc-control-item .wpc-layer-title,
	.wpc-control-item .wpc-layer-title-text {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
		border: 0;
	}

	.wpc-control-item.wpc-group-active .wpc-layer-title-wrap,
	.wpc-control-item .wpc-layer-title-wrap.wpc-group-opened,
	.wpc-control-item .wpc-layer-title-wrap.wpc-current-opened-group {
		outline: 2px solid rgba(255, 255, 255, 0.2);
		background: rgba(255, 255, 255, 0.06);
	}

	.wpc-control-item .wpc-layer-title-wrap:hover,
	.wpc-control-item .wpc-layer-title-wrap:focus-visible {
		outline: 2px solid currentColor;
	}
}

/* ### CONTACT FORM 7 ### */

form.wpcf7-form input[type=date], 
form.wpcf7-form input[type=email], 
form.wpcf7-form input[type=number], 
form.wpcf7-form input[type=password], 
form.wpcf7-form input[type=search], 
form.wpcf7-form input[type=tel], 
form.wpcf7-form input[type=text], 
form.wpcf7-form input[type=url], 
form.wpcf7-form select, 
form.wpcf7-form textarea {
    border: 0!important;
    border-radius: 0px!important;
    border-bottom: 1px solid #CCC!important;
    padding: 0.5rem 0!important;
    transition: all .3s;
    width: 100%;
    background: transparent!important;
	color: #FFF!important;
	margin-bottom: 10px!important;
}

form.wpcf7-form label {
    color: #FFF;
	font-weight: 500;
}

/* ### CONTROLLER GLOW EFFECT ### */

#controller-glow-effect,
.controller-glow-target {
	will-change: filter;
	--blur-base: 8px;
	filter: drop-shadow(0 0 var(--blur-base) var(--glow));
}

#controller-glow-effect.glow-pulse,
.controller-glow-target.glow-pulse {
	--glow-rgb: 221, 24, 23;
	--glow: rgba(var(--glow-rgb), 0.66);
	--glow0: rgba(var(--glow-rgb), 0);
	--blur1: 8px;
	--blur2: 10px;
	--blur3: 12px;
	animation: pulse-glow 3.4s ease-in-out infinite;
}

@keyframes pulse-glow {
	0%, 100% {
		filter: drop-shadow(0 0 var(--blur-base) var(--glow));
	}
	50% {
		filter:
			drop-shadow(0 0 var(--blur-base) var(--glow))
			drop-shadow(0 0 var(--blur1) var(--glow))
			drop-shadow(0 0 var(--blur2) var(--glow))
			drop-shadow(0 0 var(--blur3) var(--glow));
	}
}


@media (prefers-reduced-motion: reduce) {
	#controller-glow-effect.glow-pulse,
	.controller-glow-target.glow-pulse {
		animation: none;
	}
}

/* ### CART PROGRESS ### */

/* --- Basis / Desktop: horizontale Step-Leiste --- */

.cart-value-steps-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    font-size: 14px;
    color: #f5f5f5;
}

.cart-value-steps-heading {
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 16px;
}

/* Container der Steps – horizontal nebeneinander */
.cart-value-steps {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-top: 8px;
    padding-top: 26px;   /* Platz über der Linie (Top-Text) */
    padding-bottom: 12px;/* Platz unter der Linie (Bottom-Text) */
}

/* Grundlinie (grau) */
.cart-value-steps-line {
    position: absolute;
    left: 0;
    right: 0;
    top: 76px;
    height: 4px;
    background: #666;
    transform: translateY(-50%);
    z-index: 1;
    border-radius: 999px;
}

/* Rote Füllung */
.cart-value-steps-line-fill {
    height: 100%;
    width: 0;
    background: #e53935;
    border-radius: 999px;
    transition: width 0.3s ease;
}

/* Einzelner Step */
.cart-value-step {
    position: relative;
    flex: 1;
    text-align: center;
    z-index: 2; /* über der Linie */
}

/* Top-Text (statt Icons) */
.cart-value-step-top {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 12px;
    color: #fff;
}

/* Kreis in der Mitte */
.cart-value-step-circle {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #555;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 0 0 2px #111, 0 0 0 3px #666;
}

/* Häkchen / Nummer */
.cart-value-step-check,
.cart-value-step-number {
    line-height: 1;
}

/* Erreichte Steps -> rote Kreise mit Häkchen */
.cart-value-step.is-reached .cart-value-step-circle {
    background: #e53935;
    box-shadow: 0 0 0 2px #111, 0 0 0 3px #e53935;
}

/* Unterer Text – Benefit */
.cart-value-step-bottom {
    margin-top: 10px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}

/* ----------------------------- */
/* Tablet & Mobile: vertikale Timeline */
/* ----------------------------- */

/* ----------------------------- */
/* Tablet & Mobile: vertikale Timeline */
/* ----------------------------- */
@media (max-width: 991px) {

    .cart-value-steps-heading {
        font-size: 22px;
        margin-bottom: 20px;
    }

    /* Container wird vertikal, links Platz für Linie + Kreise */
    .cart-value-steps {
        position: relative;
        display: block;
        padding-left: 0px;   /* Abstand für Linie + Kreise links */
        margin-top: 8px;
        padding-top: 0;
        padding-bottom: 0;
    }

    /* Vertikale Linie links */
    .cart-value-steps-line {
        position: absolute;
        left: 60px;           /* Position der Linienmitte */
        top: 0;
        bottom: 0;
        width: 4px;
        height: auto;
        background: #666;
        border-radius: 999px;
        transform: none;
        z-index: 1;
    }

    .cart-value-steps-line-fill {
        width: 100%;
        height: 100%;
    }

    /* Jeder Step ist ein „Eintrag“ auf der Timeline */
    .cart-value-step {
        position: relative;
        margin-bottom: 22px;
        text-align: left;
		margin-left: 100px;
        z-index: 2;
    }

    /* Kreis sitzt exakt auf der Linie */
    .cart-value-step-circle {
        position: absolute;
        left: -52px;
        top: -4px;
        margin: 0;
    }

    /* Textbereich rechts vom Kreis */
    .cart-value-step-top,
    .cart-value-step-bottom {
        display: inline;
        font-size: 15px;
        margin: 0;
    }

    /* "ab 150 € Kostenloses Ladekabel" in einer Zeile */
    .cart-value-step-top {
        font-weight: 500;
        color: #fff;
    }

    .cart-value-step-top::after {
        content: " ";
    }

    .cart-value-step-bottom {
        font-weight: 600;
    }
}

@media (max-width: 575px) {
    .cart-value-steps-wrapper {
        font-size: 13px;
    }

    .cart-value-steps-heading {
        font-size: 18px;
    }

    .cart-value-step-top,
    .cart-value-step-bottom {
        font-size: 14px;
    }
}