@import "../../src/variables";
@import "../../src/mixins";

$selected-color: white;
$selected-bg: $brand-primary;

$focused-shadow-color: $brand-primary;


.popup-body{
  .search-block{
    padding: 5px;
    height:44px;
    position:absolute;
    top: 0;
    width: 100%;
  }
  .result-block{
    position:absolute;
    top: 44px;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    .left-pane{
      margin: 0;
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 40%;
      overflow-y: auto;
      overflow-x: hidden;

    }
    .result-list{
      list-style:none;
      padding: 0;
      &.focused{
        border: solid 1px $brand-primary;
      }
      li{
        a{
          display:block;
          padding: 5px 10px;
          border-bottom: 1px solid $border-color;

          &.selected{
            color: $selected-color;
            background-color: $selected-bg;
          }

          &:hover{
          }
        }
      }
      border-right: 1px solid $border-color;
    }
    .right-pane{
      position: absolute;
      left: 40%;
      top: 0;
      bottom: 0;
      width: 60%;
      overflow-y: auto;
      overflow-x: hidden;

    }

    .result-detail-control{
      position: absolute;
      top: 0;
      width: 100%;
      height: 34px;
    }
    .result-detail-content{
      position: absolute;
      top: 34px;
      bottom: 0;
      width: 100%;
    }
  }

}