@life-cockpit/angular-ui-kit 1.2.0 → 1.2.2

package/fesm2022/life-cockpit-angular-ui-kit.mjs

@@ -708,11 +708,11 @@ class ButtonComponent {
         this.buttonElement?.nativeElement.blur();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ButtonComponent, isStandalone: true, selector: "lc-button", inputs: { variant: "variant", size: "size", disabled: "disabled", loading: "loading", isLoading: "isLoading", iconOnly: "iconOnly", fullWidth: "fullWidth", ariaLabel: "ariaLabel", type: "type" }, outputs: { clicked: "clicked", focused: "focused", blurred: "blurred" }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["buttonElement"], descendants: true }], ngImport: i0, template: "<button\n  #buttonElement\n  [type]=\"type\"\n  [disabled]=\"isDisabled\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [attr.aria-disabled]=\"isDisabled ? 'true' : 'false'\"\n  [attr.aria-busy]=\"loading ? 'true' : 'false'\"\n  [ngClass]=\"{\n    'btn': true,\n    'btn-primary': variant === 'primary',\n    'btn-secondary': variant === 'secondary',\n    'btn-outline': variant === 'outline',\n    'btn-ghost': variant === 'ghost',\n    'btn-link': variant === 'link',\n    'btn-danger': variant === 'danger',\n    'btn-warning': variant === 'warning',\n    'btn-info': variant === 'info',\n    'btn-xs': size === 'xs',\n    'btn-sm': size === 'sm',\n    'btn-md': size === 'md',\n    'btn-lg': size === 'lg',\n    'btn-icon-only': iconOnly,\n    'btn-full-width': fullWidth\n  }\"\n  (click)=\"handleClick()\"\n  (focus)=\"handleFocus()\"\n  (blur)=\"handleBlur()\"\n>\n  @if (loading) {\n    <span class=\"loading-spinner\"></span>\n  }\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-before']\" />\n  }\n  <ng-content></ng-content>\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-after']\" />\n  }\n</button>\n", styles: [".btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);border:1px solid transparent;border-radius:var(--spacing-2);cursor:pointer;transition:all var(--animation-duration-base) var(--animation-timing-ease);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.btn-primary{background-color:var(--color-primary-600);color:var(--color-neutral-white)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-700)}.btn-primary:active:not(:disabled){background-color:var(--color-primary-800)}.dark .btn-primary{background-color:#144f5b}.dark .btn-primary:hover:not(:disabled){background-color:#1a6a79}.dark .btn-primary:active:not(:disabled){background-color:#0d353d}.btn-secondary{background-color:var(--color-secondary-600);color:var(--color-neutral-white)}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-700)}.btn-secondary:active:not(:disabled){background-color:var(--color-secondary-800)}.dark .btn-secondary{background-color:#435b69}.dark .btn-secondary:hover:not(:disabled){background-color:#5a798c}.dark .btn-secondary:active:not(:disabled){background-color:#2d3c46}.btn-outline{background-color:transparent;border-color:var(--color-neutral-300);color:var(--color-neutral-900)}.btn-outline:hover:not(:disabled){background-color:var(--color-neutral-50);border-color:var(--color-neutral-400)}.btn-outline:active:not(:disabled){background-color:var(--color-neutral-100)}.btn-ghost{background-color:transparent;color:var(--color-neutral-700)}.btn-ghost:hover:not(:disabled){background-color:var(--color-neutral-100)}.btn-ghost:active:not(:disabled){background-color:var(--color-neutral-200)}.btn-link{background-color:transparent;color:var(--color-primary-600);padding:0;border:none}.btn-link:hover:not(:disabled){color:var(--color-primary-700);text-decoration:underline}.btn-link:active:not(:disabled){color:var(--color-primary-800)}.btn-danger{background-color:var(--color-error-600);color:var(--color-neutral-white)}.btn-danger:hover:not(:disabled){background-color:var(--color-error-700)}.btn-danger:active:not(:disabled){background-color:var(--color-error-800)}.dark .btn-danger{background-color:#6b0909}.dark .btn-danger:hover:not(:disabled){background-color:#9d0e0e}.dark .btn-danger:active:not(:disabled){background-color:#6b0909;filter:brightness(.85)}.btn-warning{background-color:#e1a040;color:var(--color-neutral-white)}.btn-warning:hover:not(:disabled){background-color:#9b6b2b}.btn-warning:active:not(:disabled){background-color:#9b6b2b;filter:brightness(.85)}.dark .btn-warning{background-color:#e1a040}.dark .btn-warning:hover:not(:disabled){background-color:#f1d3a7}.dark .btn-warning:active:not(:disabled){background-color:#e1a040;filter:brightness(.85)}.btn-info{background-color:#3b6588;color:var(--color-neutral-white)}.btn-info:hover:not(:disabled){background-color:#27445c}.btn-info:active:not(:disabled){background-color:#27445c;filter:brightness(.85)}.dark .btn-info{background-color:#3b6588}.dark .btn-info:hover:not(:disabled){background-color:#b8cee0}.dark .btn-info:active:not(:disabled){background-color:#3b6588;filter:brightness(.85)}.btn-xs{padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-xs)}.btn-sm{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm)}.btn-md{padding:var(--spacing-2-5) var(--spacing-4);font-size:var(--font-size-base)}.btn-lg{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg)}.btn-icon-only.btn-xs{padding:var(--spacing-1);width:calc(var(--spacing-1) * 2 + 1em);height:calc(var(--spacing-1) * 2 + 1em)}.btn-icon-only.btn-sm{padding:var(--spacing-2);width:calc(var(--spacing-2) * 2 + 1em);height:calc(var(--spacing-2) * 2 + 1em)}.btn-icon-only.btn-md{padding:var(--spacing-2-5);width:calc(var(--spacing-2-5) * 2 + 1em);height:calc(var(--spacing-2-5) * 2 + 1em)}.btn-icon-only.btn-lg{padding:var(--spacing-3);width:calc(var(--spacing-3) * 2 + 1.2em);height:calc(var(--spacing-3) * 2 + 1.2em)}.btn-full-width{width:100%}.loading-spinner{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.icon-before,.icon-after{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: ButtonComponent, isStandalone: true, selector: "lc-button", inputs: { variant: "variant", size: "size", disabled: "disabled", loading: "loading", isLoading: "isLoading", iconOnly: "iconOnly", fullWidth: "fullWidth", ariaLabel: "ariaLabel", type: "type" }, outputs: { clicked: "clicked", focused: "focused", blurred: "blurred" }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["buttonElement"], descendants: true }], ngImport: i0, template: "<button\n  #buttonElement\n  [type]=\"type\"\n  [disabled]=\"isDisabled\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [attr.aria-disabled]=\"isDisabled ? 'true' : 'false'\"\n  [attr.aria-busy]=\"loading ? 'true' : 'false'\"\n  [ngClass]=\"{\n    'btn': true,\n    'btn-primary': variant === 'primary',\n    'btn-secondary': variant === 'secondary',\n    'btn-outline': variant === 'outline',\n    'btn-ghost': variant === 'ghost',\n    'btn-link': variant === 'link',\n    'btn-danger': variant === 'danger',\n    'btn-warning': variant === 'warning',\n    'btn-info': variant === 'info',\n    'btn-xs': size === 'xs',\n    'btn-sm': size === 'sm',\n    'btn-md': size === 'md',\n    'btn-lg': size === 'lg',\n    'btn-icon-only': iconOnly,\n    'btn-full-width': fullWidth\n  }\"\n  (click)=\"handleClick()\"\n  (focus)=\"handleFocus()\"\n  (blur)=\"handleBlur()\"\n>\n  @if (loading) {\n    <span class=\"loading-spinner\"></span>\n  }\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-before']\" />\n  }\n  <ng-content></ng-content>\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-after']\" />\n  }\n</button>\n", styles: [".btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);border:1px solid transparent;border-radius:var(--spacing-2);cursor:pointer;transition:all var(--animation-duration-base) var(--animation-timing-ease);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.btn-primary{background-color:var(--color-primary-600);color:var(--color-neutral-white)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-700)}.btn-primary:active:not(:disabled){background-color:var(--color-primary-800)}.dark .btn-primary{background-color:#144f5b}.dark .btn-primary:hover:not(:disabled){background-color:#1a6a79}.dark .btn-primary:active:not(:disabled){background-color:#0d353d}.btn-secondary{background-color:var(--color-secondary-600);color:var(--color-neutral-white)}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-700)}.btn-secondary:active:not(:disabled){background-color:var(--color-secondary-800)}.dark .btn-secondary{background-color:#435b69}.dark .btn-secondary:hover:not(:disabled){background-color:#5a798c}.dark .btn-secondary:active:not(:disabled){background-color:#2d3c46}.btn-outline{background-color:transparent;border-color:var(--color-neutral-300);color:var(--color-neutral-900)}.btn-outline:hover:not(:disabled){background-color:var(--color-neutral-50);border-color:var(--color-neutral-400)}.btn-outline:active:not(:disabled){background-color:var(--color-neutral-100)}.btn-ghost{background-color:var(--lc-button-ghost-bg, transparent);color:var(--lc-button-ghost-fg, var(--color-neutral-700))}.btn-ghost:hover:not(:disabled){background-color:var(--lc-button-ghost-hover-bg, var(--color-neutral-100));color:var(--lc-button-ghost-hover-fg, var(--lc-button-ghost-fg, var(--color-neutral-900)))}.btn-ghost:active:not(:disabled){background-color:var(--lc-button-ghost-active-bg, var(--color-neutral-200))}.btn-link{background-color:transparent;color:var(--color-primary-600);padding:0;border:none}.btn-link:hover:not(:disabled){color:var(--color-primary-700);text-decoration:underline}.btn-link:active:not(:disabled){color:var(--color-primary-800)}.btn-danger{background-color:var(--color-error-600);color:var(--color-neutral-white)}.btn-danger:hover:not(:disabled){background-color:var(--color-error-700)}.btn-danger:active:not(:disabled){background-color:var(--color-error-800)}.dark .btn-danger{background-color:#6b0909}.dark .btn-danger:hover:not(:disabled){background-color:#9d0e0e}.dark .btn-danger:active:not(:disabled){background-color:#6b0909;filter:brightness(.85)}.btn-warning{background-color:#e1a040;color:var(--color-neutral-white)}.btn-warning:hover:not(:disabled){background-color:#9b6b2b}.btn-warning:active:not(:disabled){background-color:#9b6b2b;filter:brightness(.85)}.dark .btn-warning{background-color:#e1a040}.dark .btn-warning:hover:not(:disabled){background-color:#f1d3a7}.dark .btn-warning:active:not(:disabled){background-color:#e1a040;filter:brightness(.85)}.btn-info{background-color:#3b6588;color:var(--color-neutral-white)}.btn-info:hover:not(:disabled){background-color:#27445c}.btn-info:active:not(:disabled){background-color:#27445c;filter:brightness(.85)}.dark .btn-info{background-color:#3b6588}.dark .btn-info:hover:not(:disabled){background-color:#b8cee0}.dark .btn-info:active:not(:disabled){background-color:#3b6588;filter:brightness(.85)}.btn-xs{padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-xs)}.btn-sm{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm)}.btn-md{padding:var(--spacing-2-5) var(--spacing-4);font-size:var(--font-size-base)}.btn-lg{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg)}.btn-icon-only.btn-xs{padding:var(--spacing-1);width:calc(var(--spacing-1) * 2 + 1em);height:calc(var(--spacing-1) * 2 + 1em)}.btn-icon-only.btn-sm{padding:var(--spacing-2);width:calc(var(--spacing-2) * 2 + 1em);height:calc(var(--spacing-2) * 2 + 1em)}.btn-icon-only.btn-md{padding:var(--spacing-2-5);width:calc(var(--spacing-2-5) * 2 + 1em);height:calc(var(--spacing-2-5) * 2 + 1em)}.btn-icon-only.btn-lg{padding:var(--spacing-3);width:calc(var(--spacing-3) * 2 + 1.2em);height:calc(var(--spacing-3) * 2 + 1.2em)}.btn-full-width{width:100%}.loading-spinner{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.icon-before,.icon-after{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'lc-button', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  #buttonElement\n  [type]=\"type\"\n  [disabled]=\"isDisabled\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [attr.aria-disabled]=\"isDisabled ? 'true' : 'false'\"\n  [attr.aria-busy]=\"loading ? 'true' : 'false'\"\n  [ngClass]=\"{\n    'btn': true,\n    'btn-primary': variant === 'primary',\n    'btn-secondary': variant === 'secondary',\n    'btn-outline': variant === 'outline',\n    'btn-ghost': variant === 'ghost',\n    'btn-link': variant === 'link',\n    'btn-danger': variant === 'danger',\n    'btn-warning': variant === 'warning',\n    'btn-info': variant === 'info',\n    'btn-xs': size === 'xs',\n    'btn-sm': size === 'sm',\n    'btn-md': size === 'md',\n    'btn-lg': size === 'lg',\n    'btn-icon-only': iconOnly,\n    'btn-full-width': fullWidth\n  }\"\n  (click)=\"handleClick()\"\n  (focus)=\"handleFocus()\"\n  (blur)=\"handleBlur()\"\n>\n  @if (loading) {\n    <span class=\"loading-spinner\"></span>\n  }\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-before']\" />\n  }\n  <ng-content></ng-content>\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-after']\" />\n  }\n</button>\n", styles: [".btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);border:1px solid transparent;border-radius:var(--spacing-2);cursor:pointer;transition:all var(--animation-duration-base) var(--animation-timing-ease);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.btn-primary{background-color:var(--color-primary-600);color:var(--color-neutral-white)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-700)}.btn-primary:active:not(:disabled){background-color:var(--color-primary-800)}.dark .btn-primary{background-color:#144f5b}.dark .btn-primary:hover:not(:disabled){background-color:#1a6a79}.dark .btn-primary:active:not(:disabled){background-color:#0d353d}.btn-secondary{background-color:var(--color-secondary-600);color:var(--color-neutral-white)}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-700)}.btn-secondary:active:not(:disabled){background-color:var(--color-secondary-800)}.dark .btn-secondary{background-color:#435b69}.dark .btn-secondary:hover:not(:disabled){background-color:#5a798c}.dark .btn-secondary:active:not(:disabled){background-color:#2d3c46}.btn-outline{background-color:transparent;border-color:var(--color-neutral-300);color:var(--color-neutral-900)}.btn-outline:hover:not(:disabled){background-color:var(--color-neutral-50);border-color:var(--color-neutral-400)}.btn-outline:active:not(:disabled){background-color:var(--color-neutral-100)}.btn-ghost{background-color:transparent;color:var(--color-neutral-700)}.btn-ghost:hover:not(:disabled){background-color:var(--color-neutral-100)}.btn-ghost:active:not(:disabled){background-color:var(--color-neutral-200)}.btn-link{background-color:transparent;color:var(--color-primary-600);padding:0;border:none}.btn-link:hover:not(:disabled){color:var(--color-primary-700);text-decoration:underline}.btn-link:active:not(:disabled){color:var(--color-primary-800)}.btn-danger{background-color:var(--color-error-600);color:var(--color-neutral-white)}.btn-danger:hover:not(:disabled){background-color:var(--color-error-700)}.btn-danger:active:not(:disabled){background-color:var(--color-error-800)}.dark .btn-danger{background-color:#6b0909}.dark .btn-danger:hover:not(:disabled){background-color:#9d0e0e}.dark .btn-danger:active:not(:disabled){background-color:#6b0909;filter:brightness(.85)}.btn-warning{background-color:#e1a040;color:var(--color-neutral-white)}.btn-warning:hover:not(:disabled){background-color:#9b6b2b}.btn-warning:active:not(:disabled){background-color:#9b6b2b;filter:brightness(.85)}.dark .btn-warning{background-color:#e1a040}.dark .btn-warning:hover:not(:disabled){background-color:#f1d3a7}.dark .btn-warning:active:not(:disabled){background-color:#e1a040;filter:brightness(.85)}.btn-info{background-color:#3b6588;color:var(--color-neutral-white)}.btn-info:hover:not(:disabled){background-color:#27445c}.btn-info:active:not(:disabled){background-color:#27445c;filter:brightness(.85)}.dark .btn-info{background-color:#3b6588}.dark .btn-info:hover:not(:disabled){background-color:#b8cee0}.dark .btn-info:active:not(:disabled){background-color:#3b6588;filter:brightness(.85)}.btn-xs{padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-xs)}.btn-sm{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm)}.btn-md{padding:var(--spacing-2-5) var(--spacing-4);font-size:var(--font-size-base)}.btn-lg{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg)}.btn-icon-only.btn-xs{padding:var(--spacing-1);width:calc(var(--spacing-1) * 2 + 1em);height:calc(var(--spacing-1) * 2 + 1em)}.btn-icon-only.btn-sm{padding:var(--spacing-2);width:calc(var(--spacing-2) * 2 + 1em);height:calc(var(--spacing-2) * 2 + 1em)}.btn-icon-only.btn-md{padding:var(--spacing-2-5);width:calc(var(--spacing-2-5) * 2 + 1em);height:calc(var(--spacing-2-5) * 2 + 1em)}.btn-icon-only.btn-lg{padding:var(--spacing-3);width:calc(var(--spacing-3) * 2 + 1.2em);height:calc(var(--spacing-3) * 2 + 1.2em)}.btn-full-width{width:100%}.loading-spinner{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.icon-before,.icon-after{display:inline-flex;align-items:center}\n"] }]
+            args: [{ selector: 'lc-button', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  #buttonElement\n  [type]=\"type\"\n  [disabled]=\"isDisabled\"\n  [attr.aria-label]=\"ariaLabel || null\"\n  [attr.aria-disabled]=\"isDisabled ? 'true' : 'false'\"\n  [attr.aria-busy]=\"loading ? 'true' : 'false'\"\n  [ngClass]=\"{\n    'btn': true,\n    'btn-primary': variant === 'primary',\n    'btn-secondary': variant === 'secondary',\n    'btn-outline': variant === 'outline',\n    'btn-ghost': variant === 'ghost',\n    'btn-link': variant === 'link',\n    'btn-danger': variant === 'danger',\n    'btn-warning': variant === 'warning',\n    'btn-info': variant === 'info',\n    'btn-xs': size === 'xs',\n    'btn-sm': size === 'sm',\n    'btn-md': size === 'md',\n    'btn-lg': size === 'lg',\n    'btn-icon-only': iconOnly,\n    'btn-full-width': fullWidth\n  }\"\n  (click)=\"handleClick()\"\n  (focus)=\"handleFocus()\"\n  (blur)=\"handleBlur()\"\n>\n  @if (loading) {\n    <span class=\"loading-spinner\"></span>\n  }\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-before']\" />\n  }\n  <ng-content></ng-content>\n  @if (!loading) {\n    <ng-content select=\"[slot='icon-after']\" />\n  }\n</button>\n", styles: [".btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);border:1px solid transparent;border-radius:var(--spacing-2);cursor:pointer;transition:all var(--animation-duration-base) var(--animation-timing-ease);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.btn-primary{background-color:var(--color-primary-600);color:var(--color-neutral-white)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-700)}.btn-primary:active:not(:disabled){background-color:var(--color-primary-800)}.dark .btn-primary{background-color:#144f5b}.dark .btn-primary:hover:not(:disabled){background-color:#1a6a79}.dark .btn-primary:active:not(:disabled){background-color:#0d353d}.btn-secondary{background-color:var(--color-secondary-600);color:var(--color-neutral-white)}.btn-secondary:hover:not(:disabled){background-color:var(--color-secondary-700)}.btn-secondary:active:not(:disabled){background-color:var(--color-secondary-800)}.dark .btn-secondary{background-color:#435b69}.dark .btn-secondary:hover:not(:disabled){background-color:#5a798c}.dark .btn-secondary:active:not(:disabled){background-color:#2d3c46}.btn-outline{background-color:transparent;border-color:var(--color-neutral-300);color:var(--color-neutral-900)}.btn-outline:hover:not(:disabled){background-color:var(--color-neutral-50);border-color:var(--color-neutral-400)}.btn-outline:active:not(:disabled){background-color:var(--color-neutral-100)}.btn-ghost{background-color:var(--lc-button-ghost-bg, transparent);color:var(--lc-button-ghost-fg, var(--color-neutral-700))}.btn-ghost:hover:not(:disabled){background-color:var(--lc-button-ghost-hover-bg, var(--color-neutral-100));color:var(--lc-button-ghost-hover-fg, var(--lc-button-ghost-fg, var(--color-neutral-900)))}.btn-ghost:active:not(:disabled){background-color:var(--lc-button-ghost-active-bg, var(--color-neutral-200))}.btn-link{background-color:transparent;color:var(--color-primary-600);padding:0;border:none}.btn-link:hover:not(:disabled){color:var(--color-primary-700);text-decoration:underline}.btn-link:active:not(:disabled){color:var(--color-primary-800)}.btn-danger{background-color:var(--color-error-600);color:var(--color-neutral-white)}.btn-danger:hover:not(:disabled){background-color:var(--color-error-700)}.btn-danger:active:not(:disabled){background-color:var(--color-error-800)}.dark .btn-danger{background-color:#6b0909}.dark .btn-danger:hover:not(:disabled){background-color:#9d0e0e}.dark .btn-danger:active:not(:disabled){background-color:#6b0909;filter:brightness(.85)}.btn-warning{background-color:#e1a040;color:var(--color-neutral-white)}.btn-warning:hover:not(:disabled){background-color:#9b6b2b}.btn-warning:active:not(:disabled){background-color:#9b6b2b;filter:brightness(.85)}.dark .btn-warning{background-color:#e1a040}.dark .btn-warning:hover:not(:disabled){background-color:#f1d3a7}.dark .btn-warning:active:not(:disabled){background-color:#e1a040;filter:brightness(.85)}.btn-info{background-color:#3b6588;color:var(--color-neutral-white)}.btn-info:hover:not(:disabled){background-color:#27445c}.btn-info:active:not(:disabled){background-color:#27445c;filter:brightness(.85)}.dark .btn-info{background-color:#3b6588}.dark .btn-info:hover:not(:disabled){background-color:#b8cee0}.dark .btn-info:active:not(:disabled){background-color:#3b6588;filter:brightness(.85)}.btn-xs{padding:var(--spacing-1) var(--spacing-2);font-size:var(--font-size-xs)}.btn-sm{padding:var(--spacing-2) var(--spacing-3);font-size:var(--font-size-sm)}.btn-md{padding:var(--spacing-2-5) var(--spacing-4);font-size:var(--font-size-base)}.btn-lg{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg)}.btn-icon-only.btn-xs{padding:var(--spacing-1);width:calc(var(--spacing-1) * 2 + 1em);height:calc(var(--spacing-1) * 2 + 1em)}.btn-icon-only.btn-sm{padding:var(--spacing-2);width:calc(var(--spacing-2) * 2 + 1em);height:calc(var(--spacing-2) * 2 + 1em)}.btn-icon-only.btn-md{padding:var(--spacing-2-5);width:calc(var(--spacing-2-5) * 2 + 1em);height:calc(var(--spacing-2-5) * 2 + 1em)}.btn-icon-only.btn-lg{padding:var(--spacing-3);width:calc(var(--spacing-3) * 2 + 1.2em);height:calc(var(--spacing-3) * 2 + 1.2em)}.btn-full-width{width:100%}.loading-spinner{display:inline-block;width:1em;height:1em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.icon-before,.icon-after{display:inline-flex;align-items:center}\n"] }]
         }], propDecorators: { variant: [{
                 type: Input
             }], size: [{
@@ -5841,7 +5841,7 @@ class HeaderComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: HeaderComponent, isStandalone: true, selector: "lc-header", inputs: { theme: "theme", logo: "logo", title: "title", subtitle: "subtitle", userEmail: "userEmail", userName: "userName", showHamburger: "showHamburger", showThemeButton: "showThemeButton", menuSize: "menuSize", showProfileMenuItem: "showProfileMenuItem" }, outputs: { hamburgerClick: "hamburgerClick", themeToggleClick: "themeToggleClick", logoutClick: "logoutClick", profileClick: "profileClick" }, host: { classAttribute: "lc-header-host" }, ngImport: i0, template: "<header class=\"lc-header\" [class.lc-header--dark]=\"theme === 'dark'\" [class.lc-header--light]=\"theme === 'light'\">\n  <!-- Hamburger menu icon (mobile only) -->\n  @if (showHamburger) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"'Toggle sidebar menu'\"\n      (clicked)=\"onHamburgerClick()\"\n      class=\"lc-header__hamburger\"\n    >\n      <lc-icon name=\"bars-3\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- Logo (clickable, navigates to home) -->\n  <div class=\"lc-header__brand\">\n    @if (logo || title) {\n      <a routerLink=\"/\" class=\"lc-header__logo\" aria-label=\"Go to home\">\n        <lc-logo [variant]=\"logo ? 'full' : 'emblem'\" size=\"md\" [clickable]=\"false\" [colorMode]=\"theme === 'dark' ? 'dark' : theme === 'light' ? 'light' : 'auto'\" />\n      </a>\n    }\n    \n    @if (title) {\n      <div class=\"lc-header__title-group\">\n        <h1 class=\"lc-header__title\">{{ title }}</h1>\n        @if (subtitle) {\n          <span class=\"lc-header__subtitle\">{{ subtitle }}</span>\n        }\n      </div>\n    }\n  </div>\n\n  <div class=\"lc-header__spacer\"></div>\n\n  <!-- Theme toggle button -->\n  @if (showThemeButton) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"themeService.isDark() ? 'Switch to light mode' : 'Switch to dark mode'\"\n      (clicked)=\"onThemeButtonClick()\"\n      class=\"lc-header__theme-toggle\"\n    >\n      <lc-icon [name]=\"themeService.isDark() ? 'sun' : 'moon'\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- User profile menu -->\n  <lc-menu\n    [items]=\"menuItems()\"\n    [isOpen]=\"isDropdownOpen()\"\n    position=\"bottom-right\"\n    minWidth=\"220px\"\n    [size]=\"menuSize\"\n    (itemClick)=\"onMenuItemClick($event)\"\n    (closed)=\"closeDropdown()\"\n  >\n    <!-- Menu header with avatar, name and email -->\n    @if (userName || userEmail) {\n      <div header class=\"lc-header__menu-header\">\n        <lc-avatar [name]=\"userName\" size=\"md\" />\n        <div class=\"lc-header__menu-user-info\">\n          @if (userName) {\n            <div class=\"lc-header__menu-user-name\">{{ userName }}</div>\n          }\n          @if (userEmail) {\n            <div class=\"lc-header__menu-user-email\">{{ userEmail }}</div>\n          }\n        </div>\n      </div>\n    }\n\n    <button\n      trigger\n      class=\"lc-header__profile-trigger\"\n      type=\"button\"\n      aria-label=\"Open user menu\"\n      [attr.aria-expanded]=\"isDropdownOpen()\"\n      (click)=\"toggleDropdown()\"\n    >\n      <lc-icon name=\"user\" size=\"sm\" />\n      <lc-icon name=\"chevron-down\" size=\"xs\" />\n    </button>\n  </lc-menu>\n</header>\n", styles: [".lc-header{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151);display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-6);background-color:var(--lc-header-bg);border-bottom:1px solid var(--lc-header-border);height:64px;position:sticky;top:0;z-index:1000}@media(max-width:768px){.lc-header{padding:var(--spacing-3) var(--spacing-4)}}.lc-header--dark{--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header--light{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151)}html.dark .lc-header:not(.lc-header--light),:root.dark .lc-header:not(.lc-header--light),.dark .lc-header:not(.lc-header--light){--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header__hamburger{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2);background:transparent;border:none;cursor:pointer;color:var(--lc-header-trigger-fg);border-radius:var(--radius-md);transition:background-color .2s ease,color .2s ease}.lc-header__hamburger:hover{background-color:var(--lc-header-hover-bg);color:var(--lc-header-fg)}.lc-header__hamburger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-header__hamburger .lc-icon{width:24px;height:24px}.lc-header__brand{display:flex;align-items:center;gap:var(--spacing-3)}.lc-header__logo{display:flex;align-items:center;text-decoration:none;color:var(--lc-header-fg);flex-shrink:0}.lc-header__logo:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:4px;border-radius:var(--radius-sm)}.lc-header__logo-img{height:32px;width:auto}.lc-header__title-group{display:flex;flex-direction:column;gap:.125rem}.lc-header__title{font-size:1.25rem;font-weight:700;color:var(--lc-header-fg);margin:0;line-height:1.2;transition:color .2s ease}@media(max-width:640px){.lc-header__title{font-size:1.125rem}}.lc-header__subtitle{font-size:.75rem;font-weight:500;color:var(--lc-header-fg-secondary);text-transform:uppercase;letter-spacing:.05em;transition:color .2s ease}.lc-header__spacer{flex:1}.lc-header__theme-toggle{margin-right:var(--spacing-2);color:var(--lc-header-trigger-fg)}.lc-header--dark .lc-header__theme-toggle lc-icon,.lc-header--dark .lc-header__theme-toggle .lc-icon,.lc-header--dark .lc-header__theme-toggle svg,.lc-header--dark .lc-header__profile-trigger lc-icon,.lc-header--dark .lc-header__profile-trigger .lc-icon,.lc-header--dark .lc-header__profile-trigger svg,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg{color:var(--lc-header-trigger-fg)}.lc-header--dark lc-button,html.dark .lc-header:not(.lc-header--light) lc-button,:root.dark .lc-header:not(.lc-header--light) lc-button,.dark .lc-header:not(.lc-header--light) lc-button{--lc-button-ghost-fg: var(--lc-header-trigger-fg);color:var(--lc-header-trigger-fg)}.lc-header__profile-trigger{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:transparent;border:1px solid var(--lc-header-trigger-border);border-radius:var(--radius-full);cursor:pointer;color:var(--lc-header-trigger-fg);transition:background-color .2s ease,border-color .2s ease}.lc-header__profile-trigger:hover{background-color:var(--lc-header-hover-bg);border-color:var(--lc-header-fg-secondary)}.lc-header__profile-trigger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-menu__header{padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);color:var(--lc-header-fg-secondary);border-bottom:1px solid var(--lc-header-border);margin-bottom:var(--spacing-1);word-break:break-word}.lc-header__menu-header{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);border-bottom:1px solid var(--lc-header-border);margin-bottom:var(--spacing-1)}.lc-header__menu-user-info{flex:1;min-width:0}.lc-header__menu-user-name{font-size:var(--font-size-sm);font-weight:600;color:var(--lc-header-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.lc-header__menu-user-email{font-size:var(--font-size-xs);color:var(--lc-header-fg-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ButtonComponent, selector: "lc-button", inputs: ["variant", "size", "disabled", "loading", "isLoading", "iconOnly", "fullWidth", "ariaLabel", "type"], outputs: ["clicked", "focused", "blurred"] }, { kind: "component", type: LogoComponent, selector: "lc-logo", inputs: ["variant", "size", "alt", "clickable", "colorMode"] }, { kind: "component", type: IconComponent, selector: "lc-icon", inputs: ["name", "variant", "size", "color", "ariaLabel", "decorative"] }, { kind: "component", type: AvatarComponent, selector: "lc-avatar", inputs: ["src", "alt", "name", "size", "status"] }, { kind: "component", type: MenuComponent, selector: "lc-menu", inputs: ["items", "isOpen", "position", "size", "minWidth"], outputs: ["itemClick", "closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: HeaderComponent, isStandalone: true, selector: "lc-header", inputs: { theme: "theme", logo: "logo", title: "title", subtitle: "subtitle", userEmail: "userEmail", userName: "userName", showHamburger: "showHamburger", showThemeButton: "showThemeButton", menuSize: "menuSize", showProfileMenuItem: "showProfileMenuItem" }, outputs: { hamburgerClick: "hamburgerClick", themeToggleClick: "themeToggleClick", logoutClick: "logoutClick", profileClick: "profileClick" }, host: { classAttribute: "lc-header-host" }, ngImport: i0, template: "<header class=\"lc-header\" [class.lc-header--dark]=\"theme === 'dark'\" [class.lc-header--light]=\"theme === 'light'\">\n  <!-- Hamburger menu icon (mobile only) -->\n  @if (showHamburger) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"'Toggle sidebar menu'\"\n      (clicked)=\"onHamburgerClick()\"\n      class=\"lc-header__hamburger\"\n    >\n      <lc-icon name=\"bars-3\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- Logo (clickable, navigates to home) -->\n  <div class=\"lc-header__brand\">\n    @if (logo || title) {\n      <a routerLink=\"/\" class=\"lc-header__logo\" aria-label=\"Go to home\">\n        <lc-logo [variant]=\"logo ? 'full' : 'emblem'\" size=\"md\" [clickable]=\"false\" [colorMode]=\"theme === 'dark' ? 'dark' : theme === 'light' ? 'light' : 'auto'\" />\n      </a>\n    }\n    \n    @if (title) {\n      <div class=\"lc-header__title-group\">\n        <h1 class=\"lc-header__title\">{{ title }}</h1>\n        @if (subtitle) {\n          <span class=\"lc-header__subtitle\">{{ subtitle }}</span>\n        }\n      </div>\n    }\n  </div>\n\n  <div class=\"lc-header__spacer\"></div>\n\n  <!-- Theme toggle button -->\n  @if (showThemeButton) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"themeService.isDark() ? 'Switch to light mode' : 'Switch to dark mode'\"\n      (clicked)=\"onThemeButtonClick()\"\n      class=\"lc-header__theme-toggle\"\n    >\n      <lc-icon [name]=\"themeService.isDark() ? 'sun' : 'moon'\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- User profile menu -->\n  <lc-menu\n    [items]=\"menuItems()\"\n    [isOpen]=\"isDropdownOpen()\"\n    position=\"bottom-right\"\n    minWidth=\"220px\"\n    [size]=\"menuSize\"\n    (itemClick)=\"onMenuItemClick($event)\"\n    (closed)=\"closeDropdown()\"\n  >\n    <!-- Menu header with avatar, name and email -->\n    @if (userName || userEmail) {\n      <div header class=\"lc-header__menu-header\">\n        <lc-avatar [name]=\"userName\" size=\"md\" />\n        <div class=\"lc-header__menu-user-info\">\n          @if (userName) {\n            <div class=\"lc-header__menu-user-name\">{{ userName }}</div>\n          }\n          @if (userEmail) {\n            <div class=\"lc-header__menu-user-email\">{{ userEmail }}</div>\n          }\n        </div>\n      </div>\n    }\n\n    <button\n      trigger\n      class=\"lc-header__profile-trigger\"\n      type=\"button\"\n      aria-label=\"Open user menu\"\n      [attr.aria-expanded]=\"isDropdownOpen()\"\n      (click)=\"toggleDropdown()\"\n    >\n      <lc-icon name=\"user\" size=\"sm\" />\n      <lc-icon name=\"chevron-down\" size=\"xs\" />\n    </button>\n  </lc-menu>\n</header>\n", styles: [".lc-header{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151);display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-6);background-color:var(--lc-header-bg);border-bottom:1px solid var(--lc-header-border);height:64px;position:sticky;top:0;z-index:1000}@media(max-width:768px){.lc-header{padding:var(--spacing-3) var(--spacing-4)}}.lc-header--dark{--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header--light{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151)}html.dark .lc-header:not(.lc-header--light),:root.dark .lc-header:not(.lc-header--light),.dark .lc-header:not(.lc-header--light){--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header__hamburger{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2);background:transparent;border:none;cursor:pointer;color:var(--lc-header-trigger-fg);border-radius:var(--radius-md);transition:background-color .2s ease,color .2s ease}.lc-header__hamburger:hover{background-color:var(--lc-header-hover-bg);color:var(--lc-header-fg)}.lc-header__hamburger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-header__hamburger .lc-icon{width:24px;height:24px}.lc-header__brand{display:flex;align-items:center;gap:var(--spacing-3)}.lc-header__logo{display:flex;align-items:center;text-decoration:none;color:var(--lc-header-fg);flex-shrink:0}.lc-header__logo:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:4px;border-radius:var(--radius-sm)}.lc-header__logo-img{height:32px;width:auto}.lc-header__title-group{display:flex;flex-direction:column;gap:.125rem}.lc-header__title{font-size:1.25rem;font-weight:700;color:var(--lc-header-fg);margin:0;line-height:1.2;transition:color .2s ease}@media(max-width:640px){.lc-header__title{font-size:1.125rem}}.lc-header__subtitle{font-size:.75rem;font-weight:500;color:var(--lc-header-fg-secondary);text-transform:uppercase;letter-spacing:.05em;transition:color .2s ease}.lc-header__spacer{flex:1}.lc-header__theme-toggle{margin-right:var(--spacing-2);color:var(--lc-header-trigger-fg)}.lc-header--dark .lc-header__theme-toggle lc-icon,.lc-header--dark .lc-header__theme-toggle .lc-icon,.lc-header--dark .lc-header__theme-toggle svg,.lc-header--dark .lc-header__hamburger lc-icon,.lc-header--dark .lc-header__hamburger .lc-icon,.lc-header--dark .lc-header__hamburger svg,.lc-header--dark .lc-header__profile-trigger lc-icon,.lc-header--dark .lc-header__profile-trigger .lc-icon,.lc-header--dark .lc-header__profile-trigger svg,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,html.dark .lc-header:not(.lc-header--light) .lc-header__hamburger lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__hamburger .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__hamburger svg,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__hamburger lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__hamburger .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__hamburger svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,.dark .lc-header:not(.lc-header--light) .lc-header__hamburger lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__hamburger .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__hamburger svg,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg{color:var(--lc-header-trigger-fg)}.lc-header--dark lc-button,html.dark .lc-header:not(.lc-header--light) lc-button,:root.dark .lc-header:not(.lc-header--light) lc-button,.dark .lc-header:not(.lc-header--light) lc-button{--lc-button-ghost-fg: var(--lc-header-trigger-fg);--lc-button-ghost-hover-bg: var(--lc-header-hover-bg);--lc-button-ghost-hover-fg: var(--lc-header-fg);--lc-button-ghost-active-bg: var(--lc-header-hover-bg)}.lc-header__profile-trigger{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:transparent;border:1px solid var(--lc-header-trigger-border);border-radius:var(--radius-full);cursor:pointer;color:var(--lc-header-trigger-fg);transition:background-color .2s ease,border-color .2s ease}.lc-header__profile-trigger:hover{background-color:var(--lc-header-hover-bg);border-color:var(--lc-header-fg-secondary)}.lc-header__profile-trigger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-menu__header{padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);color:var(--color-text-secondary, #6b7280);border-bottom:1px solid var(--color-divider, #e5e7eb);margin-bottom:var(--spacing-1);word-break:break-word}.lc-header__menu-header{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);border-bottom:1px solid var(--color-divider, #e5e7eb);margin-bottom:var(--spacing-1)}.lc-header__menu-user-info{flex:1;min-width:0}.lc-header__menu-user-name{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text, #111827);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.lc-header__menu-user-email{font-size:var(--font-size-xs);color:var(--color-text-secondary, #6b7280);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ButtonComponent, selector: "lc-button", inputs: ["variant", "size", "disabled", "loading", "isLoading", "iconOnly", "fullWidth", "ariaLabel", "type"], outputs: ["clicked", "focused", "blurred"] }, { kind: "component", type: LogoComponent, selector: "lc-logo", inputs: ["variant", "size", "alt", "clickable", "colorMode"] }, { kind: "component", type: IconComponent, selector: "lc-icon", inputs: ["name", "variant", "size", "color", "ariaLabel", "decorative"] }, { kind: "component", type: AvatarComponent, selector: "lc-avatar", inputs: ["src", "alt", "name", "size", "status"] }, { kind: "component", type: MenuComponent, selector: "lc-menu", inputs: ["items", "isOpen", "position", "size", "minWidth"], outputs: ["itemClick", "closed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: HeaderComponent, decorators: [{
             type: Component,
@@ -5855,7 +5855,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         MenuComponent,
                     ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         class: 'lc-header-host',
-                    }, template: "<header class=\"lc-header\" [class.lc-header--dark]=\"theme === 'dark'\" [class.lc-header--light]=\"theme === 'light'\">\n  <!-- Hamburger menu icon (mobile only) -->\n  @if (showHamburger) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"'Toggle sidebar menu'\"\n      (clicked)=\"onHamburgerClick()\"\n      class=\"lc-header__hamburger\"\n    >\n      <lc-icon name=\"bars-3\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- Logo (clickable, navigates to home) -->\n  <div class=\"lc-header__brand\">\n    @if (logo || title) {\n      <a routerLink=\"/\" class=\"lc-header__logo\" aria-label=\"Go to home\">\n        <lc-logo [variant]=\"logo ? 'full' : 'emblem'\" size=\"md\" [clickable]=\"false\" [colorMode]=\"theme === 'dark' ? 'dark' : theme === 'light' ? 'light' : 'auto'\" />\n      </a>\n    }\n    \n    @if (title) {\n      <div class=\"lc-header__title-group\">\n        <h1 class=\"lc-header__title\">{{ title }}</h1>\n        @if (subtitle) {\n          <span class=\"lc-header__subtitle\">{{ subtitle }}</span>\n        }\n      </div>\n    }\n  </div>\n\n  <div class=\"lc-header__spacer\"></div>\n\n  <!-- Theme toggle button -->\n  @if (showThemeButton) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"themeService.isDark() ? 'Switch to light mode' : 'Switch to dark mode'\"\n      (clicked)=\"onThemeButtonClick()\"\n      class=\"lc-header__theme-toggle\"\n    >\n      <lc-icon [name]=\"themeService.isDark() ? 'sun' : 'moon'\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- User profile menu -->\n  <lc-menu\n    [items]=\"menuItems()\"\n    [isOpen]=\"isDropdownOpen()\"\n    position=\"bottom-right\"\n    minWidth=\"220px\"\n    [size]=\"menuSize\"\n    (itemClick)=\"onMenuItemClick($event)\"\n    (closed)=\"closeDropdown()\"\n  >\n    <!-- Menu header with avatar, name and email -->\n    @if (userName || userEmail) {\n      <div header class=\"lc-header__menu-header\">\n        <lc-avatar [name]=\"userName\" size=\"md\" />\n        <div class=\"lc-header__menu-user-info\">\n          @if (userName) {\n            <div class=\"lc-header__menu-user-name\">{{ userName }}</div>\n          }\n          @if (userEmail) {\n            <div class=\"lc-header__menu-user-email\">{{ userEmail }}</div>\n          }\n        </div>\n      </div>\n    }\n\n    <button\n      trigger\n      class=\"lc-header__profile-trigger\"\n      type=\"button\"\n      aria-label=\"Open user menu\"\n      [attr.aria-expanded]=\"isDropdownOpen()\"\n      (click)=\"toggleDropdown()\"\n    >\n      <lc-icon name=\"user\" size=\"sm\" />\n      <lc-icon name=\"chevron-down\" size=\"xs\" />\n    </button>\n  </lc-menu>\n</header>\n", styles: [".lc-header{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151);display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-6);background-color:var(--lc-header-bg);border-bottom:1px solid var(--lc-header-border);height:64px;position:sticky;top:0;z-index:1000}@media(max-width:768px){.lc-header{padding:var(--spacing-3) var(--spacing-4)}}.lc-header--dark{--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header--light{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151)}html.dark .lc-header:not(.lc-header--light),:root.dark .lc-header:not(.lc-header--light),.dark .lc-header:not(.lc-header--light){--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header__hamburger{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2);background:transparent;border:none;cursor:pointer;color:var(--lc-header-trigger-fg);border-radius:var(--radius-md);transition:background-color .2s ease,color .2s ease}.lc-header__hamburger:hover{background-color:var(--lc-header-hover-bg);color:var(--lc-header-fg)}.lc-header__hamburger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-header__hamburger .lc-icon{width:24px;height:24px}.lc-header__brand{display:flex;align-items:center;gap:var(--spacing-3)}.lc-header__logo{display:flex;align-items:center;text-decoration:none;color:var(--lc-header-fg);flex-shrink:0}.lc-header__logo:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:4px;border-radius:var(--radius-sm)}.lc-header__logo-img{height:32px;width:auto}.lc-header__title-group{display:flex;flex-direction:column;gap:.125rem}.lc-header__title{font-size:1.25rem;font-weight:700;color:var(--lc-header-fg);margin:0;line-height:1.2;transition:color .2s ease}@media(max-width:640px){.lc-header__title{font-size:1.125rem}}.lc-header__subtitle{font-size:.75rem;font-weight:500;color:var(--lc-header-fg-secondary);text-transform:uppercase;letter-spacing:.05em;transition:color .2s ease}.lc-header__spacer{flex:1}.lc-header__theme-toggle{margin-right:var(--spacing-2);color:var(--lc-header-trigger-fg)}.lc-header--dark .lc-header__theme-toggle lc-icon,.lc-header--dark .lc-header__theme-toggle .lc-icon,.lc-header--dark .lc-header__theme-toggle svg,.lc-header--dark .lc-header__profile-trigger lc-icon,.lc-header--dark .lc-header__profile-trigger .lc-icon,.lc-header--dark .lc-header__profile-trigger svg,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg{color:var(--lc-header-trigger-fg)}.lc-header--dark lc-button,html.dark .lc-header:not(.lc-header--light) lc-button,:root.dark .lc-header:not(.lc-header--light) lc-button,.dark .lc-header:not(.lc-header--light) lc-button{--lc-button-ghost-fg: var(--lc-header-trigger-fg);color:var(--lc-header-trigger-fg)}.lc-header__profile-trigger{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:transparent;border:1px solid var(--lc-header-trigger-border);border-radius:var(--radius-full);cursor:pointer;color:var(--lc-header-trigger-fg);transition:background-color .2s ease,border-color .2s ease}.lc-header__profile-trigger:hover{background-color:var(--lc-header-hover-bg);border-color:var(--lc-header-fg-secondary)}.lc-header__profile-trigger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-menu__header{padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);color:var(--lc-header-fg-secondary);border-bottom:1px solid var(--lc-header-border);margin-bottom:var(--spacing-1);word-break:break-word}.lc-header__menu-header{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);border-bottom:1px solid var(--lc-header-border);margin-bottom:var(--spacing-1)}.lc-header__menu-user-info{flex:1;min-width:0}.lc-header__menu-user-name{font-size:var(--font-size-sm);font-weight:600;color:var(--lc-header-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.lc-header__menu-user-email{font-size:var(--font-size-xs);color:var(--lc-header-fg-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}\n"] }]
+                    }, template: "<header class=\"lc-header\" [class.lc-header--dark]=\"theme === 'dark'\" [class.lc-header--light]=\"theme === 'light'\">\n  <!-- Hamburger menu icon (mobile only) -->\n  @if (showHamburger) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"'Toggle sidebar menu'\"\n      (clicked)=\"onHamburgerClick()\"\n      class=\"lc-header__hamburger\"\n    >\n      <lc-icon name=\"bars-3\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- Logo (clickable, navigates to home) -->\n  <div class=\"lc-header__brand\">\n    @if (logo || title) {\n      <a routerLink=\"/\" class=\"lc-header__logo\" aria-label=\"Go to home\">\n        <lc-logo [variant]=\"logo ? 'full' : 'emblem'\" size=\"md\" [clickable]=\"false\" [colorMode]=\"theme === 'dark' ? 'dark' : theme === 'light' ? 'light' : 'auto'\" />\n      </a>\n    }\n    \n    @if (title) {\n      <div class=\"lc-header__title-group\">\n        <h1 class=\"lc-header__title\">{{ title }}</h1>\n        @if (subtitle) {\n          <span class=\"lc-header__subtitle\">{{ subtitle }}</span>\n        }\n      </div>\n    }\n  </div>\n\n  <div class=\"lc-header__spacer\"></div>\n\n  <!-- Theme toggle button -->\n  @if (showThemeButton) {\n    <lc-button\n      variant=\"ghost\"\n      size=\"sm\"\n      [iconOnly]=\"true\"\n      [ariaLabel]=\"themeService.isDark() ? 'Switch to light mode' : 'Switch to dark mode'\"\n      (clicked)=\"onThemeButtonClick()\"\n      class=\"lc-header__theme-toggle\"\n    >\n      <lc-icon [name]=\"themeService.isDark() ? 'sun' : 'moon'\" size=\"sm\" />\n    </lc-button>\n  }\n\n  <!-- User profile menu -->\n  <lc-menu\n    [items]=\"menuItems()\"\n    [isOpen]=\"isDropdownOpen()\"\n    position=\"bottom-right\"\n    minWidth=\"220px\"\n    [size]=\"menuSize\"\n    (itemClick)=\"onMenuItemClick($event)\"\n    (closed)=\"closeDropdown()\"\n  >\n    <!-- Menu header with avatar, name and email -->\n    @if (userName || userEmail) {\n      <div header class=\"lc-header__menu-header\">\n        <lc-avatar [name]=\"userName\" size=\"md\" />\n        <div class=\"lc-header__menu-user-info\">\n          @if (userName) {\n            <div class=\"lc-header__menu-user-name\">{{ userName }}</div>\n          }\n          @if (userEmail) {\n            <div class=\"lc-header__menu-user-email\">{{ userEmail }}</div>\n          }\n        </div>\n      </div>\n    }\n\n    <button\n      trigger\n      class=\"lc-header__profile-trigger\"\n      type=\"button\"\n      aria-label=\"Open user menu\"\n      [attr.aria-expanded]=\"isDropdownOpen()\"\n      (click)=\"toggleDropdown()\"\n    >\n      <lc-icon name=\"user\" size=\"sm\" />\n      <lc-icon name=\"chevron-down\" size=\"xs\" />\n    </button>\n  </lc-menu>\n</header>\n", styles: [".lc-header{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151);display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-3) var(--spacing-6);background-color:var(--lc-header-bg);border-bottom:1px solid var(--lc-header-border);height:64px;position:sticky;top:0;z-index:1000}@media(max-width:768px){.lc-header{padding:var(--spacing-3) var(--spacing-4)}}.lc-header--dark{--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header--light{--lc-header-bg: var(--color-neutral-0, #ffffff);--lc-header-fg: var(--color-neutral-900, #111827);--lc-header-fg-secondary: var(--color-neutral-600, #4b5563);--lc-header-border: var(--color-neutral-200, #e5e7eb);--lc-header-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-header-trigger-border: var(--color-neutral-200, #e5e7eb);--lc-header-trigger-fg: var(--color-neutral-700, #374151)}html.dark .lc-header:not(.lc-header--light),:root.dark .lc-header:not(.lc-header--light),.dark .lc-header:not(.lc-header--light){--lc-header-bg: #18181b;--lc-header-fg: #f5f5f5;--lc-header-fg-secondary: #a1a1aa;--lc-header-border: #27272a;--lc-header-hover-bg: #27272a;--lc-header-trigger-border: #52525b;--lc-header-trigger-fg: #e4e4e7}.lc-header__hamburger{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2);background:transparent;border:none;cursor:pointer;color:var(--lc-header-trigger-fg);border-radius:var(--radius-md);transition:background-color .2s ease,color .2s ease}.lc-header__hamburger:hover{background-color:var(--lc-header-hover-bg);color:var(--lc-header-fg)}.lc-header__hamburger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-header__hamburger .lc-icon{width:24px;height:24px}.lc-header__brand{display:flex;align-items:center;gap:var(--spacing-3)}.lc-header__logo{display:flex;align-items:center;text-decoration:none;color:var(--lc-header-fg);flex-shrink:0}.lc-header__logo:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:4px;border-radius:var(--radius-sm)}.lc-header__logo-img{height:32px;width:auto}.lc-header__title-group{display:flex;flex-direction:column;gap:.125rem}.lc-header__title{font-size:1.25rem;font-weight:700;color:var(--lc-header-fg);margin:0;line-height:1.2;transition:color .2s ease}@media(max-width:640px){.lc-header__title{font-size:1.125rem}}.lc-header__subtitle{font-size:.75rem;font-weight:500;color:var(--lc-header-fg-secondary);text-transform:uppercase;letter-spacing:.05em;transition:color .2s ease}.lc-header__spacer{flex:1}.lc-header__theme-toggle{margin-right:var(--spacing-2);color:var(--lc-header-trigger-fg)}.lc-header--dark .lc-header__theme-toggle lc-icon,.lc-header--dark .lc-header__theme-toggle .lc-icon,.lc-header--dark .lc-header__theme-toggle svg,.lc-header--dark .lc-header__hamburger lc-icon,.lc-header--dark .lc-header__hamburger .lc-icon,.lc-header--dark .lc-header__hamburger svg,.lc-header--dark .lc-header__profile-trigger lc-icon,.lc-header--dark .lc-header__profile-trigger .lc-icon,.lc-header--dark .lc-header__profile-trigger svg,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,html.dark .lc-header:not(.lc-header--light) .lc-header__hamburger lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__hamburger .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__hamburger svg,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,html.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__hamburger lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__hamburger .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__hamburger svg,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,:root.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__theme-toggle svg,.dark .lc-header:not(.lc-header--light) .lc-header__hamburger lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__hamburger .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__hamburger svg,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger .lc-icon,.dark .lc-header:not(.lc-header--light) .lc-header__profile-trigger svg{color:var(--lc-header-trigger-fg)}.lc-header--dark lc-button,html.dark .lc-header:not(.lc-header--light) lc-button,:root.dark .lc-header:not(.lc-header--light) lc-button,.dark .lc-header:not(.lc-header--light) lc-button{--lc-button-ghost-fg: var(--lc-header-trigger-fg);--lc-button-ghost-hover-bg: var(--lc-header-hover-bg);--lc-button-ghost-hover-fg: var(--lc-header-fg);--lc-button-ghost-active-bg: var(--lc-header-hover-bg)}.lc-header__profile-trigger{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);background:transparent;border:1px solid var(--lc-header-trigger-border);border-radius:var(--radius-full);cursor:pointer;color:var(--lc-header-trigger-fg);transition:background-color .2s ease,border-color .2s ease}.lc-header__profile-trigger:hover{background-color:var(--lc-header-hover-bg);border-color:var(--lc-header-fg-secondary)}.lc-header__profile-trigger:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-menu__header{padding:var(--spacing-3) var(--spacing-4);font-size:var(--font-size-sm);color:var(--color-text-secondary, #6b7280);border-bottom:1px solid var(--color-divider, #e5e7eb);margin-bottom:var(--spacing-1);word-break:break-word}.lc-header__menu-header{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);border-bottom:1px solid var(--color-divider, #e5e7eb);margin-bottom:var(--spacing-1)}.lc-header__menu-user-info{flex:1;min-width:0}.lc-header__menu-user-name{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text, #111827);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.lc-header__menu-user-email{font-size:var(--font-size-xs);color:var(--color-text-secondary, #6b7280);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}\n"] }]
         }], propDecorators: { theme: [{
                 type: Input
             }], logo: [{
@@ -6264,7 +6264,7 @@ class SidenavComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: SidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: SidenavComponent, isStandalone: true, selector: "lc-sidenav", inputs: { isOpenInput: "isOpenInput", modeInput: "modeInput", positionInput: "positionInput", widthInput: "widthInput", ariaLabelInput: "ariaLabelInput", hasOverlayInput: "hasOverlayInput", itemsInput: "itemsInput", activeRouteInput: "activeRouteInput", collapsedInput: "collapsedInput", themeInput: ["theme", "themeInput"] }, outputs: { closed: "closed", itemClicked: "itemClicked" }, host: { listeners: { "document:keydown": "handleKeydown($event)" }, properties: { "class.lc-sidenav-container": "true", "class.lc-sidenav-container--docked": "mode() === 'docked'", "class.lc-sidenav-container--open": "isOpen()" } }, ngImport: i0, template: "<!-- Drawer mode: render with overlay and conditional visibility -->\n@if (mode() === 'drawer') {\n  @if (isOpen()) {\n    <!-- Overlay backdrop -->\n    @if (hasOverlay()) {\n      <div\n        class=\"lc-sidenav__overlay\"\n        (click)=\"handleClose()\"\n        aria-hidden=\"true\">\n      </div>\n    }\n\n    <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n  }\n}\n\n<!-- Docked mode: always render, visibility controlled by CSS -->\n@if (mode() === 'docked') {\n  <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n}\n\n<!-- Shared sidenav panel template -->\n<ng-template #sidenavPanel>\n  <aside\n    [class]=\"sidenavClasses()\"\n    [ngStyle]=\"sidenavStyles()\"\n    role=\"navigation\"\n    [attr.aria-label]=\"ariaLabel()\">\n\n    <!-- Close button (drawer mode only) -->\n    @if (mode() === 'drawer') {\n      <button\n        type=\"button\"\n        class=\"lc-sidenav__close\"\n        (click)=\"handleClose()\"\n        aria-label=\"Close navigation\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\">\n          <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n          <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n        </svg>\n      </button>\n    }\n\n    <!-- Navigation items (if provided) -->\n    @if (items().length > 0) {\n      <nav class=\"lc-sidenav__nav\" [class.lc-sidenav__nav--docked]=\"mode() === 'docked'\">\n        @for (item of sortedItems(); track item.id) {\n          <!-- Section headline -->\n          @if (item.isSection) {\n            <div class=\"lc-sidenav__section\">\n              <h2 class=\"lc-sidenav__section-title\">{{ item.label }}</h2>\n              @if (item.children?.length) {\n                <ul class=\"lc-sidenav__section-items\">\n                  @for (child of item.children; track child.id) {\n                    <li>\n                      <a\n                        [routerLink]=\"child.route\"\n                        routerLinkActive=\"lc-sidenav__nav-item--active\"\n                        [routerLinkActiveOptions]=\"{ exact: child.route === '/' }\"\n                        class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                        (click)=\"handleItemClick(child)\"\n                        [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                        @if (child.icon) {\n                          <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                        }\n                        <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                      </a>\n                    </li>\n                  }\n                </ul>\n              }\n            </div>\n          } @else if (item.children?.length) {\n            <!-- Parent item with children (collapsible group) -->\n            <button\n              type=\"button\"\n              class=\"lc-sidenav__nav-item lc-sidenav__nav-item--parent\"\n              [class.lc-sidenav__nav-item--expanded]=\"isExpanded(item)\"\n              [class.lc-sidenav__nav-item--active]=\"hasActiveChild(item)\"\n              (click)=\"toggleExpanded(item)\"\n              [attr.aria-expanded]=\"isExpanded(item)\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n              <lc-icon name=\"chevron-down\" size=\"xs\" [decorative]=\"true\" class=\"lc-sidenav__nav-chevron\" />\n            </button>\n            @if (isExpanded(item)) {\n              <div class=\"lc-sidenav__nav-children\">\n                @for (child of item.children; track child.id) {\n                  <a\n                    [routerLink]=\"child.route\"\n                    routerLinkActive=\"lc-sidenav__nav-item--active\"\n                    class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                    (click)=\"handleItemClick(child)\"\n                    [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                    <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                    <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                  </a>\n                }\n              </div>\n            }\n          } @else {\n            <!-- Simple item without children -->\n            <a\n              [routerLink]=\"item.route\"\n              routerLinkActive=\"lc-sidenav__nav-item--active\"\n              [routerLinkActiveOptions]=\"{ exact: item.route === '/' }\"\n              class=\"lc-sidenav__nav-item\"\n              (click)=\"handleItemClick(item)\"\n              [attr.aria-current]=\"isItemActive(item) ? 'page' : null\"\n              [title]=\"collapsed() ? item.label : ''\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n            </a>\n          }\n        }\n      </nav>\n    }\n\n    <!-- Content projection (for custom content) -->\n    <div class=\"lc-sidenav__content\" [class.lc-sidenav__content--docked]=\"mode() === 'docked'\">\n      <ng-content></ng-content>\n    </div>\n  </aside>\n</ng-template>\n", styles: [".lc-sidenav-container{position:relative;z-index:1000}.lc-sidenav-container--docked{position:static;z-index:auto;height:100%}.lc-sidenav__overlay{position:fixed;inset:0;background-color:#00000080;opacity:0;animation:fadeIn .3s ease-out forwards;z-index:1000;cursor:pointer}@media(prefers-reduced-motion:reduce){.lc-sidenav__overlay{animation:none;opacity:1}}.lc-sidenav{--lc-sidenav-bg: var(--color-background, #ffffff);--lc-sidenav-fg: var(--color-neutral-700, #374151);--lc-sidenav-fg-active: var(--color-neutral-900, #111827);--lc-sidenav-border: var(--color-border, #e5e7eb);--lc-sidenav-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-sidenav-section-fg: var(--color-neutral-500, #6b7280);position:fixed;top:0;bottom:0;background-color:var(--lc-sidenav-bg);box-shadow:var(--elevation-3, 0 10px 15px -3px rgba(0, 0, 0, .1));z-index:1001;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.lc-sidenav--left{left:0}.lc-sidenav--right{right:0}.lc-sidenav--drawer.lc-sidenav--left{animation:slideInLeft .3s ease-out}.lc-sidenav--drawer.lc-sidenav--right{animation:slideInRight .3s ease-out}@media(prefers-reduced-motion:reduce){.lc-sidenav--drawer{animation:none!important}}.lc-sidenav--docked{position:static;z-index:auto;height:100%;box-shadow:none;border-right:1px solid var(--lc-sidenav-border, #e5e7eb);transform:translate(0);transition:width .3s ease,transform .3s ease}.lc-sidenav--docked:not(.lc-sidenav--open){width:0!important;overflow:hidden;border-right:none}.lc-sidenav--collapsed{width:56px!important;overflow:visible}.lc-sidenav--collapsed .lc-sidenav__nav-label,.lc-sidenav--collapsed .lc-sidenav__nav-chevron,.lc-sidenav--collapsed .lc-sidenav__section-title{display:none}.lc-sidenav--collapsed .lc-sidenav__nav{padding:.5rem;gap:.125rem}.lc-sidenav--collapsed .lc-sidenav__nav-item{justify-content:center;padding:.625rem;gap:0;border-radius:var(--radius-md, .375rem);position:relative}.lc-sidenav--collapsed .lc-sidenav__nav-item:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:8px;padding:4px 10px;background-color:var(--color-neutral-900, #111827);color:#fff;font-size:.75rem;white-space:nowrap;border-radius:4px;z-index:1002;pointer-events:none}.lc-sidenav--collapsed .lc-sidenav__nav-icon{width:22px;height:22px}.lc-sidenav--collapsed .lc-sidenav__nav-children{display:none}.lc-sidenav--collapsed .lc-sidenav__section{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-divider, #e5e7eb)}.lc-sidenav--collapsed .lc-sidenav__content{display:none}.lc-sidenav__close{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:var(--border-radius-md, .375rem);color:var(--color-text-secondary);cursor:pointer;transition:background-color .2s ease,color .2s ease;z-index:1}.lc-sidenav__close:hover{background-color:var(--color-surface);color:var(--color-text-primary)}.lc-sidenav__close:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px}.lc-sidenav__close:active{background-color:var(--color-border)}.lc-sidenav__close svg{width:1.25rem;height:1.25rem}.lc-sidenav__nav{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding:4rem 1rem 1rem}.lc-sidenav__nav--docked{padding-top:1rem;gap:0}.lc-sidenav__section:not(:first-child){margin-top:var(--spacing-4, 1rem);padding-top:var(--spacing-3, .75rem)}.lc-sidenav__section-title{padding:0 var(--spacing-3, .75rem);margin-bottom:var(--spacing-2, .5rem);font-size:var(--font-size-xs, .75rem);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--lc-sidenav-section-fg)}.lc-sidenav__section-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spacing-1, .25rem)}.lc-sidenav__nav-item{display:flex;align-items:center;gap:var(--spacing-3, .75rem);padding:var(--spacing-2, .5rem) var(--spacing-3, .75rem);text-decoration:none;color:var(--lc-sidenav-fg);border-radius:var(--radius-md, .375rem);transition:background-color .2s ease,color .2s ease;font-size:var(--font-size-sm, .875rem);font-weight:500;cursor:pointer}.lc-sidenav__nav-item:hover{background-color:var(--lc-sidenav-hover-bg);color:var(--lc-sidenav-fg-active)}.lc-sidenav__nav-item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-sidenav__nav-item--active{background-color:var(--color-primary-50, rgba(59, 130, 246, .1));color:var(--color-primary-700, #1d4ed8);font-weight:600}.lc-sidenav__nav-item--active .lc-sidenav__nav-icon{color:var(--color-primary-600, #2563eb)}.lc-sidenav__nav-icon{width:20px;height:20px;flex-shrink:0}.lc-sidenav__nav-chevron{width:16px;height:16px;flex-shrink:0;margin-left:auto;transition:transform .2s ease}.lc-sidenav__nav-item--expanded .lc-sidenav__nav-chevron{transform:rotate(180deg)}.lc-sidenav__nav-item--parent{width:100%;border:none;background:none;font-family:inherit;text-align:left}.lc-sidenav__nav-children{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding-left:var(--spacing-4, 1rem)}.lc-sidenav__nav-item--child{font-size:var(--font-size-sm, .875rem)}.lc-sidenav__nav-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lc-sidenav__content{flex:1;padding:4rem 1rem 1rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.lc-sidenav__content--docked{padding-top:1rem}.lc-sidenav__content::-webkit-scrollbar{width:.5rem}.lc-sidenav__content::-webkit-scrollbar-track{background:var(--color-surface);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media(max-width:640px){.lc-sidenav--drawer{width:100%!important;max-width:320px}}@media(max-width:480px){.lc-sidenav--drawer{max-width:280px}}.lc-sidenav__content:focus{outline:none}.lc-sidenav__content a:focus-visible,.lc-sidenav__content button:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px;border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav--dark{--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}:host-context([data-theme=dark]) .lc-sidenav:not(.lc-sidenav--light){--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}@media print{.lc-sidenav-container,.lc-sidenav__overlay,.lc-sidenav{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconComponent, selector: "lc-icon", inputs: ["name", "variant", "size", "color", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: SidenavComponent, isStandalone: true, selector: "lc-sidenav", inputs: { isOpenInput: "isOpenInput", modeInput: "modeInput", positionInput: "positionInput", widthInput: "widthInput", ariaLabelInput: "ariaLabelInput", hasOverlayInput: "hasOverlayInput", itemsInput: "itemsInput", activeRouteInput: "activeRouteInput", collapsedInput: "collapsedInput", themeInput: ["theme", "themeInput"] }, outputs: { closed: "closed", itemClicked: "itemClicked" }, host: { listeners: { "document:keydown": "handleKeydown($event)" }, properties: { "class.lc-sidenav-container": "true", "class.lc-sidenav-container--docked": "mode() === 'docked'", "class.lc-sidenav-container--open": "isOpen()" } }, ngImport: i0, template: "<!-- Drawer mode: render with overlay and conditional visibility -->\n@if (mode() === 'drawer') {\n  @if (isOpen()) {\n    <!-- Overlay backdrop -->\n    @if (hasOverlay()) {\n      <div\n        class=\"lc-sidenav__overlay\"\n        (click)=\"handleClose()\"\n        aria-hidden=\"true\">\n      </div>\n    }\n\n    <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n  }\n}\n\n<!-- Docked mode: always render, visibility controlled by CSS -->\n@if (mode() === 'docked') {\n  <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n}\n\n<!-- Shared sidenav panel template -->\n<ng-template #sidenavPanel>\n  <aside\n    [class]=\"sidenavClasses()\"\n    [ngStyle]=\"sidenavStyles()\"\n    role=\"navigation\"\n    [attr.aria-label]=\"ariaLabel()\">\n\n    <!-- Close button (drawer mode only) -->\n    @if (mode() === 'drawer') {\n      <button\n        type=\"button\"\n        class=\"lc-sidenav__close\"\n        (click)=\"handleClose()\"\n        aria-label=\"Close navigation\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\">\n          <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n          <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n        </svg>\n      </button>\n    }\n\n    <!-- Navigation items (if provided) -->\n    @if (items().length > 0) {\n      <nav class=\"lc-sidenav__nav\" [class.lc-sidenav__nav--docked]=\"mode() === 'docked'\">\n        @for (item of sortedItems(); track item.id) {\n          <!-- Section headline -->\n          @if (item.isSection) {\n            <div class=\"lc-sidenav__section\">\n              <h2 class=\"lc-sidenav__section-title\">{{ item.label }}</h2>\n              @if (item.children?.length) {\n                <ul class=\"lc-sidenav__section-items\">\n                  @for (child of item.children; track child.id) {\n                    <li>\n                      <a\n                        [routerLink]=\"child.route\"\n                        routerLinkActive=\"lc-sidenav__nav-item--active\"\n                        [routerLinkActiveOptions]=\"{ exact: child.route === '/' }\"\n                        class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                        (click)=\"handleItemClick(child)\"\n                        [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                        @if (child.icon) {\n                          <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                        }\n                        <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                      </a>\n                    </li>\n                  }\n                </ul>\n              }\n            </div>\n          } @else if (item.children?.length) {\n            <!-- Parent item with children (collapsible group) -->\n            <button\n              type=\"button\"\n              class=\"lc-sidenav__nav-item lc-sidenav__nav-item--parent\"\n              [class.lc-sidenav__nav-item--expanded]=\"isExpanded(item)\"\n              [class.lc-sidenav__nav-item--active]=\"hasActiveChild(item)\"\n              (click)=\"toggleExpanded(item)\"\n              [attr.aria-expanded]=\"isExpanded(item)\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n              <lc-icon name=\"chevron-down\" size=\"xs\" [decorative]=\"true\" class=\"lc-sidenav__nav-chevron\" />\n            </button>\n            @if (isExpanded(item)) {\n              <div class=\"lc-sidenav__nav-children\">\n                @for (child of item.children; track child.id) {\n                  <a\n                    [routerLink]=\"child.route\"\n                    routerLinkActive=\"lc-sidenav__nav-item--active\"\n                    class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                    (click)=\"handleItemClick(child)\"\n                    [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                    <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                    <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                  </a>\n                }\n              </div>\n            }\n          } @else {\n            <!-- Simple item without children -->\n            <a\n              [routerLink]=\"item.route\"\n              routerLinkActive=\"lc-sidenav__nav-item--active\"\n              [routerLinkActiveOptions]=\"{ exact: item.route === '/' }\"\n              class=\"lc-sidenav__nav-item\"\n              (click)=\"handleItemClick(item)\"\n              [attr.aria-current]=\"isItemActive(item) ? 'page' : null\"\n              [title]=\"collapsed() ? item.label : ''\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n            </a>\n          }\n        }\n      </nav>\n    }\n\n    <!-- Content projection (for custom content) -->\n    <div class=\"lc-sidenav__content\" [class.lc-sidenav__content--docked]=\"mode() === 'docked'\">\n      <ng-content></ng-content>\n    </div>\n  </aside>\n</ng-template>\n", styles: [".lc-sidenav-container{position:relative;z-index:1000}.lc-sidenav-container--docked{position:static;z-index:auto;height:100%}.lc-sidenav__overlay{position:fixed;inset:0;background-color:#00000080;opacity:0;animation:fadeIn .3s ease-out forwards;z-index:1000;cursor:pointer}@media(prefers-reduced-motion:reduce){.lc-sidenav__overlay{animation:none;opacity:1}}.lc-sidenav{--lc-sidenav-bg: var(--color-background, #ffffff);--lc-sidenav-fg: #374151;--lc-sidenav-fg-active: #111827;--lc-sidenav-border: var(--color-border, #e5e7eb);--lc-sidenav-hover-bg: #f3f4f6;--lc-sidenav-section-fg: #6b7280;position:fixed;top:0;bottom:0;background-color:var(--lc-sidenav-bg);box-shadow:var(--elevation-3, 0 10px 15px -3px rgba(0, 0, 0, .1));z-index:1001;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.lc-sidenav--left{left:0}.lc-sidenav--right{right:0}.lc-sidenav--drawer.lc-sidenav--left{animation:slideInLeft .3s ease-out}.lc-sidenav--drawer.lc-sidenav--right{animation:slideInRight .3s ease-out}@media(prefers-reduced-motion:reduce){.lc-sidenav--drawer{animation:none!important}}.lc-sidenav--docked{position:static;z-index:auto;height:100%;box-shadow:none;border-right:1px solid var(--lc-sidenav-border, #e5e7eb);transform:translate(0);transition:width .3s ease,transform .3s ease}.lc-sidenav--docked:not(.lc-sidenav--open){width:0!important;overflow:hidden;border-right:none}.lc-sidenav--collapsed{width:56px!important;overflow:visible}.lc-sidenav--collapsed .lc-sidenav__nav-label,.lc-sidenav--collapsed .lc-sidenav__nav-chevron,.lc-sidenav--collapsed .lc-sidenav__section-title{display:none}.lc-sidenav--collapsed .lc-sidenav__nav{padding:.5rem;gap:.125rem}.lc-sidenav--collapsed .lc-sidenav__nav-item{justify-content:center;padding:.625rem;gap:0;border-radius:var(--radius-md, .375rem);position:relative}.lc-sidenav--collapsed .lc-sidenav__nav-item:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:8px;padding:4px 10px;background-color:var(--color-neutral-900, #111827);color:#fff;font-size:.75rem;white-space:nowrap;border-radius:4px;z-index:1002;pointer-events:none}.lc-sidenav--collapsed .lc-sidenav__nav-icon{width:22px;height:22px}.lc-sidenav--collapsed .lc-sidenav__nav-children{display:none}.lc-sidenav--collapsed .lc-sidenav__section{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-divider, #e5e7eb)}.lc-sidenav--collapsed .lc-sidenav__content{display:none}.lc-sidenav__close{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:var(--border-radius-md, .375rem);color:var(--color-text-secondary);cursor:pointer;transition:background-color .2s ease,color .2s ease;z-index:1}.lc-sidenav__close:hover{background-color:var(--color-surface);color:var(--color-text-primary)}.lc-sidenav__close:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px}.lc-sidenav__close:active{background-color:var(--color-border)}.lc-sidenav__close svg{width:1.25rem;height:1.25rem}.lc-sidenav__nav{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding:4rem 1rem 1rem}.lc-sidenav__nav--docked{padding-top:1rem;gap:0}.lc-sidenav__section:not(:first-child){margin-top:var(--spacing-4, 1rem);padding-top:var(--spacing-3, .75rem)}.lc-sidenav__section-title{padding:0 var(--spacing-3, .75rem);margin-bottom:var(--spacing-2, .5rem);font-size:var(--font-size-xs, .75rem);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--lc-sidenav-section-fg)}.lc-sidenav__section-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spacing-1, .25rem)}.lc-sidenav__nav-item{display:flex;align-items:center;gap:var(--spacing-3, .75rem);padding:var(--spacing-2, .5rem) var(--spacing-3, .75rem);text-decoration:none;color:var(--lc-sidenav-fg);border-radius:var(--radius-md, .375rem);transition:background-color .2s ease,color .2s ease;font-size:var(--font-size-sm, .875rem);font-weight:500;cursor:pointer}.lc-sidenav__nav-item:hover{background-color:var(--lc-sidenav-hover-bg);color:var(--lc-sidenav-fg-active)}.lc-sidenav__nav-item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-sidenav__nav-item--active{background-color:var(--color-primary-50, rgba(59, 130, 246, .1));color:var(--color-primary-700, #1d4ed8);font-weight:600}.lc-sidenav__nav-item--active .lc-sidenav__nav-icon{color:var(--color-primary-600, #2563eb)}.lc-sidenav__nav-icon{width:20px;height:20px;flex-shrink:0;color:currentColor}.lc-sidenav__nav-chevron{width:16px;height:16px;flex-shrink:0;margin-left:auto;transition:transform .2s ease}.lc-sidenav__nav-item--expanded .lc-sidenav__nav-chevron{transform:rotate(180deg)}.lc-sidenav__nav-item--parent{width:100%;border:none;background:none;font-family:inherit;text-align:left}.lc-sidenav__nav-children{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding-left:var(--spacing-4, 1rem)}.lc-sidenav__nav-item--child{font-size:var(--font-size-sm, .875rem)}.lc-sidenav__nav-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lc-sidenav__content{flex:1;padding:4rem 1rem 1rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.lc-sidenav__content--docked{padding-top:1rem}.lc-sidenav__content::-webkit-scrollbar{width:.5rem}.lc-sidenav__content::-webkit-scrollbar-track{background:var(--color-surface);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media(max-width:640px){.lc-sidenav--drawer{width:100%!important;max-width:320px}}@media(max-width:480px){.lc-sidenav--drawer{max-width:280px}}.lc-sidenav__content:focus{outline:none}.lc-sidenav__content a:focus-visible,.lc-sidenav__content button:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px;border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav--dark{--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}:host-context([data-theme=dark]) .lc-sidenav:not(.lc-sidenav--light){--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}@media print{.lc-sidenav-container,.lc-sidenav__overlay,.lc-sidenav{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: IconComponent, selector: "lc-icon", inputs: ["name", "variant", "size", "color", "ariaLabel", "decorative"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: SidenavComponent, decorators: [{
             type: Component,
@@ -6272,7 +6272,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
                         '[class.lc-sidenav-container]': 'true',
                         '[class.lc-sidenav-container--docked]': "mode() === 'docked'",
                         '[class.lc-sidenav-container--open]': 'isOpen()',
-                    }, template: "<!-- Drawer mode: render with overlay and conditional visibility -->\n@if (mode() === 'drawer') {\n  @if (isOpen()) {\n    <!-- Overlay backdrop -->\n    @if (hasOverlay()) {\n      <div\n        class=\"lc-sidenav__overlay\"\n        (click)=\"handleClose()\"\n        aria-hidden=\"true\">\n      </div>\n    }\n\n    <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n  }\n}\n\n<!-- Docked mode: always render, visibility controlled by CSS -->\n@if (mode() === 'docked') {\n  <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n}\n\n<!-- Shared sidenav panel template -->\n<ng-template #sidenavPanel>\n  <aside\n    [class]=\"sidenavClasses()\"\n    [ngStyle]=\"sidenavStyles()\"\n    role=\"navigation\"\n    [attr.aria-label]=\"ariaLabel()\">\n\n    <!-- Close button (drawer mode only) -->\n    @if (mode() === 'drawer') {\n      <button\n        type=\"button\"\n        class=\"lc-sidenav__close\"\n        (click)=\"handleClose()\"\n        aria-label=\"Close navigation\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\">\n          <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n          <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n        </svg>\n      </button>\n    }\n\n    <!-- Navigation items (if provided) -->\n    @if (items().length > 0) {\n      <nav class=\"lc-sidenav__nav\" [class.lc-sidenav__nav--docked]=\"mode() === 'docked'\">\n        @for (item of sortedItems(); track item.id) {\n          <!-- Section headline -->\n          @if (item.isSection) {\n            <div class=\"lc-sidenav__section\">\n              <h2 class=\"lc-sidenav__section-title\">{{ item.label }}</h2>\n              @if (item.children?.length) {\n                <ul class=\"lc-sidenav__section-items\">\n                  @for (child of item.children; track child.id) {\n                    <li>\n                      <a\n                        [routerLink]=\"child.route\"\n                        routerLinkActive=\"lc-sidenav__nav-item--active\"\n                        [routerLinkActiveOptions]=\"{ exact: child.route === '/' }\"\n                        class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                        (click)=\"handleItemClick(child)\"\n                        [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                        @if (child.icon) {\n                          <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                        }\n                        <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                      </a>\n                    </li>\n                  }\n                </ul>\n              }\n            </div>\n          } @else if (item.children?.length) {\n            <!-- Parent item with children (collapsible group) -->\n            <button\n              type=\"button\"\n              class=\"lc-sidenav__nav-item lc-sidenav__nav-item--parent\"\n              [class.lc-sidenav__nav-item--expanded]=\"isExpanded(item)\"\n              [class.lc-sidenav__nav-item--active]=\"hasActiveChild(item)\"\n              (click)=\"toggleExpanded(item)\"\n              [attr.aria-expanded]=\"isExpanded(item)\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n              <lc-icon name=\"chevron-down\" size=\"xs\" [decorative]=\"true\" class=\"lc-sidenav__nav-chevron\" />\n            </button>\n            @if (isExpanded(item)) {\n              <div class=\"lc-sidenav__nav-children\">\n                @for (child of item.children; track child.id) {\n                  <a\n                    [routerLink]=\"child.route\"\n                    routerLinkActive=\"lc-sidenav__nav-item--active\"\n                    class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                    (click)=\"handleItemClick(child)\"\n                    [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                    <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                    <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                  </a>\n                }\n              </div>\n            }\n          } @else {\n            <!-- Simple item without children -->\n            <a\n              [routerLink]=\"item.route\"\n              routerLinkActive=\"lc-sidenav__nav-item--active\"\n              [routerLinkActiveOptions]=\"{ exact: item.route === '/' }\"\n              class=\"lc-sidenav__nav-item\"\n              (click)=\"handleItemClick(item)\"\n              [attr.aria-current]=\"isItemActive(item) ? 'page' : null\"\n              [title]=\"collapsed() ? item.label : ''\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n            </a>\n          }\n        }\n      </nav>\n    }\n\n    <!-- Content projection (for custom content) -->\n    <div class=\"lc-sidenav__content\" [class.lc-sidenav__content--docked]=\"mode() === 'docked'\">\n      <ng-content></ng-content>\n    </div>\n  </aside>\n</ng-template>\n", styles: [".lc-sidenav-container{position:relative;z-index:1000}.lc-sidenav-container--docked{position:static;z-index:auto;height:100%}.lc-sidenav__overlay{position:fixed;inset:0;background-color:#00000080;opacity:0;animation:fadeIn .3s ease-out forwards;z-index:1000;cursor:pointer}@media(prefers-reduced-motion:reduce){.lc-sidenav__overlay{animation:none;opacity:1}}.lc-sidenav{--lc-sidenav-bg: var(--color-background, #ffffff);--lc-sidenav-fg: var(--color-neutral-700, #374151);--lc-sidenav-fg-active: var(--color-neutral-900, #111827);--lc-sidenav-border: var(--color-border, #e5e7eb);--lc-sidenav-hover-bg: var(--color-neutral-100, #f3f4f6);--lc-sidenav-section-fg: var(--color-neutral-500, #6b7280);position:fixed;top:0;bottom:0;background-color:var(--lc-sidenav-bg);box-shadow:var(--elevation-3, 0 10px 15px -3px rgba(0, 0, 0, .1));z-index:1001;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.lc-sidenav--left{left:0}.lc-sidenav--right{right:0}.lc-sidenav--drawer.lc-sidenav--left{animation:slideInLeft .3s ease-out}.lc-sidenav--drawer.lc-sidenav--right{animation:slideInRight .3s ease-out}@media(prefers-reduced-motion:reduce){.lc-sidenav--drawer{animation:none!important}}.lc-sidenav--docked{position:static;z-index:auto;height:100%;box-shadow:none;border-right:1px solid var(--lc-sidenav-border, #e5e7eb);transform:translate(0);transition:width .3s ease,transform .3s ease}.lc-sidenav--docked:not(.lc-sidenav--open){width:0!important;overflow:hidden;border-right:none}.lc-sidenav--collapsed{width:56px!important;overflow:visible}.lc-sidenav--collapsed .lc-sidenav__nav-label,.lc-sidenav--collapsed .lc-sidenav__nav-chevron,.lc-sidenav--collapsed .lc-sidenav__section-title{display:none}.lc-sidenav--collapsed .lc-sidenav__nav{padding:.5rem;gap:.125rem}.lc-sidenav--collapsed .lc-sidenav__nav-item{justify-content:center;padding:.625rem;gap:0;border-radius:var(--radius-md, .375rem);position:relative}.lc-sidenav--collapsed .lc-sidenav__nav-item:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:8px;padding:4px 10px;background-color:var(--color-neutral-900, #111827);color:#fff;font-size:.75rem;white-space:nowrap;border-radius:4px;z-index:1002;pointer-events:none}.lc-sidenav--collapsed .lc-sidenav__nav-icon{width:22px;height:22px}.lc-sidenav--collapsed .lc-sidenav__nav-children{display:none}.lc-sidenav--collapsed .lc-sidenav__section{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-divider, #e5e7eb)}.lc-sidenav--collapsed .lc-sidenav__content{display:none}.lc-sidenav__close{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:var(--border-radius-md, .375rem);color:var(--color-text-secondary);cursor:pointer;transition:background-color .2s ease,color .2s ease;z-index:1}.lc-sidenav__close:hover{background-color:var(--color-surface);color:var(--color-text-primary)}.lc-sidenav__close:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px}.lc-sidenav__close:active{background-color:var(--color-border)}.lc-sidenav__close svg{width:1.25rem;height:1.25rem}.lc-sidenav__nav{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding:4rem 1rem 1rem}.lc-sidenav__nav--docked{padding-top:1rem;gap:0}.lc-sidenav__section:not(:first-child){margin-top:var(--spacing-4, 1rem);padding-top:var(--spacing-3, .75rem)}.lc-sidenav__section-title{padding:0 var(--spacing-3, .75rem);margin-bottom:var(--spacing-2, .5rem);font-size:var(--font-size-xs, .75rem);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--lc-sidenav-section-fg)}.lc-sidenav__section-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spacing-1, .25rem)}.lc-sidenav__nav-item{display:flex;align-items:center;gap:var(--spacing-3, .75rem);padding:var(--spacing-2, .5rem) var(--spacing-3, .75rem);text-decoration:none;color:var(--lc-sidenav-fg);border-radius:var(--radius-md, .375rem);transition:background-color .2s ease,color .2s ease;font-size:var(--font-size-sm, .875rem);font-weight:500;cursor:pointer}.lc-sidenav__nav-item:hover{background-color:var(--lc-sidenav-hover-bg);color:var(--lc-sidenav-fg-active)}.lc-sidenav__nav-item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-sidenav__nav-item--active{background-color:var(--color-primary-50, rgba(59, 130, 246, .1));color:var(--color-primary-700, #1d4ed8);font-weight:600}.lc-sidenav__nav-item--active .lc-sidenav__nav-icon{color:var(--color-primary-600, #2563eb)}.lc-sidenav__nav-icon{width:20px;height:20px;flex-shrink:0}.lc-sidenav__nav-chevron{width:16px;height:16px;flex-shrink:0;margin-left:auto;transition:transform .2s ease}.lc-sidenav__nav-item--expanded .lc-sidenav__nav-chevron{transform:rotate(180deg)}.lc-sidenav__nav-item--parent{width:100%;border:none;background:none;font-family:inherit;text-align:left}.lc-sidenav__nav-children{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding-left:var(--spacing-4, 1rem)}.lc-sidenav__nav-item--child{font-size:var(--font-size-sm, .875rem)}.lc-sidenav__nav-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lc-sidenav__content{flex:1;padding:4rem 1rem 1rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.lc-sidenav__content--docked{padding-top:1rem}.lc-sidenav__content::-webkit-scrollbar{width:.5rem}.lc-sidenav__content::-webkit-scrollbar-track{background:var(--color-surface);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media(max-width:640px){.lc-sidenav--drawer{width:100%!important;max-width:320px}}@media(max-width:480px){.lc-sidenav--drawer{max-width:280px}}.lc-sidenav__content:focus{outline:none}.lc-sidenav__content a:focus-visible,.lc-sidenav__content button:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px;border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav--dark{--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}:host-context([data-theme=dark]) .lc-sidenav:not(.lc-sidenav--light){--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}@media print{.lc-sidenav-container,.lc-sidenav__overlay,.lc-sidenav{display:none}}\n"] }]
+                    }, template: "<!-- Drawer mode: render with overlay and conditional visibility -->\n@if (mode() === 'drawer') {\n  @if (isOpen()) {\n    <!-- Overlay backdrop -->\n    @if (hasOverlay()) {\n      <div\n        class=\"lc-sidenav__overlay\"\n        (click)=\"handleClose()\"\n        aria-hidden=\"true\">\n      </div>\n    }\n\n    <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n  }\n}\n\n<!-- Docked mode: always render, visibility controlled by CSS -->\n@if (mode() === 'docked') {\n  <ng-container *ngTemplateOutlet=\"sidenavPanel\" />\n}\n\n<!-- Shared sidenav panel template -->\n<ng-template #sidenavPanel>\n  <aside\n    [class]=\"sidenavClasses()\"\n    [ngStyle]=\"sidenavStyles()\"\n    role=\"navigation\"\n    [attr.aria-label]=\"ariaLabel()\">\n\n    <!-- Close button (drawer mode only) -->\n    @if (mode() === 'drawer') {\n      <button\n        type=\"button\"\n        class=\"lc-sidenav__close\"\n        (click)=\"handleClose()\"\n        aria-label=\"Close navigation\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\">\n          <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line>\n          <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line>\n        </svg>\n      </button>\n    }\n\n    <!-- Navigation items (if provided) -->\n    @if (items().length > 0) {\n      <nav class=\"lc-sidenav__nav\" [class.lc-sidenav__nav--docked]=\"mode() === 'docked'\">\n        @for (item of sortedItems(); track item.id) {\n          <!-- Section headline -->\n          @if (item.isSection) {\n            <div class=\"lc-sidenav__section\">\n              <h2 class=\"lc-sidenav__section-title\">{{ item.label }}</h2>\n              @if (item.children?.length) {\n                <ul class=\"lc-sidenav__section-items\">\n                  @for (child of item.children; track child.id) {\n                    <li>\n                      <a\n                        [routerLink]=\"child.route\"\n                        routerLinkActive=\"lc-sidenav__nav-item--active\"\n                        [routerLinkActiveOptions]=\"{ exact: child.route === '/' }\"\n                        class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                        (click)=\"handleItemClick(child)\"\n                        [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                        @if (child.icon) {\n                          <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                        }\n                        <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                      </a>\n                    </li>\n                  }\n                </ul>\n              }\n            </div>\n          } @else if (item.children?.length) {\n            <!-- Parent item with children (collapsible group) -->\n            <button\n              type=\"button\"\n              class=\"lc-sidenav__nav-item lc-sidenav__nav-item--parent\"\n              [class.lc-sidenav__nav-item--expanded]=\"isExpanded(item)\"\n              [class.lc-sidenav__nav-item--active]=\"hasActiveChild(item)\"\n              (click)=\"toggleExpanded(item)\"\n              [attr.aria-expanded]=\"isExpanded(item)\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n              <lc-icon name=\"chevron-down\" size=\"xs\" [decorative]=\"true\" class=\"lc-sidenav__nav-chevron\" />\n            </button>\n            @if (isExpanded(item)) {\n              <div class=\"lc-sidenav__nav-children\">\n                @for (child of item.children; track child.id) {\n                  <a\n                    [routerLink]=\"child.route\"\n                    routerLinkActive=\"lc-sidenav__nav-item--active\"\n                    class=\"lc-sidenav__nav-item lc-sidenav__nav-item--child\"\n                    (click)=\"handleItemClick(child)\"\n                    [attr.aria-current]=\"isItemActive(child) ? 'page' : null\">\n                    <lc-icon [name]=\"child.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n                    <span class=\"lc-sidenav__nav-label\">{{ child.label }}</span>\n                  </a>\n                }\n              </div>\n            }\n          } @else {\n            <!-- Simple item without children -->\n            <a\n              [routerLink]=\"item.route\"\n              routerLinkActive=\"lc-sidenav__nav-item--active\"\n              [routerLinkActiveOptions]=\"{ exact: item.route === '/' }\"\n              class=\"lc-sidenav__nav-item\"\n              (click)=\"handleItemClick(item)\"\n              [attr.aria-current]=\"isItemActive(item) ? 'page' : null\"\n              [title]=\"collapsed() ? item.label : ''\">\n              <lc-icon [name]=\"item.icon\" size=\"sm\" [decorative]=\"true\" class=\"lc-sidenav__nav-icon\" />\n              <span class=\"lc-sidenav__nav-label\">{{ item.label }}</span>\n            </a>\n          }\n        }\n      </nav>\n    }\n\n    <!-- Content projection (for custom content) -->\n    <div class=\"lc-sidenav__content\" [class.lc-sidenav__content--docked]=\"mode() === 'docked'\">\n      <ng-content></ng-content>\n    </div>\n  </aside>\n</ng-template>\n", styles: [".lc-sidenav-container{position:relative;z-index:1000}.lc-sidenav-container--docked{position:static;z-index:auto;height:100%}.lc-sidenav__overlay{position:fixed;inset:0;background-color:#00000080;opacity:0;animation:fadeIn .3s ease-out forwards;z-index:1000;cursor:pointer}@media(prefers-reduced-motion:reduce){.lc-sidenav__overlay{animation:none;opacity:1}}.lc-sidenav{--lc-sidenav-bg: var(--color-background, #ffffff);--lc-sidenav-fg: #374151;--lc-sidenav-fg-active: #111827;--lc-sidenav-border: var(--color-border, #e5e7eb);--lc-sidenav-hover-bg: #f3f4f6;--lc-sidenav-section-fg: #6b7280;position:fixed;top:0;bottom:0;background-color:var(--lc-sidenav-bg);box-shadow:var(--elevation-3, 0 10px 15px -3px rgba(0, 0, 0, .1));z-index:1001;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden}.lc-sidenav--left{left:0}.lc-sidenav--right{right:0}.lc-sidenav--drawer.lc-sidenav--left{animation:slideInLeft .3s ease-out}.lc-sidenav--drawer.lc-sidenav--right{animation:slideInRight .3s ease-out}@media(prefers-reduced-motion:reduce){.lc-sidenav--drawer{animation:none!important}}.lc-sidenav--docked{position:static;z-index:auto;height:100%;box-shadow:none;border-right:1px solid var(--lc-sidenav-border, #e5e7eb);transform:translate(0);transition:width .3s ease,transform .3s ease}.lc-sidenav--docked:not(.lc-sidenav--open){width:0!important;overflow:hidden;border-right:none}.lc-sidenav--collapsed{width:56px!important;overflow:visible}.lc-sidenav--collapsed .lc-sidenav__nav-label,.lc-sidenav--collapsed .lc-sidenav__nav-chevron,.lc-sidenav--collapsed .lc-sidenav__section-title{display:none}.lc-sidenav--collapsed .lc-sidenav__nav{padding:.5rem;gap:.125rem}.lc-sidenav--collapsed .lc-sidenav__nav-item{justify-content:center;padding:.625rem;gap:0;border-radius:var(--radius-md, .375rem);position:relative}.lc-sidenav--collapsed .lc-sidenav__nav-item:hover:after{content:attr(title);position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:8px;padding:4px 10px;background-color:var(--color-neutral-900, #111827);color:#fff;font-size:.75rem;white-space:nowrap;border-radius:4px;z-index:1002;pointer-events:none}.lc-sidenav--collapsed .lc-sidenav__nav-icon{width:22px;height:22px}.lc-sidenav--collapsed .lc-sidenav__nav-children{display:none}.lc-sidenav--collapsed .lc-sidenav__section{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--color-divider, #e5e7eb)}.lc-sidenav--collapsed .lc-sidenav__content{display:none}.lc-sidenav__close{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;background:none;border:none;border-radius:var(--border-radius-md, .375rem);color:var(--color-text-secondary);cursor:pointer;transition:background-color .2s ease,color .2s ease;z-index:1}.lc-sidenav__close:hover{background-color:var(--color-surface);color:var(--color-text-primary)}.lc-sidenav__close:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px}.lc-sidenav__close:active{background-color:var(--color-border)}.lc-sidenav__close svg{width:1.25rem;height:1.25rem}.lc-sidenav__nav{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding:4rem 1rem 1rem}.lc-sidenav__nav--docked{padding-top:1rem;gap:0}.lc-sidenav__section:not(:first-child){margin-top:var(--spacing-4, 1rem);padding-top:var(--spacing-3, .75rem)}.lc-sidenav__section-title{padding:0 var(--spacing-3, .75rem);margin-bottom:var(--spacing-2, .5rem);font-size:var(--font-size-xs, .75rem);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--lc-sidenav-section-fg)}.lc-sidenav__section-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--spacing-1, .25rem)}.lc-sidenav__nav-item{display:flex;align-items:center;gap:var(--spacing-3, .75rem);padding:var(--spacing-2, .5rem) var(--spacing-3, .75rem);text-decoration:none;color:var(--lc-sidenav-fg);border-radius:var(--radius-md, .375rem);transition:background-color .2s ease,color .2s ease;font-size:var(--font-size-sm, .875rem);font-weight:500;cursor:pointer}.lc-sidenav__nav-item:hover{background-color:var(--lc-sidenav-hover-bg);color:var(--lc-sidenav-fg-active)}.lc-sidenav__nav-item:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}.lc-sidenav__nav-item--active{background-color:var(--color-primary-50, rgba(59, 130, 246, .1));color:var(--color-primary-700, #1d4ed8);font-weight:600}.lc-sidenav__nav-item--active .lc-sidenav__nav-icon{color:var(--color-primary-600, #2563eb)}.lc-sidenav__nav-icon{width:20px;height:20px;flex-shrink:0;color:currentColor}.lc-sidenav__nav-chevron{width:16px;height:16px;flex-shrink:0;margin-left:auto;transition:transform .2s ease}.lc-sidenav__nav-item--expanded .lc-sidenav__nav-chevron{transform:rotate(180deg)}.lc-sidenav__nav-item--parent{width:100%;border:none;background:none;font-family:inherit;text-align:left}.lc-sidenav__nav-children{display:flex;flex-direction:column;gap:var(--spacing-1, .25rem);padding-left:var(--spacing-4, 1rem)}.lc-sidenav__nav-item--child{font-size:var(--font-size-sm, .875rem)}.lc-sidenav__nav-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lc-sidenav__content{flex:1;padding:4rem 1rem 1rem;overflow-y:auto;-webkit-overflow-scrolling:touch}.lc-sidenav__content--docked{padding-top:1rem}.lc-sidenav__content::-webkit-scrollbar{width:.5rem}.lc-sidenav__content::-webkit-scrollbar-track{background:var(--color-surface);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav__content::-webkit-scrollbar-thumb:hover{background:var(--color-text-secondary)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@media(max-width:640px){.lc-sidenav--drawer{width:100%!important;max-width:320px}}@media(max-width:480px){.lc-sidenav--drawer{max-width:280px}}.lc-sidenav__content:focus{outline:none}.lc-sidenav__content a:focus-visible,.lc-sidenav__content button:focus-visible{outline:2px solid var(--color-primary-500, rgb(59, 130, 246));outline-offset:2px;border-radius:var(--border-radius-sm, .25rem)}.lc-sidenav--dark{--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}:host-context([data-theme=dark]) .lc-sidenav:not(.lc-sidenav--light){--lc-sidenav-bg: #18181b;--lc-sidenav-fg: #d4d4d8;--lc-sidenav-fg-active: #f5f5f5;--lc-sidenav-border: #3f3f46;--lc-sidenav-hover-bg: #27272a;--lc-sidenav-section-fg: #a1a1aa}@media print{.lc-sidenav-container,.lc-sidenav__overlay,.lc-sidenav{display:none}}\n"] }]
         }], propDecorators: { isOpenInput: [{
                 type: Input
             }], modeInput: [{