.customer-auth-page main { background: #f7f7f7; }
.customer-auth-shell { min-height: 620px; padding: 54px 18px 70px; }
.customer-auth-card { width: min(960px, 100%); margin: 0 auto; display: grid; grid-template-columns: .88fr 1.12fr; overflow: hidden; border: 1px solid #e3e3e3; border-radius: 20px; background: #fff; box-shadow: 0 18px 55px rgba(36,36,36,.10); }
.customer-auth-visual {
    position: relative;
    display: flex;
    min-height: 570px;
    padding: 46px;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(145deg, #ff5b00, #ff5b00);
}
.customer-auth-visual::before,.customer-auth-visual::after { content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.1); }
.customer-auth-visual::before { width:300px;height:300px;right:-115px;top:-90px; }
.customer-auth-visual::after { width:230px;height:230px;left:-110px;bottom:-85px; }
.auth-visual-brand,.auth-benefits { position:relative;z-index:1; }
.auth-visual-brand i { width:52px;height:52px;display:grid;margin-bottom:28px;border-radius:15px;place-items:center;color:#ff5b00;background:#fff;font-size:24px; }
.auth-visual-brand h2 { max-width:330px;margin:0 0 14px;font-size:34px;line-height:1.15;letter-spacing:-1px; }
.auth-visual-brand p { max-width:330px;margin:0;color:rgba(255,255,255,.83);font-size:15px;line-height:1.7; }
.auth-benefits { display:grid;gap:13px; }
.auth-benefits span { display:flex;gap:10px;align-items:center;font-size:14px; }
.auth-benefits i { width:24px;height:24px;display:grid;border-radius:50%;place-items:center;color:#ff5b00;background:#fff;font-size:11px; }
.customer-auth-form { padding:48px 52px; }
.customer-auth-form .auth-eyebrow { margin:0 0 8px;color:#ff5b00;font-size:12px;font-weight:800;letter-spacing:1.3px; }
.customer-auth-form h1 { margin:0;color:#242424;font-size:31px;letter-spacing:-.8px; }
.customer-auth-form .auth-subtitle { margin:10px 0 30px;color:#666;line-height:1.6; }
.customer-field { margin-bottom:18px; }
.customer-field label { display:block;margin-bottom:8px;color:#333;font-size:13px;font-weight:700; }
.customer-input { position:relative; }
.customer-input > i { position:absolute;top:50%;left:15px;color:#8a8a8a;transform:translateY(-50%); }
.customer-input input { width:100%;height:51px;padding:0 46px;border:1px solid #d6d6d6;border-radius:9px;outline:0;color:#242424;background:#fff;font-size:14px;transition:.2s; }
.customer-input input:focus { border-color:#ff5b00;box-shadow:0 0 0 3px rgba(226,27,112,.10); }
.customer-input input.is-invalid { border-color:#dc3545; }
.customer-field select { width:100%;height:51px;padding:0 42px 0 15px;border:1px solid #d6d6d6;border-radius:9px;outline:0;color:#242424;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23777' d='m1.4.6 4.6 4.6L10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E") no-repeat right 16px center;font-size:14px;appearance:none;transition:.2s; }
.customer-field select:focus { border-color:#ff5b00;box-shadow:0 0 0 3px rgba(255,91,0,.12); }
.customer-field select:disabled { color:#9b9b9b;background-color:#f7f7f7;cursor:not-allowed; }
.password-visibility { position:absolute;right:8px;top:7px;width:37px;height:37px;border:0;border-radius:7px;color:#666;background:transparent;cursor:pointer; }
.password-visibility:hover { color:#ff5b00;background:#fff1f7; }
.customer-input input.otp-input { padding-right:15px;letter-spacing:9px;font-size:17px;font-weight:700; }
.auth-resend { display:flex;gap:7px;align-items:center;margin-top:16px;color:#666;justify-content:center;font-size:13px; }
.auth-resend button { padding:0;border:0;color:#ff5b00;background:transparent;font-size:13px;font-weight:700;cursor:pointer; }
.auth-resend button:hover { text-decoration:underline; }
.auth-resend button i { margin-right:3px;font-size:11px; }
.auth-form-meta { display:flex;margin:-3px 0 22px;justify-content:flex-end; }
.auth-form-meta a,.auth-switch a { color:#ff5b00;font-weight:700; }
.customer-auth-submit { width:100%;height:51px;border:0;border-radius:9px;color:#fff;background:#ff5b00;box-shadow:0 9px 20px rgba(226,27,112,.22);font-size:15px;font-weight:800;cursor:pointer;transition:.2s; }
.customer-auth-submit:hover { background:#ff5b00;transform:translateY(-1px); }
.auth-switch { margin:25px 0 0;padding-top:22px;border-top:1px solid #eee;color:#666;text-align:center;font-size:14px; }
.customer-auth-form .invalid-feedback { display:block;margin-top:6px;font-size:12px; }
.auth-secure { display:flex;gap:8px;align-items:center;margin-top:22px;color:#888;font-size:12px;justify-content:center; }
.auth-secure i { color:#20a66a; }
@media(max-width:767px){.customer-input input.otp-input{letter-spacing:7px}.customer-auth-shell{padding:24px 12px 45px}.customer-auth-card{display:block;border-radius:15px}.customer-auth-visual{min-height:auto;padding:29px 25px}.auth-visual-brand h2{font-size:26px}.auth-visual-brand p{font-size:13px}.auth-benefits{display:none}.customer-auth-form{padding:30px 24px 34px}.customer-auth-form h1{font-size:27px}.customer-auth-form .auth-subtitle{margin-bottom:24px}}

/* Focused verification page */
.customer-auth-page main { background: #f4f7fb; }
.customer-auth-shell { min-height: calc(100vh - 165px); display: grid; place-items: center; padding: 30px 18px 42px; }
.customer-auth-card { width: min(900px, 100%); border: 0; border-radius: 22px; box-shadow: 0 18px 52px rgba(15, 39, 71, .12); }
.customer-auth-visual { min-height: 455px; padding: 38px 38px 34px; background: linear-gradient(145deg, #ff6900 0%, #f04f13 100%); }
.auth-visual-brand i { width: 58px; height: 58px; border-radius: 18px; color: #ff6900; font-size: 25px; }
.auth-visual-brand h2 { max-width: 285px; font-size: 31px; letter-spacing: -.2px; }
.auth-visual-brand p { color: rgba(255,255,255,.9); }
.customer-auth-form { padding: 32px 42px 30px; background: #fff; }
.auth-form-brand { display: flex; align-items: center; gap: 9px; margin-bottom: 22px; color: #10284d; font-size: 19px; }
.auth-form-brand-mark { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: #ff6900; font-size: 15px; }
.customer-auth-form .auth-eyebrow { margin-bottom: 7px; color: #ff6900; letter-spacing: 1px; }
.customer-auth-form h1 { color: #10284d; font-size: 31px; letter-spacing: -.4px; }
.customer-auth-form .auth-subtitle { max-width: 420px; margin: 8px 0 22px; color: #718096; line-height: 1.45; }
.customer-auth-form .auth-subtitle strong { color: #344a68; font-weight: 800; white-space: nowrap; }
.otp-label-row { display: flex; align-items: center; justify-content: space-between; }
.otp-label-row span { color: #9aa8ba; font-size: 12px; font-weight: 700; }
.customer-input input.otp-input { height: 58px; border: 1.5px solid #dbe4ef; border-radius: 11px; padding-left: 46px; color: #10284d; background: #fbfcfe; font-size: 21px; letter-spacing: 11px; }
.customer-input input.otp-input:focus { border-color: #ff6900; box-shadow: 0 0 0 4px rgba(255,105,0,.12); background: #fff; }
.customer-auth-submit { height: 52px; margin-top: 2px; border-radius: 11px; background: #ff6900; box-shadow: 0 8px 18px rgba(255,105,0,.2); }
.customer-auth-submit:hover { background: #e95f00; }
.auth-resend { margin-top: 14px; }
.auth-resend button { color: #ff6900; }
.auth-switch { margin-top: 20px; padding-top: 17px; }
@media(max-width:767px){.customer-auth-shell{min-height:calc(100vh - 120px);padding:24px 12px 42px}.customer-auth-visual{padding:28px 25px;min-height:250px}.customer-auth-form{padding:30px 24px 34px}.auth-form-brand{margin-bottom:24px}.customer-auth-form h1{font-size:29px}.customer-input input.otp-input{letter-spacing:8px}}
