@charset "UTF-8"; /*# The coding page CSS */
/**
 * =============================================================================
 * @encoding UTF-8
 * @author [Zerohold](//zerohold.sd1.su)
 * @project [Telega FM](//telega.fm)
 * @summary Основные стили главной страницы
 * @created 2025-10
 * @modified 2026-02
 *
 * @file D:/controls-psr/sdqa.ru/cdn.sdqa.ru/css/mobile.css
 * @link https://cdn.telega.fm/css/mobile.css
 *
 * @remarks
 * - Адаптивный дизайн для мобильных устройств
 * - Стили для главной страницы с лентой постов
 * - Использование `@media (max-width: 768px)` внутри файла избыточно, так как сам файл подключается по этому условию.
 * @todo Перенести сюда все стили из `D:\controls-psr\sdqa.ru\cdn.sdqa.ru\css\styles-project-mobile-telega.css`, которые не входят в стандарт `D:\controls-psr\sdproc.com\cdn.sdproc.com\css\styles-standard-project-mobile.css`. `styles-project-mobile-telega.css` - это должна быть автономная копия `styles-project-mobile.css` (количество строк должно совпасть по итогу), так как копируется только с другим название и все изменения будут всегда затираться. Действуй по принципу: с начало добавляй, потом удаляй.
 * =============================================================================
 */

body
{
  padding-top: 100px !important;
}

main
{
  flex-direction: column;
  gap: var(--spacing-md);
  padding: 0 var(--spacing-sm);
}

.header-container
{
  padding: 0 16px;
}

.header-title-main
{
  font-size: 18px;
}

.header-subtitle
{
  font-size: 11px;
}

.header-actions
{
  gap: 4px;
}

.header-btn
{
  width: 36px;
  height: 36px;
}

.post-card,
.post-card-full
{
  width: 390px;
  padding: 10px;
}

.pagination__pages
{
  flex-wrap: wrap;
}

.pagination__page_next
{
  width: 100%;
  margin-right: 0;
}

/* Панель выбора ленты (Feeders) */
.feeders
{
  position: relative;
  top: 0;

  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 48px;
  min-height: auto;
  overflow-x: auto;
  overflow-y: hidden;
}

/* Контейнер для табов внутри feeders */
.feeders-tabs-container
{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  min-width: max-content;
  padding-top: 0;
}

/* Обычные ссылки */
.feeders .feeders-tab
{
  position: relative;

  display: flex;
  align-items: center;
  width: auto;
  height: 100%;
  padding: 0 12px;
  box-sizing: border-box;
  border-left: none;
  border-bottom: 3px solid transparent;
  white-space: nowrap;

  font-size: 14px;
  font-weight: 500;
  color: var(--text-meta);
  text-decoration: none;

  transition: color 0.2s;
}

.feeders .active
{
  border-left-color: transparent;
  border-bottom-color: rgb(0, 150, 235);
}