﻿.apexcharts-tooltip.apexcharts-active {
    direction: rtl !important;
}

span.apexcharts-tooltip-marker {
    background-color: #008ffb;
    margin: 0 0 0 10px !important;
}

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
    background: #008ffbc9 !important;
    border-bottom: 1px solid #ddd !important;
    color: white !important;
}

.apexcharts-tooltip {
    border: none !important;
    background: rgb(255 255 255 / 92%) !important;
}

.apexcharts-tooltip-series-group.apexcharts-active {
    justify-content: flex-start;
}

.zp-dark .apexcharts-tooltip-series-group.apexcharts-active {
    background-color: #383838b8;
    color: white;
}

.zp-dark .apexcharts-tooltip.apexcharts-active {
    background: #383838b8 !important;
}

.zp-dark .apexcharts-tooltip-title {
    border-bottom-color: #383838 !important;
}

.kpi-componnet {
    border-radius: var(--bs-border-radius-xxl) !important;
    background-image: var(--bs-gradient) !important;
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
    text-align: center !important;
    padding: 1.5rem !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
    display: flex !important;
    min-width: 140px;
    min-height: 140px;
    backdrop-filter: blur(5px) saturate(73%);
    -webkit-backdrop-filter: blur(5px) saturate(73%);
    background-color: rgba(255, 255, 255, 0.63) !important;
    border: 1px solid rgba(209, 213, 219, 0.3);
}

    .kpi-componnet .kpi-value {
        font-size: 2rem;
        white-space: pre;
        color: var(--bs-heading-color, inherit);
    }

    .kpi-componnet .kpi-title {
        --bs-text-opacity: 1;
        color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
    }

@media(max-width:500px) {
    .kpi-componnet .kpi-value {
        font-size: 1.2rem;
    }
}
.kpi-list-components{
    position: absolute;
    top: -3rem;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: #f3f3f491 var(--bs-heading-color, #2b5876);
}
