@govbr-ds/webcomponents 2.1.3 → 2.2.0

package/dist/collection/components/skip-link/skip-link.js

@@ -4,13 +4,42 @@
  */
 import { Host, h, } from "@stencil/core";
 import { generateUniqueId } from "../../shared/utils/id";
+import { findComposedOwner } from "../../shared/utils/ownership";
+import { resolveAllowedPropValue, resolveIntegerPropValue } from "../../shared/utils/props";
 const ALT_SHORTCUT_REGEX = /^[1-9]$/;
 /**
- * Para a documentação completa, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/skip-link?tab=designer).
+ * O componente `br-skip-link` é o bloco essencial de acessibilidade posicionado no topo da página, permitindo que pessoas que utilizam teclado ou tecnologias assistivas saltem blocos repetitivos e acessem diretamente áreas principais da aplicação.
  *
+ * ### Para que serve
+ *
+ * - **Atalho de teclado imediato:** Fornece links diretos ("Ir para o conteúdo principal", "Ir para o menu", "Ir para a busca", "Ir para o rodapé") logo no primeiro acionamento da tecla Tab.
+ * - **Conformidade WCAG obrigatória:** Atende ao critério de sucesso 2.4.1 (Bypass Blocks) da WCAG 2.1, essencial para portais e serviços públicos.
+ * - **Comportamento visual discreto:** Permanece oculto visualmente por padrão, tornando-se visível imediatamente assim que recebe o foco do teclado.
+ *
+ * ### Quando utilizar
+ *
+ * - **Utilize quando:**
+ *   - Obrigatoriamente em todas as páginas e aplicações do GovBR-DS, posicionado como o primeiro elemento interativo do corpo do documento.
+ * - **Evite e prefira outro componente quando:**
+ *   - O link tiver a intenção de navegação comum no corpo do texto (use `br-link`).
+ *
+ * ### Composição e Subcomponentes
+ *
+ * | Subcomponente | Papel | Regra de uso |
+ * | --- | --- | --- |
+ * | `br-skip-link` | **Orquestrador de atalhos.** Agrupa a lista de links rápidos e gerencia visibilidade no foco. | Deve ser o primeiro elemento interativo no topo da página. |
+ * | `br-skip-link-item` | **Item individual de atalho.** Especifica o destino e o texto do salto. | Declarado no slot padrão do `br-skip-link`. |
+ *
+ * ### Como os subcomponentes se relacionam
+ *
+ * O `br-skip-link` atua como contêiner que abriga múltiplos elementos `br-skip-link-item`. Cada item referencia o `id` do elemento de destino na página (ex.: `#main-content`), conduzindo o foco imediatamente para a região desejada.
+ *
+ * Para a documentação completa de design, incluindo diretrizes de acessibilidade e especificações visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/skip-link?tab=designer).
+ *
+
  * @category Navegação
  * @status stable
- * @slot default - Slot para inserir os itens de navegação rápida (br-skiplink-item).
+ * @slot default - Slot para inserir os itens de navegação rápida (br-skip-link-item). A tag br-skiplink-item é aceita por compatibilidade.
  *
  * @part container - Parte para o contêiner principal do componente skip-link, usada para estilização via ::part().
  */
@@ -48,6 +77,7 @@ export class SkipLink {
          * Define se o skip link apresenta um ou múltiplos itens visíveis.
          * - 'simple': Exibe apenas um item por vez.
          * - 'compound': Exibe uma lista com múltiplos itens.
+         * Valores inválidos usam 'compound'.
          */
         this.variant = 'compound';
         /**
@@ -55,11 +85,13 @@ export class SkipLink {
          * - 'top-left': Posicionado no canto superior esquerdo.
          * - 'top-center': Posicionado no centro superior.
          * - 'top-right': Posicionado no canto superior direito.
+         * Valores inválidos usam 'top-left'.
          */
         this.position = 'top-left';
         /**
          * Define o z-index do componente.
          * Controla a ordem de empilhamento do componente na página.
+         * Deve ser um inteiro entre 0 e Number.MAX_SAFE_INTEGER; valores inválidos usam 0.
          */
         this.zIndex = null;
         this.globalKeyHandler = (event) => {
@@ -93,14 +125,26 @@ export class SkipLink {
             }
         };
     }
+    get effectiveVariant() {
+        return resolveAllowedPropValue(this.el, 'variant', this.variant, ['simple', 'compound'], 'compound');
+    }
+    get effectivePosition() {
+        return resolveAllowedPropValue(this.el, 'position', this.position, ['top-left', 'top-center', 'top-right'], 'top-left');
+    }
+    get effectiveZIndex() {
+        return resolveIntegerPropValue(this.el, 'zIndex', this.zIndex, 0, Number.MAX_SAFE_INTEGER, 0, {
+            allowNull: true,
+        });
+    }
     handleOpenChange() {
         this.isVisible = this.open;
         this.updateItemCounts();
     }
     updateStyles() {
-        if (this.zIndex !== null && this.zIndex !== undefined) {
-            this.el.style.zIndex = `${this.zIndex}`;
-            this.el.style.setProperty('--skiplink-layer', `${this.zIndex}`);
+        const zIndex = this.effectiveZIndex;
+        if (zIndex !== null && zIndex !== undefined) {
+            this.el.style.zIndex = `${zIndex}`;
+            this.el.style.setProperty('--skiplink-layer', `${zIndex}`);
         }
     }
     /**
@@ -128,6 +172,7 @@ export class SkipLink {
     }
     componentWillLoad() {
         this.isVisible = this.open;
+        this.updateStyles();
         const parentElement = this.el.parentElement;
         if (parentElement !== null) {
             this.containerWidth = parentElement.clientWidth;
@@ -148,7 +193,8 @@ export class SkipLink {
     /**
      * Listener para evento de foco no componente.
      */
-    handleFocusIn() {
+    handleFocusIn(event) {
+        this.setFocusedItem(event.composedPath());
         if (!this.isVisible) {
             this.show();
         }
@@ -199,12 +245,6 @@ export class SkipLink {
             if (typeof firstItem.itemFocus === 'function') {
                 await firstItem.itemFocus();
             }
-            else {
-                const focusableElement = firstItem.shadowRoot?.querySelector('a, button');
-                if (focusableElement !== null) {
-                    focusableElement.focus();
-                }
-            }
         }
         this.brDidShow.emit();
         this.brSkipLinkShow.emit();
@@ -230,19 +270,24 @@ export class SkipLink {
      * Manipulador global para atalhos de teclado Alt+[número].
      */
     getSkipLinkItems() {
-        return Array.from(this.el.querySelectorAll('br-skiplink-item, br-skip-link-item')).flatMap((element) => {
-            if (element.tagName.toLowerCase() === 'br-skiplink-item') {
-                return [element];
-            }
-            const legacyItem = element.shadowRoot?.querySelector('br-skiplink-item');
-            return legacyItem ? [legacyItem] : [];
+        return Array.from(this.el.querySelectorAll('br-skiplink-item, br-skip-link-item')).filter((element) => findComposedOwner(element, 'br-skip-link') === this.el);
+    }
+    setFocusedItem(path) {
+        const effectiveVariant = this.isSmallScreen || this.needsSimpleMode ? 'simple' : this.effectiveVariant;
+        if (effectiveVariant === 'compound')
+            return;
+        const focusedItem = this.getSkipLinkItems().find((item) => path.includes(item));
+        if (focusedItem === undefined)
+            return;
+        this.getSkipLinkItems().forEach((item) => {
+            item.classList.toggle('open', item === focusedItem);
         });
     }
     /**
      * Calcula a largura total dos itens do skip-link e determina se deve usar modo simple ou compound.
      */
     calculateItemsWidth() {
-        requestAnimationFrame(() => {
+        requestAnimationFrame(async () => {
             const items = this.getSkipLinkItems();
             if (items.length === 0 || this.isSmallScreen)
                 return;
@@ -251,7 +296,7 @@ export class SkipLink {
                 return;
             }
             this.needsSimpleMode = false;
-            const totalWidth = this.sumItemsWidth(items);
+            const totalWidth = await this.sumItemsWidth(items);
             const availableWidth = this.calculateAvailableWidth();
             if (totalWidth > availableWidth) {
                 this.needsSimpleMode = true;
@@ -261,15 +306,13 @@ export class SkipLink {
     /**
      * Soma a largura de todos os itens do skip-link
      */
-    sumItemsWidth(items) {
+    async sumItemsWidth(items) {
         let total = 0;
-        items.forEach((item) => {
-            const brItem = item.shadowRoot?.querySelector('br-item');
-            if (brItem === null)
-                return;
-            const width = brItem.offsetWidth || brItem.scrollWidth || brItem.getBoundingClientRect().width;
-            total += width;
-        });
+        for (const item of items) {
+            const getItemWidth = item.getItemWidth;
+            if (typeof getItemWidth === 'function')
+                total += (await getItemWidth.call(item)) || 0;
+        }
         return total;
     }
     /**
@@ -293,7 +336,7 @@ export class SkipLink {
      * A contagem é exibida quando o componente está em modo simple (incluindo modo responsivo).
      */
     updateItemCounts() {
-        const effectiveVariant = this.isSmallScreen || this.needsSimpleMode ? 'simple' : this.variant;
+        const effectiveVariant = this.isSmallScreen || this.needsSimpleMode ? 'simple' : this.effectiveVariant;
         const shouldShowCount = this.showItemCount !== undefined ? this.showItemCount : effectiveVariant === 'simple';
         const isCompoundMode = effectiveVariant === 'compound';
         const items = this.getSkipLinkItems();
@@ -323,10 +366,10 @@ export class SkipLink {
         if (this.isSmallScreen) {
             return 'top-left';
         }
-        return this.position;
+        return this.effectivePosition;
     }
     getCssClassMap() {
-        const effectiveVariant = this.isSmallScreen || this.needsSimpleMode ? 'simple' : this.variant;
+        const effectiveVariant = this.isSmallScreen || this.needsSimpleMode ? 'simple' : this.effectiveVariant;
         const effectivePosition = this.getEffectivePosition();
         return {
             'br-skiplink': true,
@@ -336,7 +379,7 @@ export class SkipLink {
         };
     }
     render() {
-        return (h(Host, { key: 'ced02bcde89c3d5b00026a0087a159e0a2d95ebb' }, h("nav", { key: '1fc2fbc543fdd791db50b19e4ec3bbb888033499', part: "container", class: this.getCssClassMap(), id: this.customId }, h("br-list", { key: '1ee348e22b8a2627f8c749e3b290d9863fa782b1' }, h("slot", { key: '95e4bad67684b76dfcfed60d3d4e42c9b6364b3d' })))));
+        return (h(Host, { key: '3eacce063db879bafda8bb7c6f3b8745d0a14c3b' }, h("nav", { key: 'd6b4a7791f3e73c16173c1bb9ccaf891e5e2d94e', part: "container", class: this.getCssClassMap(), id: this.customId }, h("br-list", { key: '35800b1ad7dd867ee029021e448a3d3ecb9c5afb' }, h("slot", { key: '68f013c367099f5bbda73bf2e9d7ec50b3c690a2' })))));
     }
     static get is() { return "br-skip-link"; }
     static get encapsulation() { return "shadow"; }
@@ -411,7 +454,7 @@ export class SkipLink {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Define se o skip link apresenta um ou m\u00FAltiplos itens vis\u00EDveis.\n- 'simple': Exibe apenas um item por vez.\n- 'compound': Exibe uma lista com m\u00FAltiplos itens."
+                    "text": "Define se o skip link apresenta um ou m\u00FAltiplos itens vis\u00EDveis.\n- 'simple': Exibe apenas um item por vez.\n- 'compound': Exibe uma lista com m\u00FAltiplos itens.\nValores inv\u00E1lidos usam 'compound'."
                 },
                 "getter": false,
                 "setter": false,
@@ -438,7 +481,7 @@ export class SkipLink {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Define a posi\u00E7\u00E3o do skip link na tela.\n- 'top-left': Posicionado no canto superior esquerdo.\n- 'top-center': Posicionado no centro superior.\n- 'top-right': Posicionado no canto superior direito."
+                    "text": "Define a posi\u00E7\u00E3o do skip link na tela.\n- 'top-left': Posicionado no canto superior esquerdo.\n- 'top-center': Posicionado no centro superior.\n- 'top-right': Posicionado no canto superior direito.\nValores inv\u00E1lidos usam 'top-left'."
                 },
                 "getter": false,
                 "setter": false,
@@ -458,7 +501,7 @@ export class SkipLink {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Define o z-index do componente.\nControla a ordem de empilhamento do componente na p\u00E1gina."
+                    "text": "Define o z-index do componente.\nControla a ordem de empilhamento do componente na p\u00E1gina.\nDeve ser um inteiro entre 0 e Number.MAX_SAFE_INTEGER; valores inv\u00E1lidos usam 0."
                 },
                 "getter": false,
                 "setter": false,
@@ -638,10 +681,6 @@ export class SkipLink {
                         "Promise": {
                             "location": "global",
                             "id": "global::Promise"
-                        },
-                        "HTMLElement": {
-                            "location": "global",
-                            "id": "global::HTMLElement"
                         }
                     },
                     "return": "Promise<void>"

package/dist/collection/components/slider/slider.css

@@ -1 +1 @@
-*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media(min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color: var(--color-light);--color-rgb: var(--color-light-rgb);--text-color: var(--color-light);--interactive: var(--interactive-light);--interactive-rgb: var(--color-rgb);--visited: var(--visited-light);--hover: var(--hover-light);--pressed: var(--pressed-light);--focus-color: var(--focus-color-light);--focus: var(--focus-color-light);--item-padding-y: var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color: var(--color-dark);--color-rgb: var(--color-dark-rgb);--text-color: var(--color-dark);--interactive: var(--interactive-dark);--interactive-rgb: var(--interactive-dark-rgb);--visited: var(--visited-dark);--hover: var(--hover-dark);--pressed: var(--pressed-dark);--focus-color: var(--focus-color-dark);--focus: var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin: var(--grid-portrait-margin);--grid-maxwidth: var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter: var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media(min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-tablet-margin)}.row{--grid-gutter: var(--grid-tablet-gutter)}.container{--grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}.col-sm-4{flex-basis:33.3333333333%;max-width:33.3333333333%}}@media(min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-tablet-margin)}.row{--grid-gutter: var(--grid-tablet-gutter)}.container{--grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media(min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-desktop-margin)}.row{--grid-gutter: var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}.col-lg-3{flex-basis:25%;max-width:25%}}@media(min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-tv-margin)}.row{--grid-gutter: var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media(min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media(min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media(min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset: var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media(min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background: var(--background);--table-color: var(--color);--table-border-color: var(--gray-20);--table-border-style: solid;--table-border-width: 1px;--table-hover: var(--color-rgb);--table-padding: var(--spacing-scale-3x);--table-font-weight: var(--font-weight-medium);--table-th-background: var(--background-alternative);--table-th-font-weight: var(--font-weight-semi-bold);--table-row-size: var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color: var(--color-dark);--color-rgb: var(--color-dark-rgb);--text-color: var(--color-dark);--interactive: var(--interactive-dark);--interactive-rgb: var(--interactive-dark-rgb);--visited: var(--visited-dark);--hover: var(--hover-dark);--pressed: var(--pressed-dark);--focus-color: var(--focus-color-dark);--focus: var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.help{font-size:var(--font-size-scale-base)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}:host{--slider-thumb-size: var(--spacing-scale-2xh, 20px);--slider-thumb-half: 10px;display:block;width:100%}:host .br-slider{padding:var(--slider-thumb-half) 0;-webkit-user-select:none;user-select:none;touch-action:none}:host .br-slider.disabled .slider-track{cursor:not-allowed}:host .br-slider.disabled .slider-filled-track{background-color:var(--gray-30, #aaa)}:host .br-slider.disabled .slider-thumb{background-color:var(--pure-0, #fff);box-shadow:inset 0 0 0 1px var(--gray-40, #888);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='10' stroke='%23636363' stroke-width='1.5'/%3E%3Cpath d='M6.34 17.66L17.66 6.34' stroke='%23636363' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");background-size:80%;background-position:center;background-repeat:no-repeat;cursor:not-allowed}:host .br-slider.disabled .slider-thumb:hover{box-shadow:none}:host .br-slider.disabled .slider-thumb:focus-visible{outline:none;box-shadow:none}:host .br-slider.disabled .slider-refs{opacity:var(--disabled, 0.45)}:host .br-slider.disabled .slider-input{cursor:not-allowed;pointer-events:none;opacity:var(--disabled, 0.45)}:host .slider-layout{display:flex;flex-direction:row;align-items:center;gap:var(--spacing-scale-2x, 16px)}:host .slider-body{flex:1;display:flex;flex-direction:column;gap:var(--spacing-scale-half, 4px)}:host .slider-track{position:relative;width:100%;height:4px;border-radius:2px;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.br-slider.dragging :host .slider-track{cursor:grabbing}:host .slider-tick-labels{position:absolute;inset:0;pointer-events:none}:host .slider-tick-label{position:absolute;top:calc(100% + 4px);transform:translateX(-50%);white-space:nowrap;font-size:var(--font-size-scale-down-01, 12px)}:host .slider-track-visual{position:absolute;inset:0;background-color:var(--gray-20, #ccc);border-radius:2px;overflow:hidden}:host .slider-filled-track{position:absolute;top:0;left:0;height:100%;background-color:var(--blue-warm-vivid-50);border-radius:2px}:host .slider-thumb{position:absolute;top:50%;width:var(--slider-thumb-size);height:var(--slider-thumb-size);background-color:var(--blue-warm-vivid-50);border-radius:50%;cursor:pointer;transform:translate(-50%, -50%);outline:none;z-index:1;transition:box-shadow .15s ease}:host .slider-thumb:hover{box-shadow:0 0 0 8px rgba(19,81,180,.16)}:host .slider-thumb:active,:host .slider-thumb.slider-thumb--active{box-shadow:0 0 0 8px rgba(19,81,180,.45);cursor:grabbing}:host .slider-thumb:focus-visible{z-index:2;box-shadow:0 0 0 3px var(--focus-color, var(--gold-vivid-20, #ffbe2e));outline:none}:host .slider-value-label{position:fixed;z-index:var(--z-index-layer-1);top:0;left:0;background:var(--blue-warm-vivid-50);color:#fff;padding:2px 8px;border-radius:4px;font-size:var(--font-size-scale-down-01, 12px);font-weight:var(--font-weight-semi-bold, 600);white-space:nowrap;pointer-events:none;line-height:1.5}:host .slider-value-label-arrow{position:absolute;width:8px;height:8px;background:var(--blue-warm-vivid-50);transform:rotate(45deg);pointer-events:none;z-index:-1}:host .slider-refs{display:flex;flex-direction:row;justify-content:space-between;align-items:center;color:var(--gray-80);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular)}:host .slider-refs--hidden{display:none}:host .slider-refs .ref-start,:host .slider-refs .ref-end{display:flex;align-items:center;gap:var(--spacing-scale-half, 4px)}:host .slider-refs .ref-bound{font-weight:var(--font-weight-semi-bold, 600)}:host .slider-refs ::slotted(*){color:var(--gray-80);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular)}:host .slider-input-wrapper{flex-shrink:0}:host .slider-input{width:64px;padding:4px 8px;border:1px solid var(--gray-40, #888);border-radius:4px;font-size:var(--font-size-scale-base, 16px);text-align:center;color:var(--gray-80);background:rgba(0,0,0,0);outline:none;appearance:textfield}:host .slider-input:focus{border-color:var(--blue-warm-vivid-50);box-shadow:0 0 0 2px rgba(0,123,255,.2)}:host .slider-input::-webkit-inner-spin-button,:host .slider-input::-webkit-outer-spin-button{appearance:none;margin:0}:host([density=small]){--slider-thumb-size: var(--spacing-scale-2x, 16px);--slider-thumb-half: 8px}:host([density=large]){--slider-thumb-size: var(--spacing-scale-3x, 24px);--slider-thumb-half: 12px}:host([vertical]),:host([orientation=vertical]){width:auto;height:200px}:host([vertical]) .br-slider,:host([orientation=vertical]) .br-slider{padding:0 var(--slider-thumb-half);height:100%}:host([vertical]) .slider-layout,:host([orientation=vertical]) .slider-layout{flex-direction:column;align-items:flex-start;height:100%;gap:var(--spacing-scale-2x, 16px)}:host([vertical]) .slider-body,:host([orientation=vertical]) .slider-body{flex:1;flex-direction:row;min-height:0;gap:var(--spacing-scale-half, 4px)}:host([vertical]) .slider-track,:host([orientation=vertical]) .slider-track{width:4px;height:100%;flex-shrink:0}:host([vertical]) .slider-tick-label,:host([orientation=vertical]) .slider-tick-label{top:auto;left:calc(100% + 8px);transform:translateY(50%)}:host([vertical]) .slider-filled-track,:host([orientation=vertical]) .slider-filled-track{top:auto;bottom:0;left:0;width:100%;height:0}:host([vertical]) .slider-thumb,:host([orientation=vertical]) .slider-thumb{top:auto;left:50%;bottom:0;transform:translate(-50%, 50%)}:host([vertical]) .slider-refs,:host([orientation=vertical]) .slider-refs{flex-direction:column-reverse;justify-content:space-between;align-items:flex-start;height:100%}:host([vertical]) .slider-input-wrapper,:host([orientation=vertical]) .slider-input-wrapper{align-self:center}:host([vertical][show-input]),:host([orientation=vertical][show-input]){height:auto;min-height:200px}@media(prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}
+*,*::before,*::after{box-sizing:border-box}:host{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}b,strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{appearance:none}::-webkit-file-upload-button{appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.d-none{display:none !important}@media(min-width: 576px){.d-sm-block{display:block !important}.d-sm-flex{display:flex !important}}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown>.br-notification{left:auto;right:0}.dropdown .br-item{--color: var(--color-light);--color-rgb: var(--color-light-rgb);--text-color: var(--color-light);--interactive: var(--interactive-light);--interactive-rgb: var(--color-rgb);--visited: var(--visited-light);--hover: var(--hover-light);--pressed: var(--pressed-light);--focus-color: var(--focus-color-light);--focus: var(--focus-color-light);--item-padding-y: var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color: var(--color-dark);--color-rgb: var(--color-dark-rgb);--text-color: var(--color-dark);--interactive: var(--interactive-dark);--interactive-rgb: var(--interactive-dark-rgb);--visited: var(--visited-dark);--hover: var(--hover-dark);--pressed: var(--pressed-dark);--focus-color: var(--focus-color-dark);--focus: var(--focus-color-dark)}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter)*.5);padding-right:calc(var(--grid-gutter)*.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.col-2{flex-basis:16.6666666667%;max-width:16.6666666667%}.container,.container-fluid,.container-lg{--grid-margin: var(--grid-portrait-margin);--grid-maxwidth: var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter: var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter)*-0.5);margin-right:calc(var(--grid-gutter)*-0.5)}@media(min-width: 576px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-tablet-margin)}.row{--grid-gutter: var(--grid-tablet-gutter)}.container{--grid-maxwidth: calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}.col-sm-4{flex-basis:33.3333333333%;max-width:33.3333333333%}}@media(min-width: 992px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-tablet-margin)}.row{--grid-gutter: var(--grid-tablet-gutter)}.container{--grid-maxwidth: calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media(min-width: 1280px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-desktop-margin)}.row{--grid-gutter: var(--grid-desktop-gutter)}.container,.container-lg{--grid-maxwidth: calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}.col-lg-3{flex-basis:25%;max-width:25%}}@media(min-width: 1600px){.container,.container-lg,.container-fluid{--grid-margin: var(--grid-tv-margin)}.row{--grid-gutter: var(--grid-tv-gutter)}.container,.container-lg{--grid-maxwidth: calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.ease{animation-timing-function:cubic-bezier(0.25, 0.1, 0.25, 1)}.ease-out{animation-timing-function:cubic-bezier(0, 0, 0.58, 1)}.ease-in-out{animation-timing-function:cubic-bezier(0.42, 0, 0.58, 1)}.fast{animation-duration:var(--duration-fast)}.slow{animation-duration:var(--duration-slow)}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mb-1{margin-bottom:var(--spacing-scale-half) !important}.ml-1{margin-left:var(--spacing-scale-half) !important}.mx-3{margin-left:var(--spacing-scale-2x) !important;margin-right:var(--spacing-scale-2x) !important}.mb-4{margin-bottom:var(--spacing-scale-3x) !important}.ml-auto{margin-left:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}@media(min-width: 576px){.ml-sm-0{margin-left:var(--spacing-scale-default) !important}}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}fieldset[disabled]{opacity:1}.text-center{text-align:center !important}.text-right{text-align:right !important}.text-nowrap{white-space:nowrap !important}.text-uppercase{text-transform:uppercase !important}.text-bold{font-weight:700 !important}.text-base{font-size:var(--font-size-scale-base) !important}.text-down-01{font-size:var(--font-size-scale-down-01) !important}@media(min-width: 576px){.text-sm-center{text-align:center !important}.text-sm-left{text-align:left !important}.text-sm-right{text-align:right !important}}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media(min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset: var(--spacing-scale-half)}a:focus{outline:none}a.focus-visible,a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}a{color:var(--interactive);text-decoration:none}.main-content a{text-decoration:underline}button{cursor:pointer}img{max-width:100%;vertical-align:middle}h2,.h2{color:var(--color);font-size:var(--font-size-scale-up-03);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2xh);margin-top:var(--spacing-scale-3xh);padding-bottom:var(--spacing-scale-2xh)}@media(min-width: 576px){.h2,h2{font-size:var(--font-size-scale-up-05);font-weight:var(--font-weight-regular)}}ul,ol{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}table{--table-background: var(--background);--table-color: var(--color);--table-border-color: var(--gray-20);--table-border-style: solid;--table-border-width: 1px;--table-hover: var(--color-rgb);--table-padding: var(--spacing-scale-3x);--table-font-weight: var(--font-weight-medium);--table-th-background: var(--background-alternative);--table-th-font-weight: var(--font-weight-semi-bold);--table-row-size: var(--spacing-scale-2x);border-collapse:collapse;width:100%}tr.selected,tr.is-selected{--color: var(--color-dark);--color-rgb: var(--color-dark-rgb);--text-color: var(--color-dark);--interactive: var(--interactive-dark);--interactive-rgb: var(--interactive-dark-rgb);--visited: var(--visited-dark);--hover: var(--hover-dark);--pressed: var(--pressed-dark);--focus-color: var(--focus-color-dark);--focus: var(--focus-color-dark)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}fieldset,.fieldset{border:var(--surface-width-none);margin-bottom:var(--spacing-scale-5x);margin-top:0;padding:0}legend,.legend{color:var(--color);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-2x);margin-top:var(--spacing-scale-2x)}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}pre,.pre{background:var(--gray-5);margin:var(--spacing-scale-2x) 0 var(--spacing-scale-4x);padding:var(--spacing-scale-2x)}pre code,.pre code{display:inline;padding:0}*[data-toggle=collapse]:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}*[data-toggle=collapse]:focus{outline:none}*[data-toggle=collapse].focus-visible,*[data-toggle=collapse]:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}@media(prefers-reduced-motion: reduce){:host,:host::before,:host::after,:host *,:host *::before,:host *::after{animation:none !important;scroll-behavior:auto !important;transition:none !important}}:host-context([data-wbc-reduced-motion=true])::before,:host-context([data-wbc-reduced-motion=true])::after,:host-context([data-wbc-reduced-motion=true]) *,:host-context([data-wbc-reduced-motion=true]) *::before,:host-context([data-wbc-reduced-motion=true]) *::after{animation:none !important;scroll-behavior:auto !important;transition:none !important}:host{--slider-thumb-size: var(--spacing-scale-2xh, 20px);--slider-thumb-half: 10px;display:block;width:100%}:host([density=small]),:host([density=high]){--slider-thumb-size: var(--spacing-scale-2x, 16px);--slider-thumb-half: 8px}:host([density=medium]){--slider-thumb-size: var(--spacing-scale-2xh, 20px);--slider-thumb-half: 10px}:host([density=large]),:host([density=low]){--slider-thumb-size: var(--spacing-scale-3x, 24px);--slider-thumb-half: 12px}:host .br-slider{padding:var(--slider-thumb-half) 0;-webkit-user-select:none;user-select:none;touch-action:none}:host .br-slider.disabled .slider-track{cursor:not-allowed}:host .br-slider.disabled .slider-filled-track{background-color:var(--gray-30, #aaa)}:host .br-slider.disabled .slider-thumb{cursor:not-allowed}:host .br-slider.disabled .slider-thumb.slider-thumb--has-icon{background-color:rgba(0,0,0,0) !important;color:var(--gray-60, #717171)}:host .br-slider.disabled .slider-thumb:hover{box-shadow:none}:host .br-slider.disabled .slider-thumb:focus-visible{outline:none;box-shadow:none}:host .br-slider.disabled .slider-refs{opacity:var(--disabled, 0.45)}:host .br-slider.disabled .slider-input{cursor:not-allowed;pointer-events:none;opacity:var(--disabled, 0.45)}:host .slider-label{color:var(--gray-80);display:block;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-scale-half, 4px)}:host .slider-layout{display:flex;flex-direction:row;align-items:center;gap:var(--spacing-scale-2x, 16px)}:host .slider-body{flex:1;display:flex;flex-direction:column;gap:var(--spacing-scale-half, 4px)}:host .slider-track{position:relative;width:100%;height:4px;border-radius:2px;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.br-slider.dragging :host .slider-track{cursor:grabbing}:host .slider-tick-labels{position:absolute;inset:0;pointer-events:none}:host .slider-tick-label{position:absolute;top:calc(100% + 4px);transform:translateX(-50%);white-space:nowrap;font-size:var(--font-size-scale-down-01, 12px)}:host .slider-track-visual{position:absolute;inset:0;background-color:var(--gray-20, #ccc);border-radius:2px;overflow:hidden}:host .slider-filled-track{position:absolute;top:0;left:0;height:100%;background-color:var(--blue-warm-vivid-50);border-radius:2px}:host .slider-thumb{position:absolute;top:50%;width:var(--slider-thumb-size);height:var(--slider-thumb-size);background-color:var(--blue-warm-vivid-50);border-radius:50%;cursor:pointer;transform:translate(-50%, -50%);outline:none;z-index:1;display:inline-flex;align-items:center;justify-content:center;color:var(--blue-warm-vivid-50)}:host .slider-thumb .slider-thumb-icon,:host .slider-thumb ::slotted([slot^=thumb]){color:var(--pure-0, #fff);font-size:calc(var(--slider-thumb-size)*.55);width:calc(var(--slider-thumb-size)*.55);height:calc(var(--slider-thumb-size)*.55);pointer-events:none;display:inline-flex;align-items:center;justify-content:center}:host .slider-thumb.slider-thumb--has-icon{background-color:rgba(0,0,0,0) !important;border:none}:host .slider-thumb.slider-thumb--has-icon .slider-thumb-icon,:host .slider-thumb.slider-thumb--has-icon ::slotted([slot^=thumb]){color:inherit;font-size:var(--slider-thumb-size);width:var(--slider-thumb-size);height:var(--slider-thumb-size)}:host .slider-thumb{transition:none}@media(prefers-reduced-motion: no-preference){:host .slider-thumb{transition:box-shadow var(--duration-very-fast, 100ms) var(--animation-ease, ease)}}:host .slider-thumb:hover{box-shadow:0 0 0 8px rgba(19,81,180,.16)}:host .slider-thumb:active,:host .slider-thumb.slider-thumb--active{box-shadow:0 0 0 8px rgba(19,81,180,.45);cursor:grabbing}:host .slider-thumb:focus-visible{z-index:2;box-shadow:0 0 0 3px var(--focus-color, var(--gold-vivid-20, #ffbe2e));outline:none}:host .slider-value-label{position:fixed;z-index:var(--z-index-layer-1);top:0;left:0;background:var(--blue-warm-vivid-50);color:#fff;padding:2px 8px;border-radius:4px;font-size:var(--font-size-scale-down-01, 12px);font-weight:var(--font-weight-semi-bold, 600);white-space:nowrap;pointer-events:none;line-height:1.5}:host .slider-value-label-arrow{position:absolute;width:8px;height:8px;background:var(--blue-warm-vivid-50);transform:rotate(45deg);pointer-events:none;z-index:-1}:host .slider-refs{display:flex;flex-direction:row;justify-content:space-between;align-items:center;color:var(--gray-80);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular)}:host .slider-refs--hidden{display:none}:host .slider-refs .ref-start,:host .slider-refs .ref-end{display:flex;align-items:center;gap:var(--spacing-scale-half, 4px)}:host .slider-refs .ref-bound{font-weight:var(--font-weight-semi-bold, 600)}:host .slider-refs ::slotted(*){color:var(--gray-80);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular)}:host .slider-steps{position:relative;width:100%;min-height:24px;margin-top:var(--spacing-scale-half, 4px)}:host .slider-step{position:absolute;top:0;transform:translateX(-50%);background:rgba(0,0,0,0);border:none;padding:0;margin:0;cursor:pointer;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;color:var(--gray-60, #636363);transition:none}@media(prefers-reduced-motion: no-preference){:host .slider-step{transition:color var(--duration-fast, 200ms) var(--animation-ease, ease),transform var(--duration-fast, 200ms) var(--animation-ease, ease)}}:host .slider-step:hover:not(:disabled){color:var(--blue-warm-vivid-50);transform:translateX(-50%) scale(1.15)}:host .slider-step--active{color:var(--blue-warm-vivid-50)}:host .slider-step:disabled{cursor:not-allowed;opacity:var(--disabled, 0.45)}:host .slider-step .slider-step-icon{font-size:20px;width:20px;height:20px}:host .slider-step .slider-step-label{font-size:var(--font-size-scale-down-01, 12px);white-space:nowrap}:host .slider-input-wrapper{display:flex;flex-shrink:0}:host br-input.slider-input{display:block;margin-bottom:0;width:80px}:host([disabled]){opacity:1 !important}:host([vertical]),:host([orientation=vertical]){width:fit-content;height:200px}:host([vertical]) .br-slider,:host([orientation=vertical]) .br-slider{padding:0 var(--slider-thumb-half);height:100%}:host([vertical]) .slider-layout,:host([orientation=vertical]) .slider-layout{flex-direction:column;align-items:flex-start;height:100%;gap:var(--spacing-scale-2x, 16px)}:host([vertical]) .slider-body,:host([orientation=vertical]) .slider-body{flex:1;flex-direction:row;min-height:0;gap:var(--spacing-scale-2x, 16px)}:host([vertical]) .slider-track,:host([orientation=vertical]) .slider-track{width:4px;height:100%;flex-shrink:0}:host([vertical]) .slider-tick-label,:host([orientation=vertical]) .slider-tick-label{top:auto;left:calc(100% + 8px);transform:translateY(50%)}:host([vertical]) .slider-filled-track,:host([orientation=vertical]) .slider-filled-track{top:auto;bottom:0;left:0;width:100%;height:0}:host([vertical]) .slider-thumb,:host([orientation=vertical]) .slider-thumb{top:auto;left:50%;bottom:0;transform:translate(-50%, 50%)}:host([vertical]) .slider-refs,:host([orientation=vertical]) .slider-refs{flex-direction:column-reverse;justify-content:space-between;align-items:flex-start;height:100%}:host([vertical]) .slider-steps,:host([orientation=vertical]) .slider-steps{position:relative;width:24px;height:100%;margin-top:0;margin-left:var(--spacing-scale-half, 4px)}:host([vertical]) .slider-steps .slider-step,:host([orientation=vertical]) .slider-steps .slider-step{top:auto;left:0;transform:translateY(50%)}:host([vertical]) .slider-steps .slider-step:hover:not(:disabled),:host([orientation=vertical]) .slider-steps .slider-step:hover:not(:disabled){transform:translateY(50%) scale(1.15)}:host([vertical]) .slider-input-wrapper,:host([orientation=vertical]) .slider-input-wrapper{align-self:center}:host([vertical][show-input]) .slider-layout,:host([orientation=vertical][show-input]) .slider-layout{position:relative}:host([vertical][show-input]) .slider-body,:host([orientation=vertical][show-input]) .slider-body{box-sizing:border-box;padding-top:calc(var(--spacing-scale-4x, 32px) + var(--spacing-scale-2x, 16px))}:host([vertical][show-input]) .slider-input-wrapper,:host([orientation=vertical][show-input]) .slider-input-wrapper{position:absolute;left:50%;transform:translateX(-50%)}:host([vertical][show-input]) .slider-input-wrapper--start,:host([orientation=vertical][show-input]) .slider-input-wrapper--start{top:0}:host([vertical][show-input]) .slider-input-wrapper--end,:host([orientation=vertical][show-input]) .slider-input-wrapper--end{bottom:0}:host([vertical][show-input][range]) .slider-body,:host([orientation=vertical][show-input][range]) .slider-body{padding-bottom:calc(var(--spacing-scale-4x, 32px) + var(--spacing-scale-2x, 16px))}