/* Global transition helpers for theme changes - Optimized for performance */
:root, body, header, .container, .card, .onboarding-card, .modal-content, .settings-content, .btn-primary, .btn-secondary, .tab-btn, .bottom-nav, .nav-item, .modal-overlay {
    transition: background-color 350ms cubic-bezier(.22,1,.36,1), color 350ms cubic-bezier(.22,1,.36,1), border-color 350ms cubic-bezier(.22,1,.36,1), box-shadow 350ms cubic-bezier(.22,1,.36,1); /* Reduced from 600ms to 350ms */
    will-change: background-color, color, border-color, box-shadow; /* Hardware acceleration */
}

svg, .fab-btn svg, .nav-item svg, .tab-btn svg {
    transition: fill 350ms cubic-bezier(.22,1,.36,1), stroke 350ms cubic-bezier(.22,1,.36,1), color 350ms cubic-bezier(.22,1,.36,1); /* Reduced from 600ms to 350ms */
    will-change: fill, stroke, color; /* Hardware acceleration */
}

/* Slightly reduce transition on small elements to feel snappier */
.tab-btn, .nav-item { transition-duration: 250ms; will-change: background-color, color; } /* Reduced from 420ms to 250ms */

/* Ensure buttons animate their gradient backgrounds smoothly where supported */
.btn-primary, .btn-success, .btn-secondary { transition: background 350ms cubic-bezier(.22,1,.36,1), color 350ms; will-change: background, color; } /* Reduced from 600ms to 350ms */