.switch { display: grid; grid-auto-flow: column; height: fit-content; align-items: center; align-self: center; background: var(--color-menu); border: 1px solid var(--color-input-border); border-radius: var(--border-radius); } .switch .item { display: flex; align-items: center; padding: .5em 1.125em; color: var(--color-text); border-radius: var(--border-radius); text-wrap: nowrap; } .switch .active.item { background: var(--color-active); outline: 1px solid var(--color-input-border); } @media (pointer: coarse) { .switch .item { padding: .75em 1.125em; } } .switch button.item { background: transparent; }