.sqt-button{--button-border-radius:.25rem;--button-border-width:1px;--button-font-weight:500;--button-icon-gap:.375rem;--button-text-color:var(--text-color);--button-bg-color:var(--white-color);--button-border-color:color-mix(in srgb, var(--black-color) 15%, var(--white-color));--button-hover-text-color:var(--sqt-color-primary);--button-hover-bg-color:var(--sqt-color-primary-light-9);--button-hover-border-color:var(--sqt-color-primary-light-7);--button-active-text-color:var(--button-hover-text-color);--button-active-bg-color:var(--button-hover-bg-color);--button-active-border-color:var(--sqt-color-primary);--button-disabled-text-color:var(--info-color);--button-disabled-bg-color:var(--white-color);--button-disabled-border-color:color-mix(in srgb, var(--black-color) 10%, var(--white-color));--button-outline-color:var(--sqt-color-primary-light-5);box-sizing:border-box;white-space:nowrap;height:2.5rem;color:var(--button-text-color);text-align:center;line-height:1;font-size:var(--font-size);font-weight:var(--button-font-weight);-webkit-user-select:none;user-select:none;vertical-align:middle;appearance:none;background-color:var(--button-bg-color);border:var(--button-border-width) solid var(--button-border-color);border-radius:var(--button-border-radius);cursor:pointer;outline:none;justify-content:center;align-items:center;padding-block:0;padding-inline:1.125rem;transition:all .1s;display:inline-flex}.sqt-button+.sqt-button{margin-left:.75rem}.sqt-button:hover{color:var(--button-hover-text-color);border-color:var(--button-hover-border-color);background-color:var(--button-hover-bg-color)}.sqt-button:active{color:var(--button-active-text-color);border-color:var(--button-active-border-color);background-color:var(--button-active-bg-color)}.sqt-button:focus-visible{outline:.125rem solid var(--button-outline-color);outline-offset:1px}.sqt-button::-moz-focus-inner{border:0}.sqt-button__icon{color:inherit;justify-content:center;align-items:center;font-size:1em;line-height:1;display:inline-flex}.sqt-button__icon .sqt-svg,.sqt-button__icon svg{width:1em;height:1em}.sqt-button__icon.is-loading{animation:1s linear infinite sqt-button-rotate}.sqt-button__icon+.sqt-button__text{margin-left:var(--button-icon-gap)}.sqt-button__text{align-items:center;display:inline-flex}.sqt-button--large{--button-icon-gap:.5rem;height:3rem;font-size:var(--font-size);padding-inline:1.35rem}.sqt-button--small{--button-icon-gap:.25rem;height:2rem;font-size:calc(var(--font-size) - .125rem);padding-inline:.9rem}.sqt-button.is-plain{--button-hover-text-color:var(--sqt-color-primary);--button-hover-bg-color:var(--white-color);--button-hover-border-color:var(--sqt-color-primary);--button-active-text-color:var(--sqt-color-primary);--button-active-bg-color:var(--sqt-color-primary-light-9);--button-active-border-color:var(--sqt-color-primary)}.sqt-button.is-text{--button-text-color:var(--text-color);--button-bg-color:transparent;--button-border-color:transparent;--button-hover-text-color:color-mix(in srgb, var(--black-color) 85%, var(--white-color));--button-hover-bg-color:color-mix(in srgb, var(--black-color) 6%, var(--white-color));--button-hover-border-color:transparent;--button-active-text-color:color-mix(in srgb, var(--black-color) 85%, var(--white-color));--button-active-bg-color:color-mix(in srgb, var(--black-color) 10%, var(--white-color));--button-active-border-color:transparent;--button-disabled-text-color:color-mix(in srgb, var(--black-color) 25%, var(--white-color));--button-disabled-bg-color:transparent;--button-disabled-border-color:transparent}.sqt-button.is-text.is-loading:before{background-color:#0000}.sqt-button.is-text.is-has-bg{--button-bg-color:color-mix(in srgb, var(--black-color) 6%, var(--white-color));--button-hover-bg-color:color-mix(in srgb, var(--black-color) 10%, var(--white-color));--button-active-bg-color:color-mix(in srgb, var(--black-color) 14%, var(--white-color))}.sqt-button.is-round{border-radius:1.25rem}.sqt-button.is-circle{border-radius:50%;width:2.5rem;padding-inline:0}.sqt-button.is-circle.sqt-button--large{width:3rem}.sqt-button.is-circle.sqt-button--small{width:2rem}.sqt-button.is-typed{--button-text-color:var(--white-color);--button-bg-color:var(--button-color);--button-border-color:var(--button-color);--button-hover-text-color:var(--white-color);--button-hover-bg-color:color-mix(in srgb, var(--button-color) 70%, var(--white-color));--button-hover-border-color:color-mix(in srgb, var(--button-color) 70%, var(--white-color));--button-active-text-color:var(--white-color);--button-active-bg-color:color-mix(in srgb, var(--button-color) 80%, var(--black-color));--button-active-border-color:color-mix(in srgb, var(--button-color) 80%, var(--black-color));--button-disabled-text-color:var(--white-color);--button-disabled-bg-color:color-mix(in srgb, var(--button-color) 50%, var(--white-color));--button-disabled-border-color:color-mix(in srgb, var(--button-color) 50%, var(--white-color));--button-outline-color:color-mix(in srgb, var(--button-color) 50%, var(--white-color))}.sqt-button.is-typed.is-plain{--button-text-color:var(--button-color);--button-bg-color:color-mix(in srgb, var(--button-color) 10%, var(--white-color));--button-border-color:color-mix(in srgb, var(--button-color) 50%, var(--white-color));--button-hover-text-color:var(--white-color);--button-hover-bg-color:var(--button-color);--button-hover-border-color:var(--button-color);--button-active-text-color:var(--white-color);--button-active-bg-color:color-mix(in srgb, var(--button-color) 80%, var(--black-color));--button-active-border-color:color-mix(in srgb, var(--button-color) 80%, var(--black-color));--button-disabled-text-color:color-mix(in srgb, var(--button-color) 50%, var(--white-color));--button-disabled-bg-color:color-mix(in srgb, var(--button-color) 10%, var(--white-color));--button-disabled-border-color:color-mix(in srgb, var(--button-color) 20%, var(--white-color))}.sqt-button.is-typed.is-text{--button-text-color:var(--button-color);--button-bg-color:transparent;--button-border-color:transparent;--button-hover-text-color:var(--button-color);--button-hover-bg-color:color-mix(in srgb, var(--button-color) 10%, var(--white-color));--button-hover-border-color:transparent;--button-active-text-color:var(--button-color);--button-active-bg-color:color-mix(in srgb, var(--button-color) 20%, var(--white-color));--button-active-border-color:transparent;--button-disabled-text-color:color-mix(in srgb, var(--button-color) 50%, var(--white-color));--button-disabled-bg-color:transparent;--button-disabled-border-color:transparent}.sqt-button.is-typed.is-text.is-has-bg{--button-bg-color:color-mix(in srgb, var(--button-color) 10%, var(--white-color));--button-hover-bg-color:color-mix(in srgb, var(--button-color) 20%, var(--white-color));--button-active-bg-color:color-mix(in srgb, var(--button-color) 30%, var(--white-color))}.sqt-button.is-loading{pointer-events:none;position:relative}.sqt-button.is-loading:before{content:"";z-index:1;pointer-events:none;border-radius:inherit;background-color:color-mix(in srgb, var(--white-color) 30%, transparent);position:absolute;inset:-1px}.sqt-button.is-loading .sqt-button__icon{z-index:2;position:relative}.sqt-button:disabled{cursor:not-allowed;opacity:1}.sqt-button.is-disabled,.sqt-button.is-disabled:hover,.sqt-button.is-disabled:active{color:var(--button-disabled-text-color);cursor:not-allowed;background-color:var(--button-disabled-bg-color);border-color:var(--button-disabled-border-color);background-image:none}@keyframes sqt-button-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
