/* App-spezifische Ergaenzungen zum Design-System (phishin-default-theme.css).
   Blazor-Validierung + Error-Boundary + Reconnect-UI, im neuen Token-Stil. */

h1:focus { outline: none; }

/* ---------- Blazor-Form-Validierung ---------- */
.valid.modified:not([type=checkbox]) { outline: 1px solid var(--ph-success); }
.invalid { border-color: var(--ph-danger) !important; }
.validation-message { color: var(--ph-danger); font-size: var(--ph-text-sm); margin-top: var(--ph-space-1); }

/* ---------- Error-Boundary ---------- */
.blazor-error-boundary {
    background: var(--ph-danger-subtle);
    border: 1px solid #fecdca;
    border-radius: var(--ph-radius-md);
    padding: var(--ph-space-4);
    color: var(--ph-danger);
    font-weight: var(--ph-fw-medium);
}
.blazor-error-boundary::after { content: "Ein Fehler ist aufgetreten."; }

/* ---------- Blazor-Disconnect-/Error-UI (unten eingeblendet) ---------- */
#blazor-error-ui {
    color-scheme: light only;
    background: var(--ph-warning-subtle);
    border-top: 1px solid #fedf89;
    color: #93370d;
    bottom: 0;
    box-shadow: 0 -2px 8px rgba(16, 24, 40, 0.12);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-size: var(--ph-text-sm);
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.9rem; top: 0.6rem; }
#blazor-error-ui .reload { color: inherit; font-weight: var(--ph-fw-semibold); }