/* ==========================================================================
   Просмотр PDF-каталога — /products/view/ (Figma 1783:8426).
   Шапка 92px + PDF во весь оставшийся экран на сером фоне макета.
   ========================================================================== */

/* Страница не скроллится сама — скроллится просмотрщик внутри фрейма,
   иначе получаются две полосы прокрутки одна в другой. */
html, body.pdfview { height: 100%; }
body.pdfview { margin: 0; display: flex; flex-direction: column; overflow: hidden; background: #696767; }

/* --- Шапка --- */
.pdfhead { flex: 0 0 auto; height: 92px; background: var(--c-navy-900); color: var(--c-text-light); }
.pdfhead__inner { position: relative; height: 100%; display: flex; align-items: center; gap: 16px; }
.pdfhead__logo img { height: 51px; width: auto; }

/* Бренд MRT — по центру контейнера, как в общей шапке сайта */
.pdfhead__brand {
    position: absolute; left: 50%; top: 0; height: 100%; transform: translateX(-50%);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.pdfhead__brand img { height: 30px; width: auto; }
.pdfhead__slogan { font-size: 16px; line-height: 20px; color: var(--c-white); margin-top: 1px; }

.pdfhead__right { margin-left: auto; display: flex; align-items: center; gap: 16px; }
.pdfhead__contacts { display: flex; flex-direction: column; gap: 2px; }
.pdfhead__contact { display: flex; align-items: center; gap: 8px; font-size: 16px; line-height: 20px; color: var(--c-white); }
.pdfhead__contact img { width: 14px; height: 14px; }
.pdfhead__contact:hover { color: var(--c-accent); }

/* Кнопки в макете ниже обычных (40px против 52px у .btn) */
.pdfhead__btn { height: 40px; padding: 0 24px; font-weight: 400; }

/* --- Область просмотра ---
   Прокручивается .pdfview__pages, а не страница: шапка должна оставаться
   на месте. Раньше на этом месте был iframe со своим скроллом. */
.pdfview__body { flex: 1 1 auto; min-height: 0; position: relative; }

.pdfview__pages {
    /* min-height: 0 обязателен: без него flex-элемент не даёт себя сжать
       ниже содержимого, и колонка из 350 страниц растягивает контейнер на
       всю высоту документа вместо своей полосы прокрутки. */
    height: 100%; min-height: 0; overflow-y: auto; overflow-x: hidden;
    /* Инерционная прокрутка на iOS — без неё листание ощущается ватным */
    -webkit-overflow-scrolling: touch;
    padding: 20px 0; display: flex; flex-direction: column; align-items: center; gap: 20px;
}

/* Контейнер страницы. Пропорции заданы до отрисовки (aspect-ratio из
   pdfview.js), поэтому полоса прокрутки не скачет по мере рендера.
   Тёмная подложка — пока страница не отрисована, видно её. */
.pdfview__page {
    width: 100%; max-width: 1400px; background: #7d7b7b;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .25);
}
.pdfview__page.is-ready { background: #fff; }
.pdfview__page canvas { display: block; width: 100%; height: auto; }

/* --- Состояния --- */
.pdfview__status,
.pdfview__fallback {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    margin: 0; text-align: center; color: var(--c-white);
}
.pdfview__fallback p { margin: 0 0 16px; }

/* Номер страницы — поверх, в правом нижнем углу. pointer-events: none,
   чтобы плашка не перехватывала прокрутку под пальцем. */
.pdfview__counter {
    position: absolute; right: 16px; bottom: 16px; pointer-events: none;
    padding: 6px 12px; border-radius: 20px; font-size: 14px; line-height: 18px;
    background: rgba(0, 0, 0, .6); color: var(--c-white);
}
.pdfview__counter:empty { display: none; }

/* Тост заявки. base.css поднимает его на планшете и телефоне над нижней
   панелью .qlinks, но здесь её нет — прижимаем обратно к низу экрана. */
body.pdfview .site-toast { bottom: 24px; }

/* --- Планшет: слоган и бренд оставляем, контакты убираем --- */
@media (max-width: 1023px) {
    .pdfhead__contacts { display: none; }
}

/* --- Мобильные: центральный бренд мешает кнопкам, прячем его --- */
@media (max-width: 767px) {
    .pdfhead { height: 72px; }
    .pdfhead__brand { display: none; }
    .pdfhead__logo img { height: 40px; }
    .pdfhead__right { gap: 8px; }
    .pdfhead__btn { height: 36px; padding: 0 14px; font-size: 14px; }

    /* Мелкий шрифт в таблицах каталога и так на пределе читаемости —
       поля по бокам не отнимаем, страница во всю ширину экрана */
    .pdfview__pages { padding: 10px 0; gap: 10px; }
    .pdfview__counter { right: 10px; bottom: 10px; font-size: 13px; padding: 5px 10px; }
}

/* Узкие экраны: двум кнопкам рядом с логотипом уже не хватает ширины —
   логотип ужимаем до знака, кнопки укорачиваем. */
@media (max-width: 519px) {
    .pdfhead__inner { gap: 8px; }
    .pdfhead__logo img { height: 32px; }
    .pdfhead__btn { padding: 0 10px; font-size: 13px; }
}