UNPKG

@itwin/itwinui-react

Version:

A react component library for iTwinUI

388 lines (380 loc) 271 kB
/*--------------------------------------------------------------------------------------------- * Copyright (c) Bentley Systems, Incorporated. All rights reserved. * See LICENSE.md in the project root for license terms and full copyright notice. *--------------------------------------------------------------------------------------------*/ @layer reset, itwinui.v1, itwinui.v2; @layer itwinui.foundations.v3{ :where(._iui3197-root):where([data-iui-theme]) { color-scheme: light dark; accent-color: var(--iui-color-border-accent); --iui-size-3xs: 0.125rem; --iui-size-2xs: 0.25rem; --iui-size-xs: 0.5rem; --iui-size-s: 0.75rem; --iui-size-m: 1rem; --iui-size-l: 1.5rem; --iui-size-xl: 2rem; --iui-size-2xl: 4rem; --iui-size-3xl: 6rem; --iui-component-height-small: calc(var(--iui-size-s) * 2); --iui-component-height: calc(var(--iui-size-s) * 3); --iui-component-height-large: calc(var(--iui-size-s) * 4); --iui-border-radius-1: 4px; --iui-border-radius-round: 9999px; --iui-font-sans: "Noto Sans", "Open Sans", system-ui, sans-serif; --iui-font-mono: "Noto Sans Mono", ui-monospace, "Segoe UI Mono", Consolas, "Roboto Mono", monospace; --iui-font-size-0: 0.75rem; --iui-font-size-1: 0.875rem; --iui-font-size-2: 1rem; --iui-font-size-3: 1.125rem; --iui-font-size-4: 1.5rem; --iui-font-size-5: 2rem; --iui-font-weight-light: 300; --iui-font-weight-normal: 400; --iui-font-weight-semibold: 600; --iui-font-weight-bold: 700; --iui-shadow-0: 0; --iui-shadow-1: 0 1px 5px var(--iui-shadow-color); --iui-shadow-2: 0 1px 10px var(--iui-shadow-color); --iui-shadow-3: 0 3px 14px var(--iui-shadow-color); --iui-shadow-4: 0 6px 30px var(--iui-shadow-color); --iui-shadow-5: 0 9px 46px var(--iui-shadow-color); --iui-duration-0: 0s; --iui-duration-1: 0.2s; --iui-duration-2: 0.4s; --iui-duration-3: 0.8s; --iui-color-background-skyblue: hsl(197, 71%, 83%); --iui-color-background-celery: hsl(72, 51%, 66%); --iui-color-background-froly: hsl(2, 90%, 83%); --iui-color-background-steelblue: hsl(207, 44%, 73%); --iui-color-background-sunglow: hsl(42, 100%, 70%); --iui-color-background-seabuckthorn: hsl(29, 92%, 71%); --iui-color-background-montecarlo: hsl(176, 43%, 72%); --iui-color-background-poloblue: hsl(211, 44%, 77%); --iui-color-background-bouquet: hsl(305, 19%, 75%); --iui-color-background-ash: hsl(42, 15%, 85%); --iui-color-background-oak: hsl(27, 32%, 72%); --iui-color-white: hsl(0, 0%, 100%); } :where(._iui3197-root):where([data-iui-theme=light]) { color-scheme: light; --iui-opacity-1: 1; --iui-opacity-2: 0.8; --iui-opacity-3: 0.6; --iui-opacity-4: 0.4; --iui-opacity-5: 0.25; --iui-opacity-6: 0.1; --iui-color-background: hsl(203, 10%, 100%); --iui-color-background-zebra: hsl(203, 10%, 98.5%); --iui-color-background-hover: hsl(203, 10%, 97%); --iui-color-background-backdrop: hsl(203, 10%, 94%); --iui-color-background-backdrop-hover: hsl(203, 10%, 91%); --iui-color-background-disabled: hsl(203, 10%, 88%); --iui-color-background-accent: var(--iui-color-background-informational); --iui-color-background-accent-hover: var( --iui-color-background-informational-hover ); --iui-color-background-accent-muted: var( --iui-color-background-informational-muted ); --iui-color-background-informational: hsl(203, 100%, 36%); --iui-color-background-informational-hover: hsl(204, 100%, 28%); --iui-color-background-informational-muted: hsl(203, 79%, 94%); --iui-color-background-positive: hsl(118, 76%, 28%); --iui-color-background-positive-hover: hsl(118, 81%, 21%); --iui-color-background-positive-muted: hsl(116, 41%, 93%); --iui-color-background-warning: hsl(42, 100%, 28%); --iui-color-background-warning-hover: hsl(42, 100%, 21%); --iui-color-background-warning-muted: hsl(35, 61%, 94%); --iui-color-background-negative: hsl(2, 68%, 46%); --iui-color-background-negative-hover: hsl(357, 100%, 31%); --iui-color-background-negative-muted: hsl(0, 100%, 96%); --iui-color-background-transparent-hover: hsla(0, 0%, 0%, 0.06); --iui-color-border-subtle: hsl(203, 10%, 79%); --iui-color-border: hsl(203, 10%, 73%); --iui-color-border-foreground: hsl(0, 0%, 56%); --iui-color-border-foreground-hover: hsl(0, 0%, 42%); --iui-color-border-disabled: hsl(0, 0%, 63%); --iui-color-border-accent: var(--iui-color-border-informational); --iui-color-border-informational: hsl(203, 100%, 36%); --iui-color-border-positive: hsl(118, 76%, 28%); --iui-color-border-warning: hsl(33, 91%, 25%); --iui-color-border-negative: hsl(0, 91%, 45%); --iui-color-icon: hsl(0, 0%, 21%); --iui-color-icon-hover: hsl(0, 0%, 14%); --iui-color-icon-muted: hsl(0, 0%, 49%); --iui-color-icon-muted-hover: hsl(0, 0%, 42%); --iui-color-icon-disabled: hsl(0, 0%, 63%); --iui-color-icon-disabled-hover: hsl(0, 0%, 45.5%); --iui-color-icon-accent: var(--iui-color-icon-informational); --iui-color-icon-informational: hsl(203, 100%, 44%); --iui-color-icon-positive: hsl(118, 74%, 35%); --iui-color-icon-warning: hsl(33, 90%, 33%); --iui-color-icon-negative: hsl(0, 98%, 60%); --iui-color-text: hsl(0, 0%, 14%); --iui-color-text-hover: hsl(0, 0%, 7%); --iui-color-text-muted: hsl(0, 0%, 35%); --iui-color-text-placeholder: hsl(0, 0%, 45.5%); --iui-color-text-disabled: hsl(0, 0%, 63%); --iui-color-text-disabled-hover: hsl(0, 0%, 38.5%); --iui-color-text-accent: var(--iui-color-text-informational); --iui-color-text-accent-hover: var(--iui-color-text-informational-hover); --iui-color-text-informational: hsl(203, 100%, 36%); --iui-color-text-informational-hover: hsl(204, 100%, 28%); --iui-color-text-positive: hsl(118, 76%, 28%); --iui-color-text-positive-hover: hsl(118, 81%, 21%); --iui-color-text-warning: hsl(33, 91%, 25%); --iui-color-text-warning-hover: hsl(33, 95%, 17%); --iui-color-text-negative: hsl(0, 91%, 45%); --iui-color-text-negative-hover: hsl(0, 94%, 34%); --iui-color-background-hsl: 203deg 10% 100%; --iui-color-foreground-hsl: 0deg 0% 7%; --iui-color-accent-hsl: var(--iui-color-informational-hsl); --iui-color-informational-hsl: 203deg 100% 44%; --iui-color-positive-hsl: 118deg 74% 35%; --iui-color-warning-hsl: 33deg 90% 33%; --iui-color-negative-hsl: 0deg 98% 60%; --iui-shadow-color: hsl(0, 0%, 0%, var(--iui-opacity-5)); } :where(._iui3197-root):where([data-iui-theme=light]):where([data-iui-contrast=high]) { --iui-opacity-1: 1; --iui-opacity-2: 0.8; --iui-opacity-3: 0.6; --iui-opacity-4: 0.4; --iui-opacity-5: 0.2; --iui-opacity-6: 0.1; --iui-color-background: hsl(203, 5%, 100%); --iui-color-background-zebra: hsl(203, 5%, 98%); --iui-color-background-hover: hsl(203, 5%, 96%); --iui-color-background-backdrop: hsl(203, 5%, 92%); --iui-color-background-backdrop-hover: hsl(203, 5%, 88%); --iui-color-background-disabled: hsl(203, 5%, 84%); --iui-color-background-accent: var(--iui-color-background-informational); --iui-color-background-accent-hover: var( --iui-color-background-informational-hover ); --iui-color-background-accent-muted: var( --iui-color-background-informational-muted ); --iui-color-background-informational: hsl(204, 100%, 28%); --iui-color-background-informational-hover: hsl(205, 100%, 20%); --iui-color-background-informational-muted: hsl(203, 44%, 93%); --iui-color-background-positive: hsl(118, 81%, 21%); --iui-color-background-positive-hover: hsl(118, 86%, 14%); --iui-color-background-positive-muted: hsl(114, 25%, 92%); --iui-color-background-warning: hsl(42, 100%, 21%); --iui-color-background-warning-hover: hsl(41, 100%, 15%); --iui-color-background-warning-muted: hsl(32, 35%, 93%); --iui-color-background-negative: hsl(357, 100%, 31%); --iui-color-background-negative-hover: hsl(358, 100%, 22%); --iui-color-background-negative-muted: hsl(0, 100%, 96%); --iui-color-background-transparent-hover: hsla(0, 0%, 0%, 0.08); --iui-color-border-subtle: hsl(203, 5%, 72%); --iui-color-border: hsl(203, 5%, 64%); --iui-color-border-foreground: hsl(0, 0%, 48%); --iui-color-border-foreground-hover: hsl(0, 0%, 36%); --iui-color-border-disabled: hsl(0, 0%, 54%); --iui-color-border-accent: var(--iui-color-border-informational); --iui-color-border-informational: hsl(203, 100%, 25%); --iui-color-border-positive: hsl(118, 78%, 19%); --iui-color-border-warning: hsl(34, 91%, 18%); --iui-color-border-negative: hsl(0, 91%, 32%); --iui-color-icon: hsl(0, 0%, 18%); --iui-color-icon-hover: hsl(0, 0%, 12%); --iui-color-icon-muted: hsl(0, 0%, 36%); --iui-color-icon-muted-hover: hsl(0, 0%, 30%); --iui-color-icon-disabled: hsl(0, 0%, 45%); --iui-color-icon-disabled-hover: hsl(0, 0%, 30%); --iui-color-icon-accent: var(--iui-color-icon-informational); --iui-color-icon-informational: hsl(203, 100%, 31%); --iui-color-icon-positive: hsl(118, 77%, 24%); --iui-color-icon-warning: hsl(33, 91%, 24%); --iui-color-icon-negative: hsl(0, 92%, 39%); --iui-color-text: hsl(0, 0%, 12%); --iui-color-text-hover: hsl(0, 0%, 6%); --iui-color-text-muted: hsl(0, 0%, 30%); --iui-color-text-disabled: hsl(0, 0%, 45%); --iui-color-text-disabled-hover: hsl(0, 0%, 24%); --iui-color-text-accent: var(--iui-color-text-informational); --iui-color-text-accent-hover: var(--iui-color-text-informational-hover); --iui-color-text-informational: hsl(203, 100%, 25%); --iui-color-text-informational-hover: hsl(203, 100%, 14%); --iui-color-text-positive: hsl(118, 78%, 19%); --iui-color-text-positive-hover: hsl(117, 78%, 11%); --iui-color-text-warning: hsl(34, 91%, 18%); --iui-color-text-warning-hover: hsl(33, 90%, 9%); --iui-color-text-negative: hsl(0, 91%, 32%); --iui-color-text-negative-hover: hsl(0, 91%, 18%); --iui-color-background-hsl: 203deg 5% 100%; --iui-color-foreground-hsl: 0deg 0% 6%; --iui-color-accent-hsl: var(--iui-color-informational-hsl); --iui-color-informational-hsl: 203deg 100% 31%; --iui-color-positive-hsl: 118deg 77% 24%; --iui-color-warning-hsl: 33deg 91% 24%; --iui-color-negative-hsl: 0deg 92% 39%; } :where(._iui3197-root):where([data-iui-theme=dark]) { color-scheme: dark; --iui-opacity-1: 1; --iui-opacity-2: 0.85; --iui-opacity-3: 0.65; --iui-opacity-4: 0.45; --iui-opacity-5: 0.25; --iui-opacity-6: 0.1; --iui-color-background: hsl(203, 12%, 22.75%); --iui-color-background-zebra: hsl(203, 12%, 24.375%); --iui-color-background-hover: hsl(203, 12%, 26%); --iui-color-background-backdrop: hsl(203, 12%, 16.25%); --iui-color-background-backdrop-hover: hsl(203, 12%, 19.5%); --iui-color-background-disabled: hsl(203, 12%, 13%); --iui-color-background-accent: var(--iui-color-background-informational); --iui-color-background-accent-hover: var( --iui-color-background-informational-hover ); --iui-color-background-accent-muted: var( --iui-color-background-informational-muted ); --iui-color-background-informational: hsl(203, 100%, 36%); --iui-color-background-informational-hover: hsl(202, 100%, 44%); --iui-color-background-informational-muted: hsl(207, 19%, 27%); --iui-color-background-positive: hsl(118, 76%, 28%); --iui-color-background-positive-hover: hsl(118, 71%, 35%); --iui-color-background-positive-muted: hsl(162, 13%, 26%); --iui-color-background-warning: hsl(42, 100%, 28%); --iui-color-background-warning-hover: hsl(43, 100%, 36%); --iui-color-background-warning-muted: hsl(51, 5%, 26%); --iui-color-background-negative: hsl(2, 68%, 46%); --iui-color-background-negative-hover: hsl(4, 79%, 59%); --iui-color-background-negative-muted: hsl(285, 3%, 27%); --iui-color-background-transparent-hover: hsla(0, 0%, 100%, 0.065); --iui-color-border-subtle: hsl(203, 12%, 32.5%); --iui-color-border: hsl(203, 12%, 39%); --iui-color-border-foreground: hsl(0, 0%, 44%); --iui-color-border-foreground-hover: hsl(0, 0%, 58%); --iui-color-border-disabled: hsl(0, 0%, 37%); --iui-color-border-accent: var(--iui-color-border-informational); --iui-color-border-informational: hsl(215, 91%, 78%); --iui-color-border-positive: hsl(119, 41%, 70%); --iui-color-border-warning: hsl(24, 93%, 72%); --iui-color-border-negative: hsl(0, 87%, 82%); --iui-color-icon: hsl(0, 0%, 79%); --iui-color-icon-hover: hsl(0, 0%, 86%); --iui-color-icon-muted: hsl(0, 0%, 58%); --iui-color-icon-muted-hover: hsl(0, 0%, 65%); --iui-color-icon-disabled: hsl(0, 0%, 44%); --iui-color-icon-disabled-hover: hsl(0, 0%, 58%); --iui-color-icon-accent: var(--iui-color-icon-informational); --iui-color-icon-informational: hsl(213, 91%, 73%); --iui-color-icon-positive: hsl(119, 46%, 66%); --iui-color-icon-warning: hsl(27, 89%, 65%); --iui-color-icon-negative: hsl(0, 87%, 78%); --iui-color-text: hsl(0, 0%, 86%); --iui-color-text-hover: hsl(0, 0%, 93%); --iui-color-text-muted: hsl(0, 0%, 72%); --iui-color-text-placeholder: hsl(0, 0%, 65%); --iui-color-text-disabled: hsl(0, 0%, 51%); --iui-color-text-disabled-hover: hsl(0, 0%, 65%); --iui-color-text-accent: var(--iui-color-text-informational); --iui-color-text-accent-hover: var(--iui-color-text-informational-hover); --iui-color-text-informational: hsl(215, 91%, 78%); --iui-color-text-informational-hover: hsl(217, 89%, 86%); --iui-color-text-positive: hsl(119, 41%, 70%); --iui-color-text-positive-hover: hsl(119, 47%, 88%); --iui-color-text-warning: hsl(24, 93%, 72%); --iui-color-text-warning-hover: hsl(22, 91%, 83%); --iui-color-text-negative: hsl(0, 87%, 82%); --iui-color-text-negative-hover: hsl(0, 87%, 88%); --iui-color-background-hsl: 203deg 12% 22.75%; --iui-color-foreground-hsl: 0deg 0% 93%; --iui-color-accent-hsl: var(--iui-color-informational-hsl); --iui-color-informational-hsl: 213deg 91% 73%; --iui-color-positive-hsl: 119deg 46% 66%; --iui-color-warning-hsl: 27deg 89% 65%; --iui-color-negative-hsl: 0deg 87% 78%; --iui-shadow-color: hsl(0, 0%, 0%, var(--iui-opacity-4)); } :where(._iui3197-root):where([data-iui-theme=dark]):where([data-iui-contrast=high]) { --iui-opacity-1: 1; --iui-opacity-2: 0.85; --iui-opacity-3: 0.65; --iui-opacity-4: 0.45; --iui-opacity-5: 0.25; --iui-opacity-6: 0.1; --iui-color-background: hsl(203, 6%, 21.25%); --iui-color-background-zebra: hsl(203, 6%, 23.375%); --iui-color-background-hover: hsl(203, 6%, 25.5%); --iui-color-background-backdrop: hsl(203, 6%, 12.75%); --iui-color-background-backdrop-hover: hsl(203, 6%, 17%); --iui-color-background-disabled: hsl(203, 6%, 8.5%); --iui-color-background-accent: var(--iui-color-background-informational); --iui-color-background-accent-hover: var( --iui-color-background-informational-hover ); --iui-color-background-accent-muted: var( --iui-color-background-informational-muted ); --iui-color-background-informational: hsl(204, 100%, 28%); --iui-color-background-informational-hover: hsl(203, 100%, 36%); --iui-color-background-informational-muted: hsl(203, 10%, 26%); --iui-color-background-positive: hsl(118, 81%, 21%); --iui-color-background-positive-hover: hsl(118, 76%, 28%); --iui-color-background-positive-muted: hsl(158, 6%, 25%); --iui-color-background-warning: hsl(42, 100%, 21%); --iui-color-background-warning-hover: hsl(42, 100%, 28%); --iui-color-background-warning-muted: hsl(60, 1%, 26%); --iui-color-background-negative: hsl(357, 100%, 31%); --iui-color-background-negative-hover: hsl(2, 68%, 46%); --iui-color-background-negative-muted: hsl(336, 4%, 27%); --iui-color-background-transparent-hover: hsla(0, 0%, 100%, 0.085); --iui-color-border-subtle: hsl(203, 6%, 38.25%); --iui-color-border: hsl(203, 6%, 42.5%); --iui-color-border-foreground: hsl(0, 0%, 60%); --iui-color-border-foreground-hover: hsl(0, 0%, 70%); --iui-color-border-disabled: hsl(0, 0%, 55%); --iui-color-border-accent: var(--iui-color-border-informational); --iui-color-border-informational: hsl(203, 56%, 85%); --iui-color-border-positive: hsl(118, 30%, 83%); --iui-color-border-warning: hsl(33, 44%, 84%); --iui-color-border-negative: hsl(0, 75%, 90%); --iui-color-icon: hsl(0, 0%, 85%); --iui-color-icon-hover: hsl(0, 0%, 90%); --iui-color-icon-muted: hsl(0, 0%, 75%); --iui-color-icon-muted-hover: hsl(0, 0%, 80%); --iui-color-icon-disabled: hsl(0, 0%, 55%); --iui-color-icon-disabled-hover: hsl(0, 0%, 60%); --iui-color-icon-accent: var(--iui-color-icon-informational); --iui-color-icon-informational: hsl(203, 56%, 72%); --iui-color-icon-positive: hsl(119, 30%, 68%); --iui-color-icon-warning: hsl(33, 45%, 70%); --iui-color-icon-negative: hsl(0, 75%, 80%); --iui-color-text: hsl(0, 0%, 90%); --iui-color-text-hover: hsl(0, 0%, 95%); --iui-color-text-muted: hsl(0, 0%, 80%); --iui-color-text-disabled: hsl(0, 0%, 55%); --iui-color-text-disabled-hover: hsl(0, 0%, 65%); --iui-color-text-accent: var(--iui-color-text-informational); --iui-color-text-accent-hover: var(--iui-color-text-informational-hover); --iui-color-text-informational: hsl(203, 56%, 85%); --iui-color-text-informational-hover: hsl(204, 56%, 95%); --iui-color-text-positive: hsl(118, 30%, 83%); --iui-color-text-positive-hover: hsl(120, 27%, 94%); --iui-color-text-warning: hsl(33, 44%, 84%); --iui-color-text-warning-hover: hsl(32, 45%, 94%); --iui-color-text-negative: hsl(0, 75%, 90%); --iui-color-text-negative-hover: hsl(0, 78%, 96%); --iui-color-background-hsl: 203deg 6% 21.25%; --iui-color-foreground-hsl: 0deg 0% 95%; --iui-color-accent-hsl: var(--iui-color-informational-hsl); --iui-color-informational-hsl: 203deg 56% 72%; --iui-color-positive-hsl: 119deg 30% 68%; --iui-color-warning-hsl: 33deg 45% 70%; --iui-color-negative-hsl: 0deg 75% 80%; } } /*--------------------------------------------------------------------------------------------- * Copyright (c) Bentley Systems, Incorporated. All rights reserved. * See LICENSE.md in the project root for license terms and full copyright notice. *--------------------------------------------------------------------------------------------*/ @layer itwinui.foundations.v3{:where(._iui3197-root){color:var(--iui-color-text);font-size:var(--iui-font-size-1);line-height:1.5;font-family:var(--iui-font-sans)}:where(body._iui3197-root){margin:0}:where(body._iui3197-root,._iui3197-root._iui3197-root-background){background-color:var(--iui-color-background-backdrop)}:where(._iui3197-root,._iui3197-root *)::selection,:where(._iui3197-root,._iui3197-root *) ::selection{background-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}:where(._iui3197-root,._iui3197-root *){scrollbar-color:hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-4))transparent;scrollbar-width:thin}@supports not (scrollbar-color:auto){:where(._iui3197-root,._iui3197-root *)::-webkit-scrollbar{max-inline-size:var(--iui-size-xs);max-block-size:var(--iui-size-xs)}:where(._iui3197-root,._iui3197-root *)::-webkit-scrollbar-thumb{background-color:hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-4));border-radius:var(--iui-border-radius-round)}:where(._iui3197-root,._iui3197-root *)::-webkit-scrollbar-thumb:hover{background-color:hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-3))}:where(._iui3197-root,._iui3197-root *)::-webkit-scrollbar-track{background-color:#0000}:where(._iui3197-root,._iui3197-root *)::-webkit-scrollbar-corner{background-color:#0000}}:where(._iui3197-root,._iui3197-root *),:where(._iui3197-root,._iui3197-root *):before,:where(._iui3197-root,._iui3197-root *):after{box-sizing:border-box}:where(._iui3197-root,._iui3197-root *):where(:focus-visible){outline:2px solid var(--iui-color-border-accent)}@keyframes _iui3197-fade-in{0%{visibility:visible;opacity:0}to{opacity:1}}} @layer itwinui.v3.components{._iui3197-field{--_iui-field-color-text:var(--iui-color-text);--_iui-field-color-text-hover:var(--iui-color-text-hover);--_iui-field-color-text-disabled:var(--iui-color-text-disabled);--_iui-field-color-text-disabled-hover:var(--iui-color-text-disabled-hover);--_iui-field-color-icon:var(--iui-color-icon);--_iui-field-color-icon-hover:var(--iui-color-icon-hover);--_iui-field-color-icon-disabled:var(--iui-color-icon-disabled);--_iui-field-color-icon-disabled-hover:var(--iui-color-icon-disabled-hover);--_iui-field-color-background:var(--iui-color-background);--_iui-field-color-background-hover:var(--iui-color-background-hover);--_iui-field-color-background-disabled:var(--iui-color-background-disabled);--_iui-field-color-border:var(--iui-color-border-foreground);--_iui-field-color-border-hover:var(--iui-color-border-foreground-hover);--_iui-field-color-border-disabled:var(--iui-color-border-disabled);--_iui-field-color-focus-outline:var(--iui-color-border-accent);--_iui-field-height:var(--iui-component-height);--_iui-field-focus-outline-offset:-2px;--_iui-field-focus-outline-width:2px;--_iui-field-font-size:var(--iui-font-size-1);--_iui-field-state:var(--_iui-field-state--default);--_iui-field-state--default:var(--_iui-field-state,);--_iui-field-state--hover:var(--_iui-field-state,);--_iui-field-state--disabled:var(--_iui-field-state,);--_iui-field-state--disabled-hover:var(--_iui-field-state,);--_iui-field-icon-color:var(--_iui-field-state--default,var(--_iui-field-color-icon))var(--_iui-field-state--hover,var(--_iui-field-color-icon-hover))var(--_iui-field-state--disabled,var(--_iui-field-color-icon-disabled))var(--_iui-field-state--disabled-hover,var(--_iui-field-color-icon-disabled-hover));background-color:var(--_iui-field-state--default,var(--_iui-field-color-background))var(--_iui-field-state--hover,var(--_iui-field-color-background-hover))var(--_iui-field-state--disabled,var(--_iui-field-color-background-disabled))var(--_iui-field-state--disabled-hover,var(--_iui-field-color-background-disabled));border:1px solid;border-color:var(--_iui-field-state--default,var(--_iui-field-color-border))var(--_iui-field-state--hover,var(--_iui-field-color-border-hover))var(--_iui-field-state--disabled,var(--_iui-field-color-border-disabled))var(--_iui-field-state--disabled-hover,var(--_iui-field-color-border-disabled));border-radius:var(--iui-border-radius-1);color:var(--_iui-field-state--default,var(--_iui-field-color-text))var(--_iui-field-state--hover,var(--_iui-field-color-text-hover))var(--_iui-field-state--disabled,var(--_iui-field-color-text-disabled))var(--_iui-field-state--disabled-hover,var(--_iui-field-color-text-disabled-hover));fill:var(--_iui-field-icon-color);font:inherit;font-size:var(--_iui-field-font-size);font-weight:var(--iui-font-weight-normal);min-block-size:var(--_iui-field-height);min-inline-size:var(--_iui-field-height);-webkit-tap-highlight-color:var(--_iui-field-color-background-hover);transition:background-color var(--iui-duration-1)ease-out,border-color var(--iui-duration-1)ease-out,color var(--iui-duration-1)ease-out}._iui3197-field:where(:hover,:active){--_iui-field-state:var(--_iui-field-state--hover)}._iui3197-field:where(:focus-visible){outline:var(--_iui-field-focus-outline-width)solid var(--_iui-field-color-focus-outline);outline-offset:var(--_iui-field-focus-outline-offset)}._iui3197-field:where([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]){--_iui-field-state:var(--_iui-field-state--disabled);cursor:not-allowed}._iui3197-field:where([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]):where(:hover,:focus-visible){--_iui-field-state:var(--_iui-field-state--disabled-hover)}._iui3197-field:where([data-iui-variant=borderless]){--_iui-field-color-background:transparent;--_iui-field-color-background-hover:var(--iui-color-background-transparent-hover);--_iui-field-color-background-disabled:transparent;--_iui-field-color-border:transparent;--_iui-field-color-border-hover:transparent;--_iui-field-color-border-disabled:transparent;--_iui-field-focus-outline-offset:-1px;--_iui-field-focus-outline-width:1px}._iui3197-field:where([data-iui-size=small]){--_iui-field-height:var(--iui-component-height-small)}._iui3197-field:where([data-iui-size=large]){--_iui-field-height:var(--iui-component-height-large);--_iui-field-font-size:var(--iui-font-size-2)}._iui3197-alert{vertical-align:baseline;--_iui-alert-border-color:var(--iui-color-border);border-radius:var(--iui-border-radius-1);color:var(--iui-color-text);background-color:var(--iui-color-background);border:none;border:1px solid var(--_iui-alert-border-color);box-shadow:inset var(--iui-size-2xs)0 0 var(--_iui-alert-border-color);padding:0;align-items:center;margin:0;padding-inline-start:var(--iui-size-m);padding-inline-end:var(--iui-size-xs);display:flex}._iui3197-alert:where([data-iui-status=informational]){--_iui-alert-border-color:var(--iui-color-border-informational);--_iui-alert-icon-color:var(--iui-color-icon-informational)}._iui3197-alert:where([data-iui-status=informational])::selection,._iui3197-alert:where([data-iui-status=informational]) ::selection{background-color:hsl(var(--iui-color-informational-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-alert:where([data-iui-status=informational]) ._iui3197-button:focus{outline-color:var(--iui-color-text-informational)}._iui3197-alert:where([data-iui-status=positive]){--_iui-alert-border-color:var(--iui-color-border-positive);--_iui-alert-icon-color:var(--iui-color-icon-positive)}._iui3197-alert:where([data-iui-status=positive])::selection,._iui3197-alert:where([data-iui-status=positive]) ::selection{background-color:hsl(var(--iui-color-positive-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-alert:where([data-iui-status=positive]) ._iui3197-button:focus{outline-color:var(--iui-color-text-positive)}._iui3197-alert:where([data-iui-status=warning]){--_iui-alert-border-color:var(--iui-color-border-warning);--_iui-alert-icon-color:var(--iui-color-icon-warning)}._iui3197-alert:where([data-iui-status=warning])::selection,._iui3197-alert:where([data-iui-status=warning]) ::selection{background-color:hsl(var(--iui-color-warning-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-alert:where([data-iui-status=warning]) ._iui3197-button:focus{outline-color:var(--iui-color-text-warning)}._iui3197-alert:where([data-iui-status=negative]){--_iui-alert-border-color:var(--iui-color-border-negative);--_iui-alert-icon-color:var(--iui-color-icon-negative)}._iui3197-alert:where([data-iui-status=negative])::selection,._iui3197-alert:where([data-iui-status=negative]) ::selection{background-color:hsl(var(--iui-color-negative-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-alert:where([data-iui-status=negative]) ._iui3197-button:focus{outline-color:var(--iui-color-text-negative)}._iui3197-alert:where([data-iui-variant=sticky]){border-radius:0;position:sticky;inset-block-start:0;inset-inline-start:0}._iui3197-alert-message{margin-block:var(--iui-size-s);margin-inline:var(--iui-size-m);word-break:normal;overflow-wrap:anywhere;flex:999}._iui3197-alert-link{border-radius:var(--iui-border-radius-1);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;margin-inline-start:var(--iui-size-xs)}._iui3197-anchor:focus-visible{outline:1px solid var(--iui-color-text-accent);outline-offset:1px}._iui3197-anchor{color:var(--iui-color-text-accent);-webkit-tap-highlight-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-6));border-radius:var(--iui-border-radius-1);cursor:pointer;text-decoration:none}._iui3197-anchor:where(button){font:inherit;background:0 0;border:none;padding:0}._iui3197-anchor:hover{color:var(--iui-color-text-accent-hover);text-decoration:underline}@media (prefers-contrast:more){._iui3197-anchor{text-decoration:underline}._iui3197-anchor:hover{text-decoration:none}}._iui3197-anchor[data-iui-underline=true],:is([data-iui-contrast=high] ._iui3197-anchor){text-decoration:underline}._iui3197-anchor[data-iui-underline=true]:hover,:is([data-iui-contrast=high] ._iui3197-anchor):hover{text-decoration:none}._iui3197-anchor-external{--_iui-anchor-external-svg:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m16 0v5.4l-1.9-2-8.4 8.4-1.5-1.5 8.3-8.4-1.9-1.9m5.4 16v-9h-1v8h-14v-14h8v-1h-9v16z' /></svg>")}._iui3197-anchor-external:after{content:"";vertical-align:-.1ch;block-size:1.5ch;inline-size:1.5ch;-webkit-mask:var(--_iui-anchor-external-svg);mask:var(--_iui-anchor-external-svg);background-color:currentColor;margin-inline-start:.5ch;display:inline-block}@media (forced-colors:active){._iui3197-anchor-external:after{background-color:linktext}}._iui3197-anchor:where([data-iui-status=informational]):focus-visible{outline:1px solid var(--iui-color-text-informational);outline-offset:1px}._iui3197-anchor:where([data-iui-status=informational]){color:var(--iui-color-text-informational);-webkit-tap-highlight-color:hsl(var(--iui-color-informational-hsl)/var(--iui-opacity-6))}._iui3197-anchor:where([data-iui-status=informational])::selection,._iui3197-anchor:where([data-iui-status=informational]) ::selection{background-color:hsl(var(--iui-color-informational-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-anchor:where([data-iui-status=informational]):hover{color:var(--iui-color-text-informational-hover)}._iui3197-anchor:where([data-iui-status=positive]):focus-visible{outline:1px solid var(--iui-color-text-positive);outline-offset:1px}._iui3197-anchor:where([data-iui-status=positive]){color:var(--iui-color-text-positive);-webkit-tap-highlight-color:hsl(var(--iui-color-positive-hsl)/var(--iui-opacity-6))}._iui3197-anchor:where([data-iui-status=positive])::selection,._iui3197-anchor:where([data-iui-status=positive]) ::selection{background-color:hsl(var(--iui-color-positive-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-anchor:where([data-iui-status=positive]):hover{color:var(--iui-color-text-positive-hover)}._iui3197-anchor:where([data-iui-status=warning]):focus-visible{outline:1px solid var(--iui-color-text-warning);outline-offset:1px}._iui3197-anchor:where([data-iui-status=warning]){color:var(--iui-color-text-warning);-webkit-tap-highlight-color:hsl(var(--iui-color-warning-hsl)/var(--iui-opacity-6))}._iui3197-anchor:where([data-iui-status=warning])::selection,._iui3197-anchor:where([data-iui-status=warning]) ::selection{background-color:hsl(var(--iui-color-warning-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-anchor:where([data-iui-status=warning]):hover{color:var(--iui-color-text-warning-hover)}._iui3197-anchor:where([data-iui-status=negative]):focus-visible{outline:1px solid var(--iui-color-text-negative);outline-offset:1px}._iui3197-anchor:where([data-iui-status=negative]){color:var(--iui-color-text-negative);-webkit-tap-highlight-color:hsl(var(--iui-color-negative-hsl)/var(--iui-opacity-6))}._iui3197-anchor:where([data-iui-status=negative])::selection,._iui3197-anchor:where([data-iui-status=negative]) ::selection{background-color:hsl(var(--iui-color-negative-hsl)/var(--iui-opacity-4));color:var(--iui-color-text)}._iui3197-anchor:where([data-iui-status=negative]):hover{color:var(--iui-color-text-negative-hover)}._iui3197-avatar{vertical-align:baseline;inline-size:var(--_iui-avatar-size);block-size:var(--_iui-avatar-size);background-color:var(--iui-color-background-skyblue);font-weight:var(--iui-font-weight-semibold);text-align:center;text-transform:uppercase;color:#000000c4;line-height:var(--_iui-avatar-size);font-size:var(--_iui-avatar-font-size);isolation:isolate;border:none;border-radius:50%;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex;position:relative}._iui3197-avatar:before{content:"";box-shadow:inset 0 0 0 var(--iui-size-3xs)hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-5));z-index:1;border-radius:50%;position:absolute;inset:0}._iui3197-avatar svg{fill:#000000c4;block-size:50%;inline-size:50%;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}._iui3197-avatar>img{object-fit:cover;background-color:var(--iui-color-background);border-width:0;border-radius:50%;max-inline-size:100%;display:block;position:absolute;inset:0}._iui3197-avatar[data-iui-status]:after{content:"";border:var(--iui-size-3xs)solid var(--iui-color-background);background:var(--_iui-avatar-status-img)no-repeat center/var(--_iui-avatar-status-size,var(--iui-size-xs));background-color:var(--iui-color-border);z-index:2;border-radius:50%;justify-content:center;align-items:center;block-size:25%;inline-size:25%;display:flex;position:absolute;inset-block-end:calc(0px - var(--iui-size-3xs));inset-inline-end:calc(0px - var(--iui-size-3xs));box-sizing:content-box!important}._iui3197-avatar[data-iui-status=online]:after{--_iui-avatar-status-img:url("data:image/svg+xml,<svg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M6,14L0,8l2-2l4,4l8-8l2,2L6,14z' /></svg>");background-color:var(--iui-color-background-positive)}._iui3197-avatar[data-iui-status=away]:after{--_iui-avatar-status-img:url("data:image/svg+xml,<svg fill='white' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m13.445 12.832-6.445-4.297v-7.535h2v6.465l5.555 3.703z' /></svg>");background-color:var(--iui-color-background-warning)}._iui3197-avatar[data-iui-status=busy]:after{--_iui-avatar-status-img:url("data:image/svg+xml,<svg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><rect x='2' y='7' width='12' height='2'></rect></svg>");background-color:var(--iui-color-background-negative)}._iui3197-avatar[data-iui-status=offline]:after{--_iui-avatar-status-img:url("data:image/svg+xml,<svg fill='white' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'><path d='m12.5 2-4.5 4.5-4.5-4.5-1.5 1.5 4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5z' /></svg>");background-color:var(--iui-color-icon-muted)}._iui3197-avatar._iui3197-avatar-count{background-color:var(--iui-color-background);color:var(--iui-color-text-muted)}._iui3197-avatar._iui3197-avatar-count:before{box-shadow:inset 0 0 0 var(--iui-size-3xs)var(--iui-color-border)}._iui3197-avatar{--_iui-avatar-size:var(--iui-size-xl);--_iui-avatar-font-size:var(--iui-font-size-2);--_iui-avatar-status-size:calc(var(--iui-size-2xs)*1.5)}._iui3197-avatar[data-iui-size=small]{--_iui-avatar-size:calc(1.5*var(--iui-size-m));--_iui-avatar-font-size:var(--iui-font-size-0);--_iui-avatar-status-size:var(--iui-size-2xs)}._iui3197-avatar[data-iui-size=large]{--_iui-avatar-size:calc(3*var(--iui-size-m));--_iui-avatar-font-size:var(--iui-font-size-3);--_iui-avatar-status-size:var(--iui-size-xs)}._iui3197-avatar[data-iui-size=x-large]{--_iui-avatar-size:var(--iui-size-2xl);--_iui-avatar-font-size:var(--iui-font-size-4);--_iui-avatar-status-size:var(--iui-size-s)}._iui3197-avatar-list{flex-wrap:wrap;display:inline-flex}._iui3197-avatar-list ._iui3197-avatar:not(:first-child){margin-inline-start:var(--iui-size-2xs)}._iui3197-avatar-list ._iui3197-avatar:not(:first-child)[data-iui-size=small]{margin-inline-start:var(--iui-size-3xs)}._iui3197-avatar-list ._iui3197-avatar:not(:first-child)[data-iui-size=large]{margin-inline-start:var(--iui-size-xs)}._iui3197-avatar-list ._iui3197-avatar:not(:first-child)[data-iui-size=x-large]{margin-inline-start:var(--iui-size-s)}._iui3197-avatar-list._iui3197-stacked ._iui3197-avatar:not(:first-child){box-shadow:0 0 0 var(--iui-size-2xs)var(--iui-color-background);margin-inline-start:calc(0px - var(--iui-size-2xs))}._iui3197-avatar-list._iui3197-stacked ._iui3197-avatar:not(:first-child)[data-iui-size=small]{box-shadow:0 0 0 var(--iui-size-3xs)var(--iui-color-background);margin-inline-start:calc(0px - var(--iui-size-3xs))}._iui3197-avatar-list._iui3197-stacked ._iui3197-avatar:not(:first-child)[data-iui-size=large]{margin-inline-start:calc(0px - var(--iui-size-xs))}._iui3197-avatar-list._iui3197-stacked ._iui3197-avatar:not(:first-child)[data-iui-size=x-large]{margin-inline-start:calc(0px - var(--iui-size-s))}@media (prefers-reduced-motion:no-preference){._iui3197-avatar-list._iui3197-stacked._iui3197-animated ._iui3197-avatar{transition:margin-left var(--iui-duration-2)ease-out}}._iui3197-avatar-list._iui3197-stacked._iui3197-animated:hover ._iui3197-avatar:not(:first-child){margin-inline-start:var(--iui-size-2xs)}._iui3197-avatar-list._iui3197-stacked._iui3197-animated:hover ._iui3197-avatar:not(:first-child)[data-iui-size=small]{margin-inline-start:var(--iui-size-3xs)}._iui3197-avatar-list._iui3197-stacked._iui3197-animated:hover ._iui3197-avatar:not(:first-child)[data-iui-size=large]{margin-inline-start:var(--iui-size-xs)}._iui3197-avatar-list._iui3197-stacked._iui3197-animated:hover ._iui3197-avatar:not(:first-child)[data-iui-size=x-large]{margin-inline-start:var(--iui-size-s)}._iui3197-badge{--iui-badge-background-color:#c7ccd1;--_iui-badge-border-color:var(--iui-badge-background-color);--_iui-badge-text-color:#0009;vertical-align:baseline;font-size:var(--iui-font-size-0);padding:0;padding-inline:calc(var(--iui-size-2xs)*1.5);border:none;border:1px solid var(--_iui-badge-border-color);border-radius:var(--iui-border-radius-1);background-color:var(--iui-badge-background-color);color:var(--_iui-badge-text-color);text-transform:uppercase;-webkit-user-select:none;user-select:none;max-inline-size:calc(20ch + var(--iui-size-2xs)*1.5*2);white-space:nowrap;text-overflow:ellipsis;font-weight:var(--iui-font-weight-semibold);margin:0;display:inline-block;overflow:hidden}._iui3197-badge:where([data-iui-status=informational]){--iui-badge-background-color:var(--iui-color-background-informational-muted);--_iui-badge-border-color:var(--iui-color-border-informational);--_iui-badge-text-color:var(--iui-color-text-informational)}._iui3197-badge:where([data-iui-status=positive]){--iui-badge-background-color:var(--iui-color-background-positive-muted);--_iui-badge-border-color:var(--iui-color-border-positive);--_iui-badge-text-color:var(--iui-color-text-positive)}._iui3197-badge:where([data-iui-status=warning]){--iui-badge-background-color:var(--iui-color-background-warning-muted);--_iui-badge-border-color:var(--iui-color-border-warning);--_iui-badge-text-color:var(--iui-color-text-warning)}._iui3197-badge:where([data-iui-status=negative]){--iui-badge-background-color:var(--iui-color-background-negative-muted);--_iui-badge-border-color:var(--iui-color-border-negative);--_iui-badge-text-color:var(--iui-color-text-negative)}._iui3197-backdrop{z-index:998;isolation:isolate;background-color:rgba(0,0,0,var(--iui-opacity-4));block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}._iui3197-backdrop:not(._iui3197-backdrop-visible){visibility:hidden;opacity:0}._iui3197-backdrop{transition:visibility var(--iui-duration-0)linear,opacity var(--iui-duration-1)ease-out;transition-delay:var(--iui-duration-1),var(--iui-duration-0)}._iui3197-backdrop._iui3197-backdrop-visible{transition-delay:var(--iui-duration-0);animation:_iui3197-fade-in var(--iui-duration-1)ease-out}._iui3197-backdrop._iui3197-backdrop-fixed{position:fixed}._iui3197-blockquote{vertical-align:baseline;--iui-surface-border:1px solid var(--iui-color-border-subtle);--iui-surface-elevation:var(--iui-shadow-1);background-color:var(--iui-color-background);border:none;border:var(--iui-surface-border);border-radius:var(--iui-border-radius-1);box-shadow:var(--iui-surface-elevation);color:var(--iui-color-text);padding:0;padding-block:var(--iui-size-s);padding-inline:var(--iui-size-m);margin:0;margin-block:var(--iui-size-s);text-align:justify;border-inline-start:var(--iui-size-xs)solid var(--iui-color-border);display:block;position:relative}._iui3197-blockquote>footer{text-align:end;color:var(--iui-color-text-muted)}._iui3197-blockquote>footer>cite{font-style:normal}._iui3197-breadcrumbs{--_iui-breadcrumbs-height:var(--iui-component-height);vertical-align:baseline;block-size:var(--_iui-breadcrumbs-height);border:none;align-items:center;margin:0;padding:0;display:flex}._iui3197-breadcrumbs-list{vertical-align:baseline;-webkit-user-select:none;user-select:none;border:none;align-items:center;block-size:100%;inline-size:100%;margin:0;padding:0;list-style-type:none;display:flex}._iui3197-breadcrumbs-item{align-items:center;block-size:100%;display:flex}._iui3197-breadcrumbs-item>*{max-inline-size:26ch}._iui3197-breadcrumbs-content{padding-inline:var(--iui-size-xs);line-height:var(--iui-component-height)}._iui3197-breadcrumbs-content,._iui3197-breadcrumbs-content>*{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}._iui3197-breadcrumbs-content:any-link{outline-offset:-1px}._iui3197-breadcrumbs-content:any-link:hover{color:var(--iui-color-text-accent-hover);text-decoration:underline}._iui3197-breadcrumbs-content:where(button,:any-link){vertical-align:middle;-webkit-user-select:none;user-select:none;cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:var(--_iui-button-gap);padding-block:var(--_iui-button-padding-block);padding-inline:var(--_iui-button-padding-inline);--_iui-button-gap:var(--iui-size-xs);--_iui-button-padding-block:var(--iui-size-2xs);--_iui-button-padding-inline:var(--iui-size-m);flex-shrink:0;line-height:1.2;text-decoration:none;display:inline-flex;position:relative}._iui3197-breadcrumbs-content:where(button,:any-link):where([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]){cursor:not-allowed}._iui3197-breadcrumbs-content:where(button,:any-link)[data-iui-loading=true]>:where(:not(._iui3197-button-spinner)){opacity:0}._iui3197-breadcrumbs-content:where(button,:any-link)[data-iui-loading=true]>:where(._iui3197-button-spinner){margin:auto;position:absolute;inset:0}._iui3197-breadcrumbs-content:where(button,:any-link){--_iui-button-group-item-offset:0}._iui3197-breadcrumbs-content:where(button,:any-link)[data-iui-shift=left]{margin-inline-start:calc(-1*var(--_iui-button-padding-inline))}._iui3197-breadcrumbs-content:where(button,:any-link)[data-iui-shift=right]{margin-inline-end:calc(-1*var(--_iui-button-padding-inline))}._iui3197-breadcrumbs-content:where(button,:any-link){color:var(--iui-color-text-accent)}._iui3197-breadcrumbs-content:where(button,:any-link)[aria-current]{color:var(--iui-color-text)}._iui3197-breadcrumbs-separator{margin-inline:var(--iui-size-3xs);display:flex}._iui3197-breadcrumbs-separator svg{inline-size:var(--iui-size-s);block-size:var(--iui-size-s);fill:var(--iui-color-icon-muted);flex-shrink:0;display:flex}@media (forced-colors:active){._iui3197-breadcrumbs-separator svg{fill:canvastext}}._iui3197-button{vertical-align:middle;-webkit-user-select:none;user-select:none;cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:var(--_iui-button-gap);padding-block:var(--_iui-button-padding-block);padding-inline:var(--_iui-button-padding-inline);--_iui-button-gap:var(--iui-size-xs);--_iui-button-padding-block:var(--iui-size-2xs);--_iui-button-padding-inline:var(--iui-size-m);flex-shrink:0;line-height:1.2;text-decoration:none;display:inline-flex;position:relative}._iui3197-button:where([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]){cursor:not-allowed}._iui3197-button[data-iui-loading=true]>:where(:not(._iui3197-button-spinner)){opacity:0}._iui3197-button[data-iui-loading=true]>:where(._iui3197-button-spinner){margin:auto;position:absolute;inset:0}._iui3197-button:is([data-iui-has-popover=open],:has(+:popover-open)){--_iui-field-state:var(--_iui-field-state--hover)}._iui3197-button[data-iui-size=small]{--_iui-button-gap:var(--iui-size-2xs);--_iui-button-padding-block:0;--_iui-button-padding-inline:var(--iui-size-xs)}._iui3197-button[data-iui-size=large]{--_iui-button-gap:var(--iui-size-s);--_iui-button-padding-block:var(--iui-size-xs);--_iui-button-padding-inline:var(--iui-size-l)}._iui3197-button[data-iui-variant=borderless]{--_iui-button-group-item-offset:0}._iui3197-button[data-iui-variant=borderless][data-iui-shift=left]{margin-inline-start:calc(-1*var(--_iui-button-padding-inline))}._iui3197-button[data-iui-variant=borderless][data-iui-shift=right]{margin-inline-end:calc(-1*var(--_iui-button-padding-inline))}._iui3197-button[data-iui-variant=borderless]{--_iui-button-gap:var(--iui-size-xs);--_iui-button-padding-block:var(--iui-size-2xs);--_iui-button-padding-inline:var(--iui-size-xs)}._iui3197-button[data-iui-variant=borderless][data-iui-size=small]{--_iui-button-gap:var(--iui-size-2xs);--_iui-button-padding-block:0;--_iui-button-padding-inline:var(--iui-size-2xs)}._iui3197-button[data-iui-variant=borderless][data-iui-size=large]{--_iui-button-gap:var(--iui-size-s);--_iui-button-padding-block:var(--iui-size-xs);--_iui-button-padding-inline:var(--iui-size-s)}._iui3197-button[data-iui-active=true]{--_iui-field-color-icon:var(--iui-color-icon-accent);--_iui-field-color-icon-hover:var(--iui-color-icon-accent);--_iui-field-color-background:var(--iui-color-background-accent-muted);--_iui-field-color-background-hover:var(--iui-color-background-accent-muted);--_iui-field-color-background-disabled:var(--iui-color-background-disabled);--_iui-field-color-text:var(--iui-color-text-accent)}._iui3197-button[data-iui-active=true]:after{content:"";inset-block:var(--_iui-button-active-stripe-inset-block,initial);inset-inline:var(--_iui-button-active-stripe-inset-inline,initial);background:var(--_iui-button-active-stripe-background,var(--iui-color-border-accent));position:absolute}._iui3197-button[data-iui-active=true]:is([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]){--_iui-button-active-stripe-background:var(--iui-color-icon-disabled)}._iui3197-button[data-iui-active=true][data-iui-variant=borderless]{--_iui-field-color-background:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-6));--_iui-field-color-background-hover:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-6))}._iui3197-button:where([data-iui-variant=high-visibility],[data-iui-variant=cta]){--_iui-field-color-text:var(--iui-color-white);--_iui-field-color-text-hover:var(--iui-color-white);--_iui-field-color-icon:var(--iui-color-white);--_iui-field-color-icon-hover:var(--iui-color-white);--_iui-field-focus-outline-offset:1px;--_iui-field-focus-outline-width:2px}._iui3197-button:where([data-iui-variant=high-visibility]){--_iui-field-color-background:var(--iui-color-background-accent);--_iui-field-color-background-hover:var(--iui-color-background-accent-hover);--_iui-field-color-border:var(--iui-color-background-accent);--_iui-field-color-border-hover:var(--iui-color-background-accent-hover);--_iui-field-color-focus-outline:var(--iui-color-border-accent)}._iui3197-button:where([data-iui-variant=cta]){--_iui-field-color-background:var(--iui-color-background-positive);--_iui-field-color-background-hover:var(--iui-color-background-positive-hover);--_iui-field-color-border:var(--iui-color-background-positive);--_iui-field-color-border-hover:var(--iui-color-background-positive-hover);--_iui-field-color-focus-outline:var(--iui-color-border-positive)}._iui3197-button-dropdown{padding-inline-end:calc(var(--iui-size-xs) - 1px)}._iui3197-button-dropdown[data-iui-size=small]{padding-inline-end:calc(var(--iui-size-2xs) - 1px)}._iui3197-button-dropdown[data-iui-size=large]{padding-inline-end:calc(var(--iui-size-s) - 1px)}._iui3197-button-idea{border-radius:var(--iui-border-radius-round);box-shadow:var(--iui-shadow-5);position:fixed;inset-block-end:var(--iui-size-s);inset-inline-end:var(--iui-size-m)}._iui3197-button-icon{color:var(--_iui-field-icon-color,currentColor);flex-shrink:0;display:inline-flex}._iui3197-button-icon svg{inline-size:var(--iui-size-m);block-size:var(--iui-size-m);transition:fill var(--iui-duration-1)ease-out;fill:currentColor;flex-shrink:0;display:flex}._iui3197-button-split{isolation:isolate;align-items:center;display:inline-flex}._iui3197-button-split :where(._iui3197-button:first-child){border-start-end-radius:0;border-end-end-radius:0}._iui3197-button-split :where(._iui3197-button:first-child)[data-iui-variant=high-visibility],._iui3197-button-split :where(._iui3197-button:first-child)[data-iui-variant=cta]{border-inline-end-color:rgba(255,255,255,var(--iui-opacity-4))}._iui3197-button-split :where(._iui3197-button:first-child):hover{z-index:1}._iui3197-button-split :where(._iui3197-button:first-child):is([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]){border-inline-end-color:var(--iui-color-border-subtle);z-index:-1}._iui3197-button-split :where(._iui3197-button:first-child):focus-visible{z-index:1}._iui3197-button-split :where(._iui3197-button:last-child){--_iui-button-padding-inline:var(--iui-size-2xs);min-inline-size:unset;border-start-start-radius:0;border-end-start-radius:0;margin-inline-start:-1px}._iui3197-button-split :where(._iui3197-button:last-child)[data-iui-variant=high-visibility],._iui3197-button-split :where(._iui3197-button:last-child)[data-iui-variant=cta]{border-inline-start-color:rgba(255,255,255,var(--iui-opacity-4))}._iui3197-button-split :where(._iui3197-button:last-child):where([disabled],:disabled,[aria-disabled=true],[data-iui-disabled=true]){border-inline-start-color:var(--iui-color-border-subtle);z-index:-1}._iui3197-button-split :where(._iui3197-button:last-child)[data-iui-size=small]{--_iui-button-padding-inline:var(--iui-size-3xs)}._iui3197-button-split :where(._iui3197-button:last-child)[data-iui-size=large]{--_iui-button-padding-inline:var(--iui-size-xs)}._iui3197-button-group:where(:not([data-iui-orientation=vertical])){--_iui-button-group-item-offset:-1px;isolation:isolate;pointer-events:none;align-items:center;display:inline-flex}._iui3197-button-group:where(:not([data-iui-orientation=vertical]))>[class]{pointer-events:all;position:relative}._iui3197-button-group:where(:not([data-iui-orientation=vertical]))>[class]:where(._iui3197-field,._iui3197-input-flex-container){--_iui-button-active-stripe-inset-block:var(--iui-size-3xs)calc(100% - var(--iui-size-2xs));--_iui-button-active