// studio - views - assets
// ====================

body.course.uploads {
  
  input.asset-search-input {
    float: left;
    width: 260px;
    background-color: #fff;
  }

  .asset-library {
    @include clearfix;

    table {
      width: 100%;
      border-radius: 3px 3px 0 0;
      border: 1px solid #c5cad4;

      td,
      th {
        padding: 10px 20px;
        text-align: left;
        vertical-align: middle;
      }

      thead th {
        @include linear-gradient(top, transparent, rgba(0, 0, 0, .1));
        background-color: #ced2db;
        font-size: 12px;
        font-weight: 700;
        text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
      }

      tbody {
        background: #fff;

        tr {
          border-top: 1px solid #c5cad4;

          &:first-child {
            border-top: none;
          }
        }

        .name-col {
          font-size: 14px;
        }

        .date-col {
          font-size: 12px;
        }
      }

      .thumb-col {
        width: 100px;
      }

      .date-col {
        width: 220px;
      }

      .embed-col {
        width: 250px;
      }

      .embeddable-xml-input {
        @include box-shadow(none);
        width: 100%;
      }

      .thumb {
        width: 100px;
        max-height: 80px;

        img {
          width: 100%;
        }
      }
    }

    .pagination {
      float: right;
      margin: 15px 10px;

      ol, li {
        display: inline;
      }

      a {
        display: inline-block;
        height: 25px;
        padding: 0 4px;
        text-align: center;
        line-height: 25px;
      }
    }
  }
    .show-xml {
    @include blue-button;
  }
}

.upload-modal {
  display: none;  
  width: 640px !important;
  margin-left: -320px !important;

  .modal-body {
    height: auto !important;
    overflow-y: auto !important;
    text-align: center;
  }

  .file-input {
    display: none;
  }

  .choose-file-button {
    @include blue-button;
    padding: 10px 82px 12px;
    font-size: 17px;
  }

  .progress-bar {
    display: none;
    width: 350px;
    height: 50px;
    margin: 30px auto 10px;
    border: 1px solid $blue;

    &.loaded {
      border-color: #66b93d;

      .progress-fill {
        background: #66b93d;
      }
    }
  }

  .progress-fill {
    width: 0%;
    height: 50px;
    background: $blue;
    color: #fff;
    line-height: 48px;
  }

  h1 {
    float: none;
    margin: 40px 0 30px;
    font-size: 34px;
    font-weight: 300;
  }

  .close-button {
    @include white-button;
    position: absolute;
    top: 0;
    right: 15px;
    width: 29px;
    height: 29px;
    padding: 0 !important;
    border-radius: 17px !important;
    line-height: 29px;
    text-align: center;
  }

  .embeddable {
    display: none;
    margin: 30px 0 130px;

    label {
      display: block;
      margin-bottom: 10px;
      font-weight: 700;
    }
  }

  .embeddable-xml-input {
    @include box-shadow(none);
    width: 400px;
  }

  .copy-button {
    @include white-button;
    display: none;
    margin-bottom: 100px;
  }
}