.customer-auth {
    --auth-primary: rgb(221,113,116);
    --auth-primary-dark: #0d4fd1;
    --auth-text: #172033;
    --auth-muted: #6b7280;
    display: grid;
    min-height: clamp(600px, 72vh, 820px);
    place-items: center;
    padding: 80px 20px;
    background:
        radial-gradient(circle at 12% 16%, rgba(23, 107, 255, .13), transparent 31%),
        radial-gradient(circle at 88% 82%, rgba(255, 124, 65, .12), transparent 27%),
        #f5f7fb;
}

.customer-auth__field textarea{width:100%;min-height:120px;margin:0;padding:16px 18px;border:1px solid #dfe4ec;border-radius:10px;outline:0;background:#f8fafc;color:var(--auth-text);font:inherit;resize:vertical;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}
.customer-auth__field textarea:focus{border-color:var(--auth-primary);background:#fff;box-shadow:0 0 0 4px rgba(23,107,255,.1)}
.customer-auth__error{color:#c62828;font-size:13px;font-weight:600}
.customer-profile-edit__actions{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:4px}
.customer-profile-edit__actions .customer-account__secondary{flex:0 0 auto;min-width:110px}
.customer-profile-edit__actions .customer-auth__submit{width:auto;min-width:180px}
.customer-account__alert{margin-bottom:24px;padding:14px 18px;border-radius:10px;font-weight:600}
.customer-account__alert--success{border:1px solid #b9ebca;background:#eaf9ef;color:#187a43}
.customer-account__links{display:flex;align-items:center;justify-content:flex-end;gap:18px;flex-wrap:wrap}
@media(max-width:575px){.customer-profile-edit__actions{align-items:stretch;flex-direction:column-reverse}.customer-profile-edit__actions .customer-auth__submit{width:100%}}

/* Customer account: reuses the authentication palette and controls. */
.customer-account{--auth-primary:#176bff;--auth-primary-dark:#0d4fd1;--auth-text:#172033;--auth-muted:#6b7280;padding:72px 20px 88px;background:#f5f7fb;color:var(--auth-text)}
.customer-account *,.customer-account *::before,.customer-account *::after{box-sizing:border-box}
.customer-account__container{width:min(100%,1180px);margin:0 auto}
.customer-account__header,.customer-account__panel-heading,.customer-account__columns{display:flex;align-items:center;justify-content:space-between;gap:24px}
.customer-account__header{margin-bottom:34px}.customer-account__header h1{margin:0 0 8px;font-size:clamp(30px,4vw,44px);line-height:1.15}
.customer-account__header p,.customer-account__product span,.customer-account__period{color:var(--auth-muted)}.customer-account__header p{margin:0}
.customer-account a{color:var(--auth-primary);font-weight:700;text-decoration:none}
.customer-account__profile-link,.customer-account__secondary{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border:1px solid #dbe2ee;border-radius:9px;background:#fff;white-space:nowrap}
.customer-account__panel,.customer-account__summary{border:1px solid #e5e9f0;border-radius:16px;background:#fff;box-shadow:0 16px 42px rgba(31,46,76,.07)}
.customer-account__panel{padding:30px}.customer-account__panel-heading{margin-bottom:26px}
.customer-account__panel h2,.customer-account__summary h2{margin:4px 0 0;color:var(--auth-text);font-size:24px}
.customer-account__kicker{color:var(--auth-primary);font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.customer-account__table-wrap{overflow-x:auto}.customer-account__table{width:100%;margin:0;border:0;border-collapse:collapse}
.customer-account__table th{padding:15px 18px;border:0;background:#f3f6fb;color:#596275;font-size:12px;letter-spacing:.06em;text-align:left;text-transform:uppercase}
.customer-account__table th:first-child{border-radius:9px 0 0 9px}.customer-account__table th:last-child{border-radius:0 9px 9px 0}
.customer-account__table td{padding:22px 18px;border:0;border-bottom:1px solid #edf0f5;vertical-align:middle}
.customer-account__product{display:flex;align-items:center;gap:14px}.customer-account__product-icon{display:grid;flex:0 0 48px;width:48px;height:48px;place-items:center;border-radius:12px;background:linear-gradient(135deg,var(--auth-primary),#55a3ff);color:#fff!important;font-size:20px;font-weight:800}
.customer-account__product strong,.customer-account__product span{display:block}.customer-account__product span{margin-top:3px;font-size:13px}
.customer-account__status{display:inline-flex;padding:7px 11px;border-radius:999px;background:#eaf9ef;color:#18864b;font-size:12px;font-weight:800;white-space:nowrap}.customer-account__action{text-align:right}
.customer-account__status--canceled,.customer-account__status--expire{background:#fff0f0;color:#c83c3c}.customer-account__status+.customer-account__period{display:block;margin-top:6px;font-size:12px}.customer-account__pagination{margin-top:24px}.customer-order-detail__grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:stretch;gap:26px}.customer-order-detail__expired{color:#c83c3c}.customer-account__summary small{display:block;margin-top:3px;font-size:11px}
.customer-account__columns{align-items:stretch;margin-top:26px}.customer-account__columns>.customer-account__panel{flex:1 1 auto}
.customer-account__details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin:0}.customer-account__details div{padding:17px 0;border-bottom:1px solid #edf0f5}
.customer-account__details dt{margin-bottom:5px;color:var(--auth-muted);font-size:12px;font-weight:700;text-transform:uppercase}.customer-account__details dd{margin:0;font-weight:600}
.customer-account__summary{flex:0 0 340px;padding:30px}.customer-account__summary ul{margin:24px 0;padding:0;list-style:none}
.customer-account__summary li{display:flex;justify-content:space-between;gap:20px;padding:13px 0;color:var(--auth-muted)}.customer-account__summary li strong{color:var(--auth-text)}
.customer-account__summary-total{margin-top:8px;border-top:1px solid #e5e9f0;font-size:17px}.customer-account__pay{display:flex;align-items:center;justify-content:center;color:#fff!important}
@media(max-width:900px){.customer-account__columns{flex-direction:column}.customer-account__summary{flex-basis:auto}}
@media(max-width:900px){.customer-order-detail__grid{grid-template-columns:1fr}}
@media(max-width:767px){.customer-account{padding:48px 16px 64px}.customer-account__header,.customer-account__panel-heading{align-items:flex-start;flex-direction:column}.customer-account__panel,.customer-account__summary{padding:22px 18px;border-radius:13px}.customer-account__table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.customer-account__table,.customer-account__table tbody,.customer-account__table tr,.customer-account__table td{display:block;width:100%}.customer-account__table td{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;text-align:right}.customer-account__table td::before{content:attr(data-label);color:var(--auth-muted);font-size:12px;font-weight:700;text-align:left;text-transform:uppercase}.customer-account__table td:first-child{display:block;padding-top:0;text-align:left}.customer-account__table td:first-child::before,.customer-account__action::before{display:none}.customer-account__action{justify-content:flex-end!important}.customer-account__details{grid-template-columns:1fr}}

.customer-auth *,
.customer-auth *::before,
.customer-auth *::after {
    box-sizing: border-box;
}

.customer-auth__card {
    width: min(100%, 540px);
    padding: 52px 50px 46px;
    border: 1px solid #e8ebf1;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(31, 46, 76, .11);
}

.customer-auth__card--register {
    width: min(100%, 760px);
}

.customer-auth__heading {
    margin-bottom: 32px;
    text-align: center;
}

.customer-auth__eyebrow {
    display: inline-block;
    margin-bottom: 10px;
    color: var(--auth-primary);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.customer-auth__heading h1 {
    margin: 0 0 12px;
    color: var(--auth-text);
    font-size: clamp(30px, 4vw, 40px);
    line-height: 1.15;
}

.customer-auth__heading p {
    max-width: 510px;
    margin: 0 auto;
    color: var(--auth-muted);
    font-size: 15px;
    line-height: 1.7;
}

.customer-auth__form,
.customer-auth__field {
    display: grid;
    gap: 10px;
}

.customer-auth__form {
    gap: 20px;
}

.customer-auth__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.customer-auth__field label {
    color: var(--auth-text);
    font-size: 14px;
    font-weight: 600;
}

.customer-auth__field input {
    width: 100%;
    height: 56px;
    margin: 0;
    padding: 0 18px;
    border: 1px solid #dfe4ec;
    border-radius: 10px;
    outline: 0;
    background: #f8fafc;
    color: var(--auth-text);
    font: inherit;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.customer-auth__field input:focus {
    border-color: var(--auth-primary);
    background: #fff;
    box-shadow: 0 0 0 4px rgba(23, 107, 255, .1);
}

.customer-auth__options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-size: 14px;
}

.customer-auth__check {
    display: inline-flex;
    align-items: flex-start;
    gap: 9px;
    color: var(--auth-muted);
    cursor: pointer;
}

.customer-auth__check input {
    width: 17px;
    height: 17px;
    margin: 2px 0 0;
    accent-color: var(--auth-primary);
}

.customer-auth a {
    color: var(--auth-primary);
    font-weight: 600;
    text-decoration: none;
}

.customer-auth a:hover {
    color: var(--auth-primary-dark);
}

.customer-auth__submit {
    width: 100%;
    min-height: 56px;
    border: 0;
    border-radius: 10px;
    background: var(--auth-primary);
    box-shadow: 0 12px 24px rgba(23, 107, 255, .22);
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.customer-auth__submit:hover {
    background: var(--auth-primary-dark);
    box-shadow: 0 14px 28px rgba(13, 79, 209, .25);
    transform: translateY(-1px);
}

.customer-auth__switch {
    margin: 28px 0 0;
    color: var(--auth-muted);
    font-size: 14px;
    text-align: center;
}

.customer-auth__terms {
    line-height: 1.6;
}

@media (max-width: 767px) {
    .customer-auth {
        min-height: 560px;
        padding: 48px 16px;
    }

    .customer-auth__card {
        padding: 38px 24px 34px;
        border-radius: 14px;
    }

    .customer-auth__grid {
        grid-template-columns: 1fr;
    }

    .customer-auth__options {
        align-items: flex-start;
        flex-direction: column;
    }
}
