Some refactors

lib/presentation/workout_session/widgets/session_controls.dart

@@ -1,4 +1,6 @@
 import 'package:flutter/material.dart';
+import 'package:trainhub_flutter/core/theme/app_colors.dart';
+import 'package:trainhub_flutter/core/constants/ui_constants.dart';
 
 class SessionControls extends StatelessWidget {
   final bool isRunning;
@@ -20,35 +22,109 @@ class SessionControls extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    if (isFinished) {
-      return ElevatedButton(
-        onPressed: () => Navigator.of(context).pop(),
-        child: const Text('Finish Workout'),
-      );
-    }
+    if (isFinished) return const SizedBox.shrink();
 
-    return Row(
-      mainAxisAlignment: MainAxisAlignment.center,
-      children: [
-        IconButton.filledTonal(
-          onPressed: onPrevious,
-          icon: const Icon(Icons.skip_previous),
-          iconSize: 32,
-        ),
-        const SizedBox(width: 24),
-        IconButton.filled(
-          onPressed: isRunning ? onPause : onPlay,
-          icon: Icon(isRunning ? Icons.pause : Icons.play_arrow),
-          iconSize: 48,
-          style: IconButton.styleFrom(padding: const EdgeInsets.all(16)),
-        ),
-        const SizedBox(width: 24),
-        IconButton.filledTonal(
-          onPressed: onNext,
-          icon: const Icon(Icons.skip_next),
-          iconSize: 32,
-        ),
-      ],
+    return Container(
+      margin: const EdgeInsets.symmetric(horizontal: UIConstants.spacing24),
+      padding: const EdgeInsets.symmetric(
+        horizontal: UIConstants.spacing24,
+        vertical: UIConstants.spacing12,
+      ),
+      decoration: BoxDecoration(
+        color: AppColors.surfaceContainer.withValues(alpha: 0.7),
+        borderRadius: BorderRadius.circular(40),
+        border: Border.all(color: AppColors.border.withValues(alpha: 0.5)),
+      ),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.center,
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          _ControlButton(
+            icon: Icons.skip_previous_rounded,
+            onTap: onPrevious,
+            size: 28,
+          ),
+          const SizedBox(width: UIConstants.spacing24),
+          // Play/Pause - larger main button
+          Container(
+            width: 56,
+            height: 56,
+            decoration: BoxDecoration(
+              color: AppColors.zinc50,
+              shape: BoxShape.circle,
+              boxShadow: [
+                BoxShadow(
+                  color: AppColors.zinc50.withValues(alpha: 0.15),
+                  blurRadius: 16,
+                  spreadRadius: 2,
+                ),
+              ],
+            ),
+            child: Material(
+              color: Colors.transparent,
+              child: InkWell(
+                onTap: isRunning ? onPause : onPlay,
+                borderRadius: BorderRadius.circular(28),
+                child: Icon(
+                  isRunning ? Icons.pause_rounded : Icons.play_arrow_rounded,
+                  color: AppColors.zinc950,
+                  size: 32,
+                ),
+              ),
+            ),
+          ),
+          const SizedBox(width: UIConstants.spacing24),
+          _ControlButton(
+            icon: Icons.skip_next_rounded,
+            onTap: onNext,
+            size: 28,
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+class _ControlButton extends StatefulWidget {
+  final IconData icon;
+  final VoidCallback onTap;
+  final double size;
+
+  const _ControlButton({
+    required this.icon,
+    required this.onTap,
+    this.size = 24,
+  });
+
+  @override
+  State<_ControlButton> createState() => _ControlButtonState();
+}
+
+class _ControlButtonState extends State<_ControlButton> {
+  bool _isHovered = false;
+
+  @override
+  Widget build(BuildContext context) {
+    return MouseRegion(
+      onEnter: (_) => setState(() => _isHovered = true),
+      onExit: (_) => setState(() => _isHovered = false),
+      child: GestureDetector(
+        onTap: widget.onTap,
+        child: AnimatedContainer(
+          duration: UIConstants.animationDuration,
+          width: 44,
+          height: 44,
+          decoration: BoxDecoration(
+            color: _isHovered ? AppColors.zinc700 : Colors.transparent,
+            shape: BoxShape.circle,
+          ),
+          child: Icon(
+            widget.icon,
+            color: _isHovered ? AppColors.textPrimary : AppColors.textSecondary,
+            size: widget.size,
+          ),
+        ),
+      ),
     );
   }
 }