/**
 * Public content pages — isolated layout (docs, modules, telegram api, contacts).
 * Only new classes; no changes to global .container / .wrapper / .content.
 * Centered content, balanced width, aligned with header/footer.
 */

:root {
    --public-page-max: 1180px;
}

/* Main full width so shell can center the container (override page-compositions; no global styles) */
body.dashboard-ui.page-layout--public-docs .aifo-public-main.public-page-main,
body.dashboard-ui.page-layout--public-info .aifo-public-main.public-page-main,
body.dashboard-ui.page-layout--public-article .aifo-public-main.public-page-main,
body.dashboard-ui.page-layout--public-content .aifo-public-main.public-page-main {
    width: 100%;
    max-width: none;
}

/* Shell: full width, flex center */
.public-page-shell {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0;
    box-sizing: border-box;
}

/* Container: max-width aligned with header, centered by parent flex */
.public-page-container {
    width: 100%;
    max-width: var(--public-page-max);
    box-sizing: border-box;
    margin: 0;
}

/* Content wrapper: full width of container */
.public-page-content {
    width: 100%;
    display: block;
}

/* Scoped: .content inside this layout fills container (no extra width/margin that could shift left) */
.public-page-content .content,
.public-page-content .content.content-boxed {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 24px;
}

.public-page-content .content + .content {
    padding-top: 0;
}

/* Vertical rhythm: main already has padding; optional extra bottom for shell */
.public-page-shell {
    padding-bottom: 0;
}

/* Responsive: reduce horizontal padding on smaller screens */
@media (max-width: 1199.98px) {
    :root {
        --public-page-max: 100%;
    }
}

@media (max-width: 767.98px) {
    .public-page-content .content,
    .public-page-content .content.content-boxed {
        padding-left: 0;
        padding-right: 0;
    }
}

/* Tables and code inside public pages: avoid horizontal scroll overflow */
@media (max-width: 767.98px) {
    .public-page-content .table-responsive {
        margin-left: 0;
        margin-right: 0;
        -webkit-overflow-scrolling: touch;
    }

    .public-page-content .api-dark pre,
    .public-page-content .api-dark code {
        word-break: break-word;
        overflow-wrap: break-word;
    }
}