.markdown-editor {
  outline: none;

  .markdown-editor-content {
    display: block;
    .rc-md-editor {
      border-radius: $radius;
      border-color: $color-default-2;

      .editor-container {
        padding: $p8;
        .sec-md {
          .input {
            padding: $p8;
          }
        }

        .sec-html {
          border-bottom: 1px solid $color-default-2;
        }
      }

      .section-container {
        padding: $p8;
      }

      .tool-bar {
        display: none;
      }
    }

    &.show-btn {
      .rc-md-editor {
        padding-bottom: 52px;
      }

      .full-screen-btn {
        z-index: 1001;
      }
    }

    .md-content {
      padding: 0;
    }
  }

  .rc-md-navigation {
    background-color: $white;
    border-bottom: none;
    border-radius: 2px;

    .button-wrap {
      .mode-button {
        width: auto;
      }
      .active-button {
        font-weight: 500;
        color: $color-default;
        &:after {
          top: 3px;
          background-color: $color-purple-deep;
        }
      }
    }

    .left .button-wrap .button {
      margin: 0 8px;
    }
  }

  .disable-edit {
    .rc-md-navigation .right {
      visibility: hidden;
    }
  }

  .read-only {
    .button-wrap span {
      .button:first-child {
        display: none;
      }
    }
  }
}
