/* FIX WOOCOMMERCE STYLES */
.woocommerce-form-register,
.woocommerce-form-login {
    width: 100%;
    max-width: 19rem;
}

.button.woocommerce-form-register__submit,
.button.woocommerce-form-login__submit {
    background-color: var(--color-green-a);
    color: var(--color-white);
    width: 100%;
}

[data-register="false"] .u-column2,
[data-register="false"] #button-login-account,
body.woocommerce-lost-password #button-create-account {
    display: none;
}

[data-register="true"] .u-column1,
[data-register="true"] #button-create-account {
    display: none;
}

[data-register="false"] .u-column1,
[data-register="false"] #button-create-account,
[data-register="true"] .u-column2,
[data-register="true"] #button-login-account {
    animation: appear_form 0.3s ease-out forwards;
}

@keyframes appear_form {
    from {
        opacity: 0;
        transform: translateY(-1rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.woocommerce-form__label-for-checkbox {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.woocommerce-LostPassword {
    font-size: 0.875rem;
}

.wc-empty-cart-message {
    margin-bottom: 1rem;
}

.button.wc-backward {
    background-color: var(--color-gray-dark);
    color: var(--color-white-dirty);
}

.woocommerce-privacy-policy-text {
    font-size: 0.875rem;
    color: var(--color-gray);
}

/* CART */

.woocommerce-cart-form__cart-item input[type="number"].qty {
    width: 4rem;
    background-color: var(--color-back);
    border-color: var(--color-gray-extra-light);
    transition: none;
}

.woocommerce-cart-form__cart-item .product-name a {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.33;
    display: block;
    text-wrap: balance;
}

span.woocommerce-Price-amount {
    text-wrap: nowrap;
}

td.actions .coupon {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.5rem;
}

td.actions .coupon label.screen-reader-text {
    clip: unset;
    clip-path: unset;
    height: unset;
    margin: inherit;
    overflow: unset;
    padding: unset;
    position: relative;
    width: unset;
    word-wrap: unset;
}

th.product-thumbnail,
td.product-thumbnail {
    width: 5rem;
}

img.attachment-woocommerce_thumbnail {
    width: 5rem;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 0.5rem;
    border: 0.0625rem solid var(--color-gray-extra-light);
}

input[name="coupon_code"] {
    background-color: var(--color-white);
    border-color: var(--color-white-dirty);
}

td.actions {
    border-bottom: none;
}

td.product-price {
    width: 10rem;
}

td.product-quantity {
    width: 10rem;
}

td.product-remove {
    width: 3rem;
    text-align: right;
}

table.cart th {
    font-weight: 500;
    font-size: 1rem;
}

.cross-sells ul.products {
    margin: 0;
}

td.product-subtotal {
    font-weight: 600;
}

.woocommerce-notices-wrapper:not(:empty) {
    margin: 2rem 0;
}

.woocommerce-message {
    padding: 1rem;
    background-color: var(--color-white-dirty);
    width: fit-content;
    border-radius: 0.125rem;
}

a.restore-item {
    background-color: var(--color-gray-dark);
    color: var(--color-white);
    padding: 0.5rem 1.5rem;
    border-radius: 0.5rem;
    display: inline-block;
    margin: 0 0 0 1rem;
}

.wc-block-checkout__form
    button.wc-block-components-checkout-place-order-button {
    display: block;
    position: relative;
    height: 2.75rem;
    padding: 0.5rem 1.25rem;
    border-radius: 0.25rem;
    border: none;
    text-decoration: none;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 400;
    text-align: center;
    line-height: 1;
    background-color: var(--color-green-a);
    color: var(--color-white);
    cursor: pointer;
    overflow: hidden !important;
}

.button.woocommerce-form-login__submit::after,
button.wc-block-components-checkout-place-order-button::after {
    content: "";
    position: absolute;
    top: calc(50% - 2rem);
    left: calc(50% - 2rem);
    width: 4rem;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.085);
    z-index: -1;
    transform: scale(0) translate3d(0, 0, 0);
    transition: var(--transition-norm);
    will-change: auto;
    z-index: 1;
}

.button.woocommerce-form-login__submit:hover::after,
button.wc-block-components-checkout-place-order-button:hover::after {
    transform: scale(7) translate3d(0, 0, 0);
    opacity: 1;
}

.wc-block-components-checkout-place-order-button__text {
    justify-content: center;
}

.wc-block-components-totals-footer-item-tax-value {
    color: var(--color-orange);
}

.woocommerce-shipping-methods {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.875rem;
}

.woocommerce-shipping-destination {
    font-size: 0.875rem;
}

.shipping-calculator-button {
    font-size: 0.875rem;
}

.order-total .woocommerce-Price-amount {
    color: var(--color-orange);
    font-size: 1.25rem;
}

/* WOO ORDER RECEIVED */

body.woocommerce-order-received h1.entry-title {
    margin: 0;
    padding: 2rem;
    background-color: var(--color-back-success);
    color: var(--color-green-a);
    display: none;
}

body.woocommerce-order-received ul.woocommerce-order-overview {
    list-style: none;
    margin: 0;
    padding: 0;
}

.woocommerce-customer-details,
body.woocommerce-order-received .woocommerce-bacs-bank-details,
body.woocommerce-order-received .woocommerce-customer-details {
    background-color: var(--color-white-dirty);
    padding: 2rem;
    margin: 2rem 0;
}

.woocommerce-customer-details h2.woocommerce-column__title,
.woocommerce-bacs-bank-details h2.wc-bacs-bank-details-heading {
    margin-top: 0;
}

.button.woocommerce-Button {
    background-color: var(--color-gray-dark);
    color: var(--color-white);
}

.wp-block-woocommerce-checkout-order-summary-block {
    background-color: var(--color-white);
}

.dark-mode .wp-block-woocommerce-checkout-order-summary-block {
    border: 0.0625rem solid var(--color-gray-light);
}

.dark-mode .wc-block-components-totals-wrapper,
.dark-mode .wp-block-woocommerce-checkout-order-summary-totals-block {
    border-top: 0.0625rem solid var(--color-gray-light);
}

.wc-block-components-totals-coupon__button {
    height: 2.75rem;
    padding: 0.5rem 1.25rem;
    border-radius: 0.25rem;
    border: none;
    text-decoration: none;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 400;
    text-align: center;
    line-height: 1;
    text-wrap: nowrap;
    transition: var(--transition-short);
    cursor: pointer;
    text-transform: none !important;
    background-color: var(--color-gray-dark);
    color: var(--color-white);
}

.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input[type="email"],
.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input[type="number"],
.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input[type="password"],
.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input[type="tel"],
.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input[type="text"],
.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input[type="url"],
.dark-mode .wc-block-components-text-input input[type="email"],
.dark-mode .wc-block-components-text-input input[type="number"],
.dark-mode .wc-block-components-text-input input[type="password"],
.dark-mode .wc-block-components-text-input input[type="tel"],
.dark-mode .wc-block-components-text-input input[type="text"],
.dark-mode .wc-block-components-text-input input[type="url"] {
    background-color: var(--color-white);
    color: var(--color-text);
}

.dark-mode
    .wc-blocks-components-select
    .wc-blocks-components-select__select:focus,
.dark-mode
    .wc-block-components-form
    .wc-block-components-text-input
    input:focus {
    background-color: var(--color-black);
    border-color: var(--color-gray);
    color: var(--color-text);
}

.dark-mode .wc-block-components-form .wc-block-components-text-input label,
.dark-mode .wc-block-components-text-input label {
    color: var(--color-gray);
}

.dark-mode .wc-blocks-components-select .wc-blocks-components-select__select {
    background: var(--color-white);
    color: var(--color-text);
}

/*  */

.wc-block-components-text-input {
    margin-bottom: 1rem;
}

/* WOO MY ACCOUNT */

.woocommerce-MyAccount-navigation-link--payment-methods {
    display: none;
}

@media screen and (max-width: 768px) {
    td.product-price {
        width: auto;
    }

    td.product-quantity {
        width: auto;
    }

    img.attachment-woocommerce_thumbnail {
        min-width: 4rem;
    }
}

@media screen and (max-width: 640px) {
    table.shop_table_responsive thead {
        display: none;
    }

    tr.cart_item {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 0.25rem;
        margin-bottom: 2rem;
    }

    tr.cart_item td {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    td.product-thumbnail {
        width: auto;
    }

    tr.cart_item > td {
        padding: 0 0 1rem 0;
    }

    tr.cart_item > td.product-name {
        grid-column: span 3;
    }

    tr.cart_item > td:nth-of-type(1),
    tr.cart_item > td:nth-of-type(2) {
        border: none;
    }

    td.product-remove {
        width: auto;
    }
}
