.sm-color-selector .color-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.sm-color-selector .color-grid-cell {
    cursor: pointer;
    min-width: 3em;
    min-height: 3em;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--palette-select-icon-color);
}
.sm-color-selector .color-grid-cell:hover {
    filter: brightness(1.1);
    color: var(--palette-select-icon-color-hover);
}

.sm-color-selector .button-cell {
    color: var(--button-background);
}
.sm-color-selector .button-cell:hover {
    color: var(--button-background-hover);
}
.sm-color-selector .palette-button {
    color: var(--palette-button-color);
    background-color: var(--palette-button-background);
    border-color: var(--palette-button-background);
}
.sm-color-selector .palette-button:hover {
    color: var(--palette-button-color-hover);
    background-color: var(--palette-button-background-hover);
    border-color: var(--palette-button-background-hover);
}