/*
 * theme-vars.css — настройки темы Foxiz для arab.az
 * ---------------------------------------------------------------------------
 * В WordPress этот слой генерирует панель настроек темы (Foxiz_Css::output()).
 * У нас WordPress нет, поэтому переменные заданы статически.
 *
 * ВАЖНО: подключать СТРОГО ПОСЛЕ main.css — файл переопределяет :root.
 *
 * Здесь только те переменные, у которых НЕТ дефолта в main.css, плюс фирменные
 * цвета. Всё остальное (≈210 переменных) берётся из :root внутри main.css.
 */

:root {
    /* --- Ширины макета ------------------------------------------------- */
    --rb-width: 1280px;        /* основной контейнер */
    --rb-s-width: 1280px;      /* контейнер страницы новости */
    --rb-small-width: 860px;   /* узкий контейнер */

    /* --- Шапка и логотипы ---------------------------------------------- */
    /* Логотип arab.az вытянутый (пропорция ~6.3:1), поэтому при той же
       высоте он шире типового и перетягивал шапку на себя. */
    --hd-logo-height: 32px;    /* логотип в десктопной шапке */
    --mlogo-height: 26px;      /* логотип в мобильной шапке */
    --mbnav-height: 54px;      /* высота мобильной шапки */
    --flogo-height: 34px;      /* логотип в подвале */

    /* --- Фирменный цвет -------------------------------------------------
     * Взят из логотипа текущего бренда (#e30613). Смена фирменного цвета
     * всего сайта — это одна строка ниже.
     */
    --g-color: #e30613;
    --g-color-90: #e30613e6;

    /* --- Ссылки внутри текста статьи ------------------------------------ */
    --hyperlink-color: var(--g-color);
    --hyperlink-line-color: var(--g-color);

    /* --- Поля форм ------------------------------------------------------ */
    --input-bg: transparent;
    --input-border: rgba(0, 0, 0, .12);

    /* --- Заголовки блоков ----------------------------------------------- */
    --heading-size-desktop: 20px;

    /* --- Плашки рубрик: значения по умолчанию --------------------------- */
    --cat-highlight: var(--g-color);
    --cat-fcolor: #ffffff;
}

[data-theme="dark"],
.light-scheme {
    --input-border: rgba(255, 255, 255, .16);
}

/*
 * Цвета рубрик
 * ---------------------------------------------------------------------------
 * Foxiz красит плашку рубрики через --cat-highlight, применяя её к четырём
 * селекторам: карточка поста (.p-category.category-id-N), плитка рубрики
 * (.term-i-N), блок рубрик (.is-cbox-N) и страница рубрики
 * (body.category-N .blog-content).
 *
 * Все цвета подобраны достаточно тёмными, чтобы белый текст на них читался.
 */

.p-category.category-id-32,  .term-i-32,  .is-cbox-32  { --cat-highlight: #e30613; } /* Baş xəbər */
.p-category.category-id-3086,.term-i-3086,.is-cbox-3086{ --cat-highlight: #c1440e; } /* Şimali Afrika */
.p-category.category-id-2668,.term-i-2668,.is-cbox-2668{ --cat-highlight: #a67c00; } /* Yaxın Şərq */
.p-category.category-id-34,  .term-i-34,  .is-cbox-34  { --cat-highlight: #1d4e89; } /* Siyasət */
.p-category.category-id-38,  .term-i-38,  .is-cbox-38  { --cat-highlight: #4a6fa5; } /* Digər Dövlətlər */
.p-category.category-id-35,  .term-i-35,  .is-cbox-35  { --cat-highlight: #009fe3; } /* Türk Dövlətləri */
.p-category.category-id-36,  .term-i-36,  .is-cbox-36  { --cat-highlight: #00875a; } /* İqtisadiyyat */
.p-category.category-id-39,  .term-i-39,  .is-cbox-39  { --cat-highlight: #7b4bb7; } /* Cəmiyyət */
.p-category.category-id-5954,.term-i-5954,.is-cbox-5954{ --cat-highlight: #d84315; } /* ArabCars */
.p-category.category-id-50,  .term-i-50,  .is-cbox-50  { --cat-highlight: #5e35b1; } /* Yuxuyozma */
.p-category.category-id-33,  .term-i-33,  .is-cbox-33  { --cat-highlight: #37474f; } /* Rəsmi Xronika */
.p-category.category-id-37,  .term-i-37,  .is-cbox-37  { --cat-highlight: #ef6c00; } /* Energetika */
.p-category.category-id-42,  .term-i-42,  .is-cbox-42  { --cat-highlight: #00838f; } /* Bioqrafiya */
.p-category.category-id-43,  .term-i-43,  .is-cbox-43  { --cat-highlight: #0277bd; } /* Nədir */
.p-category.category-id-52,  .term-i-52,  .is-cbox-52  { --cat-highlight: #6d4c41; } /* Tarixdə bu gün */
.p-category.category-id-5952,.term-i-5952,.is-cbox-5952{ --cat-highlight: #4e342e; } /* Hərb tarixi */
.p-category.category-id-221, .term-i-221, .is-cbox-221 { --cat-highlight: #ad1457; } /* Rəy */
.p-category.category-id-5950,.term-i-5950,.is-cbox-5950{ --cat-highlight: #00695c; } /* İslam Ensiklopediyası */
.p-category.category-id-5951,.term-i-5951,.is-cbox-5951{ --cat-highlight: #283593; } /* VOA təhlil mərkəzi */
.p-category.category-id-5967,.term-i-5967,.is-cbox-5967{ --cat-highlight: #f57c00; } /* Arab+ */
.p-category.category-id-5983,.term-i-5983,.is-cbox-5983{ --cat-highlight: #00796b; } /* Körfəz Əməkdaşlıq Şurası */
.p-category.category-id-5984,.term-i-5984,.is-cbox-5984{ --cat-highlight: #0097a7; } /* Ərəb turizmi */

/* Те же цвета — как акцент заголовка на странице самой рубрики */
body.category-32   .blog-content { --heading-sub-color: #e30613; }
body.category-3086 .blog-content { --heading-sub-color: #c1440e; }
body.category-2668 .blog-content { --heading-sub-color: #a67c00; }
body.category-34   .blog-content { --heading-sub-color: #1d4e89; }
body.category-38   .blog-content { --heading-sub-color: #4a6fa5; }
body.category-35   .blog-content { --heading-sub-color: #009fe3; }
body.category-36   .blog-content { --heading-sub-color: #00875a; }
body.category-39   .blog-content { --heading-sub-color: #7b4bb7; }
body.category-5954 .blog-content { --heading-sub-color: #d84315; }
body.category-50   .blog-content { --heading-sub-color: #5e35b1; }
body.category-33   .blog-content { --heading-sub-color: #37474f; }
body.category-37   .blog-content { --heading-sub-color: #ef6c00; }
body.category-42   .blog-content { --heading-sub-color: #00838f; }
body.category-43   .blog-content { --heading-sub-color: #0277bd; }
body.category-52   .blog-content { --heading-sub-color: #6d4c41; }
body.category-5952 .blog-content { --heading-sub-color: #4e342e; }
body.category-221  .blog-content { --heading-sub-color: #ad1457; }
body.category-5950 .blog-content { --heading-sub-color: #00695c; }
body.category-5951 .blog-content { --heading-sub-color: #283593; }
body.category-5967 .blog-content { --heading-sub-color: #f57c00; }
body.category-5983 .blog-content { --heading-sub-color: #00796b; }
body.category-5984 .blog-content { --heading-sub-color: #0097a7; }

/*
 * Арабская версия (RTL)
 * ---------------------------------------------------------------------------
 * Вместо main.css подключается rtl.css (полная зеркальная копия), а этот файл
 * остаётся тем же. Здесь — только правки, специфичные для арабского:
 * другое семейство шрифтов и увеличенная межстрочная высота, потому что
 * арабская вязь требует больше воздуха, чем латиница.
 */
html[lang="ar"] {
    --body-family: "Tajawal", "Noto Kufi Arabic", sans-serif;
    --h1-family: "Tajawal", "Noto Kufi Arabic", sans-serif;
    --h2-family: var(--h1-family);
    --h3-family: var(--h1-family);
    --h4-family: var(--h1-family);
    --h5-family: var(--h1-family);
    --h6-family: var(--h1-family);
    --headline-family: var(--h1-family);
    --tagline-family: var(--h1-family);
    --heading-family: var(--h1-family);
    --menu-family: var(--h1-family);
    --submenu-family: var(--h1-family);
    --cat-family: var(--h1-family);
    --meta-family: var(--h1-family);
    --excerpt-family: var(--body-family);
    --quote-family: var(--h1-family);

    /* Вязи нужен больший интерлиньяж, а разрядка букв её ломает. */
    --body-fheight: 1.75;
    --body-fspace: 0;
    --h1-fspace: 0;
    --cat-fspace: 0;
    --menu-fspace: 0;
}

/* Латиница, цифры, телефоны и URL внутри арабского текста — оставить LTR. */
html[lang="ar"] .is-ltr,
html[lang="ar"] code,
html[lang="ar"] kbd,
html[lang="ar"] samp,
html[lang="ar"] input[type="email"],
html[lang="ar"] input[type="url"],
html[lang="ar"] input[type="tel"],
html[lang="ar"] input[type="password"] {
    direction: ltr;
    unicode-bidi: isolate;
    text-align: left;
}

/*
 * Рекламные слоты-заглушки
 * ---------------------------------------------------------------------------
 * Баннеры со старого сайта не переносились. До появления реальной рекламы
 * слот рисуется пустым прямоугольником нужных пропорций, чтобы макет держал
 * вертикальный ритм и было видно, куда встанет блок.
 * Когда реклама появится — достаточно убрать класс is-ad-placeholder.
 */
.ad-wrap {
    margin-bottom: var(--bottom-spacing, 35px);
}

.ad-wrap .ad-inner {
    margin: 0 auto;
}

.is-ad-placeholder .ad-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    border: 1px dashed var(--flex-gray-15, rgba(0, 0, 0, .15));
    border-radius: var(--round-5, 5px);
    background: var(--flex-gray-7, rgba(0, 0, 0, .04));
}

.is-ad-placeholder .ad-placeholder-label {
    font-family: var(--meta-family, inherit);
    font-size: 12px;
    letter-spacing: .05em;
    color: var(--meta-fcolor, #666);
    opacity: .7;
}

/*
 * Сетка страницы
 * ---------------------------------------------------------------------------
 * .grid-container — родной флекс-ряд Foxiz (main.css), но ширины его колонок
 * в теме генерирует панель настроек, которой у нас нет. Задаём здесь.
 *
 * Классы с префиксом ax- — наши, для внутренних делений главной страницы
 * (в демо их роль играли контейнеры Elementor, чей CSS в тему не входит).
 */
@media (min-width: 1025px) {
    .grid-container > .blog-content { flex: 0 0 72%;  width: 72%; }
    .grid-container > .sidebar-wrap { flex: 0 0 28%;  width: 28%; }
}

@media (min-width: 768px) {
    .grid-container > .ax-col-50 { flex: 0 0 50%;      width: 50%; }
    .grid-container > .ax-col-33 { flex: 0 0 33.333%;  width: 33.333%; }
    .grid-container > .ax-col-66 { flex: 0 0 66.666%;  width: 66.666%; }
    /* Единственная уцелевшая колонка ряда занимает всю ширину, а не треть. */
    .grid-container > .ax-col-100 { flex: 0 0 100%;     width: 100%; }
}

/* Сайдбар едет вместе со страницей до конца своей колонки. */
@media (min-width: 1025px) {
    .sidebar-wrap .sidebar-sticky {
        position: sticky;
        top: calc(var(--nav-height, 60px) + 20px);
    }
}

/*
 * Ритм главной страницы
 * ---------------------------------------------------------------------------
 * Штатные 35px между блоками рассчитаны на воздушные демо с малым числом
 * блоков. У нас плотный новостной портал: на такой странице тот же отступ
 * читается как дыра. Убавляем шаг и внутри блока, и между секциями.
 */
.blog-wrap .block-inner {
    row-gap: 22px;
}

/*
 * Шкала вертикальных интервалов главной.
 *
 * Три уровня, чтобы взгляд сразу отличал «другой материал в том же блоке»
 * от «новая секция»:
 *   между карточками внутри блока      — 22px (row-gap у .block-inner)
 *   между блоками внутри одной колонки — 26px
 *   между секциями                     — 64px
 *
 * Секции разделены заметно сильнее блоков: раньше разница была всего
 * 30 против 26, и колонки следующей секции читались как продолжение
 * предыдущей. На узких экранах шаг убавляется — там лишний воздух
 * превращается в лишнюю прокрутку.
 */
.ax-section {
    margin-bottom: 64px;
}

@media (max-width: 1024px) {
    .ax-section { margin-bottom: 48px; }
}

@media (max-width: 767px) {
    .ax-section { margin-bottom: 36px; }
}

/* Последней секции отбивка от подвала не нужна — её задаёт сам .blog-wrap. */
.blog-wrap > .ax-section:last-child {
    margin-bottom: 0;
}

/* Колонки не растягиваются друг под друга: каждая заканчивается своим контентом. */
.grid-container {
    align-items: flex-start;
}

/* Заголовок секции не должен висеть далеко от своего блока. */
.blog-wrap .block-h {
    margin-bottom: 14px;
}

/*
 * Страница новости
 * ---------------------------------------------------------------------------
 * Ширины колонок статьи в main.css отсутствуют — их, как и на архиве,
 * генерировала панель настроек темы.
 */
@media (min-width: 1025px) {
    .grid-container > .s-ct          { flex: 0 0 68%; width: 68%; }
    .grid-container > .single-sidebar { flex: 0 0 32%; width: 32%; }
}

/* Галерея материала: сетка миниатюр под текстом. */
.entry-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    margin: var(--bottom-spacing, 35px) 0;
}
.entry-gallery img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    border-radius: var(--round-3, 3px);
}

/*
 * Заголовок блока со ссылкой «все материалы»
 * ---------------------------------------------------------------------------
 * У Foxiz заголовок блока — это только .block-h > .heading-inner > .heading-title;
 * ссылки «ещё» в теме нет. Для новостного портала она нужна, поэтому оформляем
 * сами: заголовок слева, ссылка прижата вправо на той же строке.
 * Без этого ссылка вставала отдельной строкой и рвала вертикальный ритм.
 */
.blog-wrap .block-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.block-more-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    font-family: var(--meta-family);
    font-size: var(--rem-mini, .8rem);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--meta-fcolor);
    transition: color var(--effect, .25s) var(--timing, ease);
}

.block-more-link:hover { color: var(--g-color); }
.block-more-link i     { font-size: .85em; }

/*
 * Врезка со связанной новостью в теле статьи
 * ---------------------------------------------------------------------------
 * Её вставляет parse_news_links() на место маркера ##id##.
 *
 * Было: узкая карточка float:left шириной 34% с рамкой в один пиксель и
 * заголовком 15px при тексте статьи 21px. Заголовок мельче окружающего текста
 * читался как подпись к фотографии, а не как ссылка на другой материал;
 * при нескольких врезках подряд они слипались в колонку у левого поля.
 *
 * Стало: полоса во всю ширину колонки — фото слева, справа сплошная плашка
 * фирменным цветом с ярлыком и заголовком в белом. Ровно так эти врезки
 * устроены на действующем arab.az. Заголовок набран не мельче текста статьи.
 */
.news-inline {
    clear: both;
    margin: 30px 0;
}

.news-inline__link {
    display: flex;
    align-items: stretch;
    text-decoration: none;
    overflow: hidden;
    border-radius: var(--round-3, 3px);
}

.news-inline__media {
    flex: 0 0 40%;
    max-width: 40%;
    align-self: stretch;
    background: var(--flex-gray-7);
}

.news-inline__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 100%;
    object-fit: cover;
}

/*
 * Плашка. Цвет фирменный, поэтому текст на ней всегда белый и НЕ зависит
 * от светлой или тёмной темы — переключение темы её не трогает.
 */
.news-inline__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 22px 26px;
    background: var(--g-color);
    color: #fff;
}

.news-inline__label {
    display: block;
    font-family: var(--meta-family, var(--body-family));
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .75;
}

/*
 * Кегль заголовка равен кеглю текста статьи (--body-fsize), а не меньше его:
 * в этом и была причина «жидкости». Вес — жирный, чтобы врезка держала вес
 * рядом с абзацем.
 */
.news-inline__title {
    display: block;
    font-family: var(--h4-family, var(--body-family));
    font-size: var(--body-fsize, 21px);
    line-height: 1.3;
    font-weight: 700;
    color: #fff;
}

/* Без изображения плашка занимает всю ширину. */
.news-inline--plain .news-inline__body { padding: 24px 28px; }

.news-inline__link:hover .news-inline__body { filter: brightness(1.12); }

@media (max-width: 767px) {
    .news-inline { margin: 24px 0; }
    .news-inline__link { display: block; }
    .news-inline__media,
    .news-inline__media img { max-width: 100%; flex: none; height: auto; min-height: 0; }
    .news-inline__media { display: block; }
    .news-inline__body { padding: 18px 20px; }
    .news-inline__title { font-size: 19px; }
}

/*
 * Хлебные крошки на тёмной подложке шапки статьи.
 * --bcrumb-color в теме без значения по умолчанию, из-за чего крошки
 * наследовали тёмный цвет и почти сливались с фоном.
 */
:root { --bcrumb-color: var(--meta-fcolor); }

.light-scheme .breadcrumb-inner,
.light-scheme .breadcrumb-inner a {
    color: #ffffffb3;
}

.light-scheme .breadcrumb-inner a:hover { color: #fff; }

/* Разделитель между крошками — в теме его рисует плагин, которого у нас нет. */
.s-breadcrumb .breadcrumb-inner span + span:before {
    content: "/";
    margin: 0 7px;
    opacity: .45;
}

/* Шапка архива: у нас в ней только заголовок, столько воздуха ей не нужно. */
.archive-header.category-header-1 .archive-inner {
    padding-top: 26px;
    padding-bottom: 26px;
}

/*
 * Заглушка рекламы не должна читаться как дыра в макете: пока реальной
 * рекламы нет, это едва заметная рамка без заливки, а не серый прямоугольник.
 */
.is-ad-placeholder .ad-inner {
    background: none;
    border-color: var(--flex-gray-7);
    opacity: .55;
}

.is-ad-placeholder .ad-placeholder-label {
    font-size: 11px;
    opacity: .5;
}

/*
 * Заголовок встроенной карточки не должен краситься как ссылка в тексте.
 * У темы правило `.rbct a:where(...)` — :where() специфичности не добавляет,
 * поэтому селектор весит (0,1,1) и перебивал одноклассовый .news-inline__title.
 * Поднимаем вес до (0,2,1), не прибегая к !important.
 */
.rbct a.news-inline__link,
.rbct a.news-inline__link:hover {
    color: inherit;
    text-decoration: none;
    background: none;
    border: 0;
}

.rbct .news-inline .news-inline__title,
.rbct a.news-inline__link:hover .news-inline__title { color: #fff; }

/*
 * Отступы между блоками
 * ---------------------------------------------------------------------------
 * У .block-wrap в теме нет собственного margin: в демо блоки разделяли
 * контейнеры Elementor. Без них соседние блоки в колонке слипаются —
 * дата лида упирается в заголовок следующего материала. Задаём сами.
 */
.blog-wrap .block-wrap {
    margin-bottom: 26px;
}

.blog-wrap .block-wrap:last-child {
    margin-bottom: 0;
}

/* Заголовок секции прижат к своему блоку, но отбит от предыдущего. */
.blog-wrap .block-wrap + .block-h {
    margin-top: 30px;
}

/*
 * Заглушки рекламы
 * ---------------------------------------------------------------------------
 * Прошлый вариант вышел слишком бледным: не читались ни форма, ни размер.
 * Возвращаем различимую рамку и подпись, но фон оставляем лёгким, чтобы
 * пустой слот не выглядел провалом в макете.
 */
.is-ad-placeholder .ad-inner {
    background: var(--flex-gray-7);
    border: 1px dashed var(--flex-gray-40, rgba(136, 136, 136, .55));
    opacity: 1;
    position: relative;
}

.is-ad-placeholder .ad-placeholder-label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .08em;
    color: var(--meta-fcolor);
    opacity: .85;
}

/*
 * Длинные названия рубрик в узкой колонке не должны наезжать на ссылку
 * «все материалы»: заголовку разрешаем сжиматься, ссылка остаётся целой.
 *
 * ВАЖНО: обрезка вешается на внутренний <span>, а НЕ на .heading-title.
 * У layout-1 полоски по бокам рисуются псевдоэлементом .heading-title:after,
 * который спозиционирован абсолютно и наклонён skewX(-15deg) — часть его
 * выходит за границы элемента. overflow:hidden на самом заголовке срезает
 * эти полоски, а подмена inline-flex на block ломает их привязку.
 */
.blog-wrap .block-h .heading-inner {
    min-width: 0;
}

.blog-wrap .block-h .heading-title {
    max-width: 100%;
    min-width: 0;
}

.blog-wrap .block-h .heading-title > span {
    display: block;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* В узких колонках подпись ссылки прячем, оставляя стрелку. */
@media (max-width: 1200px) {
    .ax-col-33 .block-more-link span { display: none; }
}

/*
 * Обрезка анонса в карточках
 * ---------------------------------------------------------------------------
 * Тема задаёт анонс селектором `.p-wrap .entry-summary` весом (0,2,0), поэтому
 * одноклассовое правило по .p-excerpt не срабатывало и анонсы росли до шести
 * строк. Из-за этого соседние колонки расходились по высоте и внизу страницы
 * оставались пустоты. Ограничиваем число строк с достаточным весом.
 */
.p-wrap .entry-summary.p-excerpt {
    /* column-count из темы делает элемент многоколоночным, а такой элемент
       не может быть -webkit-box — без сброса обрезка молча игнорируется. */
    column-count: initial;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* В узких колонках лид держим совсем коротким — так колонки сходятся ровнее. */
.ax-col-33 .p-wrap .entry-summary.p-excerpt,
.ax-col-50 .p-wrap .entry-summary.p-excerpt,
.sidebar-wrap .p-wrap .entry-summary.p-excerpt {
    -webkit-line-clamp: 3;
}

/*
 * Переключатель языков
 * ---------------------------------------------------------------------------
 * В теме его нет (в WordPress эту роль играет плагин перевода), поэтому
 * оформляем сами, в стилистике остальных элементов шапки.
 */
.ax-lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.ax-lang {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 24px;
    padding: 0 7px;
    border-radius: var(--round-3, 3px);
    font-family: var(--meta-family);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--nav-color);
    opacity: .65;
    transition: opacity var(--effect, .25s) var(--timing, ease),
                background-color var(--effect, .25s) var(--timing, ease);
}

.ax-lang:hover { opacity: 1; }

.ax-lang.is-current {
    background-color: var(--g-color);
    color: var(--awhite, #fff);
    opacity: 1;
}

/*
 * Одиночная кнопка листания
 * ---------------------------------------------------------------------------
 * Правила темы `.pagination-simple .older:first-child { margin-left: auto }`
 * и `.newer:last-child { margin-right: auto }` рассчитаны на пару кнопок:
 * «назад» слева, «вперёд» справа. На первой и последней странице кнопка
 * остаётся одна и уезжает к краю. Класс is-single ставит шаблон.
 */
.pagination-simple.is-single {
    justify-content: center;
}

.pagination-simple.is-single .older:first-child,
.pagination-simple.is-single .newer:last-child {
    margin-right: 0;
    margin-left: 0;
    padding-right: 10px;
    padding-left: 10px;
}

/*
 * Главная картинка материала
 * ---------------------------------------------------------------------------
 * По умолчанию тема растягивает её на всю ширину контейнера статьи (1280px).
 * Наши оригиналы обычно 700–900px, то есть картинку ещё и увеличивают сверх
 * её размера: она выходит и громоздкой, и мягкой. Ограничиваем шириной
 * текстовой колонки — растягивания больше нет, кроп не применяется,
 * поэтому ничего не срезается (для новостей это важно: композицию кадра
 * редакция не контролирует).
 */
:root {
    --s-feat-width: 860px;
}

.single-standard-2 .s-feat {
    max-width: var(--s-feat-width);
    margin-right: auto;
    margin-left: auto;
}

/*
 * «Похожие материалы» внутри текстовой колонки.
 * Отбивка сверху заметная: блок начинает новый смысловой раздел после
 * тела статьи, а не продолжает его.
 */
.single-inline-related {
    margin-top: 34px;
}

.single-inline-related .block-h {
    margin-bottom: 16px;
}

/* Размер в заглушке рекламы — техническая запись, в RTL её нельзя разворачивать. */
.is-ad-placeholder .ad-placeholder-label {
    direction: ltr;
    unicode-bidi: isolate;
}

/*
 * Теги под статьёй
 * ---------------------------------------------------------------------------
 * Тема даёт только раскладку (.efoot-bar — строка с переносом), а сами ссылки
 * остаются обычным текстом. Оформляем их «плашками»: так список из полутора
 * десятков тегов читается как набор меток, а не как сплошная строка ссылок.
 */
.tag-bar { align-items: center; gap: 8px; }

.tag-bar { gap: 10px; }

.tag-bar .blabel {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--meta-color, #6a6a6a);
    white-space: nowrap;
}

.tag-bar a[rel="tag"] {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    border: 1px solid var(--flex-gray-color, #e2e2e2);
    border-radius: var(--round-3, 3px);
    /*
     * 15px, а не 13px: рядом текст статьи в 21px, и на его фоне мелкие плашки
     * читались как служебная сноска. Тема ограничивает потомков .efoot-bar
     * правилом `font-size: min(14px, 1em)`, поэтому кегль задаём явно.
     */
    font-size: 15px;
    line-height: 1.45;
    color: var(--body-color, #2b2b2b);
    background-color: transparent;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.tag-bar a[rel="tag"]:hover {
    color: #fff;
    border-color: var(--g-color, #e30613);
    background-color: var(--g-color, #e30613);
}

/*
 * Кнопка «наверх» СВОИХ СТИЛЕЙ НЕ ТРЕБУЕТ: в теме они есть под
 * идентификатором #back-top, вместе с состоянием .scroll-btn-visible.
 * (Я сперва искал их по классу .go-to-top — его я выдумал сам, когда
 * переносил разметку, и решил, что стилей нет. Свой блок только мешал.)
 * От плагина зависит только показ при прокрутке — его делает скрипт
 * в templates-foxiz/footer.tpl.php.
 */

/*
 * Рекламные места: свой формат для телефона, лишний вариант прячется.
 * Селектор с двумя классами обязателен: правило `.is-ad-placeholder .ad-inner`
 * задаёт `display: flex` тем же весом, и с одним классом оно выигрывало.
 */
.is-ad-placeholder .ad-mobile,
.is-ad-placeholder .ad-tablet { display: none; }

/*
 * Десктопный вариант прячем ТОЛЬКО если для этого экрана задан свой формат
 * (классы has-ad-tablet / has-ad-mobile ставит шаблон). Без этой оговорки
 * место, у которого есть мобильный формат, но нет планшетного, пропадало
 * на планшете целиком — прятался десктопный, а показывать было нечего.
 */
@media (min-width: 768px) and (max-width: 1024px) {
    .is-ad-placeholder.has-ad-tablet .ad-desktop { display: none; }
    .is-ad-placeholder.has-ad-tablet .ad-tablet { display: flex; }
}

@media (max-width: 767px) {
    .is-ad-placeholder.has-ad-mobile .ad-desktop,
    .is-ad-placeholder.has-ad-mobile .ad-tablet { display: none; }
    .is-ad-placeholder.has-ad-mobile .ad-mobile { display: flex; }
    /* Планшетный вариант на телефоне не нужен, даже если мобильного нет. */
    .is-ad-placeholder:not(.has-ad-mobile) .ad-tablet { display: none; }
}

/* Выключение слота на отдельных экранах — флаги mobile/tablet из реестра. */
@media (max-width: 767px) {
    .ad-no-mobile { display: none; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .ad-no-tablet { display: none; }
}

/*
 * Собственный баннер на незанятом рекламном месте
 * ---------------------------------------------------------------------------
 * Раньше пустой слот был пунктирной рамкой с подписью «300×600». Читателю это
 * показывало недоделанный сайт, поэтому место занимает наш баннер: логотип и
 * «здесь может быть ваша реклама» на языке страницы, со ссылкой на контакты.
 *
 * Раскладка выбирается по ФОРМЕ коробки, а не по ширине экрана: у одного слота
 * десктопный вариант может быть башней 300×600, а мобильный — полоской 320×100.
 * Класс формы проставляет шаблон blocks/ad_slot.tpl.php.
 *
 * Логотип двумя картинками с data-mode — переключение светлой и тёмной темы
 * делает main.css, свои правила показа тут не нужны.
 */
.is-ad-placeholder .ad-inner.ad-house {
    padding: 10px;
    overflow: hidden;
    background: var(--flex-gray-7);
    /* Рамка сплошная и тонкая: пунктир читается как «место не доделано». */
    border: 1px solid var(--flex-gray-15, rgba(0, 0, 0, .12));
    border-radius: var(--round-5, 5px);
}

.ad-house__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    width: 100%;
    height: 100%;
    text-align: center;
    text-decoration: none;
    color: inherit;
}

a.ad-house__link:hover .ad-house__cta {
    text-decoration: underline;
}

.ad-house__logo {
    display: block;
    flex: 0 0 auto;
    width: auto;
    max-width: 40%;
}

.ad-house__body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.ad-house__title {
    font-family: var(--meta-family, inherit);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--meta-fcolor, #666);
    opacity: .8;
}

.ad-house__text {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
    color: var(--body-fcolor, #1a1a1a);
}

.ad-house__cta {
    font-family: var(--meta-family, inherit);
    font-size: 12px;
    font-weight: 600;
    color: var(--g-color);
}

/* Башня 300×600: всё столбиком, логотип крупный. */
.ad-house.is-tall .ad-house__link { flex-direction: column; gap: 24px; }
.ad-house.is-tall .ad-house__logo { height: 130px; max-width: 75%; }
.ad-house.is-tall .ad-house__text { font-size: 19px; }
.ad-house.is-tall .ad-house__body { gap: 6px; }

/* Квадрат 300×250 и 970×250: столбиком, логотип поменьше. */
.ad-house.is-box .ad-house__link { flex-direction: column; gap: 12px; }
.ad-house.is-box .ad-house__logo { height: 64px; max-width: 60%; }

/* Полоса 970×90, 728×90, 320×100: в строку, высоты на столбик нет. */
.ad-house.is-wide .ad-house__link { flex-direction: row; gap: 16px; }
.ad-house.is-wide .ad-house__logo { height: 46px; }
.ad-house.is-wide .ad-house__body { text-align: start; gap: 2px; }
.ad-house.is-wide .ad-house__title { font-size: 10px; letter-spacing: .1em; }
.ad-house.is-wide .ad-house__text { font-size: 14px; }

/* Узкая полоса на телефоне: подпись-призыв уже не помещается. */
@media (max-width: 480px) {
    .ad-house.is-wide .ad-house__logo { height: 38px; }
    .ad-house.is-wide .ad-house__text { font-size: 13px; }
    .ad-house.is-wide .ad-house__cta { display: none; }
}

/*
 * Живой баннер: картинка из реестра ads.conf.php
 * ---------------------------------------------------------------------------
 * Никакой рамки и фона — место занимает сам файл. Ширина задана в разметке
 * точным размером картинки, max-width ужимает её там, где колонка уже.
 */
.is-ad-live .ad-inner {
    margin: 0 auto;
    max-width: 100%;
}

.is-ad-live .ad-inner img {
    display: block;
    width: 100%;
    height: auto;
}

/*
 * Заглушка, которая показывается ТОЛЬКО на телефоне — на месте, где живой
 * баннер выключен для узких экранов (широкий файл ужимается в полоску).
 */
.ad-only-mobile { display: none; }

@media (max-width: 767px) {
    .ad-only-mobile { display: block; }
}


/*
 * Видео в тексте статьи — всегда во всю ширину и 16:9
 * ---------------------------------------------------------------------------
 * Ролики вставляются редакцией по-разному: у одних заданы ширина и высота
 * атрибутами, у других — инлайновые стили, перенесённые со старого сайта
 * вместе с текстом. Среди них попадался `position: absolute; inset: 0`:
 * высоту в той вёрстке держала обёртка, у нас такого правила нет, обёртка
 * схлопывалась в ноль, и ролик ложился поверх текста.
 *
 * Поэтому приводим к одному виду ЛЮБУЮ вставку с видео, не полагаясь на то,
 * как её вставили. `!important` обязателен: инлайновые стили иначе сильнее.
 * Пропорцию держит aspect-ratio, высоту руками задавать не нужно.
 */
.entry-content iframe[src*="youtube.com"],
.entry-content iframe[src*="youtube-nocookie.com"],
.entry-content iframe[src*="youtu.be"],
.entry-content iframe[src*="vimeo.com"],
.entry-content iframe[src*="dailymotion.com"],
.entry-content iframe[src*="rutube.ru"],
.entry-content iframe[src*="facebook.com/plugins/video"],
.entry-content iframe[style*="absolute"] {
    position: static !important;
    inset: auto !important;
    display: block;
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
    aspect-ratio: 16 / 9;
    margin: 0 0 30px;
    border: 0;
}

/*
 * Обёртка вставки больше ничего не позиционирует и не задаёт высоту —
 * это делает сам ролик. Иначе к его высоте прибавляется её собственная.
 */
.entry-content .wp-block-embed__wrapper,
.entry-content .wp-block-embed {
    position: static !important;
    height: auto !important;
    padding-top: 0 !important;
}
