I don’t understand why the background colour of the scrollbar doesn’t change. The colour of the slider itself changes, but the background does not. Instead, the background is grainy (you can see on the screenshot). I also noticed that behind the rounded edges of the slider you can see the outlines of the background, which I thought I had set. Now for clarity I put green and noticed that the grainy background also got a slight green tint, I put red background – slight red tint. I suspect that I am editing a parameter that is really responsible for the background, but most likely something is preventing it from working the way I want it to.

Program screenshot
Structure of program

I put the styles into the parent element main_frame. Here are the styles themselves:

QScrollBar:vertical {
    border: none;
    background: green; /* вот этот параметр я редактирую */
    width: 40px;
    margin: 15px 0 15px 0;
    border-radius: 0px;
}

/*  HANDLE BAR VERTICAL */
QScrollBar::handle:vertical {
    background-color: rgb(80, 80, 122);
    min-height: 30px;
    border-radius: 20px;
}
QScrollBar::handle:vertical:hover{
    background-color: rgb(255, 0, 127);
}
QScrollBar::handle:vertical:pressed {
    background-color: rgb(185, 0, 92);
}

/* BTN TOP - SCROLLBAR */
QScrollBar::sub-line:vertical {
    border: none;
    background-color: rgb(59, 59, 90);
    height: 15px;
    border-top-left-radius: 7px;
    border-top-right-radius: 20px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}
QScrollBar::sub-line:vertical:hover { 
    background-color: rgb(255, 0, 127);
}
QScrollBar::sub-line:vertical:pressed {
    background-color: rgb(185, 0, 92);
}

/* BTN BOTTOM - SCROLLBAR */
QScrollBar::add-line:vertical {
    border: none;
    background-color: rgb(59, 59, 90);
    height: 15px;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}
QScrollBar::add-line:vertical:hover { 
    background-color: rgb(255, 0, 127);
}

Also on the screenshot I marked with number “2” another thing I want to remove: a thin strip between the scrollbar background and the arrows of this scrollbar. I suspect this is a consequence of the same problem, though.

No idea what I’m doing wrong, would love some help!