/*
 * GNU AGPL-3.0 License
 *
 * Copyright (c) 2021 - present core.ai . All rights reserved.
 * Original work Copyright (c) 2012 - 2021 Adobe Systems Incorporated. All rights reserved.
 *
 * This program is free software: you can redistribute it and/or modify it
 * under the terms of the GNU Affero General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful, but WITHOUT
 * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
 * FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License
 * for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program. If not, see https://opensource.org/licenses/AGPL-3.0.
 *
 */


/* Styles for jsTree control */
/* (these are based on jsTree's default theme .css file, so they are not very LESS-like) */
@li-min-height: 23px;

.jstree ul, .jstree li { display:block; margin:0 0 0 0; padding:0 0 0 0; list-style-type:none; z-index:1; }
.jstree li { display:block; min-height:@li-min-height; line-height:16px; white-space:nowrap; min-width:18px; }
.jstree-rtl li { margin-left:0; margin-right:18px; }
.jstree > ul > li { margin-left:0; }
.jstree-rtl > ul > li { margin-right:0; }
.jstree ins { display:inline-block; text-decoration:none; width:18px; height:18px; margin:0 0 0 0; padding:0; }
.jstree a:focus { outline: none; box-shadow: none; color: @project-panel-text-1; }
.jstree a > ins { height:16px; width:16px; }
.jstree a > .jstree-icon { margin-right:3px; }
.jstree-rtl a > .jstree-icon { margin-left:3px; margin-right:0; }
li.jstree-open > ul { display:block; }
li.jstree-closed > ul { display:none; }

.jstree-brackets li,
.jstree-brackets ins { background-image:url("images/jsTreeSprites.svg"); background-repeat:no-repeat; background-color:transparent; }
.jstree-brackets li { background-position:-90px 0; background-repeat:repeat-y; }
.jstree-brackets li.jstree-last { background:transparent; }
.jstree-brackets .jstree-open > ins { background-position:-72px 0; }
.jstree-brackets .jstree-closed > ins { background-position:-54px 0; }
.jstree-brackets .jstree-leaf > ins { background-position:-36px 0; }

.jstree-brackets li a:hover {
    text-decoration: none;
}

.jstree-draggedOver {
    background-color: @bc-sidebar-selection !important;
}

.jstree-dragImage {
    position: absolute;
    background-color: #66676B;
    padding: 4px 8px 3px 8px;
    color: #fff;
}

@jstree-icon-backindent: 12px;

/* Make the links in the JS tree the width of the container
 * by shifting the off the screen by negative margin and moving the
 * content back by pushing the padding. The icons are positioned absolute
 * relative to the containing list item so they sit above the a's background.
 * This also means we need to include the size of the sprite in the padding
 * so the text ends up back in the same spot visually
 */
.jstree-brackets li > a {
    @jstree-icon-text-overlap: 2px;
    padding-left: (@jstree-sprite-size - @jstree-icon-backindent - @jstree-icon-text-overlap);
    display: block;
}

.jstree li {
    position: relative;
}

.jstree-brackets li {
    vertical-align: baseline;
    a,
    a:hover {
        color: @project-panel-text-1;
        font-size: 14px;
        cursor: default;

        &.jstree-clicked, &.jstree-clicked .extension {
            color: @open-working-file-name-highlight;
        }
    }
    .extension {
        color: @project-panel-text-2;
    }
    &.jstree-closed, &.jstree-open {
        > a {
            color: @project-panel-text-2;
        }
    }
}

.jstree ins {
    position: absolute;
}
ins.jstree-icon {
    left: -@jstree-icon-backindent !important;
}

.jstree-brackets a .jstree-icon { background-position:-56px -19px; }
.jstree-brackets a.jstree-loading .jstree-icon { background:url("images/throbber.gif") center center no-repeat !important; }

.jstree-brackets li > a {
    padding-top: 3px;
    padding-bottom: 3px;
}
.jstree-brackets li > ins {
    margin-top: 2px;
    margin-bottom: 2px;
}

// These styles control the expand/collapse arrow icons. Most other styles in this file with background-position are unused.
.jstree-brackets .jstree-no-dots li,
.jstree-brackets .jstree-no-dots .jstree-leaf > ins { background:transparent; }
.jstree-brackets .jstree-no-dots .jstree-open > ins { background-position:-18px 0; }
.jstree-brackets .jstree-no-dots .jstree-closed > ins { background-position:0 0; }

.jstree-brackets .jstree-no-icons a .jstree-icon { display:none; }

.jstree-brackets .jstree-search { font-style:italic; }

.jstree-brackets .jstree-no-icons .jstree-checkbox { display:inline-block; }
.jstree-brackets .jstree-no-checkboxes .jstree-checkbox { display:none !important; }
.jstree-brackets .jstree-checked > a > .jstree-checkbox { background-position:-38px -19px; }
.jstree-brackets .jstree-unchecked > a > .jstree-checkbox { background-position:-2px -19px; }
.jstree-brackets .jstree-undetermined > a > .jstree-checkbox { background-position:-20px -19px; }
.jstree-brackets .jstree-checked > a > .jstree-checkbox:hover { background-position:-38px -37px; }
.jstree-brackets .jstree-unchecked > a > .jstree-checkbox:hover { background-position:-2px -37px; }
.jstree-brackets .jstree-undetermined > a > .jstree-checkbox:hover { background-position:-20px -37px; }

#vakata-dragged.jstree-brackets ins { background:transparent !important; }
#vakata-dragged.jstree-brackets .jstree-ok { background:url("images/jsTreeSprites.svg") -2px -53px no-repeat !important; }
#vakata-dragged.jstree-brackets .jstree-invalid { background:url("images/jsTreeSprites.svg") -18px -53px no-repeat !important; }
#jstree-marker.jstree-brackets { background:url("images/jsTreeSprites.svg") -41px -57px no-repeat !important; text-indent:-100px; }

.jstree-brackets a.jstree-search { color:aqua; }
.jstree-brackets .jstree-locked a { color:silver; cursor:default; }

#project-files-container .jstree-brackets .jstree-rename-input {
    background: #000;
    border: 1px solid #000;
    border-radius: 2px;
    box-shadow: @bc-shadow-small;
    box-sizing: border-box;
    color: #fff;
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    left: 3px !important;
    top: 2px !important;
    margin: 0;
    margin-bottom: 5px; /* It should instead be applyed only to folders */
    padding: 0;
    position: relative;
    width: 150px;
    height: 17px;
    line-height: 17px;
}

#project-files-container .jstree-brackets .jstree-rename-input:focus {
    border: 1px solid @bc-btn-border-focused;
    box-shadow: none;
    outline: none;
}

#vakata-contextmenu.jstree-brackets-context,
#vakata-contextmenu.jstree-brackets-context li ul { background:#f0f0f0; border:1px solid #979797; box-shadow: 1px 1px 2px #999; }
#vakata-contextmenu.jstree-brackets-context li { }
#vakata-contextmenu.jstree-brackets-context a { color:black; }
#vakata-contextmenu.jstree-brackets-context a:hover,
#vakata-contextmenu.jstree-brackets-context .vakata-hover > a { padding:0 5px; background:#e8eff7; border:1px solid #aecff7; color:black; border-radius:2px; }
#vakata-contextmenu.jstree-brackets-context li.jstree-contextmenu-disabled a,
#vakata-contextmenu.jstree-brackets-context li.jstree-contextmenu-disabled a:hover { color:silver; background:transparent; border:0; padding:1px 4px; }
#vakata-contextmenu.jstree-brackets-context li.vakata-separator { background:white; border-top:1px solid #e0e0e0; margin:0; }
#vakata-contextmenu.jstree-brackets-context li ul { margin-left:-4px; }