// This module follows the Block__element--modifier syntax
// branch.com/b/mindbemding-getting-your-head-round-bem-syntax

// DROPDOWN TRIGGER
.dropdown--opened {
  .btn-default {
    &.btn {
      &.dropdown__toggle {
        background-color:#fff;
        border-bottom:none;
        border-radius:$border-radius-base $border-radius-base 0 0;
        position:relative;
        z-index:501;
      }
      &:hover {
        box-shadow:none;
      }
    }
  }

  .dropdown__body {
    display: block;
  }
}

// DROPDOWN LIST
.dropdown__menu {
  @extend .dropdown-menu;

  border-radius:0 5px 5px;
  box-shadow:none;
  margin:-1px 0 0;
  position: absolute;
  width:120%;
  z-index:992;

  &.dropdown-lg {
    min-width:220px;
  }

  .dropdown__list {
    max-height:360px;
    min-height:1px;
    overflow-y: scroll;
  }

  > .dropdown-input {
    background:#fff;
    margin:0 14px;
    padding:6px 0;

    input {
      margin-top:8px;
    }
  }

  ul {

    margin-bottom:0;
  }

  li {
    cursor:pointer;
    padding:6px 14px;
    vertical-align:middle;

    &:hover {
      background-color:$blue-read;
      color:#fff;
    }

    label {
      cursor:pointer;
      font-weight:400;
      margin:0;
      overflow:hidden;
      text-overflow:ellipsis;
      vertical-align:middle;
      white-space:nowrap;
      width:100%;
    }

    img {
      height:auto;
      max-width:40px;
    }

  }

}

// COLOR DROPDOWN
.color-dropdown {

  .dropdown-menu {
    border-top-left-radius:0;
    margin-top:-1px;
    padding:0;
    li:first-of-type {
        border-top-right-radius:3px;
    }

    li:last-of-type {
        border-radius:0 0 3px 3px;
    }
  }

  .btn-read ~ .dropdown-menu {
      border-color:$btn-read-border;

      li {

        a {
          color:$blue-read;
        }

        &:hover {
          background-color:$blue-read;

          a {
            background-color:transparent !important;
          }
        }
      }

  }

  .btn-create + .dropdown__menu {
      border-color:$btn-create-border;

      li {

        a {
          color:$orange-create;
        }

        &:hover {
          background-color:$orange-create;
        }
      }

  }

  .btn-update + .dropdown__menu {
      border-color:$btn-update-border;

      li {

        a {
          color:$green-update;
        }

        &:hover {
          background-color:$green-update;
        }
      }

  }

  .btn-destroy + .dropdown__menu {
      border-color:$btn-destroy-border;

      li {

        a {
          color:$red-destroy;
        }

        &:hover {
          background-color:$red-destroy;
        }
      }

  }

  &.open {
    > .btn {
      border-bottom-left-radius:0;
      border-bottom-right-radius:0;
    }
  }

  li {

    padding-bottom:3px;
    padding-top:3px;

    a {
      font-size:$font-size-small;
      font-weight:500;
      padding:3px 14px;

    }

    &:hover {
      a {
        color:#fff !important;
        text-decoration:none;
      }
    }

  }
}

.select2-container {
  width:100%;

   .select2-choice {
    @extend .btn;

    border-radius:$border-radius-base;
    color:$blue-deep !important;
    font-weight:500;
    height:auto !important;
    line-height:$line-height-base !important;
    padding:3px 14px !important;

    .select2-chosen {
      font-size:$font-size-base;
      margin-right:0 !important;
    }

    .select2-arrow {
      background:none !important;
      border:none !important;
    }

   }
}

.select2-drop {

input.select2-input {
  // @extend .form-control;

  border-radius:$border-radius-base !important;
}

.select2-results {
  padding:0 !important;

  .select2-result-label {
    padding:6px $padding-base-horizontal !important;
    width:100%;
  }

}

}