/*
 * LASA Design System Base Layer
 * -----------------------------------------------------------------------------
 * Opinionated base styles that normalize the rendering of HTML elements and tie
 * them to the shared design tokens. This file intentionally avoids component-
 * specific rules so that legacy Razor views remain compatible.
 */
:where(*, *::before, *::after) {
    box-sizing: border-box;
}

:where(html) {
    font-size: var(--ds-font-size-root, 14px);
    height: 100%;
    scroll-behavior: smooth;
}

@media (min-width: 48rem) {
    :where(html) {
        font-size: 16px;
    }
}

:where(body) {
    margin: 0;
    margin-bottom: 60px;
    min-height: 100%;
    font-family: var(--ds-font-family-sans);
    font-size: var(--ds-font-size-md);
    line-height: var(--ds-line-height-normal);
    font-weight: var(--ds-font-weight-regular);
    background-color: var(--ds-color-surface-alt);
    color: var(--ds-color-text-primary);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

:where(main) {
    display: block;
}

:where(h1, h2, h3, h4, h5, h6) {
    margin: 0 0 var(--ds-space-sm); /* Reduced from space-3 */
    font-family: var(--ds-font-family-heading);
    font-weight: var(--ds-font-weight-semibold);
    line-height: var(--ds-line-height-snug); /* Changed from tight to snug */
    color: var(--ds-color-text-primary);
}

:where(h1) { font-size: var(--ds-font-size-xl); } /* Reduced from 2xl */
:where(h2) { font-size: var(--ds-font-size-lg); } /* Reduced from xl */
:where(h3) { font-size: var(--ds-font-size-base); } /* Reduced from lg */
:where(h4) { font-size: var(--ds-font-size-sm); } /* Reduced from md */
:where(h5) { font-size: var(--ds-font-size-xs); } /* Reduced from sm */
:where(h6) { font-size: var(--ds-font-size-xs); }

:where(p, ul, ol, dl, blockquote, pre) {
    margin: 0 0 var(--ds-space-sm); /* Reduced from space-4 */
    color: var(--ds-color-text-secondary);
}

:where(ul, ol) {
    padding-inline-start: var(--ds-space-md); /* Reduced from space-5 */
}

:where(a) {
    color: var(--primary-color);
    text-decoration: none;
    transition: color 0.15s ease-in-out;
}

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

:where(button, input, select, textarea) {
    font: inherit;
    color: inherit;
}

:where(button) {
    cursor: pointer;
}

:where(img, svg, video, canvas, audio) {
    display: block;
    max-width: 100%;
}

:where(table) {
    border-collapse: collapse;
    width: 100%;
}

:where(th, td) {
    padding: var(--ds-space-xs) var(--ds-space-sm); /* Reduced from space-2/space-3 */
    text-align: left;
}

:where(code, kbd, pre, samp) {
    font-family: var(--ds-font-family-mono);
    font-size: 0.95em;
}

:where(::selection) {
    background: var(--ds-color-primary-200);
    color: var(--ds-color-primary-700);
}

:where(:focus-visible) {
    outline: 2px solid transparent;
    box-shadow: var(--ds-focus-ring);
    outline-offset: 2px;
}

:where(.no-focus-ring:focus-visible),
:where(.navbar-modern :focus-visible) {
    box-shadow: none;
    outline: none;
}

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