feat: Client & CKYC UI improvements — filters, KYC management, image crop+merge

- Clients list: CKYC icon, CKYC Number column, status/legal form/CKYC filters
- CKYC: SFTP upload logs, date formatting, modal z-index fix, non-dismissible dialogs
- KYC Management: new standalone module with alert dashboard, notification scheduler, audit inventory, account status
- Image cropper: ngx-image-cropper integration for front+back document merge into single PNG
- Sidebar: KYC Management menu entry after CKYC

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

src/app/clients/clients-view/nominee-tab/nominee-tab.component.scss

@@ -16,7 +16,7 @@ $primary-light: #e8f0fe;
   &__left { display: flex; align-items: center; gap: 10px; }
   &__icon { color: #60a5fa; }
   &__title { font-size: 15px; font-weight: 600; color: #fff; margin: 0; }
-  &__sub { font-size: 10px; color: rgba(255,255,255,0.45); margin: 1px 0 0; }
+  &__sub { font-size: 10px; color: rgb(255 255 255 / 45%); margin: 1px 0 0; }
 }
 
 .nom-loading { display: flex; align-items: center; gap: 8px; padding: 24px 0; justify-content: center; font-size: 13px; color: #64748b;
@@ -36,12 +36,14 @@ $primary-light: #e8f0fe;
   &__right { display: flex; align-items: center; gap: 10px; }
 }
 .nom-type-chips { display: flex; gap: 6px; flex-wrap: wrap; }
+
 .nom-type-chip {
   display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px;
   border: 1.5px solid #e2e8f0; border-radius: 6px; background: #fff;
   font-size: 12px; font-weight: 500; color: #64748b; cursor: pointer; transition: all 0.15s;
   mat-icon { font-size: 16px; width: 16px; height: 16px; }
   &__count { font-size: 9px; font-weight: 700; background: #f1f5f9; color: #64748b; padding: 0 5px; border-radius: 6px; }
+
   &.active { border-color: $primary; background: $primary-light; color: $primary;
     .nom-type-chip__count { background: $primary; color: #fff; }
   }
@@ -56,6 +58,7 @@ $primary-light: #e8f0fe;
   background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 6px; margin-bottom: 8px;
   &__label { font-size: 11px; font-weight: 600; color: #64748b; white-space: nowrap; }
   &__track { flex: 1; height: 6px; background: #e2e8f0; border-radius: 3px; overflow: hidden; }
+
   &__fill {
     height: 100%; border-radius: 3px; transition: width 0.3s;
     background: linear-gradient(90deg, #3b82f6, #10b981);
@@ -67,12 +70,14 @@ $primary-light: #e8f0fe;
 /* Nominee card — compact */
 .nom-card { border: 1px solid #e2e8f0; border-radius: 6px; margin-bottom: 6px; overflow: hidden; }
 .nom-card__main { display: flex; align-items: center; gap: 10px; padding: 8px 12px; }
+
 .nom-card__avatar {
   width: 32px; height: 32px; border-radius: 50%; background: #dbeafe;
   display: flex; align-items: center; justify-content: center; color: #1565c0; flex-shrink: 0;
   mat-icon { font-size: 18px; }
 }
 .nom-card__photo { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
+
 .nom-card__sig {
   flex-shrink: 0;
   img { height: 24px; max-width: 60px; object-fit: contain; border: 1px solid #e2e8f0; border-radius: 3px; background: #fff; padding: 1px 3px; }
@@ -80,6 +85,7 @@ $primary-light: #e8f0fe;
 .nom-card__info { flex: 1; min-width: 0; }
 .nom-card__name { font-weight: 600; font-size: 13px; color: #1e293b; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .nom-card__meta { font-size: 11px; color: #64748b; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+
 .nom-card__id {
   font-size: 10px; font-weight: 600; color: #1d4ed8; background: #eff6ff;
   padding: 2px 8px; border-radius: 4px; white-space: nowrap;
@@ -87,12 +93,15 @@ $primary-light: #e8f0fe;
 }
 .nom-card__share { text-align: center; min-width: 40px; flex-shrink: 0; }
 .nom-card__share-value { font-size: 15px; font-weight: 700; color: #1565c0; }
+
 .nom-card__actions { display: flex; gap: 0; flex-shrink: 0;
+
   button { width: 32px !important; height: 32px !important; line-height: 32px !important;
     mat-icon { font-size: 18px; }
   }
 }
 .nom-card__delete { color: #94a3b8 !important; &:hover { color: #ef4444 !important; } }
+
 .nom-card__guardian {
   display: flex; align-items: center; gap: 5px; padding: 5px 12px; background: #fff7ed;
   font-size: 11px; color: #92400e; border-top: 1px solid #fde68a;
@@ -122,13 +131,15 @@ $primary-light: #e8f0fe;
 .nom-search-wrapper { position: relative; margin-bottom: 8px; }
 .nom-search-field { width: 100%; }
 .nom-search-prefix { color: #94a3b8; }
+
 .nom-search-results {
   position: absolute; top: 56px; left: 0; right: 0; z-index: 100;
   background: #fff; border: 1px solid #e2e8f0; border-radius: 6px;
-  box-shadow: 0 6px 20px rgba(0,0,0,0.1); max-height: 220px; overflow-y: auto;
+  box-shadow: 0 6px 20px rgb(0 0 0 / 10%); max-height: 220px; overflow-y: auto;
   &--inline { position: relative; top: 0; margin-top: 4px; }
 }
 .nom-search-loading { display: flex; align-items: center; gap: 6px; padding: 10px 12px; font-size: 12px; color: #64748b; }
+
 .nom-search-item {
   display: flex; align-items: center; gap: 8px; padding: 8px 12px; cursor: pointer; border-bottom: 1px solid #f1f5f9;
   &:last-child { border-bottom: none; } &:hover { background: #f0f7ff; }
@@ -149,6 +160,7 @@ $primary-light: #e8f0fe;
   &__info { flex: 1; display: flex; flex-direction: column; }
   &__name { font-size: 13px; font-weight: 600; color: #1e293b; }
   &__meta { font-size: 11px; color: #64748b; font-family: 'Roboto Mono', monospace; }
+
   &__sig {
     flex-shrink: 0;
     img { height: 24px; max-width: 60px; object-fit: contain; border: 1px solid #e2e8f0; border-radius: 3px; background: #fff; padding: 1px 3px; }
@@ -174,10 +186,11 @@ $primary-light: #e8f0fe;
 /* Guardian */
 .nom-guardian-section { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
 .nom-guardian-label { display: flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: #92400e; mat-icon { font-size: 16px; } }
+
 .nom-guardian-selected { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 500; color: #1e293b;
   button { width: 24px !important; height: 24px !important; line-height: 24px !important; mat-icon { font-size: 14px; } }
 }
 
 /* Zoom */
-.zoomable { cursor: zoom-in; transition: transform 0.15s; &:hover { transform: scale(1.08); box-shadow: 0 4px 12px rgba(0,0,0,0.15); } }
+.zoomable { cursor: zoom-in; transition: transform 0.15s; &:hover { transform: scale(1.08); box-shadow: 0 4px 12px rgb(0 0 0 / 15%); } }
 ::ng-deep .image-zoom-panel { .mat-mdc-dialog-container { padding: 0 !important; border-radius: 8px !important; overflow: hidden; } }