@import "app";

body {
  &.template-plain-document {
    .editor-styles-wrapper {
      max-width: $containerMedium;
      margin: auto;
    }
  }

  .editor-visual-editor {
    background: $white;
  }

  .editor-styles-wrapper {
    padding: 2rem !important;
  }

  &:not(.template-plain-document) {
    .editor-styles-wrapper {
      background: transparent;
    }

    .editor-visual-editor {
      background-image: url('~images/pattern-fabric-of-squares-gray.png');
      background-size: 200px;
      background-attachment: fixed;

      &__post-title-wrapper {
        padding: 1rem;
        margin: 0 0 3rem !important;
        background: $white;
        box-shadow: 0 0.5rem 1rem rgba($black, 0.15);
      }
    }

    .wp-block-post-title {
      position: relative;
      padding: 0.5rem;
      border: $borderThin solid $grey-lighter;
      margin: 0;

      &::before {
        content: 'Page Title';
        position: absolute;
        top: -0.5rem;
        left: 0.5rem;
        color: $grey-lighter;
        font-family: $font;
        font-size: 0.8rem;
        display: block;
        padding: 0 0.5rem;
        margin: 0;
        background: $white;
        line-height: 1;
        font-weight: 400;
      }
    }

    .wp-block-post-content {
      background: $white;
      box-shadow: 0 0.5rem 1rem rgba($black, 0.15);
    }
  }
}