html, body {
    font-family: 'Inter', 'Segoe UI', sans-serif;
    background: #0F1117;
    color: #EAEDF3;
    margin: 0;
    padding: 0;
}

/* MudBlazor table overrides for dark theme */
.mud-table-cell { color: #EAEDF3 !important; }
.mud-table-row:hover { background: #24262F !important; }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0F1117; }
::-webkit-scrollbar-thumb { background: #2A2D38; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #3A3D48; }

/* Glass card utility */
.glass-card {
    background: #1C1E26;
    border: 1px solid #2A2D38;
    border-radius: 16px;
    padding: 20px;
}

#blazor-error-ui {
    background: #E62528;
    color: white;
    padding: 0.5rem;
    text-align: center;
    display: none;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    margin-left: 1rem;
}

/* --- Mobile (<= 600px): phone-friendly tweaks --- */
@media (max-width: 600px) {
    .mud-main-content { padding: 8px !important; }
    .glass-card { padding: 12px; border-radius: 12px; }

    /* Tables & data grids: horizontal scroll instead of overflowing */
    .mud-table-container,
    .mud-data-grid {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Decorative chip wastes space on small screens */
    .mud-appbar .mud-chip { display: none; }

    /* Readable body font + touch-sized tap targets (WCAG 44px) */
    html, body { font-size: 15px; }
    .mud-button,
    .mud-nav-link,
    .mud-list-item,
    .mud-icon-button { min-height: 44px; }

    .mud-appbar .mud-typography-h6 { font-size: 1rem; }

    .mud-card, .mud-dialog { margin: 4px; }
}

/* --- Tablets (601-960px): slightly tighter gutters --- */
@media (min-width: 601px) and (max-width: 960px) {
    .mud-main-content { padding: 12px !important; }
}

/* --- iOS safe-area padding (notch / home indicator) --- */
@supports (padding: max(0px)) {
    .mud-appbar { padding-top: max(0px, env(safe-area-inset-top)); }
    .mud-main-content {
        padding-left: max(8px, env(safe-area-inset-left)) !important;
        padding-right: max(8px, env(safe-area-inset-right)) !important;
        padding-bottom: max(8px, env(safe-area-inset-bottom)) !important;
    }
}