/* ═══════════════════════════════════════════════════════════════════ ADM DEVELOPER — DARK MODE OVERRIDES Applied when ═══════════════════════════════════════════════════════════════════ */ [data-theme="dark"] { /* ── Surfaces ── */ --color-bg: #0a0a0a; --color-surface-1: #111111; --color-surface-2: #191919; --color-surface-3: #242424; --color-surface-4: #333333; /* ── Borders ── */ --color-border: rgba(255, 255, 255, 0.08); --color-border-strong: rgba(255, 255, 255, 0.15); --color-border-brand: rgba(229, 0, 109, 0.25); /* ── Text ── */ --color-text: #ffffff; --color-text-secondary: #a8a8a8; --color-text-muted: #666666; --color-text-hint: #444444; --color-text-inverse: #0a0a0a; /* ── Brand adjustments for dark ── */ --color-brand-dim: rgba(229, 0, 109, 0.12); --color-brand-glow: rgba(229, 0, 109, 0.2); /* ── Accents — brighter on dark ── */ --color-blue: #63b3ed; --color-green: #68d391; --color-amber: #f6ad55; --color-red: #fc8181; --color-purple: #b794f4; --color-teal: #4fd1c5; /* ── Accent dims — more opaque on dark ── */ --color-blue-dim: rgba(99, 179, 237, 0.11); --color-green-dim: rgba(104, 211, 145, 0.11); --color-amber-dim: rgba(246, 173, 85, 0.11); --color-red-dim: rgba(252, 129, 129, 0.11); --color-purple-dim: rgba(183, 148, 244, 0.11); --color-teal-dim: rgba(79, 209, 197, 0.11); /* ── Shadows — deeper on dark ── */ --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.2); --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2); --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.35), 0 2px 4px -2px rgba(0, 0, 0, 0.25); --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -4px rgba(0, 0, 0, 0.3); --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.45), 0 8px 10px -6px rgba(0, 0, 0, 0.35); /* ── Glass — darker, subtler ── */ --glass-bg: rgba(17, 17, 17, 0.72); --glass-bg-strong: rgba(17, 17, 17, 0.88); --glass-border: rgba(255, 255, 255, 0.08); color-scheme: dark; } /* ── Dark mode grid pattern (brand-tinted, subtle) ── */ [data-theme="dark"] .adm-section--grid::before { background-image: linear-gradient(rgba(229, 0, 109, 0.015) 1px, transparent 1px), linear-gradient(90deg, rgba(229, 0, 109, 0.015) 1px, transparent 1px); } /* ── Dark mode scrollbar ── */ [data-theme="dark"] ::-webkit-scrollbar-track { background: #0a0a0a; } [data-theme="dark"] ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.12); } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.2); }