@use "/src/styles/utils.scss";

.chat {
  height: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
}

.input {
  width: 100%;
  margin-top: auto;
  background-color: hsla(0, 0%, 100%, 0.07);
  padding: 0.5rem;
  display: flex;
}

.dialogs {
  position: absolute;
  padding: 0.5rem 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  .item {
    vertical-align: baseline;
    .name {
      font-weight: 500;
      line-height: 1.375rem;
    }
    .time {
      font-size: 11px;
      opacity: 0.8;
      margin-left: 0.5rem;
    }
    .content {
      font-size: 13px;
      color: #ccc;
      margin-top: 2px;
    }
    padding: 0.5rem 0.5rem;
    margin: 0 0.625rem;
    border-radius: 0.5rem;
    transition: 0.2s;
    &:hover {
      background-color: hsla(0, 0%, 100%, 0.07);
    }
  }
}
