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/home/home.component.scss

@@ -31,7 +31,7 @@ $accent: #0ea5e9;
   &::after {
     content: '';
     position: absolute;
-    top: 0; left: 0; right: 0; bottom: 0;
+    inset: 0;
     background: repeating-linear-gradient(108deg, transparent 0, transparent 80px, rgb(255 255 255 / 2.5%) 80px, rgb(255 255 255 / 2.5%) 160px);
     pointer-events: none;
   }
@@ -47,7 +47,7 @@ $accent: #0ea5e9;
     margin: 0;
     font-size: 20px;
     font-weight: 400;
-    color: rgba(255, 255, 255, 0.9);
+    color: rgb(255 255 255 / 90%);
 
     strong {
       font-weight: 700;
@@ -59,7 +59,7 @@ $accent: #0ea5e9;
 .welcome-sub {
   margin: 4px 0 0;
   font-size: 12px;
-  color: rgba(255, 255, 255, 0.5);
+  color: rgb(255 255 255 / 50%);
 }
 
 .welcome-right {
@@ -72,21 +72,21 @@ $accent: #0ea5e9;
   display: flex;
   align-items: center;
   gap: 8px;
-  background: rgba(255, 255, 255, 0.1);
-  border: 1px solid rgba(255, 255, 255, 0.15);
+  background: rgb(255 255 255 / 10%);
+  border: 1px solid rgb(255 255 255 / 15%);
   border-radius: 6px;
   padding: 6px 14px;
   min-width: 280px;
   transition: background 0.15s;
 
   &:focus-within {
-    background: rgba(255, 255, 255, 0.18);
-    border-color: rgba(255, 255, 255, 0.3);
+    background: rgb(255 255 255 / 18%);
+    border-color: rgb(255 255 255 / 30%);
   }
 }
 
 .search-icon {
-  color: rgba(255, 255, 255, 0.5);
+  color: rgb(255 255 255 / 50%);
   font-size: 13px;
 }
 
@@ -99,7 +99,7 @@ $accent: #0ea5e9;
   width: 100%;
 
   &::placeholder {
-    color: rgba(255, 255, 255, 0.45);
+    color: rgb(255 255 255 / 45%);
   }
 }
 
@@ -115,16 +115,16 @@ $accent: #0ea5e9;
   display: flex;
   align-items: center;
   gap: 10px;
-  padding: 14px 14px;
+  padding: 14px;
   background: #fff;
-  border: 1px solid rgba(0, 0, 0, 0.06);
+  border: 1px solid rgb(0 0 0 / 6%);
   border-radius: 8px;
   text-decoration: none;
   transition: box-shadow 0.15s, transform 0.15s;
   cursor: pointer;
 
   &:hover {
-    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
+    box-shadow: 0 4px 16px rgb(0 0 0 / 8%);
     transform: translateY(-1px);
   }
 }
@@ -175,7 +175,7 @@ $accent: #0ea5e9;
 
 .info-card {
   background: #fff;
-  border: 1px solid rgba(0, 0, 0, 0.06);
+  border: 1px solid rgb(0 0 0 / 6%);
   border-radius: 8px;
   overflow: hidden;
 }
@@ -186,7 +186,7 @@ $accent: #0ea5e9;
   gap: 8px;
   padding: 10px 16px;
   background: #fafafa;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
+  border-bottom: 1px solid rgb(0 0 0 / 4%);
   font-size: 13px;
   font-weight: 600;
   color: #333;
@@ -208,7 +208,7 @@ $accent: #0ea5e9;
   display: flex;
   flex-direction: column;
   padding: 8px 16px;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
+  border-bottom: 1px solid rgb(0 0 0 / 3%);
 
   &:nth-last-child(-n+2) {
     border-bottom: none;
@@ -239,7 +239,7 @@ $accent: #0ea5e9;
     text-decoration: none;
     padding: 7px 16px;
     transition: background 0.1s;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
+    border-bottom: 1px solid rgb(0 0 0 / 3%);
 
     &:hover {
       background: #f0f9ff;
@@ -256,7 +256,7 @@ $accent: #0ea5e9;
 :host-context(.dark-theme) {
   .qa-card, .info-card {
     background: #1e1e2e;
-    border-color: rgba(255, 255, 255, 0.06);
+    border-color: rgb(255 255 255 / 6%);
   }
 
   .qa-title { color: #e0e0e0; }
@@ -267,7 +267,7 @@ $accent: #0ea5e9;
 
   .quick-links a {
     color: #7dd3fc;
-    &:hover { background: rgba(255, 255, 255, 0.04); }
+    &:hover { background: rgb(255 255 255 / 4%); }
   }
 
   .search-input {
@@ -276,13 +276,13 @@ $accent: #0ea5e9;
 }
 
 /* ── Responsive ── */
-@media (max-width: 1024px) {
+@media (width <= 1024px) {
   .quick-actions {
     grid-template-columns: repeat(3, 1fr);
   }
 }
 
-@media (max-width: 768px) {
+@media (width <= 768px) {
   .welcome-banner {
     flex-direction: column;
     align-items: stretch;
@@ -302,7 +302,7 @@ $accent: #0ea5e9;
   }
 }
 
-@media (max-width: 480px) {
+@media (width <= 480px) {
   .quick-actions {
     grid-template-columns: 1fr;
   }