cat-documents-ng 0.3.31 → 0.3.32

package/fesm2022/cat-documents-ng.mjs

@@ -5540,91 +5540,27 @@ class DocumentHistoryService {
      * @param docName - The name of the document
      */
     downloadDocument(documentUrl, docName) {
-        console.log('DocumentHistoryService: downloadDocument called with:', { documentUrl, docName });
         if (!documentUrl) {
-            console.warn('DocumentHistoryService: No document URL provided');
             console.warn(ERRORS.NO_DOCUMENT_URL);
             return;
         }
-        console.log('DocumentHistoryService: Starting download request to:', documentUrl);
-        this.http.get(documentUrl, {
-            responseType: 'blob',
-            observe: 'response'
-        }).subscribe({
-            next: (response) => {
-                console.log('DocumentHistoryService: Download response received:', response);
-                console.log('DocumentHistoryService: Response headers:', response.headers);
-                console.log('DocumentHistoryService: Response status:', response.status);
-                const blob = response.body;
-                if (!blob) {
-                    console.error('DocumentHistoryService: No blob data in response');
-                    return;
-                }
-                console.log('DocumentHistoryService: Blob size:', blob.size, 'bytes');
-                console.log('DocumentHistoryService: Blob type:', blob.type);
-                try {
-                    const blobUrl = window.URL.createObjectURL(blob);
-                    console.log('DocumentHistoryService: Created blob URL:', blobUrl);
-                    const a = document.createElement('a');
-                    a.href = blobUrl;
-                    a.download = docName ?? SHARED.DOCUMENT;
-                    a.style.display = SHARED.NONE;
-                    console.log('DocumentHistoryService: Download link created with filename:', a.download);
-                    document.body.appendChild(a);
-                    a.click();
-                    a.remove();
-                    console.log('DocumentHistoryService: Download initiated successfully');
-                    // Clean up blob URL
-                    setTimeout(() => {
-                        window.URL.revokeObjectURL(blobUrl);
-                        console.log('DocumentHistoryService: Blob URL cleaned up');
-                    }, 1000);
-                }
-                catch (error) {
-                    console.error('DocumentHistoryService: Error creating download link:', error);
-                }
+        this.http.get(documentUrl, { responseType: 'blob' }).subscribe({
+            next: (blob) => {
+                const blobUrl = window.URL.createObjectURL(blob);
+                const a = document.createElement('a');
+                a.href = blobUrl;
+                a.download = docName ?? SHARED.DOCUMENT;
+                a.style.display = SHARED.NONE;
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                window.URL.revokeObjectURL(blobUrl);
             },
             error: (err) => {
-                console.error('DocumentHistoryService: Download request failed:', err);
-                console.error('DocumentHistoryService: Error details:', {
-                    status: err.status,
-                    statusText: err.statusText,
-                    message: err.message,
-                    url: documentUrl
-                });
-                // Try alternative download method for CORS issues
-                console.log('DocumentHistoryService: Attempting alternative download method...');
-                this.downloadWithAlternativeMethod(documentUrl, docName);
+                console.error(ERRORS.DOWNLOAD_FAIL, err);
             }
         });
     }
-    /**
-     * Alternative download method for CORS issues
-     * @param documentUrl - The URL of the document to download
-     * @param docName - The name of the document
-     */
-    downloadWithAlternativeMethod(documentUrl, docName) {
-        console.log('DocumentHistoryService: Using alternative download method');
-        try {
-            const a = document.createElement('a');
-            a.href = documentUrl;
-            a.download = docName ?? SHARED.DOCUMENT;
-            a.target = '_blank';
-            a.style.display = SHARED.NONE;
-            console.log('DocumentHistoryService: Alternative download link created:', {
-                href: a.href,
-                download: a.download,
-                target: a.target
-            });
-            document.body.appendChild(a);
-            a.click();
-            a.remove();
-            console.log('DocumentHistoryService: Alternative download method completed');
-        }
-        catch (error) {
-            console.error('DocumentHistoryService: Alternative download method failed:', error);
-        }
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentHistoryService, deps: [{ token: DocumentHistoryStyleService }, { token: i2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentHistoryService, providedIn: 'root' });
 }
@@ -5690,57 +5626,12 @@ class DocumentHistoryComponent {
     get processedHistoryData() {
         return this.documentHistoryService.processHistoryData(this.historyData);
     }
-    /**
-     * Downloads a document when clicked
-     * @param documentUrl - The URL of the document to download
-     * @param docName - The name of the document
-     */
-    downloadDocument(documentUrl, docName) {
-        console.log('DocumentHistoryComponent: downloadDocument called with:', { documentUrl, docName });
-        console.log('DocumentHistoryComponent: Calling service download method...');
-        this.documentHistoryService.downloadDocument(documentUrl, docName);
-    }
-    /**
-     * Test method to verify click events are working
-     */
-    testClick() {
-        console.log('DocumentHistoryComponent: testClick method called successfully!');
-        alert('Click event is working!');
-    }
-    /**
-     * Test method to verify download functionality
-     */
-    testDownload() {
-        console.log('DocumentHistoryComponent: testDownload called');
-        const testUrl = 'https://httpbin.org/pdf';
-        const testName = 'test-document.pdf';
-        console.log('DocumentHistoryComponent: Testing download with:', { testUrl, testName });
-        this.downloadDocument(testUrl, testName);
-    }
-    /**
-     * Debug method for mouse down events
-     */
-    onMouseDown(itemName) {
-        console.log('DocumentHistoryComponent: Mouse down on filename:', itemName);
-    }
-    /**
-     * Debug method for mouse up events
-     */
-    onMouseUp(itemName) {
-        console.log('DocumentHistoryComponent: Mouse up on filename:', itemName);
-    }
-    /**
-     * Debug method for click events
-     */
-    onElementClick(itemName, documentUrl) {
-        console.log('DocumentHistoryComponent: Element clicked:', { itemName, documentUrl });
-    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentHistoryComponent, deps: [{ token: DocumentHistoryService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentHistoryComponent, isStandalone: false, selector: "document-history", inputs: { historyData: "historyData", showHistory: "showHistory" }, ngImport: i0, template: "<div class=\"document-history-container\" *ngIf=\"showHistory && historyData.length > 0\">\r\n  <!-- Test button to verify click events are working -->\r\n  <div class=\"test-section\" style=\"margin-bottom: 10px; padding: 10px; background: #f0f0f0; border: 1px solid #ccc;\">\r\n    <button (click)=\"testClick()\" style=\"padding: 5px 10px; background: #007bff; color: white; border: none; border-radius: 3px; margin-right: 10px;\">\r\n      Test Click Event\r\n    </button>\r\n    <button (click)=\"testDownload()\" style=\"padding: 5px 10px; background: #28a745; color: white; border: none; border-radius: 3px;\">\r\n      Test Download\r\n    </button>\r\n    <span style=\"margin-left: 10px; font-size: 12px; color: #666;\">Click these to test if events are working</span>\r\n  </div>\r\n  \r\n  <div class=\"history-sections\">\r\n    <div class=\"history-section\" *ngFor=\"let section of processedHistoryData\">\r\n      <div *ngIf=\"section.header === 'Initial Request' && section.hasValidContent\" \r\n           class=\"initial-request-section\"\r\n           [ngClass]=\"section.accordionClass\">\r\n        <p-accordion [activeIndex]=\"activeAccordionIndex\" \r\n                     (onOpen)=\"onAccordionOpen()\" \r\n                     (onClose)=\"onAccordionClose()\">\r\n          <p-accordionTab [header]=\"section.header\">\r\n            <div class=\"history-timeline\" *ngIf=\"section.hasValidContent\">\r\n              <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n                <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n                  <div class=\"card-header\">\r\n                    <div class=\"action-info\">\r\n                      <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                        <i [class]=\"item.actionIcon\"></i>\r\n                      </div>\r\n                      <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                        {{ item.label }}\r\n                      </span>\r\n                    </div>\r\n                    <div class=\"timestamp\">\r\n                      {{ item.dateTime }}\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- Description -->\r\n                  <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                    <p class=\"description-text\">{{ item.requestDescription ?? 'No Request' }}</p>\r\n                  </div>\r\n                  \r\n                  <!-- Document details if URL exists -->\r\n                  <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                    <div class=\"document-card\">\r\n                      <div class=\"document-info\">\r\n                        <div class=\"document-icon\">\r\n                          <i class=\"pi pi-file\"></i>\r\n                        </div>\r\n                        <div class=\"document-text\">\r\n                          <div class=\"document-title\">Document</div>\r\n                          <div class=\"document-filename clickable\" \r\n                               (click)=\"downloadDocument(item.documentUrl!, item.docName)\"\r\n                               (mousedown)=\"onMouseDown(item.docName)\"\r\n                               (mouseup)=\"onMouseUp(item.docName)\"\r\n                               title=\"Click to download\"\r\n                               data-debug=\"filename-clickable\"\r\n                               style=\"cursor: pointer; padding: 5px; border: 1px solid #ddd; border-radius: 3px; background: #f8f9fa; display: inline-block; min-width: 100px;\">\r\n                            {{ item.docName || 'Document' }}\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div class=\"document-actions\">\r\n                        <button class=\"action-btn download-btn\" \r\n                                title=\"Download\"\r\n                                (click)=\"downloadDocument(item.documentUrl!, item.docName)\"\r\n                                (mousedown)=\"onMouseDown(item.docName)\"\r\n                                (mouseup)=\"onMouseUp(item.docName)\"\r\n                                data-debug=\"download-button\">\r\n                          <i class=\"pi pi-download\"></i>\r\n                        </button>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- User information -->\r\n                  <div class=\"user-info\">\r\n                    <span class=\"user-name\">{{ item.userName }}</span>\r\n                    <span class=\"user-role\">({{ item.userRole }})</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <!-- Show message if no valid content -->\r\n            <div class=\"no-content-message\" *ngIf=\"!section.hasValidContent\">\r\n              <p>No initial request details available.</p>\r\n            </div>\r\n          </p-accordionTab>\r\n        </p-accordion>\r\n      </div>\r\n      \r\n      <!-- Document History as regular timeline -->\r\n      <div *ngIf=\"section.header !== 'Initial Request'\" class=\"document-history-section\">\r\n        <div class=\"section-header\" *ngIf=\"section.header\">\r\n          <h4 class=\"section-title\">{{ section.header }}</h4>\r\n        </div>\r\n        \r\n        <div class=\"history-timeline\">\r\n          <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n            <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n              <!-- Header with icon and timestamp -->\r\n              <div class=\"card-header\">\r\n                <div class=\"action-info\">\r\n                  <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                    <i [class]=\"item.actionIcon\"></i>\r\n                  </div>\r\n                  <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                    {{ item.label }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"timestamp\">\r\n                  {{ item.dateTime }}\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- Description -->\r\n              <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                <p class=\"description-text\">{{ item.requestDescription }}</p>\r\n              </div>\r\n              \r\n              <!-- Document details if URL exists -->\r\n              <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                <div class=\"document-card\">\r\n                  <div class=\"document-info\">\r\n                    <div class=\"document-icon\">\r\n                      <i class=\"pi pi-file\"></i>\r\n                    </div>\r\n                    <div class=\"document-text\">\r\n                      <div class=\"document-title\">Document</div>\r\n                                             <div class=\"document-filename clickable\" \r\n                            (click)=\"downloadDocument(item.documentUrl!, item.docName)\"\r\n                            (mousedown)=\"onMouseDown(item.docName)\"\r\n                            (mouseup)=\"onMouseUp(item.docName)\"\r\n                            title=\"Click to download\"\r\n                            data-debug=\"filename-clickable-2\"\r\n                            style=\"cursor: pointer; padding: 5px; border: 1px solid #ddd; border-radius: 3px; background: #f8f9fa; display: inline-block; min-width: 100px;\">\r\n                        {{ item.docName || 'Document' }}\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- User information -->\r\n              <div class=\"user-info\">\r\n                <span class=\"user-name\">{{ item.userName }}</span>\r\n                <span class=\"user-role\">({{ item.userRole }})</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!-- Test button to verify click events are working -->\r\n  <div class=\"test-section\" style=\"margin-bottom: 10px; padding: 10px; background: #f0f0f0; border: 1px solid #ccc;\">\r\n    <button (click)=\"testClick()\" style=\"padding: 5px 10px; background: #007bff; color: white; border: none; border-radius: 3px; margin-right: 10px;\">\r\n      Test Click Event\r\n    </button>\r\n    <button (click)=\"testDownload()\" style=\"padding: 5px 10px; background: #28a745; color: white; border: none; border-radius: 3px;\">\r\n      Test Download\r\n    </button>\r\n    <span style=\"margin-left: 10px; font-size: 12px; color: #666;\">Click these to test if events are working</span>\r\n  </div>", styles: [".document-history-container{padding:.75rem;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;max-height:none;overflow-y:auto;min-width:0}.document-history-container .history-header{margin-bottom:1rem}.document-history-container .history-header .history-title{font-size:1.25rem;font-weight:600;color:#374151;margin:0}.document-history-container .history-sections .history-section{margin-bottom:1.5rem}.document-history-container .history-sections .history-section .initial-request-section{margin-bottom:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{background:#fff;border-top:1px solid;border-top-left-radius:8px;border-top-right-radius:8px;border-bottom:none;padding:.75rem 1rem;font-weight:600;color:#1f2937;font-size:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link:focus{box-shadow:none}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link .p-accordion-header-icon{color:#6b7280;font-size:.875rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header.p-highlight .p-accordion-header-link{background:#fff}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content{background:#fff;border:1px solid;border-top:none;border-radius:0 0 8px 8px;padding:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item{margin-bottom:0}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.75rem;border-right:3px solid}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{background:#7d879b;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{color:#1f2937;font-weight:600;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .timestamp{color:#6b7280;font-size:.75rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-description .description-text{color:#374151;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-name{color:#1f2937;font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-content{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-content{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .document-history-section .section-header{margin-bottom:.75rem}.document-history-container .history-sections .history-section .document-history-section .section-header .section-title{font-size:1.25rem;font-weight:500;color:#374151;margin:0}.document-history-container .history-sections .history-section .history-timeline .timeline-item{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card{border-radius:8px;border:1px solid;padding:1rem;position:relative;border-right:3px solid}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-green-50{background-color:#f0fdf4;border-color:#bbf7d0;border-right-color:#10b981}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-red-50{background-color:#fef2f2;border-color:#fecaca;border-right-color:#ef4444}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-blue-50{background-color:#eff6ff;border-color:#bfdbfe;border-right-color:#3b82f6}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-gray-50{background-color:#f8fafc;border-color:#e2e8f0;border-right-color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{font-weight:600;font-size:.875rem;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .timestamp{font-size:.75rem;color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description .description-text{margin:0;color:#374151;font-size:.875rem;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card{background:#fff;border-radius:6px;padding:.75rem;display:flex;justify-content:space-between;align-items:center;border:1px solid #e5e7eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-icon{color:#3b82f6;font-size:1.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-title{font-weight:500;color:#374151;font-size:.875rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename{color:#3b82f6;font-size:.75rem;word-break:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename.clickable{cursor:pointer;text-decoration:underline}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename.clickable:hover{color:#2563eb;text-decoration:none}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions{display:flex;gap:.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn{width:24px;height:24px;border:none;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn{background:#3b82f6;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn:hover{background:#2563eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn{background:#ef4444;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn:hover{background:#dc2626}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn{background:#10b981;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn:hover{background:#059669}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info{text-align:right;font-size:.75rem;color:#374151}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-name{font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.text-green-600{color:#059669}.text-red-600{color:#dc2626}.text-blue-600{color:#2563eb}.text-gray-600{color:#4b5563}.bg-green-50{background-color:#f0fdf4}.bg-red-50{background-color:#fef2f2}.bg-blue-50{background-color:#eff6ff}.bg-gray-50{background-color:#f8fafc}.border-green-200{border-color:#bbf7d0}.border-red-200{border-color:#fecaca}.border-blue-200{border-color:#bfdbfe}.border-gray-200{border-color:#e2e8f0}.icon-bg-green{background-color:#10b981}.icon-bg-red{background-color:#ef4444}.icon-bg-blue{background-color:#3b82f6}.icon-bg-gray{background-color:#6b7280}.no-content-message{text-align:center;padding:2rem;color:#6b7280;font-style:italic}.no-content-message p{margin:0;font-size:.875rem}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i3$2.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentHistoryComponent, isStandalone: false, selector: "document-history", inputs: { historyData: "historyData", showHistory: "showHistory" }, ngImport: i0, template: "<div class=\"document-history-container\" *ngIf=\"showHistory && historyData.length > 0\">\r\n  <div class=\"history-sections\">\r\n    <div class=\"history-section\" *ngFor=\"let section of processedHistoryData\">\r\n      <div *ngIf=\"section.header === 'Initial Request' && section.hasValidContent\" \r\n           class=\"initial-request-section\"\r\n           [ngClass]=\"section.accordionClass\">\r\n        <p-accordion [activeIndex]=\"activeAccordionIndex\" \r\n                     (onOpen)=\"onAccordionOpen()\" \r\n                     (onClose)=\"onAccordionClose()\">\r\n          <p-accordionTab [header]=\"section.header\">\r\n            <div class=\"history-timeline\" *ngIf=\"section.hasValidContent\">\r\n              <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n                <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n                  <div class=\"card-header\">\r\n                    <div class=\"action-info\">\r\n                      <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                        <i [class]=\"item.actionIcon\"></i>\r\n                      </div>\r\n                      <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                        {{ item.label }}\r\n                      </span>\r\n                    </div>\r\n                    <div class=\"timestamp\">\r\n                      {{ item.dateTime }}\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- Description -->\r\n                  <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                    <p class=\"description-text\">{{ item.requestDescription ?? 'No Request' }}</p>\r\n                  </div>\r\n                  \r\n                  <!-- Document details if URL exists -->\r\n                  <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                    <div class=\"document-card\">\r\n                      <div class=\"document-info\">\r\n                        <div class=\"document-icon\">\r\n                          <i class=\"pi pi-file\"></i>\r\n                        </div>\r\n                        <div class=\"document-text\">\r\n                          <div class=\"document-title\">Document</div>\r\n                          <div class=\"document-filename\">\r\n                            <a [href]=\"item.documentUrl\" \r\n                               target=\"_blank\" \r\n                               [title]=\"'Download ' + (item.docName || 'Document')\"\r\n                               class=\"document-link\">\r\n                              {{ item.docName || 'Document' }}\r\n                            </a>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div class=\"document-actions\">\r\n                        <a [href]=\"item.documentUrl\" \r\n                           target=\"_blank\" \r\n                           [title]=\"'Download ' + (item.docName || 'Document')\"\r\n                           class=\"action-btn download-btn\">\r\n                          <i class=\"pi pi-download\"></i>\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- User information -->\r\n                  <div class=\"user-info\">\r\n                    <span class=\"user-name\">{{ item.userName }}</span>\r\n                    <span class=\"user-role\">({{ item.userRole }})</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <!-- Show message if no valid content -->\r\n            <div class=\"no-content-message\" *ngIf=\"!section.hasValidContent\">\r\n              <p>No initial request details available.</p>\r\n            </div>\r\n          </p-accordionTab>\r\n        </p-accordion>\r\n      </div>\r\n      \r\n      <!-- Document History as regular timeline -->\r\n      <div *ngIf=\"section.header !== 'Initial Request'\" class=\"document-history-section\">\r\n        <div class=\"section-header\" *ngIf=\"section.header\">\r\n          <h4 class=\"section-title\">{{ section.header }}</h4>\r\n        </div>\r\n        \r\n        <div class=\"history-timeline\">\r\n          <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n            <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n              <!-- Header with icon and timestamp -->\r\n              <div class=\"card-header\">\r\n                <div class=\"action-info\">\r\n                  <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                    <i [class]=\"item.actionIcon\"></i>\r\n                  </div>\r\n                  <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                    {{ item.label }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"timestamp\">\r\n                  {{ item.dateTime }}\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- Description -->\r\n              <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                <p class=\"description-text\">{{ item.requestDescription }}</p>\r\n              </div>\r\n              \r\n              <!-- Document details if URL exists -->\r\n              <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                <div class=\"document-card\">\r\n                  <div class=\"document-info\">\r\n                    <div class=\"document-icon\">\r\n                      <i class=\"pi pi-file\"></i>\r\n                    </div>\r\n                    <div class=\"document-text\">\r\n                      <div class=\"document-title\">Document</div>\r\n                      <div class=\"document-filename\">\r\n                        <a [href]=\"item.documentUrl\" \r\n                           target=\"_blank\" \r\n                           [title]=\"'Download ' + (item.docName || 'Document')\"\r\n                           class=\"document-link\">\r\n                          {{ item.docName || 'Document' }}\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- User information -->\r\n              <div class=\"user-info\">\r\n                <span class=\"user-name\">{{ item.userName }}</span>\r\n                <span class=\"user-role\">({{ item.userRole }})</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>", styles: [".document-history-container{padding:.75rem;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;max-height:none;overflow-y:auto;min-width:0}.document-history-container .history-header{margin-bottom:1rem}.document-history-container .history-header .history-title{font-size:1.25rem;font-weight:600;color:#374151;margin:0}.document-history-container .history-sections .history-section{margin-bottom:1.5rem}.document-history-container .history-sections .history-section .initial-request-section{margin-bottom:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{background:#fff;border-top:1px solid;border-top-left-radius:8px;border-top-right-radius:8px;border-bottom:none;padding:.75rem 1rem;font-weight:600;color:#1f2937;font-size:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link:focus{box-shadow:none}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link .p-accordion-header-icon{color:#6b7280;font-size:.875rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header.p-highlight .p-accordion-header-link{background:#fff}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content{background:#fff;border:1px solid;border-top:none;border-radius:0 0 8px 8px;padding:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item{margin-bottom:0}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.75rem;border-right:3px solid}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{background:#7d879b;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{color:#1f2937;font-weight:600;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .timestamp{color:#6b7280;font-size:.75rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-description .description-text{color:#374151;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-name{color:#1f2937;font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-content{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-content{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .document-history-section .section-header{margin-bottom:.75rem}.document-history-container .history-sections .history-section .document-history-section .section-header .section-title{font-size:1.25rem;font-weight:500;color:#374151;margin:0}.document-history-container .history-sections .history-section .history-timeline .timeline-item{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card{border-radius:8px;border:1px solid;padding:1rem;position:relative;border-right:3px solid}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-green-50{background-color:#f0fdf4;border-color:#bbf7d0;border-right-color:#10b981}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-red-50{background-color:#fef2f2;border-color:#fecaca;border-right-color:#ef4444}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-blue-50{background-color:#eff6ff;border-color:#bfdbfe;border-right-color:#3b82f6}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-gray-50{background-color:#f8fafc;border-color:#e2e8f0;border-right-color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{font-weight:600;font-size:.875rem;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .timestamp{font-size:.75rem;color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description .description-text{margin:0;color:#374151;font-size:.875rem;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card{background:#fff;border-radius:6px;padding:.75rem;display:flex;justify-content:space-between;align-items:center;border:1px solid #e5e7eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-icon{color:#3b82f6;font-size:1.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-title{font-weight:500;color:#374151;font-size:.875rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename{color:#3b82f6;font-size:.75rem;word-break:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename .document-link{color:#3b82f6;text-decoration:underline;cursor:pointer}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename .document-link:hover{color:#2563eb;text-decoration:none}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions{display:flex;gap:.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn{width:24px;height:24px;border:none;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.75rem;text-decoration:none}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn{background:#3b82f6;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn:hover{background:#2563eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn{background:#ef4444;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn:hover{background:#dc2626}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn{background:#10b981;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn:hover{background:#059669}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info{text-align:right;font-size:.75rem;color:#374151}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-name{font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.text-green-600{color:#059669}.text-red-600{color:#dc2626}.text-blue-600{color:#2563eb}.text-gray-600{color:#4b5563}.bg-green-50{background-color:#f0fdf4}.bg-red-50{background-color:#fef2f2}.bg-blue-50{background-color:#eff6ff}.bg-gray-50{background-color:#f8fafc}.border-green-200{border-color:#bbf7d0}.border-red-200{border-color:#fecaca}.border-blue-200{border-color:#bfdbfe}.border-gray-200{border-color:#e2e8f0}.icon-bg-green{background-color:#10b981}.icon-bg-red{background-color:#ef4444}.icon-bg-blue{background-color:#3b82f6}.icon-bg-gray{background-color:#6b7280}.no-content-message{text-align:center;padding:2rem;color:#6b7280;font-style:italic}.no-content-message p{margin:0;font-size:.875rem}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i3$2.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentHistoryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'document-history', standalone: false, template: "<div class=\"document-history-container\" *ngIf=\"showHistory && historyData.length > 0\">\r\n  <!-- Test button to verify click events are working -->\r\n  <div class=\"test-section\" style=\"margin-bottom: 10px; padding: 10px; background: #f0f0f0; border: 1px solid #ccc;\">\r\n    <button (click)=\"testClick()\" style=\"padding: 5px 10px; background: #007bff; color: white; border: none; border-radius: 3px; margin-right: 10px;\">\r\n      Test Click Event\r\n    </button>\r\n    <button (click)=\"testDownload()\" style=\"padding: 5px 10px; background: #28a745; color: white; border: none; border-radius: 3px;\">\r\n      Test Download\r\n    </button>\r\n    <span style=\"margin-left: 10px; font-size: 12px; color: #666;\">Click these to test if events are working</span>\r\n  </div>\r\n  \r\n  <div class=\"history-sections\">\r\n    <div class=\"history-section\" *ngFor=\"let section of processedHistoryData\">\r\n      <div *ngIf=\"section.header === 'Initial Request' && section.hasValidContent\" \r\n           class=\"initial-request-section\"\r\n           [ngClass]=\"section.accordionClass\">\r\n        <p-accordion [activeIndex]=\"activeAccordionIndex\" \r\n                     (onOpen)=\"onAccordionOpen()\" \r\n                     (onClose)=\"onAccordionClose()\">\r\n          <p-accordionTab [header]=\"section.header\">\r\n            <div class=\"history-timeline\" *ngIf=\"section.hasValidContent\">\r\n              <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n                <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n                  <div class=\"card-header\">\r\n                    <div class=\"action-info\">\r\n                      <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                        <i [class]=\"item.actionIcon\"></i>\r\n                      </div>\r\n                      <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                        {{ item.label }}\r\n                      </span>\r\n                    </div>\r\n                    <div class=\"timestamp\">\r\n                      {{ item.dateTime }}\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- Description -->\r\n                  <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                    <p class=\"description-text\">{{ item.requestDescription ?? 'No Request' }}</p>\r\n                  </div>\r\n                  \r\n                  <!-- Document details if URL exists -->\r\n                  <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                    <div class=\"document-card\">\r\n                      <div class=\"document-info\">\r\n                        <div class=\"document-icon\">\r\n                          <i class=\"pi pi-file\"></i>\r\n                        </div>\r\n                        <div class=\"document-text\">\r\n                          <div class=\"document-title\">Document</div>\r\n                          <div class=\"document-filename clickable\" \r\n                               (click)=\"downloadDocument(item.documentUrl!, item.docName)\"\r\n                               (mousedown)=\"onMouseDown(item.docName)\"\r\n                               (mouseup)=\"onMouseUp(item.docName)\"\r\n                               title=\"Click to download\"\r\n                               data-debug=\"filename-clickable\"\r\n                               style=\"cursor: pointer; padding: 5px; border: 1px solid #ddd; border-radius: 3px; background: #f8f9fa; display: inline-block; min-width: 100px;\">\r\n                            {{ item.docName || 'Document' }}\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div class=\"document-actions\">\r\n                        <button class=\"action-btn download-btn\" \r\n                                title=\"Download\"\r\n                                (click)=\"downloadDocument(item.documentUrl!, item.docName)\"\r\n                                (mousedown)=\"onMouseDown(item.docName)\"\r\n                                (mouseup)=\"onMouseUp(item.docName)\"\r\n                                data-debug=\"download-button\">\r\n                          <i class=\"pi pi-download\"></i>\r\n                        </button>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- User information -->\r\n                  <div class=\"user-info\">\r\n                    <span class=\"user-name\">{{ item.userName }}</span>\r\n                    <span class=\"user-role\">({{ item.userRole }})</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <!-- Show message if no valid content -->\r\n            <div class=\"no-content-message\" *ngIf=\"!section.hasValidContent\">\r\n              <p>No initial request details available.</p>\r\n            </div>\r\n          </p-accordionTab>\r\n        </p-accordion>\r\n      </div>\r\n      \r\n      <!-- Document History as regular timeline -->\r\n      <div *ngIf=\"section.header !== 'Initial Request'\" class=\"document-history-section\">\r\n        <div class=\"section-header\" *ngIf=\"section.header\">\r\n          <h4 class=\"section-title\">{{ section.header }}</h4>\r\n        </div>\r\n        \r\n        <div class=\"history-timeline\">\r\n          <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n            <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n              <!-- Header with icon and timestamp -->\r\n              <div class=\"card-header\">\r\n                <div class=\"action-info\">\r\n                  <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                    <i [class]=\"item.actionIcon\"></i>\r\n                  </div>\r\n                  <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                    {{ item.label }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"timestamp\">\r\n                  {{ item.dateTime }}\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- Description -->\r\n              <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                <p class=\"description-text\">{{ item.requestDescription }}</p>\r\n              </div>\r\n              \r\n              <!-- Document details if URL exists -->\r\n              <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                <div class=\"document-card\">\r\n                  <div class=\"document-info\">\r\n                    <div class=\"document-icon\">\r\n                      <i class=\"pi pi-file\"></i>\r\n                    </div>\r\n                    <div class=\"document-text\">\r\n                      <div class=\"document-title\">Document</div>\r\n                                             <div class=\"document-filename clickable\" \r\n                            (click)=\"downloadDocument(item.documentUrl!, item.docName)\"\r\n                            (mousedown)=\"onMouseDown(item.docName)\"\r\n                            (mouseup)=\"onMouseUp(item.docName)\"\r\n                            title=\"Click to download\"\r\n                            data-debug=\"filename-clickable-2\"\r\n                            style=\"cursor: pointer; padding: 5px; border: 1px solid #ddd; border-radius: 3px; background: #f8f9fa; display: inline-block; min-width: 100px;\">\r\n                        {{ item.docName || 'Document' }}\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- User information -->\r\n              <div class=\"user-info\">\r\n                <span class=\"user-name\">{{ item.userName }}</span>\r\n                <span class=\"user-role\">({{ item.userRole }})</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!-- Test button to verify click events are working -->\r\n  <div class=\"test-section\" style=\"margin-bottom: 10px; padding: 10px; background: #f0f0f0; border: 1px solid #ccc;\">\r\n    <button (click)=\"testClick()\" style=\"padding: 5px 10px; background: #007bff; color: white; border: none; border-radius: 3px; margin-right: 10px;\">\r\n      Test Click Event\r\n    </button>\r\n    <button (click)=\"testDownload()\" style=\"padding: 5px 10px; background: #28a745; color: white; border: none; border-radius: 3px;\">\r\n      Test Download\r\n    </button>\r\n    <span style=\"margin-left: 10px; font-size: 12px; color: #666;\">Click these to test if events are working</span>\r\n  </div>", styles: [".document-history-container{padding:.75rem;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;max-height:none;overflow-y:auto;min-width:0}.document-history-container .history-header{margin-bottom:1rem}.document-history-container .history-header .history-title{font-size:1.25rem;font-weight:600;color:#374151;margin:0}.document-history-container .history-sections .history-section{margin-bottom:1.5rem}.document-history-container .history-sections .history-section .initial-request-section{margin-bottom:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{background:#fff;border-top:1px solid;border-top-left-radius:8px;border-top-right-radius:8px;border-bottom:none;padding:.75rem 1rem;font-weight:600;color:#1f2937;font-size:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link:focus{box-shadow:none}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link .p-accordion-header-icon{color:#6b7280;font-size:.875rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header.p-highlight .p-accordion-header-link{background:#fff}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content{background:#fff;border:1px solid;border-top:none;border-radius:0 0 8px 8px;padding:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item{margin-bottom:0}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.75rem;border-right:3px solid}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{background:#7d879b;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{color:#1f2937;font-weight:600;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .timestamp{color:#6b7280;font-size:.75rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-description .description-text{color:#374151;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-name{color:#1f2937;font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-content{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-content{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .document-history-section .section-header{margin-bottom:.75rem}.document-history-container .history-sections .history-section .document-history-section .section-header .section-title{font-size:1.25rem;font-weight:500;color:#374151;margin:0}.document-history-container .history-sections .history-section .history-timeline .timeline-item{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card{border-radius:8px;border:1px solid;padding:1rem;position:relative;border-right:3px solid}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-green-50{background-color:#f0fdf4;border-color:#bbf7d0;border-right-color:#10b981}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-red-50{background-color:#fef2f2;border-color:#fecaca;border-right-color:#ef4444}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-blue-50{background-color:#eff6ff;border-color:#bfdbfe;border-right-color:#3b82f6}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-gray-50{background-color:#f8fafc;border-color:#e2e8f0;border-right-color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{font-weight:600;font-size:.875rem;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .timestamp{font-size:.75rem;color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description .description-text{margin:0;color:#374151;font-size:.875rem;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card{background:#fff;border-radius:6px;padding:.75rem;display:flex;justify-content:space-between;align-items:center;border:1px solid #e5e7eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-icon{color:#3b82f6;font-size:1.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-title{font-weight:500;color:#374151;font-size:.875rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename{color:#3b82f6;font-size:.75rem;word-break:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename.clickable{cursor:pointer;text-decoration:underline}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename.clickable:hover{color:#2563eb;text-decoration:none}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions{display:flex;gap:.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn{width:24px;height:24px;border:none;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn{background:#3b82f6;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn:hover{background:#2563eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn{background:#ef4444;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn:hover{background:#dc2626}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn{background:#10b981;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn:hover{background:#059669}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info{text-align:right;font-size:.75rem;color:#374151}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-name{font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.text-green-600{color:#059669}.text-red-600{color:#dc2626}.text-blue-600{color:#2563eb}.text-gray-600{color:#4b5563}.bg-green-50{background-color:#f0fdf4}.bg-red-50{background-color:#fef2f2}.bg-blue-50{background-color:#eff6ff}.bg-gray-50{background-color:#f8fafc}.border-green-200{border-color:#bbf7d0}.border-red-200{border-color:#fecaca}.border-blue-200{border-color:#bfdbfe}.border-gray-200{border-color:#e2e8f0}.icon-bg-green{background-color:#10b981}.icon-bg-red{background-color:#ef4444}.icon-bg-blue{background-color:#3b82f6}.icon-bg-gray{background-color:#6b7280}.no-content-message{text-align:center;padding:2rem;color:#6b7280;font-style:italic}.no-content-message p{margin:0;font-size:.875rem}\n"] }]
+            args: [{ selector: 'document-history', standalone: false, template: "<div class=\"document-history-container\" *ngIf=\"showHistory && historyData.length > 0\">\r\n  <div class=\"history-sections\">\r\n    <div class=\"history-section\" *ngFor=\"let section of processedHistoryData\">\r\n      <div *ngIf=\"section.header === 'Initial Request' && section.hasValidContent\" \r\n           class=\"initial-request-section\"\r\n           [ngClass]=\"section.accordionClass\">\r\n        <p-accordion [activeIndex]=\"activeAccordionIndex\" \r\n                     (onOpen)=\"onAccordionOpen()\" \r\n                     (onClose)=\"onAccordionClose()\">\r\n          <p-accordionTab [header]=\"section.header\">\r\n            <div class=\"history-timeline\" *ngIf=\"section.hasValidContent\">\r\n              <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n                <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n                  <div class=\"card-header\">\r\n                    <div class=\"action-info\">\r\n                      <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                        <i [class]=\"item.actionIcon\"></i>\r\n                      </div>\r\n                      <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                        {{ item.label }}\r\n                      </span>\r\n                    </div>\r\n                    <div class=\"timestamp\">\r\n                      {{ item.dateTime }}\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- Description -->\r\n                  <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                    <p class=\"description-text\">{{ item.requestDescription ?? 'No Request' }}</p>\r\n                  </div>\r\n                  \r\n                  <!-- Document details if URL exists -->\r\n                  <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                    <div class=\"document-card\">\r\n                      <div class=\"document-info\">\r\n                        <div class=\"document-icon\">\r\n                          <i class=\"pi pi-file\"></i>\r\n                        </div>\r\n                        <div class=\"document-text\">\r\n                          <div class=\"document-title\">Document</div>\r\n                          <div class=\"document-filename\">\r\n                            <a [href]=\"item.documentUrl\" \r\n                               target=\"_blank\" \r\n                               [title]=\"'Download ' + (item.docName || 'Document')\"\r\n                               class=\"document-link\">\r\n                              {{ item.docName || 'Document' }}\r\n                            </a>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                      <div class=\"document-actions\">\r\n                        <a [href]=\"item.documentUrl\" \r\n                           target=\"_blank\" \r\n                           [title]=\"'Download ' + (item.docName || 'Document')\"\r\n                           class=\"action-btn download-btn\">\r\n                          <i class=\"pi pi-download\"></i>\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  \r\n                  <!-- User information -->\r\n                  <div class=\"user-info\">\r\n                    <span class=\"user-name\">{{ item.userName }}</span>\r\n                    <span class=\"user-role\">({{ item.userRole }})</span>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </div>\r\n            <!-- Show message if no valid content -->\r\n            <div class=\"no-content-message\" *ngIf=\"!section.hasValidContent\">\r\n              <p>No initial request details available.</p>\r\n            </div>\r\n          </p-accordionTab>\r\n        </p-accordion>\r\n      </div>\r\n      \r\n      <!-- Document History as regular timeline -->\r\n      <div *ngIf=\"section.header !== 'Initial Request'\" class=\"document-history-section\">\r\n        <div class=\"section-header\" *ngIf=\"section.header\">\r\n          <h4 class=\"section-title\">{{ section.header }}</h4>\r\n        </div>\r\n        \r\n        <div class=\"history-timeline\">\r\n          <div class=\"timeline-item\" *ngFor=\"let item of section.list; let i = index\">\r\n            <div class=\"timeline-card\" [ngClass]=\"item.actionBgColor\">\r\n              <!-- Header with icon and timestamp -->\r\n              <div class=\"card-header\">\r\n                <div class=\"action-info\">\r\n                  <div class=\"action-icon\" [ngClass]=\"item.actionIconBgColor\">\r\n                    <i [class]=\"item.actionIcon\"></i>\r\n                  </div>\r\n                  <span class=\"action-label\" [ngClass]=\"item.actionColor\">\r\n                    {{ item.label }}\r\n                  </span>\r\n                </div>\r\n                <div class=\"timestamp\">\r\n                  {{ item.dateTime }}\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- Description -->\r\n              <div class=\"card-description\" *ngIf=\"item.requestDescription\">\r\n                <p class=\"description-text\">{{ item.requestDescription }}</p>\r\n              </div>\r\n              \r\n              <!-- Document details if URL exists -->\r\n              <div class=\"document-details\" *ngIf=\"item.documentUrl\">\r\n                <div class=\"document-card\">\r\n                  <div class=\"document-info\">\r\n                    <div class=\"document-icon\">\r\n                      <i class=\"pi pi-file\"></i>\r\n                    </div>\r\n                    <div class=\"document-text\">\r\n                      <div class=\"document-title\">Document</div>\r\n                      <div class=\"document-filename\">\r\n                        <a [href]=\"item.documentUrl\" \r\n                           target=\"_blank\" \r\n                           [title]=\"'Download ' + (item.docName || 'Document')\"\r\n                           class=\"document-link\">\r\n                          {{ item.docName || 'Document' }}\r\n                        </a>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n              \r\n              <!-- User information -->\r\n              <div class=\"user-info\">\r\n                <span class=\"user-name\">{{ item.userName }}</span>\r\n                <span class=\"user-role\">({{ item.userRole }})</span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>", styles: [".document-history-container{padding:.75rem;background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;max-height:none;overflow-y:auto;min-width:0}.document-history-container .history-header{margin-bottom:1rem}.document-history-container .history-header .history-title{font-size:1.25rem;font-weight:600;color:#374151;margin:0}.document-history-container .history-sections .history-section{margin-bottom:1.5rem}.document-history-container .history-sections .history-section .initial-request-section{margin-bottom:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{background:#fff;border-top:1px solid;border-top-left-radius:8px;border-top-right-radius:8px;border-bottom:none;padding:.75rem 1rem;font-weight:600;color:#1f2937;font-size:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link:focus{box-shadow:none}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link .p-accordion-header-icon{color:#6b7280;font-size:.875rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-header.p-highlight .p-accordion-header-link{background:#fff}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content{background:#fff;border:1px solid;border-top:none;border-radius:0 0 8px 8px;padding:1rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item{margin-bottom:0}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.75rem;border-right:3px solid}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{background:#7d879b;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{color:#1f2937;font-weight:600;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-header .timestamp{color:#6b7280;font-size:.75rem}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .card-description .description-text{color:#374151;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-name{color:#1f2937;font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section ::ng-deep .p-accordion .p-accordion-content .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-requested ::ng-deep .p-accordion .p-accordion-content{border-color:#d1d5db}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-uploaded ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-rejected ::ng-deep .p-accordion .p-accordion-content{border-color:#fca5a5}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-header .p-accordion-header-link{border-color:#86efac}.document-history-container .history-sections .history-section .initial-request-section.document-accepted ::ng-deep .p-accordion .p-accordion-content{border-color:#86efac}.document-history-container .history-sections .history-section .document-history-section .section-header{margin-bottom:.75rem}.document-history-container .history-sections .history-section .document-history-section .section-header .section-title{font-size:1.25rem;font-weight:500;color:#374151;margin:0}.document-history-container .history-sections .history-section .history-timeline .timeline-item{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card{border-radius:8px;border:1px solid;padding:1rem;position:relative;border-right:3px solid}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-green-50{background-color:#f0fdf4;border-color:#bbf7d0;border-right-color:#10b981}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-red-50{background-color:#fef2f2;border-color:#fecaca;border-right-color:#ef4444}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-blue-50{background-color:#eff6ff;border-color:#bfdbfe;border-right-color:#3b82f6}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card.bg-gray-50{background-color:#f8fafc;border-color:#e2e8f0;border-right-color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-icon i{font-size:14px}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .action-info .action-label{font-weight:600;font-size:.875rem;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-header .timestamp{font-size:.75rem;color:#6b7280}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .card-description .description-text{margin:0;color:#374151;font-size:.875rem;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details{margin-bottom:.75rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card{background:#fff;border-radius:6px;padding:.75rem;display:flex;justify-content:space-between;align-items:center;border:1px solid #e5e7eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info{display:flex;align-items:center;gap:.5rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-icon{color:#3b82f6;font-size:1.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-title{font-weight:500;color:#374151;font-size:.875rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename{color:#3b82f6;font-size:.75rem;word-break:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename .document-link{color:#3b82f6;text-decoration:underline;cursor:pointer}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-info .document-text .document-filename .document-link:hover{color:#2563eb;text-decoration:none}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions{display:flex;gap:.25rem}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn{width:24px;height:24px;border:none;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.75rem;text-decoration:none}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn{background:#3b82f6;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.edit-btn:hover{background:#2563eb}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn{background:#ef4444;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.delete-btn:hover{background:#dc2626}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn{background:#10b981;color:#fff}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .document-details .document-card .document-actions .action-btn.download-btn:hover{background:#059669}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info{text-align:right;font-size:.75rem;color:#374151}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-name{font-weight:500;word-wrap:break-word;overflow-wrap:break-word}.document-history-container .history-sections .history-section .history-timeline .timeline-item .timeline-card .user-info .user-role{color:#6b7280;word-wrap:break-word;overflow-wrap:break-word}.text-green-600{color:#059669}.text-red-600{color:#dc2626}.text-blue-600{color:#2563eb}.text-gray-600{color:#4b5563}.bg-green-50{background-color:#f0fdf4}.bg-red-50{background-color:#fef2f2}.bg-blue-50{background-color:#eff6ff}.bg-gray-50{background-color:#f8fafc}.border-green-200{border-color:#bbf7d0}.border-red-200{border-color:#fecaca}.border-blue-200{border-color:#bfdbfe}.border-gray-200{border-color:#e2e8f0}.icon-bg-green{background-color:#10b981}.icon-bg-red{background-color:#ef4444}.icon-bg-blue{background-color:#3b82f6}.icon-bg-gray{background-color:#6b7280}.no-content-message{text-align:center;padding:2rem;color:#6b7280;font-style:italic}.no-content-message p{margin:0;font-size:.875rem}\n"] }]
         }], ctorParameters: () => [{ type: DocumentHistoryService }], propDecorators: { historyData: [{
                 type: Input
             }], showHistory: [{