@import url("https://fonts.googleapis.com/css2?family=Golos+Text:wght@400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700;800&display=swap");

/* --- Reset --- */
object {
    display: none;
}

html,
body {
    overflow: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar {
    display: none;
}

body {
    color: var(--grey-1000, #292929);
    font-family: var(--font-golos-text, "Golos Text");
    font-size: var(--font-size-h4, 18px);
    font-weight: 400;
    line-height: var(--line-height-relaxed, 22px);
    background-color: var(--color-white, #fff);
    margin: 0;
}

/* === Заголовки === */
h1, .header-1 {
    font-family: var(--font-jetbrains-mono, "JetBrains Mono", monospace);
    font-size: 18pt;
    font-weight: bold;
    margin: 20px 0 10px 10px;
    text-align: left;
    border: none;
    width: 100%;
    max-width: 1200px;
}

/* Блок заголовка документа (#head) в iframe — единый вид поверх инлайн-стилей HTML.
 * Высота #head синхронизируется с doc-toc-nav-header-fill через JS (doc-page-actions.js). */
#head {
    background: var(--green-200, #D8DFDF);
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    padding: 24px 48px;
    box-sizing: border-box;
    border: none !important;
}

#head h1 {
    margin: 0;
    font-family: var(--font-jetbrains-mono, "JetBrains Mono", monospace);
    font-weight: 500 !important;
    font-size: var(--font-size-xl, 36px) !important;
    line-height: var(--line-height-tight, 1.2em) !important;
    color: var(--color-doc-header-text, #363C3E);
}

#head h1 div {
    margin: 0;
    font: inherit;
    color: inherit;
}

#content {
    padding: var(--spacing-lg, 24px) var(--spacing-3xl, 48px);
}

h2, .header-2 {
    color: var(--grey-1000, #292929);
    font-family: var(--font-golos-text, "Golos Text");
    font-size: var(--font-size-h2, 24px);
    font-weight: 500;
    line-height: normal;
    margin: 0 0 24px 0;
    text-align: left;
    border: none;
    max-width: 1200px;
}

#foot {
    border: 2px solid var(--color-black, black);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    color: var(--color-black, black);
}

a {
    color: var(--color-green-main, #247D7A);
    text-decoration: none;
}

.important-note {
    background-color: var(--color-bg-success, #F3F9ED);
    border-radius: var(--radius-lg, 16px);
    margin: var(--spacing-3xl, 48px) 0;
    padding: var(--spacing-lg, 24px) var(--spacing-xl, 32px);
    color: var(--grey-1000, #292929);
    font-family: var(--font-golos-text, "Golos Text");
    font-size: var(--font-size-base, 18px);
    font-weight: 400;
    line-height: var(--line-height-relaxed, 1.47);
}

.important-note .important-header,
.important-warning .important-header {
    display: flex;
    align-items: center;
    gap: var(--gap-sm, 8px);
    margin: 0;
    color: var(--grey-1000, #292929);
    font-family: var(--font-golos-text, "Golos Text");
    font-size: var(--font-size-base, 18px);
    font-weight: 700;
    line-height: 22px;
}

.important-note .important-header::before {
    content: "";
    display: block;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 2C11.5899 2 14.5 4.91015 14.5 8.5C14.5 12.0899 11.5899 15 8 15C4.41015 15 1.5 12.0899 1.5 8.5C1.5 4.91015 4.41015 2 8 2ZM8 11C7.44772 11 7 11.4477 7 12C7 12.5523 7.44772 13 8 13C8.55228 13 9 12.5523 9 12C9 11.4477 8.55228 11 8 11ZM8 4C7.46184 4 7.03858 4.45983 7.08301 4.99609L7.45801 9.50195C7.48157 9.7835 7.71745 10 8 10C8.28255 10 8.51843 9.7835 8.54199 9.50195L8.91699 4.99609C8.96142 4.45983 8.53816 4 8 4Z' fill='%23292929'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}

.important-warning {
    background: var(--color-bg-warning, #FFF9F0);
    border-radius: var(--radius-lg, 16px);
    margin: var(--spacing-xl, 32px) 0;
    padding: var(--spacing-lg, 24px) var(--spacing-xl, 32px);
    color: var(--grey-1000, #292929);
    font-family: var(--font-golos-text, "Golos Text");
    font-size: var(--font-size-base, 18px);
    font-weight: 400;
    line-height: var(--line-height-relaxed, 1.47);
}

.important-warning .important-header::before {
    content: "";
    display: block;
    flex-shrink: 0;
    width: 15px;
    height: 13px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='13' viewBox='0 0 15 13' fill='none'%3E%3Cpath d='M6.41016 0.503906C6.79405 -0.167908 7.76259 -0.167908 8.14648 0.503906L14.4238 11.4883C14.8044 12.1549 14.3224 12.9844 13.5547 12.9844H1.00195C0.234259 12.9844 -0.247781 12.1549 0.132812 11.4883L6.41016 0.503906ZM7.27734 9.98438C6.72506 9.98438 6.27734 10.4321 6.27734 10.9844C6.27734 11.5367 6.72506 11.9844 7.27734 11.9844C7.82963 11.9844 8.27734 11.5367 8.27734 10.9844C8.27734 10.4321 7.82963 9.98438 7.27734 9.98438ZM7.27734 2.98438C6.73918 2.98438 6.31592 3.44421 6.36035 3.98047L6.73535 8.48633C6.75891 8.76788 6.99479 8.98438 7.27734 8.98438C7.5599 8.98438 7.79578 8.76788 7.81934 8.48633L8.19434 3.98047C8.23876 3.44421 7.81551 2.98438 7.27734 2.98438Z' fill='%23292929'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}

.important-error {
    background-color: var(--color-bg-error, #FDEDED);
    margin: 10px 0;
}

.important-header {
    font-weight: bold;
    margin: 0;
    color: var(--color-black, #000);
    font-size: 1.1em;
}

table:not(.io-table) {
    display: block;
    table-layout: auto;
    width: max-content;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: var(--color-green-main, #247D7A) transparent;
    margin: 1em 0;
    border: 1px solid #9CA5A5;
    border-collapse: collapse;
}

/* скроллбар (переопределяет *::-webkit-scrollbar { display: none }) */
table:not(.io-table)::-webkit-scrollbar {
    display: block;
    height: 6px;
}

table:not(.io-table)::-webkit-scrollbar-track {
    background: transparent;
}

table:not(.io-table)::-webkit-scrollbar-thumb {
    background: var(--color-green-main, #247D7A);
    border-radius: 0;
}

td,th {
    padding: var(--spacing-md, 8px) var(--spacing-base, 12px);
    border: 1px solid #9CA5A5;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.io-table {
    border-collapse: collapse;
    margin: 0;
    border: 1px solid var(--grey-250, #E9ECEC);
    table-layout: auto;
    width: fit-content;
    max-width: 100%;
    min-width: 0;
}

.io-table td {
    padding: var(--spacing-md, 12px) var(--spacing-base, 16px);
    vertical-align: top;
    border: 1px solid var(--grey-250, #E9ECEC);
    color: var(--grey-1000, #292929);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.io-name {
    font-weight: bold;
    white-space: nowrap;
}

.io-type {
    font-weight: 400;
    white-space: nowrap;
}

.io-table-header,
.io-table-main-header-row {
    font-weight: bold;
    text-align: left;
    padding: var(--spacing-md, 12px) var(--spacing-base, 16px);
    border: 1px solid var(--grey-250, #E9ECEC);
    background-color: var(--grey-200, #F9F9F9);
    color: var(--grey-1000, #292929);
    white-space: nowrap;
}

.formula {
    font-family: 'Courier New', monospace;
    border: 1px solid var(--grey-250, #ddd);
    margin: 10px 0;
    padding: 10px;
    font-size: 12pt;
    border-radius: 0 var(--radius-md, 4px) var(--radius-md, 4px) 0;
}

.content-list {
    list-style: decimal;
    margin: 16px 0;
    padding-left: 1.5em;
}

.content-list li {
    padding-bottom: 24px;
}

.content-list li:last-child {
    padding-bottom: 0;
}

/* --- Links --- */
.links-section {
    text-align: left;
}

.help-link,
.file-link,
.media-link {
    color: var(--color-green-main, #247D7A);
    margin: 0;
}

.file-link,
.media-link {
    font-style: italic;
}

/* --- Content blocks --- */
.content-block {
    width: auto;
    margin-bottom: 24px;
    text-align: left;
    max-width: 1056px;
}

img {
    max-width: 100% !important;
    height: auto !important;
    scale: 0.9;
}

/* === Media Queries === */
@media (max-width: 768px) {
    h1,
    .header-1 {
        font-size: 32px;
        max-width: 100%;
    }

    #head h1 {
        font-size: 32px !important;
    }

    #head {
        padding: var(--spacing-lg, 24px) var(--spacing-lg, 24px);
    }

    #content {
        padding: var(--spacing-base, 16px) var(--spacing-lg, 24px);
    }

    h2,
    .header-2 {
        font-size: 26px;
        max-width: 100%;
    }

    /* Брейкпоинт 768px: таблица не сжимается, горизонтальный скролл остаётся на table. */
    table:not(.io-table) {
        width: max-content;
    }

    .io-table {
        display: block;
        width: fit-content;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
    }

    .io-table td {
        padding: 8px 10px;
        font-size: 17px;
    }

    .io-table-header,
    .io-table-main-header-row {
        padding: 8px 10px;
        font-size: 17px;
    }

    .content-block {
        max-width: 100%;
    }

    .content-block img {
        display: block;
        max-width: 100%;
        height: auto;
        margin: 0;
    }
}