[ENHANCEMENT]: [UI/UX] Improve toggle button contrast and theme consistency in Virtual Library dark mode #554

Current Behavior

Problem

The "Shelves" and "Constellation" toggle buttons in the Virtual Library page use inconsistent bright styling in dark mode.

The current button colors do not match the warm brown/cream aesthetic used throughout the rest of the UI, causing visual inconsistency and reducing immersion.

Current Behavior

• Toggle buttons use high-contrast bright colors
• UI theme consistency breaks in dark mode
• Buttons look disconnected from the rest of the design system

Expected Behavior

• Toggle buttons should use theers should align with the existing UI aesthetic
• Smooth visual consistency across all interactive components

Suggested Improvement

• Replace hardcoded colors with CSS theme variables
• Improve hover and active states
• Add subtle transitions for better UX
• Maintain accessibility and readability

Benefits

Benefits

• Better visual consistency
• Improved dark mode experience
• More polished and immersive UI

Possible Implementation

Possible Implementation

• Replace hardcoded button colors with existing global theme variables
• Improve hover interactions using smooth CSS transitions
• Add consistent border-radius, spacing, and shadow styling
• Ensure both toggle buttons follow the same dark mode aesthetic
• Maintain responsiveness and accessibility across screen sizes