/* ============================================================
   MoneyRat — Light Theme
   Applied when: browser prefers light OR user toggled to light
   ============================================================ */

:root {
    --c-bg: #f5f5f5;
    --c-bg-alt: #ebebeb;
    --c-surface: #ffffff;
    --c-card: #f0f0f0;
    --c-border: #d4d4d4;
    --c-border-hover: #b0b0b0;

    --c-accent: #007a3a;
    --c-accent-dim: rgba(0, 122, 58, 0.10);
    --c-accent-glow: rgba(0, 122, 58, 0.20);
    --c-accent-hover: #009648;

    --c-text: #111111;
    --c-text-2: #444444;
    --c-text-3: #888888;

    --c-cert: rgba(0, 70, 180, 0.9);
    --c-cert-bg: rgba(0, 70, 180, 0.07);
    --c-cert-border: rgba(0, 70, 180, 0.22);

    --c-wip: #9a6e00;
    --c-wip-bg: rgba(154, 110, 0, 0.08);
    --c-wip-border: rgba(154, 110, 0, 0.22);

    /* Light-specific component overrides */
    --nav-scrolled-bg: rgba(245, 245, 245, 0.92);
    --nav-mobile-bg: rgba(245, 245, 245, 0.97);
}

/* Light: icon.svg is already dark — no inversion needed */
.nav__logo-icon,
.lang-modal__brand-icon {
    filter: invert(0);
}

/* Light: show sun, hide moon */
.ctrl-btn__icon--sun {
    display: block;
}

.ctrl-btn__icon--moon {
    display: none;
}