.elementor-783 .elementor-element.elementor-element-3b8076ec{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:200px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0%;--padding-bottom:0%;--padding-left:8%;--padding-right:8%;}.elementor-783 .elementor-element.elementor-element-41a068ee{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:10%;}.elementor-783 .elementor-element.elementor-element-17afd5d9{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 50px) 0px;}.elementor-783 .elementor-element.elementor-element-17afd5d9 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:22px;font-weight:300;text-transform:none;font-style:normal;text-decoration:none;line-height:1.5em;letter-spacing:0px;color:#1C244B;}.elementor-783 .elementor-element.elementor-element-33929923{text-align:start;}.elementor-783 .elementor-element.elementor-element-33929923 .elementor-heading-title{color:#1C244B;}.elementor-783 .elementor-element.elementor-element-27a202f6{width:var( --container-widget-width, 507px );max-width:507px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 40px) 0px;--container-widget-width:507px;--container-widget-flex-grow:0;color:var( --e-global-color-text );}.woocommerce .elementor-783 .elementor-element.elementor-element-5b1bea19 .price{color:#1C244B;font-family:"Poppins", Sans-serif;font-size:36px;font-weight:600;text-transform:capitalize;font-style:normal;text-decoration:none;line-height:1.1em;letter-spacing:0px;word-spacing:0em;}.woocommerce .elementor-783 .elementor-element.elementor-element-5b1bea19 .price ins{color:#324A6D;font-family:"Poppins", Sans-serif;font-size:36px;font-weight:600;text-transform:capitalize;font-style:normal;text-decoration:none;line-height:1.1em;letter-spacing:0px;word-spacing:0em;}body:not(.rtl) .elementor-783 .elementor-element.elementor-element-5b1bea19:not(.elementor-product-price-block-yes) del{margin-right:10px;}body.rtl .elementor-783 .elementor-element.elementor-element-5b1bea19:not(.elementor-product-price-block-yes) del{margin-left:10px;}.elementor-783 .elementor-element.elementor-element-5b1bea19.elementor-product-price-block-yes del{margin-bottom:10px;}.elementor-783 .elementor-element.elementor-element-3db12 .cart button, .elementor-783 .elementor-element.elementor-element-3db12 .cart .button{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:400;text-transform:capitalize;font-style:normal;text-decoration:none;line-height:1em;letter-spacing:0px;word-spacing:0em;border-style:solid;border-width:1px 1px 1px 1px;border-radius:30px 30px 30px 30px;padding:15px 50px 15px 50px;color:#FFFFFF;background-color:#467FF7;border-color:#467FF7;transition:all 0.2s;}.elementor-783 .elementor-element.elementor-element-3db12 .cart button:hover, .elementor-783 .elementor-element.elementor-element-3db12 .cart .button:hover{color:#467FF7;background-color:#02010100;border-color:#467FF7;}.elementor-783 .elementor-element.elementor-element-3db12{--button-spacing:38px;}.elementor-783 .elementor-element.elementor-element-3db12 .quantity .qty{border-radius:0px 0px 0px 0px;color:#1C244B;border-color:#1C244B;transition:all 0.2s;}.woocommerce .elementor-783 .elementor-element.elementor-element-3db12 form.cart .variations{width:0%;}.woocommerce .elementor-783 .elementor-element.elementor-element-3db12 form.cart table.variations label{color:var( --e-global-color-accent );font-family:"Author", Sans-serif;font-size:1.4rem;font-weight:300;line-height:1.8rem;}.elementor-783 .elementor-element.elementor-element-5756ef63{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.woocommerce .elementor-783 .elementor-element.elementor-element-619cc74 .woocommerce-product-gallery__trigger + .woocommerce-product-gallery__wrapper,
					.woocommerce .elementor-783 .elementor-element.elementor-element-619cc74 .flex-viewport{border-radius:30px 30px 30px 30px;}.woocommerce .elementor-783 .elementor-element.elementor-element-619cc74 .flex-viewport:not(:last-child){margin-bottom:13px;}.woocommerce .elementor-783 .elementor-element.elementor-element-619cc74 .flex-control-thumbs img{border-radius:15px 15px 15px 15px;}.woocommerce .elementor-783 .elementor-element.elementor-element-619cc74 .flex-control-thumbs li{padding-right:calc(13px / 2);padding-left:calc(13px / 2);padding-bottom:13px;}.woocommerce .elementor-783 .elementor-element.elementor-element-619cc74 .flex-control-thumbs{margin-right:calc(-13px / 2);margin-left:calc(-13px / 2);}.elementor-783 .elementor-element.elementor-element-74c2101 .elementor-wrapper{--video-aspect-ratio:1.77777;}@media(max-width:1024px){.elementor-783 .elementor-element.elementor-element-3b8076ec{--flex-direction:column-reverse;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:0%;--padding-bottom:0%;--padding-left:5%;--padding-right:5%;}.elementor-783 .elementor-element.elementor-element-41a068ee{--padding-top:0%;--padding-bottom:0%;--padding-left:0%;--padding-right:5%;}.elementor-783 .elementor-element.elementor-element-17afd5d9{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-783 .elementor-element.elementor-element-17afd5d9 .elementor-heading-title{font-size:14px;}.elementor-783 .elementor-element.elementor-element-27a202f6{width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.woocommerce .elementor-783 .elementor-element.elementor-element-5b1bea19 .price{font-size:25px;}.woocommerce .elementor-783 .elementor-element.elementor-element-5b1bea19 .price ins{font-size:25px;}.elementor-783 .elementor-element.elementor-element-3db12 .cart button, .elementor-783 .elementor-element.elementor-element-3db12 .cart .button{font-size:14px;}}@media(max-width:767px){.elementor-783 .elementor-element.elementor-element-3b8076ec{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:120px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.woocommerce .elementor-783 .elementor-element.elementor-element-5b1bea19 .price{font-size:20px;}.woocommerce .elementor-783 .elementor-element.elementor-element-5b1bea19 .price ins{font-size:20px;}.elementor-783 .elementor-element.elementor-element-5756ef63{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--flex-wrap:nowrap;--margin-top:10%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;}}@media(min-width:768px){.elementor-783 .elementor-element.elementor-element-3b8076ec{--content-width:1650px;}.elementor-783 .elementor-element.elementor-element-41a068ee{--width:100%;}.elementor-783 .elementor-element.elementor-element-5756ef63{--width:100%;}}@media(max-width:1024px) and (min-width:768px){.elementor-783 .elementor-element.elementor-element-5756ef63{--width:80%;}}/* Start custom CSS *//* ==========================================================================
   WPC Composite Products - Wilfatec Custom Styling
   ========================================================================== */

/* 1. ÜBERSCHRIFTEN (Produktbasis, Controller, Stromverteilung) */
.wooco_component_name {
    font-family: 'Author', sans-serif !important;
    font-size: 1.3rem !important;
    font-weight: 400 !important;
    color: #0163d !important; /* Dunkles Blau/Anthrazit für edle Optik */
    margin-bottom: 12px !important;
    margin-top: 20px !important;
    display: block !important;
}

/* 2. DIE PRODUKT-KARTEN (Standard-Zustand im Grid) */
.wooco_component_product_selection_grid_item {
    border: 0.25px solid #edf2fd !important; 
    border-radius: 12px !important;
    background-color: #ffffff !important;
    padding: 15px !important;
    transition: all 0.25s ease-in-out !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important; /* Weicher Elementor-Schatten */
    position: relative;
}

/* Hover-Effekt für die Karten */
.wooco_component_product_selection_grid_item:hover {
    border-color: #4186ff !important; /* Euer Hellgrün */
    box-shadow: 0 10px 15px -3px rgba(115, 207, 17, 0.1) !important;
}

/* 3. DIE AKTIVIERTE / AUSGEWÄHLTE KARTE (Klasse aus deinem Quelltext: wooco_item_selected) */
.wooco_component_product_selection_grid_item.wooco_item_selected {
    border: 1px solid #4186ff !important; /* Euer kräftiges Grün */
    border-radius: 12px !important;       /* Gleicher Eckenradius wie oben */
    background-color: rgba(237, 242, 253, 0.2) !important; /* Minimaler grüner Schimmer */
}

/* 4. SCHRIFTART UNTER DEN BILDERN (z.B. 1 x CR1142) */
.wooco_component_product_selection_grid_item_name {
    font-family: 'TBJ Interval', sans-serif !important;
    font-size: 0.85rem !important;
    font-weight: 400 !important;
    color: #0163d !important;
    text-align: center !important;
    margin-top: 10px !important;
}

/* 5. PREISE AUSBLENDEN (Falls im Plugin noch aktiv, da "Fake-Shop") */
.wooco_component_product_selection_grid_item .amount,
.wooco_component_product_selection_grid_item del,
.wooco_component_product_selection_grid_item ins,
.screen-reader-text {
    display: none !important;
}


/* --- 1. LINK-ICON (DIE FIXE LÖSUNG) --- */
.wooco_component_product_selection_grid_item_link {
    /* Box-Styling: Rund & Hintergrund */
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important; /* Macht es perfekt kreisrund */
    background-color: #ffffff !important; /* Die hellblaue Farbe aus deinem Screenshot */
    border: 0px solid #ffffff !important; /* Weißer Rand */
    box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
    
    /* Text "CR1140" und das alte Icon komplett unsichtbar machen */
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    
    /* Positionierung oben links auf der Karte */
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 99 !important;
    
    /* DEIN NEUES SVG DIREKT ALS HINTERGRUND */
    background-image: url('https://wilfatec.de/wp-content/uploads/2026/05/arrow-up-right-from-square.svg') !important;
    background-size: 14px 14px !important; /* Größe des Icons im Kreis (z.B. 16px) */
    background-repeat: no-repeat !important;
    background-position: center center !important;
    
    display: block !important;
    transition: all 0.2s ease-in-out !important;
}

/* Verhindert, dass das Plugin über ein Pseudoelement das alte Icon reinschmuggelt */
.wooco_component_product_selection_grid_item_link::before,
.wooco_component_product_selection_grid_item_link::after {
    content: none !important;
    display: none !important;
}

/* Hover-Effekt für das Icon */
.wooco_component_product_selection_grid_item_link:hover {
    background-color: #edf2fd !important; /* Euer grün beim Hovern */
    transform: scale(1.08);
}


/* --- 2. HAKEN-ICON  --- */

/* ==========================================================================
   KORREKTUR: HAKEN AKTIV VS. INAKTIV
   ========================================================================== */

/* 1. Original-Icons des Plugins im Keim ersticken */
.wooco_component_product_selection_grid_item::before,
.wooco_component_product_selection_grid_item.wooco_item_selected::before {
    content: none !important;
    display: none !important;
}


/* 2. DER INAKTIVE HAKEN (Nur wenn NICHT ausgewählt) */
.wooco_component_product_selection_grid_item:not(.wooco_item_selected)::after {
    content: "" !important;
    font-family: inherit !important;
    font-size: 0 !important;
    color: transparent !important;
    
    /* Box-Styling (Standard 28px weißer Kreis) */
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
    
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 999 !important;
    
    /* Deine Haken-SVG */
    background-image: url('https://wilfatec.de/wp-content/uploads/2026/05/check.svg') !important; /* Setze hier ggf. deinen echten Pfad ein */
    background-size: 14px 14px !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    
    /* HIER VERBLASSEN (30% Sichtbarkeit) */
    opacity: 0.3 !important; 
    
    display: block !important;
    transition: all 0.2s ease-in-out !important;
}


/* 3. DER AKTIVE HAKEN (Wenn ausgewählt – VOLLE LEUCHTKRAFT) */
.wooco_component_product_selection_grid_item.wooco_item_selected::after {
    content: "" !important;
    font-family: inherit !important;
    font-size: 0 !important;
    color: transparent !important;
    
    /* Absolut identische Box-Maße */
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background-color: #005efe !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
    
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 999 !important;
    
    /* Deine Haken-SVG */
    background-image: url('https://wilfatec.de/wp-content/uploads/2026/05/check-1.svg') !important; /* Setze hier ggf. deinen echten Pfad ein */
    background-size: 14px 14px !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    
    /* ZWINGEND VOLLE SICHTBARKEIT */
    opacity: 1 !important; 
    
    display: block !important;
}

/* ==========================================================================
   Wilfatec Online-Shop - Globaler Warenkorb-Bereich (Unten)
   ========================================================================== */

/* Das Formular im Flexbox-Layout nebeneinander anordnen */
.elementor-product-composite form.cart,
.single-product .elementor-product-simple form.cart {
    display: flex !important;
    align-items: center !important;
    gap: 0px !important; /* Abstand zwischen Pille und Button */
    margin-top: 10px !important;
}

/* --- 1. MENGEN-ZÄHLER ALS PILLEN-DESIGN (LINKS) --- */
.elementor-product-composite form.cart .quantity,
.single-product .elementor-product-simple form.cart .quantity {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #edf2fd !important; /* Das ganz helles Blau/Grau aus eurer Seite */
    border-radius: 30px !important;       /* Macht es zur runden Pille */
    padding: 6px 15px !important;          /* Sauberes Padding für die Pille */
    border: none !important;               /* Kein hässlicher Rahmen */
    max-width: 100px !important;
    height: 40px !important;               /* Gleiche Höhe wie der Button */
}

/* Das Eingabefeld in der Pille stylen */
.elementor-product-composite form.cart .quantity input.qty,
.single-product .elementor-product-simple form.cart .quantity input.qty {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    font-family: 'TBJ Interval', sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    color: #00163d !important;             /* Eure dunkle Hauptfarbe */
    text-align: center !important;
    width: 100% !important;
}

/* --- 2. WARENKORB-BUTTON IM SCREENSHOT-DESIGN (RECHTS) --- */
.elementor-product-composite form.cart .single_add_to_cart_button.button,
.single-product .elementor-product-simple form.cart .single_add_to_cart_button.button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    
    /* Design aus dem Entwurf */
    background-color: #005efe !important; /* Das dunkle Navy-Blau */
    color: #ffffff !important;             /* Weiße Schrift */
    font-family: 'TBJ Interval', sans-serif !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    text-transform: none !important;       /* Verhindert reine Großbuchstaben */
    
    /* Abmessungen & Ecken */
    height: 40px !important;               /* Identische Höhe zur Pille */
    padding: 6px 15px !important;            /* Breite des Buttons über das Padding steuern */
    border-radius: 100 !important;         /* Eckenradius aus deinem Screenshot */
    border: none !important;
    
    transition: all 0.25s ease-in-out !important;
    cursor: pointer !important;
}

/* Hover-Effekt für den Button */
.elementor-product-composite form.cart .single_add_to_cart_button.button:hover,
.single-product .elementor-product-simple form.cart .single_add_to_cart_button.button:hover {
    background-color: #4186ff !important; /* Wechselt beim Drüberfahren zu eurem hellen Grün */
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Author';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://wilfatec.de/wp-content/uploads/2026/02/Author-Light.woff2') format('woff2');
}
@font-face {
	font-family: 'Author';
	font-style: italic;
	font-weight: 300;
	font-display: auto;
	src: url('https://wilfatec.de/wp-content/uploads/2026/02/Author-LightItalic.woff2') format('woff2');
}
@font-face {
	font-family: 'Author';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://wilfatec.de/wp-content/uploads/2026/02/Author-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Author';
	font-style: italic;
	font-weight: 400;
	font-display: auto;
	src: url('https://wilfatec.de/wp-content/uploads/2026/02/Author-Italic.woff2') format('woff2');
}
@font-face {
	font-family: 'Author';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://wilfatec.de/wp-content/uploads/2026/02/Author-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'Author';
	font-style: italic;
	font-weight: 500;
	font-display: auto;
	src: url('https://wilfatec.de/wp-content/uploads/2026/02/Author-MediumItalic.woff2') format('woff2');
}
/* End Custom Fonts CSS */