pre {
    margin: 0;
    padding: 0;
    border: 1px solid #777;
}

.version-diff .idiom-left,
.version-diff .idiom-right {
    padding-top: 0.5em;
}
.version-diff .idiom-left .deleted,
.version-diff .idiom-right .created  {
    padding: 0.5em;
}

.version-diff .imports,
.version-diff .code,
.version-diff .comments,
.version-diff .doc-url,
.version-diff .origin-url,
.version-diff .demo-url {
    padding-top: 0.5em;
}

.idiom-left.touched ins,
.impl-left.touched  ins {
    display: none;
}

.idiom-right.touched del,
.impl-right.touched del {
    display: none;
}

.idiom-left .touched ins,
.impl-left .touched  ins {
    display: none;
}

.idiom-right .touched del,
.impl-right .touched del {
    display: none;
}

.touched del {
    background-color: #FBB;
}

.touched ins {
    background-color: #BFB;
    text-decoration: unset;
}


@media (prefers-color-scheme: dark) {
    /* Dark theme: see issues/114 */

    .version-diff .diff-code-comments,
    .version-diff .doc-url .field-value,
    .version-diff .origin-url .field-value,
    .version-diff .demo-url .field-value {
        border: 1px solid #777;
        background-color: black;
    }

    .version-diff h5 > a {
        color: rgb(120, 187, 187);
    }

    .touched del {
        background-color: rgb(95, 17, 17);
    }
    
    .touched ins {
        background-color: rgb(12, 90, 12);
    }

    .version-diff .impl-left.created {
        background-color: inherit;
    }
    .version-diff .idiom-right .created,
    .version-diff .impl-right.created {
        background-color: rgb(12, 90, 12);
    }
    .version-diff .idiom-left .deleted,
    .version-diff .impl-left.deleted {
        background-color: rgb(160, 63, 63);
    }
    .version-diff .idiom-right .deleted,
    .version-diff .impl-right.deleted {
        background-color: rgb(95, 17, 17);
    }
}