/*
 * Copyright 2015 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 {
    flex: auto 0 1;
    overflow-y: auto;
    border: 1px solid rgb(231, 231, 231);
    flex-direction: column;
}

.list-separator {
    background: rgb(231, 231, 231);
    height: 1px;
}

.list-item {
    flex: none;
    min-height: 30px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.list-item:hover {
    background: hsl(0, 0%, 96%);
}

.controls-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    align-items: stretch;
    pointer-events: none;
}

.controls-gradient {
    flex: 0 1 50px;
}

.list-item:hover .controls-gradient {
    background-image: linear-gradient(90deg, transparent, hsl(0, 0%, 96%));
}

.controls-buttons {
    flex: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    pointer-events: auto;
    visibility: hidden;
}

.list-item:hover .controls-buttons {
    background-color: hsl(0, 0%, 96%);
    visibility: visible;
}

.editor-container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex: none;
    background: hsl(0, 0%, 96%);
    overflow: hidden;
}

.editor-content {
    flex: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.editor-buttons {
    flex: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 5px;
}

.editor-buttons > button {
    flex: none;
    margin-right: 10px;
}

.editor-content input {
    margin-right: 10px;
}

.editor-content input.error-input {
    background-color: white;
}