@lesterarte/sefin-ui 0.0.35 → 0.0.36

package/fesm2022/lesterarte-sefin-ui.mjs

@@ -6151,10 +6151,6 @@ class SidebarComponent {
                 this.currentRoute = event.urlAfterRedirects;
                 // Auto-expand parent items if child is active
                 this.updateExpandedStates();
-                // Close sidebar on mobile when navigating
-                if (this.effectiveIsMobile && this.isOpen) {
-                    this.handleClose();
-                }
                 this.cdr.markForCheck();
             }
         });
@@ -6171,10 +6167,6 @@ class SidebarComponent {
             if (this.mediaQuery.addEventListener && !this.mediaQueryHandler) {
                 this.mediaQueryHandler = (e) => {
                     this._autoDetectedMobile = e.matches;
-                    // Close sidebar when switching to desktop
-                    if (!e.matches && this.isOpen) {
-                        this.handleClose();
-                    }
                     this.cdr.markForCheck();
                 };
                 this.mediaQuery.addEventListener('change', this.mediaQueryHandler);
@@ -6183,9 +6175,6 @@ class SidebarComponent {
                 // Fallback for older browsers
                 this.mediaQueryHandler = (e) => {
                     this._autoDetectedMobile = e.matches;
-                    if (!e.matches && this.isOpen) {
-                        this.handleClose();
-                    }
                     this.cdr.markForCheck();
                 };
                 this.mediaQuery.addListener(this.mediaQueryHandler);
@@ -6256,17 +6245,6 @@ class SidebarComponent {
     handleClose() {
         this.close.emit();
     }
-    handleOverlayClick() {
-        if (this.effectiveIsMobile && this.isOpen) {
-            this.handleClose();
-        }
-    }
-    handleEscapeKey(event) {
-        if (event.key === 'Escape' && this.effectiveIsMobile && this.isOpen) {
-            event.preventDefault();
-            this.handleClose();
-        }
-    }
     /**
      * Get SVG icon as SafeHtml based on icon name
      */
@@ -6291,11 +6269,11 @@ class SidebarComponent {
         return this.sanitizer.bypassSecurityTrustHtml(svg);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SidebarComponent, deps: [{ token: i1$2.Router }, { token: i0.ChangeDetectorRef }, { token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SidebarComponent, isStandalone: true, selector: "sefin-sidebar", inputs: { navItems: "navItems", isMobile: "isMobile", isOpen: "isOpen", isCollapsed: "isCollapsed", headerTitle: "headerTitle", headerSubtitle: "headerSubtitle", headerIcon: "headerIcon", footerVersion: "footerVersion", showFooter: "showFooter" }, outputs: { toggleCollapse: "toggleCollapse", toggleOpen: "toggleOpen", close: "close" }, host: { listeners: { "document:keydown": "handleEscapeKey($event)" } }, usesOnChanges: true, ngImport: i0, template: "<!-- Overlay for mobile -->\n@if (effectiveIsMobile && isOpen) {\n  <div\n    class=\"sefin-sidebar__overlay\"\n    (click)=\"handleOverlayClick()\"\n    [attr.aria-hidden]=\"!isOpen\"\n    role=\"presentation\"\n  ></div>\n}\n\n<aside\n  class=\"sefin-sidebar\"\n  [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n  [class.sefin-sidebar--open]=\"isOpen\"\n  [class.sefin-sidebar--collapsed]=\"isCollapsed && !effectiveIsMobile\"\n  [attr.aria-hidden]=\"effectiveIsMobile && !isOpen\"\n>\n  <div class=\"sefin-sidebar__header\">\n    @if (!isCollapsed || effectiveIsMobile) {\n      <div class=\"sefin-sidebar__header-content\">\n        <div class=\"sefin-sidebar__header-icon-container\">\n          <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n        </div>\n        <div class=\"sefin-sidebar__header-text\">\n          <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n          <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n        </div>\n      </div>\n    }\n    @if (effectiveIsMobile) {\n      <button\n        type=\"button\"\n        class=\"sefin-sidebar__close-button\"\n        (click)=\"handleClose()\"\n        aria-label=\"Close sidebar\"\n      >\n        <span class=\"sefin-sidebar__close-icon\" [innerHTML]=\"getIconSvg('x', 20)\"></span>\n      </button>\n    }\n    @if (!effectiveIsMobile) {\n      <button\n        type=\"button\"\n        class=\"sefin-sidebar__toggle\"\n        (click)=\"handleToggleCollapse()\"\n        [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n      >\n        <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n      </button>\n    }\n  </div>\n\n  <nav class=\"sefin-sidebar__nav\">\n    <ul class=\"sefin-sidebar__nav-list\">\n      @for (item of navItems; track item.label) {\n        <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n          <!-- Parent item -->\n          <button\n            type=\"button\"\n            class=\"sefin-sidebar__nav-link\"\n            [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n            [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n            [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n            [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n            [attr.aria-label]=\"isCollapsed && !effectiveIsMobile ? item.label : null\"\n            (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n          >\n            @if (item.icon) {\n              <div class=\"sefin-sidebar__nav-icon-wrapper\">\n                <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n              </div>\n            }\n            @if (!isCollapsed || effectiveIsMobile) {\n              <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n              @if (hasChildren(item)) {\n                <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n                  <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n                </div>\n              }\n            }\n          </button>\n          <!-- Children items -->\n          @if (hasChildren(item) && item.expanded && (!isCollapsed || effectiveIsMobile)) {\n            <ul class=\"sefin-sidebar__nav-sub-list\">\n              @for (child of item.children; track child.label) {\n                <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n                  <!-- Level 1: Section headers (non-clickable) -->\n                  <div class=\"sefin-sidebar__nav-section-header\">\n                    <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n                  </div>\n                  <!-- Level 2: Grandchildren items (clickable with bullets) -->\n                  @if (hasChildren(child)) {\n                    <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n                      @for (grandchild of child.children; track grandchild.label) {\n                        <li class=\"sefin-sidebar__nav-sub-sub-item\">\n                          <button\n                            type=\"button\"\n                            class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n                            [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n                            [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n                            (click)=\"navigate(grandchild.route || '')\"\n                          >\n                            @if (!isActive(grandchild.route || '')) {\n                              <div class=\"sefin-sidebar__nav-bullet\"></div>\n                            }\n                            <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n                          </button>\n                        </li>\n                      }\n                    </ul>\n                  }\n                </li>\n              }\n            </ul>\n          }\n        </li>\n      }\n    </ul>\n  </nav>\n  \n  @if (showFooter) {\n    <div class=\"sefin-sidebar__footer\">\n      <div class=\"sefin-sidebar__footer-content\">\n        <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n      </div>\n    </div>\n  }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(-100%);z-index:1000}.sefin-sidebar.sefin-sidebar--mobile.sefin-sidebar--open{transform:translate(0)}.sefin-sidebar__overlay{position:fixed;inset:0;background:#00000080;z-index:999;animation:fadeIn .2s ease-in-out;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.sefin-sidebar{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SidebarComponent, isStandalone: true, selector: "sefin-sidebar", inputs: { navItems: "navItems", isMobile: "isMobile", isOpen: "isOpen", isCollapsed: "isCollapsed", headerTitle: "headerTitle", headerSubtitle: "headerSubtitle", headerIcon: "headerIcon", footerVersion: "footerVersion", showFooter: "showFooter" }, outputs: { toggleCollapse: "toggleCollapse", toggleOpen: "toggleOpen", close: "close" }, usesOnChanges: true, ngImport: i0, template: "<aside\n  class=\"sefin-sidebar\"\n  [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n  [class.sefin-sidebar--collapsed]=\"effectiveIsMobile || isCollapsed\"\n>\n  <div class=\"sefin-sidebar__header\">\n    @if (!effectiveIsMobile && !isCollapsed) {\n      <div class=\"sefin-sidebar__header-content\">\n        <div class=\"sefin-sidebar__header-icon-container\">\n          <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n        </div>\n        <div class=\"sefin-sidebar__header-text\">\n          <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n          <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n        </div>\n      </div>\n    }\n    @if (effectiveIsMobile) {\n      <div class=\"sefin-sidebar__header-content\">\n        <div class=\"sefin-sidebar__header-icon-container\">\n          <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n        </div>\n      </div>\n    }\n    @if (!effectiveIsMobile) {\n      <button\n        type=\"button\"\n        class=\"sefin-sidebar__toggle\"\n        (click)=\"handleToggleCollapse()\"\n        [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n      >\n        <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n      </button>\n    }\n  </div>\n\n  <nav class=\"sefin-sidebar__nav\">\n    <ul class=\"sefin-sidebar__nav-list\">\n      @for (item of navItems; track item.label) {\n        <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n          <!-- Parent item -->\n          <button\n            type=\"button\"\n            class=\"sefin-sidebar__nav-link\"\n            [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n            [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n            [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n            [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n            [attr.aria-label]=\"(effectiveIsMobile || isCollapsed) ? item.label : null\"\n            (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n          >\n            @if (item.icon) {\n              <div class=\"sefin-sidebar__nav-icon-wrapper\">\n                <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n              </div>\n            }\n            @if (!effectiveIsMobile && !isCollapsed) {\n              <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n              @if (hasChildren(item)) {\n                <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n                  <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n                </div>\n              }\n            }\n          </button>\n          <!-- Children items -->\n          @if (hasChildren(item) && item.expanded && !effectiveIsMobile && !isCollapsed) {\n            <ul class=\"sefin-sidebar__nav-sub-list\">\n              @for (child of item.children; track child.label) {\n                <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n                  <!-- Level 1: Section headers (non-clickable) -->\n                  <div class=\"sefin-sidebar__nav-section-header\">\n                    <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n                  </div>\n                  <!-- Level 2: Grandchildren items (clickable with bullets) -->\n                  @if (hasChildren(child)) {\n                    <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n                      @for (grandchild of child.children; track grandchild.label) {\n                        <li class=\"sefin-sidebar__nav-sub-sub-item\">\n                          <button\n                            type=\"button\"\n                            class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n                            [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n                            [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n                            (click)=\"navigate(grandchild.route || '')\"\n                          >\n                            @if (!isActive(grandchild.route || '')) {\n                              <div class=\"sefin-sidebar__nav-bullet\"></div>\n                            }\n                            <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n                          </button>\n                        </li>\n                      }\n                    </ul>\n                  }\n                </li>\n              }\n            </ul>\n          }\n        </li>\n      }\n    </ul>\n  </nav>\n  \n  @if (showFooter) {\n    <div class=\"sefin-sidebar__footer\">\n      <div class=\"sefin-sidebar__footer-content\">\n        <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n      </div>\n    </div>\n  }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(0);z-index:1000;width:80px;min-width:80px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SidebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sefin-sidebar', standalone: true, imports: [CommonModule, RouterModule], changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!-- Overlay for mobile -->\n@if (effectiveIsMobile && isOpen) {\n  <div\n    class=\"sefin-sidebar__overlay\"\n    (click)=\"handleOverlayClick()\"\n    [attr.aria-hidden]=\"!isOpen\"\n    role=\"presentation\"\n  ></div>\n}\n\n<aside\n  class=\"sefin-sidebar\"\n  [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n  [class.sefin-sidebar--open]=\"isOpen\"\n  [class.sefin-sidebar--collapsed]=\"isCollapsed && !effectiveIsMobile\"\n  [attr.aria-hidden]=\"effectiveIsMobile && !isOpen\"\n>\n  <div class=\"sefin-sidebar__header\">\n    @if (!isCollapsed || effectiveIsMobile) {\n      <div class=\"sefin-sidebar__header-content\">\n        <div class=\"sefin-sidebar__header-icon-container\">\n          <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n        </div>\n        <div class=\"sefin-sidebar__header-text\">\n          <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n          <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n        </div>\n      </div>\n    }\n    @if (effectiveIsMobile) {\n      <button\n        type=\"button\"\n        class=\"sefin-sidebar__close-button\"\n        (click)=\"handleClose()\"\n        aria-label=\"Close sidebar\"\n      >\n        <span class=\"sefin-sidebar__close-icon\" [innerHTML]=\"getIconSvg('x', 20)\"></span>\n      </button>\n    }\n    @if (!effectiveIsMobile) {\n      <button\n        type=\"button\"\n        class=\"sefin-sidebar__toggle\"\n        (click)=\"handleToggleCollapse()\"\n        [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n      >\n        <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n      </button>\n    }\n  </div>\n\n  <nav class=\"sefin-sidebar__nav\">\n    <ul class=\"sefin-sidebar__nav-list\">\n      @for (item of navItems; track item.label) {\n        <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n          <!-- Parent item -->\n          <button\n            type=\"button\"\n            class=\"sefin-sidebar__nav-link\"\n            [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n            [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n            [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n            [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n            [attr.aria-label]=\"isCollapsed && !effectiveIsMobile ? item.label : null\"\n            (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n          >\n            @if (item.icon) {\n              <div class=\"sefin-sidebar__nav-icon-wrapper\">\n                <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n              </div>\n            }\n            @if (!isCollapsed || effectiveIsMobile) {\n              <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n              @if (hasChildren(item)) {\n                <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n                  <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n                </div>\n              }\n            }\n          </button>\n          <!-- Children items -->\n          @if (hasChildren(item) && item.expanded && (!isCollapsed || effectiveIsMobile)) {\n            <ul class=\"sefin-sidebar__nav-sub-list\">\n              @for (child of item.children; track child.label) {\n                <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n                  <!-- Level 1: Section headers (non-clickable) -->\n                  <div class=\"sefin-sidebar__nav-section-header\">\n                    <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n                  </div>\n                  <!-- Level 2: Grandchildren items (clickable with bullets) -->\n                  @if (hasChildren(child)) {\n                    <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n                      @for (grandchild of child.children; track grandchild.label) {\n                        <li class=\"sefin-sidebar__nav-sub-sub-item\">\n                          <button\n                            type=\"button\"\n                            class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n                            [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n                            [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n                            (click)=\"navigate(grandchild.route || '')\"\n                          >\n                            @if (!isActive(grandchild.route || '')) {\n                              <div class=\"sefin-sidebar__nav-bullet\"></div>\n                            }\n                            <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n                          </button>\n                        </li>\n                      }\n                    </ul>\n                  }\n                </li>\n              }\n            </ul>\n          }\n        </li>\n      }\n    </ul>\n  </nav>\n  \n  @if (showFooter) {\n    <div class=\"sefin-sidebar__footer\">\n      <div class=\"sefin-sidebar__footer-content\">\n        <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n      </div>\n    </div>\n  }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(-100%);z-index:1000}.sefin-sidebar.sefin-sidebar--mobile.sefin-sidebar--open{transform:translate(0)}.sefin-sidebar__overlay{position:fixed;inset:0;background:#00000080;z-index:999;animation:fadeIn .2s ease-in-out;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.sefin-sidebar{display:none}}\n"] }]
+            args: [{ selector: 'sefin-sidebar', standalone: true, imports: [CommonModule, RouterModule], changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<aside\n  class=\"sefin-sidebar\"\n  [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n  [class.sefin-sidebar--collapsed]=\"effectiveIsMobile || isCollapsed\"\n>\n  <div class=\"sefin-sidebar__header\">\n    @if (!effectiveIsMobile && !isCollapsed) {\n      <div class=\"sefin-sidebar__header-content\">\n        <div class=\"sefin-sidebar__header-icon-container\">\n          <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n        </div>\n        <div class=\"sefin-sidebar__header-text\">\n          <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n          <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n        </div>\n      </div>\n    }\n    @if (effectiveIsMobile) {\n      <div class=\"sefin-sidebar__header-content\">\n        <div class=\"sefin-sidebar__header-icon-container\">\n          <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n        </div>\n      </div>\n    }\n    @if (!effectiveIsMobile) {\n      <button\n        type=\"button\"\n        class=\"sefin-sidebar__toggle\"\n        (click)=\"handleToggleCollapse()\"\n        [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n      >\n        <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n      </button>\n    }\n  </div>\n\n  <nav class=\"sefin-sidebar__nav\">\n    <ul class=\"sefin-sidebar__nav-list\">\n      @for (item of navItems; track item.label) {\n        <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n          <!-- Parent item -->\n          <button\n            type=\"button\"\n            class=\"sefin-sidebar__nav-link\"\n            [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n            [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n            [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n            [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n            [attr.aria-label]=\"(effectiveIsMobile || isCollapsed) ? item.label : null\"\n            (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n          >\n            @if (item.icon) {\n              <div class=\"sefin-sidebar__nav-icon-wrapper\">\n                <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n              </div>\n            }\n            @if (!effectiveIsMobile && !isCollapsed) {\n              <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n              @if (hasChildren(item)) {\n                <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n                  <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n                </div>\n              }\n            }\n          </button>\n          <!-- Children items -->\n          @if (hasChildren(item) && item.expanded && !effectiveIsMobile && !isCollapsed) {\n            <ul class=\"sefin-sidebar__nav-sub-list\">\n              @for (child of item.children; track child.label) {\n                <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n                  <!-- Level 1: Section headers (non-clickable) -->\n                  <div class=\"sefin-sidebar__nav-section-header\">\n                    <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n                  </div>\n                  <!-- Level 2: Grandchildren items (clickable with bullets) -->\n                  @if (hasChildren(child)) {\n                    <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n                      @for (grandchild of child.children; track grandchild.label) {\n                        <li class=\"sefin-sidebar__nav-sub-sub-item\">\n                          <button\n                            type=\"button\"\n                            class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n                            [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n                            [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n                            (click)=\"navigate(grandchild.route || '')\"\n                          >\n                            @if (!isActive(grandchild.route || '')) {\n                              <div class=\"sefin-sidebar__nav-bullet\"></div>\n                            }\n                            <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n                          </button>\n                        </li>\n                      }\n                    </ul>\n                  }\n                </li>\n              }\n            </ul>\n          }\n        </li>\n      }\n    </ul>\n  </nav>\n  \n  @if (showFooter) {\n    <div class=\"sefin-sidebar__footer\">\n      <div class=\"sefin-sidebar__footer-content\">\n        <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n      </div>\n    </div>\n  }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(0);z-index:1000;width:80px;min-width:80px}\n"] }]
         }], ctorParameters: () => [{ type: i1$2.Router }, { type: i0.ChangeDetectorRef }, { type: i1$1.DomSanitizer }], propDecorators: { navItems: [{
                 type: Input
             }], isMobile: [{
@@ -6320,9 +6298,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
                 type: Output
             }], close: [{
                 type: Output
-            }], handleEscapeKey: [{
-                type: HostListener,
-                args: ['document:keydown', ['$event']]
             }] } });
 
 /**