/*
 * ------------------------------------------------------------------
 *
 * Lists.
 *
 */

ul {
    list-style-type: none;
}

.wh_topic_content ul,
.wh_topic_content ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    counter-reset: item;
}

.wh_topic_content ul>li,
.wh_topic_content ol>li {
    position: relative;
    padding-left: 25px;
}

.wh_topic_content ul>li::before {
    content: '■';
    position: absolute;
    left: 0;
    top: 0;
    font-size: 12px;
    color: black;
}

.wh_topic_content ol>li::before {
    content: counter(item) ". ";
    counter-increment: item;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    color: black;
}

/* Второй уровень - lower-alpha */
.wh_topic_content ol>li>ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    counter-reset: letter;
}

.wh_topic_content ol>li>ol>li::before {
    content: counter(letter, lower-alpha) ". ";
    counter-increment: letter;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    color: black;
}

/* Третий уровень - lower-roman */
.wh_topic_content ol>li>ol>li>ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    counter-reset: roman;
}

.wh_topic_content ol>li>ol>li>ol>li::before {
    content: counter(roman, lower-roman) ". ";
    counter-increment: roman;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    color: black;
}

/* Четвертый уровень - цифры */
.wh_topic_content ol>li>ol>li>ol>li>ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    counter-reset: item;
}

.wh_topic_content ol>li>ol>li>ol>li>ol>li::before {
    content: counter(item) ". ";
    counter-increment: item;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    color: black;
}

/* Пятый уровень - lower-alpha */
.wh_topic_content ol>li>ol>li>ol>li>ol>li>ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    counter-reset: letter;
}

.wh_topic_content ol>li>ol>li>ol>li>ol>li>ol>li::before {
    content: counter(letter, lower-alpha) ". ";
    counter-increment: letter;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    color: black;
}

/* Шестой уровень - lower-roman */
.wh_topic_content ol>li>ol>li>ol>li>ol>li>ol>li>ol {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    counter-reset: roman;
}

.wh_topic_content ol>li>ol>li>ol>li>ol>li>ol>li>ol>li::before {
    content: counter(roman, lower-roman) ". ";
    counter-increment: roman;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 16px;
    color: black;
}

.wh_topic_content .simple>li::before {
    display: none;
    content: none;
}

/* 
    outputclass
    
    nested-numbering

    Позволяет добавить сквозную нумерацию по заголовкам и нумерованным спискам на html страницу

    <topic id="topic" outputclass="nested-numbering">

*/
.nested-numbering .wh_topic_content {
    counter-reset: nested-counter;
}

.nested-numbering .wh_topic_content article h2 {
    counter-increment: nested-counter;
}

.nested-numbering .wh_topic_content article h2::before {
    content: counters(nested-counter, ".") ". ";
}

.nested-numbering .wh_topic_content article article .body {
    counter-reset: nested-counter;
}

.nested-numbering .wh_topic_content article article .body h3 {
    counter-increment: nested-counter;
}

.nested-numbering .wh_topic_content article article .body h3::before {
    content: counters(nested-counter, ".") ". ";
}

.nested-numbering .wh_topic_content article ol {
    counter-reset: heade-article-counter !important;
}

.nested-numbering .wh_topic_content article ol>li {
    counter-increment: heade-article-counter !important;
}

.nested-numbering .wh_topic_content article ol>li::before {
    position: relative !important;
    width: fit-content !important;
    content: counters(heade-article-counter, ".") ". " !important;
}

.nested-numbering .wh_topic_content section ol {
    counter-reset: nested-counter !important;
}

.nested-numbering .wh_topic_content section ol>li {
    counter-increment: nested-counter !important;
}

.nested-numbering .wh_topic_content section ol>li::before {
    position: relative !important;
    width: fit-content !important;
    content: counters(nested-counter, ".") ". " !important;
}

.nested-numbering .wh_topic_toc ul {
    counter-reset: toc-counter;
}

.nested-numbering .wh_topic_toc ul li {
    counter-increment: toc-counter;
}

.nested-numbering .wh_topic_toc ul li a::before {
    content: counters(toc-counter, ".") ". ";
}

/*
 * ------------------------------------------------------------------
 *
 * Note styling.
 *
 */

.note {
    margin-bottom: 1em;
    margin-top: 1em;
    border: 1px;
    border-style: none;
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-top: 0.25em;
    padding-bottom: 0.25em;
    background-color: #EEE;
    font-weight: normal;
}

span.note__title {
    display: none;
}

div.note {
    background-image: url("../images/note.svg") !important;
    padding: 0.75em 0.5em 0.75em 2.6em;
    background-position: 0.75em 1em;
    max-width: 24cm;
    font-size: 16px;
}

div.tip {
    background-image: url("../images/info.svg") !important;
}

div.info {
    background-image: url("../images/info.svg") !important;
}

div.attention, div.warning,
div.caution, div.important {
    background-image: url("../images/warning.svg") !important;
}

div.danger {
    background-image: url("../images/danger.svg") !important;
}

.note p {
    margin-top: 0;
}

/*
 * ------------------------------------------------------------------
 *
 * Codeblock styling.
 *
 */

.codeph {
    color: #000;
    padding-right: 4px;
    padding-left: 4px;
    padding-bottom: 2px;
    border-radius: 3px;
}

.title code.codeph {
    font-size: inherit !important;
    font-weight: inherit !important;
    font-family: inherit !important;
    background: none !important;
    padding: 0 !important;
}

.topic-item .codeph {
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    background: inherit;
    color: inherit;
    padding: 0;
}

.wh_topic_content code {
    word-wrap: normal;
    font-size: 12px;
    line-height: 0.7em;
}

.wh_topic_content code table tr td {
    padding: 0.5em;
}

.wh_topic_content .hljs-ln tr {
    height: auto;
}

.hljs-ln-code code {
    display: inline;
}

pre {
    margin-top: 3px;
    margin-left: 0px;
    margin-bottom: 3px;
}

.wh_expand_btn {
    display: none;
}

/* 
    outputclass

    show-expand-btn

    Позволяет отобразить кнопку для своричивания топика. Пример::after
    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE topic PUBLIC "-//OASIS//DTD DITA Topic//EN" "topic.dtd">
    <topic id="about" outputclass="show-expand-btn">
    <section outputclass="show-expand-btn">

*/
.show-expand-btn .wh_expand_btn {
    display: initial;
}

.table .hljs-ln-line {
    font-size: 12px;
}

.table .hljs-ln-numbers {
    user-select: none;
    text-align: center;
    color: #ccc;
    border-right: 1px solid #CCC;
    vertical-align: top;
    padding-right: 5px;
}

/* 
    outputclass

    codeblock-stringify

    Убирает нумерацию строк

    Пример: <codeblock outputclass="codeblock-stringify">
    Шаблон: Докпортальные шаблоны
*/

.codeblock-stringify .hljs-ln-numbers {
    display: none;
}


/*
 * ------------------------------------------------------------------
 *
 * Publication titles
 *
 */
.wh_publication_title>a {
    color: #fff;
    font-size: 2em;
    font-family: inherit;
}

/*
 * ------------------------------------------------------------------
 *
 * Menu
 *
 */
.wh_top_menu {
    text-transform: uppercase;
    margin: .4em 0;
    font-size: 0.9em;
}

.wh_top_menu a {
    color: #fff;
    line-height: 2em;
}

/* The submenus */
.wh_top_menu ul ul {
    background-color: #333;
}

.wh_top_menu ul li:hover {
    background-color: #333;
}

.wh_top_menu ul ul li a:hover {
    background: #000;
}

.wh_top_menu ul ul li {
    border-top-color: #000;
    width: 270px;
    text-transform: capitalize;
}

.wh_top_menu ul ul li.has-children:after {}


/*
 * ------------------------------------------------------------------
 *
 * Link to the index.
 *
 */
.wh_indexterms_link a span {
    display: none;
}

.wh_indexterms_link a:before {
    color: #fff;
}

/*
 * ------------------------------------------------------------------
 *
 * Tables
 *
 */

/* outputclass

    section-width
    
    Для документов HTML имеется возможность ограничить ширину таблицы по ширине всего контента
    Пример:
        <table outputclass="section-width">
            <title>Пример названия таблицы</title>
            <tgroup cols="1">
                <tbody>
                    <row>
                        <entry>Элемент таблицы</entry>
                    </row>
                </tbody>
            </tgroup>
        </table>
*/

.section-width {
    max-width: 24cm !important;
}

.table {
    width: 100% !important;
}

/* 
* Min height for empty row 
*/
.wh_topic_content table tr {
    height: 39.8px;
}

/* .table td[class~="confluenceTd"]:nth-child(5) {
    width: 40%;
} */

.table td, .table th {
    font-size: 16px;
    padding: .75rem;
    vertical-align: middle;
    border-top: 0px;
    border-right: 0px;
    text-align: left;
}

.table thead th {
    vertical-align: top;
    border-bottom: 2px solid #dee2e6;
}

.wh_topic_content .table p,
.wh_topic_content .table ol,
.wh_topic_content .table ul {
    margin-top: 1em;
    margin-bottom: 1em;
}

.align-center {
    text-align: center !important;
}

.align-right {
    text-align: right !important;
}

.align-justify {
    text-align: justify !important;
}

/* outputclass

    border-on 
    
    Для документов HTML имеется возможность отобразить все границы таблиц при добавлении outputclass к тегу table.
    Пример:
        <table outputclass="border-on">
            <title>Пример названия таблицы</title>
            <tgroup cols="1">
                <tbody>
                    <row>
                        <entry>Элемент таблицы</entry>
                    </row>
                </tbody>
            </tgroup>
        </table>
*/

.frame-all {
    border: 0px;
}

*[class~="border-on"] {
    border: 1px solid black;
}

*[class~="border-on"]>tbody>tr>td, *[class~="border-on"]>thead>tr>th {
    border-top: 1px solid black;
    border-right: 1px solid black;
}

*[class~="border-on"] .frame-all {
    border: 1px solid black;
}

.simpletable-container, .table-container, .tablenoborder {
    height: 100% !important;
    overflow-x: visible !important;
}

/*Table caption*/

/* outputclass

    w-title 
    
    Для документов HTML имеется возможность отобразить название таблицы при добавлении outputclass к тегу table.
    Пример:
        <table outputclass="w-title">
            <title>Пример названия таблицы</title>
            <tgroup cols="1">
                <tbody>
                    <row>
                        <entry>Элемент таблицы</entry>
                    </row>
                </tbody>
            </tgroup>
        </table>
*/

*[class~="w-title"]>caption {
    font-size: 16px;
    font-weight: bold;
    color: black;
    display: table-caption;
    padding-left: 0;
    white-space: normal;
    caption-side: top;
}

*[class~="w-title"] *>table>caption {
    font-size: 16px;
    font-weight: bold;
    color: black;
    display: table-caption;
    padding-left: 0;
    white-space: normal;
    caption-side: top;
}

.table--title-label {
    display: none;
}

/*Hide table captions. */

table>caption {
    padding-left: 0;
    display: none;
}


/**
 *
 * Styles used for RTL pages
 *
 */
html[dir='rtl'] .wh_top_menu ul li:hover>ul {
    max-width: 270px;
}

/* 
Indents for Kornfeld CLI params
*/

.tab-indent-1 {
    padding-left: 15px !important;
}

.tab-indent-2 {
    padding-left: 25px !important;
}

.tab-indent-3 {
    padding-left: 35px !important;
}

.tab-indent-4 {
    padding-left: 45px !important;
}

.tab-indent-5 {
    padding-left: 55px !important;
}

.tab-indent-6 {
    padding-left: 65px !important;
}


/*
 * ------------------------------------------------------------------
 *
 * Tree TOC for the main page.
 *
 */
.wh_main_page_toc {}


.wh_main_page_toc .expanded, .wh_main_page_toc .wh_main_page_toc_accordion_header:hover, .wh_main_page_toc>.wh_main_page_toc_entry:hover, .wh_main_page_toc_accordion_entries {
    background-color: #F2F8FF;
}


/*
* ------------------------------------------------------------------
*
* Index terms.
*
*/
.wh_index_terms span.wh_first_letter {
    color: #346ec5;
}

.wh_index_terms #indexList {
    padding: 0;
}


/*
* ------------------------------------------------------------------
*
* Figure
*
*/

.wh_topic_content img {
    max-width: 21cm;
}

.wh_topic_content img#about__ltr {
    max-width: 3cm;
}

.wh_topic_content img#about__rtl {
    max-width: 3cm;
}

.wh_topic_content img#about__ltr {
    float: right;
}

/*Hide figure captions. */
.wh_topic_content figcaption {
    display: none;
}

/* outputclass

    w-title-top и w-title-bottom 
    
    Для документов HTML имеется возможность отобразить название рисука без автоматической нумерации при добавлении outputclass к тегу fig.
    Названия рисунков можно отобразить внизу и вверху.
    Пример:
        <fig outputclass="w-title-bottom">
            <title>Пример заголовка для рисунка</title>
            <image href="href"/>
        </fig>
*/

figure.w-title-bottom {
    display: flex;
    flex-direction: column-reverse;
}

figure.w-title-top {
    display: block;
}

.w-title-top p {
    font-size: 16px;
    font-weight: bold;
    color: black;
    margin-bottom: 0 !important;
}

.wh_topic_content *[class~="w-title-bottom"]>figcaption,
.wh_topic_content *[class~="w-title-top"]>figcaption {
    font-size: 16px;
    font-weight: bold;
    color: black;
    display: block;
    padding-left: 0;
    white-space: normal;
}

.wh_topic_content *[class~="w-title-top"]>figcaption .fig--title-label,
.wh_topic_content *[class~="w-title-bottom"]>figcaption .fig--title-label {
    display: none !important;
}


/*
 * ------------------------------------------------------------------
 *
 * Topic titles
 *
 */
.sectiontitle {
    margin-bottom: 15px;
    font-size: 24px !important;
}

.sectiontitle:not(.tasklabel) {
    padding-left: 0;
}

.topictitle1,
.topictitle2,
.topictitle3,
.topictitle4,
.topictitle5,
.topictitle6 {
    padding-left: 0 !important;
}

.topictitle3 {
    font-weight: 400;
}

.section-title {
    color: #616161
}


.section-title>a {
    color: #616161
}

.section-title a:hover {
    text-decoration-color: #1E22AA
}

/*
 * ------------------------------------------------------------------
 *
 * Links
 *
 */
a,
a:hover,
a:visited {
    color: #1E22AA;
}

a:hover {
    text-decoration: none;
}


/*
 * ------------------------------------------------------------------
 *
 * Tiles
 *
 */
.wh_tile {
    background-color: #EFEFEF;
    font-weight: 300;
}

.wh_tile_shortdesc {
    margin-top: 1em;
    text-align: center;
    color: #0D1A2B;
    font-size: 1.1em;
}

.wh_tile_text:after {
    background: linear-gradient(to bottom, rgba(239, 239, 239, 0), rgba(239, 239, 239, 1) 75%);
}

.wh_tile_title {
    font-size: 1.7em;
    text-align: center;
    text-decoration: none;
}

.wh_tile_title a {
    color: #3077be;
    line-height: 1.3em
}

@media only screen and (max-width: 767px) {
    .wh_tile>div {
        height: auto;
    }
}

/*
You can style some of the tiles in a special way.
Example:
.wh_tiles *[data-id='getting_started']{
    background-color:gray;
}
*/


/* outputclass

    overflow-break-word
    
    Перенос слов в таблиц без знака переноса
    Пример:
        <table" outputclass="overflow-break-word">
*/
.overflow-break-word {
    overflow-wrap: break-word;
    word-break: break-all;
}