.kPIs .totalDistanceKPI .KPICardBody {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
}

.kPIs .totalDistanceKPI {
    align-items: center;
    height: 42px;
    background: transparent;
}

    .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyTitle {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyTitle p {
            font-size: 11px;
            text-transform: uppercase;
            margin: 0px;
            color: rgb(255, 255, 255);
        }

        .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyTitle span {
            font-weight: 600;
            font-size: 12px;
            color: rgb(255, 255, 255);
        }

    .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyDetails {
    }

        .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyDetails div {
            display: flex;
            align-items: baseline;
            justify-content: space-between;
        }

            .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyDetails div p {
                font-size: 9px;
                text-transform: capitalize;
                margin: 6px 0px 0px;
                font-weight: 600;
                padding-inline-end: 4px;
            }

                .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyDetails div p.orangeTitle {
                    color: rgb(227, 112, 20);
                }

                .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyDetails div p.greenTitle {
                    color: rgb(23, 206, 31);
                }

            .kPIs .totalDistanceKPI .KPICardBody .KPICardBodyDetails div span {
                color: rgb(149, 157, 173);
                font-size: 9px;
            }

    .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails {
        display: flex;
        align-self: flex-end;
        margin-inline-start: 3px;
        flex-direction: column;
        width: 58%;
    }

        .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails div {
            display: flex;
            margin-inline-start: 6px;
            align-items: center;
        }

            .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails div p {
                color: rgb(149, 157, 173);
                font-size: 9px;
                margin: 6px 0px 0px;
                padding-inline-start: 16px;
                width: 31%;
            }

            .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails div span {
                display: block;
                color: rgb(149, 157, 173);
                font-size: 9px;
                position: relative;
                margin-top: 6px;
                padding-inline-start: 16px;
                width: 30%;
            }

                .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails div span::before {
                    content: "";
                    width: 8px;
                    height: 8px;
                    border-radius: 4px;
                    position: absolute;
                    inset-inline-start: 4px;
                    top: 2px;
                }

                .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails div span.greenDott::before {
                    background: rgb(52, 181, 58);
                }

                .kPIs .totalDistanceKPI .FullAndEmptyDistanceDetails div span.redDott::before {
                    background: rgb(255, 58, 41);
                }