Security hardening and edge case fixes across frontend

Security Improvements:
- Add input sanitization utilities (XSS, SQL injection prevention)
- Add token validation with JWT structure verification
- Add secure form validators with pattern enforcement
- Implement proper token storage with encryption support

Service Hardening:
- Add timeout (30s) and retry logic (3 attempts) to all API calls
- Add UUID validation for all ID parameters
- Add null/undefined checks with defensive defaults
- Proper error propagation with typed error handling

Component Fixes:
- Fix memory leaks with takeUntilDestroyed pattern
- Remove mock data fallbacks in error handlers
- Add proper loading/error state management
- Add form field length limits and validation

Files affected: 51 (6000+ lines added for security)

frontend/src/app/shared/components/confirm-dialog/confirm-dialog.component.ts

@@ -9,6 +9,7 @@ export interface ConfirmDialogData {
   confirmText?: string;
   cancelText?: string;
   confirmColor?: 'primary' | 'accent' | 'warn';
+  hideCancel?: boolean;
 }
 
 @Component({
@@ -18,12 +19,14 @@ export interface ConfirmDialogData {
   template: `
     <h2 mat-dialog-title>{{ data.title }}</h2>
     <mat-dialog-content>
-      <p>{{ data.message }}</p>
+      <p [style.white-space]="'pre-wrap'">{{ data.message }}</p>
     </mat-dialog-content>
     <mat-dialog-actions align="end">
-      <button mat-button (click)="onCancel()">
-        {{ data.cancelText || 'Cancel' }}
-      </button>
+      @if (!data.hideCancel) {
+        <button mat-button (click)="onCancel()">
+          {{ data.cancelText || 'Cancel' }}
+        </button>
+      }
       <button mat-raised-button [color]="data.confirmColor || 'primary'" (click)="onConfirm()">
         {{ data.confirmText || 'Confirm' }}
       </button>
@@ -33,7 +36,8 @@ export interface ConfirmDialogData {
     `
       mat-dialog-content p {
         margin: 0;
-        color: rgba(0, 0, 0, 0.54);
+        color: rgba(0, 0, 0, 0.7);
+        line-height: 1.6;
       }
     `,
   ],