/* Copyright (c) 2012 The Chromium Authors. All rights reserved.
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file. */

list,
grid {
  display: block;
  outline: none;
  overflow: auto;
  position: relative; /* Make sure that item offsets are relative to the
                         list. */
}

list > *,
grid > * {
  -webkit-user-select: none;
  background-color: rgba(255, 255, 255, 0);
  border: 1px solid rgba(255, 255, 255, 0); /* transparent white */
  border-radius: 2px;
  cursor: default;
  line-height: 20px;
  margin: -1px 0;
  overflow: hidden;
  padding: 0 3px;
  position: relative; /* to allow overlap */
  text-overflow: ellipsis;
  white-space: pre;
}

list > * {
  display: block;
}

grid > * {
  display: inline-block;
}

list > [lead],
grid > [lead] {
  border-color: transparent;
}

list:focus > [lead],
grid:focus > [lead] {
  border-color: hsl(214, 91%, 65%);
  z-index: 2;
}

list > [anchor],
grid > [anchor] {

}

list:not([disabled]) > :hover,
grid:not([disabled]) > :hover {
  background-color: hsl(214, 91%, 97%);
  border-color: hsl(214, 91%, 85%);
  z-index: 1;
}

list > [selected],
grid > [selected] {
  background-color: hsl(0, 0%, 90%);
  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.8),
                                            rgba(255, 255, 255, 0));
  border-color: hsl(0, 0%, 85%);
  z-index: 2;
}

list:focus > [selected],
grid:focus > [selected] {
  background-color: hsl(214, 91%, 89%);
  border-color: hsl(214, 91%, 65%);
}

list:focus > [lead][selected],
list > [selected]:hover,
grid:focus > [lead][selected],
grid > [selected]:hover {
  background-color: hsl(214, 91%, 87%);
  border-color: hsl(214, 91%, 65%);
}

list > .spacer,
grid > .spacer {
  border: 0;
  box-sizing: border-box;
  display: block;
  margin: 0;
  overflow: hidden;
  visibility: hidden;
}

list :-webkit-any(
    input[type='input'],
    input[type='password'],
    input[type='search'],
    input[type='text'],
    input[type='url']),
list :-webkit-any(
    button,
    input[type='button'],
    input[type='submit'],
    select):not(.custom-appearance) {
  line-height: normal;
  margin: 0;
  vertical-align: middle;
}

list > [hidden],
grid > [hidden] {
  display: none;
}

list > .drag-selection-border {
  border-radius: 0;
  background-color: rgba(255, 255, 255, 0.3);
  border: 2px solid rgba(255, 255, 255, 0.6);
  outline: 1px solid rgba(0, 0, 0, 0.1);
  position: absolute;
  z-index: 2;
}