[data-role="options-bar"] {
    box-sizing:border-box;
    position:relative;
    display:block; 
    column-gap:0 !important;
    row-gap:0 !important;
    border-radius:0.25em;
    overflow:hidden;
    margin-bottom:1em; 
    padding:1px !important;
}

[data-role="options-bar"] > label { 
    display:block;
    width:100%; 
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
    
}

[data-role="options-bar"]:not(.vertical) > [data-role="button"] { text-align:center; margin:0 !important; border-left-width:0; padding:0.5em; }
[data-role="options-bar"]:not(.vertical) > [data-role="button"]:first-child,
[data-role="options-bar"]:not(.vertical) > label + [data-role="button"] { border-top-left-radius:0.25em; border-bottom-left-radius:0.25em; overflow:hidden; border-left-width:1px; }
[data-role="options-bar"]:not(.vertical) > [data-role="button"]:last-child  { border-top-right-radius:0.25em; border-bottom-right-radius:0.25em; overflow:hidden; }

[data-role="options-bar"].vertical { grid-template-columns:100% !important; }
[data-role="options-bar"].vertical > [data-role="button"]:first-child,
[data-role="options-bar"].vertical > label + [data-role="button"] { border-top-left-radius:0.25em; border-top-right-radius:0.25em; overflow:hidden; border-top-width:1px; }
[data-role="options-bar"].vertical > [data-role="button"]:last-child  { border-bottom-left-radius:0.25em; border-bottom-right-radius:0.25em; overflow:hidden; }

[data-role="options-bar"].fade-inactive > [data-role="button"]:not(.active) > * { opacity:0.6 }