/*
 * jsTree PhotonUI theme 1.0
 * Based on jsTree Apple theme
 * Supported features: dots/no-dots, icons/no-icons, focused, loading
 * Supported plugins: ui (hovered, clicked), checkbox, contextmenu, search
 */

.jstree-photonui{
	-webkit-font-smoothing: antialiased;
	font-family: Arial, sans-serif;
    text-align: left;
    margin-bottom: @baseLineHeight;
}
.jstree-photonui li,
.jstree-photonui ins {
	background-image:url("d.png");
	background-repeat:no-repeat;
	background-color:transparent;
	background-size: 108px 96px;
}
.jstree-photonui li {
	background-position:-90px 0;
	background-repeat:repeat-y;
    min-height: @baseLineHeight;
    line-height: @baseLineHeight;
    overflow: hidden;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    .photon-text(lighter, @baseFontSize, none, (@baseLineHeight - 3px));
}
.jstree.jstree-photonui > ul > li {
    &:first-child{
        padding-top: 5px;
	}
}
.jstree.jstree-photonui a > ins{
    width: 18px;
}
.jstree-photonui li.jstree-last {
	background:transparent;
}
.jstree-photonui .jstree-open > ins {
	background-position:-72px 0;
}
.jstree-photonui .jstree-open > a > ins {
    background-position:-56px -37px;
    &.jstree-icon {
        height: 14px;
    }
}
.jstree-photonui .jstree-closed > ins {
	background-position:-54px 0;
}
.jstree-photonui .jstree-leaf > ins {
	background-position:-36px 0;
}
.jstree.jstree-photonui .jstree-hovered {
    background: #3E4651; border:none; padding: 0px 2px;
    border: 1px solid #2E3641;
    color: @white;
    text-shadow: 0 2px 1px rgba(0, 0, 0, 0.3);
    .box-shadow(inset 4px 4px 8px -3px #363D46);
    .border-radius(4px);
}
.jstree.jstree-photonui .jstree-clicked {
    border:none; padding: 1px 3px;
    #gradient.vertical(@white, @grayLighter);
    color: @grayDark;
    text-shadow: 0 1px 1px white;
    .box-shadow(1px 0 1px rgba(0, 0, 0, 0.3));
    .border-radius(4px);
}
.jstree.jstree-photonui .jstree-clicked > ins{
    background-position:-74px -19px;
}
.jstree.jstree-photonui a{
    max-width: 85%;
    display: inline;
    height: 17px;
    padding: 1px 3px;
    .photon-text(lighter, @baseFontSize, 0 2px 1px rgba(0, 0, 0, 0.3), (@baseLineHeight - 3px));
}
.jstree-photonui a .jstree-icon {
	background-position:-56px -19px;
}
.jstree-photonui a.jstree-loading .jstree-icon {
	background:url("throbber.gif") center center no-repeat !important;
}
.jstree-photonui.jstree-focused {
	background:transparent;
}
.jstree-photonui .jstree-no-dots li,
.jstree-photonui .jstree-no-dots .jstree-leaf > ins {
	background:transparent;
}
.jstree-photonui .jstree-no-dots .jstree-open > ins {
	background-position:-18px 0;
}
.jstree-photonui .jstree-no-dots .jstree-closed > ins {
	background-position:0 0;
}
.jstree-photonui .jstree-no-icons a .jstree-icon {
	display:none;
}
.jstree-photonui .jstree-search {
	font-style:italic;
}
.jstree-photonui .jstree-no-icons .jstree-checkbox {
	display:inline-block;
}
.jstree-photonui .jstree-no-checkboxes .jstree-checkbox {
	display:none !important;
}
.jstree-photonui .jstree-checked > a > .jstree-checkbox {
	background-position:-37px -19px;
}
.jstree-photonui .jstree-unchecked > a > .jstree-checkbox {
	background-position:-1px -19px;
}
.jstree-photonui .jstree-undetermined > a > .jstree-checkbox {
	background-position:-19px -19px;
}
.jstree-photonui .jstree-checked > a > .checkbox:hover {
	background-position:-37px -37px;
}
.jstree-photonui .jstree-unchecked > a > .jstree-checkbox:hover {
	background-position:-1px -37px;
}
.jstree-photonui .jstree-undetermined > a > .jstree-checkbox:hover {
	background-position:-19px -37px;
}
.jstree li[rel="file"] > a > ins.jstree-icon {
    background-image: url("file.png");
    background-position: 0 0;
    background-size: 18px 16px;
}
#vakata-dragged {
    .photon-text(lighter, @baseFontSize, none, (@baseLineHeight - 3px));
    opacity: 0.7;
}
#vakata-dragged.jstree-photonui ins {
    background:transparent !important;
}
#vakata-dragged.jstree-photonui .jstree-ok {
    background:url("d.png") -1px -54px no-repeat !important;
    background-size: 108px 96px !important;
}
#vakata-dragged.jstree-photonui .jstree-invalid {
    background:url("d.png") -18px -54px no-repeat !important;
    background-size: 108px 96px !important;
}
#jstree-marker.jstree-photonui {
    background:url("d.png") -40px -56px no-repeat !important;
    background-size: 108px 96px !important;
    text-indent:-100px;
}
.jstree-photonui a.jstree-search {
	color:aqua;
}
.jstree-photonui .jstree-locked a {
	color:silver;
	cursor:default;
}
#vakata-contextmenu.jstree-photonui-context,
#vakata-contextmenu.jstree-photonui-context li ul {
	background:#f0f0f0;
	border:1px solid #979797;
	-moz-box-shadow: 1px 1px 2px #999;
	-webkit-box-shadow: 1px 1px 2px #999;
	box-shadow: 1px 1px 2px #999;
}
#vakata-contextmenu.jstree-photonui-context li {
}
#vakata-contextmenu.jstree-photonui-context a {
	color:black;
}
#vakata-contextmenu.jstree-photonui-context a:hover,
#vakata-contextmenu.jstree-photonui-context .vakata-hover > a {
	padding:0 5px;
	background:#e8eff7;
	border:1px solid #aecff7;
	color:black;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}
#vakata-contextmenu.jstree-photonui-context li.jstree-contextmenu-disabled a,
#vakata-contextmenu.jstree-photonui-context li.jstree-contextmenu-disabled a:hover {
	color:silver;
	background:transparent;
	border:0;
	padding:1px 4px;
}
#vakata-contextmenu.jstree-photonui-context li.vakata-separator {
	background:white;
	border-top:1px solid #e0e0e0;
	margin:0;
}
#vakata-contextmenu.jstree-photonui-context li ul {
	margin-left:-4px;
}

@media (max-width: 768px) {
    .jstree.jstree-photonui{
        width: 100%;
    }
    .jstree-photonui li {
        background-image: none;
    }
    .jstree-photonui ins {
        background-size: 108px 96px;
    }
    .jstree.jstree-photonui li{
        padding: (@baseLineHeight /2  - 2px) 0;
        border-top: 1px solid #4f5660;
        border-bottom: 1px solid #2b3139;
        margin-left: 0;
    }
    .jstree.jstree-photonui .jstree-open{
        padding: (@baseLineHeight /2  - 1px) 0;
        padding-top: 6px !important;
        padding-bottom: 0;
        border-bottom: 0;
        border: none;
        background-color: rgba(50, 57, 68, 0.4);
        .box-shadow(inset 0 6px 3px -5px #262e38);

        li:last-child{
            .box-shadow(inset 0 -6px 3px -5px #262e38);
        }
        &+.jstree-open{
            border-top: 1px solid #4f5660;
            background-color: rgba(50, 57, 68, 0.2);
            .box-shadow(none);
        }
    }
    li.jstree-open > ul{
        border-top: 1px solid #2b3139;
        margin-top: (@baseLineHeight /2 - 1px);
    }

    .jstree.jstree-photonui li > ins{
        width: 21px;
        height: 21px;
    }

    .jstree.jstree-photonui a{
        position: relative;
        top: 3px;
    }
    .jstree-photonui .jstree-leaf > ins{
        background: transparent;
    }

    .jstree-photonui .jstree-no-dots .jstree-closed > ins,
    .jstree-photonui .jstree-closed > ins {
        background-position: -53px -75px;
    }

    .jstree-photonui .jstree-no-dots .jstree-open > ins,
    .jstree-photonui .jstree-open > ins {
        background-position: -53px -54px;
    }

    // INSET CONTROL
    .jstree.jstree-photonui > ul > li {
        // root level
        & > ins{
            margin-left: 15px;
            margin-right: 5px;
        }

        // 1st level
        & > ul > li {

            & > ins{
                margin-left: (@baseLineHeight *2);
            }

            // 2nd level
            & > ul > li {
                & > ins{
                    margin-left: (@baseLineHeight *3);
                }
            }
        }
    }
}
