// Copyright 2022 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only

@use '../mixins';
@use '../variables';

.StoryDetailsModal {
  min-width: 320px;
  overflow: hidden;

  &__overlay-container {
    align-items: flex-end;
    justify-content: flex-end;
  }

  &__debugger__container {
    justify-content: flex-start;
  }

  &__debugger__button {
    color: variables.$color-gray-25;
    display: block;
    font-weight: 600;
    height: auto;
    width: auto;

    &__text {
      font-weight: normal;
    }
  }

  &__copy-icon {
    @include mixins.dark-theme {
      @include mixins.color-svg(
        '../images/icons/v3/copy/copy.svg',
        variables.$color-white
      );
    }
    @include mixins.light-theme {
      @include mixins.color-svg(
        '../images/icons/v3/copy/copy.svg',
        variables.$color-black
      );
    }
  }

  &__download-icon {
    @include mixins.dark-theme {
      @include mixins.color-svg(
        '../images/icons/v3/save/save.svg',
        variables.$color-white
      );
    }
    @include mixins.light-theme {
      @include mixins.color-svg(
        '../images/icons/v3/save/save.svg',
        variables.$color-black
      );
    }
  }

  &__contact-container {
    border-top: 1px solid variables.$color-gray-75;
  }

  &__contact-group__header {
    @include mixins.font-body-1-bold;
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-top: 24px;
    padding-block: 10px;
    padding-inline: 0;
    user-select: none;

    &:first-child {
      margin-top: 0;
    }
  }

  &__contact {
    margin-bottom: 8px;
    padding-block: 8px;
    padding-inline: 0;
    display: flex;
    flex-direction: row;
    align-items: center;

    &__text {
      @include mixins.font-body-1;
      flex-grow: 1;
      margin-inline-start: 10px;
    }

    &:last-child {
      margin-bottom: 0;
    }
  }

  &__status-timestamp {
    margin-inline-start: 6px;
  }
}
