// (C) Copyright 2020 Hewlett-Packard Enterprise Company, L.P.

.hp-master-grid {
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0px -5px;
  opacity: 1;
  @include transition-property(opacity);
  @include transition-duration(0s);
  
  &:focus {
    outline: none;
  }
  
  &.hp-changing {
    opacity: $changing-opacity;
    @include transition-delay($changing-animation-delay);
    @include transition-duration($normal-animation-duration);
  }
  
  .hp-master-grid-item {
    @include box-sizing(border-box);
    display: inline-block;
    vertical-align: top;
    margin: 5px;
    min-width: 180px;
    color: $secondary-color;
    background-color: $grid-item-background;
    border: 1px solid $grid-item-outline;
    cursor: pointer;
    
    html.hp-high-contrast & {
      color: $projection-secondary-color;
    }
  
    &:hover {
      background-color: $primary-background;
      color: $primary-color;
      border-color: $grid-item-outline-selected;
      
      html.hp-high-contrast & {
        color: $projection-color;
      }
      
      > header {
        background-color: $primary-background;
      }
    }
    
    &.hp-selected {
      border: 1px solid $grid-item-outline-selected;
      color: $primary-color;
      
      html.hp-high-contrast & {
        color: $projection-color;
      }
      
      > header {
        background-color: $selected-background;
      }
      
      .hp-master-item-summary {
        background-color: $primary-background;
      }
    }
    
    > header {
      padding: 5px 10px;
      color: #000;
      
      > * {
        display: inline-block;
        vertical-align: top;
      }
      > .hp-status {
        position: relative;
        top: 2px;
      }
      .hp-master-item-name { 
        word-break: break-all; 
      } 
    }
    
    label {
      color: $secondary-color;
      
      html.hp-high-contrast & {
        color: $projection-secondary-color;
      }
    }
    
    .hp-master-item-summary, .hp-master-item-details {
      position: relative;
      padding: 10px;
      .hp-column-form {
        width: auto;
        display: inline-block;
        vertical-align: top;
        margin-right: 80px;
      }
    }
    
    .hp-master-item-summary {
      background-color: $special-background; 
      
      .hp-master-item-summary-items li {
        display: inline-block;
        margin-right: 10px;
        margin-bottom: 5px;
      }
    }
    
    .hp-master-item-details {
      display: none;
    }
  }
  
  #hp-master-load-more, #hp-master-load-more-above {
    display: inline-block;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 15px;
    color: $text-link-color;
  }
  
  .hp-master-grid-control {
    padding: 15px 5px;
    
    .hp-master-grid-empty {
      margin-bottom: 15px;
      
      html.hp-high-contrast & {
        color: $projection-secondary-color;
      }
    }
    a:not(.hp-disabled) {
      color: $text-link-color;
      display: block;
      margin-top: 10px;
    }
  }
}

div.hp-master-pane {
  .hp-master-grid {
    display: none;
    
    &.hp-active {
      display: block;
    }
    
    &.hp-empty {
      display: none;
    }
  }
}

div.hp-master-full {
  .hp-master-grid {
    margin-top: 10px;
    margin-bottom: 10px;
  }
}
