@import './apps/commudle-admin/src/assets/styles/variables';

.speaker-resources {
  .left-column {
    width: 370px;

    .user-profile {
      nb-card-body {
        padding: $space-16;
      }
    }
  }

  .center-column {
    width: min(856px, 100vw);

    .details {
      nb-card-body {
        .title {
          @apply com-mb-6 com-font-medium com-text-[28px] com-leading-7;
        }

        .date {
          margin-top: $space-12;
        }

        .content {
          margin-top: $space-16;
          white-space: pre-wrap;

          ::ng-deep .embedded-content {
            @apply com-mt-3;
            iframe {
              @apply com-w-full com-h-96 com-border com-border-solid com-border-Bright-Gray;
            }
          }

          .embedded-content {
            @apply com-mt-3;
          }

          .pdf-content {
            @apply com-mt-3;
            object {
              @apply com-w-full com-h-72 com-border com-border-solid com-border-Bright-Gray;
            }
          }

          .link-content {
            @apply com-mt-3;
          }
        }

        .interactions {
          margin-top: $space-16;

          .discussion {
            margin-left: $space-8;
          }
        }
      }
    }

    .speaker-resource-discussion {
      nb-card-body {
        overflow: initial;
        padding: 0;

        app-messages {
          @apply com-block com-h-96;
        }
      }
    }
  }
}

@media all and (max-width: $tab-width) {
  .speaker-resources {
    align-items: center;
    flex-direction: column;

    .left-column {
      .user-profile {
        margin-bottom: 0;
      }
    }
  }
}
