.wg-btn{--btn-color:#3b3b3b;--btn-text:white;--border-width:2px;border:var(--border-width)solid #0000;background:var(--btn-color);color:var(--btn-text);cursor:pointer;border-radius:6px;outline:none;padding:6px 16px;transition-property:background,color,border-color,box-shadow;transition-duration:.45s;transition-timing-function:ease;box-shadow:0 0 0 5px #0000}.wg-btn[disabled]{cursor:not-allowed;background-color:#a8a8a8}.wg-btn:focus-visible{box-shadow:0 0 0 5px var(--primary-color,#2196f3)}.wg-btn--solid{color:#fff}.wg-btn--solid:hover:not([disabled]){background-color:oklch(from var(--btn-color)calc(l - .1)c h);border-color:oklch(from var(--btn-color)l c h/100%)}.wg-btn--solid:active:not([disabled]){background:oklch(from var(--btn-color).4 c h);border-color:oklch(from var(--btn-color).4 c h)}.wg-btn--dashed{border-style:dashed;border-color:oklch(from var(--btn-color)l c h/40%);color:var(--btn-color);background-color:#0000}.wg-btn--dashed:hover:not([disabled]){border-color:oklch(from var(--btn-color)l c h/100%)}.wg-btn--dashed:active:not([disabled]){color:oklch(from var(--btn-color)calc(l - .2)c h)}.wg-btn--outline{border-style:solid;border-color:oklch(from var(--btn-color)l c h/40%);color:var(--btn-color);background-color:#0000}.wg-btn--outline:hover:not([disabled]){border-color:oklch(from var(--btn-color)l c h/100%)}.wg-btn--outline:active:not([disabled]){color:oklch(from var(--btn-color)calc(l - .2)c h)}.wg-btn--filled{background-color:oklch(from var(--btn-color)l c h/10%);color:var(--btn-color)}.wg-btn--filled:hover:not([disabled]){background-color:oklch(from var(--btn-color)l c h/15%)}.wg-btn--filled:active:not([disabled]){background-color:oklch(from var(--btn-color)l c h/30%)}.wg-btn--text{color:var(--btn-color);background-color:#0000}.wg-btn--text:hover:not([disabled]){background-color:oklch(from var(--btn-color)l c h/15%);color:oklch(from var(--btn-color)calc(l - .2)c h)}.wg-btn--text:active:not([disabled]){background-color:oklch(from var(--btn-color)l c h/30%)}.wg-btn--link{color:var(--btn-color);background-color:#0000}.wg-btn--link:hover:not([disabled]){color:oklch(from var(--btn-color)calc(l - .2)c h)}.wg-btn--link:active:not([disabled]){color:oklch(from var(--btn-color)calc(l - .4)c h)}.wg-btn--primary{--btn-color:var(--primary-color,#2196f3)}.wg-btn--danger{--btn-color:#d93327}.wg-btn:has(.wg-btn__content) .wg-btn__icon{margin-right:5px}
