.s-input-variants {
    overflow: auto;
    display: flex;
    align-items: stretch;
    border-radius: 0.5rem;
}

    .s-input-variants__variant {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
        display: flex;
        flex-basis: 50%;
        align-items: center;
        justify-content: center;
        text-align: center;
        border: none;
        cursor: pointer;
        transition: color 0.1s, background-color 0.1s, font-weight 0s, box-shadow 0.2s cubic-bezier(0,.26,.36,.72);
    }
        .s-input-variants__variant:hover {
            box-shadow: var(--shadow--lighter) inset;
        }
        .s-input-variants__variant:focus:not(:hover) {
            box-shadow: var(--shadow--lighter) inset;
        }
        .s-input-variants__variant--active {
            font-weight: 500;
        }