.mud-button-disabled-loading-spinner {
    color: var(--mud-palette-action-disabled) !important;
}

.mud-button-loading-spinner-small {
    height: 15px !important;
    width: 15px !important;
}

.mud-button-loading-spinner-medium {
    height: 24px !important;
    width: 24px !important;
}

.mud-button-loading-spinner-large {
    height: 28px !important;
    width: 28px !important;
}

.apexcharts-canvas > svg {
    background-color: transparent !important;
}

.map-outer-container {
    margin-left: auto;
    margin-right: auto;
    max-width: unset;
}

body {
    overscroll-behavior-y: contain;
}

.mud-button-disabled-loading-spinner {
    color: var(--mud-palette-action-disabled) !important;
}

.mud-button-loading-spinner-small {
    height: 15px !important;
    width: 15px !important;
}

.mud-button-loading-spinner-medium {
    height: 24px !important;
    width: 24px !important;
}

.mud-button-loading-spinner-large {
    height: 28px !important;
    width: 28px !important;
}

@keyframes slide {
    0% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(25%);
    }
}

body {
    background-color: #04052e;
}

.mud-wasm {
    animation: slide 3s ease-in-out infinite alternate;
    /*background-image: linear-gradient(-60deg, #030421 50%, #04052e 50%);*/
    background-image: linear-gradient(-60deg, #04052e 50%, #05053B 50%);
    bottom: 0;
    left: -50%;
    opacity: .5;
    position: fixed;
    right: -50%;
    top: 0;
    z-index: -1
}

.mud-wasm-cont {
    left: 50%;
    padding: 10vmin;
    position: fixed;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%)
}

/* Cookie Consent */
.cc-isolation-container * {
    /* Font used */
    --cc-font-family: var(--mud-typography-default-family);

    /* Accent color for primary button */
    --cc-color-accent: var(--mud-palette-primary);

    /* Accent color for primary button when hovered */
    --cc-color-accent-dark: var(--mud-palette-primary-darken);

    /* Color for secondary button */
    --cc-color-secondary: var(--mud-palette-primary);

    /* Color for secondary button when hovered */
    --cc-color-secondary-dark: var(--mud-palette-primary-darken);

    /* Color for links ("Display policy" links within preferences dialogue) */
    --cc-color-link: var(--mud-palette-primary);

    /* Color for link when hovered */
    --cc-color-link-highlight: var(--mud-palette-primary-lighten);

    /* Default color for text */
    --cc-color-text: var(--mud-palette-primary-text);

    /* Background color for active category switch */
    --cc-color-switch-active: var(--mud-palette-primary);

    /* (Transparent) Color for background when any modal is opened */
    --cc-color-modal-background: var(--mud-palette-background);
}

/* Consent dialog should not be white */
.cc-bg-white {
    background-color: var(--mud-palette-table-hover) !important;
}

/* Hovering is normally white, which we do not want */
.hover\:cc-bg-gray-200:hover {
    background-color: inherit !important;
}

/* Change button colors and hover effect */
button.cc-bg-gray-100 {
    background-color: var(--mud-palette-primary) !important;
}

button.hover\:cc-bg-gray-200:hover {
    background-color: var(--mud-palette-primary-darken) !important;
}

/* Change section color and hover effect */
div.cc-bg-gray-100.cc-text-brand-text {
    background-color: var(--mud-palette-surface) !important;
}

div.hover\:cc-bg-gray-200:hover {
    background-color: var(--mud-palette-table-striped) !important;
}

/* Fix switch hover effect (currently not working) */
hover\:cc-bg-gray-200:hover .cc-dot-background {
    background-color: var(--mud-palette-secondary) !important;
}