.woocommerce-page {
    .woocommerce {
        max-width: 100%;
        margin: 0 auto;
        padding: 40px;
        border-radius: 10px;
        background-color: var(--color-white);
        box-shadow: 0px 0px 15px rgba(29, 43, 56, 0.23);
    }
}

.woocommerce-lost-password .woocommerce-page .woocommerce,
.woocommerce-reset-password .woocommerce-page .woocommerce {
    max-width: 800px;
}

.woocommerce-page .woocommerce-ResetPassword .woocommerce-form-row {
    width: 100%;
}

.woocommerce-account .row .woocommerce {
    position: relative;
}

.woocommerce-account .row .woocommerce::after {
    left: unset;
    right: -100%;
}

.woocommerce-form__submit {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px !important;
    
    .btn {
        margin-right: 0;
    }
}

.woocommerce {
    h2 {
        font-size: 26px;
        font-weight: 600;
        line-height: 1.2em;
        font-family: var(--font-secondary);
        color: var(--color-black);
        margin-bottom: 10px;
        margin-top: 0;
    }

    form.login {
        margin: 0;
        border: 0;
        border-top: 1px solid var(--color-gray-border);
        border-radius: 0;
        padding: 0;
    }

    form .form-row {
        color: var(--color-black);
        
        label {
            color: var(--color-black);
        }

        .input-text {
            background: var(--color-offwhite);
            border: 1px solid var(--color-gray-medium);
            height: 51px;
        }

        .lost_password > a {
            color: var(--color-black);
            font-weight: 400;
            text-decoration: none;
        }
        
        .woocommerce-form-login__rememberme {
            font-weight: 400;
        }
    }

    form.register {
        background: var(--color-primary-light);
        border-color: var(--color-gray-medium);
        color: var(--color-white);
        margin: 0;
        border-radius: 10px;

        label {
            color: var(--color-white);
        }

        a.woocommerce-privacy-policy-link {
            font-weight: 700;
        }
    }

    .woocommerce-form-login .woocommerce-form-login__submit {
        position: relative;
        display: inline-block;
        color: var(--color-white);
        border-radius: 100px;
        float: none;
        font-size: 15px;
        line-height: normal;
        font-weight: 700;
        padding: 13px 44px 13px 22px;
        vertical-align: middle;
        text-decoration: none;  
        font-family: var(--font-secondary);
        border: none;
        background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
        box-shadow: 0px 0px 15px 0px rgba(29, 43, 56, 0.10);
        transition: box-shadow 0.3s ease-in-out, background 0.3s ease-in-out, color 0.3s ease-in-out;
    }

    .woocommerce-form-register .woocommerce-form-register__submit {
        background: var(--color-white);
        border-radius: 100px;
        color: var(--color-primary);
        padding: 13px 44px 13px 22px;
    }

    .woocommerce-form-register .woocommerce-form-register__submit::after {
        color: var(--color-primary);
    }
}

.woocommerce-account .fx-account-page {
    display: flex;
    flex-wrap: wrap;
}

.woocommerce-account.logged-in .fx-account-page {
    padding: 0;
    background-color: transparent;
}

.woocommerce-account.logged-in .row .woocommerce {
    box-shadow: none;
    padding: 0;
    border-radius: 0;
    background-color: transparent;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation,
.woocommerce-account .fx-account-page .woocommerce-MyAccount-content {
    float: none;
    flex: 0 0 100%;
    width: 100%;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-content-inner {
    padding: 35px;
    height: inherit;
    background: var(--color-white);
    border-radius: 10px;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul  {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li {
    margin: 0;
    padding: 0;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li::before {
    display: none;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li > a {
    background-color: var(--color-offwhite);
    border-radius: 0;
    color: var(--color-black);
    display: block;
    filter: drop-shadow(0px 0px 15px rgba(29, 43, 56, 0));
    font-family: var(--font-secondary);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2em;
    letter-spacing: -0.02em;
    transition: filter 0.3s ease-in-out;
    padding: 15px;
    position: relative;
    text-decoration: none;
    text-align: left;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li > a::before {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    background-color: transparent;
    box-shadow: none;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid var(--color-primary);
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 1;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li.is-active > a {
    /* filter: drop-shadow(0px 0px 15px rgba(29, 43, 56, 0.23)); */
    background-color: var(--color-primary);
    color: var(--color-white);
}

@media (min-width: 1200px) {
    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li:hover > a {
        color: var(--color-primary);
        background-color: var(--color-white);
    }

    .woocommerce-account {
        .page-header.js-scrolled {
            background: var(--color-white);
        }
    }
}

.woocommerce-account .fx-account-page .woocommerce-Address h2 {
    font-size: 26px;
}

@media ( max-width: 1200px ) {
    .woocommerce table.shop_table_responsive thead,.woocommerce-page table.shop_table_responsive thead {
        display: none
    }
    
    .woocommerce table.shop_table_responsive tbody tr:first-child td:first-child,.woocommerce-page table.shop_table_responsive tbody tr:first-child td:first-child {
        border-top: 0
    }
    
    .woocommerce table.shop_table_responsive tbody th,.woocommerce-page table.shop_table_responsive tbody th {
        display: none
    }
    
    .woocommerce table.shop_table_responsive tr,.woocommerce-page table.shop_table_responsive tr {
        display: block
    }
    
    .woocommerce table.shop_table_responsive tr td,.woocommerce-page table.shop_table_responsive tr td {
        display: block;
        text-align: right!important
    }
    
    .woocommerce table.shop_table_responsive tr td.order-actions,.woocommerce-page table.shop_table_responsive tr td.order-actions {
        text-align: left!important
    }
    
    .woocommerce table.shop_table_responsive tr td::before,.woocommerce-page table.shop_table_responsive tr td::before {
        content: attr(data-title) ": ";
        font-weight: 700;
        float: left
    }
    
    .woocommerce table.shop_table_responsive tr td.actions::before,.woocommerce table.shop_table_responsive tr td.product-remove::before,.woocommerce-page table.shop_table_responsive tr td.actions::before,.woocommerce-page table.shop_table_responsive tr td.product-remove::before {
        display: none
    }
    
    .woocommerce table.shop_table_responsive tr:nth-child(2n) td,.woocommerce-page table.shop_table_responsive tr:nth-child(2n) td {
        background-color: rgba(0,0,0,.025)
    }
    
    .woocommerce table.my_account_orders tr td.order-actions,.woocommerce-page table.my_account_orders tr td.order-actions {
        text-align: left
    }
    
    .woocommerce table.my_account_orders tr td.order-actions::before,.woocommerce-page table.my_account_orders tr td.order-actions::before {
        display: none
    }
    
    .woocommerce table.my_account_orders tr td.order-actions .button,.woocommerce-page table.my_account_orders tr td.order-actions .button {
        float: none;
        margin: .125em .25em .125em 0
    }
    
    .woocommerce .col2-set .col-1,.woocommerce .col2-set .col-2,.woocommerce-page .col2-set .col-1,.woocommerce-page .col2-set .col-2 {
        float: none;
        width: 100%
    }
    
    .woocommerce ul.products[class*=columns-] li.product,.woocommerce-page ul.products[class*=columns-] li.product {
        width: 48%;
        float: left;
        clear: both;
        margin: 0 0 2.992em
    }
    
    .woocommerce ul.products[class*=columns-] li.product:nth-child(2n),.woocommerce-page ul.products[class*=columns-] li.product:nth-child(2n) {
        float: right;
        clear: none!important
    }
    
    .woocommerce #content div.product div.images,.woocommerce #content div.product div.summary,.woocommerce div.product div.images,.woocommerce div.product div.summary,.woocommerce-page #content div.product div.images,.woocommerce-page #content div.product div.summary,.woocommerce-page div.product div.images,.woocommerce-page div.product div.summary {
        float: none;
        width: 100%
    }
    
    .woocommerce #content table.cart .product-thumbnail,.woocommerce table.cart .product-thumbnail,.woocommerce-page #content table.cart .product-thumbnail,.woocommerce-page table.cart .product-thumbnail {
        display: none
    }
    
    .woocommerce #content table.cart td.actions,.woocommerce table.cart td.actions,.woocommerce-page #content table.cart td.actions,.woocommerce-page table.cart td.actions {
        text-align: left
    }
    
    .woocommerce #content table.cart td.actions .coupon,.woocommerce table.cart td.actions .coupon,.woocommerce-page #content table.cart td.actions .coupon,.woocommerce-page table.cart td.actions .coupon {
        float: none;
        padding-bottom: .5em
    }
    
    .woocommerce #content table.cart td.actions .coupon::after,.woocommerce #content table.cart td.actions .coupon::before,.woocommerce table.cart td.actions .coupon::after,.woocommerce table.cart td.actions .coupon::before,.woocommerce-page #content table.cart td.actions .coupon::after,.woocommerce-page #content table.cart td.actions .coupon::before,.woocommerce-page table.cart td.actions .coupon::after,.woocommerce-page table.cart td.actions .coupon::before {
        content: " ";
        display: table
    }
    
    .woocommerce #content table.cart td.actions .coupon::after,.woocommerce table.cart td.actions .coupon::after,.woocommerce-page #content table.cart td.actions .coupon::after,.woocommerce-page table.cart td.actions .coupon::after {
        clear: both
    }
    
    .woocommerce #content table.cart td.actions .coupon .button,.woocommerce #content table.cart td.actions .coupon .input-text,.woocommerce #content table.cart td.actions .coupon input,.woocommerce table.cart td.actions .coupon .button,.woocommerce table.cart td.actions .coupon .input-text,.woocommerce table.cart td.actions .coupon input,.woocommerce-page #content table.cart td.actions .coupon .button,.woocommerce-page #content table.cart td.actions .coupon .input-text,.woocommerce-page #content table.cart td.actions .coupon input,.woocommerce-page table.cart td.actions .coupon .button,.woocommerce-page table.cart td.actions .coupon .input-text,.woocommerce-page table.cart td.actions .coupon input {
        width: 48%;
        box-sizing: border-box
    }
    
    .woocommerce #content table.cart td.actions .coupon .button.alt,.woocommerce #content table.cart td.actions .coupon .input-text+.button,.woocommerce table.cart td.actions .coupon .button.alt,.woocommerce table.cart td.actions .coupon .input-text+.button,.woocommerce-page #content table.cart td.actions .coupon .button.alt,.woocommerce-page #content table.cart td.actions .coupon .input-text+.button,.woocommerce-page table.cart td.actions .coupon .button.alt,.woocommerce-page table.cart td.actions .coupon .input-text+.button {
        float: right
    }
    
    .woocommerce #content table.cart td.actions .coupon .coupon-error-notice,.woocommerce table.cart td.actions .coupon .coupon-error-notice,.woocommerce-page #content table.cart td.actions .coupon .coupon-error-notice,.woocommerce-page table.cart td.actions .coupon .coupon-error-notice {
        clear: left;
        color: var(--wc-red);
        float: left;
        font-size: .75em;
        margin-bottom: 0;
        text-align: left;
        width: 48%
    }
    
    .woocommerce #content table.cart td.actions .button,.woocommerce table.cart td.actions .button,.woocommerce-page #content table.cart td.actions .button,.woocommerce-page table.cart td.actions .button {
        display: block;
        width: 100%
    }
    
    .woocommerce .cart-collaterals .cart_totals,.woocommerce .cart-collaterals .cross-sells,.woocommerce .cart-collaterals .shipping_calculator,.woocommerce-page .cart-collaterals .cart_totals,.woocommerce-page .cart-collaterals .cross-sells,.woocommerce-page .cart-collaterals .shipping_calculator {
        width: 100%;
        float: none;
        text-align: left
    }
    
    .woocommerce-page.woocommerce-checkout form.login .form-row,.woocommerce.woocommerce-checkout form.login .form-row {
        width: 100%;
        float: none
    }
    
    .woocommerce #payment .terms,.woocommerce-page #payment .terms {
        text-align: left;
        padding: 0
    }
    
    .woocommerce #payment #place_order,.woocommerce-page #payment #place_order {
        float: none;
        width: 100%;
        box-sizing: border-box;
        margin-bottom: 1em
    }
    
    .woocommerce .lost_reset_password .form-row-first,.woocommerce .lost_reset_password .form-row-last,.woocommerce-page .lost_reset_password .form-row-first,.woocommerce-page .lost_reset_password .form-row-last {
        width: 100%;
        float: none;
        margin-right: 0
    }
    
    .woocommerce-account .woocommerce-MyAccount-content,.woocommerce-account .woocommerce-MyAccount-navigation {
        float: none;
        width: 100%
    }
}

@media ( max-width: 1024px ) {
    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li > a {
        padding: 20px 25px;
    }
}

@media ( max-width: 767px ) {
    .woocommerce-account.woocommerce-page .woocommerce {
        padding: 40px 25px;
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;

        > li {
            flex: 0 0 calc(50% - 5px);

            > a {
                font-size: 14px;
                padding: 10px;
            }
        }
    }
    
}

@media ( min-width: 768px ) {
    .woocommerce {
        .woocommerce-form-login .lost_password {
            text-align: right;
        }
        
        .woocommerce-form-login .woocommerce-form-login__submit,
        .woocommerce-form-register .woocommerce-form-register__submit {
            padding: 15px 52px 15px 30px;
        }
    }
    
    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation {
        flex: 0 0 25%;
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-content {
        flex: 0 0 75%;
        padding-left: 35px;
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul > li.is-active > a::before {
        opacity: 1;
        visibility: visible;
    }
}

@media ( min-width: 1200px ) {
    .woocommerce {
        .woocommerce-form-login .woocommerce-form-login__submit:hover {
            background: linear-gradient(90deg, var(--color-primary-dark) 0%, var(--color-primary-dark) 50.96%, var(--color-primary-dark) 100%);
            color: var(--color-white);
        }

        .woocommerce-form-register .woocommerce-form-register__submit:hover {
            background: var(--color-white);
            color: var(--color-accent);
            box-shadow: none;
        }
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation > ul {
        flex-wrap: wrap;
        gap: 0;
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-navigation {
        flex: 0 0 25%;
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-content {
        flex: 0 0 75%;
    }

    .woocommerce-account .fx-account-page .woocommerce-MyAccount-content-inner {
        /* padding: 15px; */
        table.shop_table {

            td.woocommerce-orders-table__cell-order-actions {
                .btn {
                    margin-bottom: 0;
                }
            }
        }
    }
}

@media ( min-width: 1367px ) {
    .woocommerce-account .fx-account-page .woocommerce-MyAccount-content-inner {
        table.shop_table {
            td,th {
                padding: 20px 8px;
            }

            td.woocommerce-orders-table__cell-order-actions {
                padding: 0;
            }
        }
    }
}

.fx-account-page {
    .woocommerce-MyAccount-content-inner .button,
    .btn {
        font-size: 14px;
        padding-block: 10px;
        padding-left: 20px;
        padding-right: 40px;

        &:after {
            right: 22px;
        }
    }

    .woocommerce-MyAccount-content-inner .button {
        margin-top: 30px !important;
    }

    .woocommerce-orders-table__header {
        color: var(--color-primaru);
        font-weight: 600;
        font-size: 16px;
    }

    .woocommerce-bottom__button {
        margin-top: 20px;
        margin-bottom: 0;
    }

    .woocommerce-MyAccount-content-inner .woocommerce-Address {
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0px 0px 15px rgba(29, 43, 56, 0.1);
        background-color: var(--color-white);
        margin-bottom: 40px;

        h2 {
            margin-bottom: 0;
            font-size: 26px;
        }
    }
}

.woocommerce-account .edit-account .woocommerce-form-row:has(input[name="wc_avatax_Buyer_company_ID"]),
.woocommerce-account .edit-account .woocommerce-form-row:has(input[name="wc_avatax_Buyer_VAT_ID"]),
.woocommerce-account .edit-account .woocommerce-form-row:has(input[name="wc_avatax_Buyer_Peppol_ID"]) {
    display: none;
}

/**
 * Cancellation survey / retention popup (MeowCrew plugin): primary actions should match
 * My Account WooCommerce action links (e.g. subscription Cancel — .woocommerce-button.button).
 * Popup markup is outside .woocommerce-MyAccount-content-inner, so global button styles do not apply.
 */
#cancellation-offer-popup button.button.primary-button {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    color: var(--color-white);
    border-radius: 100px;
    font-size: 14px;
    line-height: normal;
    font-weight: 700;
    padding-block: 10px;
    padding-left: 20px;
    padding-right: 40px;
    vertical-align: middle;
    text-align: center;
    text-decoration: none;
    font-family: var(--font-secondary);
    border: none;
    box-shadow: 0px 0px 15px 0px rgba(29, 43, 56, 0.10);
    background-image: linear-gradient(90deg, var(--color-accent-light) 0%, var(--color-accent-light) 50.96%, var(--color-accent) 100%);
    background-size: 200% 100%;
    background-position: -100% 0;
    cursor: pointer;
    transition: background-position 0.3s ease-in-out, box-shadow 0.3s ease-in-out, background 0.3s ease-in-out, color 0.3s ease-in-out, opacity 0.3s ease-in-out;
    margin: 0 !important;
    appearance: none;
    -webkit-appearance: none;
}

#cancellation-offer-popup button.button.primary-button::after {
    content: '\e902';
    font-family: var(--font-icomoon);
    position: absolute;
    top: 50%;
    right: 22px;
    font-size: 11px;
    font-weight: normal;
    transform: translate(0, -50%);
    transition: color 0.3s ease-in-out, right 0.3s ease-in-out;
}

@media (min-width: 1200px) {
    #cancellation-offer-popup button.button.primary-button:hover:not(:disabled) {
        background-position: -200% 0;
        color: var(--color-white);
    }

    #cancellation-offer-popup button.button.primary-button:hover:not(:disabled)::after {
        right: 25px;
    }
}

#cancellation-offer-popup button.button.primary-button:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}