@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');

@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

/* Filament */
html {
    font-family: DM Sans,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,
    Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji !important;
}
@media (min-width: 1700px) {
    .fi-sidebar.fi-sidebar-open .fi-sidebar-header button.fi-icon-btn {
        display: none !important;
    }
    .fi-sidebar-header div {
        @apply lg:ml-0 justify-center !important;
    }
    .fi-sidebar {
        padding: 1rem !important;
    }
    .fi-sidebar.fi-sidebar-open .sidebar-date {
        display: flex !important;
    }
}
.fi-sidebar {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Kleuren */
.text-orange {
    color: #f04116;
}
.bol-background {
    background-color: #0000a4 !important;
}
.restant-background {
    background-color: #f8991d !important;
}
.vg-background {
    background-color: #50a9f3 !important;
}

/* Hub */
.hub {
    font-family: 'Poppins', sans-serif;
    cursor: default !important;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}
.hub .dagscore {
    font-size: 25rem;
}
@media(min-height:1050px) {
    .hub .dagscore {
        font-size: 30rem;
    }
    .hub .tv-margin {
        @apply -my-20;
    }
    .hub .tv-text-2xl {
        @apply text-2xl;
    }
    .hub .tv-text-3xl {
        @apply text-3xl;
    }
    .hub .tv-text-8xl {
        @apply text-8xl;
    }
    .hub .tv-text-xl {
        @apply text-xl;
    }
    .hub .tv-bottom {
        @apply bottom-2.5;
    }
}

@layer base {
    .fi-sidebar-header {
        @apply justify-center;
    }
    .fi-sidebar-item-active a {
        @apply dark:bg-primary-800/70 dark:hover:bg-primary-800/70;
    }
    .fi-sidebar-item:not(.fi-sidebar-item-active) a {
        @apply dark:hover:bg-primary-800/70 dark:hover:text-white;
    }
    .checkbox-open .fi-checkbox-input {
        @apply disabled:checked:bg-primary-600 !important;
    }
}

/* Apex */
/*.apexcharts-toolbar {*/
/*    z-index: 9 !important;*/
/*}*/
.apexcharts-datalabel-value {
    fill: rgb(55, 61, 63) !important;
}
.dark .apexcharts-datalabel-value {
    fill: rgb(246, 247, 248) !important;
}
.dark .apexcharts-menu.apexcharts-menu-open {
    background-color: rgb(31 41 55);
    border-color: rgb(55 65 81);
}
.dark .apexcharts-menu-item:hover {
    background-color: rgb(55 65 81) !important;
}
.dark .apexcharts-toolbar:hover, .dark .apexcharts-legend-text {
    color: white !important;
}
.dark .apexcharts-tooltip, .dark .apexcharts-tooltip-title, .dark .apexcharts-xaxistooltip {
    background-color: rgb(31 41 55) !important;
    color: white;
}

/* Colors */
.bg-quantex {
    background-color: #005da9 !important;
}
.bg-quantex-dark {
    background-color: #003f7f !important;
}
.text-quantex {
    color: #005da9 !important;
}
.ring-quantex {
    --tw-ring-color: #005da9 !important;
}
.bg-zeromix {
    background-color: #a1a1a1 !important;
}
.bg-zeromix-dark {
    background-color: #ed8b0c !important;
}
.bg-zeromix-icon {
    background-color: #f8991d !important;
}
.text-zeromix {
    color: #f8991d !important;
}
.ring-zeromix {
    --tw-ring-color: #f8991d !important;
}
.bg-unknown {
    background-color: #bab6b1 !important;
}
.bg-unknown-dark {
    background-color: #918f8c !important;
}