body {
    font-family: Nobile, sans-serif;
    counter-reset: fig-counter table-counter;
}

.figure-title {
    counter-increment: fig-counter;
}

.figure-title::before {
    content: "Figure " counter(fig-counter) ".";
}

.table-title {
    counter-increment: table-counter;
}

.table-title::before {
    content: "Table " counter(table-counter) ".";
}

.figure-title[data-src]::after,
.table-title[data-src]::after {
    content: " (" attr(data-src) ")";
}

section > .section-title,
.subtitle,
.subsubtitle,
.subsubsubtitle {
    color: rgba(235, 92, 37, 0.8);
    border: none;
    background: transparent;
}

section > .section-title {
    background: rgba(235, 92, 37, 0.26);
    padding: 6px 32px 7px;
    font-size: 22px;
    font-weight: 500;
    line-height: 24.8px;
    text-align: left;
}

section > .subtitle:has(+ :is(figure, table, .columns)),
section > div:has(> .ckeditor) > .subtitle,
section > div:has(> .ckeditor_table) > .subtitle {
    font-size: 20px;
    font-weight: 500;
    line-height: 22.55px;
    text-align: left;
}

section > .subtitle:has(+ :not(figure, table, .columns)) {
    font-size: 22px;
    font-weight: 400;
    line-height: 24.8px;
    text-align: left;
    padding-bottom: 10px;
    width: fit-content;
    border-bottom: 2px solid rgba(235, 92, 37, 0.8);
}

.subsubtitle {
    font-size: 22px;
    font-style: italic;
    font-weight: 400;
    line-height: 31.13px;
    text-align: left;
    padding-bottom: 10px;
    width: fit-content;
    border-bottom: 2px solid rgba(235, 92, 37, 0.8);
}

.subsubsubtitle {
    font-size: 22px;
    font-style: italic;
    font-weight: 400;
    line-height: 31.13px;
    text-align: left;
    padding-bottom: 10px;
    width: fit-content;
    border-bottom: 2px dashed rgba(235, 92, 37, 0.8);
}

@media (min-width: 780px) {
    section > .subtitle:has(+ :not(figure, table, .columns)) {
        min-width: 680px;
        margin-left: 33px;
    }

    .subsubtitle {
        min-width: 680px;
        margin-left: 87px;
    }

    .subsubsubtitle {
        min-width: 618px;
        margin-left: 152px;
    }
}

section > .section-title,
section > .subtitle,
section > .subsubtitle,
section > .subsubsubtitle,
section > .ckeditor,
section > .ckeditor_table,
section > .table,
div:has(> .ckeditor),
div:has(> .ckeditor_table),
figure {
    margin-bottom: 20px !important;
}

section > .cke,
div:has(> .cke) {
    margin-bottom: 40px !important;
}

.editSuccess {
    animation: confirmEdit 1.5s;
}

@keyframes confirmEdit {
    0% {
        box-shadow: #5dc6bc 0 0 0px;
    }
    50% {
        box-shadow: #5dc6bc 0 0 20px;
    }
    100% {
        box-shadow: #5dc6bc 0 0 0px;
    }
}

.table {
    width: 100%;
}

.table > thead {
    background-color: rgba(235, 92, 37, 0.2);
}

.table > tbody > tr:nth-child(even) {
    background-color: hsl(221, 14%, 98%);
}

.ckeditor p,
.table {
    font-size: 15px;
    font-weight: 400;
    line-height: 21px;
}

#references-list .message-body {
    font-family: Nobile sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 16.91px;
    word-wrap: break-word;
}

.tags .tag {
    font-size: 0.75rem;
    line-height: 1rem;
    color: rgba(91, 94, 112, 1);
}

.tag.is-primary {
    background: rgba(251, 146, 60, 1);
}

.tag.is-secondary {
    background: rgba(253, 186, 116, 1);
}

.editor_h1 {
    color: rgba(235, 92, 37, 0.8);
    font-size: 22px;
    font-weight: 500;
    line-height: 24.8px;
    text-align: left;
}

.editor_h2 {
    color: rgba(235, 92, 37, 0.8);
    font-size: 20px;
    font-weight: 500;
    line-height: 22.55px;
    text-align: left;
}

.editor_h3 {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 900;
    color: rgb(55, 61, 63);
}

#sectionOverview {
    background-color: #f3f3f3;
    padding: 5px;
    border-radius: 5px;
    margin-bottom: 5px;
}

section.is-closed > *:not(.title) {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

section:not(#sectionOverview) > .title {
    cursor: pointer;
    position: relative;

    &::after {
        border: 0.125em solid rgba(235, 92, 37, 0.8);
        border-right: 0;
        border-top: 0;
        content: " ";
        display: block;
        height: 0.625em;
        pointer-events: none;
        position: absolute;
        top: 50%;
        right: 32px;
        transform-origin: center;
        transition: rotate 0.25s;
        width: 0.625em;
    }
}

section.is-closed > .title::after {
    transform: rotate(-135deg);
    margin-top: -6px;
}

section.is-open > .title::after {
    margin-top: -0.4375em;
    transform: rotate(-45deg);
}

.image {
    min-height: 300px;

    @media (max-width: 780px) {
        min-height: auto;
    }
}
