/*
 * Base layer of the redesigned portal: page background, typography, links, focus ring, utilities.
 * Every page carries <body class="ms-body"> (customer_head.html). Rules are scoped to .ms-body so the
 * legacy customer-portal.css (still loaded while pages are being migrated) cannot leak in or out.
 */
.ms-body {
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--ms-ground);
    color: var(--ms-text);
    font-family: var(--ms-font);
    font-size: 0.875rem;
    line-height: 1.5;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    /* topbar / nav / main / footer are grid items: see ms-shell.css */
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    align-items: start;
}

.ms-body *,
.ms-body *::before,
.ms-body *::after {
    box-sizing: border-box;
}

.ms-body h1,
.ms-body h2,
.ms-body h3,
.ms-body h4 {
    margin: 0;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ms-text);
    letter-spacing: 0;
}

.ms-body p { margin: 0; }

.ms-body :where(a) {
    color: var(--ms-accent-text);
    text-decoration: none;
}

.ms-body :where(a:hover) { text-decoration: underline; }

.ms-body :where(small) { font-size: 0.75rem; }

.ms-body :where(ul, ol) { margin: 0; padding: 0; list-style: none; }

.ms-body :where(dl, dd) { margin: 0; }

.ms-body :where(button, input, select, textarea) { font-family: inherit; }

/* visible keyboard focus, accent 2px */
.ms-body :focus-visible {
    outline: 2px solid var(--ms-accent);
    outline-offset: 2px;
}

.ms-body ::selection { background: var(--ms-accent-subtle); }

.ms-body code,
.ms-mono {
    font-family: var(--ms-mono);
    font-size: 0.8125rem;
}

/* skip link */
.ms-skip {
    position: fixed;
    left: 12px;
    top: -80px;
    z-index: 1200;
    padding: 10px 14px;
    border-radius: var(--ms-radius);
    background: var(--ms-surface);
    color: var(--ms-text);
    border: 1px solid var(--ms-line-strong);
    box-shadow: var(--ms-shadow-pop);
}

.ms-skip:focus { top: 12px; }

/* utilities */
.ms-sr-only,
.ms-body .visually-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.ms-muted { color: var(--ms-muted); }
.ms-faint { color: var(--ms-faint); }
.ms-num { font-variant-numeric: tabular-nums; }
.ms-nowrap { white-space: nowrap; }
.ms-break { overflow-wrap: anywhere; }
.ms-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

@media (prefers-reduced-motion: reduce) {
    .ms-body *,
    .ms-body *::before,
    .ms-body *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}