/**
 * Светлая тема раздела «Новости» — прокрутка и базовые переопределения.
 * Подключать после header.css на всех страницах /news/*
 */
html.theme-light {
    --news-scrollbar-track: #eef2f7;
    --news-scrollbar-thumb: #cbd5e1;
    --news-scrollbar-thumb-hover: #94a3b8;

    scrollbar-width: thin;
    scrollbar-color: var(--news-scrollbar-thumb) var(--news-scrollbar-track);
}

html.theme-light ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

html.theme-light ::-webkit-scrollbar-track {
    background: var(--news-scrollbar-track);
}

html.theme-light ::-webkit-scrollbar-thumb {
    background-color: var(--news-scrollbar-thumb);
    border: 2px solid var(--news-scrollbar-track);
    border-radius: 8px;
    background-clip: padding-box;
}

html.theme-light ::-webkit-scrollbar-thumb:hover {
    background-color: var(--news-scrollbar-thumb-hover);
}

html.theme-light ::-webkit-scrollbar-corner {
    background: var(--news-scrollbar-track);
}

.page-news {
    color-scheme: light;
}

/* Внутренние скролл-области наследуют светлую палитру */
.page-news .categories-wrapper,
.page-news .recommendation-list,
.page-news .crypto-rows-container {
    scrollbar-width: thin;
    scrollbar-color: var(--news-scrollbar-thumb) var(--news-scrollbar-track);
}

.page-news .categories-wrapper::-webkit-scrollbar,
.page-news .recommendation-list::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.page-news .categories-wrapper::-webkit-scrollbar-track,
.page-news .recommendation-list::-webkit-scrollbar-track {
    background: var(--news-scrollbar-track);
    border-radius: 3px;
}

.page-news .categories-wrapper::-webkit-scrollbar-thumb,
.page-news .recommendation-list::-webkit-scrollbar-thumb {
    background: var(--news-scrollbar-thumb);
    border-radius: 3px;
}

.page-news .categories-wrapper::-webkit-scrollbar-thumb:hover,
.page-news .recommendation-list::-webkit-scrollbar-thumb:hover {
    background: var(--news-scrollbar-thumb-hover);
}

@media (max-width: 768px) {
    .page-news .container {
        padding-inline: 16px;
    }

    .page-news .blok-1 {
        height: 68px;
    }
}
