/*
   filter-form-controls.css
*/

/* Focus Highlight */
#fltr_keywords:focus,
#fltr_keywords.focus,
#fltr_keywords_btn:focus,
#fltr_keywords_btn.focus  {
   box-shadow: 0 0 0 0.2rem rgba(51, 122, 183, 0.25);
}

#selectedFiltersBin:focus,
#selectedFiltersBin.focus {
   box-shadow: 0 0 0 0.2rem rgba(51, 122, 183, 0.25);
}

.tree-searchbox:focus,
.tree-searchbox.focus {
   box-shadow: 0 0 0 0.2rem rgba(51, 122, 183, 0.25);
}

.tagBuilderTag:focus,
.tagBuilderTag.focus {
   box-shadow: 0 0 0 0.2rem rgba(51, 122, 183, 0.25);
}

.slider-handle:focus,
.slider-handle.focus {
   box-shadow: 0 0 0 0.2rem rgba(51, 122, 183, 0.25);
}

/* #fltr_keywords:focus,
#fltr_keywords_btn:focus,
#fltr_keywords_btn:focus-within {
   box-shadow: 0 0 5px rgba(81, 203, 238, 1);
   padding: 3px 0px 3px 3px;
   margin: 5px 1px 3px 0px;
   border: 1px solid rgba(81, 203, 238, 1);
} */

#sitsol_filters label {
   text-transform: capitalize;
}

#sitsol_filters .dropdown-menu {
   z-index: 190; /* jan sticky header = 199 */
}

#sitsol_filters .scrollable-menu {
    height: auto;
    max-height: 40vh; /* smallest */
    /* max-height: 475px;*/
    overflow-x: hidden;
    padding: 0.5em;
}

/* Media queries by Height */
@media (min-height: 360px){
   #sitsol_filters .scrollable-menu {
      max-height: 42vh;
   }
}
@media (min-height: 720px){
   #sitsol_filters .scrollable-menu {
      max-height: 45vh;
   }
}
@media (min-height: 1080px){
   #sitsol_filters .scrollable-menu {
      max-height: 50vh;
   }
}


/* not needed -- with jsTree themes --
   #sitsol_filters .scrollable-menu ul {
      list-style: none !important;
      margin-left: 0;
      padding-left: 0;
   }
*/

#sitsol_filters .scrollable-menu li {
   /* not needed -- with jsTree themes -- 
       list-style: none !important; */
   
   /*padding: 0.3em;
   border-bottom: 1px #bbbbbb solid;*/
}

#sitsol_filters .scrollable-menu a {
   padding: 0.3em;
   border-bottom: 1px #bbbbbb solid;
}

#sitsol_filters .scrollable-menu li a {
   text-transform: capitalize;
}

#sitsol_filters .tagBuilderWrapper {
   min-height: 4em;
   padding-top: 1.0em;
   padding-bottom: 0.5em;
   margin-bottom: 0;
}

.tagBuilderWrapper .tagBuilderBin {
    min-height: 0;
}

.tagBuilderTagText {
   text-transform: capitalize;
}

/*.slider.slider-horizontal {
   margin-bottom: 24px;
}*/

/*#sitsol_filters .scrollable-menu li a.dd-option:first-letter {
    text-transform: uppercase;
}*/

/*
#sitsol_filters .dropdown-menu .scrollable-menu {

}*/

/*
.tag-disability {
   background-color: #012C5F;
}

.tag-limitation {
   background-color:
   //background-color: #365d70; // #82B2CA; //#548fac:  // #00A3EC;
   // background-color: #d1ecfb;
}

.tag-occupation {
   background-color: #365d70; // #00A990;
   // background-color: #a2efe0;
}

.tag-other {
   background-color: #dedede;
}*/

.slider.slider-horizontal{
  width: 86%;
  margin-left: 2em;
  margin-right: 2em;
}


#jstree_disability a,
#jstree_limitation a,
#jstree_occupation a {
    white-space: normal !important;
    height: auto;
    padding: 1px 2px;
}

#jstree_disability i,
#jstree_limitation i,
#jstree_occupation i  {
  display: none;
}

.jstree-default .jstree-node {
    margin-left: 12px;
   /* margin-left: 1rem;*/
    /*min-width: 24px;*/
}

.tree-searchbox {
   max-height: 1.6rem;
   margin-bottom: 0.5rem
}

.form-control-sm.tree-searchbox {
   margin-left: auto;
   margin-right: auto;
   width: 94%
}



/********************** Optional Media Queries **********************/



/* Media queries by Height */
/* -- Set default to smallest */
@media (min-height: 360px){}
@media (min-height: 720px){}
@media (min-height: 1080px){}
@media (min-height: 1200px){}
@media (min-height: 1440px){}

/* X-Small devices (portrait phones, less than 576px) */
/* -- No media query for `xs` since this is the default in Bootstrap */
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {}
/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}
/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {}