.sidebar-menu div:hover {
        transform: translateX(4px);
        transition: transform 0.2s ease;
      }

      .chart-container {
        position: relative;
        height: 300px;
      }

      .metric-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
      }

      .fade-in {
        animation: fadeIn 0.5s ease-in;
      }

      @keyframes fadeIn {
        from {
          opacity: 0;
          transform: translateY(20px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      .night-mode {
        background-color: #0a0a0b !important;
        color: #e8e8e9 !important;
      }

      .night-mode .bg-white {
        background-color: #1a1a1c !important;
      }

      .night-mode .bg-gray-50 {
        background-color: #0a0a0b !important;
      }

      .night-mode .bg-gray-100 {
        background-color: #2a2a2d !important;
      }

      .night-mode .bg-gray-800 {
        background-color: #111012 !important;
      }

      .night-mode .border-gray-200,
      .night-mode .border-gray-300,
      .night-mode .border-gray-700 {
        border-color: #2a2a2d !important;
      }

      .night-mode .text-gray-800 {
        color: #e8e8e9 !important;
      }

      .night-mode .text-gray-600 {
        color: #b4b4b6 !important;
      }

      .night-mode .text-gray-500,
      .night-mode .text-gray-400 {
        color: #6b6b70 !important;
      }

      .night-mode .shadow-lg {
        box-shadow:
          0 10px 15px -3px rgba(0, 0, 0, 0.5),
          0 4px 6px -2px rgba(0, 0, 0, 0.3) !important;
      }

      .theme-toggle-container {
        position: relative;
        display: flex;
        align-items: center;
        gap: 12px;
      }

      .theme-selector {
        display: flex;
        background: #e5e7eb;
        border-radius: 24px;
        padding: 4px;
        transition: background-color 0.3s ease;
      }

      .dark .theme-selector {
        background: #374151;
      }

      .night-mode .theme-selector {
        background: #2a2a2d !important;
      }

      .theme-option {
        padding: 8px 16px;
        border-radius: 20px;
        cursor: pointer;
        transition: all 0.3s ease;
        font-size: 14px;
        font-weight: 500;
        color: #6b7280;
      }

      .theme-option.active {
        background: #8a3bd9;
        color: white;
        transform: scale(1.05);
      }

      .theme-option:hover:not(.active) {
        background: rgba(138, 59, 217, 0.1);
        color: #8a3bd9;
      }

      .dark .theme-option {
        color: #d1d5db;
      }

      .night-mode .theme-option {
        color: #b4b4b6 !important;
      }

      .loading-spinner {
        border: 4px solid #f3f3f3;
        border-top: 4px solid #8a3bd9;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        animation: spin 2s linear infinite;
        margin: 20px auto;
      }

      @keyframes spin {
        0% {
          transform: rotate(0deg);
        }
        100% {
          transform: rotate(360deg);
        }
      }

      .notification-badge {
        animation: pulse 2s infinite;
      }

      @keyframes pulse {
        0% {
          transform: scale(1);
          opacity: 1;
        }
        50% {
          transform: scale(1.1);
          opacity: 0.8;
        }
        100% {
          transform: scale(1);
          opacity: 1;
        }
      }