charts.css

.step-name {
    margin-left: 1em;
}

.quick-date {
    color: #BDFF3F;
    text-align: center;
    padding: 0 0 10px 0;
}

.quick-date:hover {
    cursor: pointer;
    text-decoration: underline var(--color-blue);
}

.container-chart {
    width: 90%;
    margin: auto;
}

.chart-canvas {
    height: 40em;
}

.CodeMirror {
    width: 100%;
    height: auto;
    resize: vertical;
}

.CodeMirror-scroll {
    height: auto;
}

.headline-chart-step {
    font-size: 1.2rem;
}

.chart-preview:hover {
    cursor: pointer;
}

.chart-preview .card-action {
    word-break: break-word;
    color: #212121;
    min-height: 5rem;
    padding: 1rem;
}

.button-display-type.active {
    background-color: var(--color-green) !important;
}

.button-group-type.active {
    background-color: var(--color-blue-baby) !important;
}

.chart-preview.active .card-action {
    background-color: var(--color-red-light) !important;
}

#chart-date-card {
    background-color: var(--color-grey-dark-almost-transparent);
}

#filterActiveBadge {
    float: none;
    margin-left: 1rem;
}