@import '../../styles/colors.scss';

.container {
  color: $text-color;
  display: flex;
  flex-direction: column;

  .subHeader {
    border-bottom: 0.5px solid;
    font-size: 1.5rem;
  }

  .filesWrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-left: 15px;

    .file {
      display: flex;
      align-items: center;
      gap: 15px;
    }
  }

  .usersList {
    display: flex;
    flex-direction: column;
    gap: 10px;
    list-style: none;
    margin-top: 10px;
  }

  .user {
    display: flex;
    align-items: center;
    gap: 10px;

    .name {
      text-align: center;
      cursor: pointer;
    }
  }

  .tableCell {
    border-right: 1px solid rgba(224, 224, 224, 1);

    .user {
      @extend .user;
    }
  }
}

.mark {
  position: absolute;

  display: flex;
  justify-content: center;
  align-items: center;
}

[data-dev='true'] {
  .mark {
    outline: 1px dotted black;
  }
}
