/* SMS one-time-code login: account page, checkout, profile (inc/sms-login.php) */
.otp{display:grid;gap:12px}
.otp-step{display:grid;gap:10px;margin:0}
.otp-step label{font-weight:700;font-size:14px}
.otp .input{font-size:17px}
.otp-mobile{direction:ltr;text-align:left;letter-spacing:.04em}
.otp-code{direction:ltr;text-align:center;font-size:24px!important;font-weight:800;letter-spacing:.55em;padding-inline-start:calc(12px + .55em)}
.otp-code::placeholder{color:var(--line);letter-spacing:.55em}
.otp-btn{width:100%;padding:12px}
.otp-btn.is-busy{filter:saturate(.4) brightness(1.1);cursor:progress}
.otp-note,.otp-sent,.otp-resend{margin:0;font-size:13px;color:var(--ink-3);line-height:1.8}
.otp-sent b{color:var(--ink);font-weight:800}
.otp-resend{display:flex;gap:8px;align-items:center;justify-content:center}
.otp-link{background:none;border:0;padding:0;color:var(--brand);font:inherit;font-weight:700;cursor:pointer}
.otp-link:disabled{color:var(--ink-3);cursor:default}
.otp-msg{margin:0;padding:8px 12px;border-radius:10px;font-size:13.5px;line-height:1.8;background:var(--err-soft);color:var(--err)}
.otp-msg.is-ok{background:var(--ok-soft);color:var(--ok)}
.otp-hp{position:absolute!important;inset-inline-start:-9999px;width:1px;height:1px;opacity:0}

/* account page: mobile first, email + password as the second tab */
.acc-otp-h{margin:0 0 4px;font-size:18px}
.acc-otp-sub{margin:0 0 14px;font-size:13.5px;color:var(--ink-3)}

/* checkout: a compact card above the purchase form */
.otp-checkout{background:var(--brand-soft);border:1px solid #BFD4FF;border-radius:16px;padding:16px 18px;margin:0 0 18px;display:grid;gap:12px}
.otp-checkout-h{display:grid;gap:2px}
.otp-checkout-h b{font-size:16px;color:var(--brand-deep)}
.otp-checkout-h span{font-size:13px;color:var(--ink-2)}
.otp-checkout .otp{max-width:420px}

/* account panel cards */
.otp-email form{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.otp-email .input{flex:1 1 240px;direction:ltr;text-align:left}
.otp-email b{font-size:16px}
.otp-email p{margin:4px 0}
.otp-card{display:grid;gap:10px}
.otp-card .otp{max-width:420px}
.otp-linked{display:flex;gap:10px;align-items:flex-start;margin:0;color:var(--ink-2)}
.otp-linked .ic{color:var(--ok);flex:none;margin-top:4px}
.otp-change summary{cursor:pointer;color:var(--brand);font-weight:700;font-size:14px;margin-bottom:10px}
.acc-welcome{background:var(--ok-soft);color:var(--ok);border-radius:14px;padding:12px 16px;font-weight:700;margin:0}