.customer-auth-page {
    display: grid;
    place-items: center;
    min-height: 58vh;
}

.customer-auth-card {
    width: min(100%, 520px);
    padding: clamp(25px, 5vw, 44px);
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #faf7f1;
    box-shadow: 0 16px 45px rgba(57, 49, 39, .08);
}

.customer-auth-card h1,
.customer-account-heading h1 {
    margin: 8px 0 10px;
    font: clamp(32px, 5vw, 43px)/1.15 var(--heading);
    letter-spacing: -.7px;
}

.customer-auth-card > p { color: var(--muted); }

.customer-form {
    display: grid;
    gap: 18px;
    margin-top: 25px;
}

.customer-form fieldset {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fffdfa;
}

.customer-form fieldset[hidden] { display: none; }
.customer-form legend { float: none; width: auto; margin: 0 0 15px; padding: 0 5px; color: var(--brown); font: 20px var(--heading); }

.google-auth-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 100%;
    min-height: 48px;
    margin-top: 24px;
    padding: 10px 18px;
    border: 1px solid #c8c2b8;
    border-radius: 5px;
    background: #fff;
    color: #332f2a;
    font-size: 14px;
    font-weight: 600;
}

.google-auth-button svg { width: 20px; height: 20px; flex: 0 0 20px; }
.google-auth-button:not(:disabled):hover { border-color: var(--brown); background: var(--soft); }
.google-auth-button:disabled { cursor: not-allowed; opacity: .62; }
.google-auth-note { margin: 7px 0 0!important; text-align: center; font-size: 12px; }

.customer-auth-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 22px;
    color: var(--muted);
    font-size: 12px;
}

.customer-auth-divider::before,
.customer-auth-divider::after { flex: 1; height: 1px; background: var(--line); content: ''; }

.customer-form small,
.customer-account-note {
    color: var(--muted);
    font-size: 12px;
}

.customer-auth-switch {
    margin: 25px 0 0;
    text-align: center;
    font-size: 14px;
}

.customer-auth-switch a,
.customer-account-page a:not(.btn) {
    color: var(--brand-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.reseller-auth-card { max-width: 760px; }
.reseller-price-label {
    display: inline-flex;
    margin: 0 0 9px;
    padding: 4px 9px;
    border: 1px solid #d7c29e;
    border-radius: 999px;
    background: #fff6e7;
    color: #7a4d24;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.customer-account-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px;
}

.customer-account-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr);
    gap: 25px;
    align-items: start;
}

.customer-panel {
    padding: 27px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #faf7f1;
}

.customer-panel + .customer-panel { margin-top: 22px; }
.customer-panel h2 { margin-bottom: 20px; font: 25px var(--heading); }
.customer-order-link { white-space: nowrap; }

.customer-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.customer-panel-heading h2 { margin-bottom: 4px; }
.customer-panel-heading p { margin: 0; color: var(--muted); font-size: 13px; }

.address-book {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.address-card,
.checkout-address-option {
    border: 1px solid var(--line);
    border-radius: 7px;
    background: #fffdfa;
}

.address-card { padding: 18px; }
.address-card.is-default { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.address-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.address-badge { padding: 3px 8px; border-radius: 999px; background: #fce6d2; color: var(--brand-dark); font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.address-card address { min-height: 112px; margin: 13px 0 17px; color: var(--muted); font-size: 13px; line-height: 1.65; }
.address-card address strong { color: var(--ink); }
.address-actions { display: flex; align-items: center; gap: 13px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 13px; }
.address-actions form { margin: 0; }
.address-actions button { border: 0; background: transparent; padding: 0; color: var(--brand-dark); font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }

.checkout-address-list { display: grid; gap: 12px; margin-bottom: 19px; }
.checkout-address-option { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 12px; padding: 16px; cursor: pointer; }
.checkout-address-option:has(input:checked) { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); background: #fffaf5; }
.checkout-address-option input { margin-top: 4px; }
.checkout-address-option strong { display: inline-block; margin-right: 8px; }
.checkout-address-option span { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; line-height: 1.55; }
.checkout-new-address { margin-top: 18px; }
.checkout-new-address[hidden] { display: none !important; }
.checkout-saved-note { margin: -5px 0 18px; color: var(--muted); font-size: 12px; }

@media (max-width: 767.98px) {
    .customer-account-heading { align-items: flex-start; flex-direction: column; }
    .customer-account-grid { grid-template-columns: 1fr; }
    .customer-panel { padding: 22px 18px; }
    .address-book { grid-template-columns: 1fr; }
    .address-card address { min-height: 0; }
}