.woocommerce-account.wp-theme-mbnavus {
    background-image: url(../../images/content-image-bg.svg);
    background-position: center center;
    background-size: 150% auto;
    background-repeat: no-repeat;
}

.woocommerce-account.wp-theme-mbnavus .entry-content > .woocommerce {
    min-height: 600px;
}

.wc-auth-wrapper {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1rem;
    padding-right: 1rem;
    position: relative;
}

.wc-auth-wrapper form.register,
.wc-auth-wrapper form.login {
    padding: 0 !important;
}

.wc-auth-wrapper  .col2-set .col-1, .wc-auth-wrapper .col2-set .col-2 {
    float: none;
    width: 100% !important;
}
/* Hide register form by default */
.wc-auth-wrapper .woocommerce-form {
    position: relative;
}


.woocommerce-form-register {
    border: none !important;
}

/* Both forms stacked */
.wc-auth-wrapper .woocommerce-form-login,
.wc-auth-wrapper .woocommerce-form-register {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    visibility: hidden;
    opacity: 0;
    z-index: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}

/* Active form */
.wc-auth-wrapper .woocommerce-form-login.active,
.wc-auth-wrapper .woocommerce-form-register.active {
    visibility: visible;
    opacity: 1;
    z-index: 1;
    pointer-events: auto;
    position: relative;
}

.woocommerce-account .woocommerce form.login {
    border: none;
}

.woocommerce-form-login__section-title h1 {
    color: var(--gold-100);
    text-align: center;
    font-size: 2rem;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.woocommerce-form-login__section-title .wc-form-toggle {
    margin-top: 0;
    margin-bottom: 48px;
    color: var(--neautral-200);
    font-size: 1.125rem;
    line-height: normal;
    text-align: center;
}

.woocommerce-form-login__section-title .wc-form-toggle a {
    font-size: 1.125rem;
    font-weight: 300;
    color: var(--neautral-200);
    text-decoration: underline;
}

.woocommerce-form-login__fields {
    position: relative;
    padding-top: 40px;
    padding-bottom: 40px;
}

.woocommerce-form-login__fields:before,
.woocommerce-form-login__fields:after {
    content:" ";
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 40px;
    left: 0;
}

.woocommerce-form-login__fields:before {
    top: 0;
    background: url(../../../assets/images/best-seller-corner-topleft.svg) no-repeat left bottom / 40px 40px, url(../../../assets/images/best-seller-corner-topright.svg) no-repeat 100% 100% / 40px 40px;
}

.woocommerce-form-login__fields:after {
    bottom: 0;
    background: url(../../../assets/images/best-seller-corner-botleft.svg) no-repeat left bottom / 40px 40px, url(../../../assets/images/best-seller-corner-botright.svg) no-repeat 100% 100% / 40px 40px;
}

.woocommerce-form-login__fieldswrapper {
    padding-left: 30px;
    padding-right: 30px;
    background: rgba(15, 14, 18, 0.70);
}

.woocommerce-form-login__fieldswrapper .woocommerce-form-row--wide.form-row {
    position: relative;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form-row--wide.form-row {
    margin-bottom: 23px;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form-row--wide.form-row label {
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    color: var(--neautral-200);
    font-size: 0.875rem;
    font-weight: 300;
    line-height: normal;
    transition: opacity .25s ease-in;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form-row--wide.form-row label span {
    display: none;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form-row--wide.form-row .input-text {
    position: relative;
    border: 0 !important;
    border-bottom: 1px solid var(--gold-200) !important;
    padding: 11px 0 !important;
    background-color: transparent !important;
    border-radius: 0 !important;
    color: var(--neautral-200);
    font-size: 0.875rem;
    font-weight: 300;
    line-height: normal;
}

.woocommerce form.woocommerce-form   .woocommerce-form-login__fieldswrapper .show-password-input {
    right: 0;
}

.woocommerce form.woocommerce-form  .woocommerce-form-login__fieldswrapper .show-password-input.display-password:before {
    filter: brightness(0) saturate(100%) invert(73%) sepia(14%) saturate(742%) hue-rotate(1deg) brightness(87%) contrast(86%);
    background-image: url(../../images/eye-open.svg);
    height: 26px;
    width: 26px;
}

.woocommerce form.woocommerce-form   .woocommerce-form-login__fieldswrapper .show-password-input:before {
    background-image: url(../../images/closeeye.svg);
    background-repeat: no-repeat;
    background-position: 100% center;
    background-size: 100% !important;
}

.form-row:has(.input-text:focus) label,
.form-row:has(.input-text[data-empty="false"]) label {
    opacity: 0;
    top: -8px;
    transform: translateY(0);
    opacity: 0;
    pointer-events: none;
}

.woocommerce form.woocommerce-form-login  .woocommerce-form-login__fieldswrapper .form-row:not(.woocommerce-form-row.woocommerce-form-row--wide form-row) {
    display: flex;
    flex-direction: column;
    margin: 0 0 24px;
    padding: 0;
}

.woocommerce-form-login__fieldswrapper .form-row .default-button {
    width: 100%;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement {
    display: flex;
    position: relative;
    align-items: flex-start;
    padding: 0;
}
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement {
    margin: 0 0 42px;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox span {
    position: relative;
    left: -24px;
}


.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox span,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkout__terms-text,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkout__terms-text a{
    font-size: 0.875rem;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .woocommerce-form__input-checkbox,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__input {
    visibility: hidden;
    display: none;
    width: 24px;
    height: 24px;
}
.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label {
    width: 24px;
    position: relative;
    height: 24px;
    top: 1px;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label {
    left: -24px;
}

.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label {
    left: 0;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label:before,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label:before {
    content: ' ';
    display: block;
    height: 24px;
    width: 24px;
    position: absolute;
    left: 0;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label:after,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label:after {
    content: ' ';
    display: block;
    height: 24px;
    width: 24px;
    border: 1px solid var(--gold-400);
    transition: 200ms;
    position: absolute;
    top: 0;
    left: 0;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label:after,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label:after {
    transition: 100ms ease-in-out;
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .woocommerce-form__input-checkbox:checked ~ .checkbox__label:after,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__input:checked ~ .checkbox__label:after {
    border-top-style: none; 
    border-right-style: none;
    -ms-transform: rotate(-45deg); /* IE9 */
    transform: rotate(-45deg);
    height: 10px;
    border-color: var(--gold-400);
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox  .woocommerce-form__input-checkbox,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .woocommerce-form__input-checkbox {
    position: relative;
    display: flex;
    cursor: pointer;
    /* Mobile Safari: */
    -webkit-tap-highlight-color: rgba(0,0,0,0);   
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label:after:hover,
.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label:after:active,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label:after:hover,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label:after:active {
     border-color: var(--gold-400); 
}

.woocommerce-form-login__fieldswrapper .woocommerce-form__label.woocommerce-form__label-for-checkbox .checkbox__label,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement .checkbox__label {
  margin-right: 8px;
}

.u-column2.col-2 .woocommerce-form-login__fieldswrapper p:nth-child(2) {
    display: none;
}

/* Germanized privacy checkbox (register form): the generic rule above hides
   .woocommerce-form__input-checkbox and relies on a .checkbox__label span the
   Germanized markup doesn't have — render the input itself as the themed box. */
.woocommerce-form-register p.legal.checkbox-reg_data_privacy .woocommerce-form__input-checkbox {
    visibility: visible;
    display: inline-block;
    appearance: none;
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    min-width: 24px;
    margin: 0 8px 0 0;
    border: 1px solid var(--gold-400);
    background: transparent;
    cursor: pointer;
    position: relative;
    top: 1px;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

.woocommerce-form-register p.legal.checkbox-reg_data_privacy .woocommerce-form__input-checkbox:checked::after {
    content: ' ';
    position: absolute;
    left: 4px;
    top: 6px;
    width: 14px;
    height: 7px;
    border-left: 1px solid var(--gold-400);
    border-bottom: 1px solid var(--gold-400);
    transform: rotate(-45deg);
}

.woocommerce-form-register p.legal.checkbox-reg_data_privacy span {
    left: 0;
}

.woocommerce-form-register p.legal.checkbox-reg_data_privacy {
    margin: 0 0 24px;
}

/* Consent gating: locked submit + error highlight on the consent checkbox */
.woocommerce-form-login__fieldswrapper .consent-locked {
    cursor: not-allowed;
}

.woocommerce-form-login__fieldswrapper .consent-locked button[disabled] {
    opacity: 0.45;
    pointer-events: none;
}

.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement.consent-error .checkbox__label:after {
    border-color: #e05252;
}

.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement.consent-error .checkout__terms-text,
.woocommerce-form-login__fieldswrapper .checkbox-label.checkout__terms-agreement.consent-error .checkout__terms-text a {
    color: #e05252;
}

.woocommerce-form-register p.legal.checkbox-reg_data_privacy.consent-error .woocommerce-form__input-checkbox {
    border-color: #e05252;
}

.woocommerce-form-register p.legal.checkbox-reg_data_privacy.consent-error,
.woocommerce-form-register p.legal.checkbox-reg_data_privacy.consent-error a {
    color: #e05252;
}

/* Brand the WooCommerce notice banners on account pages (wc-blocks defaults
   are light-on-light here because wooglobal.css is not enqueued on my-account).
   Success/info: gold accents. Error: red accents so severity stays readable. */
.woocommerce-account .wc-block-components-notice-banner.is-error,
.woocommerce-account .wc-block-components-notice-banner.is-success,
.woocommerce-account .wc-block-components-notice-banner.is-info {
    background-color: var(--neautral-1000);
    color: var(--neautral-200);
    border: 1px solid var(--gold-200);
}

.woocommerce-account .wc-block-components-notice-banner.is-error a,
.woocommerce-account .wc-block-components-notice-banner.is-success a,
.woocommerce-account .wc-block-components-notice-banner.is-info a {
    color: var(--gold-200);
    text-decoration: underline;
}

.woocommerce-account .wc-block-components-notice-banner.is-error > svg,
.woocommerce-account .wc-block-components-notice-banner.is-success > svg,
.woocommerce-account .wc-block-components-notice-banner.is-info > svg {
    background-color: var(--gold-200);
}

.woocommerce-account .wc-block-components-notice-banner.is-error > svg path,
.woocommerce-account .wc-block-components-notice-banner.is-success > svg path,
.woocommerce-account .wc-block-components-notice-banner.is-info > svg path {
    fill: var(--neautral-1000);
}

.woocommerce-account .wc-block-components-notice-banner.is-error {
    border-color: #e05252;
}

.woocommerce-account .wc-block-components-notice-banner.is-error > svg {
    background-color: #e05252;
}

.woocommerce-form-login__fields .woocommerce-LostPassword.lost_password {
    text-align: center;
}

.woocommerce-form-login__fields .woocommerce-LostPassword.lost_password a {
    font-family: var(--wp--preset--font-family--emblema-headline-two);
    font-size: 0.875rem;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--gold-400);
}

.woocommerce-account  .woocommerce-ResetPassword.lost_reset_password {
    padding: 44px 1rem;
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
    width: 100%;
}

.woocommerce-account  .woocommerce-ResetPassword.lost_reset_password .input-text {
    border: 0;
    border-radius: 0;
    background-color: transparent;
    border-bottom: 1px solid var(--neautral-200);
    padding: 11px 0;
    margin-bottom: 24px;
    color: var(--neautral-200);
}

.woocommerce #customer_login {
    height: 100vh;
}

@media ( min-width: 768px) {
    .woocommerce-account.wp-theme-mbnavus {
        background-position: center 7%;
        background-size: 120% auto;
    }
}

@media ( min-width: 1024px) {
    .woocommerce-account.wp-theme-mbnavus {
        background-position: center 0%;
        background-size: 100% auto;
    }
    .woocommerce-account.wp-theme-mbnavus .entry-content > .woocommerce {
        min-height: 500px;
        padding-top: 40px;
        padding-bottom: 60px;
    }
    .wc-auth-wrapper form.woocommerce-form.active,
    .wc-auth-wrapper form.woocommerce-form {
        display: flex;
    }
    .woocommerce-form-login__section-title,
    .woocommerce-form-login__fields {
        width: 50%;
    }

    .woocommerce-form-login__fields {
        padding-top: 0;
        padding-bottom: 0;
    }

    .woocommerce-form-login__fieldswrapper {
        padding: 40px;
    }
    .wc-auth-wrapper .woocommerce-form-login, 
    .wc-auth-wrapper .woocommerce-form-register {
        flex-direction: row;
    }

    .woocommerce-form-login__section-title h1,
    .woocommerce-form-login__section-title .wc-form-toggle {
        text-align: left;
    }

    .woocommerce-form-login__section-title {
        margin-top: 40px;
        margin-left: 60px;
    }
}

@media ( min-width: 1280px ) {
    .woocommerce-account.wp-theme-mbnavus {
        background-position: center 0%;
        background-size: 70% auto;
    }
    .wc-auth-wrapper {
        padding-left: 0;
        padding-right: 0;
    }
    .woocommerce-form-login__section-title {
        width: calc(50% - 105px);
        margin-top: 88px;
    }
    .woocommerce-form-login__fields {
        width: calc(50% + 105px);
    }
    .woocommerce-form-login__fieldswrapper {
        padding: 40px 60px;
    }
    .woocommerce-form-login__section-title h1 {
        font-size: 2.5rem;
    }
    .woocommerce-form-login__section-title .wc-form-toggle {
        font-size: 1.25rem;
    }
    .woocommerce-account  .woocommerce-ResetPassword.lost_reset_password {
        padding: 80px 0;
    }
}