@import '~tc-ui/src/styles/tc-includes';

:global {
  .UploadedFile {
    width: 203px;
  
    main {
      background-color: $tc-gray-neutral-light;
      height          : 135px;
      position        : relative;
  
      .document-icon {
        width : 35px;
        height: 35px;
      }
  
      .preview {
        height         : 135px;
        width          : 100%;
        background-size: cover;
      }
    }
  
    .cross {
      height: 10px;
      width: 10px;
    }
  
    .file-name {
      margin-top: 5px;
  
      p {
        @include ellipsis;
        max-width: 180px;
  
        font-weight: 400;
      }
    }
  
    .progress {
      position        : absolute;
      width           : 100%;
      left            : 0;
      top             : 100px;
      padding         : 13px 20px 7px 20px;
      background-color: rgba(255,255,255,0.7);
    }
  
    progress {
      width: 100%;
    }
  
    .failed {
      button {
        margin-top: 10px;
      }
  
      img {
        opacity: .60;
      }
    }
  
    textarea {
      margin-top  : 5px;
      width       : 100%;
      height      : 82px;
      border-width: 0;
      color       : $tc-gray-50;
  
      &:focus {
        border-width: 1px;
        color: $tc-gray-80;
      }
    }
  }
}