/* @define CoreFinancialsChart */

.CoreFinancialsChart {
    position: relative;
    overflow: hidden;
}

.CoreFinancialsChart-canvasContainer {
    height: 184px;
    width: 180px;
    margin: 0 auto;
}

.CoreFinancialsChart-xAxisContainer {
    display: flex;
    flex-direction: column;
    padding: var(--padding-xs);
    justify-content: center;
    align-items: center;
    gap: var(--padding-xxs, 4px);
    align-self: stretch;
    border-top: var(--border-xs) solid var(--border-subtle);
    border-left: var(--border-xs) solid var(--border-subtle);
    background: var(--surface-subtle-dark);
}

.CoreFinancialsChart-xAxisLabel {
    color: var(--text-emphasis);
    text-align: center;
    font-size: var(--font-size-medium);
    font-style: normal;
    font-weight: var(--font-weight-semibold, 600);
    line-height: 21px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.CoreFinancialsChart-xAxisValues {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--padding-xxs);
    height: 20px;
    padding: 0;
    align-self: stretch;
}

.CoreFinancialsChart-arrowIcon {
    font-size: var(--icon-size-sm);
}

.CoreFinancialsChart-xAxisValuesVariance {
    display: flex;
    flex-grow: 0;
    align-items: center;
    justify-content: center;
    gap: var(--padding-md);
}

.CoreFinancialsChart-xAxisValuesVarianceChange,
.CoreFinancialsChart-xAxisValuesVariancePercentage {
    color: var(--text-default);
    text-overflow: ellipsis;
    font-size: var(--font-size-small);
    font-style: normal;
    font-weight: var(--font-weight-semibold);
    line-height: normal;
}