/* ============================================================
   Aube — Dark mode component overrides
   Note: most components already adapt via CSS variables.
   This file is for specific tweaks where a flat token swap
   isn't enough (image filters, gradient adjustments, etc).
   Tokens themselves live in tokens.css.
   ============================================================ */

/* Hero dawn illustration — slightly desaturate in dark mode for cohesion */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .hero__backdrop img {
        filter: brightness(0.65) saturate(0.85);
    }
}
[data-theme="dark"] .hero__backdrop img {
    filter: brightness(0.65) saturate(0.85);
}

/* Bible Project logo — swap white variant in dark */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .bp-logo--auto picture > img {
        /* let <picture> media query handle it */
    }
}

/* Marker pin — subtle glow in dark */
[data-theme="dark"] .map-mockup__pin svg path {
    filter: drop-shadow(0 0 6px rgba(240, 201, 168, 0.4));
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .map-mockup__pin svg path {
        filter: drop-shadow(0 0 6px rgba(240, 201, 168, 0.4));
    }
}

/* Screenshot placeholder — gradient adjust */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .aube-screenshot-placeholder {
        background: linear-gradient(135deg, #2D2218 0%, #3A2C20 100%);
    }
}
[data-theme="dark"] .aube-screenshot-placeholder {
    background: linear-gradient(135deg, #2D2218 0%, #3A2C20 100%);
}