.create-lab {
  .two-column-layout {
    .main-column {
      @apply md:com-mr-[60px] com-mr-0;

      nb-card-body {
        @apply com-p-4;
      }

      .heading {
        @apply com-text-center com-text-primary-500 com-text-sm com-font-medium com-mt-4 com-mb-10;
      }

      form.lab-header-image {
        @apply com-mb-8;

        label {
          .upload-header {
            @apply com-flex com-items-start com-justify-center com-text-center com-border-2 com-border-dashed com-border-gray-300 com-rounded-lg com-text-gray-500 com-text-lg com-font-light com-h-full com-p-6 com-mb-6;

            span {
              @apply com-text-lg com-font-normal com-text-gray-500;

              small {
                @apply com-text-base com-text-primary-500;
              }
            }

            nb-icon {
              @apply com-text-2xl com-text-gray-500 com-mr-1;
            }
          }

          input {
            @apply com-hidden;
          }
        }

        .uploaded-header-image {
          @apply com-overflow-hidden com-flex com-justify-center com-items-center;

          img {
            @apply com-max-w-full;
          }
        }

        .delete-header-image-button {
          @apply com-block com-mt-4 com-mx-auto;
        }
      }

      form.lab-form {
        .overview {
          span {
            @apply com-text-sm com-font-normal com-mb-1;
          }
          input {
            @apply com-font-light com-text-xl;
          }

          > div {
            @apply com-mb-6;
          }
        }

        .lab-step {
          @apply com-mt-16;

          h3.steps-counter {
            @apply com-font-light com-mb-0;
          }

          .name input {
            @apply com-text-xl com-font-light com-mb-4;
          }
        }
      }

      .tags {
        @apply com-m-0;

        p {
          @apply com-m-0 com-mb-1;
        }
      }

      .add-step-button {
        @apply com-w-full;
      }

      .actions-card {
        @apply com-m-2;
      }

      .actions {
        @apply com-mt-4;

        button {
          @apply com-mr-2 com-mb-4;
        }
      }
    }

    .guide {
      @apply com-p-6;

      p {
        @apply com-flex com-flex-col com-text-sm com-font-medium com-text-gray-500 com-m-0 com-mb-4;
      }
      .help-video {
        @apply com-flex com-flex-col com-justify-center com-items-center com-border com-border-solid com-border-gray-300 com-rounded-lg com-relative com-w-full com-p-6;

        p {
          @apply com-text-base com-font-medium com-text-primary-500 com-m-0;
        }

        nb-icon {
          @apply com-text-5xl com-mb-3 com-text-primary-500;
        }
      }
    }

    .right-column {
      > div {
        @apply com-sticky com-top-20;
      }
    }
  }

  .publish-notification {
    @apply com-mt-8 com-mb-6 com-text-base com-font-normal;
  }

  .preview {
    @apply com-flex com-flex-row com-items-center com-text-primary-500 com-p-0 com-text-center;

    p {
      @apply com-text-lg com-font-medium com-text-primary-500 com-m-0;
    }

    nb-icon {
      @apply com-text-2xl;
    }
  }
}

editor {
  @apply com-mt-4;
  ::ng-deep {
    div.tox.tox-tinymce {
      @apply com-border-0;

      div.tox-editor-container {
        div.tox-editor-header {
          @apply com-top-[56px] #{!important};
        }
      }
    }
  }
}
