/* Base button */

.quantum-scroll-top{

position:fixed;
text-align:center;
cursor:pointer;
opacity:0;
pointer-events:none;
z-index:9999;
transition:all .3s ease;

}

/* Hover effect */

.quantum-scroll-top:hover{
opacity:.85;
transform:translateY(-2px);
}

/* Positions */

.bottom-right{
bottom:40px;
right:40px;
}

.bottom-left{
bottom:40px;
left:40px;
}

.top-right{
top:40px;
right:40px;
}

.top-left{
top:40px;
left:40px;
}



/* Visible */

.quantum-scroll-top.qst-show{
opacity:1;
transform:translateY(0);
}

/* Fade */

.quantum-scroll-top[data-animation="fade"]{
transform:none;
}

/* Slide */

.quantum-scroll-top[data-animation="slide"]{
transform:translateY(40px);
}

.quantum-scroll-top[data-animation="slide"].qst-show{
transform:translateY(0);
}

/* Scale */

.quantum-scroll-top[data-animation="scale"]{
transform:scale(.6);
}

.quantum-scroll-top[data-animation="scale"].qst-show{
transform:scale(1);
}

/* Visible state */

.quantum-scroll-top.qst-show{
opacity:1;
transform:translateY(0);
}

/* Fade */

.quantum-scroll-top[data-animation="fade"]{
transform:none;
}

/* Slide */

.quantum-scroll-top[data-animation="slide"]{
transform:translateY(40px);
}

.quantum-scroll-top[data-animation="slide"].qst-show{
transform:translateY(0);
}

/* Scale */

.quantum-scroll-top[data-animation="scale"]{
transform:scale(.6);
}

.quantum-scroll-top[data-animation="scale"].qst-show{
transform:scale(1);
}
.quantum-scroll-top::before{

content:"";
position:absolute;
inset:0;
border-radius:inherit;

background:conic-gradient(
rgba(255,255,255,0.9) var(--qst-progress),
rgba(255,255,255,0.15) var(--qst-progress)
);

mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0);

pointer-events:none;

}