structra-ui 0.2.87 → 0.2.89

package/fesm2022/structra-ui.mjs

@@ -1,6 +1,6 @@
 import '../structra-ui.css';
 import * as i1$2 from '@angular/common';
-import { isPlatformBrowser, NgIf, NgClass, NgTemplateOutlet, CommonModule, DOCUMENT, NgStyle, NgComponentOutlet } from '@angular/common';
+import { isPlatformBrowser, NgIf, NgClass, NgTemplateOutlet, NgStyle, CommonModule, DOCUMENT, NgComponentOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { inject, PLATFORM_ID, DestroyRef, ChangeDetectorRef, ElementRef, signal, Input, ChangeDetectionStrategy, Component, InjectionToken, Injectable, Directive, makeEnvironmentProviders, ENVIRONMENT_INITIALIZER, booleanAttribute, HostBinding, ViewChild, output, Injector, EventEmitter, Output, numberAttribute, input, computed, afterNextRender, HostListener, ViewChildren, forwardRef, ApplicationRef, ContentChildren, NgZone, viewChild, effect, Renderer2, TemplateRef, ContentChild, isDevMode, runInInjectionContext, untracked, EnvironmentInjector, createEnvironmentInjector, APP_INITIALIZER, createComponent } from '@angular/core';
 import { Router, NavigationEnd, NavigationStart, RouterLink, ActivatedRoute, convertToParamMap } from '@angular/router';
@@ -547,6 +547,10 @@ class StructraKanbanDragAutoScrollController {
 
 /** Breakpoint alinhado à vista adaptativa (`max-width: 767.98px`). */
 const FIELD_MOBILE_LAYOUT_QUERY = '(max-width: 767.98px)';
+/** Padrão mobile Structra (16px — evita zoom iOS); desktop usa tokens `sm`/`md`/`lg`. */
+function isStructraFieldMobileLayout() {
+    return (typeof matchMedia !== 'undefined' && matchMedia(FIELD_MOBILE_LAYOUT_QUERY).matches);
+}
 
 const ButtonVariant = {
     Primary: 'primary',
@@ -874,9 +878,9 @@ function nativeInputHasVisibleValue(input, boundText) {
     }
     return isNativeInputAutofilled(input);
 }
-/** Lê token tipográfico já definido no input (não o valor UA do autofill). */
-function nativeInputTypographyToken(input, varName, fallback) {
-    const fromVar = getComputedStyle(input).getPropertyValue(varName).trim();
+/** Lê token tipográfico já definido no controlo (não o valor UA do autofill). */
+function nativeInputTypographyToken(el, varName, fallback) {
+    const fromVar = getComputedStyle(el).getPropertyValue(varName).trim();
     return fromVar || fallback;
 }
 /** Converte `rem`/`em`/etc. para px absolutos — Chrome autofill ignora `rem`/`var()` sem foco. */
@@ -917,31 +921,46 @@ function resolveLineHeightPx(fontSizePx, lineHeightToken) {
     }
     return resolveCssLengthToPx(document.documentElement, trimmed, `${Math.round(fontPx * 1.35 * 100) / 100}px`);
 }
+/** Mobile: 16px fixo (padrão iOS/no-zoom). Desktop: tokens `--structra-field-input-*` do campo. */
+function resolveFieldControlTypographyPx(el) {
+    if (isStructraFieldMobileLayout()) {
+        return { fontSizePx: '16px', lineHeightPx: '21.6px' };
+    }
+    const fontSizeToken = nativeInputTypographyToken(el, '--structra-field-input-font-size', '1rem');
+    const lineHeightToken = nativeInputTypographyToken(el, '--structra-field-input-line-height', '1.35');
+    const fontSizePx = resolveCssLengthToPx(el, fontSizeToken, '16px');
+    const lineHeightPx = resolveLineHeightPx(fontSizePx, lineHeightToken);
+    return { fontSizePx, lineHeightPx };
+}
+function applyFieldControlTypography(el) {
+    const { fontSizePx, lineHeightPx } = resolveFieldControlTypographyPx(el);
+    el.style.setProperty('font-size', fontSizePx, 'important');
+    el.style.setProperty('line-height', lineHeightPx, 'important');
+    el.style.setProperty('font-family', 'inherit', 'important');
+    el.style.setProperty('font-weight', 'inherit', 'important');
+    el.style.setProperty('-webkit-text-size-adjust', '100%', 'important');
+}
 /**
  * Força tipografia padrão no nó nativo. O Chrome pinta autofill/preview via `::first-line` com UA
  * ~11px; só valores px literais em inline `!important` vencem o UA sem foco.
  */
 function forceNativeInputTypography(input) {
-    const fontSizeToken = nativeInputTypographyToken(input, '--structra-field-input-font-size', '1rem');
-    const lineHeightToken = nativeInputTypographyToken(input, '--structra-field-input-line-height', '1.35');
-    const fontSizePx = resolveCssLengthToPx(input, fontSizeToken, '16px');
-    const lineHeightPx = resolveLineHeightPx(fontSizePx, lineHeightToken);
-    input.style.setProperty('font-size', fontSizePx, 'important');
-    input.style.setProperty('line-height', lineHeightPx, 'important');
-    input.style.setProperty('font-family', 'inherit', 'important');
-    input.style.setProperty('font-weight', 'inherit', 'important');
-    input.style.setProperty('-webkit-text-size-adjust', '100%', 'important');
+    applyFieldControlTypography(input);
+}
+/** Combobox/multiselect: trigger `div`/`button` — mesma escala que input nativo (viewport + `size`). */
+function forceFieldControlTypography(el) {
+    applyFieldControlTypography(el);
 }
 const typographyTargets = new Set();
 let globalViewportListenersBound = false;
 let typographyViewportSyncRaf = 0;
 function syncAllNativeInputTypography() {
-    for (const input of typographyTargets) {
-        if (!input.isConnected) {
-            typographyTargets.delete(input);
+    for (const el of typographyTargets) {
+        if (!el.isConnected) {
+            typographyTargets.delete(el);
             continue;
         }
-        forceNativeInputTypography(input);
+        applyFieldControlTypography(el);
     }
 }
 /**
@@ -978,12 +997,16 @@ function ensureGlobalNativeInputTypographyViewportListeners() {
     });
     window.addEventListener('orientationchange', onGlobalViewportTypographyEvent, { passive: true });
 }
-/** Regista o `<input>`/`<textarea>` para sync global de tipografia (viewport + breakpoint mobile). */
+/** Regista controlo de campo para sync global de tipografia (viewport + breakpoint mobile). */
 function registerNativeInputTypographyTarget(input) {
-    typographyTargets.add(input);
+    return registerFieldControlTypographyTarget(input);
+}
+/** Alias semântico para triggers dropdown (`div`/`button`) e inputs nativos. */
+function registerFieldControlTypographyTarget(el) {
+    typographyTargets.add(el);
     ensureGlobalNativeInputTypographyViewportListeners();
     return () => {
-        typographyTargets.delete(input);
+        typographyTargets.delete(el);
     };
 }
 /**
@@ -1418,9 +1441,9 @@ class BaseFieldDirective {
         if (!input) {
             return;
         }
-        const unregister = registerNativeInputTypographyTarget(input);
+        const unregister = registerFieldControlTypographyTarget(input);
         this.destroyRef.onDestroy(unregister);
-        forceNativeInputTypography(input);
+        forceFieldControlTypography(input);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.2.9", type: BaseFieldDirective, isStandalone: true, inputs: { id: "id", name: "name", label: "label", placeholder: "placeholder", size: "size", tamanhoCampoMobile: ["tamanhoCampoMobile", "tamanhoCampoMobile", booleanAttribute], errorMessage: "errorMessage", hint: "hint", showErrorMessage: "showErrorMessage", invalidThemed: ["invalidThemed", "invalidThemed", booleanAttribute], required: "required", showRequiredMark: "showRequiredMark", readonly: "readonly", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", iconLeft: "iconLeft", clearable: "clearable", clearAriaLabel: "clearAriaLabel", autocomplete: ["autocomplete", "autocomplete", booleanAttribute], loading: ["loading", "loading", booleanAttribute], autofocus: ["autofocus", "autofocus", booleanAttribute], mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { contextMenuSelect: "contextMenuSelect" }, host: { properties: { "attr.required": "this.hostRequiredAttr", "attr.data-control-id": "this.hostDataControlId" } }, usesOnChanges: true, ngImport: i0 }); }
@@ -3803,11 +3826,11 @@ class BaseFieldComponent {
         this.contextMenuSelect.emit(id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: BaseFieldComponent, isStandalone: true, selector: "app-base-field", inputs: { label: "label", errorMessage: "errorMessage", hint: "hint", hintId: "hintId", required: "required", showRequiredMark: "showRequiredMark", invalid: "invalid", invalidThemed: ["invalidThemed", "invalidThemed", booleanAttribute], filled: "filled", labelAlwaysFloated: ["labelAlwaysFloated", "labelAlwaysFloated", booleanAttribute], disabled: "disabled", readonly: "readonly", size: "size", inputId: "inputId", errorId: "errorId", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", clearable: "clearable", clearAriaLabel: "clearAriaLabel", showSuffixSlot: "showSuffixSlot", valueAlignEnd: "valueAlignEnd", loading: ["loading", "loading", booleanAttribute], skeletonVariant: "skeletonVariant", mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { clear: "clear", contextMenuSelect: "contextMenuSelect" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"base-field\" [class.base-field--size-sm]=\"size === 'sm'\"\n  [class.base-field--size-lg]=\"size === 'lg'\"\n  [class.base-field--invalid]=\"invalid\"\n  [class.base-field--invalid-themed]=\"invalid && invalidThemed\" [class.base-field--filled]=\"filled\"\n  [class.base-field--label-always-top]=\"labelAlwaysFloated\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\" [class.base-field__prefix--unused]=\"loading\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl && !loading) {\n      <i [attr.class]=\"prefixIconClassTpl\" aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\"\n        [class.base-field__control--textarea-skeleton]=\"loading && skeletonVariant === 'textarea'\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"showFaTpl\" [size]=\"size\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n  @if (!loading && showHintTpl) {\n  <p class=\"base-field__hint\" [id]=\"hintId || null\">{{ hint }}</p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box;font-size:1rem;line-height:1.35}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:flex-start}.base-field--loading .base-field__control{display:block;width:100%;min-width:0;min-height:calc(1.8rem + 1.35em)}.base-field--size-sm.base-field--loading .base-field__control{min-height:2.345625rem}.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.8rem + 4.05em)}.base-field--size-sm.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.5rem + 3.75em)}.base-field--size-lg.base-field--loading .base-field__control{min-height:3.5375rem}.base-field--size-lg.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(2.1rem + 4.2em)}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);overflow:hidden;background:var(--field-background, var(--ui-field-float-bg));transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-float-border-hover);box-shadow:none}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-readonly-border-hover);box-shadow:none}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--field-background, var(--ui-field-float-bg))}.base-field--readonly.base-field--invalid:not(.base-field--disabled):not(.base-field--invalid-themed) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-readonly-bg)}.base-field--invalid.base-field--invalid-themed .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix--unused{display:none!important;padding:0!important;width:0;min-width:0;overflow:hidden}.base-field__prefix-icon{display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:1rem;line-height:1;margin:0;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon:before{line-height:1}.base-field__suffix{display:grid;grid-auto-flow:column;grid-auto-columns:auto;column-gap:.125rem;align-content:center;justify-content:end;justify-items:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem;min-height:0;align-self:stretch}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear{min-width:2rem;min-height:2rem;line-height:0}.base-field__clear-x{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;font-size:1.2rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon,.base-field--invalid .base-field__prefix-icon:before,.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;margin:0;padding:0;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .37rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:var(--field-float-label-rest-weight, var(--structra-body-weight));line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field:not(.base-field--readonly) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight))}.base-field:not(.base-field--readonly):not(.base-field--invalid) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-focus-color)}.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-readonly-label-top-color)}.base-field--filled .base-field__float-label,.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label,.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid.base-field--label-always-top .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--label-always-top .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly.base-field--label-always-top .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}.base-field__hint{margin:.28rem 0 0;padding:0 .15rem;font-size:.72rem;line-height:1.35;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--app-color-text-muted, var(--ui-field-float-prefix-color, #5c6b7a));user-select:none;-webkit-user-select:none}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1rem)!important;line-height:var(--structra-field-input-line-height, 1.35)!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}@supports (-webkit-appearance: none){.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;transition:background-color 50000s ease 0s!important}}.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;background-color:var(--ui-field-invalid-input-bg, #fef2f2)!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;background-color:var(--ui-field-readonly-bg)!important;transition:background-color 50000s ease 0s!important}.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important}.base-field--size-sm .base-field__prefix{padding-left:.45rem}.base-field--size-sm .base-field__prefix-icon{font-size:.8125rem}.base-field--size-sm .base-field__suffix{padding-right:.28rem;padding-left:.06rem;column-gap:.05rem}.base-field--size-sm .base-field__float-label{left:.45rem;right:.45rem;top:.28rem;font-size:.8125rem;line-height:1.2;transform:translate3d(0,.5059375rem,0) scale(1)}.base-field--size-sm .base-field__box:focus-within .base-field__float-label,.base-field--size-sm.base-field--filled .base-field__float-label,.base-field--size-sm.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:13px!important;line-height:16.25px!important}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, .8125rem)!important;line-height:var(--structra-field-input-line-height, 1.25)!important}.base-field--size-sm .base-field__clear,.base-field--size-sm .base-field__ctx-trigger{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem}.base-field--size-sm .base-field__clear-x{font-size:1.05rem;width:1.1rem;height:1.1rem}.base-field--size-sm .base-field__suffix-reserve{width:1.65rem;height:1.65rem}.base-field--size-sm .base-field__control ::ng-deep .text-field__input,.base-field--size-sm .base-field__control ::ng-deep .integer-field__input,.base-field--size-sm .base-field__control ::ng-deep .decimal-field__input,.base-field--size-sm .base-field__control ::ng-deep .password-field__input,.base-field--size-sm .base-field__control ::ng-deep .cep-field__input,.base-field--size-sm .base-field__control ::ng-deep .phone-field__input,.base-field--size-sm .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-sm .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-sm .base-field__control ::ng-deep .textarea-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input,.base-field--size-sm .base-field__control ::ng-deep .color-picker-field__input{padding:1.05rem .45rem .28rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:2.345625rem!important}.base-field--size-sm .base-field__control ::ng-deep .date-field__display{left:.45rem;right:.45rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .select-field__origin,.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{min-height:2.345625rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.05rem .28rem .28rem .45rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.05rem .45rem .28rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem;margin:0 .06rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.72rem;padding-top:1px}.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__trigger-suffix{padding-top:2px}.base-field--size-lg .base-field__prefix{padding-left:.95rem}.base-field--size-lg .base-field__prefix-icon{font-size:1.0625rem}.base-field--size-lg .base-field__suffix{padding-right:.52rem;padding-left:.12rem;column-gap:.15rem}.base-field--size-lg .base-field__float-label{left:.9rem;right:.9rem;top:.48rem;font-size:1.0625rem;line-height:1.2;transform:translate3d(0,.6846875rem,0) scale(1)}.base-field--size-lg .base-field__box:focus-within .base-field__float-label,.base-field--size-lg.base-field--filled .base-field__float-label,.base-field--size-lg.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:17px!important;line-height:23.8px!important}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1.0625rem)!important;line-height:var(--structra-field-input-line-height, 1.4)!important}.base-field--size-lg .base-field__clear,.base-field--size-lg .base-field__ctx-trigger{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem}.base-field--size-lg .base-field__clear-x{font-size:1.35rem;width:1.35rem;height:1.35rem}.base-field--size-lg .base-field__suffix-reserve{width:2.35rem;height:2.35rem}.base-field--size-lg .base-field__control ::ng-deep .text-field__input,.base-field--size-lg .base-field__control ::ng-deep .integer-field__input,.base-field--size-lg .base-field__control ::ng-deep .decimal-field__input,.base-field--size-lg .base-field__control ::ng-deep .password-field__input,.base-field--size-lg .base-field__control ::ng-deep .cep-field__input,.base-field--size-lg .base-field__control ::ng-deep .phone-field__input,.base-field--size-lg .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-lg .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-lg .base-field__control ::ng-deep .textarea-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input,.base-field--size-lg .base-field__control ::ng-deep .color-picker-field__input{padding:1.55rem .9rem .5rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:3.5375rem!important}.base-field--size-lg .base-field__control ::ng-deep .date-field__display{left:.9rem;right:.9rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .select-field__origin,.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{min-height:3.5375rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.55rem .38rem .5rem .9rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.55rem .9rem .5rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem;margin:0 .12rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.88rem}@media(max-width:768px),(hover:none)and (pointer:coarse){.base-field__control ::ng-deep :where(input,textarea,select){--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep .text-field__input,.base-field__control ::ng-deep .integer-field__input,.base-field__control ::ng-deep .decimal-field__input,.base-field__control ::ng-deep .password-field__input,.base-field__control ::ng-deep .cep-field__input,.base-field__control ::ng-deep .phone-field__input,.base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field__control ::ng-deep .input-mask-field__input,.base-field__control ::ng-deep .textarea-field__input,.base-field__control ::ng-deep .date-field__input,.base-field__control ::ng-deep .color-picker-field__input,.base-field__control ::ng-deep .dropdown-search-field__input{--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important}}\n"], dependencies: [{ kind: "component", type: SkeletonFieldShellComponent, selector: "app-skeleton-field-shell", inputs: ["variant", "animate", "size", "showLeadingIcon"] }, { kind: "component", type: DropdownMenuComponent, selector: "app-dropdown-menu", inputs: ["items", "placement", "minWidthPx", "matchTriggerWidth", "closeOnSelect", "menuId"], outputs: ["itemSelect", "openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.9", type: BaseFieldComponent, isStandalone: true, selector: "app-base-field", inputs: { label: "label", errorMessage: "errorMessage", hint: "hint", hintId: "hintId", required: "required", showRequiredMark: "showRequiredMark", invalid: "invalid", invalidThemed: ["invalidThemed", "invalidThemed", booleanAttribute], filled: "filled", labelAlwaysFloated: ["labelAlwaysFloated", "labelAlwaysFloated", booleanAttribute], disabled: "disabled", readonly: "readonly", size: "size", inputId: "inputId", errorId: "errorId", showPrefixIcon: "showPrefixIcon", prefixIcon: "prefixIcon", clearable: "clearable", clearAriaLabel: "clearAriaLabel", showSuffixSlot: "showSuffixSlot", valueAlignEnd: "valueAlignEnd", loading: ["loading", "loading", booleanAttribute], skeletonVariant: "skeletonVariant", mostrarMenuContexto: ["mostrarMenuContexto", "mostrarMenuContexto", booleanAttribute], contextMenuItems: "contextMenuItems", contextMenuId: "contextMenuId" }, outputs: { clear: "clear", contextMenuSelect: "contextMenuSelect" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"base-field\" [class.base-field--size-sm]=\"size === 'sm'\"\n  [class.base-field--size-lg]=\"size === 'lg'\"\n  [class.base-field--invalid]=\"invalid\"\n  [class.base-field--invalid-themed]=\"invalid && invalidThemed\" [class.base-field--filled]=\"filled\"\n  [class.base-field--label-always-top]=\"labelAlwaysFloated\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\" [class.base-field__prefix--unused]=\"loading\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl && !loading) {\n      <i [attr.class]=\"prefixIconClassTpl\" aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\"\n        [class.base-field__control--textarea-skeleton]=\"loading && skeletonVariant === 'textarea'\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"showFaTpl\" [size]=\"size\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n  @if (!loading && showHintTpl) {\n  <p class=\"base-field__hint\" [id]=\"hintId || null\">{{ hint }}</p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box;font-size:1rem;line-height:1.35}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:flex-start}.base-field--loading .base-field__control{display:block;width:100%;min-width:0;min-height:calc(1.8rem + 1.35em)}.base-field--size-sm.base-field--loading .base-field__control{min-height:2.345625rem}.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.8rem + 4.05em)}.base-field--size-sm.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.5rem + 3.75em)}.base-field--size-lg.base-field--loading .base-field__control{min-height:3.5375rem}.base-field--size-lg.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(2.1rem + 4.2em)}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);overflow:hidden;background:var(--field-background, var(--ui-field-float-bg));transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-float-border-hover);box-shadow:none}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-readonly-border-hover);box-shadow:none}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--field-background, var(--ui-field-float-bg))}.base-field--readonly.base-field--invalid:not(.base-field--disabled):not(.base-field--invalid-themed) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-readonly-bg)}.base-field--invalid.base-field--invalid-themed .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix--unused{display:none!important;padding:0!important;width:0;min-width:0;overflow:hidden}.base-field__prefix-icon{display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:1rem;line-height:1;margin:0;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon:before{line-height:1}.base-field__suffix{display:grid;grid-auto-flow:column;grid-auto-columns:auto;column-gap:.125rem;align-content:center;justify-content:end;justify-items:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem;min-height:0;align-self:stretch}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear{min-width:2rem;min-height:2rem;line-height:0}.base-field__clear-x{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;font-size:1.2rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon,.base-field--invalid .base-field__prefix-icon:before,.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;margin:0;padding:0;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .37rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:var(--field-float-label-rest-weight, var(--structra-body-weight));line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field:not(.base-field--readonly) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight))}.base-field:not(.base-field--readonly):not(.base-field--invalid) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-focus-color)}.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-readonly-label-top-color)}.base-field--filled .base-field__float-label,.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label,.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid.base-field--label-always-top .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--label-always-top .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly.base-field--label-always-top .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}.base-field__hint{margin:.28rem 0 0;padding:0 .15rem;font-size:.72rem;line-height:1.35;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--app-color-text-muted, var(--ui-field-float-prefix-color, #5c6b7a));user-select:none;-webkit-user-select:none}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1rem)!important;line-height:var(--structra-field-input-line-height, 1.35)!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}@supports (-webkit-appearance: none){.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;transition:background-color 50000s ease 0s!important}}.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;background-color:var(--ui-field-invalid-input-bg, #fef2f2)!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;background-color:var(--ui-field-readonly-bg)!important;transition:background-color 50000s ease 0s!important}.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important}.base-field--size-sm .base-field__prefix{padding-left:.45rem}.base-field--size-sm .base-field__prefix-icon{font-size:.8125rem}.base-field--size-sm .base-field__suffix{padding-right:.28rem;padding-left:.06rem;column-gap:.05rem}.base-field--size-sm .base-field__float-label{left:.45rem;right:.45rem;top:.28rem;font-size:.8125rem;line-height:1.2;transform:translate3d(0,.5059375rem,0) scale(1)}.base-field--size-sm .base-field__box:focus-within .base-field__float-label,.base-field--size-sm.base-field--filled .base-field__float-label,.base-field--size-sm.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:13px!important;line-height:16.25px!important}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, .8125rem)!important;line-height:var(--structra-field-input-line-height, 1.25)!important}.base-field--size-sm .base-field__clear,.base-field--size-sm .base-field__ctx-trigger{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem}.base-field--size-sm .base-field__clear-x{font-size:1.05rem;width:1.1rem;height:1.1rem}.base-field--size-sm .base-field__suffix-reserve{width:1.65rem;height:1.65rem}.base-field--size-sm .base-field__control ::ng-deep .text-field__input,.base-field--size-sm .base-field__control ::ng-deep .integer-field__input,.base-field--size-sm .base-field__control ::ng-deep .decimal-field__input,.base-field--size-sm .base-field__control ::ng-deep .password-field__input,.base-field--size-sm .base-field__control ::ng-deep .cep-field__input,.base-field--size-sm .base-field__control ::ng-deep .phone-field__input,.base-field--size-sm .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-sm .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-sm .base-field__control ::ng-deep .textarea-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input,.base-field--size-sm .base-field__control ::ng-deep .color-picker-field__input{padding:1.05rem .45rem .28rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:2.345625rem!important}.base-field--size-sm .base-field__control ::ng-deep .date-field__display{left:.45rem;right:.45rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .select-field__origin,.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{min-height:2.345625rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.05rem .28rem .28rem .45rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.05rem .45rem .28rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem;margin:0 .06rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.72rem;padding-top:1px}.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__trigger-suffix{padding-top:2px}.base-field--size-lg .base-field__prefix{padding-left:.95rem}.base-field--size-lg .base-field__prefix-icon{font-size:1.0625rem}.base-field--size-lg .base-field__suffix{padding-right:.52rem;padding-left:.12rem;column-gap:.15rem}.base-field--size-lg .base-field__float-label{left:.9rem;right:.9rem;top:.48rem;font-size:1.0625rem;line-height:1.2;transform:translate3d(0,.6846875rem,0) scale(1)}.base-field--size-lg .base-field__box:focus-within .base-field__float-label,.base-field--size-lg.base-field--filled .base-field__float-label,.base-field--size-lg.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:17px!important;line-height:23.8px!important}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1.0625rem)!important;line-height:var(--structra-field-input-line-height, 1.4)!important}.base-field--size-lg .base-field__clear,.base-field--size-lg .base-field__ctx-trigger{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem}.base-field--size-lg .base-field__clear-x{font-size:1.35rem;width:1.35rem;height:1.35rem}.base-field--size-lg .base-field__suffix-reserve{width:2.35rem;height:2.35rem}.base-field--size-lg .base-field__control ::ng-deep .text-field__input,.base-field--size-lg .base-field__control ::ng-deep .integer-field__input,.base-field--size-lg .base-field__control ::ng-deep .decimal-field__input,.base-field--size-lg .base-field__control ::ng-deep .password-field__input,.base-field--size-lg .base-field__control ::ng-deep .cep-field__input,.base-field--size-lg .base-field__control ::ng-deep .phone-field__input,.base-field--size-lg .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-lg .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-lg .base-field__control ::ng-deep .textarea-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input,.base-field--size-lg .base-field__control ::ng-deep .color-picker-field__input{padding:1.55rem .9rem .5rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:3.5375rem!important}.base-field--size-lg .base-field__control ::ng-deep .date-field__display{left:.9rem;right:.9rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .select-field__origin,.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{min-height:3.5375rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.55rem .38rem .5rem .9rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.55rem .9rem .5rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem;margin:0 .12rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.88rem}@media(max-width:768px),(hover:none)and (pointer:coarse){.base-field__control ::ng-deep :where(input,textarea,select){--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep .text-field__input,.base-field__control ::ng-deep .integer-field__input,.base-field__control ::ng-deep .decimal-field__input,.base-field__control ::ng-deep .password-field__input,.base-field__control ::ng-deep .cep-field__input,.base-field__control ::ng-deep .phone-field__input,.base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field__control ::ng-deep .input-mask-field__input,.base-field__control ::ng-deep .textarea-field__input,.base-field__control ::ng-deep .date-field__input,.base-field__control ::ng-deep .color-picker-field__input,.base-field__control ::ng-deep .dropdown-search-field__input,.base-field__control ::ng-deep .select-field__value-btn,.base-field__control ::ng-deep .multiselect-field__value-btn{--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important}}\n"], dependencies: [{ kind: "component", type: SkeletonFieldShellComponent, selector: "app-skeleton-field-shell", inputs: ["variant", "animate", "size", "showLeadingIcon"] }, { kind: "component", type: DropdownMenuComponent, selector: "app-dropdown-menu", inputs: ["items", "placement", "minWidthPx", "matchTriggerWidth", "closeOnSelect", "menuId"], outputs: ["itemSelect", "openChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: BaseFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-base-field', imports: [SkeletonFieldShellComponent, DropdownMenuComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"base-field\" [class.base-field--size-sm]=\"size === 'sm'\"\n  [class.base-field--size-lg]=\"size === 'lg'\"\n  [class.base-field--invalid]=\"invalid\"\n  [class.base-field--invalid-themed]=\"invalid && invalidThemed\" [class.base-field--filled]=\"filled\"\n  [class.base-field--label-always-top]=\"labelAlwaysFloated\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\" [class.base-field__prefix--unused]=\"loading\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl && !loading) {\n      <i [attr.class]=\"prefixIconClassTpl\" aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\"\n        [class.base-field__control--textarea-skeleton]=\"loading && skeletonVariant === 'textarea'\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"showFaTpl\" [size]=\"size\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n  @if (!loading && showHintTpl) {\n  <p class=\"base-field__hint\" [id]=\"hintId || null\">{{ hint }}</p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box;font-size:1rem;line-height:1.35}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:flex-start}.base-field--loading .base-field__control{display:block;width:100%;min-width:0;min-height:calc(1.8rem + 1.35em)}.base-field--size-sm.base-field--loading .base-field__control{min-height:2.345625rem}.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.8rem + 4.05em)}.base-field--size-sm.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.5rem + 3.75em)}.base-field--size-lg.base-field--loading .base-field__control{min-height:3.5375rem}.base-field--size-lg.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(2.1rem + 4.2em)}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);overflow:hidden;background:var(--field-background, var(--ui-field-float-bg));transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-float-border-hover);box-shadow:none}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-readonly-border-hover);box-shadow:none}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--field-background, var(--ui-field-float-bg))}.base-field--readonly.base-field--invalid:not(.base-field--disabled):not(.base-field--invalid-themed) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-readonly-bg)}.base-field--invalid.base-field--invalid-themed .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix--unused{display:none!important;padding:0!important;width:0;min-width:0;overflow:hidden}.base-field__prefix-icon{display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:1rem;line-height:1;margin:0;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon:before{line-height:1}.base-field__suffix{display:grid;grid-auto-flow:column;grid-auto-columns:auto;column-gap:.125rem;align-content:center;justify-content:end;justify-items:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem;min-height:0;align-self:stretch}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear{min-width:2rem;min-height:2rem;line-height:0}.base-field__clear-x{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;font-size:1.2rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon,.base-field--invalid .base-field__prefix-icon:before,.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;margin:0;padding:0;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .37rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:var(--field-float-label-rest-weight, var(--structra-body-weight));line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field:not(.base-field--readonly) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight))}.base-field:not(.base-field--readonly):not(.base-field--invalid) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-focus-color)}.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-readonly-label-top-color)}.base-field--filled .base-field__float-label,.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label,.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid.base-field--label-always-top .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--label-always-top .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly.base-field--label-always-top .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}.base-field__hint{margin:.28rem 0 0;padding:0 .15rem;font-size:.72rem;line-height:1.35;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--app-color-text-muted, var(--ui-field-float-prefix-color, #5c6b7a));user-select:none;-webkit-user-select:none}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1rem)!important;line-height:var(--structra-field-input-line-height, 1.35)!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}@supports (-webkit-appearance: none){.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;transition:background-color 50000s ease 0s!important}}.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;background-color:var(--ui-field-invalid-input-bg, #fef2f2)!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;background-color:var(--ui-field-readonly-bg)!important;transition:background-color 50000s ease 0s!important}.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important}.base-field--size-sm .base-field__prefix{padding-left:.45rem}.base-field--size-sm .base-field__prefix-icon{font-size:.8125rem}.base-field--size-sm .base-field__suffix{padding-right:.28rem;padding-left:.06rem;column-gap:.05rem}.base-field--size-sm .base-field__float-label{left:.45rem;right:.45rem;top:.28rem;font-size:.8125rem;line-height:1.2;transform:translate3d(0,.5059375rem,0) scale(1)}.base-field--size-sm .base-field__box:focus-within .base-field__float-label,.base-field--size-sm.base-field--filled .base-field__float-label,.base-field--size-sm.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:13px!important;line-height:16.25px!important}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, .8125rem)!important;line-height:var(--structra-field-input-line-height, 1.25)!important}.base-field--size-sm .base-field__clear,.base-field--size-sm .base-field__ctx-trigger{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem}.base-field--size-sm .base-field__clear-x{font-size:1.05rem;width:1.1rem;height:1.1rem}.base-field--size-sm .base-field__suffix-reserve{width:1.65rem;height:1.65rem}.base-field--size-sm .base-field__control ::ng-deep .text-field__input,.base-field--size-sm .base-field__control ::ng-deep .integer-field__input,.base-field--size-sm .base-field__control ::ng-deep .decimal-field__input,.base-field--size-sm .base-field__control ::ng-deep .password-field__input,.base-field--size-sm .base-field__control ::ng-deep .cep-field__input,.base-field--size-sm .base-field__control ::ng-deep .phone-field__input,.base-field--size-sm .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-sm .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-sm .base-field__control ::ng-deep .textarea-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input,.base-field--size-sm .base-field__control ::ng-deep .color-picker-field__input{padding:1.05rem .45rem .28rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:2.345625rem!important}.base-field--size-sm .base-field__control ::ng-deep .date-field__display{left:.45rem;right:.45rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .select-field__origin,.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{min-height:2.345625rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.05rem .28rem .28rem .45rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.05rem .45rem .28rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem;margin:0 .06rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.72rem;padding-top:1px}.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__trigger-suffix{padding-top:2px}.base-field--size-lg .base-field__prefix{padding-left:.95rem}.base-field--size-lg .base-field__prefix-icon{font-size:1.0625rem}.base-field--size-lg .base-field__suffix{padding-right:.52rem;padding-left:.12rem;column-gap:.15rem}.base-field--size-lg .base-field__float-label{left:.9rem;right:.9rem;top:.48rem;font-size:1.0625rem;line-height:1.2;transform:translate3d(0,.6846875rem,0) scale(1)}.base-field--size-lg .base-field__box:focus-within .base-field__float-label,.base-field--size-lg.base-field--filled .base-field__float-label,.base-field--size-lg.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:17px!important;line-height:23.8px!important}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1.0625rem)!important;line-height:var(--structra-field-input-line-height, 1.4)!important}.base-field--size-lg .base-field__clear,.base-field--size-lg .base-field__ctx-trigger{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem}.base-field--size-lg .base-field__clear-x{font-size:1.35rem;width:1.35rem;height:1.35rem}.base-field--size-lg .base-field__suffix-reserve{width:2.35rem;height:2.35rem}.base-field--size-lg .base-field__control ::ng-deep .text-field__input,.base-field--size-lg .base-field__control ::ng-deep .integer-field__input,.base-field--size-lg .base-field__control ::ng-deep .decimal-field__input,.base-field--size-lg .base-field__control ::ng-deep .password-field__input,.base-field--size-lg .base-field__control ::ng-deep .cep-field__input,.base-field--size-lg .base-field__control ::ng-deep .phone-field__input,.base-field--size-lg .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-lg .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-lg .base-field__control ::ng-deep .textarea-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input,.base-field--size-lg .base-field__control ::ng-deep .color-picker-field__input{padding:1.55rem .9rem .5rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:3.5375rem!important}.base-field--size-lg .base-field__control ::ng-deep .date-field__display{left:.9rem;right:.9rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .select-field__origin,.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{min-height:3.5375rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.55rem .38rem .5rem .9rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.55rem .9rem .5rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem;margin:0 .12rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.88rem}@media(max-width:768px),(hover:none)and (pointer:coarse){.base-field__control ::ng-deep :where(input,textarea,select){--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep .text-field__input,.base-field__control ::ng-deep .integer-field__input,.base-field__control ::ng-deep .decimal-field__input,.base-field__control ::ng-deep .password-field__input,.base-field__control ::ng-deep .cep-field__input,.base-field__control ::ng-deep .phone-field__input,.base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field__control ::ng-deep .input-mask-field__input,.base-field__control ::ng-deep .textarea-field__input,.base-field__control ::ng-deep .date-field__input,.base-field__control ::ng-deep .color-picker-field__input,.base-field__control ::ng-deep .dropdown-search-field__input{--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important}}\n"] }]
+            args: [{ selector: 'app-base-field', imports: [SkeletonFieldShellComponent, DropdownMenuComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"base-field\" [class.base-field--size-sm]=\"size === 'sm'\"\n  [class.base-field--size-lg]=\"size === 'lg'\"\n  [class.base-field--invalid]=\"invalid\"\n  [class.base-field--invalid-themed]=\"invalid && invalidThemed\" [class.base-field--filled]=\"filled\"\n  [class.base-field--label-always-top]=\"labelAlwaysFloated\"\n  [class.base-field--disabled]=\"disabled\" [class.base-field--readonly]=\"readonly\"\n  [class.base-field--loading]=\"loading\" [attr.aria-busy]=\"loading ? true : null\"\n  [attr.aria-label]=\"loading && showFloatTpl ? label : null\">\n  <div class=\"base-field__box\">\n    <div class=\"base-field__prefix\" [class.base-field__prefix--unused]=\"loading\">\n      @if (!loading) {\n      <ng-content select=\"[appFieldPrefix]\" />\n      }\n      @if (showFaTpl && !loading) {\n      <i [attr.class]=\"prefixIconClassTpl\" aria-hidden=\"true\"></i>\n      }\n    </div>\n\n    <div class=\"base-field__field\">\n      @if (showFloatTpl && !loading) {\n      <label class=\"base-field__float-label\" [attr.for]=\"inputId || null\">\n        {{ label }}\n        @if (required && showRequiredMark) {\n        <span class=\"base-field__required\" aria-hidden=\"true\">*</span>\n        }\n      </label>\n      }\n\n      <div class=\"base-field__control\" [class.base-field__control--value-end]=\"valueAlignEnd\"\n        [class.base-field__control--textarea-skeleton]=\"loading && skeletonVariant === 'textarea'\">\n        @if (!loading) {\n        <ng-content />\n        } @else {\n        <app-skeleton-field-shell [variant]=\"skeletonVariant\" [showLeadingIcon]=\"showFaTpl\" [size]=\"size\" />\n        }\n      </div>\n    </div>\n\n    @if (showSuffixTpl) {\n    <div class=\"base-field__suffix\" [class.base-field__suffix--loading]=\"loading\">\n      @if (!loading) {\n      @if (showCtxMenuTpl) {\n      <app-dropdown-menu\n        class=\"base-field__ctx-dropdown\"\n        [items]=\"contextMenuItems\"\n        [minWidthPx]=\"200\"\n        [matchTriggerWidth]=\"false\"\n        [menuId]=\"resolvedContextMenuId\"\n        (itemSelect)=\"onContextMenuItemSelect($event)\"\n      >\n        <button type=\"button\" class=\"base-field__ctx-trigger\" aria-label=\"Mais op\u00E7\u00F5es\" tabindex=\"-1\">\n          <i class=\"fa-solid fa-ellipsis\" aria-hidden=\"true\"></i>\n        </button>\n      </app-dropdown-menu>\n      }\n      @if (showSuffixSlot) {\n      <ng-content select=\"[appFieldSuffix]\" />\n      }\n      @if (showClearTpl) {\n      <button type=\"button\" class=\"base-field__clear\" tabindex=\"-1\" [attr.aria-label]=\"clearAriaLabel\"\n        (click)=\"onClearClick()\">\n        <span class=\"base-field__clear-x\" aria-hidden=\"true\">&times;</span>\n      </button>\n      }\n      } @else if (loading && showSuffixSlot) {\n      <span class=\"base-field__suffix-reserve\" aria-hidden=\"true\"></span>\n      }\n    </div>\n    }\n  </div>\n\n  @if (!loading && showErrorTpl) {\n  <p class=\"base-field__error\" [id]=\"errorId || null\" role=\"alert\">\n    {{ errorMessage }}\n  </p>\n  }\n  @if (!loading && showHintTpl) {\n  <p class=\"base-field__hint\" [id]=\"hintId || null\">{{ hint }}</p>\n  }\n</div>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}.base-field{display:flex;flex-direction:column;gap:.35rem;width:100%;max-width:100%;box-sizing:border-box;font-size:1rem;line-height:1.35}.base-field--loading .base-field__box{pointer-events:none}.base-field--loading .base-field__field{justify-content:flex-start}.base-field--loading .base-field__control{display:block;width:100%;min-width:0;min-height:calc(1.8rem + 1.35em)}.base-field--size-sm.base-field--loading .base-field__control{min-height:2.345625rem}.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.8rem + 4.05em)}.base-field--size-sm.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(1.5rem + 3.75em)}.base-field--size-lg.base-field--loading .base-field__control{min-height:3.5375rem}.base-field--size-lg.base-field--loading .base-field__control--textarea-skeleton{min-height:calc(2.1rem + 4.2em)}.base-field__box{display:flex;align-items:stretch;width:100%;min-width:0;border:1px solid var(--ui-field-float-border);border-radius:var(--ui-field-float-border-radius);overflow:hidden;background:var(--field-background, var(--ui-field-float-bg));transition:border-color .1s ease,box-shadow .1s ease;contain:layout}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-float-border-hover);box-shadow:none}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid):not(:focus-within):hover .base-field__box{border-color:var(--ui-field-readonly-border-hover);box-shadow:none}.base-field:not(.base-field--invalid):not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}.base-field--readonly:not(.base-field--disabled) .base-field__box{background:var(--ui-field-readonly-bg);border-color:var(--ui-field-readonly-border)}.base-field--readonly:not(.base-field--disabled):not(.base-field--invalid) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--field-background, var(--ui-field-float-bg))}.base-field--readonly.base-field--invalid:not(.base-field--disabled):not(.base-field--invalid-themed) .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-readonly-bg)}.base-field--invalid.base-field--invalid-themed .base-field__box{border-color:var(--ui-field-input-invalid-border);box-shadow:none;background:var(--ui-field-invalid-input-bg, #fef2f2)}.base-field--invalid:not(.base-field--disabled):not(.base-field--readonly) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.base-field--disabled .base-field__box{opacity:var(--ui-field-input-disabled-opacity)}.base-field__prefix{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-left:.75rem;color:var(--ui-field-float-prefix-color);user-select:none;-webkit-user-select:none}.base-field__prefix:empty{display:none}.base-field__prefix--unused{display:none!important;padding:0!important;width:0;min-width:0;overflow:hidden}.base-field__prefix-icon{display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:1rem;line-height:1;margin:0;color:var(--ui-field-float-prefix-color)}.base-field__prefix-icon:before{line-height:1}.base-field__suffix{display:grid;grid-auto-flow:column;grid-auto-columns:auto;column-gap:.125rem;align-content:center;justify-content:end;justify-items:center;flex-shrink:0;padding-right:.4rem;padding-left:.1rem;min-height:0;align-self:stretch}.base-field__ctx-dropdown{display:inline-flex;flex-shrink:0;align-items:center;max-width:100%}.base-field__ctx-trigger{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__ctx-trigger:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__ctx-trigger:focus,.base-field__ctx-trigger:focus-visible{outline:none}.base-field__clear{display:inline-grid;place-items:center;width:2rem;height:2rem;margin:0;padding:0;border:none;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.base-field__clear:hover{background:var(--app-color-prefix-hover-bg, rgba(90, 127, 163, .15));color:var(--ui-field-float-label-focus-color)}.base-field__clear:focus,.base-field__clear:focus-visible{outline:none}.base-field__clear{min-width:2rem;min-height:2rem;line-height:0}.base-field__clear-x{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;font-size:1.2rem;line-height:1;font-weight:300}.base-field--invalid .base-field__prefix,.base-field--invalid .base-field__prefix-icon,.base-field--invalid .base-field__prefix-icon:before,.base-field--invalid .base-field__suffix,.base-field--invalid .base-field__clear,.base-field--invalid .base-field__ctx-trigger{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__clear:hover,.base-field--invalid .base-field__ctx-trigger:hover{background:var(--app-color-error-bg-subtle, rgba(185, 28, 28, .12));color:var(--ui-field-float-label-invalid-color)}.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-float-label-invalid-color)}.base-field__field{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:flex-start;contain:layout style}.base-field__float-label{position:absolute;left:.75rem;right:.75rem;top:.45rem;margin:0;padding:0;transform:translate3d(0,calc((1.8rem + 1.35em)/2 - .37rem - .6em),0) scale(1);transform-origin:left top;font-size:1rem;font-weight:var(--field-float-label-rest-weight, var(--structra-body-weight));line-height:1.2;color:var(--ui-field-float-label-color);pointer-events:none;user-select:none;-webkit-user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:transform .11s cubic-bezier(.4,0,.2,1),color .11s ease}@media(prefers-reduced-motion:reduce){.base-field__float-label{transition:none}}.base-field:not(.base-field--readonly) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight))}.base-field:not(.base-field--readonly):not(.base-field--invalid) .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-focus-color)}.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-readonly-label-top-color)}.base-field--filled .base-field__float-label,.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75);font-weight:var(--field-label-weight, var(--structra-label-weight));color:var(--ui-field-float-label-top-color)}.base-field--invalid .base-field__float-label,.base-field--invalid.base-field--filled .base-field__float-label,.base-field--invalid.base-field--label-always-top .base-field__float-label,.base-field--invalid .base-field__box:focus-within .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--filled .base-field__float-label,.base-field--invalid.base-field--readonly.base-field--label-always-top .base-field__float-label,.base-field--invalid.base-field--readonly .base-field__box:focus-within .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--invalid .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{color:var(--ui-field-float-label-invalid-color)}.base-field__required{color:var(--ui-field-required-mark-color);margin-left:.15rem}.base-field--invalid .base-field__required{color:var(--ui-field-float-label-invalid-color)}.base-field__control{display:block;width:100%;min-width:0}.base-field__suffix-reserve{display:block;flex-shrink:0;width:2rem;height:2rem;margin:0 .1rem;box-sizing:border-box}.base-field__control--value-end :where(input){text-align:right}.base-field--readonly:not(.base-field--disabled) .base-field__float-label{color:var(--ui-field-readonly-label-color)}.base-field--readonly.base-field--filled .base-field__float-label,.base-field--readonly.base-field--label-always-top .base-field__float-label{color:var(--ui-field-readonly-label-top-color)}.base-field--readonly:not(.base-field--disabled) .base-field__prefix,.base-field--readonly:not(.base-field--disabled) .base-field__prefix-icon{color:var(--ui-field-readonly-prefix-color)}.base-field--readonly:not(.base-field--disabled) .base-field__control :where(input,textarea){color:var(--ui-field-readonly-input-text)}.base-field__error{margin:0;padding-left:.15rem;font-size:.75rem;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--ui-field-error-text-color);user-select:none;-webkit-user-select:none}.base-field__hint{margin:.28rem 0 0;padding:0 .15rem;font-size:.72rem;line-height:1.35;font-weight:var(--field-helper-weight, var(--structra-body-weight));color:var(--app-color-text-muted, var(--ui-field-float-prefix-color, #5c6b7a));user-select:none;-webkit-user-select:none}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1rem)!important;line-height:var(--structra-field-input-line-height, 1.35)!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}@supports (-webkit-appearance: none){.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:-webkit-autofill,:-webkit-autofill:hover,:-webkit-autofill:focus,:-webkit-autofill:active,:-webkit-autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;transition:background-color 50000s ease 0s!important}}.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid:not(.base-field--invalid-themed):not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;box-shadow:0 0 0 1000px var(--field-background, var(--ui-field-float-bg)) inset!important;background-color:var(--field-background, var(--ui-field-float-bg))!important;transition:background-color 50000s ease 0s!important}.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--invalid.base-field--invalid-themed:not(.base-field--readonly) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;box-shadow:0 0 0 1000px var(--ui-field-invalid-input-bg, #fef2f2) inset!important;background-color:var(--ui-field-invalid-input-bg, #fef2f2)!important;transition:background-color 50000s ease 0s!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible),.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):is(:autofill,:autofill:hover,:autofill:focus,:autofill:active,:autofill:focus-visible):first-line{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important;caret-color:var(--ui-field-readonly-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-readonly-bg) inset!important;background-color:var(--ui-field-readonly-bg)!important;transition:background-color 50000s ease 0s!important}.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--readonly:not(.base-field--disabled) .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-readonly-input-text)!important}.base-field--size-sm .base-field__prefix{padding-left:.45rem}.base-field--size-sm .base-field__prefix-icon{font-size:.8125rem}.base-field--size-sm .base-field__suffix{padding-right:.28rem;padding-left:.06rem;column-gap:.05rem}.base-field--size-sm .base-field__float-label{left:.45rem;right:.45rem;top:.28rem;font-size:.8125rem;line-height:1.2;transform:translate3d(0,.5059375rem,0) scale(1)}.base-field--size-sm .base-field__box:focus-within .base-field__float-label,.base-field--size-sm.base-field--filled .base-field__float-label,.base-field--size-sm.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-sm .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:13px!important;line-height:16.25px!important}.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-sm .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, .8125rem)!important;line-height:var(--structra-field-input-line-height, 1.25)!important}.base-field--size-sm .base-field__clear,.base-field--size-sm .base-field__ctx-trigger{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem}.base-field--size-sm .base-field__clear-x{font-size:1.05rem;width:1.1rem;height:1.1rem}.base-field--size-sm .base-field__suffix-reserve{width:1.65rem;height:1.65rem}.base-field--size-sm .base-field__control ::ng-deep .text-field__input,.base-field--size-sm .base-field__control ::ng-deep .integer-field__input,.base-field--size-sm .base-field__control ::ng-deep .decimal-field__input,.base-field--size-sm .base-field__control ::ng-deep .password-field__input,.base-field--size-sm .base-field__control ::ng-deep .cep-field__input,.base-field--size-sm .base-field__control ::ng-deep .phone-field__input,.base-field--size-sm .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-sm .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-sm .base-field__control ::ng-deep .textarea-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input,.base-field--size-sm .base-field__control ::ng-deep .color-picker-field__input{padding:1.05rem .45rem .28rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-sm .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:2.345625rem!important}.base-field--size-sm .base-field__control ::ng-deep .date-field__display{left:.45rem;right:.45rem;font-size:.8125rem;line-height:1.25}.base-field--size-sm .base-field__control ::ng-deep .select-field__origin,.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{min-height:2.345625rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.05rem .28rem .28rem .45rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.05rem .45rem .28rem;--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:1.65rem;height:1.65rem;min-width:1.65rem;min-height:1.65rem;margin:0 .06rem}.base-field--size-sm .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-sm .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.72rem;padding-top:1px}.base-field--size-sm .base-field__control ::ng-deep .multiselect-field__trigger-suffix{padding-top:2px}.base-field--size-lg .base-field__prefix{padding-left:.95rem}.base-field--size-lg .base-field__prefix-icon{font-size:1.0625rem}.base-field--size-lg .base-field__suffix{padding-right:.52rem;padding-left:.12rem;column-gap:.15rem}.base-field--size-lg .base-field__float-label{left:.9rem;right:.9rem;top:.48rem;font-size:1.0625rem;line-height:1.2;transform:translate3d(0,.6846875rem,0) scale(1)}.base-field--size-lg .base-field__box:focus-within .base-field__float-label,.base-field--size-lg.base-field--filled .base-field__float-label,.base-field--size-lg.base-field--label-always-top .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):-webkit-autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):autofill) .base-field__float-label,.base-field--size-lg .base-field__box:has(.base-field__control :where(input,textarea):not(:placeholder-shown)) .base-field__float-label{transform:translateZ(0) scale(.75)}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line{font-size:17px!important;line-height:23.8px!important}.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field--size-lg .base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line{font-size:var(--structra-field-input-font-size, 1.0625rem)!important;line-height:var(--structra-field-input-line-height, 1.4)!important}.base-field--size-lg .base-field__clear,.base-field--size-lg .base-field__ctx-trigger{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem}.base-field--size-lg .base-field__clear-x{font-size:1.35rem;width:1.35rem;height:1.35rem}.base-field--size-lg .base-field__suffix-reserve{width:2.35rem;height:2.35rem}.base-field--size-lg .base-field__control ::ng-deep .text-field__input,.base-field--size-lg .base-field__control ::ng-deep .integer-field__input,.base-field--size-lg .base-field__control ::ng-deep .decimal-field__input,.base-field--size-lg .base-field__control ::ng-deep .password-field__input,.base-field--size-lg .base-field__control ::ng-deep .cep-field__input,.base-field--size-lg .base-field__control ::ng-deep .phone-field__input,.base-field--size-lg .base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field--size-lg .base-field__control ::ng-deep .input-mask-field__input,.base-field--size-lg .base-field__control ::ng-deep .textarea-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input,.base-field--size-lg .base-field__control ::ng-deep .color-picker-field__input{padding:1.55rem .9rem .5rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mdc-text-field__input,.base-field--size-lg .base-field__control ::ng-deep .date-field__input.mat-mdc-input-element{min-height:3.5375rem!important}.base-field--size-lg .base-field__control ::ng-deep .date-field__display{left:.9rem;right:.9rem;font-size:1.0625rem;line-height:1.4}.base-field--size-lg .base-field__control ::ng-deep .select-field__origin,.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__origin,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__origin,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{min-height:3.5375rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__value-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__value-btn{padding:1.55rem .38rem .5rem .9rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__input{padding:1.55rem .9rem .5rem;--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-btn,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-btn{width:2.35rem;height:2.35rem;min-width:2.35rem;min-height:2.35rem;margin:0 .12rem}.base-field--size-lg .base-field__control ::ng-deep .select-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .multiselect-field__chevron-icon,.base-field--size-lg .base-field__control ::ng-deep .dropdown-search-field__chevron-icon{font-size:.88rem}@media(max-width:768px),(hover:none)and (pointer:coarse){.base-field__control ::ng-deep :where(input,textarea,select){--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill,.base-field__control ::ng-deep :where(input,textarea):-webkit-autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):autofill,.base-field__control ::ng-deep :where(input,textarea):autofill:first-line,.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown),.base-field__control ::ng-deep :where(input,textarea):not(:placeholder-shown):first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-previewed:first-line,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected,.base-field__control ::ng-deep :where(input,textarea):-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;-webkit-text-size-adjust:100%!important}.base-field__control ::ng-deep .text-field__input,.base-field__control ::ng-deep .integer-field__input,.base-field__control ::ng-deep .decimal-field__input,.base-field__control ::ng-deep .password-field__input,.base-field__control ::ng-deep .cep-field__input,.base-field__control ::ng-deep .phone-field__input,.base-field__control ::ng-deep .cpf-cnpj-field__input,.base-field__control ::ng-deep .input-mask-field__input,.base-field__control ::ng-deep .textarea-field__input,.base-field__control ::ng-deep .date-field__input,.base-field__control ::ng-deep .color-picker-field__input,.base-field__control ::ng-deep .dropdown-search-field__input,.base-field__control ::ng-deep .select-field__value-btn,.base-field__control ::ng-deep .multiselect-field__value-btn{--structra-field-input-font-size: 16px;--structra-field-input-line-height: 1.35;font-size:16px!important;line-height:21.6px!important}}\n"] }]
         }], propDecorators: { label: [{
                 type: Input
             }], errorMessage: [{
@@ -7014,6 +7037,27 @@ function scrollDropdownListActiveOptionIntoView(listEl, activeIndex, enabledOpti
     }
 }
 
+/**
+ * Propaga tokens tipográficos do trigger para o painel overlay (lista de opções).
+ * O CDK renderiza o painel fora do `app-base-field`; sem isto as opções ficam com `rem` fixo.
+ */
+function readFieldInputTypographyTokens(el) {
+    const cs = getComputedStyle(el);
+    const fontSize = cs.getPropertyValue('--structra-field-input-font-size').trim() || cs.fontSize;
+    const lineHeight = cs.getPropertyValue('--structra-field-input-line-height').trim() || cs.lineHeight;
+    return { fontSize, lineHeight };
+}
+function fieldInputTypographyStyleFromTrigger(trigger) {
+    if (!trigger) {
+        return {};
+    }
+    const { fontSize, lineHeight } = readFieldInputTypographyTokens(trigger);
+    return {
+        '--structra-field-input-font-size': fontSize,
+        '--structra-field-input-line-height': lineHeight,
+    };
+}
+
 class SelectFieldComponent extends DropdownOptionFieldBase {
     constructor() {
         super(...arguments);
@@ -7030,6 +7074,7 @@ class SelectFieldComponent extends DropdownOptionFieldBase {
         this.pageRequested = new EventEmitter();
         this.panelOpen = false;
         this.panelOverlayWidth = 0;
+        this.panelTypographyStyle = {};
         this.scrollLoadTimer = null;
         this.keyboardLoadMoreTimer = null;
         this.loadMoreInFlight = false;
@@ -7294,6 +7339,7 @@ class SelectFieldComponent extends DropdownOptionFieldBase {
     }
     syncPanelOverlayWidthToTrigger() {
         this.panelOverlayWidth = measureDropdownPanelWidthPx(this.dropdownTriggerRootRef?.nativeElement, this.hostRef.nativeElement);
+        this.panelTypographyStyle = fieldInputTypographyStyleFromTrigger(this.nativeInputRef?.nativeElement);
     }
     /** Enter/Espaço com foco na linha da opção (tabindex). */
     onOptionRowKeydown(ev, opt) {
@@ -7406,17 +7452,17 @@ class SelectFieldComponent extends DropdownOptionFieldBase {
                 useExisting: forwardRef(() => SelectFieldComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "optionsPanelTpl", first: true, predicate: ["optionsPanelTpl"], descendants: true, static: true }, { propertyName: "dropdownTriggerRootRef", first: true, predicate: ["dropdownFieldTriggerRoot"], descendants: true, read: ElementRef }, { propertyName: "dropdownBase", first: true, predicate: DropdownBaseComponent, descendants: true }, { propertyName: "nativeInputRef", first: true, predicate: ["nativeInput"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"select-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"select-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <!-- `div` em vez de `<button>`: o texto do valor fica selecion\u00E1vel (copiar), como no combobox. -->\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"select-field__value-btn\"\n          [class.select-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Selecionar'\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"select-field__value\">{{ displayValue }}</span>\n        </div>\n        <button type=\"button\" class=\"select-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down select-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"select-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"select-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"select-field__option\" [class.select-field__option--disabled]=\"opt.disabled\"\n      [class.select-field__option--selected]=\"isSelected(opt)\"\n      [class.select-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n      [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      {{ opt.label }}\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.select-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.select-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.select-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;font-size:1rem;line-height:1.35;font-family:inherit;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__value-btn:focus,.select-field__value-btn:focus-visible{outline:none;box-shadow:none}.select-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__value-btn:not(.select-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.select-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.select-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.select-field__chevron-btn:focus,.select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.select-field--invalid .select-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.select-field--invalid .select-field__chevron-btn .select-field__chevron-icon{color:inherit}:host.select-field--invalid .select-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.select-field--invalid .select-field__chevron-btn:focus,:host.select-field--invalid .select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.select-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.select-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.9rem;line-height:1.35;font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.select-field__loading{padding:.65rem .75rem;font-size:.85rem;line-height:1.35;color:var(--ui-field-float-label-color);text-align:center}.select-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.select-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.45rem .75rem;font-size:.95rem;line-height:1.35;cursor:pointer;color:var(--ui-field-float-input-text)}.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.select-field__option--active:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.select-field__option.select-field__option--active.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.select-field__option--disabled{opacity:.45;cursor:not-allowed}.select-field__option:hover:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.select-field__option.select-field__option--selected:hover:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "hint", "hintId", "required", "showRequiredMark", "invalid", "invalidThemed", "filled", "labelAlwaysFloated", "disabled", "readonly", "size", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }, { kind: "component", type: DropdownBaseComponent, selector: "app-dropdown-base", inputs: ["open", "panelTemplate", "panelWidthPx", "closeOnEscape", "hasBackdrop", "connectedPositions", "pushConnectedOverlay", "flexibleConnectedOverlay", "connectedOverlayViewportMargin", "lockConnectedOverlayPosition", "scrollStrategy", "bareOverlayPanel"], outputs: ["openChange"] }, { kind: "component", type: SkeletonListComponent, selector: "app-skeleton-list", inputs: ["rows", "leading", "rowGap", "lineHeight", "animate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "optionsPanelTpl", first: true, predicate: ["optionsPanelTpl"], descendants: true, static: true }, { propertyName: "dropdownTriggerRootRef", first: true, predicate: ["dropdownFieldTriggerRoot"], descendants: true, read: ElementRef }, { propertyName: "dropdownBase", first: true, predicate: DropdownBaseComponent, descendants: true }, { propertyName: "nativeInputRef", first: true, predicate: ["nativeInput"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"select-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"select-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <!-- `div` em vez de `<button>`: o texto do valor fica selecion\u00E1vel (copiar), como no combobox. -->\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"select-field__value-btn\"\n          [class.select-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Selecionar'\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"select-field__value\">{{ displayValue }}</span>\n        </div>\n        <button type=\"button\" class=\"select-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down select-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"select-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n    [ngStyle]=\"panelTypographyStyle\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"select-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"select-field__option\" [class.select-field__option--disabled]=\"opt.disabled\"\n      [class.select-field__option--selected]=\"isSelected(opt)\"\n      [class.select-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n      [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      {{ opt.label }}\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.select-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.select-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.select-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__value-btn:focus,.select-field__value-btn:focus-visible{outline:none;box-shadow:none}.select-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__value-btn:not(.select-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.select-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.select-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.select-field__chevron-btn:focus,.select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.select-field--invalid .select-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.select-field--invalid .select-field__chevron-btn .select-field__chevron-icon{color:inherit}:host.select-field--invalid .select-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.select-field--invalid .select-field__chevron-btn:focus,:host.select-field--invalid .select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.select-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.select-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.select-field__loading{padding:.65rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-label-color);text-align:center}.select-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.select-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);padding:.45rem .75rem;cursor:pointer;color:var(--ui-field-float-input-text)}.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.select-field__option--active:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.select-field__option.select-field__option--active.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.select-field__option--disabled{opacity:.45;cursor:not-allowed}.select-field__option:hover:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.select-field__option.select-field__option--selected:hover:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.select-field__value-btn,.select-field__input{--structra-field-input-font-size: 1rem;--structra-field-input-line-height: 1.35;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height);font-family:inherit;font-weight:var(--field-value-weight, var(--structra-body-weight));-webkit-text-size-adjust:100%}:host ::ng-deep .base-field--size-sm .select-field__value-btn,:host ::ng-deep .base-field--size-sm .select-field__input{--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}:host ::ng-deep .base-field--size-lg .select-field__value-btn,:host ::ng-deep .base-field--size-lg .select-field__input{--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "hint", "hintId", "required", "showRequiredMark", "invalid", "invalidThemed", "filled", "labelAlwaysFloated", "disabled", "readonly", "size", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }, { kind: "component", type: DropdownBaseComponent, selector: "app-dropdown-base", inputs: ["open", "panelTemplate", "panelWidthPx", "closeOnEscape", "hasBackdrop", "connectedPositions", "pushConnectedOverlay", "flexibleConnectedOverlay", "connectedOverlayViewportMargin", "lockConnectedOverlayPosition", "scrollStrategy", "bareOverlayPanel"], outputs: ["openChange"] }, { kind: "component", type: SkeletonListComponent, selector: "app-skeleton-list", inputs: ["rows", "leading", "rowGap", "lineHeight", "animate"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: SelectFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-select-field', imports: [BaseFieldComponent, DropdownBaseComponent, SkeletonListComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'app-select-field', imports: [BaseFieldComponent, DropdownBaseComponent, SkeletonListComponent, NgStyle], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => SelectFieldComponent),
                             multi: true,
                         },
-                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"select-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"select-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <!-- `div` em vez de `<button>`: o texto do valor fica selecion\u00E1vel (copiar), como no combobox. -->\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"select-field__value-btn\"\n          [class.select-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Selecionar'\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"select-field__value\">{{ displayValue }}</span>\n        </div>\n        <button type=\"button\" class=\"select-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down select-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"select-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"select-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"select-field__option\" [class.select-field__option--disabled]=\"opt.disabled\"\n      [class.select-field__option--selected]=\"isSelected(opt)\"\n      [class.select-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n      [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      {{ opt.label }}\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.select-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.select-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.select-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;font-size:1rem;line-height:1.35;font-family:inherit;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__value-btn:focus,.select-field__value-btn:focus-visible{outline:none;box-shadow:none}.select-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__value-btn:not(.select-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.select-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.select-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.select-field__chevron-btn:focus,.select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.select-field--invalid .select-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.select-field--invalid .select-field__chevron-btn .select-field__chevron-icon{color:inherit}:host.select-field--invalid .select-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.select-field--invalid .select-field__chevron-btn:focus,:host.select-field--invalid .select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.select-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.select-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.9rem;line-height:1.35;font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.select-field__loading{padding:.65rem .75rem;font-size:.85rem;line-height:1.35;color:var(--ui-field-float-label-color);text-align:center}.select-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.select-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.45rem .75rem;font-size:.95rem;line-height:1.35;cursor:pointer;color:var(--ui-field-float-input-text)}.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.select-field__option--active:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.select-field__option.select-field__option--active.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.select-field__option--disabled{opacity:.45;cursor:not-allowed}.select-field__option:hover:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.select-field__option.select-field__option--selected:hover:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}\n"] }]
+                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"select-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"select-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <!-- `div` em vez de `<button>`: o texto do valor fica selecion\u00E1vel (copiar), como no combobox. -->\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"select-field__value-btn\"\n          [class.select-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Selecionar'\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"select-field__value\">{{ displayValue }}</span>\n        </div>\n        <button type=\"button\" class=\"select-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down select-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"select-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n    [ngStyle]=\"panelTypographyStyle\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"select-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"select-field__option\" [class.select-field__option--disabled]=\"opt.disabled\"\n      [class.select-field__option--selected]=\"isSelected(opt)\"\n      [class.select-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n      [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      {{ opt.label }}\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.select-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.select-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.select-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__value-btn:focus,.select-field__value-btn:focus-visible{outline:none;box-shadow:none}.select-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__value-btn:not(.select-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .select-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.select-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.select-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.select-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.select-field__chevron-btn:focus,.select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.select-field--invalid .select-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.select-field--invalid .select-field__chevron-btn .select-field__chevron-icon{color:inherit}:host.select-field--invalid .select-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.select-field--invalid .select-field__chevron-btn:focus,:host.select-field--invalid .select-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.select-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.select-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.select-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.select-field__loading{padding:.65rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-label-color);text-align:center}.select-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.select-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);padding:.45rem .75rem;cursor:pointer;color:var(--ui-field-float-input-text)}.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.select-field__option--active:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.select-field__option.select-field__option--active.select-field__option--selected:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.select-field__option--disabled{opacity:.45;cursor:not-allowed}.select-field__option:hover:not(.select-field__option--disabled):not(.select-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.select-field__option.select-field__option--selected:hover:not(.select-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.select-field__value-btn,.select-field__input{--structra-field-input-font-size: 1rem;--structra-field-input-line-height: 1.35;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height);font-family:inherit;font-weight:var(--field-value-weight, var(--structra-body-weight));-webkit-text-size-adjust:100%}:host ::ng-deep .base-field--size-sm .select-field__value-btn,:host ::ng-deep .base-field--size-sm .select-field__input{--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}:host ::ng-deep .base-field--size-lg .select-field__value-btn,:host ::ng-deep .base-field--size-lg .select-field__input{--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}\n"] }]
         }], propDecorators: { hostInvalidClass: [{
                 type: HostBinding,
                 args: ['class.select-field--invalid']
@@ -7490,6 +7536,7 @@ class MultiselectFieldComponent extends DropdownMultiOptionFieldBase {
         this.appliedDefaultValueFromLabels = false;
         this.panelOpen = false;
         this.panelOverlayWidth = 0;
+        this.panelTypographyStyle = {};
         this.panelSearchQuery = '';
         this.scrollLoadTimer = null;
         this.keyboardLoadMoreTimer = null;
@@ -7992,6 +8039,7 @@ class MultiselectFieldComponent extends DropdownMultiOptionFieldBase {
     }
     syncPanelOverlayWidthToTrigger() {
         this.panelOverlayWidth = measureDropdownPanelWidthPx(this.dropdownTriggerRootRef?.nativeElement, this.hostRef.nativeElement);
+        this.panelTypographyStyle = fieldInputTypographyStyleFromTrigger(this.nativeInputRef?.nativeElement);
     }
     firstEnabledIndex() {
         const list = this.listOptions;
@@ -8148,17 +8196,17 @@ class MultiselectFieldComponent extends DropdownMultiOptionFieldBase {
                 useExisting: forwardRef(() => MultiselectFieldComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "optionsPanelTpl", first: true, predicate: ["optionsPanelTpl"], descendants: true, static: true }, { propertyName: "dropdownTriggerRootRef", first: true, predicate: ["dropdownFieldTriggerRoot"], descendants: true, read: ElementRef }, { propertyName: "nativeInputRef", first: true, predicate: ["nativeInput"], descendants: true, read: ElementRef }, { propertyName: "dropdownBase", first: true, predicate: DropdownBaseComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-base-field [label]=\"displayLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"showSuffixSlot\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"multiselect-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [lockConnectedOverlayPosition]=\"lockOverlayWhileOpen\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"multiselect-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"multiselect-field__value-btn\"\n          [class.multiselect-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"displayAriaLabel\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"multiselect-field__value\">{{ displaySummary }}</span>\n        </div>\n        <span class=\"multiselect-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"multiselect-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down multiselect-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n  <ng-content select=\"[appFieldSuffix]\" />\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"multiselect-field__panel-inner\" (mousedown)=\"$event.preventDefault()\">\n    @if (searchable) {\n    <div class=\"multiselect-field__search-wrap\">\n      <input type=\"search\" class=\"multiselect-field__search-input\" [id]=\"panelSearchInputId\"\n        autocomplete=\"off\" spellcheck=\"false\" placeholder=\"Pesquisar\u2026\" aria-label=\"Pesquisar op\u00E7\u00F5es\"\n        [value]=\"panelSearchQuery\" (input)=\"onPanelSearchInput($event)\" (keydown)=\"onPanelSearchKeydown($event)\"\n        (blur)=\"onDropdownBlur($event)\" />\n    </div>\n    }\n  <div class=\"multiselect-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\" aria-multiselectable=\"true\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"multiselect-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"multiselect-field__option\" [class.multiselect-field__option--disabled]=\"optionSelectDisabled(opt)\"\n      [class.multiselect-field__option--selected]=\"isSelected(opt)\"\n      [class.multiselect-field__option--active]=\"!optionSelectDisabled(opt) && activeIndex === $index\"\n      [attr.tabindex]=\"optionSelectDisabled(opt) ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"toggleOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      <span class=\"multiselect-field__check\" aria-hidden=\"true\">\n        @if (isSelected(opt)) {\n        <i class=\"fa-solid fa-check multiselect-field__check-icon\"></i>\n        }\n      </span>\n      <span class=\"multiselect-field__option-label\">{{ opt.label }}</span>\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.multiselect-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.multiselect-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.multiselect-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;font-size:1rem;line-height:1.35;font-family:inherit;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__value-btn:focus,.multiselect-field__value-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__value-btn:not(.multiselect-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.multiselect-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.multiselect-field__trigger-suffix:not(:has(>*)){display:none}.multiselect-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.multiselect-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.multiselect-field__chevron-btn:focus,.multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.multiselect-field--invalid .multiselect-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.multiselect-field--invalid .multiselect-field__chevron-btn .multiselect-field__chevron-icon{color:inherit}:host.multiselect-field--invalid .multiselect-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus,:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.multiselect-field--invalid .multiselect-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.multiselect-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.multiselect-field__panel-inner{display:flex;flex-direction:column;min-width:0;width:100%;box-sizing:border-box;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__search-wrap{flex-shrink:0;padding:.45rem .5rem .35rem;border-bottom:1px solid rgba(0,0,0,.08);box-sizing:border-box}.multiselect-field__search-input{width:100%;box-sizing:border-box;margin:0;padding:.45rem .65rem;font:inherit;font-size:.92rem;line-height:1.35;color:var(--ui-field-float-input-text);background:var(--app-color-surface, #fff);border:1px solid var(--ui-field-float-border, rgba(0, 0, 0, .12));border-radius:8px;outline:none}.multiselect-field__search-input:focus{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 2px var(--ui-field-float-focus-ring)}.multiselect-field__search-input::placeholder{color:var(--app-color-text-muted, #6b7280)}.multiselect-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);-webkit-overflow-scrolling:touch;box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.9rem;line-height:1.35;font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.multiselect-field__loading{padding:.65rem .75rem;font-size:.85rem;line-height:1.35;color:var(--ui-field-float-label-color);text-align:center}.multiselect-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.multiselect-field__option{display:flex;align-items:center;gap:.5rem;padding:.45rem .75rem;font-size:.95rem;line-height:1.35;cursor:pointer;color:var(--ui-field-float-input-text)}.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.multiselect-field__option--active:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.multiselect-field__option.multiselect-field__option--active.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.multiselect-field__option--disabled{opacity:.45;cursor:not-allowed}.multiselect-field__option:hover:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.multiselect-field__option.multiselect-field__option--selected:hover:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.multiselect-field__check{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:1.1rem;height:1.1rem}.multiselect-field__check-icon{font-size:.85rem;line-height:1;color:var(--ui-field-float-border-focus)}.multiselect-field__option-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "hint", "hintId", "required", "showRequiredMark", "invalid", "invalidThemed", "filled", "labelAlwaysFloated", "disabled", "readonly", "size", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }, { kind: "component", type: DropdownBaseComponent, selector: "app-dropdown-base", inputs: ["open", "panelTemplate", "panelWidthPx", "closeOnEscape", "hasBackdrop", "connectedPositions", "pushConnectedOverlay", "flexibleConnectedOverlay", "connectedOverlayViewportMargin", "lockConnectedOverlayPosition", "scrollStrategy", "bareOverlayPanel"], outputs: ["openChange"] }, { kind: "component", type: SkeletonListComponent, selector: "app-skeleton-list", inputs: ["rows", "leading", "rowGap", "lineHeight", "animate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "optionsPanelTpl", first: true, predicate: ["optionsPanelTpl"], descendants: true, static: true }, { propertyName: "dropdownTriggerRootRef", first: true, predicate: ["dropdownFieldTriggerRoot"], descendants: true, read: ElementRef }, { propertyName: "nativeInputRef", first: true, predicate: ["nativeInput"], descendants: true, read: ElementRef }, { propertyName: "dropdownBase", first: true, predicate: DropdownBaseComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-base-field [label]=\"displayLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"showSuffixSlot\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"multiselect-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [lockConnectedOverlayPosition]=\"lockOverlayWhileOpen\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"multiselect-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"multiselect-field__value-btn\"\n          [class.multiselect-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"displayAriaLabel\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"multiselect-field__value\">{{ displaySummary }}</span>\n        </div>\n        <span class=\"multiselect-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"multiselect-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down multiselect-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n  <ng-content select=\"[appFieldSuffix]\" />\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"multiselect-field__panel-inner\" [ngStyle]=\"panelTypographyStyle\" (mousedown)=\"$event.preventDefault()\">\n    @if (searchable) {\n    <div class=\"multiselect-field__search-wrap\">\n      <input type=\"search\" class=\"multiselect-field__search-input\" [id]=\"panelSearchInputId\"\n        autocomplete=\"off\" spellcheck=\"false\" placeholder=\"Pesquisar\u2026\" aria-label=\"Pesquisar op\u00E7\u00F5es\"\n        [value]=\"panelSearchQuery\" (input)=\"onPanelSearchInput($event)\" (keydown)=\"onPanelSearchKeydown($event)\"\n        (blur)=\"onDropdownBlur($event)\" />\n    </div>\n    }\n  <div class=\"multiselect-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\" aria-multiselectable=\"true\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"multiselect-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"multiselect-field__option\" [class.multiselect-field__option--disabled]=\"optionSelectDisabled(opt)\"\n      [class.multiselect-field__option--selected]=\"isSelected(opt)\"\n      [class.multiselect-field__option--active]=\"!optionSelectDisabled(opt) && activeIndex === $index\"\n      [attr.tabindex]=\"optionSelectDisabled(opt) ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"toggleOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      <span class=\"multiselect-field__check\" aria-hidden=\"true\">\n        @if (isSelected(opt)) {\n        <i class=\"fa-solid fa-check multiselect-field__check-icon\"></i>\n        }\n      </span>\n      <span class=\"multiselect-field__option-label\">{{ opt.label }}</span>\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.multiselect-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.multiselect-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.multiselect-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__value-btn:focus,.multiselect-field__value-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__value-btn:not(.multiselect-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.multiselect-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.multiselect-field__trigger-suffix:not(:has(>*)){display:none}.multiselect-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.multiselect-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.multiselect-field__chevron-btn:focus,.multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.multiselect-field--invalid .multiselect-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.multiselect-field--invalid .multiselect-field__chevron-btn .multiselect-field__chevron-icon{color:inherit}:host.multiselect-field--invalid .multiselect-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus,:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.multiselect-field--invalid .multiselect-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.multiselect-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.multiselect-field__panel-inner{display:flex;flex-direction:column;min-width:0;width:100%;box-sizing:border-box;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__search-wrap{flex-shrink:0;padding:.45rem .5rem .35rem;border-bottom:1px solid rgba(0,0,0,.08);box-sizing:border-box}.multiselect-field__search-input{width:100%;box-sizing:border-box;margin:0;padding:.45rem .65rem;font:inherit;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-input-text);background:var(--app-color-surface, #fff);border:1px solid var(--ui-field-float-border, rgba(0, 0, 0, .12));border-radius:8px;outline:none}.multiselect-field__search-input:focus{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 2px var(--ui-field-float-focus-ring)}.multiselect-field__search-input::placeholder{color:var(--app-color-text-muted, #6b7280)}.multiselect-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);-webkit-overflow-scrolling:touch;box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.multiselect-field__loading{padding:.65rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-label-color);text-align:center}.multiselect-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.multiselect-field__option{display:flex;align-items:center;gap:.5rem;padding:.45rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);cursor:pointer;color:var(--ui-field-float-input-text)}.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.multiselect-field__option--active:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.multiselect-field__option.multiselect-field__option--active.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.multiselect-field__option--disabled{opacity:.45;cursor:not-allowed}.multiselect-field__option:hover:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.multiselect-field__option.multiselect-field__option--selected:hover:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.multiselect-field__check{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:1.1rem;height:1.1rem}.multiselect-field__check-icon{font-size:.85rem;line-height:1;color:var(--ui-field-float-border-focus)}.multiselect-field__option-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.multiselect-field__value-btn,.multiselect-field__input{--structra-field-input-font-size: 1rem;--structra-field-input-line-height: 1.35;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height);font-family:inherit;font-weight:var(--field-value-weight, var(--structra-body-weight));-webkit-text-size-adjust:100%}:host ::ng-deep .base-field--size-sm .multiselect-field__value-btn,:host ::ng-deep .base-field--size-sm .multiselect-field__input{--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}:host ::ng-deep .base-field--size-lg .multiselect-field__value-btn,:host ::ng-deep .base-field--size-lg .multiselect-field__input{--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "hint", "hintId", "required", "showRequiredMark", "invalid", "invalidThemed", "filled", "labelAlwaysFloated", "disabled", "readonly", "size", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }, { kind: "component", type: DropdownBaseComponent, selector: "app-dropdown-base", inputs: ["open", "panelTemplate", "panelWidthPx", "closeOnEscape", "hasBackdrop", "connectedPositions", "pushConnectedOverlay", "flexibleConnectedOverlay", "connectedOverlayViewportMargin", "lockConnectedOverlayPosition", "scrollStrategy", "bareOverlayPanel"], outputs: ["openChange"] }, { kind: "component", type: SkeletonListComponent, selector: "app-skeleton-list", inputs: ["rows", "leading", "rowGap", "lineHeight", "animate"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: MultiselectFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-multiselect-field', imports: [BaseFieldComponent, DropdownBaseComponent, SkeletonListComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'app-multiselect-field', imports: [BaseFieldComponent, DropdownBaseComponent, SkeletonListComponent, NgStyle], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => MultiselectFieldComponent),
                             multi: true,
                         },
-                    ], template: "<app-base-field [label]=\"displayLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"showSuffixSlot\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"multiselect-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [lockConnectedOverlayPosition]=\"lockOverlayWhileOpen\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"multiselect-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"multiselect-field__value-btn\"\n          [class.multiselect-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"displayAriaLabel\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"multiselect-field__value\">{{ displaySummary }}</span>\n        </div>\n        <span class=\"multiselect-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"multiselect-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down multiselect-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n  <ng-content select=\"[appFieldSuffix]\" />\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"multiselect-field__panel-inner\" (mousedown)=\"$event.preventDefault()\">\n    @if (searchable) {\n    <div class=\"multiselect-field__search-wrap\">\n      <input type=\"search\" class=\"multiselect-field__search-input\" [id]=\"panelSearchInputId\"\n        autocomplete=\"off\" spellcheck=\"false\" placeholder=\"Pesquisar\u2026\" aria-label=\"Pesquisar op\u00E7\u00F5es\"\n        [value]=\"panelSearchQuery\" (input)=\"onPanelSearchInput($event)\" (keydown)=\"onPanelSearchKeydown($event)\"\n        (blur)=\"onDropdownBlur($event)\" />\n    </div>\n    }\n  <div class=\"multiselect-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\" aria-multiselectable=\"true\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"multiselect-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"multiselect-field__option\" [class.multiselect-field__option--disabled]=\"optionSelectDisabled(opt)\"\n      [class.multiselect-field__option--selected]=\"isSelected(opt)\"\n      [class.multiselect-field__option--active]=\"!optionSelectDisabled(opt) && activeIndex === $index\"\n      [attr.tabindex]=\"optionSelectDisabled(opt) ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"toggleOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      <span class=\"multiselect-field__check\" aria-hidden=\"true\">\n        @if (isSelected(opt)) {\n        <i class=\"fa-solid fa-check multiselect-field__check-icon\"></i>\n        }\n      </span>\n      <span class=\"multiselect-field__option-label\">{{ opt.label }}</span>\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.multiselect-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.multiselect-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.multiselect-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;font-size:1rem;line-height:1.35;font-family:inherit;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__value-btn:focus,.multiselect-field__value-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__value-btn:not(.multiselect-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.multiselect-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.multiselect-field__trigger-suffix:not(:has(>*)){display:none}.multiselect-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.multiselect-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.multiselect-field__chevron-btn:focus,.multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.multiselect-field--invalid .multiselect-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.multiselect-field--invalid .multiselect-field__chevron-btn .multiselect-field__chevron-icon{color:inherit}:host.multiselect-field--invalid .multiselect-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus,:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.multiselect-field--invalid .multiselect-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.multiselect-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.multiselect-field__panel-inner{display:flex;flex-direction:column;min-width:0;width:100%;box-sizing:border-box;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__search-wrap{flex-shrink:0;padding:.45rem .5rem .35rem;border-bottom:1px solid rgba(0,0,0,.08);box-sizing:border-box}.multiselect-field__search-input{width:100%;box-sizing:border-box;margin:0;padding:.45rem .65rem;font:inherit;font-size:.92rem;line-height:1.35;color:var(--ui-field-float-input-text);background:var(--app-color-surface, #fff);border:1px solid var(--ui-field-float-border, rgba(0, 0, 0, .12));border-radius:8px;outline:none}.multiselect-field__search-input:focus{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 2px var(--ui-field-float-focus-ring)}.multiselect-field__search-input::placeholder{color:var(--app-color-text-muted, #6b7280)}.multiselect-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);-webkit-overflow-scrolling:touch;box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.9rem;line-height:1.35;font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.multiselect-field__loading{padding:.65rem .75rem;font-size:.85rem;line-height:1.35;color:var(--ui-field-float-label-color);text-align:center}.multiselect-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.multiselect-field__option{display:flex;align-items:center;gap:.5rem;padding:.45rem .75rem;font-size:.95rem;line-height:1.35;cursor:pointer;color:var(--ui-field-float-input-text)}.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.multiselect-field__option--active:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.multiselect-field__option.multiselect-field__option--active.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.multiselect-field__option--disabled{opacity:.45;cursor:not-allowed}.multiselect-field__option:hover:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.multiselect-field__option.multiselect-field__option--selected:hover:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.multiselect-field__check{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:1.1rem;height:1.1rem}.multiselect-field__check-icon{font-size:.85rem;line-height:1;color:var(--ui-field-float-border-focus)}.multiselect-field__option-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}\n"] }]
+                    ], template: "<app-base-field [label]=\"displayLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\"\n  [loading]=\"loading\"\n  [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\" [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\"\n  [inputId]=\"controlId\" [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\"\n  [clearable]=\"clearable\" [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"showSuffixSlot\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\" [contextMenuId]=\"contextMenuId\"\n  (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"multiselect-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [lockConnectedOverlayPosition]=\"lockOverlayWhileOpen\"\n      (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"multiselect-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <div\n          #nativeInput\n          role=\"combobox\"\n          class=\"multiselect-field__value-btn\"\n          [class.multiselect-field__value-btn--is-disabled]=\"disabled\"\n          [id]=\"controlId\"\n          [attr.name]=\"name || null\"\n          [attr.tabindex]=\"disabled || readonly ? -1 : 0\"\n          [attr.aria-disabled]=\"disabled ? true : null\"\n          [attr.aria-readonly]=\"readonly && !disabled ? true : null\"\n          [attr.aria-expanded]=\"panelOpen\"\n          aria-haspopup=\"listbox\"\n          [attr.aria-controls]=\"panelOpen ? optionsListId : null\"\n          [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"displayAriaLabel\"\n          (click)=\"openToggle()\"\n          (blur)=\"onDropdownBlur($event)\"\n        >\n          <span class=\"multiselect-field__value\">{{ displaySummary }}</span>\n        </div>\n        <span class=\"multiselect-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"multiselect-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista de op\u00E7\u00F5es\"\n          (click)=\"openToggle()\" (blur)=\"onDropdownBlur($event)\">\n          <i class=\"fa-solid fa-chevron-down multiselect-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n  <ng-content select=\"[appFieldSuffix]\" />\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"multiselect-field__panel-inner\" [ngStyle]=\"panelTypographyStyle\" (mousedown)=\"$event.preventDefault()\">\n    @if (searchable) {\n    <div class=\"multiselect-field__search-wrap\">\n      <input type=\"search\" class=\"multiselect-field__search-input\" [id]=\"panelSearchInputId\"\n        autocomplete=\"off\" spellcheck=\"false\" placeholder=\"Pesquisar\u2026\" aria-label=\"Pesquisar op\u00E7\u00F5es\"\n        [value]=\"panelSearchQuery\" (input)=\"onPanelSearchInput($event)\" (keydown)=\"onPanelSearchKeydown($event)\"\n        (blur)=\"onDropdownBlur($event)\" />\n    </div>\n    }\n  <div class=\"multiselect-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\" aria-multiselectable=\"true\"\n    (blur)=\"onDropdownBlur($event)\" (keydown)=\"onListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n    @if (listOptions.length === 0 && (optionsLoading || (pagination && loadingMore))) {\n    <app-skeleton-list [rows]=\"1\" />\n    }\n    @if (listOptions.length === 0 && !optionsLoading && !(pagination && loadingMore)) {\n    <div class=\"multiselect-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n    }\n    @for (opt of listOptions; track trackOption($index, opt)) {\n    <div role=\"option\" class=\"multiselect-field__option\" [class.multiselect-field__option--disabled]=\"optionSelectDisabled(opt)\"\n      [class.multiselect-field__option--selected]=\"isSelected(opt)\"\n      [class.multiselect-field__option--active]=\"!optionSelectDisabled(opt) && activeIndex === $index\"\n      [attr.tabindex]=\"optionSelectDisabled(opt) ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"toggleOption(opt)\"\n      (keydown)=\"onOptionRowKeydown($event, opt)\">\n      <span class=\"multiselect-field__check\" aria-hidden=\"true\">\n        @if (isSelected(opt)) {\n        <i class=\"fa-solid fa-check multiselect-field__check-icon\"></i>\n        }\n      </span>\n      <span class=\"multiselect-field__option-label\">{{ opt.label }}</span>\n    </div>\n    }\n    @if (options.length > 0 && pagination && loadingMore) {\n    <app-skeleton-list [rows]=\"1\" [leading]=\"false\" />\n    }\n  </div>\n  </div>\n</ng-template>\n", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.multiselect-field__wrap{display:flex;flex:1;align-items:stretch;align-self:stretch;min-width:0;width:100%;box-sizing:border-box}.multiselect-field__origin{display:flex;align-items:center;align-self:stretch;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.multiselect-field__value-btn{flex:1;min-width:0;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:pointer;display:flex;align-items:center;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__value-btn:focus,.multiselect-field__value-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__value-btn--is-disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity);pointer-events:none}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__value-btn:not(.multiselect-field__value-btn--is-disabled){color:var(--ui-field-readonly-input-text);-webkit-text-fill-color:var(--ui-field-readonly-input-text)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .multiselect-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}.multiselect-field__value{display:block;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:text;-webkit-user-select:text;-moz-user-select:text}.multiselect-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.multiselect-field__trigger-suffix:not(:has(>*)){display:none}.multiselect-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.multiselect-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.multiselect-field__chevron-btn:focus,.multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.multiselect-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host.multiselect-field--invalid .multiselect-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.multiselect-field--invalid .multiselect-field__chevron-btn .multiselect-field__chevron-icon{color:inherit}:host.multiselect-field--invalid .multiselect-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus,:host.multiselect-field--invalid .multiselect-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.multiselect-field--invalid .multiselect-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.multiselect-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.multiselect-field__panel-inner{display:flex;flex-direction:column;min-width:0;width:100%;box-sizing:border-box;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__search-wrap{flex-shrink:0;padding:.45rem .5rem .35rem;border-bottom:1px solid rgba(0,0,0,.08);box-sizing:border-box}.multiselect-field__search-input{width:100%;box-sizing:border-box;margin:0;padding:.45rem .65rem;font:inherit;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-input-text);background:var(--app-color-surface, #fff);border:1px solid var(--ui-field-float-border, rgba(0, 0, 0, .12));border-radius:8px;outline:none}.multiselect-field__search-input:focus{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 2px var(--ui-field-float-focus-ring)}.multiselect-field__search-input::placeholder{color:var(--app-color-text-muted, #6b7280)}.multiselect-field__list{margin:0;padding:.25rem 0;width:100%;flex:0 1 auto;min-height:0;max-height:min(320px,45vh);-webkit-overflow-scrolling:touch;box-sizing:border-box;list-style:none;outline:none;overflow-x:hidden;overflow-y:auto;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.multiselect-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.multiselect-field__loading{padding:.65rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-label-color);text-align:center}.multiselect-field__loading--footer{border-top:1px solid rgba(0,0,0,.06)}.multiselect-field__option{display:flex;align-items:center;gap:.5rem;padding:.45rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);cursor:pointer;color:var(--ui-field-float-input-text)}.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.multiselect-field__option--active:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.multiselect-field__option.multiselect-field__option--active.multiselect-field__option--selected:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.multiselect-field__option--disabled{opacity:.45;cursor:not-allowed}.multiselect-field__option:hover:not(.multiselect-field__option--disabled):not(.multiselect-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.multiselect-field__option.multiselect-field__option--selected:hover:not(.multiselect-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.multiselect-field__check{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:1.1rem;height:1.1rem}.multiselect-field__check-icon{font-size:.85rem;line-height:1;color:var(--ui-field-float-border-focus)}.multiselect-field__option-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.multiselect-field__value-btn,.multiselect-field__input{--structra-field-input-font-size: 1rem;--structra-field-input-line-height: 1.35;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height);font-family:inherit;font-weight:var(--field-value-weight, var(--structra-body-weight));-webkit-text-size-adjust:100%}:host ::ng-deep .base-field--size-sm .multiselect-field__value-btn,:host ::ng-deep .base-field--size-sm .multiselect-field__input{--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}:host ::ng-deep .base-field--size-lg .multiselect-field__value-btn,:host ::ng-deep .base-field--size-lg .multiselect-field__input{--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}\n"] }]
         }], propDecorators: { hostInvalidClass: [{
                 type: HostBinding,
                 args: ['class.multiselect-field--invalid']
@@ -8240,6 +8288,7 @@ class DropdownSearchFieldComponent extends DropdownOptionFieldBase {
         this.committedQuery = '';
         this.panelOpen = false;
         this.panelOverlayWidth = 0;
+        this.panelTypographyStyle = {};
         this.scrollLoadTimer = null;
         this.keyboardLoadMoreTimer = null;
         this.searchDebounceTimer = null;
@@ -8815,6 +8864,7 @@ class DropdownSearchFieldComponent extends DropdownOptionFieldBase {
     }
     syncPanelOverlayWidthToTrigger() {
         this.panelOverlayWidth = measureDropdownPanelWidthPx(this.dropdownTriggerRootRef?.nativeElement, this.hostRef.nativeElement);
+        this.panelTypographyStyle = fieldInputTypographyStyleFromTrigger(this.nativeInputRef?.nativeElement);
     }
     openToggle() {
         if (this.disabled || this.readonly || this.loading) {
@@ -8864,17 +8914,17 @@ class DropdownSearchFieldComponent extends DropdownOptionFieldBase {
                 useExisting: forwardRef(() => DropdownSearchFieldComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "optionsPanelTpl", first: true, predicate: ["optionsPanelTpl"], descendants: true, static: true }, { propertyName: "dropdownTriggerRootRef", first: true, predicate: ["dropdownFieldTriggerRoot"], descendants: true, read: ElementRef }, { propertyName: "dropdownBase", first: true, predicate: DropdownBaseComponent, descendants: true }, { propertyName: "nativeInputRef", first: true, predicate: ["nativeInput"], descendants: true, read: ElementRef }, { propertyName: "optionsListRef", first: true, predicate: ["optionsListEl"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\" [loading]=\"loading\" [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\"\n  [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\"\n  [contextMenuId]=\"contextMenuId\" (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"dropdown-search-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [flexibleConnectedOverlay]=\"false\" (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"dropdown-search-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <input #nativeInput type=\"text\" class=\"dropdown-search-field__input\"\n          [class.dropdown-search-field__input--locked]=\"isLockedSelectionDisplay\" [id]=\"controlId\"\n          [attr.name]=\"name || null\" [disabled]=\"disabled\" [readonly]=\"isNativeInputReadonly\"\n          [attr.tabindex]=\"readonly ? -1 : null\" [attr.placeholder]=\"''\"\n          autocomplete=\"off\" spellcheck=\"false\" [attr.aria-expanded]=\"panelOpen\" aria-autocomplete=\"list\"\n          role=\"combobox\" [attr.aria-controls]=\"panelOpen ? optionsListId : null\" [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Buscar e selecionar'\" [value]=\"searchQuery\"\n          (focus)=\"onMainFocus()\" (input)=\"onMainInput($event)\" (keydown)=\"onMainKeydown($event)\"\n          (blur)=\"onMainBlur($event)\" />\n        <span class=\"dropdown-search-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"dropdown-search-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista\" (click)=\"openToggle()\">\n          <i class=\"fa-solid fa-chevron-down dropdown-search-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"dropdown-search-field__panel-inner\" (mousedown)=\"$event.preventDefault()\">\n    <div #optionsListEl class=\"dropdown-search-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n      [attr.aria-label]=\"floatLabelCaption || 'Op\u00E7\u00F5es'\" (blur)=\"onMainBlur($event)\"\n      (keydown)=\"onSearchListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n      @if (listOptions.length === 0 && (optionsLoading || loadingMore)) {\n      <app-skeleton-list [rows]=\"1\" />\n      }\n      @if (listOptions.length === 0 && !optionsLoading && !loadingMore) {\n      <div class=\"dropdown-search-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n      }\n      @for (opt of listOptions; track trackOption($index, opt)) {\n      <div role=\"option\" class=\"dropdown-search-field__option\"\n        [class.dropdown-search-field__option--disabled]=\"opt.disabled\"\n        [class.dropdown-search-field__option--selected]=\"isSelected(opt)\"\n        [class.dropdown-search-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n        [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n        (keydown)=\"onOptionRowKeydown($event, opt)\">\n        {{ opt.label }}\n      </div>\n      }\n      @if (options.length > 0 && loadingMore) {\n      <div class=\"dropdown-search-field__loading-more\" role=\"status\" aria-live=\"polite\">Carregando\u2026</div>\n      }\n    </div>\n  </div>\n</ng-template>", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field__float-label{right:6.75rem}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.dropdown-search-field__wrap{display:flex;flex:1;align-items:stretch;min-width:0;width:100%;box-sizing:border-box}.dropdown-search-field__origin{display:flex;align-items:center;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.dropdown-search-field__input{flex:1;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;font-size:1rem;line-height:1.35;font-family:inherit;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:text;display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-search-field__input:-webkit-autofill,.dropdown-search-field__input:-webkit-autofill:hover,.dropdown-search-field__input:-webkit-autofill:focus,.dropdown-search-field__input:-webkit-autofill:active,.dropdown-search-field__input:-webkit-autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:-webkit-autofill:first-line,.dropdown-search-field__input:-webkit-autofill:hover:first-line,.dropdown-search-field__input:-webkit-autofill:focus:first-line,.dropdown-search-field__input:-webkit-autofill:active:first-line,.dropdown-search-field__input:-webkit-autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:autofill,.dropdown-search-field__input:autofill:hover,.dropdown-search-field__input:autofill:focus,.dropdown-search-field__input:autofill:active,.dropdown-search-field__input:autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;background-color:var(--ui-field-float-bg)!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:autofill:first-line,.dropdown-search-field__input:autofill:hover:first-line,.dropdown-search-field__input:autofill:focus:first-line,.dropdown-search-field__input:autofill:active:first-line,.dropdown-search-field__input:autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:-internal-autofill-previewed,.dropdown-search-field__input:-internal-autofill-previewed:first-line,.dropdown-search-field__input:-internal-autofill-selected,.dropdown-search-field__input:-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.dropdown-search-field__input:focus,.dropdown-search-field__input:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__input:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.dropdown-search-field__input--locked:read-only:not(:disabled){cursor:text;opacity:1}.dropdown-search-field__input:read-only:not(:disabled):not(.dropdown-search-field__input--locked){cursor:default;opacity:1;color:var(--ui-field-readonly-input-text)}.dropdown-search-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.dropdown-search-field__trigger-suffix:not(:has(>*)){display:none}.dropdown-search-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.dropdown-search-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.dropdown-search-field__chevron-btn:focus,.dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .dropdown-search-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn .dropdown-search-field__chevron-icon{color:inherit}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus,:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.dropdown-search-field--invalid .dropdown-search-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.dropdown-search-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.dropdown-search-field__panel-inner{display:block;width:100%;max-height:min(280px,45vh);box-sizing:border-box;overflow:hidden;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.dropdown-search-field__list{margin:0;padding:.25rem 0;width:100%;max-height:min(280px,45vh);box-sizing:border-box;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.dropdown-search-field__loading-more{margin:0;padding:.5rem .75rem;font-size:.8125rem;line-height:1.25;color:var(--app-color-text-muted, #6b7280);text-align:center;-webkit-user-select:none;user-select:none}.dropdown-search-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.9rem;line-height:1.35;font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.dropdown-search-field__loading{padding:.65rem .75rem;font-size:.85rem;line-height:1.35;color:var(--ui-field-float-label-color);text-align:center}.dropdown-search-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.45rem .75rem;font-size:.95rem;line-height:1.35;cursor:pointer;color:var(--ui-field-float-input-text)}.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.dropdown-search-field__option--active:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.dropdown-search-field__option.dropdown-search-field__option--active.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.dropdown-search-field__option--disabled{opacity:.45;cursor:not-allowed}.dropdown-search-field__option:hover:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.dropdown-search-field__option.dropdown-search-field__option--selected:hover:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "hint", "hintId", "required", "showRequiredMark", "invalid", "invalidThemed", "filled", "labelAlwaysFloated", "disabled", "readonly", "size", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }, { kind: "component", type: DropdownBaseComponent, selector: "app-dropdown-base", inputs: ["open", "panelTemplate", "panelWidthPx", "closeOnEscape", "hasBackdrop", "connectedPositions", "pushConnectedOverlay", "flexibleConnectedOverlay", "connectedOverlayViewportMargin", "lockConnectedOverlayPosition", "scrollStrategy", "bareOverlayPanel"], outputs: ["openChange"] }, { kind: "component", type: SkeletonListComponent, selector: "app-skeleton-list", inputs: ["rows", "leading", "rowGap", "lineHeight", "animate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "optionsPanelTpl", first: true, predicate: ["optionsPanelTpl"], descendants: true, static: true }, { propertyName: "dropdownTriggerRootRef", first: true, predicate: ["dropdownFieldTriggerRoot"], descendants: true, read: ElementRef }, { propertyName: "dropdownBase", first: true, predicate: DropdownBaseComponent, descendants: true }, { propertyName: "nativeInputRef", first: true, predicate: ["nativeInput"], descendants: true, read: ElementRef }, { propertyName: "optionsListRef", first: true, predicate: ["optionsListEl"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\" [loading]=\"loading\" [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\"\n  [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\"\n  [contextMenuId]=\"contextMenuId\" (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"dropdown-search-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [flexibleConnectedOverlay]=\"false\" (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"dropdown-search-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <input #nativeInput type=\"text\" class=\"dropdown-search-field__input\"\n          [class.dropdown-search-field__input--locked]=\"isLockedSelectionDisplay\" [id]=\"controlId\"\n          [attr.name]=\"name || null\" [disabled]=\"disabled\" [readonly]=\"isNativeInputReadonly\"\n          [attr.tabindex]=\"readonly ? -1 : null\" [attr.placeholder]=\"''\"\n          autocomplete=\"off\" spellcheck=\"false\" [attr.aria-expanded]=\"panelOpen\" aria-autocomplete=\"list\"\n          role=\"combobox\" [attr.aria-controls]=\"panelOpen ? optionsListId : null\" [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Buscar e selecionar'\" [value]=\"searchQuery\"\n          (focus)=\"onMainFocus()\" (input)=\"onMainInput($event)\" (keydown)=\"onMainKeydown($event)\"\n          (blur)=\"onMainBlur($event)\" />\n        <span class=\"dropdown-search-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"dropdown-search-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista\" (click)=\"openToggle()\">\n          <i class=\"fa-solid fa-chevron-down dropdown-search-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"dropdown-search-field__panel-inner\" [ngStyle]=\"panelTypographyStyle\" (mousedown)=\"$event.preventDefault()\">\n    <div #optionsListEl class=\"dropdown-search-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n      [attr.aria-label]=\"floatLabelCaption || 'Op\u00E7\u00F5es'\" (blur)=\"onMainBlur($event)\"\n      (keydown)=\"onSearchListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n      @if (listOptions.length === 0 && (optionsLoading || loadingMore)) {\n      <app-skeleton-list [rows]=\"1\" />\n      }\n      @if (listOptions.length === 0 && !optionsLoading && !loadingMore) {\n      <div class=\"dropdown-search-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n      }\n      @for (opt of listOptions; track trackOption($index, opt)) {\n      <div role=\"option\" class=\"dropdown-search-field__option\"\n        [class.dropdown-search-field__option--disabled]=\"opt.disabled\"\n        [class.dropdown-search-field__option--selected]=\"isSelected(opt)\"\n        [class.dropdown-search-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n        [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n        (keydown)=\"onOptionRowKeydown($event, opt)\">\n        {{ opt.label }}\n      </div>\n      }\n      @if (options.length > 0 && loadingMore) {\n      <div class=\"dropdown-search-field__loading-more\" role=\"status\" aria-live=\"polite\">Carregando\u2026</div>\n      }\n    </div>\n  </div>\n</ng-template>", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field__float-label{right:6.75rem}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.dropdown-search-field__wrap{display:flex;flex:1;align-items:stretch;min-width:0;width:100%;box-sizing:border-box}.dropdown-search-field__origin{display:flex;align-items:center;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.dropdown-search-field__input{flex:1;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:text;display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-search-field__input:-webkit-autofill,.dropdown-search-field__input:-webkit-autofill:hover,.dropdown-search-field__input:-webkit-autofill:focus,.dropdown-search-field__input:-webkit-autofill:active,.dropdown-search-field__input:-webkit-autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:-webkit-autofill:first-line,.dropdown-search-field__input:-webkit-autofill:hover:first-line,.dropdown-search-field__input:-webkit-autofill:focus:first-line,.dropdown-search-field__input:-webkit-autofill:active:first-line,.dropdown-search-field__input:-webkit-autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:autofill,.dropdown-search-field__input:autofill:hover,.dropdown-search-field__input:autofill:focus,.dropdown-search-field__input:autofill:active,.dropdown-search-field__input:autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;background-color:var(--ui-field-float-bg)!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:autofill:first-line,.dropdown-search-field__input:autofill:hover:first-line,.dropdown-search-field__input:autofill:focus:first-line,.dropdown-search-field__input:autofill:active:first-line,.dropdown-search-field__input:autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:-internal-autofill-previewed,.dropdown-search-field__input:-internal-autofill-previewed:first-line,.dropdown-search-field__input:-internal-autofill-selected,.dropdown-search-field__input:-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.dropdown-search-field__input:focus,.dropdown-search-field__input:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__input:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.dropdown-search-field__input--locked:read-only:not(:disabled){cursor:text;opacity:1}.dropdown-search-field__input:read-only:not(:disabled):not(.dropdown-search-field__input--locked){cursor:default;opacity:1;color:var(--ui-field-readonly-input-text)}.dropdown-search-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.dropdown-search-field__trigger-suffix:not(:has(>*)){display:none}.dropdown-search-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.dropdown-search-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.dropdown-search-field__chevron-btn:focus,.dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .dropdown-search-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn .dropdown-search-field__chevron-icon{color:inherit}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus,:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.dropdown-search-field--invalid .dropdown-search-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.dropdown-search-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.dropdown-search-field__panel-inner{display:block;width:100%;max-height:min(280px,45vh);box-sizing:border-box;overflow:hidden;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.dropdown-search-field__list{margin:0;padding:.25rem 0;width:100%;max-height:min(280px,45vh);box-sizing:border-box;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.dropdown-search-field__loading-more{margin:0;padding:.5rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--app-color-text-muted, #6b7280);text-align:center;-webkit-user-select:none;user-select:none}.dropdown-search-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.dropdown-search-field__loading{padding:.65rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-label-color);text-align:center}.dropdown-search-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);padding:.45rem .75rem;cursor:pointer;color:var(--ui-field-float-input-text)}.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.dropdown-search-field__option--active:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.dropdown-search-field__option.dropdown-search-field__option--active.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.dropdown-search-field__option--disabled{opacity:.45;cursor:not-allowed}.dropdown-search-field__option:hover:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.dropdown-search-field__option.dropdown-search-field__option--selected:hover:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.dropdown-search-field__value-btn,.dropdown-search-field__input{--structra-field-input-font-size: 1rem;--structra-field-input-line-height: 1.35;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height);font-family:inherit;font-weight:var(--field-value-weight, var(--structra-body-weight));-webkit-text-size-adjust:100%}:host ::ng-deep .base-field--size-sm .dropdown-search-field__value-btn,:host ::ng-deep .base-field--size-sm .dropdown-search-field__input{--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}:host ::ng-deep .base-field--size-lg .dropdown-search-field__value-btn,:host ::ng-deep .base-field--size-lg .dropdown-search-field__input{--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}\n"], dependencies: [{ kind: "component", type: BaseFieldComponent, selector: "app-base-field", inputs: ["label", "errorMessage", "hint", "hintId", "required", "showRequiredMark", "invalid", "invalidThemed", "filled", "labelAlwaysFloated", "disabled", "readonly", "size", "inputId", "errorId", "showPrefixIcon", "prefixIcon", "clearable", "clearAriaLabel", "showSuffixSlot", "valueAlignEnd", "loading", "skeletonVariant", "mostrarMenuContexto", "contextMenuItems", "contextMenuId"], outputs: ["clear", "contextMenuSelect"] }, { kind: "component", type: DropdownBaseComponent, selector: "app-dropdown-base", inputs: ["open", "panelTemplate", "panelWidthPx", "closeOnEscape", "hasBackdrop", "connectedPositions", "pushConnectedOverlay", "flexibleConnectedOverlay", "connectedOverlayViewportMargin", "lockConnectedOverlayPosition", "scrollStrategy", "bareOverlayPanel"], outputs: ["openChange"] }, { kind: "component", type: SkeletonListComponent, selector: "app-skeleton-list", inputs: ["rows", "leading", "rowGap", "lineHeight", "animate"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: DropdownSearchFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-dropdown-search-field', imports: [BaseFieldComponent, DropdownBaseComponent, SkeletonListComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+            args: [{ selector: 'app-dropdown-search-field', imports: [BaseFieldComponent, DropdownBaseComponent, SkeletonListComponent, NgStyle], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => DropdownSearchFieldComponent),
                             multi: true,
                         },
-                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\" [loading]=\"loading\" [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\"\n  [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\"\n  [contextMenuId]=\"contextMenuId\" (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"dropdown-search-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [flexibleConnectedOverlay]=\"false\" (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"dropdown-search-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <input #nativeInput type=\"text\" class=\"dropdown-search-field__input\"\n          [class.dropdown-search-field__input--locked]=\"isLockedSelectionDisplay\" [id]=\"controlId\"\n          [attr.name]=\"name || null\" [disabled]=\"disabled\" [readonly]=\"isNativeInputReadonly\"\n          [attr.tabindex]=\"readonly ? -1 : null\" [attr.placeholder]=\"''\"\n          autocomplete=\"off\" spellcheck=\"false\" [attr.aria-expanded]=\"panelOpen\" aria-autocomplete=\"list\"\n          role=\"combobox\" [attr.aria-controls]=\"panelOpen ? optionsListId : null\" [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Buscar e selecionar'\" [value]=\"searchQuery\"\n          (focus)=\"onMainFocus()\" (input)=\"onMainInput($event)\" (keydown)=\"onMainKeydown($event)\"\n          (blur)=\"onMainBlur($event)\" />\n        <span class=\"dropdown-search-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"dropdown-search-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista\" (click)=\"openToggle()\">\n          <i class=\"fa-solid fa-chevron-down dropdown-search-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"dropdown-search-field__panel-inner\" (mousedown)=\"$event.preventDefault()\">\n    <div #optionsListEl class=\"dropdown-search-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n      [attr.aria-label]=\"floatLabelCaption || 'Op\u00E7\u00F5es'\" (blur)=\"onMainBlur($event)\"\n      (keydown)=\"onSearchListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n      @if (listOptions.length === 0 && (optionsLoading || loadingMore)) {\n      <app-skeleton-list [rows]=\"1\" />\n      }\n      @if (listOptions.length === 0 && !optionsLoading && !loadingMore) {\n      <div class=\"dropdown-search-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n      }\n      @for (opt of listOptions; track trackOption($index, opt)) {\n      <div role=\"option\" class=\"dropdown-search-field__option\"\n        [class.dropdown-search-field__option--disabled]=\"opt.disabled\"\n        [class.dropdown-search-field__option--selected]=\"isSelected(opt)\"\n        [class.dropdown-search-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n        [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n        (keydown)=\"onOptionRowKeydown($event, opt)\">\n        {{ opt.label }}\n      </div>\n      }\n      @if (options.length > 0 && loadingMore) {\n      <div class=\"dropdown-search-field__loading-more\" role=\"status\" aria-live=\"polite\">Carregando\u2026</div>\n      }\n    </div>\n  </div>\n</ng-template>", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field__float-label{right:6.75rem}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.dropdown-search-field__wrap{display:flex;flex:1;align-items:stretch;min-width:0;width:100%;box-sizing:border-box}.dropdown-search-field__origin{display:flex;align-items:center;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.dropdown-search-field__input{flex:1;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;font-size:1rem;line-height:1.35;font-family:inherit;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:text;display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-search-field__input:-webkit-autofill,.dropdown-search-field__input:-webkit-autofill:hover,.dropdown-search-field__input:-webkit-autofill:focus,.dropdown-search-field__input:-webkit-autofill:active,.dropdown-search-field__input:-webkit-autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:-webkit-autofill:first-line,.dropdown-search-field__input:-webkit-autofill:hover:first-line,.dropdown-search-field__input:-webkit-autofill:focus:first-line,.dropdown-search-field__input:-webkit-autofill:active:first-line,.dropdown-search-field__input:-webkit-autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:autofill,.dropdown-search-field__input:autofill:hover,.dropdown-search-field__input:autofill:focus,.dropdown-search-field__input:autofill:active,.dropdown-search-field__input:autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;background-color:var(--ui-field-float-bg)!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:autofill:first-line,.dropdown-search-field__input:autofill:hover:first-line,.dropdown-search-field__input:autofill:focus:first-line,.dropdown-search-field__input:autofill:active:first-line,.dropdown-search-field__input:autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:-internal-autofill-previewed,.dropdown-search-field__input:-internal-autofill-previewed:first-line,.dropdown-search-field__input:-internal-autofill-selected,.dropdown-search-field__input:-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.dropdown-search-field__input:focus,.dropdown-search-field__input:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__input:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.dropdown-search-field__input--locked:read-only:not(:disabled){cursor:text;opacity:1}.dropdown-search-field__input:read-only:not(:disabled):not(.dropdown-search-field__input--locked){cursor:default;opacity:1;color:var(--ui-field-readonly-input-text)}.dropdown-search-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.dropdown-search-field__trigger-suffix:not(:has(>*)){display:none}.dropdown-search-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.dropdown-search-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.dropdown-search-field__chevron-btn:focus,.dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .dropdown-search-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn .dropdown-search-field__chevron-icon{color:inherit}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus,:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.dropdown-search-field--invalid .dropdown-search-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.dropdown-search-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.dropdown-search-field__panel-inner{display:block;width:100%;max-height:min(280px,45vh);box-sizing:border-box;overflow:hidden;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.dropdown-search-field__list{margin:0;padding:.25rem 0;width:100%;max-height:min(280px,45vh);box-sizing:border-box;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.dropdown-search-field__loading-more{margin:0;padding:.5rem .75rem;font-size:.8125rem;line-height:1.25;color:var(--app-color-text-muted, #6b7280);text-align:center;-webkit-user-select:none;user-select:none}.dropdown-search-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.9rem;line-height:1.35;font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.dropdown-search-field__loading{padding:.65rem .75rem;font-size:.85rem;line-height:1.35;color:var(--ui-field-float-label-color);text-align:center}.dropdown-search-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.45rem .75rem;font-size:.95rem;line-height:1.35;cursor:pointer;color:var(--ui-field-float-input-text)}.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.dropdown-search-field__option--active:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.dropdown-search-field__option.dropdown-search-field__option--active.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.dropdown-search-field__option--disabled{opacity:.45;cursor:not-allowed}.dropdown-search-field__option:hover:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.dropdown-search-field__option.dropdown-search-field__option--selected:hover:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}\n"] }]
+                    ], template: "<app-base-field [label]=\"floatLabelCaption\" [filled]=\"filledUi\" [disabled]=\"disabled\" [readonly]=\"readonly\"\n  [size]=\"effectiveFieldSize\" [loading]=\"loading\" [errorMessage]=\"uiErrorMessage\" [required]=\"requiredEffective\"\n  [showRequiredMark]=\"showRequiredMark\" [invalid]=\"uiInvalid\" [invalidThemed]=\"invalidThemed\" [inputId]=\"controlId\"\n  [errorId]=\"errorElementId\" [hint]=\"hint\" [hintId]=\"hintElementId\" [showPrefixIcon]=\"showPrefixIcon\" [prefixIcon]=\"prefixIcon\" [clearable]=\"clearable\"\n  [clearAriaLabel]=\"clearAriaLabel\" [showSuffixSlot]=\"true\"\n  [mostrarMenuContexto]=\"mostrarMenuContexto\" [contextMenuItems]=\"contextMenuItems\"\n  [contextMenuId]=\"contextMenuId\" (clear)=\"onClear()\" (contextMenuSelect)=\"contextMenuSelect.emit($event)\">\n  <ng-content select=\"[appFieldPrefix]\" />\n  <div class=\"dropdown-search-field__wrap\">\n    <app-dropdown-base [open]=\"panelOpen\" [panelTemplate]=\"optionsPanelTpl\" [panelWidthPx]=\"panelOverlayWidth\"\n      [flexibleConnectedOverlay]=\"false\" (openChange)=\"onDropdownOpenChange($event)\">\n      <div #dropdownFieldTriggerRoot class=\"dropdown-search-field__origin\" appDropdownTrigger\n        (keydown)=\"onTriggerKeydown($event)\">\n        <input #nativeInput type=\"text\" class=\"dropdown-search-field__input\"\n          [class.dropdown-search-field__input--locked]=\"isLockedSelectionDisplay\" [id]=\"controlId\"\n          [attr.name]=\"name || null\" [disabled]=\"disabled\" [readonly]=\"isNativeInputReadonly\"\n          [attr.tabindex]=\"readonly ? -1 : null\" [attr.placeholder]=\"''\"\n          autocomplete=\"off\" spellcheck=\"false\" [attr.aria-expanded]=\"panelOpen\" aria-autocomplete=\"list\"\n          role=\"combobox\" [attr.aria-controls]=\"panelOpen ? optionsListId : null\" [attr.aria-invalid]=\"uiInvalid\"\n          [attr.aria-describedby]=\"uiAriaDescribedBy\"\n          [attr.aria-label]=\"floatLabelCaption || placeholder || 'Buscar e selecionar'\" [value]=\"searchQuery\"\n          (focus)=\"onMainFocus()\" (input)=\"onMainInput($event)\" (keydown)=\"onMainKeydown($event)\"\n          (blur)=\"onMainBlur($event)\" />\n        <span class=\"dropdown-search-field__trigger-suffix\">\n          <ng-content select=\"[appMultiselectTriggerSuffix]\" />\n        </span>\n        <button type=\"button\" class=\"dropdown-search-field__chevron-btn\" tabindex=\"-1\" [disabled]=\"disabled || readonly\"\n          [attr.aria-expanded]=\"panelOpen\" aria-haspopup=\"listbox\" aria-label=\"Abrir lista\" (click)=\"openToggle()\">\n          <i class=\"fa-solid fa-chevron-down dropdown-search-field__chevron-icon\" aria-hidden=\"true\"></i>\n        </button>\n      </div>\n    </app-dropdown-base>\n  </div>\n</app-base-field>\n\n<ng-template #optionsPanelTpl>\n  <div class=\"dropdown-search-field__panel-inner\" [ngStyle]=\"panelTypographyStyle\" (mousedown)=\"$event.preventDefault()\">\n    <div #optionsListEl class=\"dropdown-search-field__list\" [id]=\"optionsListId\" role=\"listbox\" tabindex=\"-1\"\n      [attr.aria-label]=\"floatLabelCaption || 'Op\u00E7\u00F5es'\" (blur)=\"onMainBlur($event)\"\n      (keydown)=\"onSearchListKeydown($event)\" (scroll)=\"onOptionsListScroll($event)\">\n      @if (listOptions.length === 0 && (optionsLoading || loadingMore)) {\n      <app-skeleton-list [rows]=\"1\" />\n      }\n      @if (listOptions.length === 0 && !optionsLoading && !loadingMore) {\n      <div class=\"dropdown-search-field__empty\" role=\"status\" aria-live=\"polite\">{{ emptyOptionsMessage }}</div>\n      }\n      @for (opt of listOptions; track trackOption($index, opt)) {\n      <div role=\"option\" class=\"dropdown-search-field__option\"\n        [class.dropdown-search-field__option--disabled]=\"opt.disabled\"\n        [class.dropdown-search-field__option--selected]=\"isSelected(opt)\"\n        [class.dropdown-search-field__option--active]=\"!opt.disabled && activeIndex === $index\"\n        [attr.tabindex]=\"opt.disabled ? null : -1\" [attr.aria-selected]=\"isSelected(opt)\" (click)=\"selectOption(opt)\"\n        (keydown)=\"onOptionRowKeydown($event, opt)\">\n        {{ opt.label }}\n      </div>\n      }\n      @if (options.length > 0 && loadingMore) {\n      <div class=\"dropdown-search-field__loading-more\" role=\"status\" aria-live=\"polite\">Carregando\u2026</div>\n      }\n    </div>\n  </div>\n</ng-template>", styles: ["@charset \"UTF-8\";@keyframes structraNativeAutofillStart{0%{opacity:1}to{opacity:1}}:host{display:block;width:100%;box-sizing:border-box}:host ::ng-deep .base-field__float-label{right:6.75rem}:host ::ng-deep .base-field:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-float-border-focus);box-shadow:0 0 0 3px var(--ui-field-float-focus-ring)}:host ::ng-deep .base-field--invalid:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}:host ::ng-deep .base-field.base-field--readonly:not(.base-field--invalid):not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-readonly-border-focus);box-shadow:0 0 0 3px var(--ui-field-readonly-focus-ring)}:host ::ng-deep .base-field.base-field--invalid.base-field--readonly:not(.base-field--disabled) .base-field__box:focus-within{border-color:var(--ui-field-input-invalid-border);box-shadow:0 0 0 3px var(--ui-field-input-invalid-focus-halo)}.dropdown-search-field__wrap{display:flex;flex:1;align-items:stretch;min-width:0;width:100%;box-sizing:border-box}.dropdown-search-field__origin{display:flex;align-items:center;min-width:0;width:100%;min-height:calc(1.8rem + 1.35em);box-sizing:border-box}.dropdown-search-field__input{flex:1;margin:0;box-sizing:border-box;min-height:calc(1.8rem + 1.35em);padding:1.35rem .35rem .45rem .75rem;text-align:left;color:var(--ui-field-float-input-text);background:transparent;border:0;border-radius:0;box-shadow:none;cursor:text;display:block;width:100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-search-field__input:-webkit-autofill,.dropdown-search-field__input:-webkit-autofill:hover,.dropdown-search-field__input:-webkit-autofill:focus,.dropdown-search-field__input:-webkit-autofill:active,.dropdown-search-field__input:-webkit-autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:-webkit-autofill:first-line,.dropdown-search-field__input:-webkit-autofill:hover:first-line,.dropdown-search-field__input:-webkit-autofill:focus:first-line,.dropdown-search-field__input:-webkit-autofill:active:first-line,.dropdown-search-field__input:-webkit-autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:autofill,.dropdown-search-field__input:autofill:hover,.dropdown-search-field__input:autofill:focus,.dropdown-search-field__input:autofill:active,.dropdown-search-field__input:autofill:focus-visible{animation-name:structraNativeAutofillStart;animation-duration:1ms;font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;min-height:calc(1.8rem + 1.35em);-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important;caret-color:var(--ui-field-float-input-text)!important;-webkit-box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;box-shadow:0 0 0 1000px var(--ui-field-float-bg) inset!important;background-color:var(--ui-field-float-bg)!important;transition:background-color 50000s ease 0s!important}.dropdown-search-field__input:autofill:first-line,.dropdown-search-field__input:autofill:hover:first-line,.dropdown-search-field__input:autofill:focus:first-line,.dropdown-search-field__input:autofill:active:first-line,.dropdown-search-field__input:autofill:focus-visible:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%;-webkit-text-fill-color:var(--ui-field-float-input-text)!important}.dropdown-search-field__input:-internal-autofill-previewed,.dropdown-search-field__input:-internal-autofill-previewed:first-line,.dropdown-search-field__input:-internal-autofill-selected,.dropdown-search-field__input:-internal-autofill-selected:first-line{font-size:16px!important;line-height:21.6px!important;font-family:inherit!important;font-weight:inherit!important;-webkit-text-size-adjust:100%}.dropdown-search-field__input:focus,.dropdown-search-field__input:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__input:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}.dropdown-search-field__input--locked:read-only:not(:disabled){cursor:text;opacity:1}.dropdown-search-field__input:read-only:not(:disabled):not(.dropdown-search-field__input--locked){cursor:default;opacity:1;color:var(--ui-field-readonly-input-text)}.dropdown-search-field__trigger-suffix{display:flex;flex-shrink:0;align-items:center;align-self:center;box-sizing:border-box;padding-top:3px}.dropdown-search-field__trigger-suffix:not(:has(>*)){display:none}.dropdown-search-field__chevron-btn{display:flex;flex-shrink:0;align-items:center;justify-content:center;box-sizing:border-box;width:2rem;height:2rem;margin:0 .1rem;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ui-field-float-prefix-color);cursor:pointer;user-select:none;-webkit-user-select:none;transition:background .15s ease,color .15s ease}.dropdown-search-field__chevron-btn:hover:not(:disabled){background:#5a7fa31f;color:var(--ui-field-float-label-top-color)}.dropdown-search-field__chevron-btn:focus,.dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}.dropdown-search-field__chevron-btn:disabled{cursor:not-allowed;opacity:var(--ui-field-input-disabled-opacity)}:host ::ng-deep .base-field--readonly:not(.base-field--disabled) .dropdown-search-field__chevron-btn:disabled{opacity:1;cursor:default;color:var(--ui-field-readonly-prefix-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn{color:var(--ui-field-float-label-invalid-color)}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn .dropdown-search-field__chevron-icon{color:inherit}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:hover:not(:disabled){background:#b91c1c1f}:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus,:host.dropdown-search-field--invalid .dropdown-search-field__chevron-btn:focus-visible{outline:none;box-shadow:none}:host.dropdown-search-field--invalid .dropdown-search-field__trigger-suffix{--ui-field-float-prefix-color: var(--ui-field-float-label-invalid-color);--ui-field-float-label-top-color: var(--ui-field-float-label-invalid-color);--ui-field-icon-slot-hover-bg: rgba(185, 28, 28, .12);color:var(--ui-field-float-label-invalid-color)}.dropdown-search-field__chevron-icon{display:inline-flex;align-items:center;justify-content:center;padding-top:2px;font-size:.8rem;line-height:1}.dropdown-search-field__panel-inner{display:block;width:100%;max-height:min(280px,45vh);box-sizing:border-box;overflow:hidden;background:var(--app-color-nav-surface, var(--app-color-surface, #fff))}.dropdown-search-field__list{margin:0;padding:.25rem 0;width:100%;max-height:min(280px,45vh);box-sizing:border-box;outline:none;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.dropdown-search-field__loading-more{margin:0;padding:.5rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--app-color-text-muted, #6b7280);text-align:center;-webkit-user-select:none;user-select:none}.dropdown-search-field__empty{margin:0;padding:.85rem .75rem;min-height:3rem;box-sizing:border-box;display:flex;align-items:center;justify-content:center;text-align:center;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);font-weight:var(--structra-body-weight, 400);color:var(--app-color-text-muted, #6b7280);user-select:none;-webkit-user-select:none}.dropdown-search-field__loading{padding:.65rem .75rem;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);color:var(--ui-field-float-label-color);text-align:center}.dropdown-search-field__option{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--structra-field-input-font-size, .875rem);line-height:var(--structra-field-input-line-height, 1.35);padding:.45rem .75rem;cursor:pointer;color:var(--ui-field-float-input-text)}.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg)}.dropdown-search-field__option--active:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-highlight-bg)}.dropdown-search-field__option.dropdown-search-field__option--active.dropdown-search-field__option--selected:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-bg-active)}.dropdown-search-field__option--disabled{opacity:.45;cursor:not-allowed}.dropdown-search-field__option:hover:not(.dropdown-search-field__option--disabled):not(.dropdown-search-field__option--selected){background:var(--app-color-dropdown-option-hover-bg)}.dropdown-search-field__option.dropdown-search-field__option--selected:hover:not(.dropdown-search-field__option--disabled){background:var(--app-color-dropdown-option-selected-hover-bg)}.dropdown-search-field__value-btn,.dropdown-search-field__input{--structra-field-input-font-size: 1rem;--structra-field-input-line-height: 1.35;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height);font-family:inherit;font-weight:var(--field-value-weight, var(--structra-body-weight));-webkit-text-size-adjust:100%}:host ::ng-deep .base-field--size-sm .dropdown-search-field__value-btn,:host ::ng-deep .base-field--size-sm .dropdown-search-field__input{--structra-field-input-font-size: .8125rem;--structra-field-input-line-height: 1.25;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}:host ::ng-deep .base-field--size-lg .dropdown-search-field__value-btn,:host ::ng-deep .base-field--size-lg .dropdown-search-field__input{--structra-field-input-font-size: 1.0625rem;--structra-field-input-line-height: 1.4;font-size:var(--structra-field-input-font-size);line-height:var(--structra-field-input-line-height)}\n"] }]
         }], propDecorators: { hostInvalidClass: [{
                 type: HostBinding,
                 args: ['class.dropdown-search-field--invalid']