Scrollable tabs wrongly styled

[majkers]

Describe the bug

When we use scrollable tabs styles are added to :

.p-tablist-tab-list {
    position: relative;
    display: flex;
    background: ${dt('tabs.tablist.background')};
    border-style: solid;
    border-color: ${dt('tabs.tablist.border.color')};
    border-width: ${dt('tabs.tablist.border.width')};
}

but when we scroll it, this div is not visible and all the styles are gone... IMHO one of parents of this div ie. the one with classes:

p-tablist-content p-tablist-viewport

should have tokens too.

Have a look at demo:

I set var --p-tabs-tablist-background to red. And initially it is ok

but after scrolling to right red background is gone:

Pull Request Link

No response

Reason for not contributing a PR

• Lack of time
• Unsure how to implement the fix/feature
• Difficulty understanding the codebase
• Other

Other Reason

No response

Reproducer

https://primeng.org/tabs

Environment

Primeng demo page

Angular version

19.1.7

PrimeNG version

v19

Node version

n/a

Browser(s)

all

Steps to reproduce the behavior

1. Go to https://primeng.org/tabs
2. Go to scrollable section
3. Change var --p-tabs-tablist-background to red eg
4. Scroll tabs to right

Expected behavior

Background should stay red