/* Add to Cart Message */
.woocommerce-notices-wrapper {

    background: var(--e-global-color-primary);
    display: flex;
    justify-content: center;
    border-top: 1px solid var(--e-global-color-text);
    border-bottom: 1px solid var(--e-global-color-text);
    padding: 50px 0;

    &:empty {
        display: none;
    }

    @media(max-width: 1024px) {
        padding: 40px;
    }

    @media(max-width: 767px) {
        padding: 20px;
    }

    .woocommerce-message {
        width: 1140px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: var(--e-global-color-text);

        @media(max-width: 1024px) {
            width: 100%;
        }

        @media(max-width: 767px) {
            flex-direction: column;
            align-items: start;
            gap: 20px;
        }

        a {
            padding: 12px 24px;
            border: 1px solid var(--e-global-color-text);
            font-size: 16px;
            text-transform: uppercase;
            color: var(--e-global-color-text);

            @media(max-width: 767px) {
                width: 100%;
                text-align: center;
            }

            &:hover {
                background: var(--e-global-color-text);
                color: var(--e-global-color-primary);
            }
        }
    }

}

/* Content */

.product-content-container {
    * {
        font-family: var(--e-global-typography-primary-font-family), sans-serif;
    }

    &:has(.variations_form) {
        form.variations_form {

            /* Variable Product */
            .variations {
                tbody {
                    display: grid;
                    grid-template-columns: repeat(2, 1fr);
                    column-gap: 20px;
                    row-gap: 10px;

                    @media(max-width: 1024px) {
                        grid-template-columns: 1fr;
                    }

                    tr {
                        display: flex;
                        flex-direction: column;

                        td,
                        th {
                            padding: 0;
                            border: none;
                            background: none;

                            &.label {
                                text-align: start;

                                label {
                                    font-size: 18px;
                                    color: var(--e-global-color-text);
                                    font-weight: 400;
                                    line-height: 1.7;
                                }
                            }

                            &.value {
                                position: relative;

                                &:after {
                                    content: "";
                                    position: absolute;
                                    right: 20px;
                                    width: 20px;
                                    height: 20px;
                                    top: 16px;
                                    background-image: url(/wp-content/uploads/2025/05/Vector-12.svg);
                                    background-position: center;
                                    background-repeat: no-repeat;
                                    background-size: 20px;
                                }

                                select {
                                    background: none;
                                    color: var(--e-global-color-text);
                                    font-size: 18px;
                                    font-weight: 400;
                                    border-radius: 0;
                                    border: 1px solid var(--e-global-color-text);
                                    -webkit-appearance: none;

                                }

                                a.reset_variations {
                                    color: var(--e-global-color-text);
                                    text-decoration: underline;
                                }
                            }
                        }
                    }
                }
            }

            .single_variation_wrap .woocommerce-variation.single_variation {
                display: none !important;
            }
        }
    }

    &:has(:not(.variations_form)) {

        /* Simple Product */
        form.cart {
            display: flex;
            flex-wrap: wrap;

            span.title {
                width: 100%;
            }
        }

    }

    /* Product Price */
    .default-price .elementor-widget-container {
        min-height: 100px !important;

        * {
            font-size: 14px !important;
            line-height: 1.4 !important;
            color: var(--e-global-color-text);
        }

        .price .woocommerce-Price-amount * {
            font-size: 22px !important;
            line-height: 1.4 !important;
        }


    }

    /* Dropdown */
    .e-opened {
        transform: rotate(180deg);
    }

    /* Quantity */

    form.cart:has(:not(.woocommerce-variation-add-to-cart)),
    .woocommerce-variation-add-to-cart {
        display: flex;
        flex-direction: column;
        justify-content: start;
        gap: 0;

        span.title {
            width: 100%;
            color: var(--e-global-color-text);
            font-size: 18px;
            line-height: 1.7;
        }

        .quantity {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
            border: 1px solid var(--e-global-color-text);
            width: fit-content;

            button {
                margin: 2px !important;
                padding: 0;
                height: 26px;
                width: 26px;
                color: var(--e-global-color-text);
                border: none;
                background: none;
                border-radius: 2px !important;
                transition: .3s;

                &:hover {
                    box-shadow: inset 0 0px 5px rgba(250, 250, 250, 0.6);
                }
            }

            input {
                width: 30px;
                height: 30px !important;
                text-align: center;
                background: none;
                border: none;
                -moz-appearance: textfield;
                color: var(--e-global-color-text);
                padding: 0 !important;

                &::-webkit-outer-spin-button,
                &::-webkit-inner-spin-button {
                    -webkit-appearance: none;
                    margin: 0;
                }

            }
        }

        button[type="submit"] {
            margin: 0 !important;
            border: 1px solid var(--e-global-color-text);
            color: var(--e-global-color-primary);
            background: var(--e-global-color-text);
            width: 100%;
            text-align: center;

            &:hover {
                background: none;
                color: var(--e-global-color-text);
            }
        }
    }
}