.bd-keybind {
    padding: 10px;
    display: flex;
    margin-top: 10px;
    background-color: rgba(0, 0, 0, .1);
    border: 1px solid rgba(0, 0, 0, .3);
    transition: border .15s ease;
    border-radius: 3px;
    box-sizing: border-box;
    min-height: 40px;

    .bd-keybindSelected {
        flex: 1 1 auto;
        color: #f6f6f7;
        font-size: 14px;
    }

    &.bd-keybindUnset {
        .bd-keybindSelected {
            color: hsla(240, 6%, 97%, .3);
            font-weight: 600;
        }
    }

    .bd-button {
        border-radius: 2px;
        margin: -4px -4px -4px 10px;
        padding: 2px 20px;
        transition: background-color .2s ease-in-out, color .2s ease-in-out;
        font-size: 14px;
        font-weight: 500;
        flex: 0 0 auto;
        cursor: pointer;
    }

    &.bd-active {
        border-color: $colerr;
        animation: bd-keybindPulse 1s infinite;

        .bd-button {
            color: $colerr;
            background-color: rgba($colerr, .3);
        }
    }
}
