.checkbox-button{height:2.8em;display:grid;grid-auto-flow:column;place-items:center;gap:1em;border-radius:.8em;color:var(--color, var(--clr-metal-950))}.checkbox-button div{display:flex;place-items:center;place-content:center;width:2rem;aspect-ratio:1;border-radius:.6rem;border:1px solid var(--clr-metal-200);background:var(--clr-white);overflow:hidden;transition:background-color .1s}.checkbox-button div .icon{--width: 85%;--height: 85%;margin-top:-1px;color:var(--clr-white);transform:translateY(-100%)}.checkbox-button.active div{border:1px solid var(--clr-metal-950);background:var(--clr-metal-950)}.checkbox-button.active div .icon{transform:translateY(0);transition:transform .2s ease-out}.checkbox-button label{font-size:1.8rem;color:var(--clr-metal-950)}.checkbox-button.sm label,.layout.sm .checkbox-button label{font-size:1.6rem}