@react-ui-org/react-ui
Version:
React UI is a themeable UI library for React apps.
1 lines • 326 kB
CSS
@layer theme, foundation, helpers, components, utilities;@layer theme{:root{--rui-dimension-border-width-1: 1px;--rui-dimension-breakpoint-xs: 0;--rui-dimension-breakpoint-sm: 36em;--rui-dimension-breakpoint-md: 48em;--rui-dimension-breakpoint-lg: 66em;--rui-dimension-breakpoint-xl: 84em;--rui-dimension-breakpoint-x2l: 100em;--rui-dimension-breakpoint-x3l: 120em;--rui-dimension-radius-1: 0.125rem;--rui-dimension-radius-2: 0.25rem;--rui-dimension-space-0: 0;--rui-dimension-space-1: 0.25rem;--rui-dimension-space-2: 0.5rem;--rui-dimension-space-3: 0.75rem;--rui-dimension-space-4: 1rem;--rui-dimension-space-5: 1.5rem;--rui-dimension-space-6: 2rem;--rui-dimension-space-7: 2.5rem;--rui-font-family-base: /* Cross-platform generic font family (default user interface font) */ system-ui, /* Safari for macOS and iOS (San Francisco)*/ -apple-system, /* Windows*/ "Segoe UI", /* Android*/ roboto, /* Basic web fallback*/ "Helvetica Neue", arial, /* Linux*/ "Noto Sans", "Liberation Sans", /* Sans serif fallback*/ sans-serif, /* Emoji fonts*/ "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--rui-font-family-monospace: "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;--rui-font-weight-base: 400;--rui-font-weight-light: 300;--rui-font-weight-bold: 700;--rui-ratio-opacity-medium: 0.5;--rui-shadow-1: 0 0.01rem 0.65rem -0.1rem rgb(0 0 0 / 30%);--rui-shadow-2: 0.2rem 0.25rem 1.2rem -0.1rem rgb(0 0 0 / 15%);--rui-font-size-base: 100%;--rui-font-size-small: 0.889rem;--rui-font-size-smaller: 0.75rem;--rui-font-size-code: 85%;--rui-font-size-1: 1rem;--rui-font-size-2: 1.125rem;--rui-font-size-3: 1.266rem;--rui-font-size-4: 1.424rem;--rui-font-size-5: 1.602rem;--rui-font-size-6: 1.802rem;--rui-line-height-base: 1.5;--rui-line-height-small: 1.25;--rui-underline-offset-link: 0.1875em;--rui-text-decoration-link: underline;--rui-text-decoration-link-hover: underline;--rui-text-decoration-link-active: underline;--rui-list-style-unordered: square;--rui-cursor-not-allowed: not-allowed;--rui-border-focus-ring: var(--rui-dimension-space-1) solid rgba(0, 123, 255, 0.5);--rui-color-text-primary: #000;--rui-color-text-primary-disabled: rgb(178.5, 178.5, 178.5);--rui-color-text-secondary: rgb(127.5, 127.5, 127.5);--rui-color-text-secondary-disabled: rgb(178.5, 178.5, 178.5);--rui-color-text-link: #007bff;--rui-color-text-link-hover: rgb(0, 110.7, 229.5);--rui-color-text-link-active: rgb(0, 98.4, 204);--rui-color-action-primary: #00778b;--rui-color-action-primary-hover: rgb(0, 107.1, 125.1);--rui-color-action-primary-active: rgb(0, 95.2, 111.2);--rui-color-action-on-primary: #fff;--rui-color-action-secondary: rgb(127.5, 127.5, 127.5);--rui-color-action-secondary-hover: rgb(114.75, 114.75, 114.75);--rui-color-action-secondary-active: #666666;--rui-color-action-on-secondary: #fff;--rui-color-action-selected: #007bff;--rui-color-action-selected-hover: rgb(0, 110.7, 229.5);--rui-color-action-selected-active: rgb(0, 98.4, 204);--rui-color-action-on-selected: #fff;--rui-color-feedback-success: #28a745;--rui-color-feedback-success-hover: rgb(36, 150.3, 62.1);--rui-color-feedback-success-active: rgb(32, 133.6, 55.2);--rui-color-feedback-on-success: #fff;--rui-color-feedback-warning: #ffc107;--rui-color-feedback-warning-hover: rgb(229.5, 173.7, 6.3);--rui-color-feedback-warning-active: rgb(204, 154.4, 5.6);--rui-color-feedback-on-warning: #000;--rui-color-feedback-danger: #dc3545;--rui-color-feedback-danger-hover: rgb(198, 47.7, 62.1);--rui-color-feedback-danger-active: rgb(176, 42.4, 55.2);--rui-color-feedback-on-danger: #fff;--rui-color-feedback-help: #6610f2;--rui-color-feedback-help-hover: rgb(91.8, 14.4, 217.8);--rui-color-feedback-help-active: rgb(81.6, 12.8, 193.6);--rui-color-feedback-on-help: #fff;--rui-color-feedback-info: #17a2b8;--rui-color-feedback-info-hover: rgb(20.7, 145.8, 165.6);--rui-color-feedback-info-active: rgb(18.4, 129.6, 147.2);--rui-color-feedback-on-info: #fff;--rui-color-feedback-note: #007bff;--rui-color-feedback-note-hover: rgb(0, 110.7, 229.5);--rui-color-feedback-note-active: rgb(0, 98.4, 204);--rui-color-feedback-on-note: #fff;--rui-color-neutral-light: #fff;--rui-color-neutral-light-hover: rgb(242.25, 242.25, 242.25);--rui-color-neutral-light-active: rgb(229.5, 229.5, 229.5);--rui-color-neutral-on-light: rgb(76.5, 76.5, 76.5);--rui-color-neutral-dark: rgb(76.5, 76.5, 76.5);--rui-color-neutral-dark-hover: #333333;--rui-color-neutral-dark-active: rgb(25.5, 25.5, 25.5);--rui-color-neutral-on-dark: #fff;--rui-color-background-base: rgb(242.25, 242.25, 242.25);--rui-color-background-layer-1: #fff;--rui-color-background-layer-2: #fff;--rui-color-background-basic: #fff;--rui-color-background-disabled: rgb(242.25, 242.25, 242.25);--rui-color-background-interactive: transparent;--rui-color-background-interactive-hover: rgb(242.25, 242.25, 242.25);--rui-color-background-interactive-active: rgb(229.5, 229.5, 229.5);--rui-color-background-primary: rgb(229.5, 241.4, 243.4);--rui-color-background-secondary: rgb(242.25, 242.25, 242.25);--rui-color-background-selected: rgb(229.5, 241.8, 255);--rui-color-background-success: rgb(233.5, 246.2, 236.4);--rui-color-background-warning: rgb(255, 248.8, 230.2);--rui-color-background-danger: rgb(251.5, 234.8, 236.4);--rui-color-background-help: rgb(239.7, 231.1, 253.7);--rui-color-background-info: rgb(231.8, 245.7, 247.9);--rui-color-background-note: rgb(229.5, 241.8, 255);--rui-color-background-light: rgb(229.5, 229.5, 229.5);--rui-color-background-dark: #666666;--rui-color-border-primary: #cccccc;--rui-color-border-primary-hover: rgb(127.5, 127.5, 127.5);--rui-color-border-primary-active: rgb(0, 98.4, 204);--rui-color-border-secondary: rgb(229.5, 229.5, 229.5);--rui-dimension-focus-ring-offset: var(--rui-dimension-border-width-1);--rui-dimension-tap-target-size: var(--rui-dimension-space-7);--rui-dimension-space-bottom-base: var(--rui-dimension-space-5);--rui-dimension-space-bottom-headings: var(--rui-dimension-space-5);--rui-dimension-space-bottom-layouts: var(--rui-dimension-space-5);--rui-ratio-disabled-opacity: var(--rui-ratio-opacity-medium);--rui-shadow-layer-1: var(--rui-shadow-1);--rui-shadow-layer-2: var(--rui-shadow-2);--rui-shadow-focus-ring: initial;--rui-Alert__padding: var(--rui-dimension-space-3);--rui-Alert__font-weight: var(--rui-font-weight-base);--rui-Alert__border-width: var(--rui-dimension-border-width-1);--rui-Alert__border-radius: var(--rui-dimension-radius-2);--rui-Alert__emphasis__font-weight: var(--rui-font-weight-bold);--rui-Alert__stripe__width: var(--rui-dimension-border-width-1);--rui-Alert--success__color: var(--rui-color-text-primary);--rui-Alert--success__foreground-color: var(--rui-color-feedback-success);--rui-Alert--success__background-color: var(--rui-color-background-success);--rui-Alert--warning__color: var(--rui-color-text-primary);--rui-Alert--warning__foreground-color: var(--rui-color-feedback-warning);--rui-Alert--warning__background-color: var(--rui-color-background-warning);--rui-Alert--danger__color: var(--rui-color-text-primary);--rui-Alert--danger__foreground-color: var(--rui-color-feedback-danger);--rui-Alert--danger__background-color: var(--rui-color-background-danger);--rui-Alert--info__color: var(--rui-color-text-primary);--rui-Alert--info__foreground-color: var(--rui-color-feedback-info);--rui-Alert--info__background-color: var(--rui-color-background-info);--rui-Alert--help__color: var(--rui-color-text-primary);--rui-Alert--help__foreground-color: var(--rui-color-feedback-help);--rui-Alert--help__background-color: var(--rui-color-background-help);--rui-Alert--note__color: var(--rui-color-text-primary);--rui-Alert--note__foreground-color: var(--rui-color-feedback-note);--rui-Alert--note__background-color: var(--rui-color-background-note);--rui-Alert--light__color: var(--rui-color-neutral-on-light);--rui-Alert--light__foreground-color: var(--rui-color-neutral-on-light);--rui-Alert--light__background-color: var(--rui-color-background-light);--rui-Alert--dark__color: var(--rui-color-neutral-on-dark);--rui-Alert--dark__foreground-color: var(--rui-color-neutral-on-dark);--rui-Alert--dark__background-color: var(--rui-color-background-dark);--rui-Badge--filled--success__color: var(--rui-color-feedback-on-success);--rui-Badge--filled--success__background-color: var(--rui-color-feedback-success);--rui-Badge--filled--warning__color: var(--rui-color-feedback-on-warning);--rui-Badge--filled--warning__background-color: var(--rui-color-feedback-warning);--rui-Badge--filled--danger__color: var(--rui-color-feedback-on-danger);--rui-Badge--filled--danger__background-color: var(--rui-color-feedback-danger);--rui-Badge--filled--help__color: var(--rui-color-feedback-on-help);--rui-Badge--filled--help__background-color: var(--rui-color-feedback-help);--rui-Badge--filled--info__color: var(--rui-color-feedback-on-info);--rui-Badge--filled--info__background-color: var(--rui-color-feedback-info);--rui-Badge--filled--note__color: var(--rui-color-feedback-on-note);--rui-Badge--filled--note__background-color: var(--rui-color-feedback-note);--rui-Badge--filled--light__color: var(--rui-color-neutral-on-light);--rui-Badge--filled--light__background-color: var(--rui-color-neutral-light);--rui-Badge--filled--dark__color: var(--rui-color-neutral-on-dark);--rui-Badge--filled--dark__background-color: var(--rui-color-neutral-dark);--rui-Badge--outline--success__color: var(--rui-color-feedback-success);--rui-Badge--outline--warning__color: var(--rui-color-feedback-warning);--rui-Badge--outline--danger__color: var(--rui-color-feedback-danger);--rui-Badge--outline--help__color: var(--rui-color-feedback-help);--rui-Badge--outline--info__color: var(--rui-color-feedback-info);--rui-Badge--outline--note__color: var(--rui-color-feedback-note);--rui-Badge--outline--light__color: var(--rui-color-neutral-light);--rui-Badge--outline--dark__color: var(--rui-color-neutral-dark);--rui-Button__font-weight: var(--rui-font-weight-base);--rui-Button__letter-spacing: 0;--rui-Button__text-transform: none;--rui-Button__border-width: var(--rui-dimension-border-width-1);--rui-Button__border-radius: var(--rui-dimension-radius-2);--rui-Button--disabled__opacity: var(--rui-ratio-disabled-opacity);--rui-Button--disabled__cursor: var(--rui-cursor-not-allowed);--rui-Button--feedback__opacity: 1;--rui-Button--feedback__cursor: var(--rui-cursor-not-allowed);--rui-Button--filled--primary--default__color: var(--rui-color-action-on-primary);--rui-Button--filled--primary--default__border-color: var(--rui-color-action-primary);--rui-Button--filled--primary--default__background: var(--rui-color-action-primary);--rui-Button--filled--primary--default__box-shadow: none;--rui-Button--filled--primary--hover__color: var(--rui-color-action-on-primary);--rui-Button--filled--primary--hover__border-color: var(--rui-color-action-primary-hover);--rui-Button--filled--primary--hover__background: var(--rui-color-action-primary-hover);--rui-Button--filled--primary--hover__box-shadow: none;--rui-Button--filled--primary--active__color: var(--rui-color-action-on-primary);--rui-Button--filled--primary--active__border-color: var(--rui-color-action-primary-active);--rui-Button--filled--primary--active__background: var(--rui-color-action-primary-active);--rui-Button--filled--primary--active__box-shadow: none;--rui-Button--filled--secondary--default__color: var(--rui-color-action-on-secondary);--rui-Button--filled--secondary--default__border-color: var(--rui-color-action-secondary);--rui-Button--filled--secondary--default__background: var(--rui-color-action-secondary);--rui-Button--filled--secondary--default__box-shadow: none;--rui-Button--filled--secondary--hover__color: var(--rui-color-action-on-secondary);--rui-Button--filled--secondary--hover__border-color: var(--rui-color-action-secondary-hover);--rui-Button--filled--secondary--hover__background: var(--rui-color-action-secondary-hover);--rui-Button--filled--secondary--hover__box-shadow: none;--rui-Button--filled--secondary--active__color: var(--rui-color-action-on-secondary);--rui-Button--filled--secondary--active__border-color: var(--rui-color-action-secondary-active);--rui-Button--filled--secondary--active__background: var(--rui-color-action-secondary-active);--rui-Button--filled--secondary--active__box-shadow: none;--rui-Button--filled--selected--default__color: var(--rui-color-action-on-selected);--rui-Button--filled--selected--default__border-color: var(--rui-color-action-selected);--rui-Button--filled--selected--default__background: var(--rui-color-action-selected);--rui-Button--filled--selected--default__box-shadow: none;--rui-Button--filled--selected--hover__color: var(--rui-color-action-on-selected);--rui-Button--filled--selected--hover__border-color: var(--rui-color-action-selected-hover);--rui-Button--filled--selected--hover__background: var(--rui-color-action-selected-hover);--rui-Button--filled--selected--hover__box-shadow: none;--rui-Button--filled--selected--active__color: var(--rui-color-action-on-selected);--rui-Button--filled--selected--active__border-color: var(--rui-color-action-selected-active);--rui-Button--filled--selected--active__background: var(--rui-color-action-selected-active);--rui-Button--filled--selected--active__box-shadow: none;--rui-Button--filled--success--default__color: var(--rui-color-feedback-on-success);--rui-Button--filled--success--default__border-color: var(--rui-color-feedback-success);--rui-Button--filled--success--default__background: var(--rui-color-feedback-success);--rui-Button--filled--success--default__box-shadow: none;--rui-Button--filled--success--hover__color: var(--rui-color-feedback-on-success);--rui-Button--filled--success--hover__border-color: var(--rui-color-feedback-success-hover);--rui-Button--filled--success--hover__background: var(--rui-color-feedback-success-hover);--rui-Button--filled--success--hover__box-shadow: none;--rui-Button--filled--success--active__color: var(--rui-color-feedback-on-success);--rui-Button--filled--success--active__border-color: var(--rui-color-feedback-success-active);--rui-Button--filled--success--active__background: var(--rui-color-feedback-success-active);--rui-Button--filled--success--active__box-shadow: none;--rui-Button--filled--warning--default__color: var(--rui-color-feedback-on-warning);--rui-Button--filled--warning--default__border-color: var(--rui-color-feedback-warning);--rui-Button--filled--warning--default__background: var(--rui-color-feedback-warning);--rui-Button--filled--warning--default__box-shadow: none;--rui-Button--filled--warning--hover__color: var(--rui-color-feedback-on-warning);--rui-Button--filled--warning--hover__border-color: var(--rui-color-feedback-warning-hover);--rui-Button--filled--warning--hover__background: var(--rui-color-feedback-warning-hover);--rui-Button--filled--warning--hover__box-shadow: none;--rui-Button--filled--warning--active__color: var(--rui-color-feedback-on-warning);--rui-Button--filled--warning--active__border-color: var(--rui-color-feedback-warning-active);--rui-Button--filled--warning--active__background: var(--rui-color-feedback-warning-active);--rui-Button--filled--warning--active__box-shadow: none;--rui-Button--filled--danger--default__color: var(--rui-color-feedback-on-danger);--rui-Button--filled--danger--default__border-color: var(--rui-color-feedback-danger);--rui-Button--filled--danger--default__background: var(--rui-color-feedback-danger);--rui-Button--filled--danger--default__box-shadow: none;--rui-Button--filled--danger--hover__color: var(--rui-color-feedback-on-danger);--rui-Button--filled--danger--hover__border-color: var(--rui-color-feedback-danger-hover);--rui-Button--filled--danger--hover__background: var(--rui-color-feedback-danger-hover);--rui-Button--filled--danger--hover__box-shadow: none;--rui-Button--filled--danger--active__color: var(--rui-color-feedback-on-danger);--rui-Button--filled--danger--active__border-color: var(--rui-color-feedback-danger-active);--rui-Button--filled--danger--active__background: var(--rui-color-feedback-danger-active);--rui-Button--filled--danger--active__box-shadow: none;--rui-Button--filled--help--default__color: var(--rui-color-feedback-on-help);--rui-Button--filled--help--default__border-color: var(--rui-color-feedback-help);--rui-Button--filled--help--default__background: var(--rui-color-feedback-help);--rui-Button--filled--help--default__box-shadow: none;--rui-Button--filled--help--hover__color: var(--rui-color-feedback-on-help);--rui-Button--filled--help--hover__border-color: var(--rui-color-feedback-help-hover);--rui-Button--filled--help--hover__background: var(--rui-color-feedback-help-hover);--rui-Button--filled--help--hover__box-shadow: none;--rui-Button--filled--help--active__color: var(--rui-color-feedback-on-help);--rui-Button--filled--help--active__border-color: var(--rui-color-feedback-help-active);--rui-Button--filled--help--active__background: var(--rui-color-feedback-help-active);--rui-Button--filled--help--active__box-shadow: none;--rui-Button--filled--info--default__color: var(--rui-color-feedback-on-info);--rui-Button--filled--info--default__border-color: var(--rui-color-feedback-info);--rui-Button--filled--info--default__background: var(--rui-color-feedback-info);--rui-Button--filled--info--default__box-shadow: none;--rui-Button--filled--info--hover__color: var(--rui-color-feedback-on-info);--rui-Button--filled--info--hover__border-color: var(--rui-color-feedback-info-hover);--rui-Button--filled--info--hover__background: var(--rui-color-feedback-info-hover);--rui-Button--filled--info--hover__box-shadow: none;--rui-Button--filled--info--active__color: var(--rui-color-feedback-on-info);--rui-Button--filled--info--active__border-color: var(--rui-color-feedback-info-active);--rui-Button--filled--info--active__background: var(--rui-color-feedback-info-active);--rui-Button--filled--info--active__box-shadow: none;--rui-Button--filled--note--default__color: var(--rui-color-feedback-on-note);--rui-Button--filled--note--default__border-color: var(--rui-color-feedback-note);--rui-Button--filled--note--default__background: var(--rui-color-feedback-note);--rui-Button--filled--note--default__box-shadow: none;--rui-Button--filled--note--hover__color: var(--rui-color-feedback-on-note);--rui-Button--filled--note--hover__border-color: var(--rui-color-feedback-note-hover);--rui-Button--filled--note--hover__background: var(--rui-color-feedback-note-hover);--rui-Button--filled--note--hover__box-shadow: none;--rui-Button--filled--note--active__color: var(--rui-color-feedback-on-note);--rui-Button--filled--note--active__border-color: var(--rui-color-feedback-note-active);--rui-Button--filled--note--active__background: var(--rui-color-feedback-note-active);--rui-Button--filled--note--active__box-shadow: none;--rui-Button--filled--light--default__color: var(--rui-color-neutral-on-light);--rui-Button--filled--light--default__border-color: var(--rui-color-neutral-light);--rui-Button--filled--light--default__background: var(--rui-color-neutral-light);--rui-Button--filled--light--default__box-shadow: none;--rui-Button--filled--light--hover__color: var(--rui-color-neutral-on-light);--rui-Button--filled--light--hover__border-color: var(--rui-color-neutral-light-hover);--rui-Button--filled--light--hover__background: var(--rui-color-neutral-light-hover);--rui-Button--filled--light--hover__box-shadow: none;--rui-Button--filled--light--active__color: var(--rui-color-neutral-on-light);--rui-Button--filled--light--active__border-color: var(--rui-color-neutral-light-active);--rui-Button--filled--light--active__background: var(--rui-color-neutral-light-active);--rui-Button--filled--light--active__box-shadow: none;--rui-Button--filled--dark--default__color: var(--rui-color-neutral-on-dark);--rui-Button--filled--dark--default__border-color: var(--rui-color-neutral-dark);--rui-Button--filled--dark--default__background: var(--rui-color-neutral-dark);--rui-Button--filled--dark--default__box-shadow: none;--rui-Button--filled--dark--hover__color: var(--rui-color-neutral-on-dark);--rui-Button--filled--dark--hover__border-color: var(--rui-color-neutral-dark-hover);--rui-Button--filled--dark--hover__background: var(--rui-color-neutral-dark-hover);--rui-Button--filled--dark--hover__box-shadow: none;--rui-Button--filled--dark--active__color: var(--rui-color-neutral-on-dark);--rui-Button--filled--dark--active__border-color: var(--rui-color-neutral-dark-active);--rui-Button--filled--dark--active__background: var(--rui-color-neutral-dark-active);--rui-Button--filled--dark--active__box-shadow: none;--rui-Button--outline--primary--default__color: var(--rui-color-action-primary);--rui-Button--outline--primary--default__border-color: var(--rui-color-action-primary);--rui-Button--outline--primary--default__background: transparent;--rui-Button--outline--primary--hover__color: var(--rui-color-action-on-primary);--rui-Button--outline--primary--hover__border-color: var(--rui-color-action-primary-hover);--rui-Button--outline--primary--hover__background: var(--rui-color-action-primary-hover);--rui-Button--outline--primary--active__color: var(--rui-color-action-on-primary);--rui-Button--outline--primary--active__border-color: var(--rui-color-action-primary-active);--rui-Button--outline--primary--active__background: var(--rui-color-action-primary-active);--rui-Button--outline--secondary--default__color: var(--rui-color-action-secondary);--rui-Button--outline--secondary--default__border-color: var(--rui-color-action-secondary);--rui-Button--outline--secondary--default__background: transparent;--rui-Button--outline--secondary--hover__color: var(--rui-color-action-on-secondary);--rui-Button--outline--secondary--hover__border-color: var(--rui-color-action-secondary-hover);--rui-Button--outline--secondary--hover__background: var(--rui-color-action-secondary-hover);--rui-Button--outline--secondary--active__color: var(--rui-color-action-on-secondary);--rui-Button--outline--secondary--active__border-color: var(--rui-color-action-secondary-active);--rui-Button--outline--secondary--active__background: var(--rui-color-action-secondary-active);--rui-Button--outline--selected--default__color: var(--rui-color-action-selected);--rui-Button--outline--selected--default__border-color: var(--rui-color-action-selected);--rui-Button--outline--selected--default__background: var(--rui-color-background-selected);--rui-Button--outline--selected--hover__color: var(--rui-color-action-on-selected);--rui-Button--outline--selected--hover__border-color: var(--rui-color-action-selected-hover);--rui-Button--outline--selected--hover__background: var(--rui-color-action-selected-hover);--rui-Button--outline--selected--active__color: var(--rui-color-action-on-selected);--rui-Button--outline--selected--active__border-color: var(--rui-color-action-selected-active);--rui-Button--outline--selected--active__background: var(--rui-color-action-selected-active);--rui-Button--outline--success--default__color: var(--rui-color-feedback-success);--rui-Button--outline--success--default__border-color: var(--rui-color-feedback-success);--rui-Button--outline--success--default__background: transparent;--rui-Button--outline--success--hover__color: var(--rui-color-feedback-on-success);--rui-Button--outline--success--hover__border-color: var(--rui-color-feedback-success-hover);--rui-Button--outline--success--hover__background: var(--rui-color-feedback-success-hover);--rui-Button--outline--success--active__color: var(--rui-color-feedback-on-success);--rui-Button--outline--success--active__border-color: var(--rui-color-feedback-success-active);--rui-Button--outline--success--active__background: var(--rui-color-feedback-success-active);--rui-Button--outline--warning--default__color: var(--rui-color-feedback-warning);--rui-Button--outline--warning--default__border-color: var(--rui-color-feedback-warning);--rui-Button--outline--warning--default__background: transparent;--rui-Button--outline--warning--hover__color: var(--rui-color-feedback-on-warning);--rui-Button--outline--warning--hover__border-color: var(--rui-color-feedback-warning-hover);--rui-Button--outline--warning--hover__background: var(--rui-color-feedback-warning-hover);--rui-Button--outline--warning--active__color: var(--rui-color-feedback-on-warning);--rui-Button--outline--warning--active__border-color: var(--rui-color-feedback-warning-active);--rui-Button--outline--warning--active__background: var(--rui-color-feedback-warning-active);--rui-Button--outline--danger--default__color: var(--rui-color-feedback-danger);--rui-Button--outline--danger--default__border-color: var(--rui-color-feedback-danger);--rui-Button--outline--danger--default__background: transparent;--rui-Button--outline--danger--hover__color: var(--rui-color-feedback-on-danger);--rui-Button--outline--danger--hover__border-color: var(--rui-color-feedback-danger-hover);--rui-Button--outline--danger--hover__background: var(--rui-color-feedback-danger-hover);--rui-Button--outline--danger--active__color: var(--rui-color-feedback-on-danger);--rui-Button--outline--danger--active__border-color: var(--rui-color-feedback-danger-active);--rui-Button--outline--danger--active__background: var(--rui-color-feedback-danger-active);--rui-Button--outline--help--default__color: var(--rui-color-feedback-help);--rui-Button--outline--help--default__border-color: var(--rui-color-feedback-help);--rui-Button--outline--help--default__background: transparent;--rui-Button--outline--help--hover__color: var(--rui-color-feedback-on-help);--rui-Button--outline--help--hover__border-color: var(--rui-color-feedback-help-hover);--rui-Button--outline--help--hover__background: var(--rui-color-feedback-help-hover);--rui-Button--outline--help--active__color: var(--rui-color-feedback-on-help);--rui-Button--outline--help--active__border-color: var(--rui-color-feedback-help-active);--rui-Button--outline--help--active__background: var(--rui-color-feedback-help-active);--rui-Button--outline--info--default__color: var(--rui-color-feedback-info);--rui-Button--outline--info--default__border-color: var(--rui-color-feedback-info);--rui-Button--outline--info--default__background: transparent;--rui-Button--outline--info--hover__color: var(--rui-color-feedback-on-info);--rui-Button--outline--info--hover__border-color: var(--rui-color-feedback-info-hover);--rui-Button--outline--info--hover__background: var(--rui-color-feedback-info-hover);--rui-Button--outline--info--active__color: var(--rui-color-feedback-on-info);--rui-Button--outline--info--active__border-color: var(--rui-color-feedback-info-active);--rui-Button--outline--info--active__background: var(--rui-color-feedback-info-active);--rui-Button--outline--note--default__color: var(--rui-color-feedback-note);--rui-Button--outline--note--default__border-color: var(--rui-color-feedback-note);--rui-Button--outline--note--default__background: transparent;--rui-Button--outline--note--hover__color: var(--rui-color-feedback-on-note);--rui-Button--outline--note--hover__border-color: var(--rui-color-feedback-note-hover);--rui-Button--outline--note--hover__background: var(--rui-color-feedback-note-hover);--rui-Button--outline--note--active__color: var(--rui-color-feedback-on-note);--rui-Button--outline--note--active__border-color: var(--rui-color-feedback-note-active);--rui-Button--outline--note--active__background: var(--rui-color-feedback-note-active);--rui-Button--outline--light--default__color: var(--rui-color-neutral-light);--rui-Button--outline--light--default__border-color: var(--rui-color-neutral-light);--rui-Button--outline--light--default__background: transparent;--rui-Button--outline--light--hover__color: var(--rui-color-neutral-on-light);--rui-Button--outline--light--hover__border-color: var(--rui-color-neutral-light-hover);--rui-Button--outline--light--hover__background: var(--rui-color-neutral-light-hover);--rui-Button--outline--light--active__color: var(--rui-color-neutral-on-light);--rui-Button--outline--light--active__border-color: var(--rui-color-neutral-light-active);--rui-Button--outline--light--active__background: var(--rui-color-neutral-light-active);--rui-Button--outline--dark--default__color: var(--rui-color-neutral-dark);--rui-Button--outline--dark--default__border-color: var(--rui-color-neutral-dark);--rui-Button--outline--dark--default__background: transparent;--rui-Button--outline--dark--hover__color: var(--rui-color-neutral-on-dark);--rui-Button--outline--dark--hover__border-color: var(--rui-color-neutral-dark-hover);--rui-Button--outline--dark--hover__background: var(--rui-color-neutral-dark-hover);--rui-Button--outline--dark--active__color: var(--rui-color-neutral-on-dark);--rui-Button--outline--dark--active__border-color: var(--rui-color-neutral-dark-active);--rui-Button--outline--dark--active__background: var(--rui-color-neutral-dark-active);--rui-Button--flat--primary--default__color: var(--rui-color-action-primary);--rui-Button--flat--primary--default__background: transparent;--rui-Button--flat--primary--hover__color: var(--rui-color-action-primary-hover);--rui-Button--flat--primary--hover__background: var(--rui-color-background-primary);--rui-Button--flat--primary--active__color: var(--rui-color-action-primary-active);--rui-Button--flat--primary--active__background: var(--rui-color-background-primary);--rui-Button--flat--secondary--default__color: var(--rui-color-action-secondary);--rui-Button--flat--secondary--default__background: transparent;--rui-Button--flat--secondary--hover__color: var(--rui-color-action-secondary-hover);--rui-Button--flat--secondary--hover__background: var(--rui-color-background-secondary);--rui-Button--flat--secondary--active__color: var(--rui-color-action-secondary-active);--rui-Button--flat--secondary--active__background: var(--rui-color-background-secondary);--rui-Button--flat--selected--default__color: var(--rui-color-action-selected);--rui-Button--flat--selected--default__background: var(--rui-color-background-selected);--rui-Button--flat--selected--hover__color: var(--rui-color-action-selected-hover);--rui-Button--flat--selected--hover__background: var(--rui-color-background-selected);--rui-Button--flat--selected--active__color: var(--rui-color-action-selected-active);--rui-Button--flat--selected--active__background: var(--rui-color-background-selected);--rui-Button--flat--success--default__color: var(--rui-color-feedback-success);--rui-Button--flat--success--default__background: transparent;--rui-Button--flat--success--hover__color: var(--rui-color-feedback-success-hover);--rui-Button--flat--success--hover__background: var(--rui-color-background-success);--rui-Button--flat--success--active__color: var(--rui-color-feedback-success-active);--rui-Button--flat--success--active__background: var(--rui-color-background-success);--rui-Button--flat--warning--default__color: var(--rui-color-feedback-warning);--rui-Button--flat--warning--default__background: transparent;--rui-Button--flat--warning--hover__color: var(--rui-color-feedback-warning-hover);--rui-Button--flat--warning--hover__background: var(--rui-color-background-warning);--rui-Button--flat--warning--active__color: var(--rui-color-feedback-warning-active);--rui-Button--flat--warning--active__background: var(--rui-color-background-warning);--rui-Button--flat--danger--default__color: var(--rui-color-feedback-danger);--rui-Button--flat--danger--default__background: transparent;--rui-Button--flat--danger--hover__color: var(--rui-color-feedback-danger-hover);--rui-Button--flat--danger--hover__background: var(--rui-color-background-danger);--rui-Button--flat--danger--active__color: var(--rui-color-feedback-danger-active);--rui-Button--flat--danger--active__background: var(--rui-color-background-danger);--rui-Button--flat--help--default__color: var(--rui-color-feedback-help);--rui-Button--flat--help--default__background: transparent;--rui-Button--flat--help--hover__color: var(--rui-color-feedback-help-hover);--rui-Button--flat--help--hover__background: var(--rui-color-background-help);--rui-Button--flat--help--active__color: var(--rui-color-feedback-help-active);--rui-Button--flat--help--active__background: var(--rui-color-background-help);--rui-Button--flat--info--default__color: var(--rui-color-feedback-info);--rui-Button--flat--info--default__background: transparent;--rui-Button--flat--info--hover__color: var(--rui-color-feedback-info-hover);--rui-Button--flat--info--hover__background: var(--rui-color-background-info);--rui-Button--flat--info--active__color: var(--rui-color-feedback-info-active);--rui-Button--flat--info--active__background: var(--rui-color-background-info);--rui-Button--flat--note--default__color: var(--rui-color-feedback-note);--rui-Button--flat--note--default__background: transparent;--rui-Button--flat--note--hover__color: var(--rui-color-feedback-note-hover);--rui-Button--flat--note--hover__background: var(--rui-color-background-note);--rui-Button--flat--note--active__color: var(--rui-color-feedback-note-active);--rui-Button--flat--note--active__background: var(--rui-color-background-note);--rui-Button--flat--light--default__color: var(--rui-color-neutral-light);--rui-Button--flat--light--default__background: transparent;--rui-Button--flat--light--hover__color: var(--rui-color-neutral-light-hover);--rui-Button--flat--light--hover__background: var(--rui-color-background-dark);--rui-Button--flat--light--active__color: var(--rui-color-neutral-light-active);--rui-Button--flat--light--active__background: var(--rui-color-background-dark);--rui-Button--flat--dark--default__color: var(--rui-color-neutral-dark);--rui-Button--flat--dark--default__background: transparent;--rui-Button--flat--dark--hover__color: var(--rui-color-neutral-dark-hover);--rui-Button--flat--dark--hover__background: var(--rui-color-background-light);--rui-Button--flat--dark--active__color: var(--rui-color-neutral-dark-active);--rui-Button--flat--dark--active__background: var(--rui-color-background-light);--rui-Button--small__height: 1.75rem;--rui-Button--small__padding-y: var(--rui-dimension-space-1);--rui-Button--small__padding-x: var(--rui-dimension-space-3);--rui-Button--small__font-size: var(--rui-font-size-small);--rui-Button--medium__height: 2.25rem;--rui-Button--medium__padding-y: var(--rui-dimension-space-1);--rui-Button--medium__padding-x: var(--rui-dimension-space-4);--rui-Button--medium__font-size: var(--rui-font-size-1);--rui-Button--large__height: 2.75rem;--rui-Button--large__padding-y: var(--rui-dimension-space-2);--rui-Button--large__padding-x: var(--rui-dimension-space-5);--rui-Button--large__font-size: var(--rui-font-size-2);--rui-ButtonGroup__inner-border-radius: 0;--rui-ButtonGroup--filled__gap: calc(-1 * var(--rui-Button__border-width));--rui-ButtonGroup--filled__separator__width: var(--rui-Button__border-width);--rui-ButtonGroup--filled__separator__color: currentcolor;--rui-ButtonGroup--outline__gap: calc(-1 * var(--rui-Button__border-width));--rui-ButtonGroup--outline__separator__width: 0;--rui-ButtonGroup--outline__separator__color: transparent;--rui-ButtonGroup--flat__gap: var(--rui-Button__border-width);--rui-ButtonGroup--flat__separator__width: var(--rui-ButtonGroup--flat__gap);--rui-ButtonGroup--flat__separator__color: currentcolor;--rui-Card__padding: var(--rui-dimension-space-4);--rui-Card__border-width: var(--rui-dimension-border-width-1);--rui-Card__border-color: var(--rui-color-border-primary);--rui-Card__border-radius: var(--rui-dimension-radius-2);--rui-Card__background-color: var(--rui-color-background-layer-1);--rui-Card--dense__padding: var(--rui-dimension-space-2);--rui-Card--raised__box-shadow: var(--rui-shadow-layer-1);--rui-Card--disabled__background-color: var(--rui-color-background-disabled);--rui-Card--disabled__opacity: var(--rui-ratio-disabled-opacity);--rui-Card--disabled__border-width: var(--rui-dimension-border-width-1);--rui-Card--disabled__border-color: var(--rui-color-border-primary);--rui-Card--success__color: var(--rui-color-text-primary);--rui-Card--success__border-color: var(--rui-color-feedback-success);--rui-Card--success__background-color: var(--rui-color-background-layer-1);--rui-Card--warning__color: var(--rui-color-text-primary);--rui-Card--warning__border-color: var(--rui-color-feedback-warning);--rui-Card--warning__background-color: var(--rui-color-background-layer-1);--rui-Card--danger__color: var(--rui-color-text-primary);--rui-Card--danger__border-color: var(--rui-color-feedback-danger);--rui-Card--danger__background-color: var(--rui-color-background-layer-1);--rui-Card--info__color: var(--rui-color-text-primary);--rui-Card--info__border-color: var(--rui-color-feedback-info);--rui-Card--info__background-color: var(--rui-color-background-layer-1);--rui-Card--help__color: var(--rui-color-text-primary);--rui-Card--help__border-color: var(--rui-color-feedback-help);--rui-Card--help__background-color: var(--rui-color-background-layer-1);--rui-Card--note__color: var(--rui-color-text-primary);--rui-Card--note__border-color: var(--rui-color-feedback-note);--rui-Card--note__background-color: var(--rui-color-background-layer-1);--rui-Card--light__color: var(--rui-color-text-primary);--rui-Card--light__border-color: var(--rui-color-neutral-light);--rui-Card--light__background-color: var(--rui-color-background-layer-1);--rui-Card--dark__color: var(--rui-color-neutral-on-dark);--rui-Card--dark__border-color: var(--rui-color-neutral-on-dark);--rui-Card--dark__background-color: var(--rui-color-background-dark);--rui-FormField__label__color: inherit;--rui-FormField__label__font-size: var(--rui-font-size-1);--rui-FormField__help-text__font-size: var(--rui-font-size-small);--rui-FormField__help-text__font-style: normal;--rui-FormField__help-text__color: var(--rui-color-text-secondary);--rui-FormField--required__label__color: inherit;--rui-FormField--required__sign: "\00a0*";--rui-FormField--required__sign__color: var(--rui-color-text-secondary);--rui-FormField--horizontal__label__text-align: left;--rui-FormField--horizontal__label__min-width: 0;--rui-FormField--horizontal__label__width: minmax(auto, 50%);--rui-FormField--horizontal__label__vertical-alignment: initial;--rui-FormField--horizontal__field__vertical-alignment: initial;--rui-FormField--horizontal--full-width__label__width: fit-content(50%);--rui-FormField--disabled__cursor: var(--rui-cursor-not-allowed);--rui-FormField--disabled__opacity: var(--rui-ratio-disabled-opacity);--rui-FormField--invalid--default__border-color: var(--rui-color-feedback-danger);--rui-FormField--invalid--default__background: var(--rui-color-background-danger);--rui-FormField--invalid--default__check-background-color: var(--rui-FormField--invalid--default__background);--rui-FormField--invalid--default__surrounding-text-color: var(--rui-color-feedback-danger);--rui-FormField--invalid--checked__check-background-color: var(--rui-FormField--invalid--default__border-color);--rui-FormField--valid--default__border-color: var(--rui-color-feedback-success);--rui-FormField--valid--default__background: var(--rui-color-background-success);--rui-FormField--valid--default__check-background-color: var(--rui-FormField--valid--default__background);--rui-FormField--valid--default__surrounding-text-color: var(--rui-color-feedback-success);--rui-FormField--valid--checked__check-background-color: var(--rui-FormField--valid--default__border-color);--rui-FormField--warning--default__border-color: var(--rui-color-feedback-warning-hover);--rui-FormField--warning--default__background: var(--rui-color-background-warning);--rui-FormField--warning--default__check-background-color: var(--rui-FormField--warning--default__background);--rui-FormField--warning--default__surrounding-text-color: var(--rui-color-feedback-warning-active);--rui-FormField--warning--checked__check-background-color: var(--rui-FormField--warning--default__border-color);--rui-FormField--box__border-width: var(--rui-dimension-border-width-1);--rui-FormField--box__border-radius: var(--rui-dimension-radius-2);--rui-FormField--box__input__width: auto;--rui-FormField--box__input__min-width: 240px;--rui-FormField--box__placeholder__color: var(--rui-color-text-secondary);--rui-FormField--box--select__caret__border-style: none;--rui-FormField--box--select__caret__background: transparent;--rui-FormField--box--select__option--disabled__color: var(--rui-color-text-primary-disabled);--rui-FormField--box--small__height: var(--rui-Button--small__height);--rui-FormField--box--small__padding-y: 0.0625rem;--rui-FormField--box--small__padding-x: var(--rui-dimension-space-2);--rui-FormField--box--small__font-size: var(--rui-font-size-small);--rui-FormField--box--medium__height: var(--rui-Button--medium__height);--rui-FormField--box--medium__padding-y: 0.3125rem;--rui-FormField--box--medium__padding-x: var(--rui-dimension-space-3);--rui-FormField--box--medium__font-size: var(--rui-font-size-1);--rui-FormField--box--large__height: var(--rui-Button--large__height);--rui-FormField--box--large__padding-y: 0.5625rem;--rui-FormField--box--large__padding-x: var(--rui-dimension-space-4);--rui-FormField--box--large__font-size: var(--rui-font-size-2);--rui-FormField--box--filled--default__color: var(--rui-color-text-primary);--rui-FormField--box--filled--default__border-color: var(--rui-color-border-primary);--rui-FormField--box--filled--default__background: var(--rui-color-background-basic);--rui-FormField--box--filled--default__box-shadow: none;--rui-FormField--box--filled--hover__border-color: var(--rui-color-border-primary-hover);--rui-FormField--box--filled--focus__border-color: var(--rui-color-border-primary-active);--rui-FormField--box--outline--default__color: var(--rui-color-text-primary);--rui-FormField--box--outline--default__border-color: var(--rui-color-border-primary);--rui-FormField--box--outline--default__background: var(--rui-color-background-basic);--rui-FormField--box--outline--default__box-shadow: none;--rui-FormField--box--outline--hover__border-color: var(--rui-color-border-primary-hover);--rui-FormField--box--outline--focus__border-color: var(--rui-color-border-primary-active);--rui-FormField--check__input__size: 1.125rem;--rui-FormField--check__input__border-width: var(--rui-FormField--box__border-width);--rui-FormField--check__input--focus__box-shadow: var(--rui-shadow-focus-ring);--rui-FormField--check__tap-target-size: var(--rui-dimension-tap-target-size);--rui-FormField--check__input--checkbox__border-radius: var(--rui-FormField--box__border-radius);--rui-FormField--check__input--checkbox--checked__background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 20 20%27%3e%3cpath fill=%27none%27 stroke=%27%23ffffff%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27 stroke-width=%273%27 d=%27M6 10l3 3l6-6%27/%3e%3c/svg%3e");--rui-FormField--check__input--radio__border-radius: 50%;--rui-FormField--check__input--radio--checked__background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%272%27 fill=%27%23ffffff%27/%3e%3c/svg%3e");--rui-FormField--check__input--toggle__width: 2.25rem;--rui-FormField--check__input--toggle__border-radius: 0.5625rem;--rui-FormField--check__input--toggle__background-size: contain;--rui-FormField--check__input--toggle--default__background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27%23cccccc%27/%3e%3c/svg%3e");--rui-FormField--check__input--toggle--default__background-position: left center;--rui-FormField--check__input--toggle--checked__background-image: url("data:image/svg+xml,%3csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%27-4 -4 8 8%27%3e%3ccircle r=%273%27 fill=%27%23ffffff%27/%3e%3c/svg%3e");--rui-FormField--check__input--toggle--checked__background-position: right center;--rui-FormField--check--default__border-color: var(--rui-color-border-primary);--rui-FormField--check--default__check-background-color: var(--rui-color-background-basic);--rui-FormField--check--checked__border-color: var(--rui-color-action-selected);--rui-FormField--check--checked__check-background-color: var(--rui-color-action-selected);--rui-FormLayout__row-gap: var(--rui-dimension-space-4);--rui-FormLayout--horizontal__label__width: 10em;--rui-FormLayout--horizontal__label__width--auto: auto;--rui-FormLayout--horizontal__label__width--limited: fit-content(50%);--rui-InputGroup__gap: var(--rui-dimension-space-1);--rui-InputGroup__inner-border-radius: var(--rui-dimension-radius-1);--rui-Modal__padding-x: var(--rui-dimension-space-4);--rui-Modal__padding-y: var(--rui-dimension-space-4);--rui-Modal__background: var(--rui-color-background-layer-2);--rui-Modal__box-shadow: var(--rui-shadow-layer-2);--rui-Modal__separator__width: var(--rui-dimension-border-width-1);--rui-Modal__separator__color: var(--rui-color-border-secondary);--rui-Modal__header__gap: var(--rui-dimension-space-2);--rui-Modal__outer-spacing--xs: var(--rui-dimension-space-2);--rui-Modal__outer-spacing--sm: var(--rui-dimension-space-6);--rui-Modal__footer__background: var(--rui-Modal__background);--rui-Modal__footer__gap: var(--rui-dimension-space-2);--rui-Modal__backdrop__background: rgb(0 0 0 / 50%);--rui-Modal--auto__min-width: 18rem;--rui-Modal--auto__max-width: 60rem;--rui-Modal--small__width: 20rem;--rui-Modal--medium__width: 40rem;--rui-Modal--large__width: 60rem;--rui-Modal--fullscreen__width: 100%;--rui-Modal--fullscreen__height: 100%;--rui-Modal__animation__duration: 0.25s;--rui-Modal--success__border-color: var(--rui-color-feedback-success);--rui-Modal--success__background-color: var(--rui-color-background-success);--rui-Modal--warning__border-color: var(--rui-color-feedback-warning);--rui-Modal--warning__background-color: var(--rui-color-background-warning);--rui-Modal--danger__border-color: var(--rui-color-feedback-danger);--rui-Modal--danger__background-color: var(--rui-color-background-danger);--rui-Modal--info__border-color: var(--rui-color-feedback-info);--rui-Modal--info__background-color: var(--rui-color-background-info);--rui-Modal--help__border-color: var(--rui-color-feedback-help);--rui-Modal--help__background-color: var(--rui-color-background-help);--rui-Modal--note__border-color: var(--rui-color-feedback-note);--rui-Modal--note__background-color: var(--rui-color-background-note);--rui-Paper__padding: var(--rui-dimension-space-4);--rui-Paper__border-width: 0;--rui-Paper__border-color: transparent;--rui-Paper__border-radius: var(--rui-dimension-radius-2);--rui-Paper__background-color: var(--rui-color-background-layer-1);--rui-Paper--muted__background-color: var(--rui-color-background-disabled);--rui-Paper--muted__opacity: var(--rui-ratio-disabled-opacity);--rui-Paper--raised__box-shadow: var(--rui-shadow-layer-1);--rui-Popover__max-width: 15rem;--rui-Popover__padding: var(--rui-dimension-space-3);--rui-Popover__border-width: 0;--rui-Popover__border-color: transparent;--rui-Popover__border-radius: var(--rui-dimension-radius-2);--rui-Popover__color: var(--rui-color-text-primary);--rui-Popover__background-color: var(--rui-color-background-layer-2);--rui-Popover__box-shadow: var(--rui-shadow-layer-2);--rui-Tabs__border-bottom-width: var(--rui-dimension-border-width-1);--rui-Tabs__border-bottom-color: var(--rui-color-border-primary);--rui-Tabs__gap--xs: var(--rui-dimension-space-1);--rui-Tabs__gap--sm: var(--rui-dimension-space-1);--rui-Tabs__gap--md: var(--rui-dimension-space-1);--rui-Tabs__padding-x: 0;--rui-Tabs__item__padding--xs: var(--rui-dimension-space-3);--rui-Tabs__item__padding--sm: var(--rui-dimension-space-4);--rui-Tabs__item__padding--md: var(--rui-dimension-space-4);--rui-Tabs__item__font-weight: inherit;--rui-Tabs__item__color: var(--rui-color-text-secondary);--rui-Tabs__item__border-width: var(--rui-dimension-border-width-1);--rui-Tabs__item__border-color: var(--rui-color-border-secondary) var(--rui-color-border-secondary) transparent var(--rui-color-border-secondary);--rui-Tabs__item__border-radius: var(--rui-dimension-radius-2);--rui-Tabs__item__background-color: var(--rui-color-background-layer-1);--rui-Tabs__item__box-shadow: none;--rui-Tabs__item__icon__gap: var(--rui-dimension-space-2);--rui-Tabs__item--hover__font-weight: var(--rui-Tabs__item__font-weight);--rui-Tabs__item--hover__color: var(--rui-Tabs__item__color);--rui-Tabs__item--hover__border-width: var(--rui-Tabs__item__border-width);--rui-Tabs__item--hover__border-color: var(--rui-Tabs__item__border-color);--rui-Tabs__item--hover__background-color: var(--rui-Tabs__item__background-color);--rui-Tabs__item--hover__box-shadow: var(--rui-Tabs__item__box-shadow);--rui-Tabs__item--hover__shift-y: -0.15rem;--rui-Tabs__item--hover__label__shift-y: 0;--rui-Tabs__item--active__font-weight: inherit;--rui-Tabs__item--active__color: var(--rui-color-text-primary);--rui-Tabs__item--active__border-width: var(--rui-Tabs__item__border-width);--rui-Tabs__item--active__border-color: var(--rui-Tabs__border-bottom-color) var(--rui-Tabs__border-bottom-color) transparent var(--rui-Tabs__border-bottom-color);--rui-Tabs__item--active__background-color: var(--rui-Tabs__item__background-color);--rui-Tabs__item--active__box-shadow: var(--rui-Tabs__item__box-shadow);--rui-Tabs__item--active__shift-y: -0.25em;--rui-Tabs__item--active__label__shift-y: 0;--rui-TextLink__color: var(--rui-color-text-link);--rui-TextLink__text-decoration: var(--rui-text-decoration-link);--rui-TextLink--hover__color: var(--rui-color-text-link-hover);--rui-TextLink--hover__text-decoration: var(--rui-text-decoration-link-hover);--rui-TextLink--active__color: var(--rui-color-text-link-active);--rui-TextLink--active__text-decoration: var(--rui-text-decoration-link-active);--rui-Toolbar__gap: var(--rui-dimension-space-4);--rui-Toolbar__gap--dense: var(--rui-dimension-space-2)}}@layer foundation.generic{html{box-s