﻿.ball-status {
    width: var(--size);
    height: var(--size);
    border-radius: 1000px;
    position: relative;
}

    .ball-status.green {
        background-color: var(--mud-palette-success-green);
    }

    .ball-status.yellow {
        background-color: var(--mud-palette-warning-yellow);
    }

    .ball-status.red {
        background-color: var(--mud-palette-danger-red);
    }

    .ball-status.gray {
        background-color: var(--mud-palette-light-gray);
    }

    .ball-status::after {
        content: "";
        position: absolute;
        top: -15%;
        left: -15%;
        width: calc(1.3 * var(--size));
        height: calc(1.3 * var(--size));
        border-radius: 1000px;
        background-color: inherit;
        opacity: .3;
        filter: blur(5px);
    }
