/* PBM-AUDIT (аудит вёрстки PROBUSINESS.KZ от 19.10.2026): pbm-audit.css — правки по аудиту, подключается из index.php
   после всех стилей. Номера — пункты аудита (_client/audit-PR-22.10/PLAN.md). Все замечания аудита — компьютерная версия;
   правила, которые могли бы задеть телефон, ограничены @media (min-width:1086px). */

/* ---------------------------------------------------------------------------------------------------------
   1.1 Иконки лайк / комментарии / закладки / просмотры / «поделиться» на ПК были PNG 16×15 и т.п. без версии
   для ретины и выглядели пиксельными. Сами файлы (/images/icons/*.png, /images/like.png, /images/repost.png,
   /images/social-icons/2.png) заменены на версии в 4 раза крупнее, отрисованные из иконок макета; здесь закреплён
   прежний размер на экране, чтобы вёрстка не сдвинулась. Специфичность низкая — явные размеры других правил сильнее.
   Адреса в странице идут с ?v=… (pbm_icons_cache_bust() в html/pbm_html.php), поэтому селектор «начинается с».
   12.11.2026 (п.1.4): вместо PNG подставляются SVG по пиксельной сетке (на обычных мониторах PNG «мылился») —
   селекторы ловят оба расширения; большие лайк и «поделиться» на странице материала — ровно 2× малых (32×30, 30×32).
   --------------------------------------------------------------------------------------------------------- */
img[src^="/images/icons/like."]{width:16px;height:15px;}
img[src^="/images/icons/comment."]{width:21px;height:15px;}
img[src^="/images/icons/izbranoe."]{width:14px;height:17px;}
img[src^="/images/icons/eye."]{width:24px;height:14px;}
img[src^="/images/social-icons/2."]{width:15px;height:16px;}
img[src^="/images/like."]{width:32px;height:30px;}
img[src^="/images/repost."]{width:30px;height:32px;}

/* ---------------------------------------------------------------------------------------------------------
   1.2, 2.2, 3.1 Аватар автора: неквадратное фото (например 860×483) вписывалось в круг без обрезки — виднелась
   половина круга или сплюснутый овал (шапка карточки ленты на главной и в «Новостях», большая карточка ленты,
   страница материала; на телефоне — та же карточка). Квадрат, круг и object-fit: cover на всех ширинах.
   --------------------------------------------------------------------------------------------------------- */
.home-news-single__avatar img,
.nf-author-avatar img,
img.item-page__author-avatar-inline{aspect-ratio:1/1!important;height:auto!important;object-fit:cover!important;border-radius:50%!important;}

/* 1.4 Хвостик ярлыка («ВРЕМЯ», «ВОТ ТАК», ::before в template.css) лежал под картинкой: z-index 1 против 2. */
.news-featured.custom-label-yes::before{z-index:2;}

/* 2.3 / 2.5 Пустая лента: одна плашка вверху вкладки вместо системных строк под слайдером (шаблоны blog*.php). */
.pbm-feed-empty{
    flex:1 1 100%;width:100%;box-sizing:border-box;margin:0 0 20px;padding:28px 24px;
    background:#fff;border-radius:10px;box-shadow:0 0 12px rgba(0,0,0,.15);
    font-family:"MuseoSansCyrlPB","MuseoSansCyrl",sans-serif;font-weight:500;font-size:16px;line-height:1.4;color:#6B7280;text-align:center;
    text-wrap:balance;
}
/* пустая колонка маленьких карточек рядом с плашкой занимала зазор 20px — плашка была уже ряда */
.news-grid:has(> .pbm-feed-empty) > .news-medium-list{display:none;}

/* 3.2 Плашка компании на странице материала: высота 59px при скруглении 25px — края не полукруглые. */
.item-page__company a{border-radius:999px;}

@media (max-width:1085px){
/* 1.7 на телефоне анонса нет: по макету большая карточка «Новостей» = мета → заголовок → картинка → реакции
   (без этого правила анонс вставал над заголовком — у мобильной карточки свой порядок блоков). */
.news-featured:not(.news-featured--lenta) .news-featured__intro{display:none;}
}

@media (min-width:1086px){
/* ---------------------------------------------------------------------------------------------------------
   1.3 «Сейчас читают» и другие слайдеры на ПК: обложка была ограничена только max-height:90px — широкие
   картинки выходили ниже соседних, и строки карточек съезжали. Обложка фиксированной высоты (2:1, как в макете).
   --------------------------------------------------------------------------------------------------------- */
.mod-news-slider .mns-img img{height:100px;max-height:none;object-fit:cover;}

/* ---------------------------------------------------------------------------------------------------------
   1.5 Одиночная карточка ленты на главной и в «Новостях»: в анонс печатался весь материал с разметкой — карточка
   вырастала на экран. Шаблон теперь даёт простой текст (pbm_plain_text), здесь — серый, не больше 4 строк.
   --------------------------------------------------------------------------------------------------------- */
.home-news-single:not(.pbm-sr-card) .home-news-single__intro p{
    margin:0;font-family:"MuseoSansCyrlPB","MuseoSansCyrl",sans-serif;font-weight:300;font-size:20px;line-height:1.25;color:#6B7280;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;
}

/* 1.6 Список «в строчку»: дата, иконка и число в одну линию. По вертикали — по центру строки, в т.ч. у двухстрочных
   заголовков (замечания 12.11.2026, п.1.3; в аудите 19.10 было «прижать к низу»). */
.mns-card-list-custom{align-items:center;}
.mns-card-list-custom .list-date{align-items:center;}
.mns-card-list-custom .home-news-single__date{line-height:15px;}
.mns-card-list-custom .btn-comm{display:inline-flex;align-items:center;gap:5px;line-height:15px;}
.mns-card-list-custom .btn-comm img{display:block;}

/* 1.7 Большая карточка «Новостей»: анонс под заголовком (новый блок в шаблоне), кнопки прижаты к низу карточки.
   Карточку растягивает соседняя колонка, а блок текста раньше оставался своей высоты — под кнопками была пустота.
   Теперь блок текста тянется на всю карточку; число строк анонса под свободное место подбирает js/pbm-audit.js. */
.news-featured:not(.news-featured--lenta){display:flex;flex-direction:column;}
.news-featured:not(.news-featured--lenta) > a{flex:none;}
.news-featured:not(.news-featured--lenta) > .futered-content{flex:1 1 auto;}
.news-featured:not(.news-featured--lenta) .futered-content{justify-content:flex-start;}
.news-featured:not(.news-featured--lenta) .futered-content > .actions{margin-top:auto;}
/* у заголовка был запас min-height:109px под 5 строк — из-за него анонс уезжал вниз; кнопки и так прижаты к низу */
.news-featured:not(.news-featured--lenta) .futered-content > h3{min-height:0;padding-bottom:8px;}
.news-featured:not(.news-featured--lenta) .futered-content > .news-featured__intro{
    margin:0 0 14px;padding:0 10px;font-family:"MuseoSansCyrlPB","MuseoSansCyrl",sans-serif;font-weight:300;font-size:12px;line-height:1.35;color:#6B7280;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
}

/* 2.1 Бизнес-лента: колонка маленьких карточек растягивалась на высоту большой (space-between) — между ними было 43px.
   Теперь зазор постоянный 20px, а сами карточки делят высоту большой карточки поровну (12.11.2026: колонка не
   доходила до низа). Не ниже прежних 141px; если карточек мало (2), не больше 180px — тогда остаток снизу. */
.news-home-page.custom.news.custom-lenta .news-medium-list{justify-content:flex-start;gap:20px;}
.news-home-page.custom.news.custom-lenta .news-medium-list > .news-medium{flex:1 1 0;min-height:141px;max-height:180px;}
.news-home-page.custom.news.custom-lenta .news-medium-list > .news-medium > a{align-self:stretch;height:auto!important;}
.news-home-page.custom.news.custom-lenta .news-medium-list > .news-medium > a > img{height:100%!important;min-height:0!important;max-height:none!important;}

/* 2.4 Тени крайних закладок обрезал ряд (overflow:hidden без полей): поля по бокам с отрицательным отступом —
   закладки стоят на прежнем месте, тени помещаются. */
.news-home-page.custom .tabs__nav{padding-left:14px;padding-right:14px;margin-left:-14px;margin-right:-14px;border-radius:0;}
}

/* =========================================================================================================
   ЗАМЕЧАНИЯ 12.11.2026
   ========================================================================================================= */
/* 1.2 Шапка, кнопки «Сообщество» и «Компании»: у кружков-логотипов не было обводки — белые логотипы сливались
   с фоном. Серая обводка (#D1D5DB — чуть темнее контура кнопки, чтобы была видна у белых логотипов), белая подложка под прозрачные PNG; размер 25px прежний. */
.header-avatar-user{box-sizing:border-box;border:1px solid #D1D5DB;background:#fff;}

/* 1.6 Логотип компании в материалах и на странице компании: обводка, чтобы белые логотипы не терялись на белом фоне
   (плашка компании в карточке ленты на главной / в новостях / в поиске, большая карточка ленты, страница материала,
   кабинет, страница компании). Кольцо тенью снаружи — размеры и вёрстка не меняются; цвет как у кружков шапки (1.2). */
.home-news-single__company-icon,
.nf-company-logo,
.item-page__company img.company-image,
img.account-company__logo,
.company-logo-card__img img{box-shadow:0 0 0 1px #D1D5DB!important;background-color:#fff;}
@media (max-width:1085px){
/* на телефоне у логотипа на странице компании своя рамка (mobile-company.css) — второе кольцо не нужно */
body.pbm.pbm-page-company .company-logo-card__img img{box-shadow:none!important;}
}

/* 1.7 Заглушка поста без обложки по макету (/images/blogs/no_image_post.svg подставляет pbm_html.php): картинка
   заполняет блок обложки целиком, лист по центру. Старое правило mobile.css (scale-down на сером) было для тёмной PNG. */
img[src*="/images/blogs/no_image_post.svg"]{object-fit:cover!important;object-position:center!important;background:#D0CACB!important;}

@media (max-width:1085px){
/* 1.2 (телефон) Главная: закладки «Популярное / Новое / Все» на 20px ниже табов «Новости / Бизнес-лента» (было 10px,
   правило в mobile-home.css, п.6) — блок с карточками не липнет к шапке с закладками. */
body.pbm.pbm-home .news-home-page.custom .vkladki-custom.blog > ul.tabs__nav,
body.pbm.pbm-home .news-home-page.custom .vkladki-custom.lenta > ul.tabs__nav{margin-top:20px;}
}

/* 1.5 Обложка на странице материала — целиком, в своих пропорциях, как на главной (было: рамка 440px на ПК и 388:252
   на телефоне с обрезкой краёв). Очень высокие (вертикальные) картинки ограничены 700px и вписываются без обрезки. */
.article-main-image img{height:auto!important;max-height:700px!important;aspect-ratio:auto!important;object-fit:contain!important;}

/* 1.2 (лента, подрубрики) Страница рубрики ленты (/blogs/<рубрика>): кнопки подрубрик и «Все категории» в одну строку.
   Старое правило template.css тянуло слайды на 100% (по 82px) — «Все категории» переносилось на 2 строки. Здесь ряд
   кнопок по ширине текста; если подрубрик станет много — ряд переносится целиком. Только ПК, телефон — свои «чипсы». */
@media (min-width:1086px){
.news-cat-slider.lenta.podcategoriya .slick-list{width:auto!important;overflow:visible!important;}
.news-cat-slider.lenta.podcategoriya .slick-track{display:flex!important;flex-wrap:wrap;column-gap:30px;row-gap:6px;width:auto!important;transform:none!important;}
.news-cat-slider.lenta.podcategoriya .slick-track::before,.news-cat-slider.lenta.podcategoriya .slick-track::after{display:none!important;}
.news-cat-slider.lenta.podcategoriya .slick-slide{width:auto!important;float:none!important;}
.news-cat-slider.lenta.podcategoriya .slick-slide.slick-cloned{display:none!important;}
.news-cat-slider.lenta.podcategoriya .slick-arrow{display:none!important;}
.news-cat-slider.lenta.podcategoriya .item-title a{white-space:nowrap;}
}

/* 1.1 (Qazaq Product) Надпись «Qazaq Product» рядом с логотипом-юртой — шрифтом логотипа Uni Sans (UniSans-Trial-Bold,
   как кнопка в шапке): кнопка-фильтр на странице компаний (ПК и телефон) и пункт мобильного меню. Жирность — самого
   начертания, без искусственного утолщения. */
.pbm-qz .pbm-qz__text,
.pbm-drawer__list a:has(img[src*="qazaq-product-icon"]),
.pbm-drawer__list a:has(img[src*="/pq."]){font-family:"UniSans-Trial-Bold",sans-serif!important;font-weight:400!important;}

/* 1.1 (лайк/закладка) Размер иконок не прыгает при нажатии: js/pbm-likes.js меняет картинку на закрашенную синюю SVG
   со своим размером (лайк 32×30 на странице материала становился 15×15). Размер задан по кнопке, а не по файлу.
   Закладка на странице материала (whisper.png 26×33, растр) заменена на векторную whisper.svg (подставляет pbm_html.php). */
img[src^="/images/whisper."]{width:28px;height:34px;}
.btn-like img{width:16px;height:15px;}
.btn-fav img{width:14px;height:17px;}
.article-stats__actions .btn-like img{width:32px;height:30px;}
.article-stats__actions .btn-fav img{width:28px;height:34px;}

/* 1.5 (текст публикаций) На ПК текст статьи задан тонким (300), но шрифтом MuseoSansCyrl, у которого на сайте одно
   начертание (500) — браузер брал его, и текст выходил жирным. Семейство MuseoSansCyrlPB (css/mobile.css) содержит
   настоящие 100/300/500/700 — текст статьи им, жирность как задана (300 — обычный текст, 700 — жирный). */
.article-body,.article-body p,.article-body li,.article-body ul,.article-body ol,.article-body span,.article-body div,.article-body td,.article-body blockquote,.article-body h1,.article-body h2,.article-body h3,.article-body h4,.article-body h5,.article-body h6,.article-body strong,.article-body b,.article-body em,.article-body i,.article-body a{font-family:"MuseoSansCyrlPB","MuseoSansCyrl",sans-serif!important;}

/* 1.6 Карусели карточек (.mns-slider: «Подобранно специально для вас», «Сейчас читают» и др.): контейнер — флекс-ряд,
   и лента слайдера (.slick-list) сжималась до ширины содержимого. При 1–2 материалах slick считал карточки от узкой
   ленты — по 79px, заголовки обрезались. Лента во всю ширину блока, карточки обычной ширины и прижаты влево. */
.mns-slider > .slick-list{flex:1 1 auto;width:100%;min-width:0;}
.mns-slider .slick-track{margin-left:0;}

/* 1.1 (добавить пост) Крестик очистки обложки стоял над картинкой (float:right) — теперь поверх картинки в её правом
   верхнем углу, как в макете; блок превью по ширине картинки. ПК и телефон. */
.page-add-post__introfile-preview{position:relative;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto;}
.page-add-post__introfile-preview-img{display:block;max-width:100%;height:auto;}
.page-add-post .page-add-post__introfile-remove,body.pbm.pbm-page-add-post .page-add-post__introfile-remove{position:absolute;top:10px;right:10px;z-index:2;float:none;margin:0;padding:0;width:28px;height:28px;line-height:26px;font-size:20px;text-align:center;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.15);}

/* Страницы-материалы с макетом page (html/com_content/article/page.php): «Публичная оферта», «Правила» и т.п. */
.pbm-static-page__title{margin:0 0 20px!important;font-family:"MuseoSansCyrlPB","MuseoSansCyrl",sans-serif!important;font-weight:700!important;font-size:32px!important;line-height:1.2!important;color:#1E1E1E!important;}
.pbm-static-page__body,.pbm-static-page__body p{font-size:18px;line-height:1.5;font-weight:300;color:#1E1E1E;}
.pbm-static-page__body p{margin:0 0 14px;}
@media (max-width:1085px){
/* на телефоне заголовок уже в шапке страницы (стрелка «назад» + название) — второй не нужен */
.pbm-static-page__title{display:none!important;}
.pbm-static-page__body,.pbm-static-page__body p{font-size:15px;}
}