@import './token.less';
@diff-prefix-cls: ~'@{prefix}-diff';

.@{diff-prefix-cls} {
  display: flex;
  align-items: center;
  padding: 14px 20px;
  background-color: var(--diff-blob-addition-line-bg);
  // border: 1px dashed;
  border-color: var(--diff-blob-addition-border-color);
  border-radius: 6px;

  &-children {
    padding: 8px;
    background-color: var(--color-bg-1);
    border-color: var(--diff-blob-addition-border-color);
    border-radius: 6px;
  }

  &-children.column {
    border: 0;
    border-radius: 0 0 6px 6px;
  }

  &-notice {
    padding-left: 20px;
  }

  &-notice-content {
    color: var(--diff-blob-addition-line-color);

    h2 {
      color: var(--diff-blob-addition-line-color) !important;
    }

    code {
      color: rgba(var(--blue-8), 0.9) !important;
      background-color: rgba(var(--blue-3), 0.2) !important;
      border-radius: 3px !important;
    }
  }
}

.@{diff-prefix-cls}.column {
  flex-direction: column;
  align-items: initial;
  padding: 0;
  border: 1px solid;
  border-color: var(--diff-blob-addition-border-color);
}