.matrix-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    background: #000;
    overflow: hidden;
    pointer-events: none;
    /* Fix: specific prevention of click blocking */
}

.matrix-bg canvas {
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

/* Ensure main content is above matrix */
.app-container {
    position: relative;
    z-index: 1;
}

/* Ensure fixed navigation is above matrix and everything else */
.mobile-bottom-nav {
    z-index: 1000 !important;
}

.landing-overlay {
    z-index: 9999 !important;
}

/* Updated Lime Green Color Variables */
:root {
    --lime-primary: #C6FF00;
    --lime-glow: rgba(198, 255, 0, 0.4);
    --lime-soft: rgba(198, 255, 0, 0.15);
}

/* Update all neon green to lime green */
.balance-card {
    border-color: var(--lime-primary) !important;
    background: linear-gradient(135deg, var(--lime-soft), rgba(198, 255, 0, 0.02)) !important;
    box-shadow: 0 8px 32px var(--lime-glow) !important;
}

.balance-card h2 {
    background: linear-gradient(135deg, var(--lime-primary), #D4FF00) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 0 25px var(--lime-glow)) !important;
}

.detail-item.income {
    border-color: rgba(198, 255, 0, 0.4) !important;
    background: linear-gradient(135deg, var(--lime-soft), rgba(198, 255, 0, 0.02)) !important;
}

.detail-item.income .icon-box {
    background: rgba(198, 255, 0, 0.25) !important;
    color: var(--lime-primary) !important;
    box-shadow: 0 4px 12px var(--lime-glow) !important;
}

.detail-item.income p {
    color: var(--lime-primary) !important;
    text-shadow: 0 0 15px var(--lime-glow) !important;
}

/* Buttons */
.cta-btn,
.modal-btn.confirm {
    background: var(--lime-primary) !important;
    color: #000 !important;
    box-shadow: 0 6px 20px var(--lime-glow) !important;
}

.cta-btn:hover,
.modal-btn.confirm:hover {
    box-shadow: 0 10px 30px rgba(198, 255, 0, 0.6) !important;
}

/* FAB Button */
#mobile-fab-add {
    background: var(--lime-primary) !important;
    box-shadow: 0 4px 20px var(--lime-glow) !important;
}

/* Bottom Nav Styling */
.mobile-bottom-nav {
    border-color: rgba(198, 255, 0, 0.3) !important;
    background: rgba(0, 0, 0, 0.95) !important;
}

.mobile-bottom-nav .nav-item:not([data-view="gig"]):not([data-view="vault"]):not(#nav-settings-trigger).active i,
.mobile-bottom-nav .nav-item:not([data-view="gig"]):not([data-view="vault"]):not(#nav-settings-trigger).active span {
    color: var(--lime-primary) !important;
    filter: drop-shadow(0 0 10px var(--lime-glow)) !important;
}

/* Input Focus */
.modal-input:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--lime-primary) !important;
    box-shadow: 0 0 0 3px var(--lime-soft) !important;
}

/* Eye Button */
#balance-toggle-btn {
    color: var(--lime-primary) !important;
}

/* --- Landing Page Matrix Theme Overrides --- */

/* Remove grid background and allow proper transparency */
.landing-overlay {
    background: rgba(0, 5, 5, 0.8) !important;
    /* Slightly darker glass to let matrix show */
    background-image: none !important;
    /* Remove conflicting grid */
    backdrop-filter: blur(8px) !important;
}

/* Matrix Styling for Landing Elements */
.landing-hero h1 span.highlight {
    color: var(--lime-primary) !important;
    text-shadow: 0 0 20px var(--lime-glow) !important;
}

.landing-logo {
    color: var(--lime-primary) !important;
    filter: drop-shadow(0 0 20px var(--lime-glow)) !important;
}

.landing-btn {
    background: linear-gradient(135deg, var(--lime-primary), #A2FF00) !important;
    color: #000 !important;
    box-shadow: 0 10px 30px var(--lime-glow) !important;
}

.landing-btn:hover {
    box-shadow: 0 20px 50px rgba(198, 255, 0, 0.6), 0 0 60px var(--lime-glow) !important;
}

/* Feature Cards */
.feature-card {
    background: rgba(0, 0, 0, 0.4) !important;
    border-color: rgba(198, 255, 0, 0.3) !important;
}



.feature-card i {
    color: var(--lime-primary) !important;
    filter: drop-shadow(0 0 10px var(--lime-glow)) !important;
}