/* E-mail OTP is added inline below the shared identifier input. */
.otino-email-inline{direction:rtl;text-align:right;width:100%;margin:8px 0;font-family:inherit;box-sizing:border-box}
.otino-email-inline *{box-sizing:border-box}
.otino-email-inline[hidden],.otino-email-code-row[hidden],.otino-email-verify[hidden],.otino-email-resend[hidden],.otino-email-edit[hidden]{display:none!important}
.otino-email-status{margin:8px 0;line-height:1.8;font-size:13px}
.otino-email-status:empty{display:none}
.otino-email-status.is-error{color:#b42318}
.otino-email-status.is-success{color:#18794e}
.otino-email-code-row{margin:10px 0}
.otino-email-code-label{display:block;margin:8px 0 6px;font-size:14px;font-weight:500}
.otino-email-code{display:none!important}
.otino-email-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.otino-email-actions .button,.otino-email-edit{min-height:40px;flex:1;cursor:pointer;font:inherit}
.otino-email-actions .button[disabled]{opacity:.6;cursor:wait}
.otino-email-edit{display:inline-block;padding:7px 10px;border:0;background:transparent;color:inherit;text-decoration:underline}

/* Keep the single identifier field editable and above accidental theme overlays. */
#otino-login-register-form-mobile input[name="otino_mobile"],
form.woocommerce-form-login.login input[name="otino_mobile"]{
    position:relative !important;
    z-index:2 !important;
    pointer-events:auto !important;
    opacity:1 !important;
    visibility:visible !important;
    user-select:text !important;
    -webkit-user-select:text !important;
    touch-action:manipulation;
}
#otino-login-register-form-mobile input[name="otino_mobile"]:focus,
form.woocommerce-form-login.login input[name="otino_mobile"]:focus{outline-offset:2px;}


/* Keep the unified identifier readable even when older theme CSS formats OTP digits with wide tracking. */
#otino-login-register-form-mobile input[name="otino_mobile"],
form.woocommerce-form-login.login input[name="otino_mobile"],
.login-form-wrapper-otino #otino-login-register-form-mobile input[name="otino_mobile"],
.otino-popup-container input[name="otino_mobile"] {
    letter-spacing: normal !important;
    word-spacing: normal !important;
    font-kerning: normal !important;
    text-align: left !important;
}

/* The code controls must remain a horizontal row; some themes force buttons to full width. */
.otino-email-inline .otino-email-actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 10px !important;
}
.otino-email-inline .otino-email-actions > button {
    display: flex !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 8px 6px !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    line-height: 1.5 !important;
    font-size: 13px !important;
    writing-mode: horizontal-tb !important;
}
.otino-email-inline .otino-email-actions > .otino-email-edit {
    text-decoration: none !important;
    border: 1px solid currentColor !important;
    border-radius: 6px !important;
    background: transparent !important;
}
@media (max-width: 380px) {
    .otino-email-inline .otino-email-actions { gap: 5px !important; }
    .otino-email-inline .otino-email-actions > button { padding: 7px 3px !important; font-size: 11px !important; }
}
/* Higher-specificity override for WooCommerce/Jannah themes that force every button to 100% width. */
form.woocommerce-form-login.login .otino-email-inline .otino-email-actions,
#otino-login-register-form-mobile .otino-email-inline .otino-email-actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
}
form.woocommerce-form-login.login .otino-email-inline .otino-email-actions > button,
#otino-login-register-form-mobile .otino-email-inline .otino-email-actions > button {
    display: flex !important;
    width: auto !important;
    flex: 1 1 0 !important;
    float: none !important;
    clear: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}


/* Email OTP now uses the same segmented field and information rows as SMS OTP. */
.otino-email-inline .otino-email-code-row { margin: 10px 0 0 !important; }
.otino-email-inline .otino-email-code-label { display:block !important; margin:8px 0 6px !important; font-size:14px !important; font-weight:500 !important; }
.otino-email-inline .otino-email-otp-container {
    display:flex !important;
    justify-content:center !important;
    align-items:stretch !important;
    gap:2.5% !important;
    direction:ltr !important;
    width:100% !important;
    margin:0 !important;
}
.otino-email-inline .otino-email-otp-box {
    box-sizing:border-box !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    aspect-ratio:1 / 1 !important;
    min-height:0 !important;
    padding:8px 4px !important;
    margin:0 !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    direction:ltr !important;
    font-size:20px !important;
    line-height:1.2 !important;
    letter-spacing:normal !important;
    border:1px solid #dcdcdc !important;
    border-radius:14px !important;
    box-shadow:none !important;
    background:#fff !important;
    color:#222 !important;
    -webkit-appearance:none !important;
    appearance:none !important;
}
.otino-email-inline .otino-email-otp-box:focus { outline:none !important; border-color:var(--var-otino-main-color, #ed332b) !important; }
.otino-email-inline .otino-email-identity-row {
    display:flex !important;
    flex-direction:row !important;
    justify-content:space-between !important;
    align-items:center !important;
    gap:8px !important;
    flex-wrap:wrap !important;
    margin:10px 0 0 !important;
    font-size:13px !important;
}
.otino-email-inline .otino-email-identity-row[hidden],
.otino-email-inline .otino-email-expiry-row[hidden],
.otino-email-inline .otino-email-resend-row[hidden] { display:none !important; }
.otino-email-inline .otino-email-destination { direction:ltr; unicode-bidi:embed; display:inline-block; }
.otino-email-inline .otino-email-edit { display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:center !important; gap:2px !important; cursor:pointer !important; white-space:nowrap !important; border:0 !important; border-radius:0 !important; padding:0 !important; background:transparent !important; color:var(--var-otino-main-color, #ed332b) !important; text-decoration:none !important; }
.otino-email-inline .otp-time-reset-otino {
    color:#52667B !important;
    font-size:13px !important;
    justify-content:center !important;
    display:flex !important;
    align-items:center !important;
    text-align:center !important;
    margin-top:8px !important;
    margin-bottom:8px !important;
    gap:4px !important;
    flex-wrap:wrap !important;
}
.otino-email-inline .otino-email-resend-row { text-align:center !important; margin:4px 0 8px !important; }
.otino-email-inline .otino-email-resend {
    border:0 !important;
    padding:2px 6px !important;
    margin:0 !important;
    background:transparent !important;
    color:var(--var-otino-main-color, #ed332b) !important;
    font:inherit !important;
    font-size:12px !important;
    text-decoration:underline !important;
    cursor:pointer !important;
}
.otino-email-inline .otino-email-resend[disabled] { opacity:.55 !important; cursor:wait !important; }
.otino-email-inline .otino-email-actions { display:block !important; width:100% !important; margin-top:8px !important; }
.otino-email-inline .otino-email-actions .otino-email-verify {
    display:block !important;
    width:100% !important;
    min-height:48px !important;
    margin:0 !important;
    float:none !important;
    clear:both !important;
    text-align:center !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
    font:inherit !important;
    cursor:pointer !important;
}
.otino-email-inline .otino-email-actions .otino-email-verify[hidden] { display:none !important; }
.otino-email-inline .otino-email-actions .otino-email-verify[disabled] { opacity:.6 !important; cursor:wait !important; }
@media (max-width:380px) {
    .otino-email-inline .otino-email-otp-container { gap:5px !important; }
    .otino-email-inline .otino-email-otp-box { padding:6px 2px !important; font-size:18px !important; border-radius:11px !important; }
    .otino-email-inline .otp-change-phone-otino { font-size:12px !important; }
}
