/* ── LoroPaka.pl — Global Styles ─────────────────────────── */

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

html, body {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Validation styles for Blazor EditForm */
.valid.modified:not([type=checkbox]) {
    outline: 2px solid #22c55e;
    outline-offset: -1px;
}

.invalid {
    outline: 2px solid #ef4444;
    outline-offset: -1px;
}

.validation-message {
    color: #ef4444;
    font-size: 0.75rem;
    margin-top: 0.25rem;
}

/* Blazor error boundary */
.blazor-error-boundary {
    background: #b91c1c;
    padding: 1rem 1.5rem;
    color: white;
    border-radius: 0.75rem;
    margin: 1rem;
    font-weight: 600;
}

.blazor-error-boundary::after {
    content: " 🦜 Ups! Coś poszło nie tak. Odśwież stronę."
}

/* Focus ring for accessibility */
:focus-visible {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

/* Hide blazor reconnect toast default styles */
#blazor-error-ui {
    display: none;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Animation keyframes */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}