
ColorSwatchPicker {
    background-color: #0008;
    padding: 4px;
    border-radius: 10px;
    position: relative;
    pointer-events: all;
    height: 28px;
}

.swatch 
{
    height: 20px;
    flex-shrink: 0;
    flex-grow: 1;
    pointer-events: none;
}

.swatches 
{
    width: 100%;
    border-radius: 6px;
    overflow: hidden;

    cursor: pointer;
    position: relative;
}

.thumb
{
    position: absolute;
    z-index: 100;
    height: 100%;
    width: 2px;
    pointer-events: none;
    transform: translateZ(-10px);
    color: #fff;
    text-shadow: none;
    margin-left: 3px;
}

.thumb i
{
    position: absolute;
    transform: rotate( 90deg );
    font-size: 14px;
    top: -7px;
    left: -4px;
}

.thumb .bottom
{
    top: 13px;
    transform: rotate( -90deg );
}