andy-stack_vaultkeeper-ai/Styles/diff2html_styles.css

/* Override diff2html blue tones with Obsidian's CSS variables */

/* Main diff container background */
.d2h-wrapper {
    transform: translateZ(0);
    background-color: var(--background-primary) !important;
    box-shadow: 0px 0px 4px 1px var(--color-accent) !important;
}

/* File header background */
.d2h-file-header {
    background-color: var(--background-primary) !important;
    border-color: var(--background-modifier-border) !important;
}

/* File name container */
.d2h-file-name-wrapper {
    background-color: var(--background-primary-alt) !important;
}

.d2h-code-linenumber {
    cursor: default;
}

/* Line number backgrounds - only override context lines */
.d2h-code-linenumber.d2h-cntx {
    background-color: var(--background-primary-alt) !important;
    border-color: var(--background-modifier-border) !important;
}

/* Code line backgrounds - only override context lines */
.d2h-code-line.d2h-cntx {
    background-color: var(--background-primary) !important;
}

/* Info section background */
.d2h-info {
    background-color: var(--background-secondary) !important;
    border-color: var(--background-modifier-border) !important;
}

/* File diff background */
.d2h-file-diff {
    overflow: auto;
    background-color: var(--background-primary) !important;
    border-color: var(--background-modifier-border) !important;
}

/* File diff size */
@container diff-container (max-height: 199px) {
    .d2h-file-diff { max-height: 90cqh; }
}

@container diff-container (min-height: 200px) {
    .d2h-file-diff { max-height: 95cqh; }
}

@container diff-container (min-height: 400px) {
    .d2h-file-diff { max-height: 97cqh; }
}

@container diff-container (min-height: 550px) {
    .d2h-file-diff { max-height: 98cqh; }
}

@container diff-container (min-height: 1000px) {
    .d2h-file-diff { max-height: 99cqh; }
}

/* Empty placeholder */
.d2h-emptyplaceholder {
    background-color: var(--background-secondary-alt) !important;
}

.d2h-code-side-linenumber {
    position: relative;
    display: table-cell;
}

/* Code side backgrounds for side-by-side view - only override context lines */
.d2h-code-side-linenumber.d2h-cntx,
.d2h-code-side-line.d2h-cntx {
    background-color: var(--background-primary) !important;
}

/* Fix transparent backgrounds on insertion/deletion line numbers */
/* Dark mode styles - side-by-side view */
.theme-dark .d2h-code-side-linenumber.d2h-ins {
    background-color: #1e3a1e !important; /* Dark green - solid color */
}

.theme-dark .d2h-code-side-linenumber.d2h-del {
    background-color: #3a1e1e !important; /* Dark red - solid color */
}

/* Dark mode styles - inline view */
.theme-dark .d2h-code-linenumber.d2h-ins {
    background-color: #1e3a1e !important; /* Dark green - solid color */
}

.theme-dark .d2h-code-linenumber.d2h-del {
    background-color: #3a1e1e !important; /* Dark red - solid color */
}

/* Light mode styles - side-by-side view */
.theme-light .d2h-code-side-linenumber.d2h-ins {
    background-color: #c8e6c9 !important; /* Light green with better contrast */
}

.theme-light .d2h-code-side-linenumber.d2h-del {
    background-color: #ffcdd2 !important; /* Light red with better contrast */
}

/* Light mode styles - inline view */
.theme-light .d2h-code-linenumber.d2h-ins {
    background-color: #c8e6c9 !important; /* Light green with better contrast */
}

.theme-light .d2h-code-linenumber.d2h-del {
    background-color: #ffcdd2 !important; /* Light red with better contrast */
}

/* Tags and labels */
.d2h-tag {
    background-color: var(--background-secondary) !important;
    border-color: var(--background-modifier-border) !important;
}

/* File list wrapper */
.d2h-file-list-wrapper {
    background-color: var(--background-primary) !important;
}

/* File list header */
.d2h-file-list-header {
    background-color: var(--background-primary-alt) !important;
    border-color: var(--background-modifier-border) !important;
}

/* File list line */
.d2h-file-list-line {
    background-color: var(--background-primary) !important;
    border-color: var(--background-modifier-border) !important;
}

/* File switch container */
.d2h-file-switch {
    background-color: var(--background-primary-alt) !important;
}

/* Toolbar */
.d2h-file-diff-toolbar {
    background-color: var(--background-secondary) !important;
}

.d2h-file-header {
  padding: 0 !important;
}

.d2h-file-name-wrapper {
  padding-left: 8px !important;
}

/* Text colors */
.d2h-file-header,
.d2h-file-name,
.d2h-file-stats,
.d2h-code-linenumber,
.d2h-info {
    color: var(--text-normal) !important;
}

.d2h-diff-table {
    position: relative;
 }

/* Light mode syntax highlighting overrides for better visibility */
.theme-light .d2h-code-side-line {
    color: var(--text-normal) !important;
}

/* Force base text color for all code content in light mode */
.theme-light .d2h-code-line-ctn,
.theme-light .d2h-code-line-ctn * {
    color: var(--text-normal) !important;
}

/* Override Monokai theme colors in light mode for better contrast */
.theme-light .hljs-comment,
.theme-light .hljs-quote {
    color: #5c6370 !important; /* Medium gray for comments */
}

.theme-light .hljs-keyword,
.theme-light .hljs-selector-tag,
.theme-light .hljs-literal,
.theme-light .hljs-type {
    color: #a626a4 !important; /* Purple for keywords */
}

.theme-light .hljs-string,
.theme-light .hljs-doctag {
    color: #50a14f !important; /* Green for strings */
}

.theme-light .hljs-title,
.theme-light .hljs-section,
.theme-light .hljs-selector-id {
    color: #4078f2 !important; /* Blue for titles/functions */
}

.theme-light .hljs-subst,
.theme-light .hljs-tag,
.theme-light .hljs-name,
.theme-light .hljs-attr,
.theme-light .hljs-attribute {
    color: #e45649 !important; /* Red for tags/attributes */
}

.theme-light .hljs-variable,
.theme-light .hljs-template-variable {
    color: #986801 !important; /* Orange for variables */
}

.theme-light .hljs-number,
.theme-light .hljs-built_in,
.theme-light .hljs-builtin-name,
.theme-light .hljs-class .hljs-title {
    color: #c18401 !important; /* Gold for numbers/built-ins */
}

.theme-light .hljs-meta,
.theme-light .hljs-meta-keyword {
    color: #a626a4 !important; /* Purple for meta */
}

.theme-light .hljs-symbol,
.theme-light .hljs-bullet,
.theme-light .hljs-link {
    color: #0184bc !important; /* Cyan for symbols */
}

/* Ensure deletion and insertion text is visible */
.theme-light .d2h-code-line.d2h-del .hljs {
    color: #24292e !important; /* Dark text on light red background */
}

.theme-light .d2h-code-line.d2h-ins .hljs {
    color: #24292e !important; /* Dark text on light green background */
}