/*
   control-tag-builder.css
*/

tagBuilderWrapper {
  width: 100%;
  margin: auto;
  background-color: #fff;
  position: relative;
  padding: 60px;
  box-sizing: border-box;
  overflow: hidden;
}

/*.tagBuilderWrapper {
!*.tb-wrapper {*!
  width: 100%; !* 800px *!
  margin: auto;
  background-color: #fff;
  position: relative;
  !*top: 20vh;*!
  padding: 60px;
  box-sizing: border-box;
  !*font-family: 'Open Sans', sans-serif;*!
  border: 1px solid black;
  border-radius: 15px;
  overflow: hidden;
}*/

.tagBuilderWrapper .tagBuilderBin {
  position: relative;
  min-height: 4rem;
  width: 100%;
  padding: 5px;
  /*border: 1px solid blue;*/
}

.tagBuilderWrapper .tagBuilderFieldLabel {
   font-size: 0.9rem;
   color: #999;
   margin-bottom: 0.25rem;
}

.tagBuilderWrapper input {
  width: 100% !important;
  padding: 10px 15px;
  box-sizing: border-box;
  border: 2px solid rgba(176, 176, 176, 0.2);
  height: 45px;
  border-radius: 4px;
  outline-color: #c5c7d6;
  margin-bottom: 10px;
}

.tagBuilderWrapper input::placeholder {
  color: #aaa;
}

.tagBuilderWrapper .tagBuilderMsg {
   font-size: 0.85em;
   color: #777;
   font-style: italic;
   margin-top: 0;
   margin-top: 0.5em;
   margin-bottom: 0.5em;
   padding: 0;
   padding-left: 1em;
}

.tagBuilderTag {
   /*max-width: 90%;*/
   color: #FFF;
   font-size: 0.95rem;

   white-space:normal !important;
   overflow-wrap: break-word;
   word-wrap: break-word;
   hyphens: auto;
}

.tagBuilderTagText {
   /*max-width: 96%;*/
   /*display: inline-block;*/

   /* overflow-wrap: break-all;
   word-wrap: break-word;
   hyphens: auto; */
}

.tagBuilderTagText > i {
   /*display: block;*/
}

@media only screen and (max-width: 992px) {

   .tagBuilderTagText {
      /*max-width: 94%;*/
      /*max-width: 580px;*/
      font-size: 0.9rem;

      /* text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden; */
   }

}

@media only screen and (max-width: 768px) {

   .jstree-default-responsive .jstree-anchor {
      font-size: 0.9rem;
      line-height: 20px;
   }

}

@media only screen and (max-width: 620px) {

   .tagBuilderTagText {
      /*max-width: 92%;*/
      /*max-width: 305px;*/
      font-size: 0.8rem;
   }

}

@media only screen and (max-width: 414px) {

   .tagBuilderTagText {
      /*max-width: 225px;*/
      font-size: 0.75rem;
   }

}

@media only screen and (max-width: 390px) {

   .tagBuilderTagText {
      /*max-width: 88%;*/
      /*max-width: 225px;*/
      /*font-size: 0.72rem;*/
   }

}