/* Torkzt · catalog_footline.css — нижняя строка карточки в каталоге.
 *
 * Было: статус просмотра — отдельная метка в левом нижнем углу постера,
 * счётчик раздач — в правом. Два острова на разной высоте, взгляд метался
 * между ними, а на узких карточках они ещё и налезали друг на друга.
 *
 * Стало: один ряд по низу постера. Статус слева, счётчик справа, общая
 * тёмная подложка на всю ширину — она же читаемо отделяет обе метки от
 * пёстрого постера.
 *
 * Подключать ПОСЛЕ основного css каталога: правила ниже перебивают
 * абсолютное позиционирование .cat-status и .cat-torrents.
 */

.cat-poster .cat-footline {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 20px 8px 7px;

    /* градиент, а не сплошная плашка: низ постера темнеет плавно,
       и обрезанное изображение не выглядит обрубленным */
    background: linear-gradient(to top, rgba(0, 0, 0, .78) 40%, rgba(0, 0, 0, 0));
    pointer-events: none;
}

/* ── статус просмотра ── */

.cat-poster .cat-footline .cat-status {
    /* сбрасываем абсолютное позиционирование из основного css:
       внутри ряда метка обычный flex-элемент */
    position: static;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    border-radius: 7px;

    /* Иконки статусов теперь белые. Цветные заливки под каждый статус
       спорили с постером: на светлой афише жёлтый «Смотрю» пропадал,
       на тёмной терялся синий. Белое на полупрозрачном чёрном читается
       на любом постере одинаково, а какой именно статус — видно по
       самой иконке и подсказке. */
    background: rgba(255, 255, 255, .16);
    color: #fff;
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    box-shadow: none;
}

.cat-poster .cat-footline .cat-status svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

/* ── счётчик раздач ── */

.cat-poster .cat-footline .cat-torrents {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 0 0 0 auto;

    flex: 0 0 auto;
    padding: 4px 9px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .16);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
}

/* Раздел в общем поиске — над строкой, чтобы не толкать её локтями */
.cat-poster .cat-section {
    bottom: 40px;
}

@media (max-width: 575px) {
    .cat-poster .cat-footline { padding: 16px 6px 6px; gap: 6px; }
    .cat-poster .cat-footline .cat-status { width: 22px; height: 22px; border-radius: 6px; }
    .cat-poster .cat-footline .cat-status svg { width: 13px; height: 13px; }
    .cat-poster .cat-footline .cat-torrents { padding: 3px 7px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
    .cat-poster .cat-footline { transition: none; }
}