Voices
{
    position: absolute;
    left: 16px;
    top: 44px;
    right: auto;
    padding: 16px;
    gap: 8px;
    flex-direction: column;
    border-radius: 2px;

    .row
    {
        justify-content: flex-start;
    }

    .item-row
    {
        gap: 8px;
        justify-content: flex-start;
        align-items: center;
        padding: 12px 24px;
    }

    .voice-mic-icon {
        width: 24px;
        height: 24px;
        flex-shrink: 0;
        background-image: url( /ui/chat/radio.png );
        background-size: 100% 100%;
        border-radius: 4px;
    }

    .item-row.voice-alive {
        border-left: 3px solid rgba( 100, 200, 100, 0.8 );
        background-image: linear-gradient( rgba( 40, 90, 40, 0.08 ), rgba( 50, 50, 50, 0.1 ) );
        background-angle: -80deg;

        .voice-mic-icon {
            background-image-tint: rgba( 100, 200, 100, 0.9 );
        }
    }

    .item-row.voice-detective {
        border-left: 3px solid rgba( 121, 195, 255, 0.8 );
        background-image: linear-gradient( rgba( 45, 80, 130, 0.08 ), rgba( 50, 50, 50, 0.1 ) );
        background-angle: -80deg;

        .voice-mic-icon {
            background-image-tint: rgba( 121, 195, 255, 0.9 );
        }
    }

    .item-row.voice-dead {
        border-left: 3px solid rgba( 230, 200, 50, 0.8 );
        background-image: linear-gradient( rgba( 120, 100, 20, 0.08 ), rgba( 50, 50, 50, 0.1 ) );
        background-angle: -80deg;

        .voice-mic-icon {
            background-image-tint: rgba( 230, 200, 50, 0.9 );
        }
    }

    .item-row.voice-team-traitor {
        border-left: 3px solid rgba( 220, 60, 60, 0.8 );
        background-image: linear-gradient( rgba( 120, 30, 30, 0.08 ), rgba( 50, 50, 50, 0.1 ) );
        background-angle: -80deg;

        .voice-mic-icon {
            background-image-tint: rgba( 220, 60, 60, 0.9 );
        }
    }

    .item-row.voice-team-detective {
        border-left: 3px solid rgba( 80, 150, 255, 0.8 );
        background-image: linear-gradient( rgba( 30, 60, 130, 0.08 ), rgba( 50, 50, 50, 0.1 ) );
        background-angle: -80deg;

        .voice-mic-icon {
            background-image-tint: rgba( 80, 150, 255, 0.9 );
        }
    }

    .item-row.voice-team {
        border-left: 3px solid rgba( 255, 180, 60, 0.8 );
        background-image: linear-gradient( rgba( 130, 90, 20, 0.08 ), rgba( 50, 50, 50, 0.1 ) );
        background-angle: -80deg;

        .voice-mic-icon {
            background-image-tint: rgba( 255, 180, 60, 0.9 );
        }
    }

    img
    {
        width: 28px;
        height: 28px;
        border-radius: 100px;
        margin-left: 0;
    }
}