/* ═══════════════════════════════════════════════════════════
   BASE
   Global element styles and utility classes.
   ═══════════════════════════════════════════════════════════ */

html {
    font-family: var(--font-sans);
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-text);
    background: var(--color-bg-page);
}

body { margin: 0; padding: 0; }

/* Buttons don't inherit line-height from html by default — fix so <button>
   and <a> rendered with the same class always have identical height. */
button { line-height: inherit; }

a { color: var(--color-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 { line-height: 1.3; }

/* Blazor enhanced navigation sets focus on headings after page load.
   Remove the outline for programmatic focus; keep it for keyboard navigation. */
h1:focus:not(:focus-visible),
h2:focus:not(:focus-visible),
h3:focus:not(:focus-visible) { outline: none; }

/* ── Utilities ───────────────────────────────────────────── */

.text-success { color: var(--color-success); }
.text-danger  { color: var(--color-danger); }
