/* html-diff default styles */

/* CSS Custom Highlight API */
::highlight(diff-added) {
    background-color: rgba(40, 167, 69, 0.25);
}

::highlight(diff-removed) {
    background-color: rgba(220, 53, 69, 0.25);
}

/* SVG overlay fallback for browsers without CSS Custom Highlight API */
svg rect.diff-added {
    fill: rgba(40, 167, 69, 0.25);
}

svg rect.diff-removed {
    fill: rgba(220, 53, 69, 0.25);
}

/* Hover highlight for equal segments */
::highlight(diff-hover-left) {
    background-color: rgba(66, 153, 225, 0.3);
}

::highlight(diff-hover-right) {
    background-color: rgba(66, 153, 225, 0.3);
}

svg rect.diff-hover {
    fill: rgba(66, 153, 225, 0.3);
}

/* Hover connector line */
.diff-hover-line {
    fill: none;
    stroke: rgba(66, 153, 225, 0.6);
    stroke-width: 2;
    stroke-dasharray: 6 3;
}

.diff-hover-dot {
    fill: rgba(66, 153, 225, 0.6);
}

/* Click-to-arrow */
.diff-arrow {
    fill: none;
    stroke: rgba(255, 140, 0, 0.8);
    stroke-width: 2.5;
}

.diff-arrowhead {
    fill: rgba(255, 140, 0, 0.8);
}

/* Current change marker (next/prev navigation): recolor the current change's
   text. Primary path is a class on the tightly-wrapping element (repaints and
   clears reliably in every browser, Safari included); the ::highlight() rule is
   the fallback for loosely-wrapped tokens. No overlay element either way, so the
   marker never interferes with the hover-to-match feature. */
.qd-current-change {
    color: #e8590c !important;
}
::highlight(diff-current) {
    color: #e8590c;
}