/* ==========================================================================
   KS21 Lizenzportal - global glue & page-specific styles
   Tokens:      css/tokens.css      (colors, type, radius, shadow)
   Components:  css/components.css  (all `lp-*` building blocks)
   This file:   Blazor plumbing + the few page-specific rules that are not
                reusable. Prefer adding a reusable `lp-*` class to
                components.css over adding page CSS here. See DESIGN_CATALOG.md.
   ========================================================================== */

/* Blazor error boundary */
.blazor-error-boundary {
    background: var(--color-danger-soft);
    border: 1px solid var(--color-danger-border);
    border-radius: var(--radius-md);
    padding: 1rem 1rem 1rem 1.25rem;
    color: var(--color-danger-text);
}

.blazor-error-boundary::after {
    content: "Es ist ein Fehler aufgetreten.";
}

#blazor-error-ui {
    display: none;
    position: fixed;
    left: 50%;
    bottom: 1rem;
    transform: translateX(-50%);
    z-index: 10030;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-warning-border);
    background: var(--color-warning-soft);
    color: var(--color-text);
    box-shadow: var(--shadow-lg);
    font-size: var(--text-sm);
}

#blazor-error-ui .reload { color: var(--color-accent-text); font-weight: 600; }
#blazor-error-ui .dismiss { cursor: pointer; color: var(--color-text-muted); }

/* Blazor's <FocusOnNavigate Selector="h1"> focuses the page title after each
   navigation - it must never show an outline/border (black-border bug). */
h1, h2, h3, h4, h5, h6 { outline: none; -webkit-tap-highlight-color: transparent; }
h1:focus, h2:focus, h3:focus, h4:focus, h5:focus, h6:focus { outline: none; box-shadow: none; }

/* Non-interactive elements never show a focus outline */
div:not([tabindex]):focus, span:not([tabindex]):focus, p:not([tabindex]):focus,
section:not([tabindex]):focus, article:not([tabindex]):focus { outline: none; }

/* scrollToElement() highlight (App.razor) - token-driven tint */
.lp-highlight-flash { background-color: var(--color-accent-lighter) !important; transition: background-color 0.3s ease; }
