/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Anpassungen für das Child-Theme von Hello Elementor.
Version: 3.1.1
*/

/* === Allgemeine Einstellungen === */
body {
    -ms-hyphens: auto; /* für Internet Explorer */
    -moz-hyphens: auto; /* für Firefox */
    -webkit-hyphens: auto; /* für Safari */
    hyphens: auto; /* allgemeine Einstellung */
    overflow-x: hidden; /* Verhindert horizontales Scrollen */
}

/* === Plus-/Minus-Buttons (WooCommerce) === */
button.minus, button.plus {
    background-color: #bbb;
    border: 0;
    font-size: 18px;
    width: 40px;
    height: 40px;
    padding: 0;
    vertical-align: middle;
}

button.minus:hover, button.plus:hover {
    background-color: #ddd;
}

/* === Mobile Darstellung (Produktseite) === */
@media (max-width: 767px) {
    .single-product form.cart {
        display: flex;
        flex-direction: column; /* Elemente untereinander anordnen */
        align-items: center; /* Zentrierung */
        gap: 20px; /* Abstand zwischen den Elementen */
    }

    .single-product form.cart .quantity {
        display: flex;
        flex-direction: column; /* Plus und Minus untereinander */
        align-items: center;
        gap: 10px; /* Abstand zwischen Minus, Eingabefeld und Plus */
        width: 100%; /* Breite der Mengensteuerung anpassen */
    }

    .single-product form.cart button.single_add_to_cart_button {
        order: -1; /* Platziert den Warenkorb-Button über der Mengensteuerung */
        width: 100%; /* Warenkorb-Button über die gesamte Breite */
        max-width: 250px; /* Maximale Breite */
    }

    .single-product form.cart input.qty {
        text-align: center; /* Zentriert den Text im Eingabefeld */
        width: 60px; /* Eingabefeldgröße anpassen */
        height: 40px; /* Gleiche Höhe wie die Buttons */
    }

    .single-product form.cart button.plus,
    .single-product form.cart button.minus {
        width: 40px; /* Einheitliche Breite für die Buttons */
        height: 40px; /* Einheitliche Höhe für die Buttons */
        font-size: 16px; /* Schriftgröße anpassen */
    }
}

/* === WooCommerce Erfolgsnachricht === */
.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {
    font-size: 20px;
    color: #790AB7;
    font-weight: bold;
    padding: 10px;
    line-height: 1.2em;
}

/* === Links auf der WooCommerce Checkout-Seite === */
.elementor-widget-woocommerce-checkout-page a {
    color: #790AB7;
    font-weight: normal;
    text-decoration: underline;
}

.elementor-widget-woocommerce-checkout-page a:hover {
    color: #AB36FE;
}

/* === Preisgestaltung auf Produktseiten === */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: #790ab7;
    font-size: 1.25em;
}

/* === Call-to-Action Links (Startseite) === */
.elementor-kit-18 a {
    color: var(--e-global-color-2b34c9d);
    text-decoration: none;
}

.elementor-kit-18 a:hover {
    text-decoration: none;
}

.stock.out-of-stock {
    margin-top: 10px; /* Fügt eine Leerzeile (Abstand) vor dem Text hinzu */
    font-size: 80%;
    color: red;
}

.elementor-menu-cart__product-price {
    align-self: var(--price-quantity-position--align-self,end);
    color: var(--product-price-color,#989FA7);
    font-weight: 300;
    grid-column-end: 3;
    grid-column-start: 2
}

.woocommerce-checkout-review-order-table img {
    max-width: 150px;
    height: auto;
    width: auto;
    margin: 5px;
}

.email-content {
    width: 100%; /* Breite des Containers */
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
}
/* START Ausblenden der EU Hinweise für 6203 */
.single-product.postid-6203 .wgm-info.wgm-extra-costs-eu {display:none;}
.single-product ul.products li.product.post-6203 .wgm-info.wgm-extra-costs-eu {display:none;}

.elementor-widget-woocommerce-products ul.products li.product.post-6203 .wgm-info.wgm-extra-costs-eu {
  display: none !important;
}

/* ENDE Ausblenden der EU Hinweise für 6203 */

/* Verstecke Cart-Icon für Produkt 6203 in Cross-Sells */
.cross-sells .product[data-product-id="6203"] .add_to_cart_button,
.cross-sells .product .add_to_cart_button[data-product_id="6203"] {
    display: none !important;
}

/* Alternative CSS-Selektoren falls die obigen nicht greifen */
.woocommerce .cross-sells li.product .add_to_cart_button[data-product_id="6203"] {
    display: none !important;
}

/* START WooCommerce Checkout Feld-Validierung Styling */

/* Fehlerhafte Felder rot hervorheben */
.woocommerce-invalid-required-field input,
.woocommerce-invalid-required-field select,
.woocommerce-invalid input,
.woocommerce-invalid select {
    border: 2px solid #e74c3c !important;
    background-color: #fdf2f2 !important;
    box-shadow: 0 0 5px rgba(231, 76, 60, 0.3) !important;
}

/* Inline-Fehlermeldungen anzeigen wenn Feld fehlerhaft */
.woocommerce-invalid-required-field .field-error,
.woocommerce-invalid .field-error {
    display: block !important;
    color: #e74c3c;
    font-size: 12px;
    font-weight: 600;
    margin-top: 5px;
    line-height: 1.4;
}

/* Korrekt ausgefüllte Felder grün hervorheben (optional) */
.woocommerce-validated input,
.woocommerce-validated select {
    border: 2px solid #27ae60 !important;
    background-color: #f8fff8 !important;
}

/* Standard-Fehlermeldungen oben ausblenden (optional) */
.woocommerce-error {
    display: none !important;
}

/* Responsive Anpassungen */
@media (max-width: 768px) {
    .field-error {
        font-size: 11px;
        margin-top: 3px;
    }
}

/* ENDE WooCommerce Checkout Feld-Validierung Styling */

/* === WooCommerce Notices Button-Styling === */

/* Alle WooCommerce Notice Buttons */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
    /* Deine Markenfarben verwenden */
    background-color: #790AB7 !important;
    color: #ffffff !important;
    
    /* Button-Form */
    border: 2px solid #790AB7 !important;
    border-radius: 5px !important;
    padding: 10px 20px !important;
    
    /* Button-Text */
    font-size: 14px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    letter-spacing: 0.5px !important;
    
    /* Button-Verhalten */
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    display: inline-block !important;
    line-height: 1.2 !important;
}

/* Button Hover-Zustand mit Deiner Hover-Farbe */
.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
    background-color: #AB36FE !important;
    border-color: #AB36FE !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(171, 54, 254, 0.3) !important;
}