/* App-specific styles. Everything reusable lives in ProductService.Ui.Components
   (productservice-components.css); this file only holds host-app glue. */

/* Blazor NavLink active state support.
   Blazor uses .active, the design system uses aria-current="page". */
.navlink.active {
    color: var(--color-brand-primary);
    font-weight: var(--font-weight-semibold);
    background-color: oklch(from var(--color-brand-primary) l c h / 0.15);
}

/* Blazor form validation states */
.valid.modified:not([type=checkbox]) {
    outline: var(--border-width-thin) solid var(--color-success);
}

.invalid {
    outline: var(--border-width-thin) solid var(--color-error);
}

.validation-message {
    color: var(--color-status-error-fg);
    font-size: var(--font-size-xs);
}

/* Blazor error boundary fallback */
.blazor-error-boundary {
    background: var(--color-status-error-bg);
    color: var(--color-status-error-fg);
    padding: var(--spacing-md);
    border-radius: var(--border-radius-md);
}

.blazor-error-boundary::after {
    content: "An error has occurred.";
}