/*
 * Copyright (C) 2016 - present Instructure, Inc.
 *
 * This file is part of Canvas.
 *
 * Canvas is free software: you can redistribute it and/or modify it under
 * the terms of the GNU Affero General Public License as published by the Free
 * Software Foundation, version 3 of the License.
 *
 * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
 * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
 * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
 * details.
 *
 * You should have received a copy of the GNU Affero General Public License along
 * with this program. If not, see <http://www.gnu.org/licenses/>.
 */

@import "base/environment";
@import "components/rubric";

.submission_details {
  .bold { font-weight: bold; }
  .error { color: $ic-color-danger; }
  td { padding-#{direction(left)}: 1em; }
  th { font-weight: normal; }
  td, th { text-align: direction(right); }
}

.submission-details-header {
  margin-bottom: $ic-sp;
}
.submission-details-header__heading-and-grades {
  border-bottom: 0.0625rem solid $ic-border-light;
  padding-bottom: $ic-sp;
  margin-bottom: $ic-sp;

  @include breakpoint(tablet) {
    display: flex;
    align-items: center;
  }
}
.submission-details-header__heading {
  margin: 0 0 $ic-sp / 2;
  line-height: $ic-label-line-height;

  @include breakpoint(tablet) {
    margin-bottom: 0;
    flex: 1;
    min-width: 1px;
    padding-#{direction(right)}: $ic-sp;
  }
}
.submission-details-header__rubric {
  @include breakpoint(tablet) {
    text-align: direction(right);
  }

  &.submission-details-header__rubric--can-grade {
    margin-top: -($ic-sp * 0.75);
  }
}
.submission-details-header__info {
  margin-top: $ic-sp / 3;
  display: flex;

  .submission-details-header__attempts_info {
    margin: 0px 0px 0px 40px;

    > span {
      margin: 0px 20px 0px 0px;
    }
  }
}
.submission-details-header__time {
  margin-#{direction(right)}: $ic-sp / 4;
  &.late {
    color: $ic-color-danger;
    font-weight: bold;
  }
}
.submission-details-container {
  border: 1px solid $ic-border-light;
  box-sizing: border-box;
  @include breakpoint(desktop) {
    display: flex;
  }
}

.submission-details-frame {
  box-sizing: border-box;
  @include breakpoint(desktop) { flex: 1; }
}

.submission-details-comments {
  box-sizing: border-box;
  border-top: 1px solid $ic-border-light;
  @include breakpoint(desktop) {
    flex: 0 0 280px;
    border-top: none;
  }
  .comments {
    height: 300px;
    overflow: auto;
    background-color: $ic-bg-light-neutral;
    @include breakpoint(desktop) { border-#{direction(left)}: 1px solid $ic-border-light; }
  }
}

.file-upload-submission {
  display: flex;
  align-items: center;
  background: $ic-color-light;
  padding: $ic-sp $ic-sp/2;
  border-bottom: 1px solid $ic-border-light;
  &:last-of-type { border-bottom: none; }
}

.file-upload-submission-info {
  @include fontSize(13px);
  box-sizing: border-box;
  padding-#{direction(right)}: $ic-sp;
  > a {
    @include fontSize(13px); // need to overwrite default tiny-text style here
    margin-#{direction(right)}: $ic-sp/2;
    font-weight: bold;
  }
  flex: 1;
  text-overflow: ellipsis;
  overflow: hidden;
}

.file-upload-submission-info__filesize {
  @include fontSize(12px);
  white-space: nowrap;
}

.file-upload-submission-attachment {
  @include fontSize(13px);
  flex: 0 0 auto;
  text-align: direction(right);
  box-sizing: border-box;
  padding-#{direction(left)}: $ic-sp;
}

.file-upload-submission-turnitin {
  @include fontSize(13px);
  flex: 0 0 20%;
}

.omit-from-final-warning {
  padding: 12px;
  border-width: 1px;
  margin: 5px;
}

.turnitin_score_container {
  vertical-align: middle;

  &a {
    text-decoration: none;
  }

  i {
    &.icon-empty,
    &.icon-oval-half {
      color: $ic-color-danger;
    }

    &.icon-certified {
      color: $ic-color-success;
    }

    &.icon-clock {
      color: $ic-color-dark;
    }
  }

  .turnitin_similarity_score, .turnitin_similarity_score:hover {
    color: $ic-color-dark;
  }
}
