feat(clients): dual-OTP contact-change verification, webcam signature capture, and client history tab

Frontend counterpart to the backend dual-OTP contact-change feature:

- New ContactOtpBlockComponent (6-box segmented OTP input) used up to 4x in
  Edit Client (old/new mobile, old/new email — grouped under per-field
  sub-headers) and once each for mobile/email in Create Client, gating
  Save/Save & Next until every required box is verified.
- edit-client.component.ts: detects mobile/email/DOB changes against the
  loaded snapshot using local-date comparison (not `.toISOString()`, which
  false-triggers a day-shift in positive-UTC-offset timezones) and
  trimmed/case-insensitive email comparison (autofill whitespace or re-typed
  casing no longer reads as a change the masked preview can't explain).
- client-kyc-step.component.ts: new `invalidFieldLabels` getter names every
  currently-invalid required KYC field, surfaced via the Save & Next tooltip
  in both create-client and edit-client so a greyed-out button always
  explains what's still missing instead of a generic message.
- CaptureImageDialogComponent generalized for both profile photo and
  signature (photograph-a-paper-signature) capture:
  - Frame aspect now matches the requested getUserMedia resolution
    (4:3 profile / 16:9 signature) with object-fit: cover, eliminating the
    pillarboxing (black bars) a mismatched box previously caused.
  - Suppresses Chromium's auto-injected PiP/cast corner overlay icons.
  - Frame height capped in vh (not just px) so the dialog fits short
    viewports instead of pushing Cancel/Upload below the fold.
- upload-document-dialog.component.ts: generic Documents-tab upload now also
  offers "Capture from Webcam" alongside Browse, reusing the same capture
  dialog.
- New client History tab (reuses the existing Audit Trail data, scoped to
  this client) and dataUrlToFile/dataUrlToBlob util for routing webcam
  captures through the same upload pipelines as a picked file.

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

src/app/clients/client-stepper/client-general-step/client-general-step.component.html

@@ -995,6 +995,32 @@
           </mat-select>
         </mat-form-field>
       }
+
+      <!-- CLIENT CREATION contact-OTP verification — create mode only. Edit mode already has
+           its own dual old/new OTP panel in EditClientComponent's template; this single
+           "new value" block only makes sense for a brand-new client (no "old" destination to
+           verify against). Each block only appears once its own field passes validation, so
+           staff enter a plausible-looking number/email before being asked to verify it. -->
+      @if (!clientData) {
+        <div class="contact-otp-row">
+          @if (createClientForm.get('mobileNo')?.valid) {
+            <mifosx-client-contact-otp-block
+              channel="MOBILE"
+              [destination]="createClientForm.get('mobileNo')?.value"
+              label="Verify Mobile Number"
+              (stateChange)="onMobileOtpState($event)"
+            ></mifosx-client-contact-otp-block>
+          }
+          @if (createClientForm.get('emailAddress')?.valid) {
+            <mifosx-client-contact-otp-block
+              channel="EMAIL"
+              [destination]="createClientForm.get('emailAddress')?.value"
+              label="Verify Email Address"
+              (stateChange)="onEmailOtpState($event)"
+            ></mifosx-client-contact-otp-block>
+          }
+        </div>
+      }
     </div>
   </div>