/*
Source - https://stackoverflow.com/a/72511916
Posted by Volomike, modified by community. See post 'Timeline' for change history
Retrieved 2026-02-04, License - CC BY-SA 4.0
*/

BODY::-webkit-scrollbar
{
all:unset;
}

BODY::-webkit-scrollbar-button
{
display:block;
background-color:ButtonFace;
box-shadow:inset 0px 0px 0px 20px rgba(255,255,255,0.3);
height: auto;
width: initial;
background-position: center 5px;
background-size:9px 7px;
image-rendering: pixelated;
background-repeat:no-repeat;
}

BODY::-webkit-scrollbar-button:hover
{
box-shadow:inset 0px 0px 0px 20px rgba(128,128,128,0.5);
}

BODY::-webkit-scrollbar-button:active
{
box-shadow:inset 0px 0px 0px 20px rgba(128,128,128,0.7);
}

BODY::-webkit-scrollbar-button:vertical:start:increment,
BODY::-webkit-scrollbar-button:vertical:end:decrement
{
display:none;
}

BODY::-webkit-scrollbar-button:vertical:decrement
{
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='ButtonText'><polygon points='50,00 0,50 100,50'/></svg>");
}

BODY::-webkit-scrollbar-button:vertical:increment
{
background-position: center 6px;
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='ButtonText'><polygon points='0,0 100,0 50,50'/></svg>");
}

BODY::-webkit-scrollbar-thumb
{
background-color:ButtonFace;
box-shadow:inset 0px 0px 0px 20px rgba(128,128,128,0.3);
border-left:2px solid rgba(255,255,255,0.3);
border-right:2px solid rgba(255,255,255,0.3);
}

BODY::-webkit-scrollbar-thumb:hover
{
box-shadow:inset 0px 0px 0px 20px rgba(128,128,128,0.5);
}

BODY::-webkit-scrollbar-thumb:active
{
box-shadow:inset 0px 0px 0px 20px rgba(128,128,128,0.7);
}

BODY::-webkit-scrollbar-track
{
background-color:ButtonFace;
box-shadow:inset 0px 0px 0px 20px rgba(255,255,255,0.3);
}