/**
 * Стили для страниц документации (только разметка страницы).
 * Контент документа — polygon-doc/paCore/styles-padocs.css.
 */

/* === Documentation Page Layout === */
.documentation-page,
.documentation-page__layout {
    min-height: calc(100vh - 80px);
}

.documentation-page {
    max-width: 1920px;
    margin: 0 auto;
    width: 100%;
    background: var(--color-grey-250);
}

body.docs-page {
    background: var(--color-grey-250);
}

/* doc-content-with-toc заполняет высоту до подвала */
body.docs-page .site-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

body.docs-page .documentation-page {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

body.docs-page .documentation-page__layout {
    flex: 1;
    display: flex;
    flex-direction: row;
    min-height: 0;
}

.documentation-page__content {
    position: relative;
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    background: var(--color-grey-250);
}

/* === Контент + TOC колонка === */
.doc-content-with-toc {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    flex: 1;
    min-height: 0;
}

/* Блок обратной связи — на всю ширину под контентом */
.doc-feedback-block-wrapper {
    flex: 1 1 100%;
    width: 100%;
    min-width: 100%;
}

.doc-html-container {
    flex: 1;
    min-width: 0;
    background: #fff;
}

.doc-iframe {
    display: block;
    width: 100%;
    max-width: 100%;
    border: 0;
}

/* === TOC колонка: sticky + фиксированный блок сверху === */
.doc-toc-column {
    flex-shrink: 0;
    width: 304px;
    background: var(--grey-0, #FFF);
    display: flex;
    flex-direction: column;
}

/* Фиксированный блок над sticky — высота синхронизируется с #head в iframe (JS),
 * fallback 154px; цвет как у шапки документа */
.doc-toc-nav-header-fill {
    height: var(--doc-toc-header-fill-height, 154px);
    background: var(--green-200, #D8DFDF);
    z-index: 10;
}

.doc-toc-nav-anchor {
    position: sticky;
    top: 80px;
    padding: 48px 24px 48px 0;
    display: flex;
    flex-direction: column;
    gap: 96px;
    pointer-events: none;
}

.doc-toc-nav-anchor .share-block-wrapper,
.doc-toc-nav-anchor .toc-nav {
    pointer-events: auto;
}

@media (max-width: 1280px) {
    .doc-toc-column,
    .doc-toc-nav-header-fill {
        display: none;
    }
    .doc-html-container {
        flex: 1 1 100%;
        min-width: 100%;
    }
}

/* === Mobile layout (≤1000px) === */
@media (max-width: 1000px) {
    .documentation-page__layout {
        flex-direction: column;
    }

    .documentation-page {
        padding: 0;
    }
}