button,.button{cursor:pointer;border:unset;outline:unset}.link{cursor:pointer}.btn{--clr:var(--text-clr);--clr-bg:var(--bg-clr);--padding:8px 16px;--border:1px solid transparent;color:var(--clr);cursor:pointer;position:relative;transition-duration:var(--transition-duration);transition-timing-function:var(--transition-function);transition-property:opacity,background-color,color,text-decoration-color}.btn:not(.btn.btn--link){background-color:var(--clr-bg);border:var(--border);padding:var(--padding,8px 16px);border-radius:var(--br-small);display:flex;justify-content:center;align-items:center;gap:8px}.btn .vlx-icon{--clr:var(--text-clr);transition:background-color var(--timing);--w:var(--fs-p);--h:var(--w)}.btn span{color:var(--clr)}.btn--xsmall{--padding:0;--fs:var(--fs-xsmall)}.btn--xsmall .vlx-icon{--w:var(--fs-xsmall);--h:var(--w)}.btn--small{--padding:4px 8px;--fs:var(--fs-small)}.btn--small .vlx-icon{--w:var(--fs-small);--h:var(--w)}.btn--large{--padding:12px 24px;--fs:var(--fs-medium)}.btn--large .vlx-icon{--w:var(--fs-medium);--h:var(--w)}.btn--icon{width:32px;height:32px;padding:unset!important;display:grid;place-content:center;--clr-bg:var(--bg-clr-light)}.btn--icon .vlx-icon{--w:16px;--h:16px;--clr:var(--text-clr)}.btn--disabled,.btn.--disabled{cursor:not-allowed;opacity:.5}.btn--primary{--clr:var(--text-clr-invert);--border:1px solid var(--accent);--clr-bg:var(--accent)}.btn--primary .vlx-icon{--clr:var(--text-clr-invert)}.btn--primary-outline{--clr:var(--accent);--border:1px solid var(--accent);--clr-bg:transparent}.btn--primary-outline .vlx-icon{--clr:var(--accent)}.btn--outline{--clr:var(--text-clr);--border:1px solid var(--text-clr);--clr-bg:transparent}.btn--outline .vlx-icon{--clr:var(--text-clr)}.btn--white{--clr:var(--text-clr);--border:1px solid #fff;--clr-bg:#fff}.btn--white .vlx-icon{--clr:var(--text-clr)}.btn--white-outline{--clr:#fff;--border:1px solid #fff;--clr-bg:transparent}.btn--white-outline .vlx-icon{--clr:#fff}.btn--black{--clr:var(--text-clr-invert);--border:1px solid #000;--clr-bg:#000}.btn--black .vlx-icon{--clr:var(--text-clr-invert)}.btn--black-outline{--clr:#000;--border:1px solid #000;--clr-bg:transparent}.btn--black-outline .vlx-icon{--clr:#000}.btn--link{--clr:var(--accent);--fw:normal;text-decoration:underline;text-decoration-color:var(--accent);--fs:var(--fs-p);background-color:unset;border:unset;padding:0;min-height:unset;min-width:unset}.btn--link .vlx-icon{--clr:var(--accent)}.btn:is(:hover,:focus,:active,.--active,.--focused){&.btn--icon{background-color:var(--accent)}&.btn--icon .vlx-icon{--clr:var(--text-clr-invert)}&.btn--primary{--clr:var(--text-clr);--border:1px solid var(--accent);--clr-bg:var(--bg-clr-light)}&.btn--primary .vlx-icon{--clr:var(--text-clr)}&.btn--primary-outline{--clr:var(--text-clr-invert);--border:1px solid var(--accent);--clr-bg:var(--accent)}&.btn--primary-outline .vlx-icon{--clr:var(--text-clr-invert)}&.btn--outline{--clr:var(--text-clr-invert);--border:1px solid #000;--clr-bg:#000}&.btn--outline .vlx-icon{--clr:var(--text-clr-invert)}&.btn--white{--clr:var(--text-clr-invert);--border:1px solid var(--bg-clr-invert);--clr-bg:var(--bg-clr-invert)}&.btn--white .vlx-icon{--clr:var(--text-clr-invert)}&.btn--white-outline{--clr:var(--text-clr);--border:1px solid var(--bg-clr);--clr-bg:var(--bg-clr)}&.btn--white-outline .vlx-icon{--clr:var(--text-clr)}&.btn--black{--clr:var(--text-clr-invert);--border:1px solid var(--accent);--clr-bg:var(--accent)}&.btn--black .vlx-icon{--clr:var(--text-clr-invert)}&.btn--black-outline{--clr:var(--text-clr-invert);--border:1px solid #000;--clr-bg:#000}&.btn--black-outline .vlx-icon{--clr:var(--text-clr-invert)}&.btn--link{--clr:var(--accent-hover);text-decoration-color:var(--accent-hover)}&.btn--link .vlx-icon{--clr:var(--accent-hover)}}.btn--danger{--clr:var(--text-clr-invert);--border:1px solid var(--red-300);--clr-bg:var(--red-300)}.btn--danger .vlx-icon{--clr:var(--text-clr-invert)}.btn--danger-outline{--clr:var(--red-300);--border:1px solid var(--red-300);--clr-bg:transparent}.btn--danger-outline .vlx-icon{--clr:var(--red-300)}.btn--warning{--clr:var(--text-clr-invert);--border:1px solid var(--orange-300);--clr-bg:var(--orange-300)}.btn--warning .vlx-icon{--clr:var(--text-clr-invert)}.btn--warning-outline{--clr:var(--orange-300);--border:1px solid var(--orange-300);--clr-bg:transparent}.btn--warning-outline .vlx-icon{--clr:var(--orange-300)}.btn--success{--clr:var(--text-clr-invert);--border:1px solid var(--green-300);--clr-bg:var(--green-300)}.btn--success .vlx-icon{--clr:var(--text-clr-invert)}.btn--success-outline{--clr:var(--green-300);--border:1px solid var(--green-300);--clr-bg:transparent}.btn--success-outline .vlx-icon{--clr:var(--green-300)}.btn--info{--clr:var(--text-clr-invert);--border:1px solid var(--blue-300);--clr-bg:var(--blue-300)}.btn--info .vlx-icon{--clr:var(--text-clr-invert)}.btn--info-outline{--clr:var(--blue-300);--border:1px solid var(--blue-300);--clr-bg:transparent}.btn--info-outline .vlx-icon{--clr:var(--blue-300)}.btn:is(:hover,:focus,:active,.--active,.--focused){&.btn--danger{--clr:var(--red-300);--border:1px solid var(--red-300);--clr-bg:var(--bg-clr-light)}&.btn--danger .vlx-icon{--clr:var(--red-300)}&.btn--danger-outline{--clr:var(--text-clr-invert);--border:1px solid var(--red-300);--clr-bg:var(--red-300)}&.btn--danger-outline .vlx-icon{--clr:var(--text-clr-invert)}&.btn--warning{--clr:var(--orange-300);--border:1px solid var(--orange-300);--clr-bg:var(--bg-clr-light)}&.btn--warning .vlx-icon{--clr:var(--orange-300)}&.btn--warning-outline{--clr:var(--title-clr);--border:1px solid var(--orange-300);--clr-bg:var(--orange-300)}&.btn--warning-outline .vlx-icon{--clr:var(--title-clr)}&.btn--success{--clr:var(--green-300);--border:1px solid var(--green-300);--clr-bg:var(--bg-clr-light)}&.btn--success .vlx-icon{--clr:var(--green-300)}&.btn--success-outline{--clr:var(--text-clr-invert);--border:1px solid var(--green-300);--clr-bg:var(--green-300)}&.btn--success-outline .vlx-icon{--clr:var(--text-clr-invert)}t &.btn--info{--clr:var(--blue-300);--border:1px solid var(--blue-300);--clr-bg:var(--bg-clr-light)}&.btn--info .vlx-icon{--clr:var(--blue-300)}&.btn--info-outline{--clr:var(--text-clr-invert);--border:1px solid var(--blue-300);--clr-bg:var(--blue-300)}&.btn--info-outline .vlx-icon{--clr:var(--text-clr-invert)}}.btn--loading,.btn.--loading{cursor:not-allowed;animation:pulse 1.5s infinite}