/*
 * My account, logged out: log in / create account, lost and reset password. Same cards,
 * fields and buttons as the checkout (checkout.css). Loaded only for logged-out
 * visitors on the account page (csr_fse_enqueue_design), so the logged-in pages are untouched.
 */

.crc-acct-intro{margin:0 0 24px;color:var(--crc-muted);font-size:16px;max-width:62ch}

/* two cards; the forms inside lose WooCommerce's own box */
.woocommerce-account #customer_login.col2-set{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.woocommerce-account #customer_login.col2-set::before,.woocommerce-account #customer_login.col2-set::after{content:none}
.woocommerce-account #customer_login .u-column1,.woocommerce-account #customer_login .u-column2,.woocommerce-account .woocommerce form.lost_reset_password{float:none;width:auto;min-width:0;background:#fff;border:1px solid var(--crc-line);border-radius:10px;padding:22px}
.woocommerce-account #customer_login h2{margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--crc-line);font-size:20px;color:var(--crc-navy)}
.woocommerce-account .woocommerce form.login,.woocommerce-account .woocommerce form.register{border:0;padding:0;margin:0;border-radius:0}
.woocommerce-account .woocommerce form.lost_reset_password{max-width:520px}
.woocommerce-account .woocommerce form.lost_reset_password>p:first-child{margin-top:0;color:var(--crc-muted)}

/* fields */
.woocommerce-account .woocommerce form .form-row{float:none;width:auto;margin:0 0 14px;padding:0}
.woocommerce-account .woocommerce form .form-row label{font-family:var(--crc-font-head);font-size:13px;font-weight:600;color:var(--crc-ink);margin-bottom:6px;line-height:1.3}
.woocommerce-account .woocommerce form .form-row .required{color:var(--crc-red);text-decoration:none}
.woocommerce-account .woocommerce form .form-row input.input-text{box-sizing:border-box;width:100%;border:1px solid var(--crc-line);border-radius:7px;background:#fff;color:var(--crc-ink);font-family:var(--crc-font-body);font-size:16px;line-height:1.4;padding:11px 14px;min-height:48px;box-shadow:none;transition:border-color .15s,box-shadow .15s}
.woocommerce-account .woocommerce form .form-row input.input-text:hover{border-color:#b9c4cf}
.woocommerce-account .woocommerce form .form-row input.input-text:focus{outline:0;border-color:var(--crc-navy);box-shadow:0 0 0 3px rgba(1,63,99,.15)}
.woocommerce-account .woocommerce form .password-input{display:block;position:relative}
.woocommerce-account .woocommerce form .password-input input.input-text{padding-right:48px}
.woocommerce-account .woocommerce form .show-password-input{top:50%;right:12px;transform:translateY(-50%);background-color:transparent}
.woocommerce-account .woocommerce form .woocommerce-privacy-policy-text,.woocommerce-account .woocommerce form.register>p:not(.form-row){font-size:14px;color:var(--crc-muted)}

/* log in: "Remember me" and "Lost your password?" on one row, the button full width under them */
.woocommerce-account .woocommerce form.login{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px}
.woocommerce-account .woocommerce form.login>*{grid-column:1/-1}
.woocommerce-account .woocommerce form.login>p.form-row:not(.woocommerce-form-row){display:contents}
.woocommerce-account .woocommerce form.login .woocommerce-form-login__rememberme{grid-column:1;order:1;display:flex;align-items:center;gap:8px;margin:0 0 14px;font-family:var(--crc-font-body);font-size:15px;font-weight:400}
.woocommerce-account .woocommerce form.login .woocommerce-form-login__rememberme input{accent-color:var(--crc-navy);margin:0}
.woocommerce-account .woocommerce form.login .lost_password{grid-column:2;order:1;margin:0 0 14px;font-size:15px}
.woocommerce-account .woocommerce form.login .woocommerce-form-login__submit{grid-column:1/-1;order:2}

/* buttons: log in (and the password forms) solid navy; create account outlined */
.woocommerce-account .woocommerce form .woocommerce-form-login__submit,.woocommerce-account .woocommerce form .woocommerce-form-register__submit,.woocommerce-account .woocommerce form.lost_reset_password button.button{float:none;width:100%;margin:4px 0 0;border:2px solid var(--crc-navy);border-radius:7px;padding:13px 24px;font-family:var(--crc-font-head);font-weight:700;font-size:16px;line-height:1.3;cursor:pointer}
.woocommerce-account .woocommerce form .woocommerce-form-login__submit,.woocommerce-account .woocommerce form.lost_reset_password button.button{background:var(--crc-navy);color:#fff}
.woocommerce-account .woocommerce form .woocommerce-form-login__submit:hover,.woocommerce-account .woocommerce form.lost_reset_password button.button:hover{background:var(--crc-navy-dark);border-color:var(--crc-navy-dark);color:#fff}
.woocommerce-account .woocommerce form .woocommerce-form-register__submit{background:#fff;color:var(--crc-navy)}
.woocommerce-account .woocommerce form .woocommerce-form-register__submit:hover{background:var(--crc-navy);color:#fff}
.woocommerce-account .woocommerce form button:focus-visible{outline:3px solid rgba(1,63,99,.35);outline-offset:2px}

@media(max-width:900px){.woocommerce-account #customer_login.col2-set{grid-template-columns:1fr}}
@media(max-width:600px){.woocommerce-account #customer_login .u-column1,.woocommerce-account #customer_login .u-column2,.woocommerce-account .woocommerce form.lost_reset_password{padding:16px}}
