button{text-transform:capitalize}button.primary{color:#fff;background:#7161f5;background:radial-gradient(at center bottom,rgb(199.2142857143,192.9285714286,251.0714285714),#7161f5);box-shadow:0 6px 16px rgba(113,97,245,.3);border:1px solid rgba(113,97,245,.1);position:relative;overflow:hidden}button.primary:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(199.2142857143,192.9285714286,251.0714285714),transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}button.primary:hover:after{left:100%}button.secondary,button.transparent:hover{color:#fff;background:#3d3dab;background:radial-gradient(at center bottom,rgb(125.275862069,125.275862069,208.724137931),#3d3dab);box-shadow:0 6px 16px rgba(61,61,171,.3);border:1px solid rgba(61,61,171,.1);position:relative;overflow:hidden}button.secondary:after,button.transparent:hover:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(125.275862069,125.275862069,208.724137931),transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}button.secondary:hover:after,button.transparent:hover:after{left:100%}button.success{color:#fff;background:#198754;background:radial-gradient(at center bottom,rgb(45.75,216.25,137.2),#198754);box-shadow:0 6px 16px rgba(25,135,84,.3);border:1px solid rgba(25,135,84,.1);position:relative;overflow:hidden}button.success:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(45.75,216.25,137.2),transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}button.success:hover:after{left:100%}button.warning{color:#1d1d1d;background:#f7b500;background:radial-gradient(at center bottom,rgb(255,211.979757085,94),#f7b500);box-shadow:0 6px 16px rgba(247,181,0,.3);border:1px solid rgba(247,181,0,.1);position:relative;overflow:hidden}button.warning:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(255,211.979757085,94),transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}button.warning:hover:after{left:100%}button.danger{color:#fff;background:#d32f2f;background:radial-gradient(at center bottom,rgb(228.8095238095,131.1904761905,131.1904761905),#d32f2f);box-shadow:0 6px 16px rgba(211,47,47,.3);border:1px solid rgba(211,47,47,.1);position:relative;overflow:hidden}button.danger:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(228.8095238095,131.1904761905,131.1904761905),transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}button.danger:hover:after{left:100%}.dark button.default{color:#fff;background:radial-gradient(at center bottom,#585858,#252525);box-shadow:0 6px 16px rgba(71,71,71,.3);border:1px solid rgba(174,174,174,.1);position:relative;overflow:hidden}.dark button.default:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,#7a7a7a,transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}.dark button.default:hover:after{left:100%}.light button.default{color:#1d1d1d;background:radial-gradient(at center bottom,hsl(0,0%,120%),#EFEFEF);box-shadow:0 6px 16px rgba(174,174,174,.3);border:1px solid rgba(60,60,60,.1);position:relative;overflow:hidden}.light button.default:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,#e1e1e1,transparent);opacity:.5;transform:skewX(-15deg);transition:left .3s ease-out;z-index:0}.light button.default:hover:after{left:100%}button.transparent{background:rgba(0,0,0,0);border:1px solid rgba(0,0,0,0);transition:background 1s ease-in-out,color .3s}button.disabled{color:#1d1d1d;background:#aeaeae;background:radial-gradient(at center bottom,#e1e1e1,#aeaeae);box-shadow:0 6px 16px rgba(174,174,174,.3);border:1px solid rgba(174,174,174,.1);pointer-events:none}