.webbpm.ervu_business_metrics {
    --white: #fff;
    --color-text-primary: #020c12;
    --color-text-active: #015e98;
    --color-text-mute: rgba(2, 12, 18, 0.58);
    --color-link: #015e98;

    --border: rgba(1, 72, 116, 0.1);
    --shadow: 0 3px 2px -2px rgba(0, 0, 0, 0.15);
    --bg-red: #f1d2d2;
    --bg-blue: #a1c2e0;
    --bg-yellow: #e7dcab;
    --bg-green: #96b9ad;
    --bg-orange: #e9decd;

    --input-bg: rgba(53, 126, 172, 0.05);
    --input-border: rgba(53, 126, 172, 0.2);
    --page-bg: rgba(38, 117, 166, 0.025);
    --header-bg: rgba(53, 126, 172, 0.05);
    --block-bg: rgba(53, 126, 172, 0.1);
    --block-active-bg: linear-gradient(155deg, #1497cf 0%, #064f99 100%);
    --block-shadow: 0 3px 2px -2px rgba(0, 75, 118, 0.15);

    --size-text-header: 32px;
    --size-text-title: 24px;
    --size-text-subtitle: 20px;
    --size-text-subhead: 18px;
    --size-text-primary: 16px;
    --size-text-secondary: 14px;
    --size-text-mini: 10px;

    --size-num-title: 36px;

    --indent-xlarge: 40px;
    --indent-large: 32px;
    --indent-medium: 24px;
    --indent-xbase: 20px;
    --indent-base: 16px;
    --indent-small: 12px;
    --indent-mini: 8px;
    --indent-xmini: 4px;

    --h-header: 68px;
}

.webbpm.ervu_business_metrics {
    display: flex;
    flex-direction: column;
    color: var(--color-text-primary);
    font-family: 'Golos';
}

.webbpm.ervu_business_metrics .container {
    padding: var(--h-header) 0 0;
    bottom: 0;
    background-color: var(--page-bg);
}
.webbpm.ervu_business_metrics .container-inside {
    position: relative;
    font-family: 'GolosUI';
    font-size: var(--size-text-primary);
    height: 100%;
    padding: var(--indent-base) var(--indent-xbase) var(--indent-xbase);
    overflow: auto;
}

.webbpm.ervu_business_metrics .header-logo {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: var(--indent-xbase);
}
.webbpm.ervu_business_metrics .header-logo .logo-title {
    font-family: 'GolosM';
    font-size: var(--size-text-header);
}

.webbpm.ervu_business_metrics .header {
    display: flex;
    font-family: 'Golos';
    font-size: var(--size-text-primary);
    color: var(--color-text-primary);
    width: 100%;
    height: auto;
    min-height: var(--h-header);
    background-color: var(--header-bg);
}
.webbpm.ervu_business_metrics .header > div > * {
    position: relative;
    display: flex;
    align-items: center;
}

@supports not selector(::-webkit-scrollbar) {
    * {
        scrollbar-width: thin;
        scrollbar-color: var(--color-text-primary) transparent;
    }
}
::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    background-color: transparent;
}
::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: var(--color-text-primary);
}
::-webkit-scrollbar-track {
    height: 4px;
    background-color: transparent;
}

.webbpm.ervu_business_metrics .progress {
    width: 64px;
    height: 64px;
    border: 5px dotted var(--color-text-primary);
    border-radius: 100%;
    display: inline-block;
    position: relative;
    background: transparent;
    box-sizing: border-box;
    animation: rotation 2.5s linear infinite;
}
.webbpm.ervu_business_metrics .loader.modal .modal-content {
    border: 0;
    background: transparent;
    box-shadow: none;
}
@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
