.moonstone-account { width:100%; max-width:1140px; margin:0 auto; padding:0 12px; }
.moonstone-account .ms-row { display:grid; grid-template-columns:1fr 2fr; gap:24px; align-items:start; margin-bottom:16px; }
.moonstone-account label { display:block; font-size:16px; margin-top:15px; }
.moonstone-account input:not([type=hidden]) { width:100%; min-width:0; box-sizing:border-box; border:1px solid #1e73be; border-radius:7px; background:#fff; color:#212529; font-size:16px; line-height:1.5; padding:6px 12px; margin-top:10px; }
.moonstone-account input:focus-visible,.moonstone-account button:focus-visible,.moonstone-account summary:focus-visible { outline:3px solid #1e73be; outline-offset:3px; }
.moonstone-account .submitButton,.moonstone-account .btnLogout,.moonstone-account .ms-payment > summary { background:#fff; border:1px solid #fe2151; color:#b81140; padding:8px 16px; text-align:center; font-size:16px; cursor:pointer; border-radius:7px; margin:10px 0; }
.moonstone-account .submitButton { width:100%; }
.moonstone-account .submitButton:hover,.moonstone-account .btnLogout:hover,.moonstone-account .ms-payment > summary:hover { background:#fe2151; color:#fff; }
.moonstone-account .ms-error,.moonstone-account .ms-outstanding { color:#b00020; }
.moonstone-account .ms-error { margin:8px 0; }
.moonstone-account [hidden] { display:none !important; }
.moonstone-account .ms-honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.moonstone-account .ms-logout { display:flex; justify-content:flex-end; }
.moonstone-account iframe { width:100%; height:260px; border:0; border-radius:7px; background:#fff; }
.moonstone-account .ms-agreement { border-bottom:1px solid #ddd; padding:12px 0; }
.moonstone-account summary { cursor:pointer; }
.moonstone-account .ms-expand { display:inline-block; padding:4px 10px; margin-left:8px; border:1px solid #1e73be; border-radius:6px; font-size:14px; }
.moonstone-account .ms-table-scroll { overflow-x:auto; margin-top:12px; }
.moonstone-account table { width:100%; border-collapse:collapse; }
.moonstone-account th,.moonstone-account td { text-align:left; padding:8px; }
.moonstone-account tbody tr:nth-child(odd) { background:#f5f5f5; }
@media (min-width:576px) and (max-width:991px) { .moonstone-account .ms-row { grid-template-columns:1fr 1fr; } }
@media (max-width:575px) { .moonstone-account .ms-row { grid-template-columns:1fr; gap:0; } }

/* Customer login: clean, consistent seven-pixel corners. */
.moonstone-account.ms-login-panel {
    width:100%;
    max-width:640px;
    margin:16px auto 32px;
    padding:30px 32px;
    box-sizing:border-box;
    background:#fff;
    border:1px solid #e4e6eb;
    border-radius:7px;
    box-shadow:0 4px 18px rgba(25,35,50,.04);
    text-align:left;
}
.ms-login-panel .ms-login { margin:0; }
.ms-login-panel .ms-row {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    margin:0 0 22px;
}
.ms-login-panel label {
    margin:0;
    color:#30343b;
    font-size:14px;
    font-weight:600;
    line-height:1.5;
}
.moonstone-account.ms-login-panel .ms-login input:not([type=hidden]) {
    display:block;
    width:100%;
    height:50px;
    margin:0;
    padding:12px 14px;
    border:1px solid #cdd2da !important;
    border-radius:7px !important;
    background:#fff !important;
    color:#252a32;
    font-family:inherit;
    font-size:16px;
    line-height:1.5;
    box-shadow:none;
}
.ms-login-panel input::placeholder { color:#818793; opacity:1; }
.moonstone-account.ms-login-panel .ms-login input:focus {
    border-color:#c9194b !important;
    outline:2px solid transparent !important;
    box-shadow:0 0 0 3px rgba(201,25,75,.12);
}
.moonstone-account.ms-login-panel .ms-login input[aria-invalid=true] { border-color:#b00020 !important; }
.ms-login-panel .ms-security-number {
    display:inline-block;
    padding:3px 10px;
    margin:0 3px;
    border:1px solid #e0e3e8;
    border-radius:7px;
    background:#f5f6f8;
    color:#30343b;
    font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
    font-size:18px;
    font-weight:700;
    letter-spacing:3px;
    vertical-align:middle;
}
.moonstone-account.ms-login-panel .ms-login .submitButton {
    width:100%;
    min-height:50px;
    margin:2px 0 0;
    padding:12px 20px;
    border:1px solid #c9194b !important;
    border-radius:7px !important;
    background:#c9194b !important;
    color:#fff !important;
    font-family:inherit;
    font-size:16px;
    font-weight:600;
    line-height:1.5;
    box-shadow:none;
    cursor:pointer;
}
.moonstone-account.ms-login-panel .ms-login .submitButton:hover { background:#ad123e !important; border-color:#ad123e !important; }
.ms-login-panel .submitButton:focus-visible { outline:3px solid #30343b; outline-offset:3px; }
.ms-login-panel .ms-error { margin:8px 0 0; font-size:13px; line-height:1.6; }
.ms-login-panel > .ms-error { margin:0 0 22px; padding:12px 14px; background:#fff3f5; border-left:3px solid #b00020; border-radius:7px; }
@media (max-width:575px) {
    .moonstone-account.ms-login-panel { padding:22px 18px; margin:12px auto 24px; }
    .ms-login-panel .ms-row { margin-bottom:20px; }
}

/* Account overview: restrained panels and consistent seven-pixel corners. */
.moonstone-account.ms-dashboard { max-width:1100px; margin:16px auto 40px; padding:24px; background:#f3f5f8; border:1px solid #e5e9ef; border-radius:7px !important; color:#253044; text-align:left; }
.ms-dashboard .ms-account-header { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 0 20px; padding:28px 30px; background:#202c40; border-radius:7px !important; }
.ms-dashboard .ms-account-header h2 { margin:0 0 10px; color:#c9d3e2; font-size:12px; font-weight:600; line-height:1.5; letter-spacing:1.4px; text-transform:uppercase; }
.ms-dashboard .ms-account-name { margin:0 0 10px; color:#fff; font-size:27px; font-weight:600; line-height:1.3; overflow-wrap:anywhere; }
.ms-dashboard .ms-customer-reference { margin:0; color:#c9d3e2; font-size:13px; line-height:1.6; }
.ms-dashboard .ms-customer-reference strong { margin-left:6px; color:#fff; font-weight:500; font-variant-numeric:tabular-nums; }
.ms-dashboard .ms-logout { flex-shrink:0; margin:0; }
.moonstone-account.ms-dashboard .btnLogout { float:none; margin:0; min-height:44px; padding:10px 18px; border:1px solid #718097 !important; border-radius:7px !important; background:transparent !important; color:#fff !important; font-size:13px; font-weight:600; line-height:1.5; }
.moonstone-account.ms-dashboard .btnLogout:hover { background:#36455d !important; border-color:#b9c5d7 !important; }
.ms-dashboard .ms-balance-card { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:24px; padding:24px 30px; margin:0 0 26px; background:#fff; border:1px solid #e1e6ed; border-radius:7px !important; }
.ms-dashboard #ms-balance-heading { grid-column:1; margin:0 0 7px; color:#667286; font-size:13px; font-weight:500; line-height:1.5; }
.ms-dashboard .ms-balance-amount { grid-column:1; margin:0; color:#202c40; font-size:38px; font-weight:600; letter-spacing:-1px; line-height:1.25; font-variant-numeric:tabular-nums; }
.ms-dashboard .ms-balance-amount .ms-outstanding { color:#202c40; }
.ms-dashboard .ms-payment { grid-column:2; grid-row:1 / span 2; align-self:center; min-width:0; }
.ms-dashboard .ms-payment[open] { grid-column:1 / -1; grid-row:auto; margin-top:20px; }
.moonstone-account.ms-dashboard .ms-payment > summary { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:46px; width:fit-content; max-width:100%; padding:12px 18px; margin:0; border:1px solid #c9194b; border-radius:7px !important; background:#c9194b; color:#fff; font-size:14px; font-weight:600; line-height:1.5; list-style:none; text-align:left; box-sizing:border-box; }
.moonstone-account.ms-dashboard .ms-payment > summary:hover { background:#ae123e; border-color:#ae123e; }
.ms-dashboard summary::-webkit-details-marker { display:none; }
.ms-dashboard .ms-payment-arrow { font-size:20px; line-height:1; }
.ms-dashboard .ms-payment[open] .ms-payment-arrow { transform:rotate(90deg); }
.moonstone-account.ms-dashboard iframe { display:block; width:100%; max-width:100%; height:260px; margin-top:20px; border:1px solid #e1e6ed; border-radius:7px !important; background:#fff; }
.ms-dashboard .ms-rentals { background:#fff; border:1px solid #e1e6ed; border-radius:7px !important; overflow:hidden; }
.ms-dashboard .ms-rentals-header { margin:0; padding:24px 26px; border-bottom:1px solid #e8ecf1; }
.ms-dashboard #ms-rentals-heading { display:flex; align-items:center; gap:10px; margin:0 0 6px; color:#253044; font-size:18px; font-weight:600; line-height:1.4; }
.ms-dashboard .ms-rental-count { padding:2px 8px; border:1px solid #e0e5ed; border-radius:7px !important; color:#627086; background:#f6f8fa; font-size:12px; font-weight:500; line-height:1.5; }
.ms-dashboard .ms-rentals-header p { margin:0; color:#707d90; font-size:13px; line-height:1.6; }
.ms-dashboard .ms-agreement { margin:0; padding:0; border:0; border-bottom:1px solid #e8ecf1; background:#fff; }
.ms-dashboard .ms-agreement:last-child { border-bottom:0; }
.ms-dashboard .ms-agreement > summary { display:flex; align-items:center; gap:16px; padding:22px 26px; list-style:none; }
.ms-dashboard .ms-agreement > summary:hover { background:#f8fafc; }
.ms-dashboard .ms-item-number { display:flex; align-items:center; justify-content:center; flex:0 0 38px; height:38px; border:1px solid #e5eaf1; border-radius:7px !important; background:#f4f6fa; color:#63738b; font-size:13px; font-weight:600; }
.ms-dashboard .ms-item-info { flex:1; min-width:0; }
.ms-dashboard .ms-item-name { display:block; color:#253044; font-size:15px; font-weight:600; line-height:1.5; overflow-wrap:anywhere; }
.ms-dashboard .ms-agreement-reference { display:block; margin-top:4px; color:#748197; font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.ms-dashboard .ms-expand { display:flex; align-items:center; gap:12px; padding:8px 12px; margin:0; border:1px solid #dbe2ec; border-radius:7px !important; background:#fff; color:#425672; font-size:12px; font-weight:500; white-space:nowrap; }
.ms-dashboard .ms-chevron { width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); margin:0 2px 3px; }
.ms-dashboard .ms-agreement[open] .ms-chevron { transform:rotate(225deg); margin-bottom:-3px; }
.ms-dashboard .ms-hide-payments,.ms-dashboard .ms-agreement[open] .ms-view-payments { display:none; }
.ms-dashboard .ms-agreement[open] .ms-hide-payments { display:inline; }
.ms-dashboard .ms-table-scroll { margin:0; border-top:1px solid #e8ecf1; overflow-x:auto; }
.ms-dashboard table { width:100%; margin:0; border:0; font-size:13px; }
.ms-dashboard th { padding:12px 26px; border:0; background:#f3f6fa; color:#66768c; font-size:11px; font-weight:600; white-space:nowrap; }
.ms-dashboard td { padding:15px 26px; border:0; border-top:1px solid #edf0f5; color:#46566d; }
.ms-dashboard tbody tr:nth-child(odd) { background:#fff; }
.ms-dashboard tbody tr:nth-child(even) { background:#fafbfd; }
.ms-dashboard th:last-child,.ms-dashboard td:last-child { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.ms-dashboard td:last-child { color:#253044; font-weight:600; }
.ms-dashboard .ms-empty-state { padding:20px 26px; margin:0; color:#748197; font-size:13px; line-height:1.6; }
.ms-dashboard .ms-agreement > summary:focus-visible,.ms-dashboard .ms-table-scroll:focus-visible { outline:2px solid #c9194b; outline-offset:-3px; }
.moonstone-account.ms-dashboard input,.moonstone-account.ms-dashboard button,.moonstone-account.ms-dashboard select,.moonstone-account.ms-dashboard textarea { border-radius:7px !important; }
@media (max-width:767px) {
 .moonstone-account.ms-dashboard { padding:14px; }
 .ms-dashboard .ms-account-header { align-items:flex-start; padding:22px 18px; gap:12px; }
 .ms-dashboard .ms-account-name { font-size:22px; }
 .ms-dashboard .ms-customer-reference strong { display:block; margin:3px 0 0; }
 .moonstone-account.ms-dashboard .btnLogout { padding:9px 12px; }
 .ms-dashboard .ms-balance-card { grid-template-columns:minmax(0,1fr); padding:22px 18px; }
 .ms-dashboard .ms-balance-amount { font-size:34px; }
 .ms-dashboard .ms-payment,.ms-dashboard .ms-payment[open] { grid-column:1; grid-row:auto; margin-top:18px; }
 .moonstone-account.ms-dashboard .ms-payment > summary { width:100%; font-size:13px; }
 .ms-dashboard .ms-rentals-header { padding:20px 18px; }
 .ms-dashboard #ms-rentals-heading { font-size:17px; }
 .ms-dashboard .ms-agreement > summary { flex-wrap:wrap; padding:20px 18px; gap:12px; }
 .ms-dashboard .ms-item-info { flex-basis:calc(100% - 50px); }
 .ms-dashboard .ms-expand { margin-left:50px; }
 .ms-dashboard th,.ms-dashboard td { padding:12px; font-size:11px; }
}
.ms-dashboard .ms-history-pagination { display:flex; justify-content:flex-end; align-items:center; gap:14px; padding:14px 20px; border-top:1px solid #e8ecf1; font-size:13px; }
.ms-dashboard .ms-history-pagination a { padding:8px 12px; border:1px solid #dbe2ec; border-radius:7px; color:#425672; background:#fff; }
.ms-dashboard .ms-history-pagination a:hover { color:#b71544; border-color:#b71544; }
.ms-login-panel .ms-email-options { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:18px; }
.ms-login-panel .ms-email-options button { padding:8px 12px; background:#fff; color:#425672; border:1px solid #dbe2ec; border-radius:7px; font-size:13px; }

/* Keep the desktop payment toggle anchored while its form expands below. */
@media (min-width:768px) {
 .ms-dashboard .ms-balance-card { position:relative; }
 .ms-dashboard #ms-balance-heading,.ms-dashboard .ms-balance-amount { grid-column:1 / -1; padding-right:300px; }
 .ms-dashboard .ms-payment,.ms-dashboard .ms-payment[open] { grid-column:1 / -1; grid-row:3; margin-top:0; }
 .moonstone-account.ms-dashboard .ms-payment > summary { position:absolute; top:37px; right:30px; }
}
