/* =============================================================== */
/* Jstree CSS Overrides */
/* =============================================================== */
.jstree-default-dark {
    /* tree background */
    /*background: transparent;*/
    background-color: #212529;
}
.jstree-clicked {
    /* Styles for selected element: */
    border-top-left-radius: 6px !important;
    border-bottom-left-radius: 6px !important;

    /* to disable item selection by click */
    /*
    background: none !important;
    box-shadow: none !important;
    */
    /* OR */
    /*
    background-color: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
    */
}
.jstree-default-dark .jstree-clicked {
    /* Selected element for dark theme */
    background: rgb(0, 102, 153, 0.3) !important;

}
.jstree-default .jstree-clicked {
    /* Selected element for light theme */
    background: rgb(0, 102, 153, 0.3) !important;
}
@media (min-width: 768px) {
    .jstree-default-large .jstree-node.jstree-leaf.jstree-last {
        /* Fix visual problem caused by overlapping dots (for light theme) */
        background-position-y: -78px;
        background-repeat: no-repeat;
        background-image: url(themes/default/32px.png);
    }
    .jstree-default-dark-large .jstree-node.jstree-leaf.jstree-last {
        /* Fix visual problem caused by overlapping dots (for dark theme) */
        background-position-y: -78px;
        background-repeat: no-repeat;
        background-image: url(themes/default-dark/32px.png);
    }
}


/* =============================================================== */
/* jsTree general */
/* =============================================================== */
.jstree .jstree-anchor .text-primary {
    /* link elements */
    color: var(--color-primary) !important;
}

/* =============================================================== */
/* jsTree desktop container */
/* =============================================================== */
.jstree-desktop .jstree {
    /*border-top: 2px solid #cccccc;*/
    border-left: 2px solid #cccccc;
    border-right: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    /*border-top-right-radius: 10px;*/
    /*border-bottom-right-radius: 10px;*/
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 90%;
    background-color: #eeeeee;
    /*margin: 10px;*/

    /*margin-right: 28px;*/
    overflow-x: auto;
    /*overflow-y: scroll;*/
}
.jstree-desktop .btn-close-tree {
    /*position: absolute;
    top: 0;
    right: 19px;*/
}
.jstree-desktop .jstree .jstree-node i.bi {
    /* Icon size for nodes */
    font-size: 133%;
}
.jstree-desktop .tree-header {
    border-bottom: 2px solid #cccccc;
    background-color: #eeeeee;
}
.jstree-desktop .tree-header-title {
    display: inline-block;
    /*border-left: 1px solid #f00;*/
    /*border-top: 1px solid #f00;*/
    /*border-right: 1px solid #f00;*/
    border-top-right-radius: 10px;
    padding: 2px 8px;
    background-color: #cccccc;
    height: 32px;
}
.jstree-desktop .tree-header-btn-close, .jstree-desktop .tree-header-btn-search, .doc-section-btn-tree-open {
    padding: 2px 5px;
    margin-top: 2px;
    margin-right: 2px;
}
.jstree-desktop .tree-header-btn-search {
    /*width: inherit;
    padding: inherit;
    font-size: inherit;
    color: inherit;
    background-color: inherit;
    border: inherit;
    border-radius: inherit;*/
    position: relative;
    display: flex;
    align-items: center;
    text-align: left;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
    margin-top: 2px;
}

.jstree-desktop .tree-header-btn-search:not(.collapsed)::after {
    background-image: var(--bs-accordion-btn-active-icon);
    transform: var(--bs-accordion-btn-icon-transform);

    /* Add for correct for small size icon */
    background-position-y: 0;
    background-position-x: 0;
}

.jstree-desktop .tree-header-btn-search::after {
    flex-shrink: 0;
    width: var(--bs-accordion-btn-icon-width);
    height: var(--bs-accordion-btn-icon-width);
    margin-left: auto;
    content: "";
    background-image: var(--bs-accordion-btn-icon);
    background-repeat: no-repeat;
    background-size: 1rem; /* small size | orig: var(--bs-accordion-btn-icon-width) */
    transition: var(--bs-accordion-btn-icon-transition);

    /* Add for correct for small size icon: */
    background-position-y: 0.25rem;
    background-position-x: 0.25rem;
}

.jstree-desktop .search-accordion-desktop {
    border-left: 2px solid #cccccc;
    border-right: 2px solid #ffffff;
    border-bottom: 2px solid #cccccc;
    box-sizing: content-box;
}

/* =============================================================== */
/* jsTree mobile container */
/* =============================================================== */
.jstree-mobile .jstree .jstree-node i.bi {
    /* Icon size for nodes */
    font-size: 166%;
}

.jstree-mobile .jstree {
    padding-top: 15px;
    padding-bottom: 10px;
    font-size: 85%;
    /*background-color: #eeeeee;*/
    /*margin: 10px;*/

    /*margin-right: 28px;*/
    overflow-x: auto;
}
.jstree-mobile .accordion-header .btn-group {
    width: 100%;
}
.jstree-mobile .accordion-header button {
    width: 50%;
}
.jstree-mobile .accordion-body {
    padding: 0;
}
.jstree-mobile {
    overflow-x: scroll;
}
.jstree-mobile .accordion-header button {
    padding: 10px;
    border-radius: 0;
}
.jstree-mobile .accordion-header button.btn-tree-mobile-navigation {
    border-right: 1px solid #eeeeee;
}
.jstree-mobile .accordion-header button.btn-tree-mobile-search {
    border-left: 1px solid #eeeeee;
}
#jtree_mobile li {
    border-bottom: 1px solid #e8e8e8;
}

