/* ==========================================================================
   MOBILE-AUDIT-1 — дефекты мобильной версии, найденные аудитом 30.09.2026.

   Задача: «Прежде чем мы сделаем приложение Андроид, надо идеально отработать
   HTML мобильную версию». Здесь ТОЛЬКО дефекты, найденные замером; дизайн не
   переделывается.

   Подключается ПОСЛЕДНИМ из мобильных файлов (см. вставку в *.tpl сразу после
   последней ссылки на mobile*.css), поэтому при равной специфичности его
   правила сильнее правил mobile.css / mobile_afisha.css / mobile_places.css /
   mobile_photos.css / mobile_cabinet.css / mobile_admin.css / mobile_search_v2.css.

   Что чиним (числа — замер _clubber/_ma2_audit.py на локальном стенде):
     1. «Расширение вьюпорта»: у форума и рекламы минимальная ширина содержимого
        была 639 и 798 px при экране 390. Chrome расширял layout viewport
        (window.innerWidth 639 → визуальный масштаб 0.61) и зумил страницу,
        отчего кегль на экране падал до 7–10 px, а справа оставалась полоса
        прокрутки 249 и 408 px. Правим причину — таблицы с неразрывной шириной
        и боковую колонку форума 270 px.
     2. Кегль: 76 пар «селектор · кегль» мельче 14 px (1324 элемента на 32
        страницах). Поднимаем ровно те, что найдены замером.
     3. Зоны нажатия: 1084 элемента меньше 44 px. Поднимаем кнопки, иконки,
        пагинаторы, ссылки в таблицах — то, во что человек попадает пальцем.
     4. Таблицы шире экрана: форумные и рекламные — `table-layout: fixed`.

   НЕ трогаем (по заданию — файлы идущих задач): переписку (user/message.php,
   smarty/templates/user/pm/*) и старые CSS настроек — поэтому селекторы
   .cb-set-*, .sgray_div, .gray_div, .cb-persona-*, .pm-* сюда не входят,
   найденные там дефекты вынесены в таблицу аудита как «ждёт решения».
   ========================================================================== */

@media (max-width: 1024px) {
  /* страховка для планшета: ничего не шире экрана */
  .wrapper, #main_cont { max-width: 100%; }
}

@media (max-width: 768px) {

  /* ======================================================================
     1. ВЬЮПОРТ БОЛЬШЕ НЕ РАСШИРЯЕТСЯ
     ====================================================================== */

  /* --- 1.1 Форум --------------------------------------------------------
     `.forum-layout` был `display: table` с боковой колонкой 270 px, а внутри
     основного столбца лежит `table.forum-table` с неразрывной минимальной
     шириной (заголовки колонок «Ответов/Просмотров/Последний» + отступы).
     Вдвоём они давали минимальную ширину 629–639 px: на экране 390 Chrome
     расширял layout viewport до 639 и зумил страницу до 0.61.
     Замер (_ma2_wide.py, /forum/topic.php?id=11): innerWidth 639 → 390,
     contentWidth 639 → 390, переполнение 249 → 0.
     Основной столбец ставим первым, боковую панель — под ним. */
  #forum .forum-layout {
    display: flex; flex-direction: column; width: 100%; max-width: 100%;
  }
  #forum .forum-main,
  #forum .forum-side {
    display: block; width: 100%; max-width: 100%;
    min-width: 0; padding-right: 0;
  }
  #forum .forum-main { order: 1; }
  #forum .forum-side { order: 2; margin-top: 26px; }

  /* таблица форума: фиксированная раскладка — колонки считаются от ширины
     контейнера, а не от содержимого. Ширины в шаблоне заданы ВНУТРИ строки
     (`style="width:90px"`), поэтому перебиваем их только через !important.
     Колонки: последние три узкие (их имена одинаковы в обеих таблицах),
     первая нечисловая (заголовок раздела/темы) забирает остаток —
     в таблице тем это ~164 px, в оглавлении форума ~186 px.
     Значок статуса (только в таблице тем, 5 колонок) — 22 px через :has();
     браузер без :has() просто отдаст этой колонке равную долю, вёрстка
     от этого не поедет, только заголовок станет чуть уже. */
  #forum .forum-table {
    table-layout: fixed !important; width: 100% !important; max-width: 100% !important;
  }
  #forum .forum-table thead th:nth-last-child(1) { width: 88px !important; }
  #forum .forum-table thead th:nth-last-child(2) { width: 42px !important; }
  #forum .forum-table thead th:nth-last-child(3) { width: 46px !important; }
  #forum .forum-table thead tr:has(> th:nth-child(5)) > th:nth-child(1) {
    width: 22px !important;
  }
  /* в таблице тем третья с конца колонка — это автор (имя, а не число) */
  #forum .forum-table thead tr:has(> th:nth-child(5)) > th:nth-last-child(3) {
    width: 66px !important;
  }
  #forum .forum-table th,
  #forum .forum-table td {
    padding: 5px 3px; word-break: break-word; overflow-wrap: anywhere;
  }
  #forum .forum-theme-title { word-break: break-word; overflow-wrap: anywhere; }

  /* --- 1.2 Реклама ------------------------------------------------------
     `table.cb-adv-table` (787 px) и `table.cb-adv-busy` (506 px) давали
     минимальную ширину 798 px при экране 390 (зум 0.49, кегль на экране 5–6 px,
     переполнение 408 px). Замер: innerWidth 798 → 390, переполнение 408 → 0. */
  #reklama table.cb-adv-table,
  #reklama table.cb-adv-busy {
    table-layout: fixed; width: 100%; max-width: 100%;
  }
  #reklama table th,
  #reklama table td {
    padding: 6px 4px; word-break: break-word; overflow-wrap: anywhere;
  }
  #reklama select, #reklama input[type="text"], #reklama textarea { max-width: 100%; }

  /* --- 1.3 Ничего не шире экрана на остальных страницах ------------------ */
  table { max-width: 100%; }

  /* ======================================================================
     2. КЕГЛЬ НЕ МЕЛЬЧЕ 14 px
     ====================================================================== */

  /* нижняя панель навигации: подписи были 13 px (154 элемента) */
  #cbMobileNav a { font-size: 14px; }

  /* --- 2.1 Афиша -------------------------------------------------------- */
  #poster .event-item-author { font-size: 14px; }
  #poster .cb-type-ribbon-count { font-size: 14px; }

  /* --- 2.2 Форум -------------------------------------------------------- */
  #forum .forum-theme-pages a,
  #forum .forum-theme-pages span { font-size: 15px; }
  #forum .forum-theme-info { font-size: 14px; }
  #forum .forum-last-date { font-size: 14px; }
  #forum .forum-feed-text,
  #forum .forum-feed-text a { font-size: 14px; }
  #forum .forum-feed-date { font-size: 14px; }
  #forum .forum-filter-row label { font-size: 14px; }

  /* --- 2.3 Музыка ------------------------------------------------------- */
  .music-track-type-name,
  .music-track-type > span,
  .music-track-date { font-size: 14px; }

  /* --- 2.4 Поиск -------------------------------------------------------- */
  .cb-srch-item-type,
  .cb-srch-item-own { font-size: 14px; }
  .cb-srch-item-sub { font-size: 14px; }
  .cb-srch-block-all { font-size: 14px; }

  /* --- 2.5 Персоны и коллективы ----------------------------------------- */
  .cb-person-ribbon-count { font-size: 14px; }
  .cb-collective-meta > span,
  .cb-collective-members-cnt { font-size: 14px; }
  .cb-collective-style, .cb-collective-link { font-size: 14px; }
  .cb-collective-leader-badge,
  .cb-collective-member-role { font-size: 14px; }
  .cb-cf-row > label { font-size: 14px; }
  .cb-cover-type { font-size: 14px; }

  /* --- 2.6 Вход, регистрация, восстановление ---------------------------- */
  .auth-label, .auth-choice-note, .auth-subtitle, .auth-remember > span,
  .auth-hint, .auth-hint a, .auth-links > a,
  .auth-consent-text, .auth-consent-text > a,
  .auth-consent-all, .auth-consent-editions { font-size: 14px; }

  /* --- 2.7 Правовые документы ------------------------------------------- */
  .legal-top, .legal-toc-meta, .legal-others-meta { font-size: 14px; }
  .legal-toc-link { font-size: 15px; }

  /* --- 2.8 Реклама ------------------------------------------------------ */
  #reklama table th, #reklama table td { font-size: 14px; }
  .cb-adv-busy-free, .cb-adv-btn, .cb-adv-muted, .cb-adv-card-where,
  .cb-adv-card-size, .cb-adv-card-cpm, .cb-adv-field-label,
  .cb-adv-figure-num, .cb-adv-figure-text, .cb-adv-calc-note,
  .cb-adv-note, .cb-adv-thumb { font-size: 14px; }

  /* --- 2.9 Карточка события, заведение, главная ------------------------- */
  .event-header-author > span { font-size: 14px; }
  .live-place-rules > a { font-size: 14px; }
  .cb-sec-search-btn { font-size: 14px; }
  .cb-noimg { font-size: 14px; }
  .cb-shr-title { font-size: 14px; }
  .cb-own-line-text, .cb-own-line-link, .cb-own-note, .cb-own-btn { font-size: 14px; }
  .cb-hl { font-size: 14px; }

  /* --- 2.10 Кабинет персоны (левое меню, лента) -------------------------- */
  .cb-av-nav-text, .cb-av-nav-guest, .cb-av-nav-all { font-size: 14px; }
  .cb-raise-invite-text, .cb-raise-invite-btn { font-size: 14px; }
  .cb-act-note { font-size: 14px; }

  /* ======================================================================
     3. ЗОНЫ НАЖАТИЯ НЕ МЕНЬШЕ 44 px
     Ссылка-обёртка вокруг картинки считается по картинке (замер
     _ma2_audit.py: effective box), поэтому .cb-event-link здесь нет.
     ====================================================================== */

  /* --- 3.1 Общее: иконки и ссылки-строки -------------------------------- */
  .cb-shr-item { min-width: 44px; min-height: 44px; }
  .cb-fav-heart { min-width: 44px; min-height: 44px; }
  .breadcrumbs-item { display: inline-flex; align-items: center; min-height: 44px; }
  .paginator-div a, .paginator-div span { min-width: 44px; min-height: 44px; }
  .paginator-div a, .paginator-div span {
    display: inline-flex; align-items: center; justify-content: center;
  }
  .music-paginator a { min-width: 44px; min-height: 44px; }
  .music-paginator a { display: inline-flex; align-items: center; justify-content: center; }
  .music-track-song { display: inline-flex; align-items: center; min-height: 44px; }
  .puzzle-item-title { display: inline-flex; align-items: center; min-height: 44px; }
  .table-places-item-name a { display: inline-flex; align-items: center; min-height: 44px; }
  .info-cnt-rang-stars-item { min-width: 44px; min-height: 44px; }
  .info-cnt-rang-stars-item { display: inline-flex; align-items: center; justify-content: center; }

  /* --- 3.2 Форум -------------------------------------------------------- */
  #forum .forum-theme-pages a {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px;
  }
  #forum a.forum-last-login { display: inline-flex; align-items: center; min-height: 44px; }
  #forum .forum-feed-ava a {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px;
  }
  #forum .forum-feed-text a { display: inline-flex; align-items: center; min-height: 44px; }
  #forum .forum-table td a { display: inline-flex; align-items: center; min-height: 44px; }
  #forum .forum-box-list a { display: flex; align-items: center; min-height: 44px; }
  #forum .forum-theme-title a { display: inline-flex; align-items: center; min-height: 44px; }

  /* --- 3.3 Вход и восстановление доступа -------------------------------- */
  .auth-choice { display: inline-flex; align-items: center; min-height: 44px; }
  .auth-links > a, .auth-hint > a { display: inline-flex; align-items: center; min-height: 44px; }
  .auth-consent-line { display: flex; align-items: center; min-height: 44px; }
  .auth-consent-all, .auth-consent-editions {
    display: inline-flex; align-items: center; min-height: 44px;
  }

  /* --- 3.4 Правовые документы ------------------------------------------- */
  .legal-top { display: inline-flex; align-items: center; min-height: 44px; }
  .legal-toc-link { display: inline-flex; align-items: center; min-height: 44px; }

  /* --- 3.5 Реклама ------------------------------------------------------ */
  #reklama .cb-adv-btn { min-height: 44px; display: inline-flex; align-items: center; }
  #reklama table td a { display: inline-flex; align-items: center; min-height: 44px; }

  /* --- 3.6 Поиск, персоны, альбомы -------------------------------------- */
  .cb-srch-item-title { min-height: 44px; }
  .cb-person-ribbon-item { min-height: 44px; }
  .user-profile-counter-value a {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px;
  }

  /* --- 3.7 Кабинет персоны ---------------------------------------------- */
  #cbNewsFeed a.cb-nw-name,
  .cb-nw-name { display: inline-flex; align-items: center; min-height: 44px; }
  #cbNewsFeed button#cbNwFilterBtn,
  #cbNewsFeed button#cbNwSearchBtn,
  #cbNewsFeed button.cb-nw-send { min-height: 44px; }
  .cb-raise-invite-btn { display: inline-flex; align-items: center; min-height: 44px; }
  .cb-av-nav-guest { display: inline-flex; align-items: center; min-height: 44px; }
  .fr-filter-item.cb-pr-filter-item { display: inline-flex; align-items: center; min-height: 44px; }
  .cb-act-face-find > a, .cb-act-face-pending > a {
    display: inline-flex; align-items: center; min-height: 44px;
  }

  /* ======================================================================
     4. ПЕРЕПОЛНЕНИЕ И ОБРЕЗАННЫЙ ТЕКСТ
     ====================================================================== */
  /* длинные слова и ссылки не должны растягивать страницу */
  .cb-srch-item-title, .cb-srch-item-sub, .event-item-title,
  .forum-theme-title, .news-item-title { overflow-wrap: anywhere; }

  /* ======================================================================
     5. ВТОРОЙ ПРОХОД (по повторному замеру): то, что первый проход не закрыл
     ====================================================================== */

  /* --- 5.1 Кегль, который перебивал инлайновый <style> шаблона -----------
     В poster_v2.tpl лежит <style>#poster .event-item-author{font-size:11px}</style>
     прямо в теле страницы: при равной специфичности он сильнее подключаемого
     файла (файл в <head>, правило в <body>). Отсюда !important — это ровно тот
     случай, для которого он и предназначен (см. такой же приём в mobile.css). */
  #poster .event-item-author { font-size: 14px !important; }
  #poster .cb-noimg { font-size: 14px !important; }
  /* auth_v2.css: `.auth-hint.darkgray-col` и `.auth-page .auth-subtitle` —
     два класса против одного, поэтому тот же приём: поднимаем специфичность */
  .auth-page .auth-subtitle,
  .auth-page .auth-hint,
  .auth-page .auth-hint a,
  .auth-page .auth-remember > span { font-size: 14px; }
  /* music_v2.css: `.music-track-info .music-track-date` — два класса против одного */
  .music-track-info .music-track-date,
  .music-track-info .music-track-type-name,
  .music-track-type > span { font-size: 14px; }
  .cb-cover-type { font-size: 14px !important; }
  .cb-collective-form label, .cb-side-body label, .cb-side-cnt label { font-size: 14px; }

  /* --- 5.2 Зоны нажатия: кнопки, фильтры, пагинаторы -------------------- */
  #poster .filter-panel-item {
    display: inline-flex; align-items: center; min-height: 44px;
  }
  .cb-sec-search-btn { min-height: 44px; }
  .cb-date-ribbon-item { min-width: 44px; }
  .cb-type-ribbon-item { min-width: 44px; }
  .cb-collective-link { display: inline-flex; align-items: center; min-height: 44px; }
  .cb-own-line-link { display: inline-flex; align-items: center; min-height: 44px; }
  .cb-srch-block-all, .cb-srch-block-title, .cb-srch-citylink {
    display: inline-flex; align-items: center; min-height: 44px;
  }
  .music-filter select, .music-filter input, .music-filter button,
  .music-filter label, input.music-filter-submit, a.btn-slide {
    min-height: 44px;
  }
  .music-filter select { min-width: 44px; }
  .info-cnt-title-type, .cb-side-cnt a.yellow-col, .cb-side-cnt a.ml20 {
    display: inline-flex; align-items: center; min-height: 44px;
  }
  .cb-fav-heart-card, .cb-shr-item { display: inline-flex; align-items: center; justify-content: center; }
  #forum .forum-filter-row label {
    display: flex; align-items: center; min-height: 44px;
  }

  /* --- 5.3 Реклама: 4 px внутреннего переполнения таблицы месяцев ------- */
  #reklama .cb-adv-table th,
  #reklama .cb-adv-table td { padding: 5px 2px; }

}
