table.diff {
  .diffchange {
    color: var(--gin-color-danger);
  }

  .diff-context {
    background-color: transparent;
  }

  td {
    padding: var(--gin-spacing-xs);
    height: initial;
  }

  tr {
    color: var(--gin-color-title);

    .field-name {
      background-color: var(--gin-bg-header);
    }

    .diff-deletedline {
      background-color: var(--gin-color-danger-lightest);

      .diffchange {
        color: var(--gin-bg-danger);
      }

      .gin--dark-mode & {
        .diffchange {
          color: var(--gin-color-button-text);
        }
      }
    }

    .diff-addedline {
      background-color: var(--gin-color-green-lightest);

      .diffchange {
        color: var(--gin-bg-green);
      }

      .gin--dark-mode & {
        background: var(--gin-bg-green);

        .diffchange {
          color: var(--gin-color-button-text);
        }
      }
    }
  }

}