@import "../../../../../styles/index.scss";

.chat-message {
  display: flex;
  gap: 12px;
  align-items: flex-start;

  &.user-message {
    flex-direction: row-reverse;

    .message-content {
      text-align: right;
    }

    .message-actions {
      justify-content: flex-end;
    }
  }

  .message-header {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;

    .message-action-container {
      visibility: hidden;
      display: flex;
      align-items: center;
      gap: 4px;
      img,
      svg {
        cursor: pointer;
        color: $lightGrayColor; // replaced "gray"
        width: 14px;
      }
    }
    .visibility-enabled {
      visibility: visible;
    }

    .message-action-info-container {
      display: flex;
      align-items: center;
      gap: 8px;

      svg {
        color: $lightGrayColor; // replaced "gray"
        cursor: pointer;
      }

      .message-action-info {
        font-size: $smallFontSize;
        color: $lightGrayColor; // replaced "gray"
      }

      .message-timestamp {
        font-size: 11px; // custom size
        color: $color-text-secondary;
        font-weight: $normalFontWeight;
      }

      .ia-styles.ia-btn.ia-btn-tertiary {
        background: transparent;
        border: none;
      }
    }
  }
  .flex-end {
    justify-content: flex-end !important;
  }

  &.user-message {
    .message-text {
      margin-left: 60px;
    }
  }

  &.assistant-message {
    .message-text {
      background: linear-gradient(
        92.25deg,
        $disabledSecondaryBg -0.92%,
        $inactiveInputBackground 98.11% // #f6f7fa
      );
      margin-right: 60px;
      margin-left: 0;
    }
  }

  .message-content {
    flex: 1 1;
    min-width: 0;
  }
}

.ia-styles.ia-menu.more-options-menu .MuiPaper-root {
  min-width: 220px;
  max-width: 332px;
}

.delete_modal_txt {
  color: $darkColor;
  font-size: 16px;
  font-style: normal;
  font-weight: $ExtraFontWeight;
  line-height: 24px;
}

.delete_modal_subTxt {
  color: $textButtonFontColor;
  text-align: center;
  font-size: 12px;
  font-style: normal;
  font-weight: $normalFontWeight;
  line-height: 16px; /* 133.333% */
}

.chat-message:hover .message-actions {
  opacity: 1;
}

// .delete-confirmation-modal {
//   display: flex;
//   flex-direction: column;
//   justify-content: center;
//   align-items: center;
// }
