/* component styles */
.hide:not(.match-in-children) {
  display: none;
}

.react-dropdown-tree-select {
  .dropdown {
    position: relative;
    display: table;

    .dropdown-trigger {
      padding: 4px;
      line-height: 20px;
      max-height: 200px;
      display: inline-block;
      overflow: auto;
      border: 1px solid rgb(185, 185, 185);

      &.arrow {
        cursor: pointer;

        &.bottom::after {
          content: '\25BC';
          vertical-align: middle;
          color: #3c3c3c;
          margin-right: 2px;
        }

        &.top::after {
          content: '\25B2';
          vertical-align: middle;
          color: #3c3c3c;
          margin-right: 2px;
        }

        &.disabled {
          cursor: not-allowed;

          &.bottom::after {
            color: rgb(185, 185, 185);
          }
        }
      }
    }

    .dropdown-content {
      position: absolute;
      padding: 4px;
      z-index: 1;
      background: white;
      border-top: rgba(0, 0, 0, 0.05) 1px solid;
      box-shadow: 0 5px 8px rgba(0, 0, 0, 0.15);

      .search {
        width: 100%;
        border: none;
        border-bottom: solid 1px #ccc;
        outline: none;
      }

      ul {
        margin: 0;
        padding: 0;
      }
    }
  }
}
