/* =========================================
   Main panel
   ========================================= */

.wceol-panel {
    clear: both;
    width: 100%;
    margin: 0 0 18px;
}

/* =========================================
   Verification code row
   ========================================= */

.wceol-code-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    margin-bottom: 10px;
}

/* Six digit inputs */
.wceol-code-fields {
    display: none;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
    padding: 0;
    flex-wrap: nowrap;
}

.wceol-title {
	display: inline-block;
	padding-bottom: 5px;
	margin-top: .25em;
}

.wceol-code-visible .wceol-code-fields {
    display: flex;
}

/* Individual digit input */
.wceol-code-fields input {
    box-sizing: border-box;
    width: 42px;
    height: 46px;
    min-width: 0;
    margin: 0;
    padding: 0 !important;

    border: 1px solid #c9c9c9;
    border-radius: 4px !important;
    background: #fff;

    text-align: center;
    font-size: 20px;
    line-height: 1;
    font-weight: 600;
}

.wceol-code-fields input:focus {
    border: 1px solid #A0A7A9 !important;
    outline-offset: 1px;
}

/* =========================================
   Send code button
   ========================================= */

.wceol-send-row {
    display: flex;
    align-items: center;
    gap: 12px;
	margin-top: 1.5em;
	
}

.wceol-send {
	width:100%;
}

/* =========================================
   Resend code link
   ========================================= */



.wceol-resend {
    display: inline-block;
    flex-shrink: 0;
    margin: 0;
	padding-left: 15px;

    text-decoration: underline;
    cursor: pointer;
    white-space: nowrap;
}

.wceol-resend:hover {
    text-decoration: none;
}

.wceol-resend.wceol-disabled {
    opacity: 0.5;
    pointer-events: none;
}

/* =========================================
   Login button
   ========================================= */

.wceol-login-row {
	margin-top: 1.5em;
}

.wceol-login-row button[hidden] {
    display: none !important;
}

.wceol-login {
	width: 100%;
}

/* =========================================
   Message
   ========================================= */

.wceol-message {
    margin-top: 1.2em;
    font-size: 1em;
    line-height: 1.5;
}

.wceol-message.is-error {
    color: #b32d2e;
}

/* =========================================
   Button states
   ========================================= */

.wceol-panel button:disabled {
    opacity: 0.6;
    cursor: wait;
}

.wceol-panel [hidden],
form.woocommerce-form-login [hidden],
form.login [hidden] {
    display: none !important;
}

/* =========================================
   Responsive
   ========================================= */

/* =========================================
   Responsive
   ========================================= */

@media (max-width: 600px) {

    .wceol-code-row {
        gap: 8px;
    }

    .wceol-code-fields {
        gap: 6px;
        flex-wrap: wrap;
    }

    .wceol-code-fields input {
        width: 38px;
        height: 42px;
    }

    .wceol-resend {
        flex-basis: 100%;
        padding-left: 0;
        margin-top: 5px;
    }
}


.woocommerce-form-login .woocommerce-form-login__submit {
    display: none !important;
}

.woocommerce-form-login .form-row-login-password {
    display: none !important;
}

.woocommerce-form-login .form-row-login-submit{
    display: none !important;
}


.woocommerce-LostPassword, .woocommerce-form-login__rememberme {
    display: none !important;
}
.woocommerce-form-register .ast-woo-form-actions, .woocommerce-form-login .ast-woo-form-actions {
	border-top: 1px solid #DCE3E5;
	padding-top: 2em;
	margin-top: 3em !important;
}

.woocommerce-form-register .woocommerce-form-register__submit {
	margin-top: 1.5em !important;
}

.woocommerce-LostPassword.lost_password {
  text-align: left !important;

}