/* ==========================================================================
   Pine Research Instrumentation
   
   SUPPORT (Support Pages, Articles, Archives at /support)
   
   Author: Tim Paschkewitz
   ========================================================================== */

/* ARTICLES (General) */
.support-article-container p {
    line-height: 1.5em;
}

div.support-article-container {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 20px;
}

.support-article-body h2,
.support-article-body h3,
.support-article-body h4,
.support-article-body h5 {
    color: var(--dark-pri-blue) !important;
}

.support-article-body code {
    background-color: #f3f3f3;
    font-weight: bold;
    padding: 2px;
}

sup,
sub {
    font-size: 0.8em !important;
}

sup {
    bottom: 0.4em !important;
}

.support-content-separator {
    line-height: 1.5em;
    border-bottom: 1px solid var(--mid-blue-2);
}

.support-article-category-container,
.support-article-tag-container {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 20px;
}

/* SEARCH */
.search-header-container {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    text-align: center;
    row-gap: 10px;
}

.search-header-container div.title h1,
.search-header-container div.subtitle {
    color: var(--white) !important;
    margin: 0;
    padding: 0;
}

.search-header-container .subtitle {
    font-style: italic;
}

#support-search {
    display: block;
    width: 100%;
    position: relative;
    z-index: 100;
}

#support-search input {
    width: 100%;
    height: 3.2em;
    border: 3px solid var(--mid-blue-2);
    box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3);
    background-color: var(--white);
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0 10px;
    z-index: 99;
    border-radius: 8px;
}

div#support-search-results {
    border: 3px solid var(--mid-blue-2);
    border-radius: 8px;
    padding: 1em;
    box-shadow: 0px 12px 18px -6px rgba(0, 0, 0, 0.3);
    position: absolute;
    background: white;
    width: 100%;
    z-index: 1000;
}

.support-search-results {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 1em;
}

.result {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    column-gap: 0.3em;
}

.result>.icon {
    font-size: 1.6em;
    color: var(--dark-pri-blue);
    flex-basis: 2em;
    text-align: center;
}

.result>.result-link {
    font-size: inherit;
}

.result>.heading {
    font-size: 1.2em;
    font-weight: 700;
    color: var(--dark-pri-blue);
}

.result>.heading.icon {
    flex-basis: 2em;
    text-align: center;
}

#support-ajax-search {
    position: relative;
    padding-right: 40px;
}

#ajax-spinner-icon {
    font-size: 1.5em;
    z-index: 1001;
}

/* SIDEBAR */
.et_pb_sidebar_0_tb_body.et_pb_widget_area {
    border-left-width: 0;
}

#support-sidebar {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 30px;
    padding-top: 15px;
}

.sidebar-title {
    font-size: 1.3em;
    font-weight: 500;
    color: var(--mid-blue-1);
    text-align: center;
}

.sidebar-subtext {
    font-size: 0.85em;
    color: var(--mid-blue-1);
    text-align: center;
}

.meta-wrapper {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 10px;
}

.meta-wrapper .item {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
}

.meta-wrapper .item.gap .icon {
    flex-basis: 2em;
    flex-shrink: 0;
    flex-grow: 0;
}

.meta-wrapper .item.gap .value {
    display: flex;
    flex-flow: row wrap;
    column-gap: 5px;
}

.meta-wrapper .item .value {
    font-size: 0.85em;
}

.meta-wrapper .item .value.title {
    font-size: 0.85em;
    color: var(--mid-blue-1);
}

.meta-wrapper .item.row {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
}

.meta-wrapper .item .group {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    justify-content: center;
}

.meta-wrapper .item .icon {
    color: var(--mid-blue-1);
    font-size: 1.1em;
    flex-basis: 1.4em;
}

.meta-wrapper .item.categories .value {
    display: flex;
    flex-flow: row nowrap;
    column-gap: 0.5em;
}

ul.support-article-list.sidebar {
    list-style-type: none;
    display: flex;
    flex-flow: column nowrap;
    row-gap: 8px;
    line-height: 1.4em;
    padding: 15px 0;
}

ul.support-article-list.sidebar li.value {
    color: var(--dark-pri-blue);
    display: flex;
    flex-flow: row nowrap;
    column-gap: 5px;
    font-size: 0.85em;
}

ul.support-article-list.sidebar span.fa-li.icon {
    font-size: 1.4em;
}

/* ARTICLE BODY */
.support-article-body {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 20px;
}

.support-article-body div.wp-caption {
    margin-top: 15px;
    margin-bottom: 15px;
    box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3);
}

.support-article-body>div.section_level_3 {
    margin-left: 15px;
}

.support-article-body>div.section_level_3>h3,
.support-article-body>div.section_level_4>h4,
.support-article-body>div.section_level_5>h5,
.support-article-body>div.section_level_6>h6 {
    line-height: 1.2em;
}

.support-article-body>div.section_level_4 {
    margin-left: 30px;
}

.wp-caption .wp-caption-text {
    margin-top: 5px;
    font-style: italic;
}

.tmp-notice-big-wrap {
    margin-top: 20px;
}

p:not(.has-background):last-of-type {
    padding-bottom: 1em;
}

ul.sidebar-list {
    list-style-position: outside;
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-flow: column nowrap;
    text-align: center;
    justify-self: center;
}

ul.sidebar-list li {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
}

ul.sidebar-list.articles li .icon {
    flex-basis: 1.8em;
    flex-shrink: 0;
    flex-grow: 0;
    line-height: 1em;
}

.inline-icon {
    height: 1.2em;
}

ul.sidebar-list li.value {
    font-size: 0.85em;
}

/* LISTS */
.sc-list-ul {
    list-style-type: disc !important;
    list-style-position: outside !important;
    padding: 10px 40px !important;
    display: flex !important;
    flex-flow: column nowrap !important;
    row-gap: 10px !important;
}

.sc-list-ul li {
    line-height: 1.5em;
}

.sc-list-ol {
    list-style-position: outside !important;
    padding: 10px 40px !important;
    display: flex !important;
    flex-flow: column nowrap !important;
    row-gap: 10px !important;
}

.sc-list-ol li {
    line-height: 1.5em;
}

ol.sc-list-ol>li::marker {
    font-weight: bold;
    color: var(--dark-pri-blue);
}

ul.support-article-list.main {
    list-style-type: none;
    display: flex;
    flex-flow: column nowrap;
    row-gap: 20px;
    line-height: 1.4em;
    padding: 0;
    margin-left: var(--fa-li-margin, 30px);
}

ul.support-article-list.main li.value {
    color: var(--dark-pri-blue);
    display: flex;
    flex-flow: row nowrap;
    column-gap: 5px;
    font-size: 1em;
}

ul.support-article-list.main span.fa-li.icon {
    font-size: 1.4em;
}

ul.support-article-list.main .support-article-category-list {
    margin-left: 5%;
}

.support-article-category-list {
    margin-left: 4%;
}

.fbx-caption-desc {
    display: none;
}

/* VOTING/FEEDBACK */
.support-article-sidebar-container {
    display: flex;
    flex-flow: column nowrap;
    row-gap: 10px;
}

.article-voting {
    display: flex;
    flex-flow: row nowrap;
    column-gap: 60px;
    justify-content: center;
}

.option {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
    row-gap: 10px;
}

a.vote-btn .icon {
    font-size: 3em;
}

a.vote-btn {
    text-decoration: none;
}

a.vote-btn:hover {
    opacity: 0.6;
    text-decoration: none;
    cursor: pointer;
}

.vote-count {
    padding: 5px;
    font-size: 0.9em;
    font-weight: bold;
    height: 1.7em;
    width: 1.7em;
    line-height: 0.85em;
    border-radius: 50%;
    text-align: center;
}

.vote-count.like-count {
    color: var(--green);
    border: 1px solid var(--green);
}

.vote-count.dislike-count {
    color: var(--red);
    border: 1px solid var(--red);
}

.vote-message {
    text-align: center;
    margin-top: 10px;
    font-style: italic;
    padding: 5px;
    border: 1px solid var(--mid-blue-1);
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    background-color: var(--mid-blue-2);
    color: var(--dark-pri-blue);
    font-weight: 700;
    box-shadow: 0px 12px 18px -6px rgba(0, 0, 0, 0.3);
}

.loading-spinner {
    font-size: 3em;
    color: var(--dark-pri-blue);
}

.support-article-feedback {
    margin: 40px auto 20px auto;
    padding: 15px;
    border: 1px solid var(--mid-blue-2);
    box-shadow: 0 12px 18px -6px rgba(0, 0, 0, .3);
    width: 80%;
}

/* TOC */
#table-of-contents {
    padding: 8px 15px;
    overflow-y: scroll;
    max-height: 250px;
    min-height: 100px;
    background-color: var(--white);
    border: 1px solid var(--mid-blue-2);
}

#table-of-contents ul {
    list-style-position: outside;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#table-of-contents ul li {
    font-size: 0.85em;
}

#table-of-contents ul li.toc-level-h3 {
    margin-left: 15px;
}

#table-of-contents ul li.toc-level-h4 {
    margin-left: 30px;
}

/* LINKS */
a.support {
    padding: 0 3px;
    font-size: 0.95em;
}

a.support:hover {
    opacity: 0.7;
    cursor: pointer;
}

a.support.related-product {
    background-color: var(--light-green);
    color: var(--green) !important;
}

a.support.related-article {
    background-color: var(--light-mid-blue-1);
    color: var(--dark-pri-blue) !important;
}

a.support.external {
    background-color: var(--light-purple);
    color: var(--purple) !important;
}

a.support.product_singlecategory,
a.product_category.crosslink {
    background-color: var(--light-orange);
    color: var(--orange) !important;
}

/* SUPPORT ARTICLE TABLES */
.table.sc-table,
.grid-table-container {
    margin-left: 1em;
    margin-right: 1em;
    border: 3px solid var(--dark-pri-blue);
    border-radius: 5px;
    margin-bottom: 1em;
}

.table.sc-table .row,
.grid-table-container .grid-row {
    display: grid;
    grid-auto-rows: 1fr;
    gap: 0px 1em;
    justify-content: center;
    align-content: center;
    justify-items: stretch;
    align-items: center;
    text-align: center;
    padding: 10px 5px;
    border-bottom: 1px solid var(--lighter-gray);
}

.table.sc-table .row.header,
.grid-table-container .grid-row.header {
    font-weight: 700;
    color: var(--white);
    background-color: var(--dark-pri-blue);
    align-items: center;
}

.table-sc-table .row:nth-child(odd):not(.header) {
    background-color: var(--lighter-gray);
}

#support-article .wp-caption {
    margin: 1em 0 2.3em;
    background-color: var(--white);
    padding: 0;
    box-shadow: var(--box-shadow-default);
    border: 1px solid var(--lighter-gray);
    width: 100% !important;
}

#support-article .wp-caption img {
    padding: 1em;
    transition: var(--transition-all-ease-slow);
}

#support-article .wp-caption img:hover {
    cursor: pointer;
    opacity: 0.8;
    transform: var(--scale_105);
}

/* Categories */
#support-categories {
    gap: 2em;
    align-items: flex-start;
    margin-bottom: 4em;
}

.category-container {
    border: 1px solid var(--mid-blue-2);
}

.category {
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    border-radius: 5px;
    width: 100%;
}

.category-wrapper {
    border: 2px solid var(--mid-blue-1);
    height: 340px;
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    border-radius: 5px;
}

.category-header {
    background: var(--dark-pri-blue);
    color: var(--dark-pri-blue);
    border-bottom: 1px solid var(--mid-blue-1);
    width: 100%;
    padding: 1em 0;
}

.category-link {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    color: var(--white);
}

.category-link:hover {
    transition: var(--transition-all-ease-slow);
    transform: var(--scale_105);
    color: var(--mid-blue-2);
}

.category .articles {
    width: 100%;
    /*max-height:180px;
	overflow-y:auto;*/
}

.articles .article {
    padding: 10px;
}

.view-more {
    margin-top: auto;
    margin-bottom: 1em;
    border-top: 1px solid var(--mid-blue-1);
}

@media screen and (max-width:576px) {
    #support-categories {
        display: flex;
        flex-flow: column nowrap;
        row-gap: 2em;
    }

    #support-categories:first-child {
        margin-top: 2em;
    }

    ul.support-article-list {
        min-height: unset !important;
    }
}