.mdc-icon-button {
    font-size: 20px !important;
}

tr.mdc-table-footer-row:nth-child(odd), tr.mdc-table-row:nth-child(odd) {
    background-color: #f4f4f5 !important;
}

.mdc-select:not(.mdc-select--disabled) .mdc-select__anchor {
    background-color: transparent !important;
}

.mat-sort-header-row .mat-sort-header .mat-sort-header-container .mat-sort-header-arrow {
    color: #ffffff99 !important;
}

.simple-scrollbar::-webkit-scrollbar {
    width: 20px;
}

.simple-scrollbar::-webkit-scrollbar-track {
    background-color: transparent;
}

.simple-scrollbar::-webkit-scrollbar-thumb {
    background-color: #d6dee1;
    border-radius: 20px;
    border: 6px solid transparent;
    background-clip: content-box;
}

    .simple-scrollbar::-webkit-scrollbar-thumb:hover {
        background-color: #a8bbbf;
    }

.simple-scrollbar {
    scrollbar-width: thin !important;
}

.mdc-list li[data-value="-1"], .mdc-list li[data-value="100"], .mdc-list li[data-value="50"] {
    display: none !important;
}

.shadow-inner-xl {
    box-shadow: inset 0 2px 8px 0px rgb(0 0 0 / 0.05), inset 0 -2px 8px 0 rgb(0 0 0 / 0.05);
}

.q-shadow {
    box-shadow: 0px 1px 0 0 rgb(30 41 59 / 20%), 0px 2px 5px 0 rgb(30 41 59 / 20%), 0 0 20px 0 rgb(30 41 59 / 20%);
}

.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    backdrop-filter: blur(3px);
}

.mtf-white {
}

    .mtf-white > .mdc-floating-label {
        color: white !important;
    }

    .mtf-white > input {
        caret-color: white !important;
    }

    .mtf-white > span.mdc-line-ripple::before {
        border-bottom-color: white !important;
    }

    .mtf-white > span.mdc-line-ripple::after {
        border-bottom-color: white !important;
    }

    .mtf-white > input {
        color: white !important;
    }

        .mtf-white > input::placeholder {
            color: #ffffff99 !important;
        }

    .mtf-white > .material-icons {
        color: #ffffff !important;
    }

.menu {
    --scrollbar-color-thumb: #ffffff;
    --scrollbar-color-track: #27272a;
    --scrollbar-width: thin;
    --scrollbar-width-legacy: 5px;
}

/* Modern browsers with `scrollbar-*` support */
@supports (scrollbar-width: auto) {
    .menu {
        scrollbar-color: var(--scrollbar-color-thumb) var(--scrollbar-color-track);
        scrollbar-width: var(--scrollbar-width);
    }
}

/* Legacy browsers with `::-webkit-scrollbar-*` support */
@supports selector(::-webkit-scrollbar) {
    .menu::-webkit-scrollbar-thumb {
        background: var(--scrollbar-color-thumb);
    }

    .menu::-webkit-scrollbar-track {
        background: var(--scrollbar-color-track);
    }

    .menu::-webkit-scrollbar {
        max-width: var(--scrollbar-width-legacy);
        max-height: var(--scrollbar-width-legacy);
    }
}

.main {
    --scrollbar-color-thumb: #00000059;
    --scrollbar-color-track: #e9e9ea;
    --scrollbar-width: thin;
    --scrollbar-width-legacy: 5px;
}

/* Modern browsers with `scrollbar-*` support */
@supports (scrollbar-width: auto) {
    .main {
        scrollbar-color: var(--scrollbar-color-thumb) var(--scrollbar-color-track);
        scrollbar-width: var(--scrollbar-width);
    }
}

/* Legacy browsers with `::-webkit-scrollbar-*` support */
@supports selector(::-webkit-scrollbar) {
    .main::-webkit-scrollbar-thumb {
        background: var(--scrollbar-color-thumb);
    }

    .main::-webkit-scrollbar-track {
        background: var(--scrollbar-color-track);
    }

    .main::-webkit-scrollbar {
        max-width: var(--scrollbar-width-legacy);
        max-height: var(--scrollbar-width-legacy);
    }
}

.mtf-white > input {
    color: white !important;
}

    .mtf-white > input::placeholder {
        color: #ffffff99 !important;
    }

.mtf-white > .material-icons {
    color: #ffffff !important;
}

.mat-autocomplete-list-popup {
    z-index: 100;
}

.menu {
    --scrollbar-color-thumb: #ffffff;
    --scrollbar-color-track: #27272a;
    --scrollbar-width: thin;
    --scrollbar-width-legacy: 5px;
}

/* Modern browsers with `scrollbar-*` support */
@supports (scrollbar-width: auto) {
    .menu {
        scrollbar-color: var(--scrollbar-color-thumb) var(--scrollbar-color-track);
        scrollbar-width: var(--scrollbar-width);
    }
}

/* Legacy browsers with `::-webkit-scrollbar-*` support */
@supports selector(::-webkit-scrollbar) {
    .menu::-webkit-scrollbar-thumb {
        background: var(--scrollbar-color-thumb);
    }

    .menu::-webkit-scrollbar-track {
        background: var(--scrollbar-color-track);
    }

    .menu::-webkit-scrollbar {
        max-width: var(--scrollbar-width-legacy);
        max-height: var(--scrollbar-width-legacy);
    }
}

/*.mdc-menu {
    z-index: 100;
    --tw-backdrop-blur: blur(8px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) !important;
    background-color: rgb(255 255 255 / 0.6) !important;
    border-color: rgb(255 255 255 / 0.2) !important;
    border-width: 1px !important;
    border-radius: 0.375rem !important;
    box-shadow: 0px 1px 0 0 rgb(30 41 59 / 20%), 0px 2px 5px 0 rgb(30 41 59 / 20%), 0 0 20px 0 rgb(30 41 59 / 20%) !important;
}

.mat-autocomplete-list-popup {
    z-index: 2;
    --tw-backdrop-blur: blur(8px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) !important;
    background-color: rgb(255 255 255 / 0.6) !important;
    border-color: rgb(255 255 255 / 0.2) !important;
    border-width: 1px !important;
    border-radius: 0.375rem !important;
    box-shadow: 0px 1px 0 0 rgb(30 41 59 / 20%), 0px 2px 5px 0 rgb(30 41 59 / 20%), 0 0 20px 0 rgb(30 41 59 / 20%) !important;
}

.apexcharts-tooltip.apexcharts-theme-light {
    --tw-backdrop-blur: blur(8px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) !important;
    background-color: rgb(255 255 255 / 0.6) !important;
    border-color: rgb(255 255 255 / 0.2) !important;
    border-width: 1px !important;
    border-radius: 0.375rem !important;
    box-shadow: 0px 1px 0 0 rgb(30 41 59 / 20%), 0px 2px 5px 0 rgb(30 41 59 / 20%), 0 0 20px 0 rgb(30 41 59 / 20%) !important;
}*/

.mdc-menu {
    z-index: 100;
}

.card, .mdc-menu, .mat-autocomplete-list-popup, .apexcharts-tooltip.apexcharts-theme-light, .mdc-dialog__surface {
    border-radius: 0.5rem !important;
    border-width: 1px !important;
    border-color: rgb(255 255 255 / 0.7) !important;
    background-color: rgb(255 255 255 / 0.6) !important;
    --tw-text-opacity: 1;
    color: rgb(9 9 11 / var(--tw-text-opacity)) !important;
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
    --tw-shadow-color: rgb(9 9 11 / 0.2);
    --tw-shadow: var(--tw-shadow-colored);
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
    --tw-ring-color: rgb(9 9 11 / 0.05);
    --tw-backdrop-blur: blur(10px);
    -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
    backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) !important;
}

.mdc-dialog__surface {
    background-color: rgb(255 255 255 / 0.8) !important;
}

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title, .apexcharts-tooltip-text {
    background: transparent !important;
    border-color: rgb(255 255 255 / 0.2) !important;
}

.report-filter .mat-autocomplete-list-popup {
    background-color: rgb(255 255 255 / 0.9) !important;
}


.mdc-dialog {
    z-index: 100 !important;
}

.mdc-text-field--disabled.mdc-text-field--filled {
    background-color: #0000000f !important;
}

.mdc-text-field--filled {
    background-color: transparent !important;
}

.mat-virtual-scroll-item {
    height: fit-content !important;
    margin-bottom: 20px !important;
}

.error .card, .error .mdc-dialog__surface {
    border-color: rgb(239 68 68/0.8) !important;
}

/* TEMA OSCURO */
html.dark {
    *

{
    --mdc-theme-primary: #6269e5 !important;
    --mdc-theme-secondary: #6269e5 !important;
}

label {
    color: #ffffffdd !important;
}

/*    .mdc-menu {
        background-color: rgb(30 30 30 / 0.6) !important;
        border-color: rgb(100 100 100 / 0.25) !important;
        box-shadow: 0px 1px 0 0 rgb(0 0 0 / 20%), 0px 2px 5px 0 rgb(0 0 0 / 20%), 0 0 20px 0 rgb(0 0 0 / 20%) !important;
    }*/

.mdc-list-item__text,
.mdc-tab__text-label,
.mdc-select__selected-text,
.mdc-text-field__icon,
.mdc-chip__icon,
.mat-text-field-input,
.mdc-icon-button,
.mdc-dialog__title {
    color: #ffffffee !important;
}

.mdc-tab--active .mdc-tab__text-label {
    color: #6269e5 !important;
}

.mdc-paginator-page-size,
.mat-paginator-page-size-label,
.mdc-paginator-range-label,
.mat-paginator-range-labelmat-paginator-range-label, .mdc-icon-button:disabled {
    color: #ffffff50 !important;
}

.mdc-floating-label,
.mdc-tab__text-label,
.apexcharts-legend-text,
.mdc-dialog__content {
    color: #ffffff80 !important;
}

/*    .mat-autocomplete-list-popup {
        background-color: rgb(30 30 30 / 0.6) !important;
        border-color: rgb(100 100 100 / 0.25) !important;
        box-shadow: 0px 1px 0 0 rgb(0 0 0 / 20%), 0px 2px 5px 0 rgb(0 0 0 / 20%), 0 0 20px 0 rgb(0 0 0 / 20%) !important;
    }*/

.report-filter .mat-autocomplete-list-popup {
    background-color: rgb(30 30 30 / 0.9) !important;
}

.mdc-line-ripple::before {
    border-bottom-color: rgb(99 99 99 / 42%) !important;
}

.q-shadow {
    box-shadow: 0px 1px 0 0 rgb(0 0 0 / 20%), 0px 2px 5px 0 rgb(0 0 0 / 20%), 0 0 20px 0 rgb(0 0 0 / 20%) !important;
}

.loading-overlay {
    background-color: rgba(30, 30, 30, 0.1) !important;
}

tr.mdc-table-footer-row:nth-child(2n+1), tr.mdc-table-row:nth-child(2n+1) {
    background-color: #27272a60 !important;
}

tr.mdc-table-footer-row, tr.mdc-table-row {
    color: #ffffff99 !important;
}

.main {
    --scrollbar-color-thumb: #ffffff50 !important;
    --scrollbar-color-track: rgb(40 40 40) !important;
}

.mat-paginator {
    background-color: #18181b !important;
}

.mdc-select__dropdown-icon {
    fill: rgb(255 255 255 / 41%) !important;
}

.apexcharts-grid-borders {
    opacity: 0.4 !important;
}

.apexcharts-grid {
    opacity: 0.2 !important;
}

[id^="SvgjsText"] {
    fill: #ffffffaa !important;
}

.mat-accordion .mat-expansion-panel {
    background-color: #212125 !important;
    color: #ffffff75 !important;
}

.mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true]) ~ .mdc-checkbox__background {
    border-color: rgb(255 255 255 / 54%) !important;
}

.mdc-text-field--disabled, .mdc-linear-progress__buffer-bar {
    background-color: #0000004a !important;
}

/*    .apexcharts-tooltip.apexcharts-theme-light {
        --tw-backdrop-blur: blur(8px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia) !important;
        background-color: rgb(30 30 30 / 0.6) !important;
        border-color: #27272a !important;
        border-width: 1px !important;
        border-radius: 0.375rem !important;
        box-shadow: 0px 1px 0 0 rgb(0 0 0 / 20%), 0px 2px 5px 0 rgb(0 0 0 / 20%), 0 0 20px 0 rgb(0 0 0 / 20%) !important;
    }*/

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title, .apexcharts-tooltip-text {
    background: transparent !important;
    border-color: #27272a !important;
    color: #ffffff;
}

.mdc-chip {
    background-color: #ffffff20 !important;
    color: #ffffffBB !important;
}

.card, .mdc-menu, .mat-autocomplete-list-popup, .apexcharts-tooltip.apexcharts-theme-light, .mdc-dialog__surface {
    border-color: rgb(255 255 255 / 0.1) !important;
    background-color: rgb(39 39 42 / 0.6) !important;
    --tw-text-opacity: 1;
    color: rgb(250 250 250 / var(--tw-text-opacity)) !important;
    --tw-shadow-color: rgb(9 9 11 / 0.6);
    --tw-shadow: var(--tw-shadow-colored);
    --tw-ring-color: rgb(9 9 11 / 0.35);
}

.error .card, .error .mdc-dialog__surface {
    border-color: rgb(239 68 68/0.4) !important;
}

}

@media (min-width: 592px) {
    .mdc-dialog.no-max-width .mdc-dialog__surface {
        max-width: 100% !important;
    }
}