/* =========================================================
   assets/css/sidebar.css
   Порядок блоков aside.cd-side и мобильные адаптации.
   Все размеры — rem, цвета — токены темы.
   ========================================================= */

/* ------------------------------------------------------------------
   Десктоп: поведение по умолчанию.
   Ссылка «Ещё» в ленте нужна только на телефоне.
   ------------------------------------------------------------------ */
.cd-side-feed__more { display: none; }


/* ------------------------------------------------------------------
   Ж-10: единый стиль заголовков виджетов сайдбара
   (капитель 12px, letter-spacing .08em, var(--mu);
   ссылка «Все … →» справа на одной линии с заголовком).
   ------------------------------------------------------------------ */
.cd-side .cd-side__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem;
}

.cd-side .cd-side__title {
    font-size: .75rem;          /* 12px */
    letter-spacing: .08em;
    color: var(--mu);
}

/* Одинаковые внутренние поля у карточек-виджетов */
.cd-side .cd-indices,
.cd-side .cd-digest {
    padding: 1rem 1.125rem;
}
.cd-side .cd-topcoins-block .cd-side__head {
    padding: 1rem 1.125rem .5rem;
}


/* ------------------------------------------------------------------
   Ж-9: на странице статьи последний виджет сайдбара — липкий
   (десктоп ≥ 64rem), чтобы правая колонка не пустела.
   ------------------------------------------------------------------ */
@media (min-width: 64rem) {
    .single .cd-side { align-self: stretch; }
    .single .cd-side > :last-child {
        position: sticky;
        top: 72px;
    }
}


/* ==================================================================
   Мобильный брейкпоинт: колонка падает под контент (< 64rem).
   ================================================================== */
@media (max-width: 63.9375rem) {

    /* --- Flex-колонка для управления порядком --- */
    .cd-side {
        display: flex;
        flex-direction: column;
        margin-top: var(--sp-4);    /* В-18: отступ от основной колонки */
    }

    /* Базовый order = 50: неизвестные прямые потомки
       (виджеты «На этой неделе» и «Сказано и сбылось»)
       встают между «Дайджестом» и «Свежее | Популярное». */
    .cd-side > * { order: 50; }

    /* --- Явный порядок по ТЗ п. 1.8 --- */
    .cd-side > .cd-side__block--indices   { order: 10; }
    .cd-side > .cd-side__block--tools     { order: 20; }
    .cd-side > .cd-side__block--digest    { order: 30; }
    .cd-side > .cd-side__block--week      { order: 40; }
    .cd-side > .cd-side__block--forecasts { order: 45; }
    .cd-side > .cd-side__block--feed      { order: 60; }
    .cd-side > .cd-side__block--tags,
    .cd-side > .cd-side__block--neighbors,
    .cd-side > .cd-side__block--related   { order: 70; }

    /* --- Топ монет на телефоне скрыт (есть полоса курсов) --- */
    .cd-side > .cd-side__block--topcoins { display: none; }

    /* --------------------------------------------------------------
       Инструменты на телефоне — горизонтальная лента со свайпом
       -------------------------------------------------------------- */
    .cd-side__block--tools .cd-tools {
        display: flex;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: .5rem;
        margin-inline: -1rem;
        padding-inline: 1rem;
        padding-block-end: .25rem;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 1rem;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .cd-side__block--tools .cd-tools::-webkit-scrollbar { display: none; }

    /* Все плитки — в один ряд; крайняя обрезается по краю экрана. */
    .cd-side__block--tools .cd-tools__item {
        flex: 0 0 auto;
        width: 7rem;
        scroll-snap-align: start;
        scroll-snap-stop: always;
    }

    /* На телефоне подпись «все 9» / «все N» не показываем. */
    .cd-side__block--tools .cd-side__more { display: none; }

    /* --------------------------------------------------------------
       «Свежее | Популярное» на телефоне — без внутренней прокрутки
       -------------------------------------------------------------- */
    .cd-side-feed,
    .cd-side-feed .cd-tabs__panel {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }

    /* Показываем первые 8 позиций активной вкладки */
    .cd-side-feed .cd-side-feed__item:nth-child(n+9) { display: none; }

    /* И ссылку «Ещё» — на ленту */
    .cd-side-feed__more {
        display: block;
        margin-top: .5rem;
        font-size: .875rem;
        line-height: 1.4;
        color: var(--mu);
        text-decoration: none;
    }
    .cd-side-feed__more:hover,
    .cd-side-feed__more:focus-visible { color: var(--tx); }
}


/* ------------------------------------------------------------------
   Небольшая подстройка «Статей по теме» и соседних меток,
   чтобы новые блоки визуально не отличались от «Свежее» и «Меток».
   ------------------------------------------------------------------ */
.cd-side__block--related .cd-related {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}
.cd-side__block--related .cd-side-feed__item { text-decoration: none; }
.cd-side__block--related .cd-side-feed__meta,
.cd-side__block--related .cd-side-feed__date {
    font-size: .8125rem;
    color: var(--mu);
}

/* Ж-9: липкий последний виджет работает, только если сама колонка тянется на всю высоту статьи
   (у .cd-layout стоит align-items: start — колонка была высотой со своё содержимое, «прилипать» было некуда). */
@media (min-width: 1024px) {
  .single .cd-layout > .cd-side { align-self: stretch; }
}
