#state_KeybindingsState {
    .content {
        .topEntries {
            display: grid;
            grid-template-columns: 1fr auto;
            @include S(grid-gap, 5px);
            @include S(margin-bottom, 10px);
        }

        .hint {
            display: block;
            background: #eee;
            @include S(padding, 4px);
            @include PlainText;
        }

        .category {
            .entry {
                display: grid;
                @include S(margin-top, 2px);
                @include S(padding-top, 2px);
                @include S(grid-gap, 4px);
                grid-template-columns: 1fr #{D(100px)} auto auto;
                border-bottom: #{D(1px)} dotted #eee;
                color: #888c8f;
                .mapping {
                    color: $colorBlueBright;
                    text-align: center;
                }

                button {
                    @include S(height, 15px);
                    @include S(width, 15px);
                    @include IncreasedClickArea(0px);
                    background: transparent center center / 40% no-repeat;
                    opacity: 0.9;
                    &.editKeybinding {
                        /* @load-async */
                        background-image: uiResource("icons/edit_key.png");
                    }

                    &.resetKeybinding {
                        /* @load-async */
                        background-image: uiResource("icons/reset_key.png");
                    }

                    &.disabled {
                        pointer-events: none;
                        cursor: default;
                        opacity: 0.1 !important;
                    }
                }
            }
        }
    }

    @include DarkThemeOverride {
        .content {
            .hint {
                background: darken($darkModeControlsBackground, 4);
            }

            .category .entry {
                color: #c0c4c8;
                border-bottom-color: #888;

                button {
                    filter: invert(1);
                }
            }
        }
    }
}