html, body {
    font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: #F0EEF8;
}

/* ── Sidebar: ítem activo ─────────────────────────────────── */
.mud-nav-item.active .mud-nav-link {
    background-color: #E4DFF5;
    color: #4A3580;
    border-radius: 6px;
    font-weight: 600;
}

.mud-nav-item.active .mud-nav-link .mud-icon-root {
    color: #1A3A5C;
}

.mud-nav-link:hover {
    background-color: #F0EEF8;
    border-radius: 6px;
}

/* ── AppBar: hover sutil en botones ──────────────────────── */
.mud-appbar .mud-button-root:hover {
    background: rgba(255, 255, 255, 0.12) !important;
}

.mud-appbar .mud-ripple {
    color: rgba(255, 255, 255, 0.2);
}

/* ── MudDataGrid: encabezados con tono Primary ───────────── */
.mud-table-head .mud-table-cell {
    background-color: #F0EEF8;
    color: #211D2E;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: .4px;
    text-transform: uppercase;
}

/* ── Chips de estado ─────────────────────────────────────── */
.mud-chip {
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: .3px;
}

/* ── Cards / Papers ─────────────────────────────────────── */
.mud-paper {
    border-radius: 10px !important;
}

/* ── Formularios: borde al hacer focus ───────────────────── */
.mud-input-outlined:focus-within .mud-input-outlined-border {
    border-color: #4A3580 !important;
    border-width: 2px !important;
}

/* ── Blazor error boundary ───────────────────────────────── */
.blazor-error-boundary {
    background: #C94040;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
    border-radius: 8px;
}

.blazor-error-boundary::after {
    content: "Ocurrió un error inesperado.";
}

/* ── Validación FluentValidation ─────────────────────────── */
.mud-input-helper-text.mud-input-error {
    color: #C94040;
}