fix: Update home page cards to use theme colors and fix checkbox alignment

**Home Page Quick Actions:**
- Updated all 6 quick action cards to use dynamic theme colors
- Feeding: theme.palette.primary.main
- Sleep: theme.palette.secondary.main
- Diaper: theme.palette.warning.main
- Medical: theme.palette.error.main
- Activities: theme.palette.success.main
- AI Assistant: theme.palette.info.main
- Cards now change color when switching between Standard/High Contrast themes

**Registration Page UI Fix:**
- Fixed checkbox label alignment for Terms and Privacy checkboxes
- Added inline red asterisk (*) after labels for better visual indication
- Used alignItems: 'flex-start' for proper multi-line label alignment
- Added bottom margin (mb: 1) between checkboxes for better spacing
- Asterisk now appears inline with text instead of floating separately

**Files Modified:**
- app/page.tsx - Theme-aware quick action colors
- app/(auth)/register/page.tsx - Checkbox alignment fix

🎉 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

maternal-web/app/(auth)/register/page.tsx

@@ -420,13 +420,15 @@ export default function RegisterPage() {
                   />
                 }
                 label={
-                  <Typography variant="body2" color="text.secondary">
+                  <Typography variant="body2" color="text.secondary" component="span">
                     I agree to the{' '}
                     <MuiLink href="/terms" target="_blank" underline="hover">
                       Terms of Service
                     </MuiLink>
+                    {' '}<Typography component="span" color="error.main">*</Typography>
                   </Typography>
                 }
+                sx={{ alignItems: 'flex-start', mb: 1 }}
               />
               {errors.agreeToTerms && (
                 <Typography variant="caption" color="error" sx={{ display: 'block', mt: 0.5, ml: 4 }} id="terms-error" role="alert">
@@ -448,13 +450,15 @@ export default function RegisterPage() {
                   />
                 }
                 label={
-                  <Typography variant="body2" color="text.secondary">
+                  <Typography variant="body2" color="text.secondary" component="span">
                     I agree to the{' '}
                     <MuiLink href="/privacy" target="_blank" underline="hover">
                       Privacy Policy
                     </MuiLink>
+                    {' '}<Typography component="span" color="error.main">*</Typography>
                   </Typography>
                 }
+                sx={{ alignItems: 'flex-start', mb: 1 }}
               />
               {errors.agreeToPrivacy && (
                 <Typography variant="caption" color="error" sx={{ display: 'block', mt: 0.5, ml: 4 }} id="privacy-error" role="alert">

maternal-web/app/page.tsx

@@ -27,9 +27,11 @@ import { format, formatDistanceToNow } from 'date-fns';
 import { useRealTimeActivities } from '@/hooks/useWebSocket';
 import { useTranslation } from '@/hooks/useTranslation';
 import { analyticsApi } from '@/lib/api/analytics';
+import { useTheme } from '@mui/material/styles';
 
 export default function HomePage() {
   const { t } = useTranslation('dashboard');
+  const theme = useTheme();
   const { user, isLoading: authLoading } = useAuth();
   const router = useRouter();
   const [selectedChildId, setSelectedChildId] = useState<string | null>(null);
@@ -118,12 +120,12 @@ export default function HomePage() {
   }, [selectedChildId]);
 
   const quickActions = [
-    { icon: <Restaurant />, label: t('quickActions.feeding'), color: '#E91E63', path: '/track/feeding' }, // Pink with 4.5:1 contrast
-    { icon: <Hotel />, label: t('quickActions.sleep'), color: '#1976D2', path: '/track/sleep' }, // Blue with 4.5:1 contrast
-    { icon: <BabyChangingStation />, label: t('quickActions.diaper'), color: '#F57C00', path: '/track/diaper' }, // Orange with 4.5:1 contrast
-    { icon: <MedicalServices />, label: t('quickActions.medical'), color: '#C62828', path: '/track/medicine' }, // Red with 4.5:1 contrast
-    { icon: <Insights />, label: t('quickActions.activities'), color: '#558B2F', path: '/activities' }, // Green with 4.5:1 contrast
-    { icon: <SmartToy />, label: t('quickActions.aiAssistant'), color: '#D84315', path: '/ai-assistant' }, // Deep orange with 4.5:1 contrast
+    { icon: <Restaurant />, label: t('quickActions.feeding'), color: theme.palette.primary.main, path: '/track/feeding' },
+    { icon: <Hotel />, label: t('quickActions.sleep'), color: theme.palette.secondary.main, path: '/track/sleep' },
+    { icon: <BabyChangingStation />, label: t('quickActions.diaper'), color: theme.palette.warning.main, path: '/track/diaper' },
+    { icon: <MedicalServices />, label: t('quickActions.medical'), color: theme.palette.error.main, path: '/track/medicine' },
+    { icon: <Insights />, label: t('quickActions.activities'), color: theme.palette.success.main, path: '/activities' },
+    { icon: <SmartToy />, label: t('quickActions.aiAssistant'), color: theme.palette.info.main, path: '/ai-assistant' },
   ];
 
   const formatSleepHours = (minutes: number) => {