/* Page-specific styles; shared responsive design in global.css. */

/* Explains why a shopper was sent back to sign-in from checkout. */
.login-session-note { margin: 1rem 0; padding: 0.85rem 1rem; border: 1px solid #e7c46b; border-radius: 0.75rem; background: #fff8e5; color: #59420d; line-height: 1.5; }

/* Keeps the show/hide control inside the customer password field. */
.user-password-control { position:relative; display:block; }
.user-password-control input { padding-right:76px; }
.user-password-toggle { position:absolute; top:50%; right:12px; transform:translateY(-50%); border:0; background:transparent; color:#155b46; font:600 .78rem 'DM Sans',sans-serif; cursor:pointer; }
.user-password-toggle:focus-visible { outline:2px solid #628b6b; outline-offset:3px; border-radius:4px; }

/* Styles passwordless email and Google sign-in choices. */
#login-form[hidden],#email-code-form[hidden],#email-code-field[hidden],.google-auth[hidden] { display:none; }
.email-code-divider { display:flex; align-items:center; gap:12px; margin:18px 0 12px; color:#879087; font-size:.78rem; }
.email-code-divider::before,.email-code-divider::after { content:""; height:1px; flex:1; background:#e5e9e3; }
.email-code-toggle,.email-code-resend,.email-code-back { border:0; background:none; color:#155b46; font:600 .84rem 'DM Sans',sans-serif; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.email-code-toggle { display:block; margin:0 auto 10px; }
.email-code-intro { margin:0; color:#748077; font-size:.82rem; line-height:1.55; }
.email-code-form { margin-top:12px; }
.email-code-form input[name="otp"] { letter-spacing:.3em; font-weight:700; }
.email-code-resend,.email-code-back { display:block; margin:12px auto 0; }
.google-auth { margin-top:16px; }
.google-auth #google-signin-button { display:flex; justify-content:center; min-height:42px; }
.google-auth-feedback { margin-top:10px; }