// Licensed under the Apache License, Version 2.0 (the "License"); you may not
// use this file except in compliance with the License. You may obtain a copy of
// the License at
//
//   http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
// License for the specific language governing permissions and limitations under
// the License.

@import "../../../../../assets/scss/variables";

#doc-list {
  padding: 30px 0 0 0;
  div.doc-row {
    margin-bottom: 20px;
    .doc-item {
      vertical-align: top;
      position: relative;
      box-shadow: $cf-box-shadow;
      .doc-data {
        border-bottom: 1px solid $cf-jsondocs-data-border;
        border-left: 1px solid $cf-jsondocs-data-border;
        border-right: 1px solid $cf-jsondocs-data-border;
        font-family: monospace;
        .prettyprint--small {
          font-size: 11px;
        }
        .prettyprint--large {
          font-size: 15px;
        }
      }
      header {
        cursor: pointer;
        font-weight: bold;
        position: relative;
        padding: 5px 10px;
        background-color: $cf-jsondocs-header-bg;
        border-bottom: 1px solid $cf-jsondocs-header-border;
        border-left: 1px solid $cf-jsondocs-header-border;
        border-right: 1px solid $cf-jsondocs-header-border;
        border-top: 1px solid $cf-jsondocs-header-border;
        .header-doc-id {
          color: $cf-jsondocs-header-docid;
          margin-left: 0;
          word-wrap: break-word;
          &:hover {
            color: $cf-brand-hightlight-hover;
          }
        }
        .header-keylabel {
          margin-right: 10px;
        }
        .header-keylabel:empty {
          display: none;
        }
        .header-keylabel,
        .fonticon-pencil {
          color: $cf-jsondocs-header-label;
        }
        .doc-edit-symbol {
          position: relative;
        }
        .fonticon-pencil {
          font-size: 16px;
        }
        .fonticon-pencil:hover {
          color: $cf-brand-hightlight-hover;
        }
      }
    }
  }
}

.view #doc-list {
  padding-top: 12px;
}

.show-select {
  #doc-list {
    padding: 0px 0 30px 0;
  }
  .checkbox.inline {
    padding-top: 6px;
    padding-left: 6px;
    padding-right: 1rem;
    label  {
      padding-left: 23px; // 7px to the right-border + 16px around
    }
  }
  .checkbox-dummy {
    width: 20px;
    height: 20px;
    padding-left: 23px;
    margin-right: 15px;
  }
  .doc-item {
    width: auto;
    overflow: hidden;
  }
}

.doc-content-truncated {
  background-color: $cf-code-bg; // should match the code editor bg
  color: $cf-text02-muted;
  padding: 0px 16px 8px 16px;
  font-size: 13px;
  margin: 0;
}