.component-spacing-editor {
}

    .component-spacing-editor ul {
        display: flex;
        flex-wrap: wrap;
        list-style: none;
        margin: -5px;
        padding: 0;
    }

        .component-spacing-editor ul li {
            display: flex;
            margin: 5px;
        }

    .component-spacing-editor input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

        .component-spacing-editor input:focus ~ label {
            background: #e9e9ed;
        }

    .component-spacing-editor label {
        background: #f3f3f5;
        transition: background 0.2s ease-in-out;
        display: flex;
        padding: 10px 20px;
        margin: 0;
        border-radius: 5px;
        line-height: 1;
        user-select: none;
    }

        .component-spacing-editor label:hover {
            background: #e9e9ed;
        }

    .component-spacing-editor input:checked ~ label {
        background: #fee4e1;
    }