:root {
	--color-black: #000;
	--color-white: #fff;
	--ga-color-black: #000;
	--ga-color-blue-10: #edf4fe;
	--ga-color-blue-40: #93bbf9;
	--ga-color-blue-60: #366af6;
	--ga-color-blue-70: #1f4ddb;
	--ga-color-teal-10: #ecf5f4;
	--ga-color-teal-20: #d5e8e6;
	--ga-color-teal-30: #b4d7d4;
	--ga-color-teal-40: #92c3c0;
	--ga-color-teal-50: #51a39e;
	--ga-color-teal-60: #3a837e;
	--ga-color-teal-70: #2c6764;
	--ga-color-teal-80: #21514e;
	--ga-color-teal-90: #143734;
	--ga-color-teal-100: #081f1f;
	--ga-color-cyan-60: #377ea0;
	--ga-color-cyan-70: #2a6480;
	--ga-color-cyan-80: #1f4e66;
	--ga-color-cyan-90: #133445;
	--ga-color-green-10: #eef5ee;
	--ga-color-green-40: #9bc59b;
	--ga-color-green-60: #448548;
	--ga-color-green-70: #2e6b31;
	--ga-color-grey-10: #f2f2f2;
	--ga-color-grey-40: #b9b9b9;
	--ga-color-indigo-10: #f0f2fe;
	--ga-color-indigo-40: #adb4f9;
	--ga-color-lime-10: #edf6dd;
	--ga-color-lime-40: #a5c656;
	--ga-color-neutral-10: #f2f3f5;
	--ga-color-neutral-20: #e2e4e9;
	--ga-color-neutral-30: #cccfd7;
	--ga-color-neutral-50: #8f95a4;
	--ga-color-neutral-60: #6f7687;
	--ga-color-orange-10: #fcf0e7;
	--ga-color-orange-20: #fae0ce;
	--ga-color-orange-30: #f5c3a1;
	--ga-color-orange-40: #f2a676;
	--ga-color-orange-60: #bb5822;
	--ga-color-pink-10: #fbeefc;
	--ga-color-pink-40: #e79dee;
	--ga-color-purple-10: #f3f1fe;
	--ga-color-purple-40: #c3acf9;
	--ga-color-purple-80: #591ab5;
	--ga-color-red-10: #fcf1ee;
	--ga-color-red-40: #eca79e;
	--ga-color-red-60: #cc453e;
	--ga-color-red-70: #b0241d;
	--ga-color-rose-10: #fcf0f4;
	--ga-color-rose-40: #efa1bd;
	--ga-color-white: #fff;
	--ga-color-yellow-10: #fdf5ae;
	--ga-color-yellow-40: #e1b402;
	--ga-color-miscellaneous-overlay: #70778891;
	--ga-color-icon-pictograms-pictogram-emphasis: #377ea03d;
	--ga-color-icon-pictograms-pictogram-fill: #b9b9b914;
	--ga-color-neutral: var(--ga-color-neutral-30);
	--ga-color-primary: var(--ga-color-cyan-80);
	--ga-color-primary-60: var(--ga-color-cyan-60);
	--ga-color-primary-70: var(--ga-color-cyan-70);
	--ga-color-primary-90: var(--ga-color-cyan-90);
	--ga-color-secondary: var(--ga-color-orange-20);
	--ga-color-secondary-10: var(--ga-color-orange-10);
	--ga-color-secondary-30: var(--ga-color-orange-30);
	--ga-color-border-action: var(--ga-color-primary);
	--ga-color-border-action-hover: var(--ga-color-primary-60);
	--ga-color-border-action-hover-2: var(--ga-color-secondary-30);
	--ga-color-border-disabled: var(--ga-color-neutral);
	--ga-color-border-error: var(--ga-color-error);
	--ga-color-border-focus: var(--ga-color-primary);
	--ga-color-border-information: var(--ga-color-information);
	--ga-color-border-primary: var(--ga-color-neutral-60);
	--ga-color-border-secondary: var(--ga-color-secondary-30);
	--ga-color-border-success: var(--ga-color-success);
	--ga-color-border-warning: var(--ga-color-warning);
	--ga-color-error: var(--ga-color-red-60);
	--ga-color-error-light: var(--ga-color-utility-red-light);
	--ga-color-icon-action: var(--ga-color-primary);
	--ga-color-icon-action-hover: var(--ga-color-primary-60);
	--ga-color-icon-disabled: var(--ga-color-neutral);
	--ga-color-icon-error: var(--ga-color-error);
	--ga-color-icon-information: var(--ga-color-information);
	--ga-color-icon-on-action: var(--ga-color-secondary);
	--ga-color-icon-on-disabled: var(--ga-color-neutral-60);
	--ga-color-icon-on-primary: var(--ga-color-white);
	--ga-color-icon-primary: var(--ga-color-primary-90);
	--ga-color-icon-success: var(--ga-color-success);
	--ga-color-icon-warning: var(--ga-color-warning);
	--ga-color-information: var(--ga-color-blue-60);
	--ga-color-information-light: var(--ga-color-utility-blue-light);
	--ga-color-miscellaneous-skeleton-element: var(--ga-color-neutral-10);
	--ga-color-miscellaneous-skeleton-highlight: var(--ga-color-neutral-20);
	--ga-color-sequential-graph-10: var(--ga-color-teal-10);
	--ga-color-sequential-graph-20: var(--ga-color-teal-20);
	--ga-color-sequential-graph-30: var(--ga-color-teal-30);
	--ga-color-sequential-graph-40: var(--ga-color-teal-40);
	--ga-color-sequential-graph-50: var(--ga-color-teal-50);
	--ga-color-sequential-graph-60: var(--ga-color-teal-60);
	--ga-color-sequential-graph-70: var(--ga-color-teal-70);
	--ga-color-sequential-graph-80: var(--ga-color-teal-80);
	--ga-color-sequential-graph-90: var(--ga-color-teal-90);
	--ga-color-sequential-graph-100: var(--ga-color-teal-100);
	--ga-color-success: var(--ga-color-green-60);
	--ga-color-success-light: var(--ga-color-utility-green-light);
	--ga-color-surface-action: var(--ga-color-primary);
	--ga-color-surface-action-hover: var(--ga-color-primary-90);
	--ga-color-surface-action-hover-2: var(--ga-color-orange-20);
	--ga-color-surface-disable-selected: var(--ga-color-neutral-60);
	--ga-color-surface-disabled: var(--ga-color-neutral-20);
	--ga-color-surface-error: var(--ga-color-utility-red-light);
	--ga-color-surface-information: var(--ga-color-information-light);
	--ga-color-surface-page: var(--ga-color-neutral-10);
	--ga-color-surface-primary: var(--ga-color-white);
	--ga-color-surface-success: var(--ga-color-success-light);
	--ga-color-surface-warning: var(--ga-color-utility-orange-light);
	--ga-color-text-action: var(--ga-color-primary);
	--ga-color-text-action-hover: var(--ga-color-primary-90);
	--ga-color-text-body: var(--ga-color-primary-90);
	--ga-color-text-disable-selected: var(--ga-color-neutral-60);
	--ga-color-text-disabled: var(--ga-color-utility-grey);
	--ga-color-text-error: var(--ga-color-primary-90);
	--ga-color-text-headings: var(--ga-color-primary-90);
	--ga-color-text-information: var(--ga-color-primary-90);
	--ga-color-text-link-visited: var(--ga-color-purple-80);
	--ga-color-text-on-action: var(--ga-color-secondary-10);
	--ga-color-text-on-disabled: var(--ga-color-primary-70);
	--ga-color-text-success: var(--ga-color-primary-90);
	--ga-color-text-warning: var(--ga-color-primary-90);
	--ga-color-utility-blue: var(--ga-color-blue-40);
	--ga-color-utility-blue-light: var(--ga-color-blue-10);
	--ga-color-utility-green: var(--ga-color-green-40);
	--ga-color-utility-green-light: var(--ga-color-green-10);
	--ga-color-utility-grey: var(--ga-color-grey-40);
	--ga-color-utility-grey-light: var(--ga-color-grey-10);
	--ga-color-utility-indigo: var(--ga-color-indigo-40);
	--ga-color-utility-indigo-light: var(--ga-color-indigo-10);
	--ga-color-utility-lime: var(--ga-color-lime-40);
	--ga-color-utility-lime-light: var(--ga-color-lime-10);
	--ga-color-utility-orange: var(--ga-color-orange-40);
	--ga-color-utility-orange-light: var(--ga-color-orange-10);
	--ga-color-utility-pink: var(--ga-color-pink-40);
	--ga-color-utility-pink-light: var(--ga-color-pink-10);
	--ga-color-utility-purple: var(--ga-color-purple-40);
	--ga-color-utility-purple-light: var(--ga-color-purple-10);
	--ga-color-utility-red: var(--ga-color-red-40);
	--ga-color-utility-red-light: var(--ga-color-red-10);
	--ga-color-utility-rose: var(--ga-color-rose-40);
	--ga-color-utility-rose-light: var(--ga-color-rose-10);
	--ga-color-utility-teal: var(--ga-color-teal-40);
	--ga-color-utility-teal-light: var(--ga-color-teal-10);
	--ga-color-utility-yellow: var(--ga-color-yellow-40);
	--ga-color-utility-yellow-light: var(--ga-color-yellow-10);
	--ga-color-warning: var(--ga-color-orange-60);
	--ga-color-warning-light: var(--ga-color-utility-orange-light);
	--ga-font-family-primary: "Inter",-system-ui,sans-serif;
	--ga-font-weight-bold: 700;
	--ga-font-weight-medium: 500;
	--ga-font-weight-normal: 400;
	--ga-font-weight-semibold: 600;
	--ga-radius: 4px;
	--ga-radius-round: 999px;
	--ga-radius-sharp: .02rem;
	--ga-size-border-width-lg: 4px;
	--ga-size-border-width-md: 2px;
	--ga-size-border-width-none: 0;
	--ga-size-border-width-sm: 1px;
	--ga-size-spacing-00: 0;
	--ga-size-spacing-01: .125rem;
	--ga-size-spacing-02: 4px;
	--ga-size-spacing-03: .5rem;
	--ga-size-spacing-04: .75rem;
	--ga-size-spacing-05: 16px;
	--ga-size-spacing-06: 24px;
	--ga-size-spacing-07: 32px;
	--ga-size-spacing-08: 40px;
	--ga-size-spacing-09: 3rem;
	--ga-size-spacing-10: 4rem;
	--ga-size-spacing-11: 5rem;
	--ga-size-spacing-12: 96px;
	--ga-size-spacing-13: 160px;
	--ga-text-2xl-font-size: 24px;
	--ga-text-2xl-font-style: normal;
	--ga-text-2xl-line-height: 2.25rem;
	--ga-text-2xl-tracking: -.019rem;
	--ga-text-3xl-font-size: 2.25rem;
	--ga-text-3xl-font-style: normal;
	--ga-text-3xl-line-height: 56px;
	--ga-text-3xl-tracking: -.022rem;
	--ga-text-lg-font-size: 16px;
	--ga-text-lg-font-style: normal;
	--ga-text-lg-line-height: 24px;
	--ga-text-lg-tracking: -.011rem;
	--ga-text-md-font-size: .875rem;
	--ga-text-md-font-style: normal;
	--ga-text-md-line-height: 20px;
	--ga-text-md-tracking: -.006rem;
	--ga-text-sm-font-size: .75rem;
	--ga-text-sm-font-style: normal;
	--ga-text-sm-line-height: 20px;
	--ga-text-sm-tracking: 0;
	--ga-text-xl-font-size: 20px;
	--ga-text-xl-font-style: normal;
	--ga-text-xl-line-height: 32px;
	--ga-text-xl-tracking: -.017rem;
	--ga-text-xs-font-size: .6875rem;
	--ga-text-xs-font-style: normal;
	--ga-text-xs-line-height: 16px;
	--ga-text-xs-tracking: .005rem;
	--color-cyan-60: var(--ga-color-cyan-60);
	--color-cyan-70: var(--ga-color-cyan-70);
	--color-cyan-80: var(--ga-color-cyan-80);
	--color-cyan-90: var(--ga-color-cyan-90);
	--color-blue-10: var(--ga-color-blue-10);
	--color-blue-40: var(--ga-color-blue-40);
	--color-blue-60: var(--ga-color-blue-60);
	--color-green-10: var(--ga-color-green-10);
	--color-green-40: var(--ga-color-green-40);
	--color-green-60: var(--ga-color-green-60);
	--color-grey-10: var(--ga-color-grey-10);
	--color-grey-40: var(--ga-color-grey-40);
	--color-indigo-10: var(--ga-color-indigo-10);
	--color-indigo-40: var(--ga-color-indigo-40);
	--color-lime-10: var(--ga-color-lime-10);
	--color-lime-40: var(--ga-color-lime-40);
	--color-neutral: var(--ga-color-neutral);
	--color-neutral-10: var(--ga-color-neutral-10);
	--color-neutral-20: var(--ga-color-neutral-20);
	--color-neutral-30: var(--ga-color-neutral-30);
	--color-orange-10: var(--ga-color-orange-10);
	--color-orange-20: var(--ga-color-orange-20);
	--color-orange-30: var(--ga-color-orange-30);
	--color-orange-40: var(--ga-color-orange-40);
	--color-orange-60: var(--ga-color-orange-60);
	--color-pink-10: var(--ga-color-pink-10);
	--color-pink-40: var(--ga-color-pink-40);
	--color-purple-10: var(--ga-color-purple-10);
	--color-purple-40: var(--ga-color-purple-40);
	--color-red-10: var(--ga-color-red-10);
	--color-red-40: var(--ga-color-red-40);
	--color-red-60: var(--ga-color-red-60);
	--color-rose-10: var(--ga-color-rose-10);
	--color-rose-40: var(--ga-color-rose-40);
	--color-teal-10: var(--ga-color-teal-10);
	--color-teal-20: var(--ga-color-teal-20);
	--color-teal-30: var(--ga-color-teal-30);
	--color-teal-40: var(--ga-color-teal-40);
	--color-teal-50: var(--ga-color-teal-50);
	--color-teal-60: var(--ga-color-teal-60);
	--color-teal-70: var(--ga-color-teal-70);
	--color-teal-80: var(--ga-color-teal-80);
	--color-teal-90: var(--ga-color-teal-90);
	--color-teal-100: var(--ga-color-teal-100);
	--color-yellow-10: var(--ga-color-yellow-10);
	--color-yellow-40: var(--ga-color-yellow-40);
	--font-inter: Inter, ui-sans-serif, system-ui, sans-serif;
	/* fix for Chrome */
	--font-inter--font-feature-settings: 'liga' 1, 'calt' 1;
	--default-font-family: var(--font-inter);
	--text-xs: calc( var(--ga-text-xs-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-xs--line-height: calc( var(--ga-text-xs-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-xs--letter-spacing: calc( var(--ga-text-xs-tracking) * var(--ga-base-scaling-factor, 1) );
	--text-sm: calc( var(--ga-text-sm-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-sm--line-height: calc( var(--ga-text-sm-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-sm--letter-spacing: 0;
	--text-md: calc( var(--ga-text-md-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-md--line-height: calc( var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-md--letter-spacing: calc( var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1) );
	--text-lg: calc( var(--ga-text-lg-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-lg--line-height: calc( var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-lg--letter-spacing: calc( var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1) );
	--text-xl: calc( var(--ga-text-xl-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-xl--line-height: calc( var(--ga-text-xl-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-xl--letter-spacing: calc( var(--ga-text-xl-tracking) * var(--ga-base-scaling-factor, 1) );
	--text-2xl: calc( var(--ga-text-2xl-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-2xl--line-height: calc( var(--ga-text-2xl-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-2xl--letter-spacing: calc( var(--ga-text-2xl-tracking) * var(--ga-base-scaling-factor, 1) );
	--text-3xl: calc( var(--ga-text-3xl-font-size) * var(--ga-base-scaling-factor, 1) );
	--text-3xl--line-height: calc( var(--ga-text-3xl-line-height) * var(--ga-base-scaling-factor, 1) );
	--text-3xl--letter-spacing: calc( var(--ga-text-3xl-tracking) * var(--ga-base-scaling-factor, 1) );
	--font-weight-normal: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 700;
	--radius: var(--ga-radius);
	--radius-sharp: calc( var(--ga-radius-sharp) * var(--ga-base-scaling-factor, 1) );
	--spacing: 4px;
}

body,
:host {
	font-size: 14px;
	font-family: Inter, ui-sans-serif, system-ui, sans-serif;
	color: var(--ga-color-text-body);
}

/* menu */
.ga-menu {
	font-size: 16px;
	display: flex;
	max-width: 80ch;
	flex-direction: column;
	align-items: stretch;
	overflow: hidden;
	border-radius: 6px;
	border: 1px solid var(--ga-color-border-primary);
	background: var(--ga-color-surface-primary);
}

.ga-menu__item {
	position: relative;
	display: flex;
	min-height: 36px;
	flex-shrink: 0;
	cursor: pointer;
	flex-direction: row;
	gap: 8px;
	padding: 8px 12px;
	text-align: left;
	justify-content: left;
	line-height: 2;
}

.ga-menu__item:first-child {
border-top-left-radius: 6px;
border-top-right-radius: 6px;
}

.ga-menu__item:last-child {
border-bottom-left-radius: 6px;
border-bottom-right-radius: 6px;
}

.ga-menu__item:hover {
background: var(--ga-color-surface-action-hover-2);
}

.ga-menu__item:hover .ga-menu__item-icon {
color: var(--ga-color-icon-action);
}

.ga-menu__item:hover .ga-menu__item-label {
color: var(--ga-color-text-action-hover);
}

.ga-menu__item:focus,
.ga-menu__item:focus-visible {
outline: none;
}

.ga-menu__item.ga-menu__item--disabled {
cursor: not-allowed;
background: var(--ga-color-surface-primary);
}

.ga-menu__item.ga-menu__item--disabled .ga-menu__item-icon {
color: var(--ga-color-icon-disabled);
}

.ga-menu__item.ga-menu__item--disabled .ga-menu__item-label {
color: var(--ga-color-text-disabled);
}

.ga-menu__item.ga-menu__item--selected {
background: var(--ga-color-surface-action);
color: var(--ga-color-text-on-action);
}

.ga-menu__item.ga-menu__item--selected .ga-menu__item-icon {
color: var(--ga-color-icon-on-action);
}

.ga-menu__item.ga-menu__item--selected .ga-menu__item-label {
color: var(--ga-color-text-on-action);
}

.ga-menu__item.ga-menu__item--selected:hover {
background: var(--ga-color-surface-action-hover);
}

.ga-menu__item.ga-menu__item--selected.ga-menu__item--disabled {
background: var(--ga-color-surface-primary);
}

.ga-menu__item.ga-menu__item--selected.ga-menu__item--disabled .ga-menu__item-icon {
	color: var(--ga-color-icon-on-disabled);
}

.ga-menu__item.ga-menu__item--selected.ga-menu__item--disabled .ga-menu__item-label {
	color: var(--ga-color-text-disable-selected);
}

.ga-menu:not(:focus-within) .ga-menu__item.ga-menu__item--active::after,
.ga-menu__item:focus-visible::after {
	position: absolute;
	top: 1px;
	left: 1px;
	height: calc(100% - 2px);
	width: calc(100% - 2px);
	border-radius: 6px;
	border: 2px solid var(--ga-color-border-focus);
	content: '';
}

.ga-menu__item.ga-menu__item--selected::after {
	border-color: var(--ga-color-white);
}

.ga-menu__item-icon {
	margin-top: 2px;
	flex-shrink: 0;
	color: var(--ga-color-icon-primary);
}

.ga-menu__item-content {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.ga-menu__item-title {
	display: flex;
	align-items: center;
	gap: 8px;
}

.ga-menu__item-label {
	font-size: 16px;
	height: 20px;
	flex: 1;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: 500;
	color: var(--ga-color-text-action);
}

.ga-menu__item-shortcut {
	flex-shrink: 0;
	border-radius: 6px;
	border: 1px solid var(--ga-color-border-disabled);
	background: white;
	padding: 0 4px;
	font-size: 12px;
	font-weight: 500;
	color: var(--ga-color-text-body);
}

.ga-menu__item-description {
	font-size: 12px;
	color: var(--ga-color-text-disable-selected);
}

.ga-menu__separator {
	margin-left: 12px;
	border-bottom: 1px solid var(--ga-color-border-primary);
}

.ga-menu__title {
	padding: 12px 12px 8px 12px;
	font-size: 14px;
	font-weight: 600;
}

/* tabs */
.ga-tabs {
  display: flex;
  gap: 8px;
}

.ga-tabs.ga-tabs--keyline {
  border: 1px solid var(--ga-color-border-primary);
}

.ga-tabs .ga-tabs__tab {
  font-size: 16px;
  position: relative;
  display: flex;
  height: 32px;
  cursor: pointer;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--ga-color-surface-primary);
  background: var(--ga-color-surface-primary);
  line-height: 1.25;
  font-weight: 500;
  color: var(--ga-color-text-action);
}

.ga-tabs .ga-tabs__tab.ga-tabs__tab--selected {
  border: 1px solid var(--ga-color-border-action);
  font-weight: 600;
}

.ga-tabs .ga-tabs__tab.ga-tabs__tab--disabled {
  cursor: not-allowed;
  color: var(--ga-color-text-disabled);
}

.ga-tabs .ga-tabs__tab.ga-tabs__tab--disabled.ga-tabs__tab--selected {
  border: 1px solid var(--ga-color-border-disabled);
}

.ga-tabs .ga-tabs__tab.ga-tabs__tab--disabled .ga-tabs__tab-icon {
  color: var(--ga-color-icon-disabled);
}

.ga-tabs .ga-tabs__tab:not(.ga-tabs__tab--disabled):hover {
  border: 1px solid var(--ga-color-border-action-hover);
  color: var(--ga-color-text-action-hover);
}

.ga-tabs .ga-tabs__tab:not(.ga-tabs__tab--disabled):hover .ga-tabs__tab-icon {
  color: var(--ga-color-icon-primary);
}

.ga-tabs .ga-tabs__tab:focus-visible {
  outline: none;
}

.ga-tabs .ga-tabs__tab:focus-visible::after,
.ga-tabs .ga-tabs__tab.ga-tabs__tab--focused::after {
  position: absolute;
  inset: -4px;
  border-radius: 6px;
  border: 2px solid var(--ga-color-border-focus);
  content: '';
}

.ga-tabs .ga-tabs__tab .ga-tabs__tab-icon {
  color: var(--ga-color-icon-action);
}

.ga-tabs.ga-tabs--horizontal {
  flex-direction: row;
}

.ga-tabs.ga-tabs--horizontal.ga-tabs--keyline {
  border-bottom: 1px solid var(--ga-color-border-primary);
}

.ga-tabs.ga-tabs--horizontal .ga-tabs__tab {
  border-bottom: 4px solid transparent;
  padding-left: 16px;
  padding-right: 16px;
  padding-top: 8px;
  padding-bottom: 4px;
}

.ga-tabs.ga-tabs--horizontal .ga-tabs__tab:focus-visible::after,
.ga-tabs.ga-tabs--horizontal .ga-tabs__tab.ga-tabs__tab--focused::after {
  bottom: -8px;
}

.ga-tabs.ga-tabs--vertical {
  flex-direction: column;
}

.ga-tabs.ga-tabs--vertical.ga-tabs--keyline {
  border-left: 1px solid var(--ga-color-border-primary);
}

.ga-tabs.ga-tabs--vertical .ga-tabs__tab {
  border-left: 4px solid transparent;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 16px;
  padding-left: 12px;
}

.ga-tabs.ga-tabs--vertical .ga-tabs__tab:focus-visible::after,
.ga-tabs.ga-tabs--vertical .ga-tabs__tab.ga-tabs__tab--focused::after {
  left: -8px;
}

/* link */
a, .ga-link {
	font-size: 14px;
	display: inline-flex;
	height: 20px;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	gap: 4px;
	border-radius: 6px;
	padding-left: 2px;
	padding-right: 2px;
	vertical-align: text-top;
	font-weight: 500;
	white-space: nowrap;
	color: var(--ga-color-text-action);
	font-variant-numeric: tabular-nums;
	text-decoration: none;
}

a:hover {
	color: var(--ga-color-teal-60);
	text-decoration-color: var(--ga-color-primary-90);
	text-decoration-thickness: 1px;
}

.ga-link.ga-link--inline {
  text-decoration: underline;
  text-decoration-color: var(--ga-color-primary-90);
  text-decoration-thickness: 1px;
}

.ga-link.ga-link--small {
  height: 16px;
  font-size: 14px;
}

ga-link.ga-link--large {
  height: 24px;
  font-size: 1.125rem;
}

.ga-link.ga-link--disabled {
  cursor: not-allowed;
  color: var(--ga-color-text-disabled);
}

.ga-link.ga-link--disabled .ga-link__icon {
  color: var(--ga-color-icon-disabled);
}

.ga-link:not(.ga-link--disabled):visited {
  color: var(--ga-color-text-link-visited);
  text-decoration-color: var(--ga-color-text-link-visited);
}

.ga-link:not(.ga-link--disabled):hover {
	color: var(--ga-color-text-action-hover);
	text-decoration-color: var(--ga-color-primary-90);
	text-decoration-thickness: 1px;
}

a:active, .ga-link:not(.ga-link--disabled):active {
	color: var(--ga-color-text-action);
	text-decoration-color: var(--ga-color-text-action);
}

.ga-link:not(.ga-link--disabled):focus-visible {
  outline: 2px solid var(--ga-color-border-focus);
  outline-offset: 2px;
}

.ga-link:not(:visited) .ga-link__icon {
  color: var(--ga-color-icon-primary);
}

/* buttons */
.ga-button {
  font-size: 16px;
  display: inline-flex;
  height: 40px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 6px;
  padding-left: 16px;
  padding-right: 16px;
  vertical-align: middle;
  line-height: 1;
  font-weight: 500;
  white-space: nowrap;
}

.ga-button .ga-icon {
  color: var(--ga-color-icon-action);
}

.ga-button:focus-visible {
  outline: 2px solid var(--ga-color-border-focus);
  outline-offset: 2px;
}

.ga-button:disabled {
  cursor: not-allowed;
}

.ga-button:disabled .ga-icon {
  color: var(--ga-color-icon-on-disabled);
}

/* Primary Button */
.ga-button.ga-button--primary {
  background: var(--ga-color-surface-action);
  color: var(--ga-color-text-on-action);
}

.ga-button.ga-button--primary .ga-icon {
  color: var(--ga-color-icon-on-action);
}

.ga-button.ga-button--primary:hover {
  background: var(--ga-color-surface-action-hover);
}

.ga-button.ga-button--primary:active {
  background: var(--ga-color-primary-70);
}

.ga-button.ga-button--primary:disabled {
  background: var(--ga-color-surface-disabled);
  color: var(--ga-color-text-disable-selected);
}

.ga-button.ga-button--primary:disabled .ga-icon {
  color: var(--ga-color-icon-on-disabled);
}

/* Secondary Button */
.ga-button.ga-button--secondary {
  border: 1px solid var(--ga-color-border-action);
  background: var(--ga-color-surface-primary);
  color: var(--ga-color-text-action);
}

.ga-button.ga-button--secondary:hover {
  background: var(--ga-color-surface-action-hover-2);
  color: var(--ga-color-text-action-hover);
}

.ga-button.ga-button--secondary:active {
  background: var(--ga-color-surface-primary);
}

.ga-button.ga-button--secondary:disabled {
  border-color: var(--ga-color-border-disabled);
  background: var(--ga-color-surface-page);
  color: var(--ga-color-text-disabled);
}

.ga-button.ga-button--secondary:disabled .ga-icon {
  color: var(--ga-color-icon-on-disabled);
}

/* Ghost Button */
.ga-button.ga-button--ghost {
  border: 1px solid transparent;
  background: transparent;
  color: var(--ga-color-text-action);
}

.ga-button.ga-button--ghost:hover {
  border-color: var(--ga-color-border-action-hover);
  color: var(--ga-color-text-action-hover);
}

.ga-button.ga-button--ghost:active {
  color: var(--ga-color-text-action);
}

.ga-button.ga-button--ghost:disabled {
  border-color: transparent;
  color: var(--ga-color-text-disabled);
}

.ga-button.ga-button--ghost:disabled .ga-icon {
  color: var(--ga-color-icon-disabled);
}

/* Transparent Button */
.ga-button.ga-button--transparent {
  border: 1px solid var(--ga-color-border-action);
  background: transparent;
  color: var(--ga-color-text-action);
}

.ga-button.ga-button--transparent:hover {
  background: var(--ga-color-surface-action-hover-2);
  color: var(--ga-color-text-action-hover);
}

.ga-button.ga-button--transparent:focus-visible {
  border-color: var(--ga-color-border-action);
}

.ga-button.ga-button--transparent:active {
  background: transparent;
}

.ga-button.ga-button--transparent:disabled {
  border-color: var(--ga-color-border-disabled);
  background: transparent;
  color: var(--ga-color-text-disable-selected);
}

.ga-button.ga-button--transparent:disabled .ga-icon {
  color: var(--ga-color-icon-on-disabled);
}

/* Icon Only Button */
.ga-button.ga-button--icon-only {
  width: 40px;
  padding-left: 0;
  padding-right: 0;
}


/* Tooltip */
.ga-tooltip {
  font-size: 16px;
  position: relative;
  max-width: 25rem;
  border-radius: 6px;
  background: var(--ga-color-surface-action-hover);
  padding: 8px;
  color: var(--ga-color-text-on-action);
}

/* Positioning helpers for tooltip arrow */
.ga-tooltip.ga-tooltip--top-start::before,
.ga-tooltip.ga-tooltip--top-center::before,
.ga-tooltip.ga-tooltip--top-end::before,
.ga-tooltip.ga-tooltip--bottom-start::before,
.ga-tooltip.ga-tooltip--bottom-center::before,
.ga-tooltip.ga-tooltip--bottom-end::before,
.ga-tooltip.ga-tooltip--left-start::before,
.ga-tooltip.ga-tooltip--left-center::before,
.ga-tooltip.ga-tooltip--left-end::before,
.ga-tooltip.ga-tooltip--right-start::before,
.ga-tooltip.ga-tooltip--right-center::before,
.ga-tooltip.ga-tooltip--right-end::before {
  position: absolute;
  content: '';
}

/* Margin helpers */
.ga-tooltip.ga-tooltip--top-start,
.ga-tooltip.ga-tooltip--top-center,
.ga-tooltip.ga-tooltip--top-end {
  margin-bottom: 8px;
}
.ga-tooltip.ga-tooltip--bottom-start,
.ga-tooltip.ga-tooltip--bottom-center,
.ga-tooltip.ga-tooltip--bottom-end {
  margin-top: 8px;
}
.ga-tooltip.ga-tooltip--left-start,
.ga-tooltip.ga-tooltip--left-center,
.ga-tooltip.ga-tooltip--left-end {
  margin-right: 8px;
}
.ga-tooltip.ga-tooltip--right-start,
.ga-tooltip.ga-tooltip--right-center,
.ga-tooltip.ga-tooltip--right-end {
  margin-left: 8px;
}

/* Top arrow */
.ga-tooltip.ga-tooltip--top-start::before,
.ga-tooltip.ga-tooltip--top-center::before,
.ga-tooltip.ga-tooltip--top-end::before {
  bottom: -8px;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid var(--ga-color-surface-action-hover);
}

/* Bottom arrow */
.ga-tooltip.ga-tooltip--bottom-start::before,
.ga-tooltip.ga-tooltip--bottom-center::before,
.ga-tooltip.ga-tooltip--bottom-end::before {
  top: -8px;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--ga-color-surface-action-hover);
}

/* Top arrow horizontal position */
.ga-tooltip.ga-tooltip--top-start::before,
.ga-tooltip.ga-tooltip--bottom-start::before {
  left: 16px;
}
.ga-tooltip.ga-tooltip--top-center::before,
.ga-tooltip.ga-tooltip--bottom-center::before {
  left: 50%;
  transform: translateX(-50%);
}
.ga-tooltip.ga-tooltip--top-end::before,
.ga-tooltip.ga-tooltip--bottom-end::before {
  right: 16px;
}

/* Left arrow */
.ga-tooltip.ga-tooltip--left-start::before,
.ga-tooltip.ga-tooltip--left-center::before,
.ga-tooltip.ga-tooltip--left-end::before {
  right: -8px;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid var(--ga-color-surface-action-hover);
}

/* Right arrow */
.ga-tooltip.ga-tooltip--right-start::before,
.ga-tooltip.ga-tooltip--right-center::before,
.ga-tooltip.ga-tooltip--right-end::before {
  left: -8px;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-right: 8px solid var(--ga-color-surface-action-hover);
}

/* Left arrow vertical position */
.ga-tooltip.ga-tooltip--left-start::before,
.ga-tooltip.ga-tooltip--right-start::before {
  top: 16px;
}
.ga-tooltip.ga-tooltip--left-center::before,
.ga-tooltip.ga-tooltip--right-center::before {
  top: 50%;
  transform: translateY(-50%);
}
.ga-tooltip.ga-tooltip--left-end::before,
.ga-tooltip.ga-tooltip--right-end::before {
  bottom: 16px;
}

/* Title styling */
.ga-tooltip .ga-tooltip__title {
  margin-bottom: 4px;
  font-weight: 600;
}


/* input */
.ga-input {
  font-size: 16px;
  display: flex;
  height: 40px;
  width: 12.5rem;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  border-radius: 6px;
  border: 1px solid var(--ga-color-border-primary);
  background: var(--ga-color-surface-primary);
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 8px;
  padding-bottom: 8px;
}

.ga-input:hover {
  border-color: var(--ga-color-border-action-hover);
}

.ga-input:hover:has(input:not(:placeholder-shown)),
.ga-input:hover:is(input:not(:placeholder-shown)) {
  background: var(--ga-color-surface-action-hover-2);
}

.ga-input:has(input:disabled),
.ga-input:is(input:disabled) {
  border-color: var(--ga-color-border-disabled);
  background: var(--ga-color-surface-disabled);
  color: var(--ga-color-text-disable-selected);
}

.ga-input:has(input:disabled):has(input:not(:placeholder-shown)),
.ga-input:has(input:disabled):is(input:not(:placeholder-shown)),
.ga-input:is(input:disabled):has(input:not(:placeholder-shown)),
.ga-input:is(input:disabled):is(input:not(:placeholder-shown)) {
  border-color: var(--ga-color-surface-disable-selected);
  background: var(--ga-color-surface-disable-selected);
  color: var(--ga-color-text-on-action);
}

.ga-input:has(input:focus):not(.ga-input--invalid):not(.ga-input--success),
.ga-input:is(input:focus):not(.ga-input--invalid):not(.ga-input--success) {
  border-color: var(--ga-color-border-focus);
  outline: 1px solid var(--ga-color-border-focus);
}

.ga-input.ga-input--invalid {
  border-color: var(--ga-color-border-error);
  outline: 1px solid var(--ga-color-border-error);
}

.ga-input.ga-input--invalid:has(input:not(:placeholder-shown)),
.ga-input.ga-input--invalid:is(input:not(:placeholder-shown)) {
  background: var(--ga-color-surface-error);
}

.ga-input.ga-input--success {
  border-color: var(--ga-color-border-success);
  outline: 1px solid var(--ga-color-border-success);
}

.ga-input.ga-input--success:has(input:not(:placeholder-shown)),
.ga-input.ga-input--success:is(input:not(:placeholder-shown)) {
  background: var(--ga-color-surface-success);
}

.ga-input input,
.ga-input:is(input) {
  min-width: 0;
  line-height: 1.5;
}

.ga-input input::placeholder,
.ga-input:is(input)::placeholder {
  color: var(--ga-color-text-disabled);
}

.ga-input input {
  height: 24px;
  width: 100%;
  outline: none;
}


/* checkbox */
.ga-checkbox {
  position: relative;
  display: inline-flex;
  gap: 8px;
}

.ga-checkbox .ga-checkbox__marker {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  height: 16px;
  width: 16px;
  border-radius: 6px;
  border: 2px solid var(--ga-color-border-action);
  color: #fff;
  background: transparent;
}

.ga-checkbox .ga-checkbox__marker .ga-checkbox__marker__indicator-checked,
.ga-checkbox .ga-checkbox__marker .ga-checkbox__marker__indicator-indeterminate {
  display: none;
}

.ga-checkbox .ga-checkbox__native {
  height: 16px;
  width: 16px;
  flex-shrink: 0;
  cursor: pointer;
  opacity: 0;
}

.ga-checkbox .ga-checkbox__native:focus-visible ~ .ga-checkbox__marker {
  outline: 2px solid var(--ga-color-border-focus);
  outline-offset: 2px;
}

.ga-checkbox .ga-checkbox__native:hover ~ .ga-checkbox__marker {
  border-color: var(--ga-color-border-action-hover);
  background: var(--ga-color-surface-action-hover-2);
}

.ga-checkbox .ga-checkbox__native:checked ~ .ga-checkbox__marker {
  background: var(--ga-color-surface-action);
}

.ga-checkbox .ga-checkbox__native:checked ~ .ga-checkbox__marker .ga-checkbox__marker__indicator-checked {
  display: block;
}

.ga-checkbox .ga-checkbox__native:indeterminate ~ .ga-checkbox__marker {
  background: var(--ga-color-surface-action);
}

.ga-checkbox .ga-checkbox__native:indeterminate ~ .ga-checkbox__marker .ga-checkbox__marker__indicator-indeterminate {
  display: block;
}

.ga-checkbox .ga-checkbox__native:disabled {
  cursor: not-allowed;
}

.ga-checkbox .ga-checkbox__native:disabled ~ .ga-checkbox__marker {
  border-color: var(--ga-color-border-disabled);
  background: var(--ga-color-surface-disabled);
  color: var(--ga-color-text-disabled);
}

.ga-checkbox .ga-checkbox__native:disabled ~ .ga-checkbox__label {
  color: var(--ga-color-text-disabled);
}

/* Hover checked/indeterminate marker color, only if not invalid */
.ga-checkbox:not(.ga-checkbox--invalid) .ga-checkbox__native:hover:not(:disabled):checked ~ .ga-checkbox__marker,
.ga-checkbox:not(.ga-checkbox--invalid) .ga-checkbox__native:hover:not(:disabled):indeterminate ~ .ga-checkbox__marker {
  background: var(--ga-color-surface-action-hover);
}

/* Invalid state */
.ga-checkbox.ga-checkbox--invalid .ga-checkbox__native ~ .ga-checkbox__marker {
  border-color: var(--ga-color-border-error);
  background: var(--ga-color-surface-error);
  color: var(--ga-color-border-error);
}

.ga-checkbox .ga-checkbox__label {
  font-size: 16px;
  min-height: 16px;
  line-height: 16px;
}

.ga-checkbox .ga-checkbox__label:empty {
  display: none;
}

/* notification, alert */
.ga-notification {
  font-size: 16px;
  position: relative;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  border-radius: 6px;
  border: 1px solid var(--ga-color-border-primary);
  background: var(--ga-color-surface-primary);
  padding-top: 8px;
  padding-right: 8px;
  padding-bottom: 16px;
  padding-left: 16px;
}

/* Information */
.ga-notification.ga-notification--information {
  border-color: var(--ga-color-border-information);
  background: var(--ga-color-surface-information);
}
.ga-notification.ga-notification--information .ga-notification__progress .ga-notification__progress-bar {
  background: var(--ga-color-icon-information);
}

/* Success */
.ga-notification.ga-notification--success {
  border-color: var(--ga-color-border-success);
  background: var(--ga-color-surface-success);
}
.ga-notification.ga-notification--success .ga-notification__progress .ga-notification__progress-bar {
  background: var(--ga-color-icon-success);
}

/* Error */
.ga-notification.ga-notification--error {
  border-color: var(--ga-color-border-error);
  background: var(--ga-color-surface-error);
}
.ga-notification.ga-notification--error .ga-notification__progress .ga-notification__progress-bar {
  background: var(--ga-color-icon-error);
}

/* Warning */
.ga-notification.ga-notification--warning {
  border-color: var(--ga-color-border-warning);
  background: var(--ga-color-surface-warning);
}
.ga-notification.ga-notification--warning .ga-notification__progress .ga-notification__progress-bar {
  background: var(--ga-color-icon-warning);
}

/* Icon */
.ga-notification .ga-notification__icon {
  margin-top: 8px;
  flex-shrink: 0;
  color: var(--ga-color-icon-action);
}

/* Description */
.ga-notification .ga-notification__description {
  margin-top: 8px;
  padding-right: 8px;
}

/* Heading */
.ga-notification .ga-notification__heading {
  display: flex;
  min-height: 40px;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.ga-notification .ga-notification__heading ~ .ga-notification__description {
  margin-top: 0;
}

/* Title */
.ga-notification .ga-notification__title {
  flex: 1;
  font-weight: bold;
}

/* Title actions */
.ga-notification .ga-notification__title-actions {
  display: flex;
  flex-shrink: 0;
  flex-direction: row;
  gap: 8px;
}

/* Content */
.ga-notification .ga-notification__content {
  flex: 1;
}

/* Progress */
.ga-notification .ga-notification__progress {
  position: absolute;
  right: 0;
  left: 0;
  bottom: 1px;
  height: 4px;
  overflow: hidden;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
  background: var(--ga-color-surface-disabled);
}
.ga-notification .ga-notification__progress .ga-notification__progress-bar {
  position: absolute;
  height: 100%;
  left: 0;
  top: 0;
  border-radius: 6px;
  background: var(--ga-color-primary-70);
  transform-origin: top left;
}
.ga-notification .ga-notification__progress.ga-notification__progress--indeterminate .ga-notification__progress-bar {
  width: 20%;
  animation: ga-notification-progress-animation 1400ms linear infinite;
}

@keyframes ga-notification-progress-animation {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(500%);
  }
}


/* switch */
.ga-switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.75rem; /* gap-3 */

}
.ga-switch .ga-switch__marker {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  height: 24px; /* h-6 */
  width: 3rem;    /* w-12 */
  border-radius: 9999px; /* rounded-full */
  border: 1px solid var(--ga-color-border-action);
  background: var(--ga-color-surface-primary);
}
.ga-switch .ga-switch__check-icon {
  position: absolute;
  top: 3px; /* top-0.75 */
  left: 6px; /* left-1.5 */
  color: var(--ga-color-icon-on-primary);
  opacity: 0;
  transition: opacity 0.3s;
}
.ga-switch .ga-switch__slider {
  pointer-events: none;
  position: absolute;
  top: 3px; /* top-0.75 */
  left: 3px; /* left-0.75 */
  display: inline-block;
  height: 16px; /* h-4 */
  width: 16px;  /* w-4 */
  border-radius: 9999px; /* rounded-full */
  background: var(--ga-color-surface-action);
  transition: transform 0.3s, background 0.3s;
}
.ga-switch .ga-switch__label {
  user-select: none;
}
.ga-switch input {
  display: inline-block;
  height: 24px; /* h-6 */
  width: 3rem;    /* w-12 */
  cursor: pointer;
  border-radius: 9999px; /* rounded-full */
  opacity: 0;
}
.ga-switch input:hover ~ .ga-switch__marker {
  background: var(--ga-color-surface-action-hover-2);
}
.ga-switch input:hover ~ .ga-switch__marker .ga-switch__slider {
  background: var(--ga-color-surface-action-hover);
}
.ga-switch input:checked ~ .ga-switch__marker {
  border: 1px solid var(--ga-color-border-action);
  background: var(--ga-color-surface-action);
}
.ga-switch input:checked ~ .ga-switch__marker .ga-switch__slider {
  transform: translateX(24px); /* translate-x-6 */
  background: var(--ga-color-surface-primary);
}
.ga-switch input:checked ~ .ga-switch__marker .ga-switch__check-icon {
  opacity: 1;
}
.ga-switch input:checked:hover:not(:disabled) ~ .ga-switch__marker {
  background: var(--ga-color-surface-action-hover);
}
.ga-switch input:checked:hover:not(:disabled) ~ .ga-switch__marker .ga-switch__slider {
  background: var(--ga-color-surface-action-hover-2);
}
.ga-switch input:focus-visible ~ .ga-switch__marker {
  outline: 2px solid var(--ga-color-border-focus);
  outline-offset: 2px;
}
.ga-switch input:disabled {
  cursor: not-allowed;
}
.ga-switch input:disabled ~ .ga-switch__marker {
  border: 1px solid var(--ga-color-border-disabled);
  background: var(--ga-color-surface-disabled);
}
.ga-switch input:disabled ~ .ga-switch__marker .ga-switch__check-icon {
  color: var(--ga-color-icon-on-disabled);
}
.ga-switch input:disabled ~ .ga-switch__marker .ga-switch__slider {
  background: var(--ga-color-icon-on-disabled);
}
.ga-switch.ga-switch--invalid input ~ .ga-switch__marker {
  outline: 2px solid var(--ga-color-border-error);
  outline-offset: 2px;
}

/* badge */
.ga-badge {
  display: inline-block;
  border-radius: 9999px;
  vertical-align: baseline;
}

/* Text Badges */
.ga-badge.ga-badge--text {
  min-width: 24px;
  padding: 4px;
  text-align: center;
  font-size: 0.875rem;
  line-height: 16px;
  font-weight: 500;
  white-space: nowrap;
}

.ga-badge.ga-badge--text.ga-badge--default {
  background-color: var(--ga-color-surface-action);
  color: var(--ga-color-text-on-action);
}

.ga-badge.ga-badge--text.ga-badge--default-inverted {
  background-color: var(--ga-color-icon-on-action);
  color: var(--ga-color-text-information);
}

.ga-badge.ga-badge--text.ga-badge--muted {
  background-color: var(--ga-color-icon-on-primary);
  color: var(--ga-color-text-action);
}

.ga-badge.ga-badge--text.ga-badge--information {
  background-color: var(--ga-color-utility-blue-light);
  color: var(--ga-color-text-information);
  box-shadow: 0 0 0 1px var(--ga-color-border-information) inset;
}

.ga-badge.ga-badge--text.ga-badge--error {
  background-color: var(--ga-color-utility-red-light);
  color: var(--ga-color-text-error);
  box-shadow: 0 0 0 1px var(--ga-color-border-error) inset;
}

.ga-badge.ga-badge--text.ga-badge--warning {
  background-color: var(--ga-color-utility-orange-light);
  color: var(--ga-color-text-warning);
  box-shadow: 0 0 0 1px var(--ga-color-border-warning) inset;
}

.ga-badge.ga-badge--text.ga-badge--success {
  background-color: var(--ga-color-utility-green-light);
  color: var(--ga-color-text-success);
  box-shadow: 0 0 0 1px var(--ga-color-border-success) inset;
}

.ga-badge.ga-badge--text.ga-badge--disabled {
  background-color: var(--ga-color-surface-disabled);
  color: var(--ga-color-text-disable-selected);
}

.ga-badge.ga-badge--text.ga-badge--disabled-inverted {
  background-color: var(--ga-color-icon-pictograms-pictogram-fill);
  color: var(--ga-color-text-disabled);
}

/* Dot Badges */
.ga-badge.ga-badge--dot {
  height: 0.5rem;
  width: 0.5rem;
}

.ga-badge.ga-badge--dot.ga-badge--default {
  background-color: var(--ga-color-surface-action);
}

.ga-badge.ga-badge--dot.ga-badge--default-inverted {
  background-color: var(--ga-color-icon-on-action);
}

.ga-badge.ga-badge--dot.ga-badge--muted {
  background-color: var(--ga-color-icon-on-primary);
  box-shadow: 0 0 0 1px var(--ga-color-text-disabled) inset;
}

.ga-badge.ga-badge--dot.ga-badge--information {
  background-color: var(--ga-color-icon-information);
}

.ga-badge.ga-badge--dot.ga-badge--error {
  background-color: var(--ga-color-icon-error);
}

.ga-badge.ga-badge--dot.ga-badge--warning {
  background-color: var(--ga-color-icon-warning);
}

.ga-badge.ga-badge--dot.ga-badge--success {
  background-color: var(--ga-color-icon-success);
}

.ga-badge.ga-badge--dot.ga-badge--disabled {
  background-color: var(--ga-color-icon-on-disabled);
}

.ga-badge.ga-badge--dot.ga-badge--disabled-inverted {
  background-color: var(--ga-color-icon-pictograms-pictogram-fill);
}