:root {
    --blackhole-switch-unchecked: #6E6E6E;
    --blackhole-switch-on: var(--mud-palette-primary);
}

.blackhole-center-text {
    text-align: center !important;
}

.mud-button-filled {
    box-shadow: 0 3px 1px -2px rgb(0 0 0 / 30%), 0 2px 2px 0 rgb(0 0 0 / 0), 0 1px 5px 0 rgb(0 0 0 / 10%) !important;
}

.mud-dialog,
.mud-dialog .mud-paper {
    box-shadow: 0 3px 1px -2px rgb(0 0 0 / 10%), 0 2px 2px 0 rgb(0 0 0 / 0), 0 10px 10px 0 rgb(0 0 0 / 5%) !important;
    border-radius: 24px !important;
}

/* Global spacing for all MudDialog contents and actions */
.mud-dialog .mud-dialog-content {
    padding: 24px 24px !important; /* equal and bigger padding for content */
}

.mud-dialog .mud-dialog-actions {
    padding: 16px 16px !important; /* equal and slightly bigger spacing for action buttons row */
}

/* Optional: add an inner margin so content is not touching rounded edges */
.mud-dialog .mud-paper {
    padding: 8px 8px !important; /* subtle inner padding around the whole dialog body */
    /* keep your existing border-radius and shadow rules intact */
}

/* Title spacing (optional) */
.mud-dialog .mud-dialog-title {
    padding: 24px 24px !important; /* equal and bigger padding for title */
}

/* Keep consistent spacing across light/dark modes */
.blackhole-light-mode .mud-dialog .mud-dialog-content,
.blackhole-dark-mode .mud-dialog .mud-dialog-content {
    padding: 24px 24px !important; /* equal and bigger padding across modes */
}

.mud-table {
    padding: 20px !important;
    margin-bottom: 20px !important;
}

.mud-card {
    margin-bottom: 20px !important;
}

#blazor-error-ui {
    color: var(--mud-palette-drawer-text);
    background: var(--mud-palette-drawer-background);
}

.mud-overlay-dark {
    backdrop-filter: blur(2px);
}

.mud-card-header .mud-card-header-avatar {
    margin-inline-end: 10px !important;
}

.mud-nav-link {
    padding: 12px 16px 12px 15px !important;
}

.mud-dialog-content {
    max-height: 75vh !important;
    overflow: auto !important;
    overflow-x: hidden !important;
}

.mud-grid-spacing-xs-3 {
    margin: 0px !important;
    margin-left: -12px !important;
}

.mud-table-toolbar
{
    flex-wrap:wrap;
    margin-bottom:20px!important;
}

::-webkit-scrollbar {
    width: 2px!important;
    height: 6px!important;
}
.blackhole-nav-child {
    padding-left: 16px !important;
}

.mud-navmenu.mud-navmenu-rounded .mud-nav-link {
    border-radius: 100vh;
}

button.mud-button {
    border-radius: 100vh;
}

/*** Navigation menu light/dark mode ***/

/* dark */

.blackhole-dark-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link {
    color: rgba(255, 255, 255, 0.5);
}

    .blackhole-dark-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link.active:not(.mud-nav-link-disabled) {
        background-color: rgba(88, 88, 88, 0.3);
        color: rgba(248, 248, 248, 1);
    }

        .blackhole-dark-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link.active:not(.mud-nav-link-disabled) .mud-nav-link-icon {
            color: rgba(248, 248, 248, 1);
        }

.blackhole-dark-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link:hover:not(.mud-nav-link-disabled) {
    background-color: rgba(88, 88, 88, 0.18);
    color: rgba(255, 255, 255, 0.5)
}

.blackhole-light-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link.mud-nav-link-disabled {
    color: rgba(84, 84, 84, 1);
}

/* light */

.blackhole-light-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link {
    color: rgba(0, 0, 0, 0.7);
}

    .blackhole-light-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link.active:not(.mud-nav-link-disabled) {
        background-color: rgba(24, 24, 24, 0.06);
        color: rgba(24, 24, 24, 1);
    }

        .blackhole-light-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link.active:not(.mud-nav-link-disabled) .mud-nav-link-icon {
            color: rgba(24, 24, 24, 1);
        }

.blackhole-light-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link:hover:not(.mud-nav-link-disabled) {
    background-color: rgba(0, 0, 88, 0.06);
    color: rgba(0, 0, 0, 0.7);
}

.blackhole-light-mode aside .mud-navmenu.mud-navmenu-primary .mud-nav-link.mud-nav-link-disabled {
    color: rgba(0, 0, 0, 0.38)
}

.mud-tab {
    text-transform: none;
}

@media (max-width: 600px) {
    .account-tabs .mud-tab {
        font-size: 0;
        min-width: 72px !important;
        padding: 0 8px;
    }

        .account-tabs .mud-tab .mud-icon-root {
            font-size: 24px;
            margin-right: 0 !important;
            min-width: 72px !important;
        }
}

/* Auth-aware body backgrounds */
body.auth .blackhole-light-mode { background-color: #FFFFFF !important; }
body.unauth .blackhole-light-mode { background-color: #E9EEF8 !important; }

body.auth .blackhole-dark-mode { background-color: #1E1E1E !important; }
body.unauth .blackhole-dark-mode { background-color: #121212 !important; }

/* Switch unchecked state: when the button is NOT mud-checked */
.mud-switch-base:not(.mud-checked) ~ .mud-switch-track {
    background-color: var(--blackhole-switch-unchecked) !important;
    border-color: var(--blackhole-switch-unchecked) !important;
}

/* Switch checked state: when the button IS mud-checked */
.mud-switch-base.mud-checked ~ .mud-switch-track {
    background-color: var(--blackhole-switch-on) !important;
    border-color: var(--mud-palette-primary) !important;
}

.mud-snackbar {
    box-shadow: none !important;
    border-radius: 32px !important;
    border: 2px solid transparent;
    padding: 8px 16px !important;
}

.mud-snackbar-content {
    gap: 12px;
    align-items: center;
}

.mud-snackbar-success {
    border-color: #0a6b2d !important;
}

.mud-snackbar-info {
    border-color: #115a9b !important;
}

.mud-snackbar-warning {
    border-color: #c7891d !important;
}

.mud-snackbar-error {
    border-color: #a52828 !important;
}

.blackhole-dark-mode .mud-snackbar,
.blackhole-light-mode .mud-snackbar {
    border-radius: 32px !important;
}

/* Icon color consistency */
.mud-snackbar .mud-icon-root {
    color: inherit !important;
}