/*!
 * This file is part of the Sonata Project package.
 *
 * (c) Thomas Rabaix <thomas.rabaix@sonata-project.org>
 *
 * For the full copyright and license information, please view the LICENSE
 * file that was distributed with this source code.
 */

.sonata-tree {
  list-style: none;
  margin-left: 15px;
  margin-right: 15px;
  overflow: hidden;
  padding-bottom: 10px;
  padding-left: 0;

  ul {
    list-style: none;
    padding-left: 30px;
  }
}

.sonata-tree__item {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 2px;
  color: #444;
  display: block;
  margin-bottom: 5px;
  margin-right: 10px;
  padding: 7px 15px 7px 7px;
  position: relative;

  .label {
    border-radius: 2px;
    font-size: 12px;
    margin-top: 2px;
  }

  .label-warning {
    margin-right: 5px;
  }

  .fa-caret-right {
    color: #3c8dbc;
    left: -20px;
    position: absolute;
    top: 10px;
  }

  &:hover {
    background: #eee;
    color: #000;
  }

  &.is-toggled .fa-caret-right {
    transform: rotate(90deg);
  }

  &.is-active {
    border: 1px solid #3c8dbc;

    &::after {
      border-color: rgb(255 255 255 / 0%);
      border-left-color: #fff;
      border-width: 8px;
      margin-top: -8px;
    }

    &::after,
    &::before {
      border: solid transparent;
      content: ' ';
      height: 0;
      left: 100%;
      pointer-events: none;
      position: absolute;
      top: 50%;
      width: 0;
    }

    &:hover::after {
      border-left-color: #eee;
    }

    &::before {
      border-color: rgb(255 255 255 / 0%);
      border-left-color: #3c8dbc;
      border-width: 9px;
      margin-top: -9px;
    }
  }
}

.sonata-tree__item__is-hybrid {
  margin-right: 5px;
}

.sonata-tree__item__edit {
  font-weight: bold;

  &:hover {
    text-decoration: underline;
  }
}

/**
 * Smaller tree
 */
.sonata-tree--small {
  margin-left: 0;

  .sonata-tree__item__edit {
    font-size: 12px;
  }

  .sonata-tree__item {
    padding: 3px 15px 4px 5px;

    .fa-caret-right {
      top: 7px;
    }
  }
}

/**
 * Toggleable tree
 */
.sonata-tree--toggleable {
  li > ul {
    display: none;
  }

  .sonata-tree__item {
    margin-left: 20px;

    .fa-caret-right {
      cursor: pointer;

      &::after {
        bottom: -5px;
        content: '';
        left: -10px;
        position: absolute;
        right: -10px;
        top: -5px;
      }
    }

    &:last-child .fa-caret-right {
      display: none;
    }
  }
}
