Fix lt-avatar color modifiers overridden by light-theme rule

html[data-theme="light"] .lt-avatar has specificity 0,2,1 which
beats the color modifier classes (0,1,0), stripping the purple/orange/
green/red tints in light mode. Add per-modifier light-theme overrides
immediately after the generic rule so they win the cascade.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-06 22:15:19 -04:00
parent 444dc4bf26
commit 727c5171ff
+5
View File
@@ -3939,6 +3939,11 @@ html[data-theme="light"] .lt-wizard-connector { background: var(--border-color
/* — Avatar — */
html[data-theme="light"] .lt-avatar { background: var(--bg-tertiary); color: var(--text-primary); border-color: var(--border-color); }
/* Color modifier overrides must come after the generic light-theme rule to win the cascade */
html[data-theme="light"] .lt-avatar--orange { background: var(--accent-orange-dim); border-color: var(--accent-orange); color: var(--accent-orange); }
html[data-theme="light"] .lt-avatar--green { background: var(--accent-green-dim); border-color: var(--accent-green); color: var(--accent-green); }
html[data-theme="light"] .lt-avatar--red { background: var(--accent-red-dim); border-color: var(--accent-red); color: var(--accent-red); }
html[data-theme="light"] .lt-avatar--purple { background: var(--accent-purple-dim); border-color: var(--accent-purple); color: var(--accent-purple); }
/* — Lightbox — */
html[data-theme="light"] .lt-lightbox-overlay { background: rgba(15,20,40,0.92); }