/* App-level globals. Design tokens live in css/tokens.css, component styles in css/design-system.css. */

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

html {
    scroll-behavior: smooth;
}

a {
    color: var(--link);
}

h1:focus {
    outline: none;
}

.page-message {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: var(--space-24) var(--space-6);
    color: var(--ink-muted);
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--matcha);
}

.invalid {
    outline: 1px solid var(--red-text);
}

.validation-message {
    color: var(--red-text);
}

.blazor-error-boundary {
    background: var(--red-soft);
    color: var(--red-text);
    font-weight: 600;
    padding: var(--space-4) var(--space-6);
    border-radius: var(--radius-md);
}

.blazor-error-boundary::after {
    content: "Wystąpił błąd.";
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}