/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[5].rules[1].use[1]!./src/styles.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*! minireset.css v0.0.7 | MIT License | github.com/jgthms/minireset.css */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
ul {
  list-style: none;
}
button,
input,
select {
  margin: 0;
}
html {
  box-sizing: border-box;
}
*, *::before, *::after {
  box-sizing: inherit;
}
img,
video {
  height: auto;
  max-width: 100%;
}
iframe {
  border: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
.igx-display-container {
  display: inherit;
  flex-flow: inherit;
  position: relative;
  width: 100%;
  overflow: hidden;
  flex-shrink: 0;
}
.igx-display-container--inactive {
  width: 100%;
}
.igx-drag {
  touch-action: none;
}
.igx-drag--select-disabled {
  -webkit-user-select: none;
          user-select: none;
}
.igx-drag__handle {
  -webkit-user-select: none;
          user-select: none;
}
.igx-vhelper--vertical, .igx-vhelper--horizontal {
  display: block;
  overflow: auto;
  z-index: 10001;
}
.igx-vhelper--vertical {
  position: absolute;
  top: 0;
  right: 0;
}
.igx-vhelper--horizontal {
  width: 100%;
}
.igx-vhelper--vertical .igx-vhelper__placeholder-content {
  width: 1px;
}
.igx-vhelper--horizontal .igx-vhelper__placeholder-content {
  height: 1px;
}
/* You can add global styles to this file, and also import other style files */
[hidden] {
  display: none !important;
}
[class^=igx-],
[class^=igx-] *,
[class^=igx-] *::before,
[class^=igx-] *::after {
  box-sizing: border-box;
}
.igx-svg-container {
  visibility: hidden;
  width: 0;
  height: 0;
  font-size: 0;
  overflow: hidden;
}
.igx-radio-group {
  display: block;
}
.igx-radio-group--vertical {
  display: flex;
  flex-flow: column;
}
@media print {
  html,
body,
app-root {
    min-height: 100vh;
    min-width: 100vw;
    margin: 0;
    display: block;
  }

  * {
    background: transparent !important;
    background-color: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    -webkit-print-color-adjust: exact;
  }

  a[href^=http]::after {
    content: "[" attr(href) "]";
    color: blue;
  }

  .igx-no-print,
igx-nav-drawer {
    display: none !important;
  }

  igx-grid igx-input-group,
igx-grid igx-checkbox,
igx-grid igx-radio,
igx-grid .igx-grid-grouparea,
igx-grid .igx-tooltip--desktop,
igx-grid .igx-nav-drawer__aside,
igx-grid .igx-overlay,
igx-grid .igx-ripple,
igx-grid igx-slider,
igx-grid igx-snackbar,
igx-grid igx-switch,
igx-grid igx-time-picker,
igx-grid igx-toast,
igx-grid igx-tabs,
igx-grid igx-navbar,
igx-grid [igx-button],
igx-grid .igx-grid__tbody-scrollbar,
igx-grid igx-virtual-helper,
igx-grid igx-paginator,
igx-grid .igx-grid-toolbar__actions,
igx-grid .igx-grid__cbx-selection,
igx-grid .igx-drop-area__icon,
igx-grid .igx-drop-area__text,
igx-grid .igx-grid__header-indentation,
igx-grid .igx-grid__grouping-indicator,
igx-grid .igx-grid__row-indentation,
igx-grid .igx-grid__hierarchical-expander {
    display: none !important;
  }
  igx-grid .igx-grid-grouparea,
igx-grid igx-paginator,
igx-grid .igx-grid-toolbar__actions,
igx-grid .igx-drop-area__icon,
igx-grid .igx-drop-area__text,
igx-grid .igx-grid__header-indentation,
igx-grid .igx-grid__grouping-indicator,
igx-grid .igx-grid__row-indentation,
igx-grid .igx-grid__hierarchical-expander,
igx-grid .igx-expansion-panel__header-icon--end,
igx-grid .igx-expansion-panel__header-icon--start,
igx-grid .igx-grid__summaries-patch {
    display: none !important;
  }
  igx-grid .igx-grid__grouping-indicator igx-icon {
    display: none !important;
  }
  igx-grid .igx-grid__filtering-cell {
    height: 0 !important;
    border-top: none !important;
    border-right: none !important;
  }
  igx-grid .igx-grid__tfoot,
igx-grid .igx-grid-grouparea,
igx-grid .igx-grid__filtering-cell,
igx-grid .igx-grid__group-row,
igx-grid .igx-grid-thead__title,
igx-grid igx-grid-toolbar,
igx-grid igx-grid-row,
igx-grid .igx-grid-thead {
    border-color: #ddd !important;
  }
  igx-grid igx-grid igx-icon {
    color: #666 !important;
  }
  igx-grid .igx-grid-thead,
igx-grid igx-grid-toolbar,
igx-grid .igx-grid__group-row,
igx-grid .igx-grid__tfoot {
    background: #eee !important;
  }
  igx-grid .igx-grid-th__title,
igx-grid .igx-grid__td-text {
    white-space: unset !important;
    text-overflow: initial !important;
    overflow: visible !important;
  }
  igx-grid .igx-grid-thead__title igx-icon {
    display: none;
  }
  igx-grid .igx-grid__summaries-patch {
    display: none;
  }
  igx-grid .igx-grid-th--pinned-last {
    border-right: 2px solid red !important;
  }

  .igx-bottom-nav__menu,
.igx-button-group,
.igx-ripple,
igx-slider,
igx-snackbar,
igx-input-group,
igx-checkbox,
igx-radio,
.igx-tooltip--desktop,
igx-toast,
igx-navbar,
igx-virtual-helper,
[igx-button],
igx-switch,
.igx-grid__tbody-scrollbar,
.igx-grid__cbx-selection,
igx-circular-bar,
igx-linear-bar,
.igx-carousel__indicators,
.igx-carousel__arrow--prev,
.igx-carousel__arrow--next {
    display: none !important;
  }
}
.igx-typography {
  font-family: Polaris, sans-serif;
  font-size: 16px;
  line-height: 27px;
  font-size-adjust: 100%;
  /* stylelint-disable max-nesting-depth */
  /* stylint-enable max-nesting-depth */
}
.igx-typography .igx-excel-filter__menu .igx-excel-filter__menu-header > h4, .igx-typography .igx-excel-filter__menu .igx-excel-filter__secondary-header > h4 {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-excel-filter__secondary .igx-excel-filter__menu-header > h4, .igx-typography .igx-excel-filter__secondary .igx-excel-filter__secondary-header > h4 {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-excel-filter__sort header,
.igx-typography .igx-excel-filter__move header {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
}
.igx-typography .igx-excel-filter__menu--cosy .igx-excel-filter__menu-header > h4, .igx-typography .igx-excel-filter__menu--cosy .igx-excel-filter__secondary-header > h4 {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__menu-header > h4, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__secondary-header > h4 {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
}
.igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__sort header,
.igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__move header {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  text-transform: capitalize;
}
.igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-pin span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-pin--disabled span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-unpin span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-hide span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-select span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-selected span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-filter span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-clear span, .igx-typography .igx-excel-filter__menu--compact .igx-excel-filter__actions-clear--disabled span {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
}
.igx-typography .igx-excel-filter__menu--compact .igx-checkbox__label, .igx-typography .igx-excel-filter__menu--compact .igx-checkbox__label--before {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
}
.igx-typography .igx-excel-filter__secondary--cosy .igx-excel-filter__menu-header > h4, .igx-typography .igx-excel-filter__secondary--cosy .igx-excel-filter__secondary-header > h4 {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-excel-filter__secondary--compact .igx-excel-filter__menu-header > h4, .igx-typography .igx-excel-filter__secondary--compact .igx-excel-filter__secondary-header > h4 {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
}
.igx-typography .igx-banner__text {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-bottom-nav__menu-item [igxBottomNavHeaderLabel], .igx-bottom-nav__menu-item .igx-typography [igxBottomNavHeaderLabel], .igx-typography .igx-bottom-nav__menu-item--selected [igxBottomNavHeaderLabel], .igx-bottom-nav__menu-item--selected .igx-typography [igxBottomNavHeaderLabel], .igx-typography .igx-bottom-nav__menu-item--disabled [igxBottomNavHeaderLabel], .igx-bottom-nav__menu-item--disabled .igx-typography [igxBottomNavHeaderLabel] {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-button {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.046875rem;
  text-transform: uppercase;
  line-height: 1rem;
  text-align: center;
}
.igx-typography .igx-button--fab {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.046875rem;
  text-transform: uppercase;
  line-height: 1rem;
  text-align: center;
  margin: 0;
}
.igx-typography igx-category-chart,
.igx-typography igx-category-chart category-chart {
  --title-text-style: var(--category-chart-title-text-style, normal 300 6rem/7rem inherit);
}
.igx-typography igx-category-chart,
.igx-typography igx-category-chart category-chart {
  --subtitle-text-style: var(--category-chart-subtitle-text-style, normal 400 1rem/1.5rem inherit);
}
.igx-typography igx-category-chart,
.igx-typography igx-category-chart category-chart {
  --x-axis-label-text-style: var(--category-chart-x-axis-label-text-style, normal 400 2.125rem/2.5rem inherit);
}
.igx-typography igx-category-chart,
.igx-typography igx-category-chart category-chart {
  --x-axis-title-text-style: var(--category-chart-x-axis-title-text-style, normal 400 3rem/3.5625rem inherit);
}
.igx-typography igx-category-chart,
.igx-typography igx-category-chart category-chart {
  --y-axis-label-text-style: var(--category-chart-y-axis-label-text-style, normal 400 2.125rem/2.5rem inherit);
}
.igx-typography igx-category-chart,
.igx-typography igx-category-chart category-chart {
  --y-axis-title-text-style: var(--category-chart-y-axis-title-text-style, normal 400 3rem/3.5625rem inherit);
}
.igx-typography .igx-checkbox__label, .igx-typography .igx-checkbox__label--before {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-chip {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  font-weight: 600;
}
.igx-typography .igx-chip--compact .igx-chip__content,
.igx-typography .igx-chip__ghost--compact .igx-chip__content {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  font-size: 12px;
  font-weight: 600;
}
.igx-typography .igx-column-actions__header-title {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography igx-data-chart,
.igx-typography igx-data-chart data-chart {
  --title-text-style: var(--data-chart-title-text-style, normal 300 6rem/7rem inherit);
}
.igx-typography igx-data-chart,
.igx-typography igx-data-chart data-chart {
  --subtitle-text-style: var(--data-chart-subtitle-text-style, normal 400 1rem/1.5rem inherit);
}
.igx-typography igx-dock-manager {
  --igc-font-family: var(--igx-font-family, inherit);
}
.igx-typography .igx-expansion-panel__header-title {
  font-weight: 400;
  font-size: 1.5rem;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
  margin: 0;
}
.igx-typography .igx-expansion-panel__header-description {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.00625rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-expansion-panel__body {
  margin: 0;
}
.igx-typography igx-financial-chart,
.igx-typography igx-financial-chart financial-chart {
  --title-text-style: var(--financial-chart-title-text-style, normal 300 6rem/7rem inherit);
}
.igx-typography igx-financial-chart,
.igx-typography igx-financial-chart financial-chart {
  --subtitle-text-style: var(--financial-chart-subtitle-text-style, normal 400 1rem/1.5rem inherit);
}
.igx-typography igx-financial-chart,
.igx-typography igx-financial-chart financial-chart {
  --x-axis-label-text-style: var(--financial-chart-x-axis-label-text-style, normal 400 2.125rem/2.5rem inherit);
}
.igx-typography igx-financial-chart,
.igx-typography igx-financial-chart financial-chart {
  --x-axis-title-text-style: var(--financial-chart-x-axis-title-text-style, normal 400 3rem/3.5625rem inherit);
}
.igx-typography igx-financial-chart,
.igx-typography igx-financial-chart financial-chart {
  --y-axis-label-text-style: var(--financial-chart-y-axis-label-text-style, normal 400 2.125rem/2.5rem inherit);
}
.igx-typography igx-financial-chart,
.igx-typography igx-financial-chart financial-chart {
  --y-axis-title-text-style: var(--financial-chart-y-axis-title-text-style, normal 400 3rem/3.5625rem inherit);
}
.igx-typography igx-funnel-chart,
.igx-typography igx-funnel-chart funnel-chart {
  --outer-label-text-style: var(--funnel-chart-outer-label-text-style, normal 300 6rem/7rem inherit);
}
.igx-typography igx-funnel-chart,
.igx-typography igx-funnel-chart funnel-chart {
  --text-style: var(--funnel-chart-text-style, normal 400 1rem/1.5rem inherit);
}
.igx-typography igx-linear-gauge {
  --linear-gauge-font: var(--igx-font-family, inherit);
}
.igx-typography igx-radial-gauge {
  --radial-gauge-font: var(--igx-font-family, inherit);
}
.igx-typography igx-bullet-graph {
  --bullet-graph-font: var(--igx-font-family, inherit);
}
.igx-typography .igx-input-group__input, .igx-typography .igx-input-group__textarea {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-input-group__hint {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-input-group igx-prefix, .igx-input-group .igx-typography igx-prefix, .igx-typography .igx-input-group--focused igx-prefix, .igx-input-group--focused .igx-typography igx-prefix,
.igx-typography .igx-input-group [igxPrefix],
.igx-input-group .igx-typography [igxPrefix],
.igx-typography .igx-input-group--focused [igxPrefix],
.igx-input-group--focused .igx-typography [igxPrefix],
.igx-typography .igx-input-group igx-suffix,
.igx-input-group .igx-typography igx-suffix,
.igx-typography .igx-input-group--focused igx-suffix,
.igx-input-group--focused .igx-typography igx-suffix,
.igx-typography .igx-input-group [igxSuffix],
.igx-input-group .igx-typography [igxSuffix],
.igx-typography .igx-input-group--focused [igxSuffix],
.igx-input-group--focused .igx-typography [igxSuffix] {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography igx-navbar-title,
.igx-typography [igxNavbarTitle], .igx-typography .igx-navbar__title {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  margin-bottom: 0;
}
.igx-typography .igx-nav-drawer__item, .igx-typography .igx-nav-drawer__item--active {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.00625rem;
  text-transform: none;
  line-height: 1.5rem;
}
.igx-typography .igx-nav-drawer__item--header {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-radio__label, .igx-typography .igx-radio__label--before {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography igx-shape-chart,
.igx-typography igx-shape-chart shape-chart {
  --title-text-style: var(--shape-chart-title-text-style, normal 600 1.25rem/1.5rem inherit);
}
.igx-typography igx-shape-chart,
.igx-typography igx-shape-chart shape-chart {
  --subtitle-text-style: var(--shape-chart-subtitle-text-style, normal 400 1rem/1.5rem inherit);
}
.igx-typography igx-shape-chart,
.igx-typography igx-shape-chart shape-chart {
  --x-axis-title-text-style: var(--shape-chart-x-axis-title-text-style, normal 400 3rem/3.5625rem inherit);
}
.igx-typography igx-shape-chart,
.igx-typography igx-shape-chart shape-chart {
  --x-axis-label-text-style: var(--shape-chart-x-axis-label-text-style, normal 400 2.125rem/2.5rem inherit);
}
.igx-typography igx-shape-chart,
.igx-typography igx-shape-chart shape-chart {
  --y-axis-title-text-style: var(--shape-chart-y-axis-title-text-style, normal 400 3rem/3.5625rem inherit);
}
.igx-typography igx-shape-chart,
.igx-typography igx-shape-chart shape-chart {
  --y-axis-label-text-style: var(--shape-chart-y-axis-label-text-style, normal 400 2.125rem/2.5rem inherit);
}
.igx-typography .igx-slider-thumb-label-from__container, .igx-typography .igx-slider-thumb-label-to__container {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
}
.igx-typography .igx-slider__ticks-label {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
}
.igx-typography .igx-snackbar__message {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
}
.igx-typography .igx-switch__label, .igx-typography .igx-switch__label--before {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-stepper__step-title {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-stepper__step-subtitle {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-stepper__step-header--current .igx-stepper__step-title {
  font-weight: 600;
}
.igx-typography .igx-tabs__header-item-inner > [igxtabheaderlabel] {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.046875rem;
  text-transform: uppercase;
  line-height: 1rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-time-picker__header-ampm {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
}
.igx-typography .igx-time-picker__header-hour {
  font-weight: 400;
  font-size: 2.125rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 2.5rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
  margin-top: 0;
}
.igx-typography .igx-time-picker__column {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-toast > * {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  margin: 0;
}
.igx-typography .igx-tooltip--mobile {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
}
.igx-typography .igx-tooltip--desktop {
  font-size: 0.625rem;
  font-weight: 600;
}
.igx-typography .igx-tree-node__content {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
}
.igx-typography .igx-calendar__header-year {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-calendar__header-date {
  font-weight: 400;
  font-size: 2.125rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 2.5rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
  margin: 0;
}
.igx-typography .igx-calendar-picker__date {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-calendar__date-content {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  margin: 0;
}
.igx-typography .igx-calendar__year--current {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  line-height: 3.25rem;
  margin: 0;
}
.igx-typography .igx-card-header__title, .igx-typography .igx-card-header__title--small {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  margin: 0;
}
.igx-typography .igx-card-header__title--small {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.00625rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-card-header__subtitle {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.00625rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-card-content > p {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  margin: 0;
}
.igx-typography .igx-dialog__window-title {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  margin: 0;
}
.igx-typography .igx-dialog__window-content {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  margin: 0;
}
.igx-typography .igx-dialog__window-content > * {
  letter-spacing: normal;
}
.igx-typography .igx-drop-down__group label, .igx-drop-down__group .igx-typography label, .igx-typography .igx-drop-down__header {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-drop-down__item {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  margin: 0;
}
.igx-typography .igx-list__header {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-list__item-lines,
.igx-typography .igx-list__item-line-title {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-list__item-line-subtitle {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-calendar__header-year {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-calendar__header-date {
  font-weight: 400;
  font-size: 2.125rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 2.5rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
  margin: 0;
}
.igx-typography .igx-calendar-picker__date {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin: 0;
}
.igx-typography .igx-calendar__date-content {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  margin: 0;
}
.igx-typography .igx-calendar__year--current {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  line-height: 3.25rem;
  margin: 0;
}
.igx-typography .igx-dialog__window-title {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
  margin: 0;
}
.igx-typography .igx-dialog__window-content {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
  margin: 0;
}
.igx-typography .igx-dialog__window-content > * {
  letter-spacing: normal;
}
.igx-typography .igx-drop-down__group label, .igx-drop-down__group .igx-typography label, .igx-typography .igx-drop-down__header {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
  margin: 0;
}
.igx-typography .igx-drop-down__item {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
  margin: 0;
}
.igx-typography .igx-typography__h1, .igx-typography h1 {
  font-weight: 300;
  font-size: 6rem;
  font-style: normal;
  letter-spacing: -0.09375rem;
  text-transform: none;
  line-height: 7rem;
  margin-top: 1.75rem;
  margin-bottom: 3.5rem;
}
.igx-typography .igx-typography__h2, .igx-typography h2 {
  font-weight: 300;
  font-size: 3.75rem;
  font-style: normal;
  letter-spacing: -0.03125rem;
  text-transform: none;
  line-height: 4.4375rem;
  margin-top: 1.75rem;
  margin-bottom: 1.75rem;
}
.igx-typography .igx-typography__h3, .igx-typography h3 {
  font-weight: 400;
  font-size: 3rem;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  line-height: 3.5625rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
}
.igx-typography .igx-typography__h4, .igx-typography h4 {
  font-weight: 400;
  font-size: 2.125rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 2.5rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
}
.igx-typography .igx-typography__h5, .igx-typography h5 {
  font-weight: 400;
  font-size: 1.5rem;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 0;
}
.igx-typography .igx-typography__h6, .igx-typography h6 {
  font-weight: 600;
  font-size: 1.25rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
  margin-top: 0;
  margin-bottom: 0;
}
.igx-typography .igx-typography__subtitle-1 {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.009375rem;
  text-transform: none;
  line-height: 1.5rem;
}
.igx-typography .igx-typography__subtitle-2 {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.00625rem;
  text-transform: none;
  line-height: 1.5rem;
}
.igx-typography .igx-typography__body-1, .igx-typography p {
  font-weight: 400;
  font-size: 1rem;
  font-style: normal;
  letter-spacing: 0.03125rem;
  text-transform: none;
  line-height: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1rem;
}
.igx-typography .igx-typography__body-2 {
  font-weight: 400;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.015625rem;
  text-transform: none;
  line-height: 1.25rem;
}
.igx-typography .igx-typography__button {
  font-weight: 600;
  font-size: 0.875rem;
  font-style: normal;
  letter-spacing: 0.046875rem;
  text-transform: uppercase;
  line-height: 1rem;
}
.igx-typography .igx-typography__caption {
  font-weight: 400;
  font-size: 0.75rem;
  font-style: normal;
  letter-spacing: 0.025rem;
  text-transform: none;
  line-height: 1rem;
}
.igx-typography .igx-typography__overline {
  font-weight: 400;
  font-size: 0.625rem;
  font-style: normal;
  letter-spacing: 0.09375rem;
  text-transform: uppercase;
  line-height: 1rem;
}
/* ------------------ VARIABLES ------------------ */
:root {
  --primary: #9dc3d1;
  --secondary: #9dc3d1;
  --tertiary: #47585C;
  --surface: #FBFAF5;
  --info: #0D52FD;
  --success: #297a2d;
  --warn: #E88930;
  --error: #D22727;
}
/* ------------------ VARIABLES ------------------ */
:root {
  --igx-primary-50: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.23), calc(var(--igx-primary-l) * 1.78);
  --igx-primary-50-contrast: black;
  --igx-primary-100: var(--igx-primary-h), calc(var(--igx-primary-s) / 1.25), calc(var(--igx-primary-l) * 1.66);
  --igx-primary-100-contrast: black;
  --igx-primary-200: var(--igx-primary-h), calc(var(--igx-primary-s) * .64), calc(var(--igx-primary-l) * 1.43);
  --igx-primary-200-contrast: black;
  --igx-primary-300: var(--igx-primary-h), calc(var(--igx-primary-s) * .73), calc(var(--igx-primary-l) * 1.19);
  --igx-primary-300-contrast: black;
  --igx-primary-400: var(--igx-primary-h), calc(var(--igx-primary-s) * .875), calc(var(--igx-primary-l) * 1.08);
  --igx-primary-400-contrast: black;
  --igx-primary-h: 196deg;
  --igx-primary-s: 36%;
  --igx-primary-l: 72%;
  --igx-primary-a: 1;
  --igx-primary-500: var(--igx-primary-h), var(--igx-primary-s), var(--igx-primary-l);
  --igx-primary-500-contrast: black;
  --igx-primary-600: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.26), calc(var(--igx-primary-l) * .89);
  --igx-primary-600-contrast: black;
  --igx-primary-700: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.52), calc(var(--igx-primary-l) * .81);
  --igx-primary-700-contrast: black;
  --igx-primary-800: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.5), calc(var(--igx-primary-l) * .73);
  --igx-primary-800-contrast: black;
  --igx-primary-900: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.34), calc(var(--igx-primary-l) * .64);
  --igx-primary-900-contrast: black;
  --igx-primary-A100: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.23), calc(var(--igx-primary-l) * 1.34);
  --igx-primary-A100-contrast: black;
  --igx-primary-A200: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.22), calc(var(--igx-primary-l) * 1.16);
  --igx-primary-A200-contrast: black;
  --igx-primary-A400: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.23), calc(var(--igx-primary-l) * .91);
  --igx-primary-A400-contrast: black;
  --igx-primary-A700: var(--igx-primary-h), calc(var(--igx-primary-s) * 1.22), calc(var(--igx-primary-l) * .65);
  --igx-primary-A700-contrast: black;
  --igx-secondary-50: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.23), calc(var(--igx-secondary-l) * 1.78);
  --igx-secondary-50-contrast: black;
  --igx-secondary-100: var(--igx-secondary-h), calc(var(--igx-secondary-s) / 1.25), calc(var(--igx-secondary-l) * 1.66);
  --igx-secondary-100-contrast: black;
  --igx-secondary-200: var(--igx-secondary-h), calc(var(--igx-secondary-s) * .64), calc(var(--igx-secondary-l) * 1.43);
  --igx-secondary-200-contrast: black;
  --igx-secondary-300: var(--igx-secondary-h), calc(var(--igx-secondary-s) * .73), calc(var(--igx-secondary-l) * 1.19);
  --igx-secondary-300-contrast: black;
  --igx-secondary-400: var(--igx-secondary-h), calc(var(--igx-secondary-s) * .875), calc(var(--igx-secondary-l) * 1.08);
  --igx-secondary-400-contrast: black;
  --igx-secondary-h: 196deg;
  --igx-secondary-s: 36%;
  --igx-secondary-l: 72%;
  --igx-secondary-a: 1;
  --igx-secondary-500: var(--igx-secondary-h), var(--igx-secondary-s), var(--igx-secondary-l);
  --igx-secondary-500-contrast: black;
  --igx-secondary-600: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.26), calc(var(--igx-secondary-l) * .89);
  --igx-secondary-600-contrast: black;
  --igx-secondary-700: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.52), calc(var(--igx-secondary-l) * .81);
  --igx-secondary-700-contrast: black;
  --igx-secondary-800: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.5), calc(var(--igx-secondary-l) * .73);
  --igx-secondary-800-contrast: black;
  --igx-secondary-900: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.34), calc(var(--igx-secondary-l) * .64);
  --igx-secondary-900-contrast: black;
  --igx-secondary-A100: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.23), calc(var(--igx-secondary-l) * 1.34);
  --igx-secondary-A100-contrast: black;
  --igx-secondary-A200: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.22), calc(var(--igx-secondary-l) * 1.16);
  --igx-secondary-A200-contrast: black;
  --igx-secondary-A400: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.23), calc(var(--igx-secondary-l) * .91);
  --igx-secondary-A400-contrast: black;
  --igx-secondary-A700: var(--igx-secondary-h), calc(var(--igx-secondary-s) * 1.22), calc(var(--igx-secondary-l) * .65);
  --igx-secondary-A700-contrast: black;
  --igx-grays-50: var(--igx-grays-h), var(--igx-grays-s), 98%;
  --igx-grays-50-contrast: black;
  --igx-grays-100: var(--igx-grays-h), var(--igx-grays-s), 96%;
  --igx-grays-100-contrast: black;
  --igx-grays-200: var(--igx-grays-h), var(--igx-grays-s), 93%;
  --igx-grays-200-contrast: black;
  --igx-grays-300: var(--igx-grays-h), var(--igx-grays-s), 88%;
  --igx-grays-300-contrast: black;
  --igx-grays-400: var(--igx-grays-h), var(--igx-grays-s), 74%;
  --igx-grays-400-contrast: black;
  --igx-grays-h: 0deg;
  --igx-grays-s: 0%;
  --igx-grays-l: 62%;
  --igx-grays-a: 1;
  --igx-grays-500: var(--igx-grays-h), var(--igx-grays-s), 62%;
  --igx-grays-500-contrast: black;
  --igx-grays-600: var(--igx-grays-h), var(--igx-grays-s), 54%;
  --igx-grays-600-contrast: black;
  --igx-grays-700: var(--igx-grays-h), var(--igx-grays-s), 38%;
  --igx-grays-700-contrast: white;
  --igx-grays-800: var(--igx-grays-h), var(--igx-grays-s), 26%;
  --igx-grays-800-contrast: white;
  --igx-grays-900: var(--igx-grays-h), var(--igx-grays-s), 13%;
  --igx-grays-900-contrast: white;
  --igx-info-h: 223deg;
  --igx-info-s: 98%;
  --igx-info-l: 52%;
  --igx-info-a: 1;
  --igx-info-500: var(--igx-info-h), var(--igx-info-s), var(--igx-info-l);
  --igx-info-500-contrast: white;
  --igx-success-h: 123deg;
  --igx-success-s: 50%;
  --igx-success-l: 32%;
  --igx-success-a: 1;
  --igx-success-500: var(--igx-success-h), var(--igx-success-s), var(--igx-success-l);
  --igx-success-500-contrast: white;
  --igx-warn-h: 29deg;
  --igx-warn-s: 80%;
  --igx-warn-l: 55%;
  --igx-warn-a: 1;
  --igx-warn-500: var(--igx-warn-h), var(--igx-warn-s), var(--igx-warn-l);
  --igx-warn-500-contrast: black;
  --igx-error-h: 0deg;
  --igx-error-s: 69%;
  --igx-error-l: 49%;
  --igx-error-a: 1;
  --igx-error-500: var(--igx-error-h), var(--igx-error-s), var(--igx-error-l);
  --igx-error-500-contrast: white;
  --igx-surface-h: 0deg;
  --igx-surface-s: 0%;
  --igx-surface-l: 100%;
  --igx-surface-a: 1;
  --igx-surface-500: var(--igx-surface-h), var(--igx-surface-s), var(--igx-surface-l);
  --igx-surface-500-contrast: black;
}
:root {
  --igx-elevation-0: none;
  --igx-elevation-1: 0 1px 3px 0 rgba(0, 0, 0, 0.26), 0 1px 1px 0 rgba(0, 0, 0, 0.12), 0 2px 1px -1px rgba(0, 0, 0, 0.08);
  --igx-elevation-2: 0 1px 5px 0 rgba(0, 0, 0, 0.26), 0 2px 2px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.08);
  --igx-elevation-3: 0 1px 8px 0 rgba(0, 0, 0, 0.26), 0 3px 4px 0 rgba(0, 0, 0, 0.12), 0 3px 3px -2px rgba(0, 0, 0, 0.08);
  --igx-elevation-4: 0 2px 4px -1px rgba(0, 0, 0, 0.26), 0 4px 5px 0 rgba(0, 0, 0, 0.12), 0 1px 10px 0 rgba(0, 0, 0, 0.08);
  --igx-elevation-5: 0 3px 5px -1px rgba(0, 0, 0, 0.26), 0 5px 8px 0 rgba(0, 0, 0, 0.12), 0 1px 14px 0 rgba(0, 0, 0, 0.08);
  --igx-elevation-6: 0 3px 5px -1px rgba(0, 0, 0, 0.26), 0 6px 10px 0 rgba(0, 0, 0, 0.12), 0 1px 18px 0 rgba(0, 0, 0, 0.08);
  --igx-elevation-7: 0 4px 5px -2px rgba(0, 0, 0, 0.26), 0 7px 10px 1px rgba(0, 0, 0, 0.12), 0 2px 16px 1px rgba(0, 0, 0, 0.08);
  --igx-elevation-8: 0 5px 5px -3px rgba(0, 0, 0, 0.26), 0 8px 10px 1px rgba(0, 0, 0, 0.12), 0 3px 14px 2px rgba(0, 0, 0, 0.08);
  --igx-elevation-9: 0 5px 6px -3px rgba(0, 0, 0, 0.26), 0 9px 12px 1px rgba(0, 0, 0, 0.12), 0 3px 16px 2px rgba(0, 0, 0, 0.08);
  --igx-elevation-10: 0 6px 6px -3px rgba(0, 0, 0, 0.26), 0 10px 14px 1px rgba(0, 0, 0, 0.12), 0 4px 18px 3px rgba(0, 0, 0, 0.08);
  --igx-elevation-11: 0 6px 7px -4px rgba(0, 0, 0, 0.26), 0 11px 15px 1px rgba(0, 0, 0, 0.12), 0 4px 20px 3px rgba(0, 0, 0, 0.08);
  --igx-elevation-12: 0 7px 8px -4px rgba(0, 0, 0, 0.26), 0 12px 17px 2px rgba(0, 0, 0, 0.12), 0 5px 22px 4px rgba(0, 0, 0, 0.08);
  --igx-elevation-13: 0 7px 8px -4px rgba(0, 0, 0, 0.26), 0 13px 19px 2px rgba(0, 0, 0, 0.12), 0 5px 24px 4px rgba(0, 0, 0, 0.08);
  --igx-elevation-14: 0 7px 9px -4px rgba(0, 0, 0, 0.26), 0 14px 21px 2px rgba(0, 0, 0, 0.12), 0 5px 26px 4px rgba(0, 0, 0, 0.08);
  --igx-elevation-15: 0 8px 9px -5px rgba(0, 0, 0, 0.26), 0 15px 22px 2px rgba(0, 0, 0, 0.12), 0 6px 28px 5px rgba(0, 0, 0, 0.08);
  --igx-elevation-16: 0 8px 10px -5px rgba(0, 0, 0, 0.26), 0 16px 24px 2px rgba(0, 0, 0, 0.12), 0 6px 30px 5px rgba(0, 0, 0, 0.08);
  --igx-elevation-17: 0 8px 11px -5px rgba(0, 0, 0, 0.26), 0 17px 26px 2px rgba(0, 0, 0, 0.12), 0 6px 32px 5px rgba(0, 0, 0, 0.08);
  --igx-elevation-18: 0 9px 11px -5px rgba(0, 0, 0, 0.26), 0 18px 28px 2px rgba(0, 0, 0, 0.12), 0 7px 34px 6px rgba(0, 0, 0, 0.08);
  --igx-elevation-19: 0 9px 12px -6px rgba(0, 0, 0, 0.26), 0 19px 29px 2px rgba(0, 0, 0, 0.12), 0 7px 36px 6px rgba(0, 0, 0, 0.08);
  --igx-elevation-20: 0 10px 13px -6px rgba(0, 0, 0, 0.26), 0 20px 31px 3px rgba(0, 0, 0, 0.12), 0 8px 38px 7px rgba(0, 0, 0, 0.08);
  --igx-elevation-21: 0 10px 13px -6px rgba(0, 0, 0, 0.26), 0 21px 33px 3px rgba(0, 0, 0, 0.12), 0 8px 40px 7px rgba(0, 0, 0, 0.08);
  --igx-elevation-22: 0 10px 14px -6px rgba(0, 0, 0, 0.26), 0 22px 35px 3px rgba(0, 0, 0, 0.12), 0 8px 42px 7px rgba(0, 0, 0, 0.08);
  --igx-elevation-23: 0 11px 14px -7px rgba(0, 0, 0, 0.26), 0 23px 36px 3px rgba(0, 0, 0, 0.12), 0 9px 44px 8px rgba(0, 0, 0, 0.08);
  --igx-elevation-24: 0 11px 15px -7px rgba(0, 0, 0, 0.26), 0 24px 38px 3px rgba(0, 0, 0, 0.12), 0 9px 46px 8px rgba(0, 0, 0, 0.08);
}
[igxRipple] {
  --color: var(--igx-ripple-color, hsla(var(--igx-grays-800), 0.7));
}
.igx-ripple__inner {
  display: block;
  position: absolute;
  border-radius: 50%;
  background: var(--color);
  pointer-events: none;
  transform-origin: center;
  transform: translate3d(0, 0, 0) scale(0);
  will-change: opacity, transform;
  opacity: 0.5;
  margin: 0 !important;
  border: none !important;
}
.igx-ripple {
  overflow: hidden;
}
igx-avatar {
  --border-radius: var(--igx-avatar-border-radius, 0px);
  --background: var(--igx-avatar-background, hsla(var(--igx-grays-400), 0.54));
  --color: var(--igx-avatar-color, hsla(var(--igx-grays-800), 0.96));
}
.igx-avatar {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  -webkit-user-select: none;
          user-select: none;
  color: var(--color);
  background: var(--background);
  vertical-align: middle;
  border-radius: var(--border-radius);
  outline-style: none;
  flex-shrink: 0;
}
.igx-avatar::after {
  box-shadow: none;
  transition: box-shadow 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-avatar__image {
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background-color: var(--background);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.igx-avatar--rounded {
  --igx-avatar-border-radius: 44px;
  border-radius: var(--border-radius);
}
.igx-avatar--initials {
  --size: 2.5rem;
  font-size: calc(var(--size) / 2);
  line-height: calc(var(--size) / 2);
}
.igx-avatar--medium.igx-avatar--initials {
  --size: 4rem;
  font-size: calc(var(--size) / 2);
  line-height: calc(var(--size) / 2);
}
.igx-avatar--large.igx-avatar--initials {
  --size: 5.5rem;
  font-size: calc(var(--size) / 2);
  line-height: calc(var(--size) / 2);
}
.igx-avatar--small {
  --size: 2.5rem;
  width: var(--size);
  height: var(--size);
}
.igx-avatar--medium {
  --size: 4rem;
  width: var(--size);
  height: var(--size);
}
.igx-avatar--large {
  --size: 5.5rem;
  width: var(--size);
  height: var(--size);
}
igx-action-strip {
  --actions-border-radius: var(--igx-action-strip-actions-border-radius, 24px);
  --actions-background: var(--igx-action-strip-actions-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --background: var(--igx-action-strip-background, hsla(var(--igx-grays-100), 0.38));
  --icon-color: var(--igx-action-strip-icon-color, 'currentColor');
  --delete-action: var(--igx-action-strip-delete-action, hsla(var(--igx-error-500), var(--igx-error-a)));
}
.igx-action-strip {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
  top: 0;
  left: 0;
  background: var(--background);
  color: inherit;
  padding: 0 1.5rem;
  z-index: 9999;
}
.igx-action-strip--compact [igxButton=icon], .igx-action-strip--cosy [igxButton=icon] {
  width: 1.75rem;
  height: 1.75rem;
}
.igx-action-strip--compact [igxButton=icon] igx-icon, .igx-action-strip--cosy [igxButton=icon] igx-icon {
  width: 0.875rem;
  height: 0.875rem;
  font-size: 0.875rem;
}
.igx-action-strip--cosy {
  padding: 0 1rem;
}
.igx-action-strip--compact {
  padding: 0 0.75rem;
}
.igx-action-strip__editing-actions,
.igx-action-strip__pinning-actions {
  display: flex;
  align-items: center;
  justify-content: center;
}
.igx-action-strip__menu-item [igxLabel], .igx-action-strip__menu-item--danger [igxLabel] {
  cursor: pointer;
}
.igx-action-strip__menu-item igx-icon, .igx-action-strip__menu-item--danger igx-icon {
  font-size: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
}
.igx-action-strip__menu-item igx-icon + [igxLabel], .igx-action-strip__menu-item--danger igx-icon + [igxLabel] {
  margin-left: 0.75rem;
}
.igx-action-strip__menu-item.igx-drop-down__item--cosy igx-icon + [igxLabel], .igx-action-strip__menu-item--danger.igx-drop-down__item--cosy igx-icon + [igxLabel] {
  margin-left: 0.625rem;
}
.igx-action-strip__menu-item.igx-drop-down__item--compact igx-icon + [igxLabel], .igx-action-strip__menu-item--danger.igx-drop-down__item--compact igx-icon + [igxLabel] {
  margin-left: 0.5rem;
}
.igx-action-strip__menu-item--danger {
  color: hsla(var(--igx-error-500), var(--igx-error-a));
}
.igx-action-strip__menu-item--danger:hover {
  color: hsla(var(--igx-error-500), var(--igx-error-a));
}
.igx-action-strip__menu-button {
  display: flex;
  align-items: center;
}
.igx-action-strip__actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: all;
  position: relative;
  color: var(--icon-color);
  border-radius: var(--actions-border-radius);
  background: var(--actions-background);
  max-height: 36px;
}
.igx-action-strip__actions:last-child {
  margin-right: 0;
}
.igx-action-strip__actions igx-icon {
  color: var(--icon-color);
}
.igx-action-strip__actions [igxButton=icon] igx-icon {
  color: var(--icon-color);
}
.igx-action-strip__editing-actions > [igxButton] {
  margin-left: 0.25rem;
}
.igx-action-strip__editing-actions > [igxButton]:first-of-type {
  margin-left: 0;
}
.igx-action-strip__delete igx-icon {
  color: var(--delete-action);
}
igx-badge {
  --border-radius: var(--igx-badge-border-radius, 11px);
  --icon-color: var(--igx-badge-icon-color, var(--igx-primary-500-contrast));
  --text-color: var(--igx-badge-text-color, var(--igx-primary-500-contrast));
  --border-color: var(--igx-badge-border-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --background-color: var(--igx-badge-background-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --border-width: var(--igx-badge-border-width, 0);
  --shadow: var(--igx-badge-shadow, var(--igx-elevation-1));
}
.igx-badge {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 22px;
  height: 22px;
  font-size: 0.6875rem;
  font-weight: normal;
  color: var(--text-color);
  line-height: 1;
  background: var(--background-color);
  border-radius: var(--border-radius);
  box-shadow: var(--shadow);
  border-width: var(--border-width);
  border-color: var(--border-color);
  border-style: solid;
  overflow: hidden;
}
.igx-badge igx-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  font-size: 0.75rem;
  font-weight: normal;
  color: var(--icon-color);
}
.igx-badge__value {
  white-space: nowrap;
  padding: 0.25rem;
}
.igx-badge--success {
  background: hsla(var(--igx-success-500), var(--igx-success-a));
}
.igx-badge--info {
  background: hsla(var(--igx-info-500), var(--igx-info-a));
}
.igx-badge--warning {
  background: hsla(var(--igx-warn-500), var(--igx-warn-a));
}
.igx-badge--error {
  background: hsla(var(--igx-error-500), var(--igx-error-a));
}
.igx-badge--hidden {
  visibility: hidden;
}
igx-bottom-nav {
  --background: var(--igx-bottom-nav-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --idle-item-color: var(--igx-bottom-nav-idle-item-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --active-item-color: var(--igx-bottom-nav-active-item-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --shadow: var(--igx-bottom-nav-shadow, 0 5px 5px -3px rgba(0, 0, 0, 0.26), 0 8px 10px 1px rgba(0, 0, 0, 0.12), 0 3px 14px 2px rgba(0, 0, 0, 0.08));
}
.igx-bottom-nav__panel {
  display: block;
}
.igx-bottom-nav__panel:focus {
  outline-style: none;
}
.igx-bottom-nav__panel:empty {
  display: none;
}
.igx-bottom-nav__menu {
  display: flex;
  position: fixed;
  justify-content: center;
  align-items: center;
  left: 0;
  right: 0;
  height: 3.5rem;
  background: var(--background);
  overflow: hidden;
  z-index: 8;
}
.igx-bottom-nav__menu--top {
  top: 0;
  bottom: inherit;
  box-shadow: var(--shadow);
}
.igx-bottom-nav__menu--bottom {
  top: inherit;
  bottom: 0;
  box-shadow: var(--shadow);
}
.igx-bottom-nav__menu-item, .igx-bottom-nav__menu-item--selected, .igx-bottom-nav__menu-item--disabled {
  display: flex;
  position: relative;
  flex-flow: column nowrap;
  flex: 1;
  align-items: center;
  justify-content: center;
  min-width: 5rem;
  max-width: 10.5rem;
  height: 100%;
  color: var(--idle-item-color);
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  overflow: hidden;
  padding: 0 0.75rem;
  -webkit-tap-highlight-color: transparent;
  outline-style: none;
}
.igx-bottom-nav__menu-item--disabled {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}
.igx-bottom-nav__menu-item--selected {
  color: var(--active-item-color);
  transition: color 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955), opacity 0.25s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-bottom-nav__menu-item [igxBottomNavHeaderLabel], .igx-bottom-nav__menu-item--selected [igxBottomNavHeaderLabel], .igx-bottom-nav__menu-item--disabled [igxBottomNavHeaderLabel] {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-top: 4px;
  max-width: 100%;
  text-align: center;
  transform: translateZ(0);
  transition: transform 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  z-index: 1;
}
.igx-bottom-nav__menu-item [igxBottomNavHeaderIcon], .igx-bottom-nav__menu-item--selected [igxBottomNavHeaderIcon], .igx-bottom-nav__menu-item--disabled [igxBottomNavHeaderIcon] {
  display: flex;
  position: relative;
  justify-content: center;
  height: 24px;
  padding: 0 8px;
  transform: translateZ(0);
  transition: transform 0.15s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  z-index: 1;
}
.igx-bottom-nav__menu-item--selected [igxBottomNavHeaderIcon] {
  transform: translateY(-2px);
}
.igx-bottom-nav__menu-item--selected [igxBottomNavHeaderLabel] {
  transform: translateY(-2px) scale(1.166667);
}
[igxButton=flat], .igx-button--flat {
  --shadow-color: var(--igx-button-shadow-color, transparent);
  --border-color: var(--igx-button-border-color, transparent);
  --disabled-border-color: var(--igx-button-disabled-border-color, transparent);
  --disabled-background: var(--igx-button-disabled-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --disabled-foreground: var(--igx-button-disabled-foreground, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --border-radius: var(--igx-button-border-radius, 4px);
  --background: var(--igx-button-background, transparent);
  --foreground: var(--igx-button-foreground, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --hover-background: var(--igx-button-hover-background, hsla(var(--igx-secondary-500), 0.05));
  --hover-foreground: var(--igx-button-hover-foreground, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --focus-background: var(--igx-button-focus-background, hsla(var(--igx-secondary-400), 0.12));
  --focus-foreground: var(--igx-button-focus-foreground, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --resting-shadow: var(--igx-button-resting-shadow, var(--igx-elevation-0));
  --hover-shadow: var(--igx-button-hover-shadow, var(--igx-elevation-0));
  --focus-shadow: var(--igx-button-focus-shadow, var(--igx-elevation-0));
}
[igxButton=outlined], .igx-button--outlined {
  --shadow-color: var(--igx-button-shadow-color, transparent);
  --border-color: var(--igx-button-border-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --disabled-border-color: var(--igx-button-disabled-border-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --disabled-background: var(--igx-button-disabled-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --disabled-foreground: var(--igx-button-disabled-foreground, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --border-radius: var(--igx-button-border-radius, 4px);
  --background: var(--igx-button-background, transparent);
  --foreground: var(--igx-button-foreground, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --hover-background: var(--igx-button-hover-background, hsla(var(--igx-secondary-500), 0.05));
  --hover-foreground: var(--igx-button-hover-foreground, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --focus-background: var(--igx-button-focus-background, hsla(var(--igx-secondary-400), 0.12));
  --focus-foreground: var(--igx-button-focus-foreground, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --resting-shadow: var(--igx-button-resting-shadow, var(--igx-elevation-0));
  --hover-shadow: var(--igx-button-hover-shadow, var(--igx-elevation-0));
  --focus-shadow: var(--igx-button-focus-shadow, var(--igx-elevation-0));
}
[igxButton=raised], .igx-button--raised {
  --shadow-color: var(--igx-button-shadow-color, transparent);
  --border-color: var(--igx-button-border-color, transparent);
  --disabled-border-color: var(--igx-button-disabled-border-color, transparent);
  --disabled-background: var(--igx-button-disabled-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --disabled-foreground: var(--igx-button-disabled-foreground, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --border-radius: var(--igx-button-border-radius, 4px);
  --background: var(--igx-button-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --foreground: var(--igx-button-foreground, var(--igx-secondary-500-contrast));
  --hover-background: var(--igx-button-hover-background, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --hover-foreground: var(--igx-button-hover-foreground, var(--igx-secondary-300-contrast));
  --focus-background: var(--igx-button-focus-background, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --focus-foreground: var(--igx-button-focus-foreground, var(--igx-secondary-300-contrast));
  --resting-shadow: var(--igx-button-resting-shadow, var(--igx-elevation-2));
  --hover-shadow: var(--igx-button-hover-shadow, var(--igx-elevation-4));
  --focus-shadow: var(--igx-button-focus-shadow, var(--igx-elevation-8));
}
[igxButton=fab], .igx-button--fab {
  --shadow-color: var(--igx-button-shadow-color, transparent);
  --border-color: var(--igx-button-border-color, transparent);
  --disabled-border-color: var(--igx-button-disabled-border-color, transparent);
  --disabled-background: var(--igx-button-disabled-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --disabled-foreground: var(--igx-button-disabled-foreground, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --border-radius: var(--igx-button-border-radius, 28px);
  --background: var(--igx-button-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --foreground: var(--igx-button-foreground, var(--igx-secondary-500-contrast));
  --hover-background: var(--igx-button-hover-background, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --hover-foreground: var(--igx-button-hover-foreground, var(--igx-secondary-300-contrast));
  --focus-background: var(--igx-button-focus-background, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --focus-foreground: var(--igx-button-focus-foreground, var(--igx-secondary-300-contrast));
  --resting-shadow: var(--igx-button-resting-shadow, var(--igx-elevation-6));
  --hover-shadow: var(--igx-button-hover-shadow, var(--igx-elevation-12));
  --focus-shadow: var(--igx-button-focus-shadow, var(--igx-elevation-12));
}
[igxButton=icon], .igx-button--icon {
  --shadow-color: var(--igx-button-shadow-color, transparent);
  --border-color: var(--igx-button-border-color, transparent);
  --disabled-border-color: var(--igx-button-disabled-border-color, transparent);
  --disabled-background: var(--igx-button-disabled-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --disabled-foreground: var(--igx-button-disabled-foreground, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --border-radius: var(--igx-button-border-radius, 20px);
  --background: var(--igx-button-background, transparent);
  --foreground: var(--igx-button-foreground, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --hover-background: var(--igx-button-hover-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --hover-foreground: var(--igx-button-hover-foreground, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --focus-background: var(--igx-button-focus-background, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --focus-foreground: var(--igx-button-focus-foreground, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --resting-shadow: var(--igx-button-resting-shadow, var(--igx-elevation-0));
  --hover-shadow: var(--igx-button-hover-shadow, var(--igx-elevation-0));
  --focus-shadow: var(--igx-button-focus-shadow, var(--igx-elevation-6));
}
.igx-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 5.5rem;
  padding: 0.5625rem 1rem;
  min-height: 2.25rem;
  border: none;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  outline-style: none;
  -webkit-tap-highlight-color: transparent;
  overflow: hidden;
  white-space: nowrap;
  transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
  font-family: inherit;
}
.igx-button igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
  color: inherit;
  display: flex;
  justify-content: center;
}
.igx-button > * {
  margin-left: 0.75rem;
}
.igx-button > *:first-child {
  margin-left: 0;
}
.igx-button--cosy {
  padding: 0.375rem 1rem;
  min-height: 1.875rem;
}
.igx-button--cosy > * {
  margin-left: 0.5rem;
}
.igx-button--cosy > *:first-child {
  margin-left: 0;
}
.igx-button--compact {
  padding: 0.1875rem 1rem;
  min-height: 1.5rem;
}
.igx-button--compact > * {
  margin-left: 0.25rem;
}
.igx-button--compact > *:first-child {
  margin-left: 0;
}
.igx-button--flat {
  background: var(--background);
  color: var(--foreground);
  border-radius: var(--border-radius);
}
.igx-button--flat:hover {
  background: var(--hover-background);
  color: var(--hover-foreground);
}
.igx-button--flat:focus, .igx-button--flat:active {
  background: var(--focus-background);
  color: var(--focus-foreground);
  box-shadow: 0 0 0 0.1875rem var(--shadow-color);
}
.igx-button--outlined {
  background: var(--background);
  color: var(--foreground);
  border-radius: var(--border-radius);
  padding: 0.4375rem 0.875rem;
  border: 1px solid transparent;
  border-color: var(--border-color);
}
.igx-button--outlined:hover {
  background: var(--hover-background);
  color: var(--hover-foreground);
}
.igx-button--outlined:focus, .igx-button--outlined:active {
  background: var(--focus-background);
  color: var(--focus-foreground);
  box-shadow: 0 0 0 0.1875rem var(--shadow-color);
}
.igx-button--cosy.igx-button--outlined {
  padding: 0.25rem 0.875rem;
  min-height: 1.875rem;
}
.igx-button--cosy.igx-button--outlined > * {
  margin-left: 0.5rem;
}
.igx-button--cosy.igx-button--outlined > *:first-child {
  margin-left: 0;
}
.igx-button--compact.igx-button--outlined {
  padding: 0.0625rem 0.875rem;
  min-height: 1.5rem;
}
.igx-button--compact.igx-button--outlined > * {
  margin-left: 0.25rem;
}
.igx-button--compact.igx-button--outlined > *:first-child {
  margin-left: 0;
}
.igx-button--raised {
  color: var(--foreground);
  background: var(--background);
  box-shadow: var(--resting-shadow);
  border-radius: var(--border-radius);
}
.igx-button--raised:hover {
  color: var(--hover-foreground);
  background: var(--hover-background);
  box-shadow: var(--hover-shadow);
}
.igx-button--raised:focus, .igx-button--raised:active {
  color: var(--focus-foreground);
  background: var(--focus-background);
  box-shadow: 0 0 0 0.1875rem var(--shadow-color), var(--focus-shadow);
}
.igx-button--fab, .igx-button--icon {
  display: inline-flex;
  position: relative;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border: 1px solid transparent;
  outline: none;
  cursor: pointer;
  transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
  -webkit-user-select: none;
          user-select: none;
  -webkit-tap-highlight-color: transparent;
  overflow: hidden;
  filter: blur(0);
}
.igx-button--fab {
  padding: 0.5rem 0.875rem;
  min-width: 3rem;
  min-height: 3rem;
  line-height: unset;
  white-space: nowrap;
  color: var(--foreground);
  background: var(--background);
  box-shadow: var(--resting-shadow);
  border-radius: var(--border-radius);
}
.igx-button--fab:hover {
  color: var(--hover-foreground);
  background: var(--hover-background);
  box-shadow: var(--resting-shadow);
}
.igx-button--fab:focus, .igx-button--fab:active {
  color: var(--focus-foreground);
  background: var(--focus-background);
  box-shadow: 0 0 0 0.1875rem var(--shadow-color), var(--focus-shadow);
}
.igx-button--fab > * {
  margin-left: 0.75rem;
}
.igx-button--fab > *:first-child {
  margin-left: 0;
}
.igx-button--cosy.igx-button--fab {
  padding: 0.25rem 0.625rem;
  min-width: 2.5rem;
  min-height: 2.5rem;
}
.igx-button--cosy.igx-button--fab > * {
  margin-left: 0.5rem;
}
.igx-button--cosy.igx-button--fab > *:first-child {
  margin-left: 0;
}
.igx-button--compact.igx-button--fab {
  padding: 0 0.375rem;
  min-width: 2rem;
  min-height: 2rem;
}
.igx-button--compact.igx-button--fab > * {
  margin-left: 0.25rem;
}
.igx-button--compact.igx-button--fab > *:first-child {
  margin-left: 0;
}
.igx-button--icon {
  width: 2.25rem;
  height: 2.25rem;
  min-width: unset;
  min-height: unset;
  font-size: 1rem;
  padding: 0;
  color: var(--foreground);
  background: var(--background);
  border-radius: var(--border-radius);
}
.igx-button--icon:hover {
  transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out, border-color 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
  color: var(--hover-foreground);
  background: var(--hover-background);
}
.igx-button--icon:focus, .igx-button--icon:active {
  color: var(--focus-foreground);
  background: var(--focus-background);
  box-shadow: 0 0 0 0.1875rem var(--shadow-color), var(--focus-shadow);
}
.igx-button--disabled {
  pointer-events: none;
  box-shadow: none;
  color: var(--disabled-foreground);
  background: transparent;
}
.igx-button--disabled.igx-button--raised, .igx-button--disabled.igx-button--fab {
  background: var(--disabled-background);
}
.igx-button--disabled.igx-button--outlined {
  border-color: var(--disabled-border-color);
}
.igx-button--disabled:focus {
  box-shadow: none;
}
igx-buttongroup {
  --border-radius: var(--igx-button-group-border-radius, 4px);
  --idle-shadow-color: var(--igx-button-group-idle-shadow-color, transparent);
  --item-background: var(--igx-button-group-item-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --item-border-color: var(--igx-button-group-item-border-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --item-text-color: var(--igx-button-group-item-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-hover-text-color: var(--igx-button-group-item-hover-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --item-hover-background: var(--igx-button-group-item-hover-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --item-selected-text-color: var(--igx-button-group-item-selected-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --item-selected-background: var(--igx-button-group-item-selected-background, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --item-selected-hover-background: var(--igx-button-group-item-selected-hover-background, hsla(var(--igx-grays-500), 0.8));
  --item-selected-border-color: var(--igx-button-group-item-selected-border-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --disabled-text-color: var(--igx-button-group-disabled-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --disabled-background-color: var(--igx-button-group-disabled-background-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --item-disabled-border: var(--igx-button-group-item-disabled-border, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --border: var(--igx-button-group-border, none);
  --shadow: var(--igx-button-group-shadow, var(--igx-elevation-2));
}
.igx-button-group {
  display: flex;
  box-shadow: var(--shadow);
  transition: all 140ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  border-radius: var(--border-radius);
}
.igx-button-group button {
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
}
.igx-button-group__item {
  border: 1px solid var(--item-border-color);
  color: var(--item-text-color);
  background: var(--item-background);
  min-width: 24px;
  display: flex;
  flex: 1 0 0%;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  position: relative;
  z-index: 0;
  transition: all 140ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
[igxButton].igx-button-group__item {
  border-radius: 0;
}
.igx-button-group__item:not(:nth-child(0)) {
  margin-left: -1px;
}
.igx-button-group__item:first-of-type {
  border-top-left-radius: var(--border-radius);
  border-bottom-left-radius: var(--border-radius);
}
.igx-button-group__item:last-of-type {
  border-top-right-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
}
[igxButton][disabled=true].igx-button-group__item {
  color: var(--disabled-text-color);
  background: var(--disabled-background-color);
  border-color: var(--item-disabled-border);
}
.igx-button-group__item:hover, .igx-button-group__item:focus {
  color: var(--item-hover-text-color);
  background: var(--item-hover-background);
}
.igx-button-group--vertical .igx-button-group__item:not(:nth-child(0)) {
  margin-top: -1px;
  margin-left: 0;
}
.igx-button-group--vertical .igx-button-group__item:first-of-type {
  border-top-left-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.igx-button-group--vertical .igx-button-group__item:last-of-type {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
}
.igx-button-group__item--selected {
  color: var(--item-selected-text-color);
  background: var(--item-selected-background);
  border-color: var(--item-selected-border-color);
  position: relative;
  z-index: 1;
}
.igx-button-group__item--selected:hover, .igx-button-group__item--selected:focus {
  color: var(--item-selected-text-color);
  background: var(--item-selected-hover-background);
}
.igx-button-group__item--selected:focus {
  z-index: 3;
}
[igxButton][disabled=true].igx-button-group__item--selected {
  position: relative;
}
[igxButton][disabled=true].igx-button-group__item--selected::before {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: hsla(var(--igx-grays-500), 0.12);
}
.igx-button-group--vertical {
  flex-flow: column;
}
.igx-button-group__item-content {
  display: flex;
  align-items: center;
  flex-flow: row nowrap;
  min-width: 0;
}
.igx-button-group__item-content * ~ * {
  margin-left: 0.625rem;
}
.igx-button-group__button-text {
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
igx-banner, .igx-banner, .igx-banner--cosy, .igx-banner--compact {
  --banner-background: var(--igx-banner-banner-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --banner-message-color: var(--igx-banner-banner-message-color, var(--igx-surface-500-contrast));
  --banner-border-color: var(--igx-banner-banner-border-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --banner-illustration-color: var(--igx-banner-banner-illustration-color, var(--igx-surface-500-contrast));
}
.igx-banner, .igx-banner--cosy, .igx-banner--compact,
.igx-banner__illustration,
.igx-banner__message {
  display: flex;
  align-items: center;
}
.igx-banner, .igx-banner--cosy, .igx-banner--compact {
  padding-right: 0.5rem;
  padding-left: 0;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background: var(--banner-background);
  align-items: center;
  position: relative;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.igx-banner__illustration {
  justify-content: center;
  width: 2.5rem;
  min-width: 2.5rem;
  height: 2.5rem;
  margin-left: 1rem;
  color: var(--banner-illustration-color);
}
.igx-banner__border-top {
  border-top: 1px solid var(--banner-border-color);
  top: -1px;
}
.igx-banner__border-bottom {
  border-bottom: 1px solid var(--banner-border-color);
  top: 0;
}
.igx-banner__text {
  color: var(--banner-message-color);
  flex: 1 0 0%;
  margin-left: 1.5rem;
}
.igx-banner__text > * {
  margin-top: 0 !important;
}
.igx-banner--cosy {
  padding: 0.5rem;
}
.igx-banner--compact {
  padding: 0.5rem;
}
.igx-banner__message {
  min-width: 13.75rem;
  flex: 1 0 0%;
  margin-right: 5.625rem;
}
.igx-banner__banner__row {
  display: flex;
}
.igx-banner__actions {
  display: flex;
  flex-direction: column;
  align-self: flex-end;
  justify-content: center;
  min-height: 2.5rem;
}
igx-calendar, igx-days-view, igx-months-view, igx-years-view {
  --border-radius: var(--igx-calendar-border-radius, 4px);
  --date-border-radius: var(--igx-calendar-date-border-radius, 20px);
  --month-border-radius: var(--igx-calendar-month-border-radius, 20px);
  --content-background: var(--igx-calendar-content-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --content-text-color: var(--igx-calendar-content-text-color, var(--igx-surface-500-contrast));
  --border-color: var(--igx-calendar-border-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --header-background: var(--igx-calendar-header-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --header-text-color: var(--igx-calendar-header-text-color, var(--igx-secondary-500-contrast));
  --picker-background-color: var(--igx-calendar-picker-background-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --picker-arrow-color: var(--igx-calendar-picker-arrow-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --picker-arrow-hover-color: var(--igx-calendar-picker-arrow-hover-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --picker-text-color: var(--igx-calendar-picker-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --picker-text-hover-color: var(--igx-calendar-picker-text-hover-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --inactive-text-color: var(--igx-calendar-inactive-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --label-color: var(--igx-calendar-label-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --weekend-text-color: var(--igx-calendar-weekend-text-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --year-current-text-color: var(--igx-calendar-year-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --month-current-text-color: var(--igx-calendar-month-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --month-hover-current-text-color: var(--igx-calendar-month-hover-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --year-hover-text-color: var(--igx-calendar-year-hover-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --month-hover-background: var(--igx-calendar-month-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --month-hover-text-color: var(--igx-calendar-month-hover-text-color, var(--igx-grays-200-contrast));
  --date-selected-background: var(--igx-calendar-date-selected-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --date-selected-text-color: var(--igx-calendar-date-selected-text-color, var(--igx-secondary-500-contrast));
  --date-current-text-color: var(--igx-calendar-date-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --date-current-bg-color: var(--igx-calendar-date-current-bg-color, transparent);
  --date-hover-background: var(--igx-calendar-date-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --date-special-background: var(--igx-calendar-date-special-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --date-special-text-color: var(--igx-calendar-date-special-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --date-disabled-text-color: var(--igx-calendar-date-disabled-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --date-disabled-background: var(--igx-calendar-date-disabled-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --week-number-color: var(--igx-calendar-week-number-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --week-number-background: var(--igx-calendar-week-number-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
}
.igx-calendar, .igx-calendar--vertical {
  display: flex;
  flex-flow: column nowrap;
  width: 100%;
  min-width: 290px;
  background: var(--content-background);
  outline: none;
  border-radius: var(--border-radius);
  overflow: hidden;
  border: 0 solid var(--border-color);
}
.igx-calendar + .igx-calendar, .igx-calendar--vertical + .igx-calendar, .igx-calendar + .igx-calendar--vertical, .igx-calendar--vertical + .igx-calendar--vertical {
  margin-left: 1rem;
}
.igx-calendar--vertical {
  flex-flow: row nowrap;
}
.igx-calendar--vertical .igx-calendar__header {
  min-width: 10.5em;
}
.igx-calendar__header {
  background: var(--header-background);
  color: var(--header-text-color);
  padding: 1em;
}
.igx-calendar__header-year {
  margin: 0;
  color: currentColor;
  opacity: 0.8;
}
.igx-calendar__header-date, .igx-calendar--vertical .igx-calendar__header-date {
  display: flex;
  margin: 0;
}
.igx-calendar__header-date > span, .igx-calendar--vertical .igx-calendar__header-date > span {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.igx-calendar--vertical .igx-calendar__header-date {
  flex-flow: column nowrap;
}
.igx-calendar-picker {
  display: flex;
  height: 3.5em;
  align-items: center;
  padding-bottom: 1em;
  background: var(--picker-background-color);
  position: relative;
}
.igx-calendar-picker div {
  text-align: center;
}
.igx-calendar-picker:focus {
  outline: none;
}
.igx-calendar-picker__dates {
  display: flex;
  justify-content: center;
}
.igx-calendar-picker__prev, .igx-calendar-picker__next {
  position: absolute;
  display: inline-flex;
  justify-content: center;
  color: var(--picker-arrow-color);
  -webkit-user-select: none;
          user-select: none;
  outline: none;
  cursor: pointer;
  height: calc(100% - 1em);
  align-items: center;
  top: 0;
}
.igx-calendar-picker__prev:focus, .igx-calendar-picker__next:focus, .igx-calendar-picker__prev:hover, .igx-calendar-picker__next:hover {
  color: var(--picker-arrow-hover-color);
}
.igx-calendar-picker__prev {
  left: 0;
}
.igx-calendar-picker__next {
  right: 0;
}
.igx-calendar-picker__date {
  color: var(--picker-text-color);
  text-align: center;
  outline: none;
  padding: 0 0.125rem;
}
.igx-calendar-picker__date:hover, .igx-calendar-picker__date:focus {
  color: var(--picker-text-hover-color);
  cursor: pointer;
}
.igx-calendar__body {
  flex: 1 1 auto;
  padding-top: 1em;
  padding-bottom: 1em;
  overflow: hidden;
}
.igx-calendar__label, .igx-calendar__date, .igx-calendar__year {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--content-text-color);
  outline: none;
  min-width: 14.28%;
}
.igx-calendar__label:first-of-type, .igx-calendar__date:first-of-type, .igx-calendar__year:first-of-type {
  padding-left: 0.5rem;
}
.igx-calendar__label:last-of-type, .igx-calendar__date:last-of-type, .igx-calendar__year:last-of-type {
  padding-right: 0.5rem;
}
.igx-calendar__label:nth-last-child(8):first-child, .igx-calendar__date:nth-last-child(8):first-child, .igx-calendar__year:nth-last-child(8):first-child, .igx-calendar__label:nth-last-child(8):first-child ~ *, .igx-calendar__date:nth-last-child(8):first-child ~ *, .igx-calendar__year:nth-last-child(8):first-child ~ * {
  min-width: 12.5% !important;
}
.igx-calendar__body-row {
  display: flex;
  justify-content: space-between;
  margin: 0.125rem 0;
  padding: 0;
}
.igx-calendar__body-row:first-of-type {
  margin-bottom: 0;
}
.igx-calendar__body-row:nth-child(2) {
  margin-top: 0;
}
.igx-calendar__body-row:last-of-type .igx-calendar__date-content--week-number {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.igx-calendar__body-row:last-of-type .igx-calendar__date-content--week-number::before {
  display: none;
}
.igx-calendar__body-row--wrap {
  flex-wrap: wrap;
}
.igx-calendar__body-column {
  padding: 0;
  margin: 0;
}
.igx-calendar__body-column .igx-calendar__year, .igx-calendar__body-column .igx-calendar__year--current {
  flex: 1 0 0;
}
.igx-calendar__date:hover .igx-calendar__date-content::after, .igx-calendar__date:focus .igx-calendar__date-content::after, .igx-calendar__date--weekend:hover .igx-calendar__date-content::after, .igx-calendar__date--weekend:focus .igx-calendar__date-content::after {
  background: var(--date-hover-background);
}
.igx-calendar__date--selected:hover .igx-calendar__date-content::after, .igx-calendar__date--selected:focus .igx-calendar__date-content::after {
  background: hsla(var(--igx-grays-100), 0.18);
}
.igx-calendar__date-content {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 2.5em;
  min-width: 2.5em;
  height: 2.5em;
  border-radius: var(--date-border-radius);
  z-index: 0;
}
.igx-calendar__date-content::after {
  position: absolute;
  content: "";
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  top: 2px;
  left: 2px;
  border-radius: inherit;
  z-index: -1;
}
.igx-calendar__label {
  height: 2.5em;
  color: var(--label-color);
  border-radius: 0;
}
.igx-calendar__label:hover, .igx-calendar__label:focus {
  color: var(--label-color);
}
.igx-calendar__date--weekend {
  color: var(--weekend-text-color);
}
.igx-calendar__date--week-number + .igx-calendar__label, .igx-calendar__date--week-number + .igx-calendar__date, .igx-calendar__date--week-number + .igx-calendar__year {
  padding-left: 0 !important;
}
.igx-calendar__label--week-number,
.igx-calendar__date-content--week-number {
  position: relative;
  color: var(--week-number-color) !important;
  border-radius: 0;
  pointer-events: none;
}
.igx-calendar__date--week-number {
  padding-right: 0 !important;
  cursor: default;
}
.igx-calendar__date--week-number:hover .igx-calendar__date-content--week-number, .igx-calendar__date--week-number:focus .igx-calendar__date-content--week-number {
  color: var(--week-number-color) !important;
}
.igx-calendar__date-content--week-number {
  position: relative;
  background: var(--week-number-background) !important;
  min-width: auto;
}
.igx-calendar__date-content--week-number::after {
  display: none;
}
.igx-calendar__date-content--week-number::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 0.25rem;
  left: 0;
  top: 100%;
  background: var(--week-number-background) !important;
}
.igx-calendar__label--week-number {
  padding-right: 0 !important;
  text-align: center;
}
.igx-calendar__label--week-number span {
  width: 2.5em;
  position: relative;
  background: var(--week-number-background);
}
.igx-calendar__label--week-number span::before, .igx-calendar__label--week-number span::after {
  content: "";
  position: absolute;
  width: 100%;
  background: var(--week-number-background);
  left: 0;
}
.igx-calendar__label--week-number span::after {
  top: 100%;
  height: 0.375rem;
}
.igx-calendar__label--week-number span::before {
  bottom: 100%;
  height: 0.5rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.igx-calendar__label--week-number + .igx-calendar__label {
  padding-left: 0 !important;
}
.igx-calendar__year, .igx-calendar__year--current {
  margin: 0;
  min-width: 8ch;
  line-height: 3.25rem;
}
.igx-calendar__year:first-of-type, .igx-calendar__year--current:first-of-type {
  padding-left: 0;
}
.igx-calendar__year:last-of-type, .igx-calendar__year--current:last-of-type {
  padding-right: 0;
}
.igx-calendar__year--current {
  color: var(--year-current-text-color);
}
.igx-calendar__year:hover, .igx-calendar__year:focus {
  color: var(--year-hover-text-color);
}
.igx-calendar__month:hover, .igx-calendar__month:focus, .igx-calendar__month--current:hover, .igx-calendar__month--current:focus {
  color: var(--month-hover-text-color);
  outline-width: 0;
}
.igx-calendar__month:hover::after, .igx-calendar__month:focus::after, .igx-calendar__month--current:hover::after, .igx-calendar__month--current:focus::after {
  background: var(--month-hover-background);
}
.igx-calendar__month {
  position: relative;
  display: flex;
  margin: 0 0.75em;
  flex: 1 0 25%;
  justify-content: center;
  align-items: center;
  height: 5.6875em;
  z-index: 1;
}
.igx-calendar__month::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  height: 48px;
  background: transparent;
  border-radius: var(--month-border-radius);
  transition: background-color 0.15s ease-out;
  z-index: -1;
}
.igx-calendar__month--current {
  color: var(--month-current-text-color);
}
.igx-calendar__month--current:hover, .igx-calendar__month--current:focus {
  color: var(--month-hover-current-text-color);
}
.igx-calendar__date--inactive {
  cursor: pointer;
  color: var(--inactive-text-color);
}
.igx-calendar__date--inactive.igx-calendar__date--single:hover {
  color: var(--inactive-text-color);
}
.igx-calendar__date--special .igx-calendar__date-content {
  background: var(--date-special-background);
  color: var(--date-special-text-color);
  font-weight: 900;
}
.igx-calendar__date--selected {
  position: relative;
  background: var(--date-selected-background);
}
.igx-calendar__date--selected .igx-calendar__date-content {
  color: var(--date-selected-text-color);
  background: var(--date-selected-background);
}
.igx-calendar__date--current .igx-calendar__date-content {
  color: var(--date-current-text-color);
  font-weight: 600;
  background: var(--date-current-bg-color);
}
.igx-calendar__date--current .igx-calendar__date-content:hover {
  background: var(--date-current-bg-color);
}
.igx-calendar__date--current .igx-calendar__date-content:focus {
  background: var(--date-current-bg-color);
}
.igx-calendar__date--current .igx-calendar__date-content::after {
  opacity: 0.2;
}
.igx-calendar__date--selected.igx-calendar__date--current .igx-calendar__date-content {
  color: var(--date-selected-text-color);
  background: var(--date-selected-background);
}
.igx-calendar__date--selected.igx-calendar__date--current .igx-calendar__date-content:hover {
  background: var(--date-selected-background);
}
.igx-calendar__date--selected.igx-calendar__date--current .igx-calendar__date-content:focus {
  background: var(--date-selected-background);
}
.igx-calendar__date--disabled, .igx-calendar__date--disabled.igx-calendar__date--inactive {
  pointer-events: none;
  cursor: not-allowed;
  color: var(--date-disabled-text-color);
}
.igx-calendar__date--single, .igx-calendar__date--selected.igx-calendar__date--first.igx-calendar__date--last {
  background: transparent;
}
.igx-calendar__date--single::before, .igx-calendar__date--selected.igx-calendar__date--first.igx-calendar__date--last::before, .igx-calendar__date--single::after, .igx-calendar__date--selected.igx-calendar__date--first.igx-calendar__date--last::after {
  background: transparent;
}
.igx-calendar__date--disabled.igx-calendar__date--range, .igx-calendar__date--selected.igx-calendar__date--disabled.igx-calendar__date--range {
  background: var(--date-disabled-background) !important;
}
.igx-calendar__date--disabled.igx-calendar__date--range .igx-calendar__date-content {
  color: var(--date-disabled-text-color);
  background: transparent !important;
}
.igx-calendar__date--hidden.igx-calendar__date--disabled.igx-calendar__date--range {
  background: transparent !important;
}
.igx-calendar__date--hidden.igx-calendar__date--disabled.igx-calendar__date--range::after, .igx-calendar__date--hidden.igx-calendar__date--disabled.igx-calendar__date--range::before {
  background: transparent !important;
}
.igx-calendar__date--range.igx-calendar__date--inactive.igx-calendar__date--selected .igx-calendar__date-content {
  color: var(--date-selected-text-color);
}
.igx-calendar__date--range.igx-calendar__date--inactive.igx-calendar__date--selected:focus .igx-calendar__date-content, .igx-calendar__date--range.igx-calendar__date--inactive.igx-calendar__date--selected:hover .igx-calendar__date-content {
  color: var(--date-selected-text-color);
}
.igx-calendar__date--range.igx-calendar__date--inactive.igx-calendar__date--selected.igx-calendar__date--single .igx-calendar__date-content, .igx-calendar__date--range.igx-calendar__date--inactive.igx-calendar__date--selected.igx-calendar__date--first.igx-calendar__date--last .igx-calendar__date-content {
  color: var(--date-selected-text-color);
  background: var(--date-selected-background) !important;
}
.igx-calendar__date--selected.igx-calendar__date--first {
  position: relative;
  background: transparent;
  z-index: 0;
}
.igx-calendar__date--selected.igx-calendar__date--first::after {
  position: absolute;
  content: "";
  width: 50%;
  top: 0;
  left: 50%;
  bottom: 0;
  background: var(--date-selected-background);
  z-index: -1;
}
.igx-calendar__date--selected.igx-calendar__date--last {
  position: relative;
  background: transparent;
  z-index: 0;
}
.igx-calendar__date--selected.igx-calendar__date--last::before {
  position: absolute;
  content: "";
  width: 50%;
  top: 0;
  right: 50%;
  bottom: 0;
  background: var(--date-selected-background);
  z-index: -1;
}
.igx-calendar__date--hidden .igx-calendar__date-content {
  visibility: hidden;
}
.igx-calendar__aria-off-screen {
  position: absolute !important;
  border: none !important;
  height: 1px !important;
  width: 1px !important;
  left: 0 !important;
  top: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
}
.igx-calendar__aria-off-screen:focus {
  outline: none;
}
igx-card {
  --border-radius: var(--igx-card-border-radius, 4px);
  --background: var(--igx-card-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --header-text-color: var(--igx-card-header-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --subtitle-text-color: var(--igx-card-subtitle-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --content-text-color: var(--igx-card-content-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --actions-text-color: var(--igx-card-actions-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --outline-color: var(--igx-card-outline-color, hsla(var(--igx-grays-400), 0.54));
  --resting-shadow: var(--igx-card-resting-shadow, var(--igx-elevation-2));
  --hover-shadow: var(--igx-card-hover-shadow, var(--igx-elevation-8));
}
.igx-card {
  display: flex;
  flex-direction: column;
  box-shadow: var(--resting-shadow);
  overflow: hidden;
  border-radius: var(--border-radius);
  background: var(--background);
  transition: box-shadow 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
.igx-card:hover {
  box-shadow: var(--hover-shadow);
}
.igx-card--outlined {
  box-shadow: none;
  border: 1px solid var(--outline-color);
}
.igx-card--outlined:hover {
  box-shadow: none;
}
.igx-card--horizontal {
  flex-direction: row;
}
.igx-card-header {
  display: flex;
  flex: 1 1 auto;
  flex-flow: row wrap;
  align-content: flex-start;
  width: 100%;
  padding: 1rem;
  color: var(--header-text-color);
}
.igx-card-header:empty {
  display: block;
  padding: 0;
}
.igx-card-header--vertical {
  flex-flow: column nowrap;
}
.igx-card-header--vertical .igx-card-header__titles {
  text-align: center;
}
.igx-card-header--vertical .igx-card-header__thumbnail {
  display: flex;
  justify-content: center;
  align-self: unset;
  margin-right: 0;
  margin-bottom: 1rem;
}
.igx-card-header--compact {
  padding: 1rem;
}
.igx-card-header__thumbnail {
  align-self: flex-start;
  margin-right: 1rem;
}
.igx-card-header__thumbnail:empty {
  display: none;
}
.igx-card-header__titles {
  display: flex;
  flex-flow: column nowrap;
  overflow: hidden;
  flex: 1 1 auto;
  justify-content: center;
}
.igx-card-header__titles:empty {
  display: none;
}
.igx-card-header__subtitle {
  color: var(--subtitle-text-color);
}
.igx-card__tgroup {
  margin: 0 1em;
}
.igx-card-content {
  display: block;
  width: 100%;
  flex: 1 1 auto;
  padding: 0.875rem;
  color: var(--content-text-color);
}
.igx-card__media {
  display: block;
  overflow: hidden;
  line-height: 0;
}
.igx-card__media > * {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.igx-card__media--right {
  width: auto;
  margin-left: auto;
  order: 9999;
}
.igx-card-actions {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  flex: 0 1 auto;
  align-items: center;
  padding: 0.5rem;
}
.igx-card-actions [igxButton] ~ [igxButton] {
  margin-left: 0.5rem;
}
.igx-card-actions--vertical {
  flex-direction: column;
}
.igx-card-actions__icons {
  display: flex;
  align-items: center;
  order: 1;
  color: var(--actions-text-color);
  margin-left: auto;
}
.igx-card-actions__icons:empty {
  display: none;
}
.igx-card-actions__buttons {
  display: flex;
  align-items: center;
  order: 0;
}
.igx-card-actions__buttons:empty {
  display: none;
}
.igx-card-actions--justify .igx-card-actions__buttons,
.igx-card-actions--justify .igx-card-actions__icons {
  justify-content: space-around;
  flex-grow: 1;
}
.igx-card-actions--justify .igx-card-actions__buttons:empty,
.igx-card-actions--justify .igx-card-actions__icons:empty {
  display: none;
}
.igx-card-actions--vertical .igx-card-actions__icons,
.igx-card-actions--vertical .igx-card-actions__buttons {
  flex-direction: column;
}
.igx-card-actions--vertical .igx-card-actions__icons [igxButton] ~ [igxButton],
.igx-card-actions--vertical .igx-card-actions__buttons [igxButton] ~ [igxButton] {
  margin-left: 0;
  margin-top: 0.5rem;
}
.igx-card-actions--vertical .igx-card-actions__icons {
  margin-top: auto;
  margin-left: 0;
}
.igx-card-actions--reverse .igx-card-actions__icons {
  order: 0;
  margin-left: 0;
}
.igx-card-actions--reverse .igx-card-actions__buttons {
  order: 1;
  margin-left: auto;
}
.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__icons {
  margin: 0;
  margin-bottom: auto;
}
.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__buttons {
  margin: 0;
  margin-top: auto;
}
.igx-card-actions__bgroup {
  display: flex;
  flex-flow: row nowrap;
}
.igx-card-actions__bgroup [igxButton] ~ [igxButton] {
  margin-left: 8px;
}
.igx-card-actions__igroup, .igx-card-actions__igroup--start, .igx-card-actions__igroup--end {
  display: flex;
  flex-flow: row nowrap;
}
.igx-card-actions__igroup .igx-button--icon, .igx-card-actions__igroup--start .igx-button--icon, .igx-card-actions__igroup--end .igx-button--icon {
  color: var(--actions-text-color);
}
.igx-card-actions__igroup--start {
  margin-right: auto;
}
.igx-card-actions__igroup--end {
  margin-left: auto;
}
igx-carousel {
  --border-radius: var(--igx-carousel-border-radius, 0px);
  --slide-background: var(--igx-carousel-slide-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --button-background: var(--igx-carousel-button-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --button-hover-background: var(--igx-carousel-button-hover-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --button-arrow-color: var(--igx-carousel-button-arrow-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --button-hover-arrow-color: var(--igx-carousel-button-hover-arrow-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --button-disabled-background: var(--igx-carousel-button-disabled-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --button-disabled-arrow-color: var(--igx-carousel-button-disabled-arrow-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --indicator-dot-color: var(--igx-carousel-indicator-dot-color, transparent);
  --indicator-border-color: var(--igx-carousel-indicator-border-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --indicator-active-dot-color: var(--igx-carousel-indicator-active-dot-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --indicator-active-border-color: var(--igx-carousel-indicator-active-border-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --button-shadow: var(--igx-carousel-button-shadow, var(--igx-elevation-1));
}
@keyframes scale-in-center {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-out-center {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0);
    opacity: 1;
  }
}
.igx-carousel {
  display: flex;
  position: relative;
  justify-content: center;
  width: 100%;
  height: 100%;
  align-items: center;
  flex-flow: column nowrap;
}
.igx-nav-arrow {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 46px;
  height: 46px;
  cursor: pointer;
  border-radius: 50%;
  outline-style: none;
  transition: all 0.15s ease-in-out;
  color: var(--button-arrow-color);
  background: var(--button-background);
  box-shadow: var(--button-shadow);
}
.igx-nav-arrow--disabled {
  background: var(--button-disabled-background);
  color: var(--button-disabled-arrow-color);
  pointer-events: none;
  box-shadow: none;
}
.igx-nav-arrow--disabled igx-icon {
  color: currentColor;
}
.igx-nav-arrow:hover {
  color: var(--button-hover-arrow-color);
  background: var(--button-hover-background);
}
.igx-carousel__arrow, .igx-carousel__arrow--prev, .igx-carousel__arrow--next {
  margin: 0 16px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  outline: none;
  -webkit-user-select: none;
          user-select: none;
}
.igx-carousel__arrow--next {
  right: 0;
}
.igx-carousel__arrow--prev {
  left: 0;
}
.igx-carousel-indicators, .igx-carousel-indicators--top, .igx-carousel-indicators--bottom {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 16px 0;
  padding: 0;
  list-style: none;
  z-index: 10;
  left: 50%;
  transform: translateX(-50%);
}
.igx-carousel-indicators--bottom {
  bottom: 0;
}
.igx-carousel-indicators--top {
  top: 0;
}
.igx-carousel__label {
  align-items: center;
  font-size: 1rem;
}
.igx-carousel-indicators__indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px;
  cursor: pointer;
}
.igx-nav-dot {
  position: relative;
  width: 12px;
  height: 12px;
  text-indent: -9999px;
  border: 2px solid;
  border-color: var(--indicator-border-color);
  box-shadow: var(--igx-elevation-1);
  opacity: 0.7;
  border-radius: 50%;
  transition: all 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-nav-dot::after {
  animation: "scale-out-center" 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  content: "";
  position: absolute;
  top: 1px;
  bottom: 1px;
  left: 1px;
  right: 1px;
  border-radius: inherit;
  background: var(--indicator-dot-color);
}
.igx-nav-dot:hover {
  opacity: 1;
}
.igx-nav-dot--active {
  border: 2px solid;
  border-color: var(--indicator-active-border-color);
  opacity: 1;
}
.igx-nav-dot--active::after {
  background: var(--indicator-active-dot-color);
  animation: "scale-in-center" 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}
.igx-carousel__inner {
  position: relative;
  width: 100%;
  height: inherit;
  overflow: hidden;
  outline-style: none;
  border-radius: var(--border-radius);
  min-height: 300px;
  min-width: 300px;
}
.igx-slide {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  background: var(--slide-background);
  visibility: hidden;
}
.igx-slide--previous {
  z-index: 1;
  visibility: visible;
}
.igx-slide--current {
  z-index: 2;
  visibility: visible;
}
.igx-slide img {
  width: inherit;
  height: inherit;
  object-fit: cover;
  touch-action: none;
  pointer-events: none;
}
igx-splitter {
  --border-radius: var(--igx-splitter-border-radius, 2px);
  --bar-color: var(--igx-splitter-bar-color, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --focus-color: var(--igx-splitter-focus-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --handle-color: var(--igx-splitter-handle-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --expander-color: var(--igx-splitter-expander-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --size: var(--igx-splitter-size, 4px);
}
.igx-splitter-bar::after, .igx-splitter-bar::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 4px;
  background: transparent;
}
.igx-splitter-bar--vertical::after, .igx-splitter-bar--vertical::before {
  width: 4px;
  height: 100%;
}
.igx-splitter-bar {
  position: relative;
  display: flex;
  flex-grow: 1;
  justify-content: center;
  align-items: center;
  background: var(--bar-color);
  border: 1px solid var(--bar-color);
  z-index: 99;
  opacity: 0.68;
  transition: opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}
.igx-splitter-bar::before {
  top: 100%;
}
.igx-splitter-bar::after {
  bottom: 100%;
}
.igx-splitter-bar:hover {
  transition: all 0.25s ease-out;
  opacity: 1;
}
.igx-splitter-bar-host:focus {
  outline: transparent solid 1px;
  box-shadow: inset 0 0 0 1px var(--focus-color);
}
.igx-splitter-bar--vertical {
  flex-direction: column;
  height: 100%;
}
.igx-splitter-bar--vertical::before {
  top: 0;
  right: 100%;
}
.igx-splitter-bar--vertical::after {
  top: 0;
  left: 100%;
}
.igx-splitter-bar__handle, .igx-splitter-bar--vertical .igx-splitter-bar__handle {
  background: var(--handle-color);
  border-radius: var(--border-radius);
}
.igx-splitter-bar__handle {
  width: 25%;
  height: var(--size);
  margin: 0 3rem;
}
.igx-splitter-bar--vertical .igx-splitter-bar__handle {
  width: var(--size);
  height: 25%;
  margin: 3rem 0;
}
.igx-splitter-bar--vertical .igx-splitter-bar__expander--end::before, .igx-splitter-bar--vertical .igx-splitter-bar__expander--start::before, .igx-splitter-bar__expander--end::before, .igx-splitter-bar__expander--start::before {
  position: absolute;
  content: "";
  background: transparent;
}
.igx-splitter-bar__expander--start, .igx-splitter-bar__expander--end, .igx-splitter-bar--vertical .igx-splitter-bar__expander--start, .igx-splitter-bar--vertical .igx-splitter-bar__expander--end {
  position: relative;
  width: 0;
  height: 0;
  border-right: var(--size) solid transparent;
  border-left: var(--size) solid transparent;
  cursor: pointer;
  z-index: 1;
}
.igx-splitter-bar__expander--start {
  border-bottom: var(--size) solid var(--expander-color);
}
.igx-splitter-bar__expander--start::before {
  top: calc(100% - 4px);
  left: calc(100% - (4px * 2));
  width: calc(4px * 4);
  height: calc(4px * 3);
}
.igx-splitter-bar__expander--end {
  border-bottom: unset;
  border-top: var(--size) solid var(--expander-color);
}
.igx-splitter-bar__expander--end::before {
  top: calc(100% - (4px * 2));
  left: calc(100% - (4px * 2));
  width: calc(4px * 4);
  height: calc(4px * 3);
}
.igx-splitter-bar--vertical .igx-splitter-bar__expander--start {
  border-top: var(--size) solid transparent;
  border-right: var(--size) solid var(--expander-color);
  border-bottom: var(--size) solid transparent;
  border-left: unset;
}
.igx-splitter-bar--vertical .igx-splitter-bar__expander--start::before {
  top: calc(100% - (4px * 2));
  left: calc(100% - (4px * 2));
  width: calc(4px * 3);
  height: calc(4px * 4);
}
.igx-splitter-bar--vertical .igx-splitter-bar__expander--end {
  border-top: var(--size) solid transparent;
  border-right: unset;
  border-bottom: var(--size) solid transparent;
  border-left: var(--size) solid var(--expander-color);
}
.igx-splitter-bar--vertical .igx-splitter-bar__expander--end::before {
  left: calc(100% - (4px * 2));
  top: calc(100% - (4px * 2));
  height: calc(4px * 4);
  width: calc(4px * 3);
}
igx-data-chart {
  --title-text-color: var(--data-chart-title-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --subtitle-text-color: var(--data-chart-subtitle-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --brushes: var(--data-chart-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-brushes: var(--data-chart-marker-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--data-chart-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-outlines: var(--data-chart-marker-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --plot-area-background: var(--data-chart-plot-area-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
}
igx-doughnut-chart {
  --brushes: var(--ring-series-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--ring-series-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
}
igx-linear-gauge {
  --backing-brush: var(--linear-gauge-backing-brush, #f2f2f2);
  --backing-outline: var(--linear-gauge-backing-outline, #ebebeb);
  --font-brush: var(--linear-gauge-font-brush, rgba(0, 0, 0, 0.62));
  --minor-tick-brush: var(--linear-gauge-minor-tick-brush, rgba(0, 0, 0, 0.62));
  --needle-brush: var(--linear-gauge-needle-brush, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --needle-outline: var(--linear-gauge-needle-outline, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --range-brushes: var(--linear-gauge-range-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --range-outlines: var(--linear-gauge-range-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --scale-brush: var(--linear-gauge-scale-brush, #ebebeb);
  --tick-brush: var(--linear-gauge-tick-brush, rgba(0, 0, 0, 0.62));
  --scale-outline: var(--linear-gauge-scale-outline, #ebebeb);
}
igx-radial-gauge {
  --backing-brush: var(--radial-gauge-backing-brush, #f2f2f2);
  --backing-outline: var(--radial-gauge-backing-outline, #ebebeb);
  --font-brush: var(--radial-gauge-font-brush, rgba(0, 0, 0, 0.62));
  --minor-tick-brush: var(--radial-gauge-minor-tick-brush, rgba(0, 0, 0, 0.62));
  --needle-brush: var(--radial-gauge-needle-brush, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --needle-outline: var(--radial-gauge-needle-outline, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --range-brushes: var(--radial-gauge-range-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --range-outlines: var(--radial-gauge-range-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --scale-brush: var(--radial-gauge-scale-brush, #ebebeb);
  --tick-brush: var(--radial-gauge-tick-brush, rgba(0, 0, 0, 0.62));
  --needle-pivot-brush: var(--radial-gauge-needle-pivot-brush, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --needle-pivot-outline: var(--radial-gauge-needle-pivot-outline, hsla(var(--igx-surface-500), var(--igx-surface-a)));
}
igx-financial-chart {
  --brushes: var(--financial-chart-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--financial-chart-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-brushes: var(--financial-chart-marker-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-outlines: var(--financial-chart-marker-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --indicator-brushes: var(--financial-chart-indicator-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --indicator-negative-brushes: var(--financial-chart-indicator-negative-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --negative-brushes: var(--financial-chart-negative-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --negative-outlines: var(--financial-chart-negative-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --overlay-brushes: var(--financial-chart-overlay-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --overlay-outlines: var(--financial-chart-overlay-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --overlay-thickness: var(--financial-chart-overlay-thickness, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --trend-line-brushes: var(--financial-chart-trend-line-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --volume-brushes: var(--financial-chart-volume-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --volume-outlines: var(--financial-chart-volume-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
}
igx-bullet-graph {
  --backing-brush: var(--bullet-graph-backing-brush, #f2f2f2);
  --backing-outline: var(--bullet-graph-backing-outline, #ebebeb);
  --font-brush: var(--bullet-graph-font-brush, rgba(0, 0, 0, 0.62));
  --minor-tick-brush: var(--bullet-graph-minor-tick-brush, rgba(0, 0, 0, 0.62));
  --range-brushes: var(--bullet-graph-range-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --range-outlines: var(--bullet-graph-range-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --scale-background-brush: var(--bullet-graph-scale-background-brush, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --scale-background-outline: var(--bullet-graph-scale-background-outline, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --target-value-brush: var(--bullet-graph-target-value-brush, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --tick-brush: var(--bullet-graph-tick-brush, rgba(0, 0, 0, 0.62));
  --value-brush: var(--bullet-graph-value-brush, hsla(var(--igx-grays-800), var(--igx-grays-a)));
}
igx-category-chart {
  --brushes: var(--category-chart-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-brushes: var(--category-chart-marker-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --negative-brushes: var(--category-chart-negative-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--category-chart-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-outlines: var(--category-chart-marker-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --negative-outlines: var(--category-chart-negative-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --title-text-color: var(--category-chart-title-text-color, #616161);
  --subtitle-text-color: var(--category-chart-subtitle-text-color, #616161);
  --trend-line-brushes: var(--category-chart-trend-line-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --x-axis-label-text-color: var(--category-chart-x-axis-label-text-color, #616161);
  --x-axis-tick-stroke: var(--category-chart-x-axis-tick-stroke, #616161);
  --x-axis-title-text-color: var(--category-chart-x-axis-title-text-color, #616161);
  --y-axis-label-text-color: var(--category-chart-y-axis-label-text-color, #616161);
  --y-axis-title-text-color: var(--category-chart-y-axis-title-text-color, #616161);
  --y-axis-tick-stroke: var(--category-chart-y-axis-tick-stroke, #616161);
}
igx-geographic-map {
  --plot-area-background: var(--geo-map-plot-area-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
}
igx-pie-chart {
  --brushes: var(--pie-chart-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--pie-chart-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
}
igx-sparkline {
  --brush: var(--sparkline-brush, hsla(var(--igx-primary-500), var(--igx-primary-a)));
}
igx-funnel-chart {
  --brushes: var(--funnel-chart-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--funnel-chart-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
}
igx-shape-chart {
  --title-text-color: var(--shape-chart-title-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --subtitle-text-color: var(--shape-chart-subtitle-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --brushes: var(--shape-chart-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-brushes: var(--shape-chart-marker-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --outlines: var(--shape-chart-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --marker-outlines: var(--shape-chart-marker-outlines, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
  --trend-line-brushes: var(--shape-chart-trend-line-brushes, #9de772, #8b5bb1, #6db1ff, #9af2e4, #ee5879, #735656, #f7d262, #a8a8b7, #e051a9, #f8a15f);
}
igx-checkbox {
  --border-radius: var(--igx-checkbox-border-radius, 2px);
  --border-radius-ripple: var(--igx-checkbox-border-radius-ripple, 24px);
  --tick-color: var(--igx-checkbox-tick-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --label-color: var(--igx-checkbox-label-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --empty-color: var(--igx-checkbox-empty-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --fill-color: var(--igx-checkbox-fill-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --disabled-color: var(--igx-checkbox-disabled-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --disabled-color-label: var(--igx-checkbox-disabled-color-label, hsla(var(--igx-grays-400), var(--igx-grays-a)));
}
@keyframes scale-in-out {
  50% {
    transform: scale(0.9);
    transform-origin: 50% 50%;
  }
  100% {
    transform: scale(1);
    transform-origin: 50% 50%;
  }
}
.igx-checkbox {
  position: relative;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  outline-style: none;
}
.igx-checkbox--disabled {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
  cursor: initial;
}
.igx-checkbox__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: none;
  clip: rect(0, 0, 0, 0);
  outline: 0;
  pointer-events: none;
  overflow: hidden;
  -webkit-appearance: none;
          appearance: none;
}
.igx-checkbox__composite-wrapper {
  align-items: center;
  justify-content: center;
  display: flex;
  position: relative;
  width: 1.25em;
  height: 1.25em;
}
.igx-checkbox__composite {
  position: relative;
  display: inline-block;
  cursor: pointer;
  width: 1.25em;
  height: 1.25em;
  min-width: 1.25em;
  border-width: 0.125rem;
  border-style: solid;
  border-color: var(--empty-color);
  border-radius: var(--border-radius);
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  overflow: hidden;
}
.igx-checkbox__composite::after {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-checkbox--indeterminate .igx-checkbox__composite, .igx-checkbox--checked .igx-checkbox__composite {
  border-color: var(--fill-color);
  background: var(--fill-color);
}
.igx-checkbox--indeterminate .igx-checkbox__composite::after, .igx-checkbox--checked .igx-checkbox__composite::after {
  background: var(--fill-color);
}
.igx-checkbox--disabled .igx-checkbox__composite {
  border-color: var(--disabled-color);
  background: transparent;
}
.igx-checkbox--indeterminate.igx-checkbox--disabled .igx-checkbox__composite, .igx-checkbox--checked.igx-checkbox--disabled .igx-checkbox__composite {
  background: var(--disabled-color);
}
.igx-checkbox--indeterminate.igx-checkbox--disabled .igx-checkbox__composite::after, .igx-checkbox--checked.igx-checkbox--disabled .igx-checkbox__composite::after {
  background: var(--disabled-color);
}
.igx-checkbox__composite-mark {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  stroke: var(--tick-color);
  stroke-linecap: square;
  stroke-width: 3;
  stroke-dasharray: 24;
  stroke-dashoffset: 24;
  fill: none;
  opacity: 0;
  z-index: 1;
  transition: opacity 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-checkbox--indeterminate .igx-checkbox__composite-mark {
  top: 0;
  left: 0;
}
.igx-checkbox--checked .igx-checkbox__composite-mark {
  stroke-dashoffset: 0;
  opacity: 1;
  transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-checkbox--indeterminate .igx-checkbox__composite-mark {
  stroke-dashoffset: 41;
  /* length of path - adjacent line length */
  opacity: 1;
  transform: rotate(45deg) translateX(-0.125em);
}
.igx-checkbox__label, .igx-checkbox__label--before {
  display: inline-block;
  color: var(--label-color);
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  word-wrap: break-all;
}
.igx-checkbox__label:empty, .igx-checkbox__label--before:empty {
  margin: 0;
}
.igx-checkbox__label--before:empty,
.igx-checkbox__label:empty {
  margin: 0;
}
.igx-checkbox__label {
  margin-left: 0.5em;
}
.igx-checkbox__label--before {
  margin-right: 0.5em;
  order: -1;
}
.igx-checkbox--disabled .igx-checkbox__label, .igx-checkbox--disabled .igx-checkbox__label--before {
  color: var(--disabled-color-label);
}
.igx-checkbox__ripple {
  display: block;
  position: absolute;
  top: calc(50% - 1.5em);
  right: calc(100% - 1.5em - 0.625em);
  width: 3em;
  height: 3em;
  border-radius: var(--border-radius-ripple);
  overflow: hidden;
  pointer-events: none;
  filter: opacity(1);
}
.igx-checkbox__ripple,
.igx-checkbox__ripple [igxRipple] {
  --color: var(--igx-ripple-color, var(--fill-color));
}
.igx-checkbox__ripple .igx-ripple__inner {
  display: block;
  position: absolute;
  border-radius: 50%;
  background: var(--color);
  pointer-events: none;
  transform-origin: center;
  transform: translate3d(0, 0, 0) scale(0);
  will-change: opacity, transform;
  opacity: 0.5;
  margin: 0 !important;
  border: none !important;
}
.igx-checkbox__ripple .igx-ripple {
  overflow: hidden;
}
.igx-checkbox__ripple,
.igx-checkbox__ripple [igxRipple] {
  --color: var(--igx-ripple-color, var(--fill-color));
}
.igx-checkbox--focused .igx-checkbox__ripple, .igx-checkbox--focused.igx-checkbox--checked .igx-checkbox__ripple, .igx-checkbox--focused.igx-checkbox--indeterminate .igx-checkbox__ripple {
  background: var(--empty-color);
  transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 0.12;
}
.igx-checkbox--focused.igx-checkbox--checked .igx-checkbox__ripple, .igx-checkbox--focused.igx-checkbox--indeterminate .igx-checkbox__ripple {
  background: var(--fill-color);
}
.igx-checkbox:hover .igx-checkbox__ripple::after, .igx-checkbox:active .igx-checkbox__ripple::after, .igx-checkbox--indeterminate:hover .igx-checkbox__ripple::after, .igx-checkbox--indeterminate:active .igx-checkbox__ripple::after, .igx-checkbox--checked:hover .igx-checkbox__ripple::after, .igx-checkbox--checked:active .igx-checkbox__ripple::after {
  position: absolute;
  content: "";
  opacity: 0.06;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.igx-checkbox:hover .igx-checkbox__ripple::after, .igx-checkbox:active .igx-checkbox__ripple::after {
  background: var(--empty-color);
}
.igx-checkbox--indeterminate:hover .igx-checkbox__ripple::after, .igx-checkbox--indeterminate:active .igx-checkbox__ripple::after, .igx-checkbox--checked:hover .igx-checkbox__ripple::after, .igx-checkbox--checked:active .igx-checkbox__ripple::after {
  background: var(--fill-color);
}
.igx-checkbox:active .igx-checkbox__ripple::after, .igx-checkbox--indeterminate:active .igx-checkbox__ripple::after, .igx-checkbox--checked:active .igx-checkbox__ripple::after {
  opacity: 0.12;
}
.igx-checkbox--plain .igx-checkbox__composite,
.igx-checkbox--plain .igx-checkbox__composite::after,
.igx-checkbox--plain .igx-checkbox__composite-mark {
  transition: none;
}
igx-chip, .igx-chip__ghost, .igx-chip__ghost--compact, .igx-chip__ghost--cosy {
  --border-radius: var(--igx-chip-border-radius, 16px);
  --remove-icon-color: var(--igx-chip-remove-icon-color, 'currentColor');
  --focus-outline-color: var(--igx-chip-focus-outline-color, transparent);
  --focus-selected-outline-color: var(--igx-chip-focus-selected-outline-color, transparent);
  --remove-icon-color-focus: var(--igx-chip-remove-icon-color-focus, hsla(var(--igx-error-500), var(--igx-error-a)));
  --text-color: var(--igx-chip-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --background: var(--igx-chip-background, hsla(var(--igx-grays-400), 0.38));
  --border-color: var(--igx-chip-border-color, transparent);
  --ghost-background: var(--igx-chip-ghost-background, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --hover-text-color: var(--igx-chip-hover-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --hover-background: var(--igx-chip-hover-background, hsla(var(--igx-grays-400), 0.54));
  --hover-border-color: var(--igx-chip-hover-border-color, transparent);
  --focus-text-color: var(--igx-chip-focus-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --focus-background: var(--igx-chip-focus-background, hsla(var(--igx-grays-600), 0.54));
  --focus-border-color: var(--igx-chip-focus-border-color, transparent);
  --selected-text-color: var(--igx-chip-selected-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --selected-background: var(--igx-chip-selected-background, hsla(var(--igx-grays-600), 0.38));
  --selected-border-color: var(--igx-chip-selected-border-color, transparent);
  --hover-selected-text-color: var(--igx-chip-hover-selected-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --hover-selected-background: var(--igx-chip-hover-selected-background, hsla(var(--igx-grays-400), 0.54));
  --hover-selected-border-color: var(--igx-chip-hover-selected-border-color, transparent);
  --focus-selected-text-color: var(--igx-chip-focus-selected-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --focus-selected-background: var(--igx-chip-focus-selected-background, hsla(var(--igx-grays-600), 0.54));
  --focus-selected-border-color: var(--igx-chip-focus-selected-border-color, transparent);
  --ghost-shadow: var(--igx-chip-ghost-shadow, var(--igx-elevation-8));
}
.igx-chip-area {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}
.igx-chip-area:empty {
  display: none;
}
.igx-chip {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  transition: all 120ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition-property: top, left;
  touch-action: none;
}
.igx-chip:focus {
  outline-style: none;
}
.igx-chip--disabled .igx-chip__item {
  cursor: default;
  pointer-events: none;
}
.igx-chip igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
  outline-style: none;
}
.igx-chip--cosy igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
  outline-style: none;
}
.igx-chip__ghost--compact igx-icon, .igx-chip--compact igx-icon {
  width: 1rem;
  height: 1rem;
  font-size: 1rem;
  outline-style: none;
}
.igx-chip igx-prefix,
.igx-chip [igxPrefix],
.igx-chip igx-suffix,
.igx-chip [igxSuffix] {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  max-width: 32ch;
}
.igx-chip igx-suffix + igx-suffix,
.igx-chip [igxSuffix] + igx-suffix,
.igx-chip igx-suffix + [igxSuffix],
.igx-chip [igxSuffix] + [igxSuffix],
.igx-chip igx-suffix + .igx-chip__remove,
.igx-chip [igxSuffix] + .igx-chip__remove {
  margin-left: 0.25rem;
}
.igx-chip igx-prefix + igx-prefix,
.igx-chip [igxPrefix] + igx-prefix,
.igx-chip igx-prefix + [igxPrefix],
.igx-chip [igxPrefix] + [igxPrefix] {
  margin-left: 0.25rem;
}
.igx-chip igx-prefix + igx-prefix igx-avatar,
.igx-chip [igxPrefix] + igx-prefix igx-avatar,
.igx-chip igx-prefix + [igxPrefix] igx-avatar,
.igx-chip [igxPrefix] + [igxPrefix] igx-avatar {
  max-height: 100%;
  max-width: 100%;
  margin-left: 0 !important;
}
.igx-chip__content {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding: 0 0.5rem;
  max-width: 32ch;
}
.igx-chip__content:empty {
  display: none;
}
.igx-chip--cosy .igx-chip__content {
  padding: 0 0.25rem;
}
.igx-chip--compact .igx-chip__content {
  padding: 0 0.125rem;
}
.igx-chip__remove {
  display: inline-flex;
  margin-right: 0.25rem;
  color: var(--remove-icon-color, currentColor);
}
.igx-chip__remove:empty {
  display: none;
}
.igx-chip__remove:focus {
  outline-style: none;
}
.igx-chip__remove:focus igx-icon {
  outline-style: none;
  color: var(--remove-icon-color-focus);
}
.igx-chip__remove igx-icon:focus {
  outline-style: none;
}
.igx-chip__select, .igx-chip__select--hidden {
  display: inline-flex;
  align-items: center;
  width: 18px;
  opacity: 1;
  z-index: 1;
  transition: opacity 120ms cubic-bezier(0.25, 0.46, 0.45, 0.94), width 120ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-chip__select > *, .igx-chip__select--hidden > * {
  width: inherit !important;
}
.igx-chip__select + igx-prefix, .igx-chip__select--hidden + igx-prefix,
.igx-chip__select + [igxPrefix],
.igx-chip__select--hidden + [igxPrefix] {
  margin-left: 0.25rem;
}
.igx-chip__select--hidden {
  width: 0;
  opacity: 0;
  z-index: -1;
}
.igx-chip__select--hidden + igx-prefix,
.igx-chip__select--hidden + [igxPrefix] {
  margin-left: 0;
}
.igx-chip__item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  height: 2rem;
  padding: 0 0.25rem;
  color: var(--text-color);
  background: var(--background);
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color);
  border-radius: var(--border-radius);
  -webkit-user-select: none;
          user-select: none;
  overflow: hidden;
  cursor: pointer;
  filter: opacity(1);
}
.igx-chip:hover .igx-chip__item {
  color: var(--hover-text-color);
  background: var(--hover-background);
  border-color: var(--hover-border-color);
  transition: all 120ms ease-in;
}
.igx-chip:focus .igx-chip__item {
  color: var(--focus-text-color);
  background: var(--focus-background);
  border-color: var(--focus-border-color);
  outline-style: none;
}
.igx-chip__item--selected {
  color: var(--selected-text-color);
  background: var(--selected-background);
  border-color: var(--selected-border-color);
}
.igx-chip:hover .igx-chip__item--selected {
  color: var(--hover-selected-text-color);
  background: var(--hover-selected-background);
  border-color: var(--hover-selected-border-color);
  transition: all 120ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-chip:focus .igx-chip__item--selected {
  color: var(--focus-selected-text-color);
  background: var(--focus-selected-background);
  border-color: var(--focus-selected-border-color);
  transition: all 120ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-chip--cosy .igx-chip__item {
  height: 1.5rem;
  padding: 0 0.25rem;
}
.igx-chip--compact .igx-chip__item {
  height: 1.125rem;
  padding: 0 0.125rem;
}
.igx-chip__ghost {
  position: absolute;
  box-shadow: var(--ghost-shadow);
  overflow: hidden;
  color: var(--focus-text-color);
  background: var(--ghost-background);
}
.igx-chip__ghost:hover, .igx-chip__ghost:focus {
  background: var(--ghost-background);
}
.igx-chip__ghost--cosy {
  height: 1.5rem;
}
.igx-chip__ghost--cosy .igx-chip__content {
  padding: 0 0.25rem;
}
.igx-chip__ghost--compact {
  height: 1.125rem;
}
.igx-chip__ghost--compact .igx-chip__content {
  padding: 0 0.125rem;
}
.igx-chip__ghost,
.igx-chip__ghost--cosy,
.igx-chip__ghost--compact {
  z-index: 10;
}
igx-column-actions {
  --background-color: var(--igx-column-actions-background-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --title-color: var(--igx-column-actions-title-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
}
.igx-column-actions {
  display: flex;
  flex-flow: column nowrap;
  background: var(--background-color);
  box-shadow: var(--igx-elevation-8);
  width: 100%;
  flex: 1 1 auto;
  min-width: 11.25rem;
}
.igx-column-actions__header-title {
  color: var(--title-color);
  margin: 0;
  padding: 1rem 1rem 0.5rem;
}
.igx-column-actions__header-input {
  font-size: 1rem !important;
  margin: -16px 0 0 !important;
  padding: 0.5rem 1rem;
}
.igx-column-actions__columns {
  display: flex;
  flex-flow: column nowrap;
  overflow-y: auto;
  outline-style: none;
}
.igx-column-actions__columns-item {
  padding: 0.25rem 1rem;
  min-height: 2rem;
}
.igx-column-actions__buttons {
  display: flex;
  justify-content: flex-end;
  padding: 0.5rem 1rem;
}
igx-combo {
  --empty-list-background: var(--igx-combo-empty-list-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --search-separator-border-color: var(--igx-combo-search-separator-border-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --empty-list-placeholder-color: var(--igx-combo-empty-list-placeholder-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
}
.igx-combo {
  position: relative;
  display: block;
}
.igx-combo__checkbox {
  margin-right: 0.5rem;
}
.igx-combo__drop-down {
  position: absolute;
  width: 100%;
}
.igx-combo__drop-down .igx-drop-down {
  width: 100%;
}
.igx-combo__search {
  padding: 0.5rem 1rem;
  margin: 0 !important;
  z-index: 26;
  border-bottom: 1px dashed var(--search-separator-border-color);
}
.igx-combo__content {
  position: relative;
  overflow: hidden;
}
.igx-combo__content:focus {
  outline: transparent;
}
.igx-combo__add {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  padding: 1rem;
  background: var(--empty-list-background);
}
.igx-combo__empty {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  color: var(--empty-list-placeholder-color);
  padding: 0 1.5rem;
  font-size: 0.8125rem;
}
.igx-combo__add-item.igx-drop-down__item {
  width: auto !important;
  padding: 0 !important;
}
.igx-combo__add-item.igx-drop-down__item:hover {
  background: transparent !important;
}
.igx-combo__add-item.igx-drop-down__item--focused:focus {
  background: transparent !important;
}
.igx-date-picker {
  --border-radius: var(--igx-calendar-border-radius, 4px);
  --date-border-radius: var(--igx-calendar-date-border-radius, 20px);
  --month-border-radius: var(--igx-calendar-month-border-radius, 20px);
  --content-background: var(--igx-calendar-content-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --content-text-color: var(--igx-calendar-content-text-color, var(--igx-surface-500-contrast));
  --border-color: var(--igx-calendar-border-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --header-background: var(--igx-calendar-header-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --header-text-color: var(--igx-calendar-header-text-color, var(--igx-secondary-500-contrast));
  --picker-background-color: var(--igx-calendar-picker-background-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --picker-arrow-color: var(--igx-calendar-picker-arrow-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --picker-arrow-hover-color: var(--igx-calendar-picker-arrow-hover-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --picker-text-color: var(--igx-calendar-picker-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --picker-text-hover-color: var(--igx-calendar-picker-text-hover-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --inactive-text-color: var(--igx-calendar-inactive-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --label-color: var(--igx-calendar-label-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --weekend-text-color: var(--igx-calendar-weekend-text-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --year-current-text-color: var(--igx-calendar-year-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --month-current-text-color: var(--igx-calendar-month-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --month-hover-current-text-color: var(--igx-calendar-month-hover-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --year-hover-text-color: var(--igx-calendar-year-hover-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --month-hover-background: var(--igx-calendar-month-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --month-hover-text-color: var(--igx-calendar-month-hover-text-color, var(--igx-grays-200-contrast));
  --date-selected-background: var(--igx-calendar-date-selected-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --date-selected-text-color: var(--igx-calendar-date-selected-text-color, var(--igx-secondary-500-contrast));
  --date-current-text-color: var(--igx-calendar-date-current-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --date-current-bg-color: var(--igx-calendar-date-current-bg-color, transparent);
  --date-hover-background: var(--igx-calendar-date-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --date-special-background: var(--igx-calendar-date-special-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --date-special-text-color: var(--igx-calendar-date-special-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --date-disabled-text-color: var(--igx-calendar-date-disabled-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --date-disabled-background: var(--igx-calendar-date-disabled-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --week-number-color: var(--igx-calendar-week-number-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --week-number-background: var(--igx-calendar-week-number-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
}
.igx-date-picker {
  box-shadow: var(--igx-elevation-24);
  border-radius: var(--border-radius);
  background: var(--content-background);
  overflow: hidden;
}
.igx-date-picker .igx-calendar, .igx-date-picker .igx-calendar--vertical {
  background: var(--content-background);
}
.igx-date-picker .igx-calendar__header {
  background: var(--header-background);
  color: var(--header-text-color);
}
.igx-date-picker .igx-calendar-picker__prev, .igx-date-picker .igx-calendar-picker__next {
  color: var(--picker-arrow-color);
}
.igx-date-picker .igx-calendar-picker__prev:hover, .igx-date-picker .igx-calendar-picker__next:hover {
  color: var(--picker-arrow-hover-color);
}
.igx-date-picker .igx-calendar-picker__date {
  color: var(--picker-text-color);
}
.igx-date-picker .igx-calendar-picker__date:hover, .igx-date-picker .igx-calendar-picker__date:focus {
  color: var(--picker-text-hover-color);
}
.igx-date-picker .igx-calendar__label, .igx-date-picker .igx-calendar__date, .igx-date-picker .igx-calendar__year {
  color: var(--content-text-color);
  min-width: 14.28%;
}
.igx-date-picker .igx-calendar__label {
  color: var(--label-color);
}
.igx-date-picker .igx-calendar__label:hover, .igx-date-picker .igx-calendar__label:focus {
  color: var(--label-color);
}
.igx-date-picker .igx-calendar__date--weekend {
  color: var(--weekend-text-color);
}
.igx-date-picker .igx-calendar__date--special {
  color: var(--date-special-text-color);
  background: var(--date-special-background);
}
.igx-date-picker .igx-calendar__date--disabled {
  color: var(--date-disabled-text-color);
}
.igx-date-picker .igx-calendar__year--current {
  color: var(--year-current-text-color);
}
.igx-date-picker .igx-calendar__year:hover, .igx-date-picker .igx-calendar__year:focus {
  color: var(--year-hover-text-color);
}
.igx-date-picker .igx-calendar__month:hover, .igx-date-picker .igx-calendar__month:focus, .igx-date-picker .igx-calendar__month--current:hover, .igx-date-picker .igx-calendar__month--current:focus {
  color: var(--month-hover-text-color);
}
.igx-date-picker .igx-calendar__month--current {
  color: var(--month-current-text-color);
}
.igx-date-picker .igx-calendar__date--inactive {
  color: var(--inactive-text-color);
}
.igx-date-picker .igx-calendar__date--inactive:hover {
  color: var(--inactive-text-color);
}
.igx-date-picker .igx-calendar__date--selected {
  color: var(--date-selected-text-color);
}
.igx-date-picker .igx-calendar__date--current {
  color: var(--date-current-text-color);
}
.igx-date-picker .igx-calendar__date:hover .igx-calendar__date-content::after, .igx-date-picker .igx-calendar__date:focus .igx-calendar__date-content::after, .igx-date-picker .igx-calendar__date--weekend:hover .igx-calendar__date-content::after, .igx-date-picker .igx-calendar__date--weekend:focus .igx-calendar__date-content::after {
  background: var(--date-hover-background);
}
.igx-date-picker .igx-calendar__date.igx-calendar__date--selected:hover .igx-calendar__date-content::after, .igx-date-picker .igx-calendar__date.igx-calendar__date--selected:focus .igx-calendar__date-content::after, .igx-date-picker .igx-calendar__date--weekend.igx-calendar__date--selected:hover .igx-calendar__date-content::after, .igx-date-picker .igx-calendar__date--weekend.igx-calendar__date--selected:focus .igx-calendar__date-content::after {
  background: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-date-picker--vertical {
  min-width: 368px;
  /* 168px for header + 200px for the content */
}
.igx-date-picker--dropdown {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  box-shadow: var(--igx-elevation-3);
}
.igx-date-picker__buttons {
  display: flex;
  justify-content: flex-end;
  padding: 0.5rem;
}
igx-date-range {
  --label-color: var(--igx-date-range-label-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
}
.igx-date-range-picker, .igx-date-range-picker--cosy, .igx-date-range-picker--compact {
  display: flex;
}
.igx-date-range-picker > igx-icon, .igx-date-range-picker--cosy > igx-icon, .igx-date-range-picker--compact > igx-icon {
  cursor: pointer;
}
.igx-date-range-picker igx-input-group, .igx-date-range-picker--cosy igx-input-group, .igx-date-range-picker--compact igx-input-group {
  flex: 1;
}
igx-date-range-start,
igx-date-range-end,
.igx-date-range-picker__start,
.igx-date-range-picker__end {
  flex: 1 0 0%;
}
.igx-date-range-picker__label {
  display: flex;
  align-items: center;
  color: var(--label-color);
  margin: 0 0.5rem;
  padding-top: 18px;
}
.igx-date-range-picker--cosy .igx-date-range-picker__label {
  padding-top: 15.1578947368px;
}
.igx-date-range-picker--compact .igx-date-range-picker__label {
  padding-top: 13.0909090909px;
}
.igx-date-range-picker-buttons {
  display: flex;
  justify-content: flex-end;
  padding: 0 1rem 1rem 1rem;
}
.igx-date-range-picker-buttons > * {
  margin-right: 0.5rem;
}
.igx-date-range-picker-buttons > *:last-of-type {
  margin-right: 0;
}
.igx-date-range-picker-buttons:empty {
  display: none;
}
.igx-dialog {
  --border-radius: var(--igx-dialog-border-radius, 4px);
  --background: var(--igx-dialog-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --title-color: var(--igx-dialog-title-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --message-color: var(--igx-dialog-message-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --border-color: var(--igx-dialog-border-color, transparent);
  --shadow: var(--igx-dialog-shadow, var(--igx-elevation-24));
}
.igx-dialog {
  outline-style: none;
}
.igx-dialog--hidden {
  display: none;
}
.igx-dialog__window {
  position: relative;
  min-width: 17.5rem;
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius);
  background: var(--background);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.igx-dialog__window .igx-calendar {
  width: 20rem;
}
.igx-dialog__window .igx-calendar--vertical {
  width: 31rem;
}
.igx-dialog__window-title {
  display: flex;
  color: var(--title-color);
  padding: 1.5rem 1.5rem 0.75rem 1.5rem;
}
.igx-dialog__window-content {
  color: var(--message-color);
  padding: 0.75rem 1.5rem;
}
.igx-dialog__window-message {
  display: inline-block;
  max-width: 40ch;
}
@media all and (-ms-high-contrast: none) {
  .igx-dialog__window-message {
    max-width: 62ch;
  }
}
.igx-dialog__window-actions {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-end;
  padding: 0.5rem;
}
.igx-dialog__window-actions button + button {
  margin-left: 0.5rem;
}
igx-divider {
  --color: var(--igx-divider-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
}
.igx-divider {
  display: block;
  height: 1px;
  background: var(--color);
}
.igx-divider--dashed {
  background: linear-gradient(to right, var(--color) 50%, transparent 50%);
  background-size: 10px 1px;
  /* dash size */
}
.igx-divider--vertical {
  display: inline-block;
  width: 1px;
  min-width: 1px;
  height: auto;
}
.igx-divider--vertical.igx-divider--dashed {
  background: linear-gradient(to bottom, var(--color) 50%, transparent 50%);
  background-size: 1px 10px;
  /* dash size */
}
igc-dockmanager {
  --igc-active-color: var(--igc-dockmanager-active-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --igc-background-color: var(--igc-dockmanager-background-color, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --igc-border-color: var(--igc-dockmanager-border-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --igc-button-text: var(--igc-dockmanager-button-text, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --igc-context-menu-color-active: var(--igc-dockmanager-context-menu-color-active, var(--igx-surface-500-contrast));
  --igc-dock-background: var(--igc-dockmanager-dock-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --igc-drop-shadow-background: var(--igc-dockmanager-drop-shadow-background, hsla(var(--igx-primary-900), 0.1));
  --igc-floating-pane-border-color: var(--igc-dockmanager-floating-pane-border-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --igc-flyout-shadow-color: var(--igc-dockmanager-flyout-shadow-color, hsla(var(--igx-grays-900), 0.1));
  --igc-joystick-border-color: var(--igc-dockmanager-joystick-border-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --igc-joystick-icon-color: var(--igc-dockmanager-joystick-icon-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --igc-joystick-icon-color-active: var(--igc-dockmanager-joystick-icon-color-active, var(--igx-surface-500-contrast));
  --igc-pane-content-background: var(--igc-dockmanager-pane-content-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --igc-pane-header-background: var(--igc-dockmanager-pane-header-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --igc-pinned-header-background: var(--igc-dockmanager-pinned-header-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --igc-splitter-background: var(--igc-dockmanager-splitter-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --igc-tab-background-active: var(--igc-dockmanager-tab-background-active, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --igc-text-color: var(--igc-dockmanager-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
}
.igx-drop-down__list, .igx-grid-toolbar__dd-list {
  --border-radius: var(--igx-drop-down-border-radius, 4px);
  --item-border-radius: var(--igx-drop-down-item-border-radius, 0px);
  --background-color: var(--igx-drop-down-background-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --header-text-color: var(--igx-drop-down-header-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --item-text-color: var(--igx-drop-down-item-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --hover-item-text-color: var(--igx-drop-down-hover-item-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --hover-item-background: var(--igx-drop-down-hover-item-background, hsla(var(--igx-grays-100), 0.8));
  --focused-item-background: var(--igx-drop-down-focused-item-background, hsla(var(--igx-grays-100), 0.8));
  --focused-item-text-color: var(--igx-drop-down-focused-item-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --selected-item-background: var(--igx-drop-down-selected-item-background, hsla(var(--igx-secondary-100), var(--igx-secondary-a)));
  --selected-item-text-color: var(--igx-drop-down-selected-item-text-color, var(--igx-secondary-100-contrast));
  --selected-hover-item-background: var(--igx-drop-down-selected-hover-item-background, hsla(var(--igx-secondary-200), var(--igx-secondary-a)));
  --selected-hover-item-text-color: var(--igx-drop-down-selected-hover-item-text-color, var(--igx-secondary-200-contrast));
  --selected-focus-item-background: var(--igx-drop-down-selected-focus-item-background, hsla(var(--igx-secondary-200), var(--igx-secondary-a)));
  --selected-focus-item-text-color: var(--igx-drop-down-selected-focus-item-text-color, var(--igx-secondary-200-contrast));
  --disabled-item-background: var(--igx-drop-down-disabled-item-background, hsla(var(--igx-grays-50), 0));
  --disabled-item-text-color: var(--igx-drop-down-disabled-item-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --border-color: var(--igx-drop-down-border-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --border-width: var(--igx-drop-down-border-width, 0);
  --shadow: var(--igx-drop-down-shadow, var(--igx-elevation-8));
}
.igx-drop-down {
  position: absolute;
}
.igx-drop-down__list {
  overflow: hidden;
  border-radius: var(--border-radius);
  background: var(--background-color);
  box-shadow: var(--shadow);
  min-width: 8rem;
  border: var(--border-width) solid var(--border-color);
}
.igx-drop-down__list-scroll {
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  position: relative;
}
.igx-drop-down__list-scroll igx-input-group {
  margin-top: -16px !important;
}
.igx-drop-down__group label, .igx-drop-down__header,
.igx-drop-down__item {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  white-space: nowrap;
  height: 2.5rem;
  position: relative;
}
.igx-drop-down__group label igx-divider, .igx-drop-down__header igx-divider,
.igx-drop-down__item igx-divider {
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
}
.igx-drop-down__item {
  color: var(--item-text-color);
  cursor: pointer;
  padding: 0 1.5rem;
  border-radius: var(--item-border-radius);
}
.igx-drop-down__item:focus {
  outline: 0;
  outline-color: transparent;
  background: var(--focused-item-background);
  color: var(--focused-item-text-color);
}
.igx-drop-down__item:hover {
  background: var(--hover-item-background);
  color: var(--hover-item-text-color);
}
.igx-drop-down__content {
  display: flex;
  width: 100%;
  align-items: center;
}
.igx-drop-down__inner {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-right: auto;
}
.igx-drop-down__item--cosy {
  height: 2rem;
  padding: 0 1.25rem;
}
.igx-drop-down__item--compact {
  height: 1.75rem;
  padding: 0 1rem;
}
.igx-drop-down__group label igx-prefix, .igx-drop-down__header igx-prefix,
.igx-drop-down__group label [igxPrefix],
.igx-drop-down__header [igxPrefix],
.igx-drop-down__item igx-prefix,
.igx-drop-down__item [igxPrefix] {
  margin-right: 1.25rem;
}
.igx-drop-down__group label igx-suffix + igx-suffix, .igx-drop-down__header igx-suffix + igx-suffix,
.igx-drop-down__group label [igxSuffix] + igx-suffix,
.igx-drop-down__header [igxSuffix] + igx-suffix,
.igx-drop-down__item igx-suffix + igx-suffix,
.igx-drop-down__item [igxSuffix] + igx-suffix,
.igx-drop-down__group label igx-suffix + [igxSuffix],
.igx-drop-down__header igx-suffix + [igxSuffix],
.igx-drop-down__group label [igxSuffix] + [igxSuffix],
.igx-drop-down__header [igxSuffix] + [igxSuffix],
.igx-drop-down__item igx-suffix + [igxSuffix],
.igx-drop-down__item [igxSuffix] + [igxSuffix] {
  margin-left: 0.5rem;
}
.igx-drop-down__header--cosy igx-prefix,
.igx-drop-down__header--cosy [igxPrefix], .igx-drop-down__item--cosy igx-prefix,
.igx-drop-down__item--cosy [igxPrefix] {
  margin-right: 1rem;
}
.igx-drop-down__header--cosy igx-suffix + igx-suffix,
.igx-drop-down__header--cosy [igxSuffix] + igx-suffix, .igx-drop-down__item--cosy igx-suffix + igx-suffix,
.igx-drop-down__item--cosy [igxSuffix] + igx-suffix,
.igx-drop-down__header--cosy igx-suffix + [igxSuffix],
.igx-drop-down__header--cosy [igxSuffix] + [igxSuffix],
.igx-drop-down__item--cosy igx-suffix + [igxSuffix],
.igx-drop-down__item--cosy [igxSuffix] + [igxSuffix] {
  margin-left: 0.375rem;
}
.igx-drop-down__header--compact igx-prefix,
.igx-drop-down__header--compact [igxPrefix], .igx-drop-down__item--compact igx-prefix,
.igx-drop-down__item--compact [igxPrefix] {
  margin-right: 0.75rem;
}
.igx-drop-down__header--compact igx-suffix + igx-suffix,
.igx-drop-down__header--compact [igxSuffix] + igx-suffix, .igx-drop-down__item--compact igx-suffix + igx-suffix,
.igx-drop-down__item--compact [igxSuffix] + igx-suffix,
.igx-drop-down__header--compact igx-suffix + [igxSuffix],
.igx-drop-down__header--compact [igxSuffix] + [igxSuffix],
.igx-drop-down__item--compact igx-suffix + [igxSuffix],
.igx-drop-down__item--compact [igxSuffix] + [igxSuffix] {
  margin-left: 0.25rem;
}
.igx-drop-down__group label, .igx-drop-down__header {
  color: var(--header-text-color);
  pointer-events: none;
  padding: 0 1rem;
}
.igx-drop-down__header--cosy {
  height: 2rem;
  padding: 0 0.75rem;
}
.igx-drop-down__header--compact {
  height: 1.75rem;
  padding: 0 0.5rem;
}
.igx-drop-down__group {
  pointer-events: auto;
}
.igx-drop-down__group .igx-drop-down__item {
  text-indent: 0 1.5rem;
}
.igx-drop-down__item--focused {
  background: var(--focused-item-background);
  color: var(--focused-item-text-color);
}
.igx-drop-down__item--focused:hover {
  color: var(--focused-item-text-color);
  background: var(--focused-item-background);
}
.igx-drop-down__item--selected {
  background: var(--selected-item-background);
  color: var(--selected-item-text-color);
}
.igx-drop-down__item--selected:hover {
  background: var(--selected-hover-item-background);
  color: var(--selected-hover-item-text-color);
}
.igx-drop-down__item--selected.igx-drop-down__item--focused {
  background: var(--selected-focus-item-background);
  color: var(--selected-focus-item-text-color);
}
.igx-drop-down__item--disabled, .igx-drop-down__group--disabled {
  background: var(--disabled-item-background);
  color: var(--disabled-item-text-color);
  cursor: default;
  pointer-events: none;
}
.igx-drop-down__item--disabled:hover, .igx-drop-down__group--disabled:hover {
  background: var(--disabled-item-background);
}
igx-expansion-panel {
  --border-radius: var(--igx-expansion-panel-border-radius, 0px);
  --header-background: var(--igx-expansion-panel-header-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --body-background: var(--igx-expansion-panel-body-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --header-focus-background: var(--igx-expansion-panel-header-focus-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --header-title-color: var(--igx-expansion-panel-header-title-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --header-description-color: var(--igx-expansion-panel-header-description-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --header-icon-color: var(--igx-expansion-panel-header-icon-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --body-color: var(--igx-expansion-panel-body-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --disabled-color: var(--igx-expansion-panel-disabled-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --expanded-margin: var(--igx-expansion-panel-expanded-margin, 0.5rem);
}
.igx-expansion-panel {
  display: flex;
  flex-direction: column;
  border-radius: var(--border-radius);
  overflow: hidden;
}
.igx-expansion-panel__header-title {
  color: var(--header-title-color);
  margin-right: 1rem;
}
.igx-expansion-panel__header-description {
  color: var(--header-description-color);
}
.igx-expansion-panel__header-title,
.igx-expansion-panel__header-description {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.igx-accordion .igx-expansion-panel__header-title {
  display: -webkit-inline-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: initial;
  word-wrap: break-word;
}
.igx-accordion igx-expansion-panel[aria-expanded=true] {
  margin: var(--expanded-margin) 0;
}
.igx-accordion igx-expansion-panel[aria-expanded=true]:first-of-type {
  margin-top: 0;
}
.igx-accordion igx-expansion-panel[aria-expanded=true]:last-of-type {
  margin-bottom: 0;
}
.igx-expansion-panel__header-inner {
  display: flex;
  align-items: center;
  padding: 1em;
  cursor: pointer;
  background: var(--header-background);
}
.igx-expansion-panel__header-inner:focus, .igx-expansion-panel__header-inner:active {
  background: var(--header-focus-background);
  outline: transparent;
}
.igx-expansion-panel__title-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1 0 0%;
  overflow: hidden;
}
.igx-expansion-panel__header-icon--end {
  order: 1;
  margin-left: 1rem;
}
.igx-expansion-panel__header-icon--start {
  order: -1;
  margin-right: 1rem;
}
.igx-expansion-panel__header-icon--none {
  display: none;
}
.igx-expansion-panel__header-icon--end,
.igx-expansion-panel__header-icon--start {
  display: flex;
  align-content: center;
  justify-content: center;
  -webkit-user-select: none;
          user-select: none;
  color: var(--header-icon-color);
}
.igx-expansion-panel__header-icon--end igx-icon,
.igx-expansion-panel__header-icon--start igx-icon {
  color: var(--header-icon-color);
}
.igx-expansion-panel__body {
  color: var(--body-color);
  background: var(--body-background);
  overflow: hidden;
}
.igx-expansion-panel--disabled {
  pointer-events: none;
}
.igx-expansion-panel--disabled .igx-expansion-panel__header-title,
.igx-expansion-panel--disabled .igx-expansion-panel__header-description {
  color: var(--disabled-color);
}
.igx-expansion-panel--disabled .igx-expansion-panel__header-icon--start igx-icon,
.igx-expansion-panel--disabled .igx-expansion-panel__header-icon--end igx-icon {
  color: var(--disabled-color);
}
igx-grid, igx-hierarchical-grid, igx-tree-grid, igx-advanced-filtering-dialog, igx-grid-excel-style-filtering, .igx-excel-filter__secondary {
  --drop-area-border-radius: var(--igx-grid-drop-area-border-radius, 16px);
  --grouparea-color: var(--igx-grid-grouparea-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --grouparea-background: var(--igx-grid-grouparea-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --drop-area-text-color: var(--igx-grid-drop-area-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --drop-area-icon-color: var(--igx-grid-drop-area-icon-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --drop-area-background: var(--igx-grid-drop-area-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --drop-area-on-drop-background: var(--igx-grid-drop-area-on-drop-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --header-background: var(--igx-grid-header-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --header-text-color: var(--igx-grid-header-text-color, hsla(var(--igx-grays-800), 0.7));
  --header-selected-background: var(--igx-grid-header-selected-background, hsla(var(--igx-secondary-100), var(--igx-secondary-a)));
  --header-selected-text-color: var(--igx-grid-header-selected-text-color, var(--igx-secondary-100-contrast));
  --sortable-header-icon-hover-color: var(--igx-grid-sortable-header-icon-hover-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --sorted-header-icon-color: var(--igx-grid-sorted-header-icon-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --header-border-width: var(--igx-grid-header-border-width, 1px);
  --header-border-style: var(--igx-grid-header-border-style, solid);
  --header-border-color: var(--igx-grid-header-border-color, hsla(var(--igx-grays-400), 0.38));
  --ghost-header-background: var(--igx-grid-ghost-header-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --ghost-header-text-color: var(--igx-grid-ghost-header-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --ghost-header-icon-color: var(--igx-grid-ghost-header-icon-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --filtering-background-and: var(--igx-grid-filtering-background-and, hsla(var(--igx-primary-300), var(--igx-primary-a)));
  --filtering-background-or: var(--igx-grid-filtering-background-or, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --filtering-background-and--focus: var(--igx-grid-filtering-background-and--focus, hsla(var(--igx-primary-700), var(--igx-primary-a)));
  --filtering-background-or--focus: var(--igx-grid-filtering-background-or--focus, hsla(var(--igx-secondary-700), var(--igx-secondary-a)));
  --grid-border-color: var(--igx-grid-grid-border-color, transparent);
  --content-background: var(--igx-grid-content-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --content-text-color: var(--igx-grid-content-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --row-odd-background: var(--igx-grid-row-odd-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --row-even-background: var(--igx-grid-row-even-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --row-odd-text-color: var(--igx-grid-row-odd-text-color, inherit);
  --row-even-text-color: var(--igx-grid-row-even-text-color, inherit);
  --row-selected-background: var(--igx-grid-row-selected-background, hsla(var(--igx-secondary-50), var(--igx-secondary-a)));
  --tree-selected-filtered-row-text-color: var(--igx-grid-tree-selected-filtered-row-text-color, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --row-selected-text-color: var(--igx-grid-row-selected-text-color, var(--igx-secondary-50-contrast));
  --cell-selected-within-background: var(--igx-grid-cell-selected-within-background, hsla(var(--igx-secondary-200), var(--igx-secondary-a)));
  --cell-selected-within-text-color: var(--igx-grid-cell-selected-within-text-color, var(--igx-secondary-200-contrast));
  --row-selected-hover-background: var(--igx-grid-row-selected-hover-background, hsla(var(--igx-secondary-100), var(--igx-secondary-a)));
  --row-selected-hover-text-color: var(--igx-grid-row-selected-hover-text-color, var(--igx-secondary-100-contrast));
  --row-hover-background: var(--igx-grid-row-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --row-hover-text-color: var(--igx-grid-row-hover-text-color, var(--igx-grays-200-contrast));
  --row-border-color: var(--igx-grid-row-border-color, hsla(var(--igx-grays-300), 0.38));
  --pinned-border-width: var(--igx-grid-pinned-border-width, 2px);
  --pinned-border-style: var(--igx-grid-pinned-border-style, solid);
  --pinned-border-color: var(--igx-grid-pinned-border-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --cell-active-border-color: var(--igx-grid-cell-active-border-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --cell-selected-background: var(--igx-grid-cell-selected-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --tree-selected-filtered-cell-text-color: var(--igx-grid-tree-selected-filtered-cell-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --cell-selected-text-color: var(--igx-grid-cell-selected-text-color, var(--igx-grays-200-contrast));
  --cell-editing-background: var(--igx-grid-cell-editing-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --edit-mode-color: var(--igx-grid-edit-mode-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --edited-row-indicator: var(--igx-grid-edited-row-indicator, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --cell-new-color: var(--igx-grid-cell-new-color, inherit);
  --cell-edited-value-color: var(--igx-grid-cell-edited-value-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --cell-disabled-color: var(--igx-grid-cell-disabled-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --resize-line-color: var(--igx-grid-resize-line-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --drop-indicator-color: var(--igx-grid-drop-indicator-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --group-label-column-name-text: var(--igx-grid-group-label-column-name-text, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --group-label-icon: var(--igx-grid-group-label-icon, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --group-label-text: var(--igx-grid-group-label-text, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --expand-all-icon-color: var(--igx-grid-expand-all-icon-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --expand-all-icon-hover-color: var(--igx-grid-expand-all-icon-hover-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --expand-icon-color: var(--igx-grid-expand-icon-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --expand-icon-hover-color: var(--igx-grid-expand-icon-hover-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --active-expand-icon-color: var(--igx-grid-active-expand-icon-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --active-expand-icon-hover-color: var(--igx-grid-active-expand-icon-hover-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --group-count-background: var(--igx-grid-group-count-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --group-count-text-color: var(--igx-grid-group-count-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --group-row-background: var(--igx-grid-group-row-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --group-row-selected-background: var(--igx-grid-group-row-selected-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --filtering-header-background: var(--igx-grid-filtering-header-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --filtering-header-text-color: var(--igx-grid-filtering-header-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --filtering-row-background: var(--igx-grid-filtering-row-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --filtering-row-text-color: var(--igx-grid-filtering-row-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --tree-filtered-text-color: var(--igx-grid-tree-filtered-text-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --body-summaries-background: var(--igx-grid-body-summaries-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --body-summaries-text-color: var(--igx-grid-body-summaries-text-color, var(--igx-grays-100-contrast));
  --root-summaries-background: var(--igx-grid-root-summaries-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --root-summaries-text-color: var(--igx-grid-root-summaries-text-color, var(--igx-grays-300-contrast));
  --row-highlight: var(--igx-grid-row-highlight, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --row-ghost-background: var(--igx-grid-row-ghost-background, hsla(var(--igx-primary-50), var(--igx-primary-a)));
  --row-drag-color: var(--igx-grid-row-drag-color, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --grid-shadow: var(--igx-grid-grid-shadow, var(--igx-elevation-2));
  --drag-shadow: var(--igx-grid-drag-shadow, var(--igx-elevation-5));
}
@keyframes scale-in-ver-center {
  0% {
    transform: scaleY(0);
    opacity: 1;
  }
  100% {
    transform: scaleY(1);
    opacity: 1;
  }
}
.igx-grid__tbody-content:focus, .igx-grid__tfoot:focus, .igx-grid-thead__wrapper:focus {
  outline: 0;
}
.igx-grid, .igx-grid--cosy, .igx-grid--compact {
  position: relative;
  display: grid;
  grid-template-rows: auto auto auto 1fr auto auto;
  grid-template-columns: 1fr;
  overflow: hidden;
  box-shadow: var(--grid-shadow);
  outline-style: none;
  z-index: 1;
}
.igx-grid .igx-checkbox, .igx-grid--cosy .igx-checkbox, .igx-grid--compact .igx-checkbox {
  min-width: 1.25rem;
}
.igx-grid__caption {
  display: flex;
  align-items: center;
  font-size: 1.25rem;
  line-height: 2rem;
  padding: 1rem 1.5rem;
  grid-row: 1;
}
.igx-grid-thead__wrapper,
.igx-grid__tfoot {
  position: relative;
  display: flex;
  background: var(--header-background);
  color: var(--header-text-color);
  overflow: hidden;
  outline-style: none;
}
.igx-grid-thead__wrapper .igx-grid__tr,
.igx-grid__tfoot .igx-grid__tr {
  position: relative;
  background: inherit;
  color: inherit;
  z-index: 2;
}
.igx-grid-thead__wrapper .igx-grid__tr:hover,
.igx-grid__tfoot .igx-grid__tr:hover {
  background: inherit;
  color: inherit;
}
.igx-grid-thead__wrapper > [aria-activedescendant],
.igx-grid__tfoot > [aria-activedescendant] {
  outline-style: none;
}
.igx-grid-thead__wrapper {
  border-bottom: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  z-index: 2;
}
.igx-grid-thead__wrapper .igx-grid__cbx-selection--push {
  align-items: flex-start;
  padding-top: 0.9375rem;
}
.igx-grid-thead__wrapper .igx-grid__tr {
  border-bottom: none;
}
.igx-grid-thead {
  grid-row: 3;
  display: flex;
  overflow: hidden;
}
.igx-grid-thead .igx-grid__drag-indicator {
  cursor: default;
}
.igx-grid-thead .igx-grid__tr--mrl .igx-grid__hierarchical-expander--header,
.igx-grid-thead .igx-grid__tr--mrl .igx-grid__header-indentation,
.igx-grid-thead .igx-grid__tr--mrl .igx-grid__row-indentation,
.igx-grid-thead .igx-grid__tr--mrl .igx-grid__cbx-selection {
  border-bottom: var(--header-border-width) var(--header-border-style) var(--header-border-color);
}
.igx-grid-thead--cosy .igx-grid-thead__wrapper .igx-grid--cosy .igx-grid__cbx-selection--push, .igx-grid--cosy .igx-grid-thead--cosy .igx-grid-thead__wrapper .igx-grid__cbx-selection--push {
  align-items: flex-start;
  padding-top: 0.625rem;
}
.igx-grid-thead--compact .igx-grid-thead__wrapper .igx-grid--compact .igx-grid__cbx-selection--push, .igx-grid--compact .igx-grid-thead--compact .igx-grid-thead__wrapper .igx-grid__cbx-selection--push {
  align-items: flex-start;
  padding-top: 0.375rem;
}
.igx-grid-thead__title {
  flex-basis: auto !important;
  align-items: center !important;
  border-bottom: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  height: 3.125rem;
}
.igx-grid-thead__title--pinned-last {
  border-right: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color) !important;
}
.igx-grid-thead--cosy .igx-grid-thead__title {
  height: 2.5rem;
  padding: 0 1rem;
}
.igx-grid-thead--compact .igx-grid-thead__title {
  height: 2rem;
  padding: 0 0.75rem;
}
.igx-grid-thead__group {
  display: flex;
  flex-flow: row nowrap;
}
/* We set those with position relative
so that the drop indicators be scoped
to their respective group. The item
being the topmost element, while the
subgroup encapsulates children of each
thead item and group.
*/
.igx-grid-thead__item {
  display: flex;
  flex-flow: column nowrap;
}
.igx-grid-thead__item .igx-grid-thead__group {
  flex: 1 1 auto;
}
.igx-grid-thead__item .igx-grid-thead__title, .igx-grid-thead__item .igx-grid-th {
  flex: 1 1 auto;
}
.igx-grid-thead__item .igx-grid-thead__title {
  flex: 0 0 auto;
}
.igx-grid-thead__item,
.igx-grid-thead__subgroup {
  position: relative;
}
.igx-grid__tfoot {
  grid-row: 5;
  border-top: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  z-index: 10001;
}
.igx-grid__footer {
  grid-row: 7;
}
.igx-grid-thead__wrapper igx-display-container {
  width: 100%;
  overflow: visible;
}
.igx-grid__tr igx-display-container, .igx-grid__summaries igx-display-container, .igx-grid__summaries--body igx-display-container {
  width: 100%;
  overflow: visible;
}
.igx-grid__mrl-block {
  display: grid;
  background: inherit;
  position: relative;
}
.igx-grid__mrl-block .igx-grid-thead__item {
  display: flex;
}
.igx-grid__mrl-block .igx-grid-thead__title, .igx-grid__mrl-block .igx-grid-th {
  align-items: center;
  flex-grow: 1;
  border-bottom: var(--header-border-width) var(--header-border-style) var(--header-border-color);
}
.igx-grid__mrl-block .igx-grid__td, .igx-grid__mrl-block .igx-grid-thead__title, .igx-grid__mrl-block .igx-grid-th {
  border-right: 1px solid var(--row-border-color);
  border-bottom: 1px solid var(--row-border-color);
}
.igx-grid__tr--mrl.igx-grid__tr {
  border-bottom-color: transparent;
}
.igx-grid__tr--mrl .igx-grid__cbx-selection,
.igx-grid__tr--mrl .igx-grid__row-indentation,
.igx-grid__tr--mrl .igx-grid__drag-indicator {
  border-bottom: 1px solid var(--row-border-color);
}
.igx-grid__tbody-content {
  position: relative;
  background: var(--content-background);
  color: var(--content-text-color);
  overflow: hidden;
  z-index: 1;
  outline-style: none;
}
.igx-grid__tbody {
  position: relative;
  display: flex;
  grid-row: 4;
  overflow: hidden;
}
.igx-grid__tbody-message {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  color: var(--content-text-color);
  flex-direction: column;
  padding: 1.5rem;
}
.igx-grid__loading {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 100px;
}
.igx-grid__loading > .igx-circular-bar {
  width: 3.125rem;
  height: 3.125rem;
}
.igx-grid__scroll {
  grid-row: 6;
  display: flex;
  flex-flow: row nowrap;
  width: 100%;
  background: var(--header-background);
  z-index: 10001;
}
.igx-grid-thead__thumb {
  background: var(--header-background);
  border-left: 0.0625rem solid var(--header-border-color);
}
.igx-grid__tfoot-thumb {
  position: absolute;
  top: 0;
  right: 0;
  background: var(--header-background);
  border-left: 0.0625rem solid var(--header-border-color);
}
.igx-grid__tbody-scrollbar {
  background: var(--content-background);
  border-left: 0.0625rem solid var(--row-border-color);
  position: relative;
}
.igx-grid__tbody-scrollbar-start {
  background: var(--header-background);
}
.igx-grid__tbody-scrollbar-main {
  position: relative;
}
.igx-grid__tbody-scrollbar-end {
  background: var(--header-background);
}
.igx-grid__scroll-start {
  background: var(--header-background);
}
.igx-grid__scroll-main igx-display-container {
  height: 0;
}
.igx-grid__scroll-main igx-horizontal-virtual-helper {
  height: 100%;
}
.igx-grid__tr {
  display: flex;
  background: var(--content-background);
  border-bottom: 1px solid var(--row-border-color);
  outline-style: none;
  position: relative;
  background-clip: content-box !important;
}
.igx-grid__tr:hover {
  background: var(--row-hover-background);
  color: var(--row-hover-text-color);
}
.igx-grid__tr:hover .igx-grid__td--column-selected {
  color: var(--row-selected-hover-text-color);
  background: var(--row-selected-hover-background);
}
.igx-grid__tr:hover .igx-grid__td--selected.igx-grid__td--column-selected {
  color: var(--cell-selected-within-text-color);
  background: var(--cell-selected-within-background);
}
.igx-grid__tr.igx-grid__tr--ghost {
  background: var(--row-ghost-background);
  color: var(--row-drag-color);
  z-index: 1;
}
.igx-grid__tr.igx-grid__tr--ghost,
.igx-grid__tr.igx-grid__tr--ghost igx-grid-row {
  --row-ghost-background: var(--igx-grid-row-row-ghost-background, hsla(var(--igx-primary-50), var(--igx-primary-a)));
  --row-drag-color: var(--igx-grid-row-row-drag-color, );
}
.igx-grid__drag-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1.5rem;
  flex: 1 0 auto;
  min-width: calc(1.5rem + 1.5rem);
  background: inherit;
  z-index: 4;
  cursor: move;
  border-right: 1px solid transparent;
  background-clip: border-box;
}
.igx-grid__drag-indicator igx-icon {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1.5rem;
}
.igx-grid--cosy .igx-grid__drag-indicator {
  padding: 0 1rem;
  min-width: calc(1.5rem + 1rem);
}
.igx-grid--compact .igx-grid__drag-indicator {
  padding: 0 0.75rem;
  min-width: calc(1.5rem + 0.75rem);
}
.igx-grid__drag-indicator--header {
  border-right: var(--header-border-width) var(--header-border-style) var(--header-border-color);
}
.igx-grid__drag-indicator--off {
  color: var(--row-drag-color);
}
.igx-grid__tr--drag {
  opacity: 0.5;
}
.igx-grid__tr--odd {
  background: var(--row-odd-background);
  color: var(--row-odd-text-color);
}
.igx-grid__tr--even {
  background: var(--row-even-background);
  color: var(--row-even-text-color);
}
.igx-grid__tr--expanded {
  border-bottom: none;
}
.igx-grid__tr--pinned {
  position: relative;
  background: inherit;
  z-index: 10000;
}
.igx-grid__tr--pinned .igx-grid__hierarchical-expander--empty {
  border-right: 0.0625rem solid var(--header-border-color);
}
.igx-grid__tr--pinned-top {
  border-bottom: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color) !important;
}
.igx-grid__tr--pinned-bottom {
  border-top: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color) !important;
  position: absolute;
  bottom: 0;
}
.igx-grid__td--bool {
  justify-content: center;
}
.igx-grid__td--bool igx-icon {
  height: 1.125rem;
  width: 1.125rem;
  font-size: 1.125rem;
}
.igx-grid__td--bool .igx-icon--error {
  color: hsla(var(--igx-grays-500), var(--igx-grays-a));
}
.igx-grid__td--bool-true .igx-icon--success {
  color: hsla(var(--igx-grays-700), var(--igx-grays-a));
}
.igx-grid__tr--edit {
  border-bottom: 1px solid var(--edit-mode-color);
  position: relative;
}
.igx-grid__tr--edit::after {
  content: "";
  position: absolute;
  height: 0.0625rem;
  width: 100%;
  top: -0.0625rem;
  left: 0;
  background: var(--edit-mode-color);
}
.igx-grid__tr--edit.igx-grid__tr {
  border-bottom: 1px solid var(--edit-mode-color);
}
.igx-grid__tr--edit .igx-grid__td--editing {
  border: none;
}
.igx-grid__tr--edit .igx-grid__td--editing .igx-input-group--focused .igx-input-group__bundle, .igx-input-group--focused .igx-grid__tr--edit .igx-grid__td--editing .igx-input-group__bundle {
  caret-color: var(--edit-mode-color) !important;
}
.igx-grid__tr--edit .igx-grid__td--editing .igx-input-group__border {
  background: var(--edit-mode-color) !important;
}
.igx-grid__tr--edit [aria-readonly=true] {
  color: var(--cell-disabled-color);
}
.igx-grid__tr--edit [aria-readonly=true] igx-icon {
  color: var(--cell-disabled-color);
}
.igx-grid__tr--inner {
  display: flex;
  background: inherit;
}
.igx-grid__tr--add-animate {
  animation: scale-in-ver-center 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-grid__tr--mrl.igx-grid__tr--edit:first-of-type::after {
  top: 0;
  z-index: 5;
}
.igx-grid__tr--edited::before {
  content: "";
  position: absolute;
  width: 0.125rem;
  height: 100%;
  z-index: 10000;
  background: var(--edited-row-indicator);
}
.igx-grid__tr--group {
  position: relative;
  background: var(--header-background) !important;
}
.igx-grid__tr--filtered .igx-grid__td-text {
  color: var(--tree-filtered-text-color);
}
.igx-grid__tr--filtered .igx-grid__tree-grouping-indicator {
  color: var(--tree-filtered-text-color);
}
.igx-grid__tr--filtered .igx-grid__tree-grouping-indicator:hover {
  color: var(--tree-filtered-text-color);
}
.igx-grid__tr--filtered .igx-grid__td--selected .igx-grid__td-text {
  color: var(--tree-selected-filtered-cell-text-color);
}
.igx-grid__tr--filtered .igx-grid__td--selected .igx-grid__tree-grouping-indicator {
  color: var(--tree-selected-filtered-cell-text-color);
}
.igx-grid__tr--filtered .igx-grid__td--selected .igx-grid__tree-grouping-indicator:hover {
  color: var(--tree-selected-filtered-cell-text-color);
}
.igx-grid__tr--selected.igx-grid__tr--filtered .igx-grid__td-text {
  color: var(--tree-selected-filtered-row-text-color);
}
.igx-grid__tr--selected.igx-grid__tr--filtered .igx-grid__tree-grouping-indicator {
  color: var(--tree-selected-filtered-row-text-color);
}
.igx-grid__tr--selected.igx-grid__tr--filtered .igx-grid__tree-grouping-indicator:hover {
  color: var(--tree-selected-filtered-row-text-color);
}
.igx-grid__tr--selected.igx-grid__tr--filtered .igx-grid__td--selected .igx-grid__td-text {
  color: var(--tree-selected-filtered-cell-text-color);
}
.igx-grid__tr--selected.igx-grid__tr--filtered .igx-grid__td--selected .igx-grid__tree-grouping-indicator {
  color: var(--tree-selected-filtered-cell-text-color);
}
.igx-grid__tr--selected.igx-grid__tr--filtered .igx-grid__td--selected .igx-grid__tree-grouping-indicator:hover {
  color: var(--tree-selected-filtered-cell-text-color);
}
.igx-grid__tree-grouping-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-user-select: none;
          user-select: none;
  outline-style: none;
  margin-right: 0.5rem;
  cursor: pointer;
  color: var(--expand-icon-color);
}
.igx-grid__tree-grouping-indicator:hover {
  color: var(--expand-icon-hover-color);
}
.igx-grid__tree-loading-indicator {
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.5rem;
}
.igx-grid__tree-loading-indicator .igx-circular-bar__outer {
  stroke: var(--expand-icon-color);
}
.igx-grid__tree-loading-indicator > .igx-circular-bar {
  width: 1.5rem;
  height: 1.5rem;
}
.igx-grid__td, .igx-grid-thead__title, .igx-grid-th {
  position: relative;
  display: flex;
  flex: 1 1 0%;
  align-items: center;
  outline-style: none;
  padding: 0 1.5rem;
  font-size: 0.8125rem;
  line-height: 1rem;
  color: inherit;
  text-align: left;
  background-clip: border-box !important;
}
.igx-grid__td--tree-cell {
  overflow: hidden;
}
.igx-grid__td-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.igx-grid--cosy .igx-grid__td {
  padding: 0 1rem;
}
.igx-grid--compact .igx-grid__td {
  padding: 0 0.75rem;
}
.igx-grid__td--fw, .igx-grid-th--fw {
  flex-grow: 0;
  outline-style: none;
}
.igx-grid__tr-container--active, .igx-grid__group-row--active, .igx-grid-summary--active, .igx-grid-th--active .igx-grid-th--selected,
.igx-grid-th--active .igx-grid-th--selectable, .igx-grid-th--active, .igx-grid__td--active {
  box-shadow: inset 0 0 0 1px var(--cell-active-border-color);
}
.igx-grid__tr-container--active .igx-grid__filtering-cell, .igx-grid__group-row--active .igx-grid__filtering-cell, .igx-grid-summary--active .igx-grid__filtering-cell, .igx-grid-th--active .igx-grid__filtering-cell, .igx-grid__td--active .igx-grid__filtering-cell, .igx-grid__tr-container--active .igx-grid__filtering-cell--selected, .igx-grid__group-row--active .igx-grid__filtering-cell--selected, .igx-grid-summary--active .igx-grid__filtering-cell--selected, .igx-grid-th--active .igx-grid__filtering-cell--selected, .igx-grid__td--active .igx-grid__filtering-cell--selected,
.igx-grid__tr-container--active .igx-grid-thead__title,
.igx-grid__group-row--active .igx-grid-thead__title,
.igx-grid-summary--active .igx-grid-thead__title,
.igx-grid-th--active .igx-grid-thead__title,
.igx-grid__td--active .igx-grid-thead__title,
.igx-grid__tr-container--active .igx-grid-th,
.igx-grid__group-row--active .igx-grid-th,
.igx-grid-summary--active .igx-grid-th,
.igx-grid-th--active .igx-grid-th,
.igx-grid__td--active .igx-grid-th {
  border-right-color: var(--cell-active-border-color);
  border-bottom-color: var(--cell-active-border-color);
}
.igx-grid__td--pinned.igx-grid__td--selected,
.igx-grid__td--selected {
  color: var(--cell-selected-text-color);
  background: var(--cell-selected-background);
}
.igx-grid__td--selected .igx-grid__tree-grouping-indicator:hover {
  color: var(--cell-selected-text-color);
}
.igx-grid__tr--selected {
  color: var(--row-selected-text-color);
  background: var(--row-selected-background);
}
.igx-grid__tr--selected .igx-grid__td--selected {
  color: var(--cell-selected-within-text-color);
  background: var(--cell-selected-within-background);
}
.igx-grid__tr--selected:hover {
  background: var(--row-selected-hover-background);
  color: var(--row-selected-hover-text-color);
}
.igx-grid__tr--selected:hover .igx-grid__td--column-selected {
  color: var(--row-selected-hover-text-color);
  background: var(--row-selected-hover-background);
}
.igx-grid__tr--selected .igx-grid__tree-grouping-indicator {
  color: var(--row-selected-text-color);
}
.igx-grid__tr--selected .igx-grid__tree-grouping-indicator:hover {
  color: var(--row-selected-text-color);
}
.igx-grid__td--column-selected {
  color: var(--row-selected-text-color);
  background: var(--row-selected-background);
}
.igx-grid__td--selected.igx-grid__td--column-selected {
  color: var(--cell-selected-within-text-color);
  background: var(--cell-selected-within-background);
}
.igx-grid__td--new {
  color: var(--cell-new-color);
}
.igx-grid__td--edited .igx-grid__td-text {
  font-style: italic;
  color: var(--cell-edited-value-color);
  padding: 0 1px;
}
.igx-grid__tr--deleted .igx-grid__td-text {
  font-style: italic;
  color: hsla(var(--igx-error-500), var(--igx-error-a));
  text-decoration: line-through;
}
.igx-grid__tr--disabled .igx-grid__td-text {
  color: var(--cell-disabled-color);
}
.igx-grid__td--editing {
  background: var(--cell-editing-background) !important;
  box-shadow: inset 0 0 0 0.125rem var(--edit-mode-color);
  padding: 0 !important;
}
.igx-grid__td--editing igx-input-group,
.igx-grid__td--editing igx-select,
.igx-grid__td--editing igx-date-picker,
.igx-grid__td--editing igx-time-picker {
  width: 100%;
  height: 100%;
}
.igx-grid__td--editing igx-input-group {
  --theme: fluent;
  padding-top: 0 !important;
}
.igx-grid__td--editing .igx-input-group__bundle {
  border: none !important;
}
.igx-grid__td--editing igx-prefix,
.igx-grid__td--editing igx-suffix {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.igx-grid__td--editing igx-date-range-picker {
  height: 100%;
}
.igx-grid__td--editing igx-time-picker [igxLabel] {
  display: none;
}
.igx-grid__td--editing .igx-input-group__bundle {
  height: 100%;
}
.igx-grid__td--editing input {
  margin: 0 auto;
  max-width: 100%;
}
.igx-grid__td--editing .igx-input-group__input, .igx-grid__td--editing .igx-input-group__textarea {
  font-size: 0.8125rem !important;
  line-height: 1rem !important;
}
.igx-grid__td--pinned, .igx-grid__td--pinned-last, .igx-grid__td--pinned-first, .igx-grid-th--pinned {
  position: relative;
  background: inherit;
  z-index: 9999;
}
.igx-grid__td--pinned.igx-grid__td--column-selected {
  color: var(--row-selected-text-color);
  background: var(--row-selected-background);
}
.igx-grid__td--pinned.igx-grid__td--column-selected:hover {
  background: var(--row-selected-hover-background);
  color: var(--row-selected-text-color);
}
.igx-grid__td--pinned-last, .igx-grid-th--pinned-last {
  border-right: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color) !important;
}
.igx-grid__td--pinned-last .igx-grid__filtering-cell, .igx-grid-th--pinned-last .igx-grid__filtering-cell, .igx-grid__td--pinned-last .igx-grid__filtering-cell--selected, .igx-grid-th--pinned-last .igx-grid__filtering-cell--selected,
.igx-grid__td--pinned-last .igx-grid-thead__title,
.igx-grid-th--pinned-last .igx-grid-thead__title,
.igx-grid__td--pinned-last .igx-grid-th,
.igx-grid-th--pinned-last .igx-grid-th {
  border-right: none;
}
.igx-grid__td--pinned-first, .igx-grid-th--pinned-first {
  border-left: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color) !important;
}
.igx-grid__td--row-pinned-first {
  overflow: hidden;
}
.igx-grid__td--pinned-chip {
  margin-right: 0.75rem;
}
.igx-grid--cosy .igx-grid__td--pinned-chip {
  margin-right: 0.5rem;
}
.igx-grid--compact .igx-grid__td--pinned-chip {
  margin-right: 0.25rem;
}
.igx-grid-thead__title, .igx-grid-th {
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: flex-end;
  font-size: 0.75rem;
  font-weight: 600;
  min-width: 0;
  padding: 0 1.5rem;
  border-right: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  outline-style: none;
  overflow: hidden;
  transition: color 250ms ease-in-out;
}
.igx-grid-th--filtering {
  background: var(--filtering-header-background);
  color: var(--filtering-header-text-color);
  z-index: 3;
}
.igx-grid-th--cosy {
  padding: 0 1rem;
  min-height: 2.5rem;
}
.igx-grid-th--compact {
  padding: 0 0.75rem;
  min-height: 2rem;
}
.igx-grid-th__title {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  font-weight: 600;
  min-width: 3ch;
  -webkit-user-select: none;
          user-select: none;
  cursor: initial;
  flex-grow: 1;
  /* hey IE, the text should take most of the space */
  line-height: 4.1666666667;
  transition: color 250ms ease-in-out;
}
.igx-grid-th--cosy .igx-grid-th__title {
  line-height: 3.3333333333;
}
.igx-grid-th--compact .igx-grid-th__title {
  line-height: 2.6666666667;
}
.igx-grid-th__icons {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  -webkit-user-select: none;
          user-select: none;
  min-width: 30px;
  /* sort-icon + filter icon width */
  height: 3.125rem;
  align-self: flex-end;
}
.igx-grid-th__icons:empty {
  min-width: 0;
}
.igx-grid-th__icons .sort-icon {
  position: relative;
  display: flex;
}
.igx-grid-th__icons .sort-icon igx-icon {
  width: 0.9375rem;
  height: 0.9375rem;
  font-size: 0.9375rem;
}
.igx-grid-th__icons .sort-icon::after {
  content: attr(data-sortIndex);
  position: absolute;
  top: -5px;
  right: -1px;
  font-size: 0.625rem;
  text-align: right;
  font-family: sans-serif;
  line-height: 0.625rem;
}
.igx-grid-th__expander {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.5rem;
  cursor: pointer;
}
.igx-grid-th__expander igx-icon {
  color: var(--expand-icon-color);
}
.igx-grid-th__expander:hover igx-icon {
  color: var(--expand-icon-hover-color);
}
.igx-grid-th__group-title {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.igx-grid-th--collapsible {
  justify-content: normal;
}
.igx-grid-th--selectable {
  color: var(--header-selected-text-color);
  background: var(--header-selected-background);
  opacity: 0.7;
}
.igx-grid-th--selectable.igx-grid__drag-ghost-image {
  opacity: 1;
}
.igx-grid-th--selectable .sort-icon {
  color: var(--header-selected-text-color);
}
.igx-grid-th--selectable .sort-icon ::after {
  background: var(--header-selected-background);
}
.igx-grid-th--selectable.igx-grid-th--sorted .sort-icon {
  color: var(--header-selected-text-color);
}
.igx-grid-th--selectable.igx-grid-th--sorted .sort-icon:focus, .igx-grid-th--selectable.igx-grid-th--sorted .sort-icon:hover {
  color: var(--header-selected-text-color);
}
.igx-grid-th--selected {
  color: var(--header-selected-text-color);
  background: var(--header-selected-background);
}
.igx-grid-th--selected .sort-icon::after {
  background: var(--header-selected-background);
}
.igx-grid-th--selected.igx-grid-th--sorted .sort-icon {
  color: var(--header-selected-text-color);
}
.igx-grid-th--selected.igx-grid-th--sorted .sort-icon:focus, .igx-grid-th--selected.igx-grid-th--sorted .sort-icon:hover {
  color: var(--header-selected-text-color);
}
.igx-grid-th--sortable .sort-icon {
  cursor: pointer;
  opacity: 0.7;
}
.igx-grid-th--sortable .sort-icon:hover {
  opacity: 1;
}
.igx-grid-th--sorted .sort-icon {
  opacity: 1;
  color: var(--sorted-header-icon-color);
}
.igx-grid-th--sorted .sort-icon:hover {
  color: var(--sortable-header-icon-hover-color);
}
.igx-grid-th--filtrable .igx-grid-th__title {
  opacity: 0.7;
}
.igx-grid-th--filtrable.igx-grid-th--sortable .sort-icon:hover {
  opacity: 1;
}
.sort-icon {
  opacity: 0;
  transition: all 250ms ease-in-out;
}
.igx-grid-th--cosy .igx-grid-th__icons {
  height: 2.5rem;
}
.igx-grid-th--compact .igx-grid-th__icons {
  height: 2rem;
}
.igx-grid__td--number, .igx-grid-th--number {
  text-align: right;
  justify-content: flex-end;
}
.igx-grid__td--number .igx-grid-th__icons, .igx-grid-th--number .igx-grid-th__icons {
  justify-content: flex-start;
  order: -1;
}
.igx-grid__td--number .igx-grid-th__icons .sort-icon, .igx-grid-th--number .igx-grid-th__icons .sort-icon {
  order: 1;
}
.igx-grid__cbx-selection {
  display: flex;
  justify-content: center;
  align-items: center;
  background: inherit;
  z-index: 4;
  background-clip: border-box;
}
.igx-grid__cbx-padding {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: calc(1.25rem + (1.5rem * 2));
}
.igx-grid--cosy .igx-grid__cbx-padding {
  min-width: calc(1.25rem + (1rem * 2));
}
.igx-grid--compact .igx-grid__cbx-padding {
  min-width: calc(1.25rem + (0.75rem * 2));
}
.igx-grid-th__resize-handle {
  position: absolute;
  width: 4px;
  top: 0;
  right: -2px;
  height: 100%;
  z-index: 2;
}
.igx-grid-th__resize-line {
  position: absolute;
  cursor: col-resize;
  width: 4px;
  background: var(--resize-line-color);
  z-index: 2;
}
.igx-grid-th__resize-line::before, .igx-grid-th__resize-line::after {
  position: absolute;
  content: "";
  height: 100%;
  width: 96px;
}
.igx-grid-th__resize-line::before {
  right: 100%;
}
.igx-grid-th__resize-line::after {
  left: 100%;
}
.igx-grid__summaries, .igx-grid__summaries--body {
  display: flex;
  overflow: hidden;
  background: var(--root-summaries-background);
  outline-style: none;
}
.igx-grid__summaries .igx-grid-summary__result, .igx-grid__summaries--body .igx-grid-summary__result {
  color: var(--root-summaries-text-color);
}
.igx-grid__summaries--body {
  background: var(--body-summaries-background);
  border-bottom: 1px dashed var(--row-border-color);
}
.igx-grid__summaries--body:last-of-type {
  border-bottom: none;
}
.igx-grid__summaries--body .igx-grid-summary__result {
  color: var(--body-summaries-text-color);
}
.igx-grid__summaries-patch {
  background: inherit;
  position: relative;
  z-index: 1;
  border-right: 1px solid var(--header-border-color);
}
.igx-grid-th__drop-indicator-left,
.igx-grid-th__drop-indicator-right {
  position: absolute;
  width: 1px;
  height: 100%;
  top: 0;
  z-index: 1;
}
.igx-grid-th__drop-indicator-left {
  left: -1px;
}
.igx-grid-th__drop-indicator-right {
  right: -1px;
}
.igx-grid-th__drop-indicator--active.igx-grid-th__drop-indicator-left, .igx-grid-th__drop-indicator--active.igx-grid-th__drop-indicator-right {
  border-right: 1px solid var(--drop-indicator-color);
}
.igx-grid-th__drop-indicator--active::after, .igx-grid-th__drop-indicator--active::before {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  left: -3px;
}
.igx-grid-th__drop-indicator--active::before {
  bottom: 0;
  border-width: 0 4px 4px;
  border-color: transparent transparent var(--drop-indicator-color);
}
.igx-grid-th__drop-indicator--active::after {
  top: 0;
  border-width: 4px 4px 0;
  border-color: var(--drop-indicator-color) transparent transparent;
}
.igx-grid__scroll-on-drag-left,
.igx-grid__scroll-on-drag-right {
  position: absolute;
  width: 15px;
  top: 0;
  height: 100%;
  z-index: 25;
}
.igx-grid__scroll-on-drag-left {
  left: 0;
}
.igx-grid__scroll-on-drag-right {
  right: 0;
}
.igx-grid__scroll-on-drag-pinned {
  position: absolute;
  width: 15px;
  height: 100%;
  top: 0;
  z-index: 25;
}
.igx-grid__drag-ghost-image {
  position: absolute;
  display: flex;
  align-items: center;
  background: var(--ghost-header-background);
  color: var(--ghost-header-text-color);
  min-width: 168px;
  max-width: 320px;
  height: 3.125rem;
  min-height: 3.125rem;
  top: -99999px;
  left: -99999px;
  border: none;
  box-shadow: var(--drag-shadow);
  overflow: hidden;
  z-index: 20;
}
.igx-grid__drag-ghost-image .igx-grid-th__title {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  flex: 1 0 0;
  text-align: right;
}
.igx-grid__drag-ghost-image .igx-grid-th__icons {
  display: none;
}
.igx-grid__drag-ghost-image .igx-grid-thead__title {
  border: none;
}
.igx-grid--cosy .igx-grid__drag-ghost-image {
  height: 2.5rem;
  min-height: 2.5rem;
}
.igx-grid--compact .igx-grid__drag-ghost-image {
  height: 2rem;
  min-height: 2rem;
}
.igx-grid__drag-ghost-image-icon {
  color: var(--ghost-header-icon-color);
  margin-right: 0.75rem;
}
.igx-grid__drag-ghost-image-icon-group {
  color: var(--ghost-header-icon-color);
  padding: var(--comfortable);
  padding-right: 0;
  margin-right: 0.5rem;
}
.igx-grid__drag-col-header {
  background: var(--header-background);
}
.igx-grid__drag-col-header .igx-grid-thead__title > *, .igx-grid__drag-col-header .igx-grid-th > * {
  opacity: 0.4;
}
.igx-grid__group-row {
  background: var(--group-row-background);
  display: flex;
  outline-style: none;
  border-bottom: 1px solid var(--row-border-color);
  min-height: 3.125rem;
}
.igx-grid__group-row .igx-grid__drag-indicator {
  cursor: default;
  flex-grow: 0;
}
.igx-grid__group-row--active {
  background: var(--group-row-selected-background);
}
.igx-grid__group-row--active .igx-grid__grouping-indicator {
  color: var(--expand-icon-color);
}
.igx-grid__group-row--active .igx-grid__drag-indicator {
  border: 1px solid var(--cell-active-border-color);
  border-left-width: 0;
  border-right-width: 0;
  box-shadow: inset 1px 0 0 0 var(--cell-active-border-color);
}
.igx-grid__group-row--active:hover {
  background: var(--group-row-selected-background);
}
.igx-grid--cosy .igx-grid__group-row {
  min-height: 2.5rem;
}
.igx-grid--compact .igx-grid__group-row {
  min-height: 2rem;
}
.igx-group-label {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  line-height: 1rem;
}
.igx-group-label > * {
  margin-right: 0.25rem;
}
.igx-group-label > *:last-child {
  margin-right: 0;
}
.igx-group-label__icon {
  -webkit-user-select: none;
          user-select: none;
}
.igx-group-label__icon igx-icon {
  color: var(--group-label-icon);
  width: 1rem;
  height: 1rem;
  font-size: 1rem;
}
.igx-group-label__column-name {
  color: var(--group-label-column-name-text);
  font-weight: 600;
  font-size: 12px;
}
.igx-group-label__count-badge > div {
  background: var(--group-count-background);
  color: var(--group-count-text-color);
  font-size: 0.75rem;
}
.igx-group-label__text {
  font-size: 0.8125rem;
  color: var(--group-label-text);
}
[dir=rtl] .igx-grid__group-content {
  padding-left: 1.5rem;
}
[dir=rtl] .igx-grid--cosy .igx-grid__group-content, .igx-grid--cosy [dir=rtl] .igx-grid__group-content {
  padding-left: 1rem;
}
[dir=rtl] .igx-grid--compact .igx-grid__group-content, .igx-grid--compact [dir=rtl] .igx-grid__group-content {
  padding-left: 0.75rem;
}
[dir=rtl] .igx-group-label > * {
  margin-left: 0.25rem;
}
[dir=rtl] .igx-group-label > *:last-child {
  margin-left: 0;
}
.igx-grid__group-content {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex: 1 1 auto;
  padding-left: 1.5rem;
  min-height: 3.125rem;
}
.igx-grid__group-content:focus {
  outline: transparent;
}
.igx-grid--cosy .igx-grid__group-content {
  padding-left: 1rem;
  min-height: 2.5rem;
}
.igx-grid--compact .igx-grid__group-content {
  padding-left: 0.75rem;
  min-height: 2rem;
}
.igx-grid__row-indentation {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  border-right: 1px solid var(--header-border-color);
  background: inherit;
  z-index: 1;
  background-clip: border-box;
}
.igx-grid__row-indentation::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 0.0625rem;
  bottom: -1px;
  left: 0;
  background: transparent;
}
.igx-grid__row-indentation .igx-button--icon {
  width: 1.75rem;
  height: 1.75rem;
  color: var(--expand-all-icon-color);
}
.igx-grid__row-indentation:focus .igx-button--icon, .igx-grid__row-indentation:hover .igx-button--icon {
  color: var(--expand-all-icon-hover-color);
}
.igx-grid--cosy .igx-grid__row-indentation {
  padding-left: 1rem;
  padding-right: 1rem;
}
.igx-grid--compact .igx-grid__row-indentation {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.igx-grid-grouparea {
  grid-row: 2;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  border-bottom: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  background: var(--grouparea-background);
  color: var(--grouparea-color);
  min-height: 3.5625rem;
  padding: 0 1.5rem;
  z-index: 2;
  height: 100%;
  overflow: hidden;
}
.igx-grid-grouparea:focus {
  outline-style: none;
}
.igx-grid-grouparea .igx-chip {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.igx-grid-grouparea__connector {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0 0.25rem;
}
.igx-grid-grouparea__connector igx-icon {
  width: 16px;
  height: 16px;
  font-size: 16px;
}
.igx-grid-grouparea--cosy {
  min-height: 3.0625rem;
  padding: 0 1rem;
}
.igx-grid-grouparea--cosy .igx-chip {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.igx-grid-grouparea--compact {
  min-height: 2.5625rem;
  padding: 0 0.75rem;
}
.igx-grid-grouparea--compact .igx-chip {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.igx-drop-area, .igx-drop-area--compact, .igx-drop-area--cosy {
  min-width: 5rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 2rem;
  border-radius: var(--drop-area-border-radius);
  padding: 0 1.5rem;
  flex: 1 0 0%;
  background: var(--drop-area-background);
}
.igx-drop-area .igx-drop-area__icon, .igx-drop-area--compact .igx-drop-area__icon, .igx-drop-area--cosy .igx-drop-area__icon {
  color: var(--drop-area-icon-color);
  width: 1rem;
  height: 1rem;
  font-size: 1rem;
  margin-right: 0.5rem;
}
.igx-drop-area--hover {
  background: var(--drop-area-on-drop-background);
}
.igx-drop-area--compact {
  height: 1.5rem;
  border-radius: var(--drop-area-border-radius);
  padding: 0 1rem;
}
.igx-drop-area--cosy {
  height: 1.5rem;
  border-radius: var(--drop-area-border-radius);
  padding: 0 0.75rem;
}
.igx-drop-area__text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: var(--drop-area-text-color);
  font-size: 0.8125rem;
}
.igx-grid__grouping-indicator {
  position: relative;
  display: flex;
  -webkit-user-select: none;
          user-select: none;
  justify-content: center;
  align-items: center;
  z-index: 1;
  cursor: pointer;
  padding-right: 0.75rem;
  margin-left: 1.5rem;
  min-height: 3.125rem;
}
.igx-grid__grouping-indicator igx-icon {
  color: var(--expand-icon-color);
  width: 1.5rem;
}
.igx-grid__grouping-indicator:hover, .igx-grid__grouping-indicator:focus {
  outline-style: none;
}
.igx-grid__grouping-indicator:hover igx-icon, .igx-grid__grouping-indicator:focus igx-icon {
  color: var(--expand-icon-hover-color);
}
.igx-grid--cosy .igx-grid__grouping-indicator {
  min-height: 2.5rem;
  margin-left: 1rem;
}
.igx-grid--compact .igx-grid__grouping-indicator {
  min-height: 2rem;
  margin-left: 0.75rem;
}
.igx-grid__header-indentation {
  position: relative;
  padding-right: 1.5rem;
  border-right: 1px solid var(--header-border-color);
  background: var(--header-background);
  z-index: 4;
}
.igx-grid--cosy .igx-grid__header-indentation {
  padding-right: 1rem;
}
.igx-grid--compact .igx-grid__header-indentation {
  padding-right: 0.75rem;
}
.igx-grid__group-expand-btn {
  position: absolute;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  top: calc(50% - 12px);
  left: 1.5rem;
}
.igx-grid__group-expand-btn:hover {
  color: var(--expand-icon-hover-color);
}
.igx-grid__group-expand-btn.igx-grid__group-expand-btn--push {
  top: 0.8125rem;
}
.igx-grid--cosy .igx-grid__group-expand-btn {
  left: 1rem;
}
.igx-grid--cosy .igx-grid__group-expand-btn.igx-grid__group-expand-btn--push {
  top: 0.5rem;
}
.igx-grid--compact .igx-grid__group-expand-btn {
  left: 0.75rem;
}
.igx-grid--compact .igx-grid__group-expand-btn.igx-grid__group-expand-btn--push {
  top: 0.25rem;
}
.igx-grid__row-indentation--level-1 {
  padding-left: calc(1.5rem + 1.5rem);
}
.igx-grid__group-row--padding-level-1 .igx-grid__grouping-indicator {
  padding-left: 1.5rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-1 {
  padding-left: calc(1rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-1 .igx-grid__grouping-indicator {
  padding-left: 1rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-1 {
  padding-left: calc(0.75rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-1 .igx-grid__grouping-indicator {
  padding-left: 0.75rem;
}
.igx-grid__row-indentation--level-2 {
  padding-left: calc(3rem + 1.5rem);
}
.igx-grid__group-row--padding-level-2 .igx-grid__grouping-indicator {
  padding-left: 3rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-2 {
  padding-left: calc(2rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-2 .igx-grid__grouping-indicator {
  padding-left: 2rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-2 {
  padding-left: calc(1.5rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-2 .igx-grid__grouping-indicator {
  padding-left: 1.5rem;
}
.igx-grid__row-indentation--level-3 {
  padding-left: calc(4.5rem + 1.5rem);
}
.igx-grid__group-row--padding-level-3 .igx-grid__grouping-indicator {
  padding-left: 4.5rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-3 {
  padding-left: calc(3rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-3 .igx-grid__grouping-indicator {
  padding-left: 3rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-3 {
  padding-left: calc(2.25rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-3 .igx-grid__grouping-indicator {
  padding-left: 2.25rem;
}
.igx-grid__row-indentation--level-4 {
  padding-left: calc(6rem + 1.5rem);
}
.igx-grid__group-row--padding-level-4 .igx-grid__grouping-indicator {
  padding-left: 6rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-4 {
  padding-left: calc(4rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-4 .igx-grid__grouping-indicator {
  padding-left: 4rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-4 {
  padding-left: calc(3rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-4 .igx-grid__grouping-indicator {
  padding-left: 3rem;
}
.igx-grid__row-indentation--level-5 {
  padding-left: calc(7.5rem + 1.5rem);
}
.igx-grid__group-row--padding-level-5 .igx-grid__grouping-indicator {
  padding-left: 7.5rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-5 {
  padding-left: calc(5rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-5 .igx-grid__grouping-indicator {
  padding-left: 5rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-5 {
  padding-left: calc(3.75rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-5 .igx-grid__grouping-indicator {
  padding-left: 3.75rem;
}
.igx-grid__row-indentation--level-6 {
  padding-left: calc(9rem + 1.5rem);
}
.igx-grid__group-row--padding-level-6 .igx-grid__grouping-indicator {
  padding-left: 9rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-6 {
  padding-left: calc(6rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-6 .igx-grid__grouping-indicator {
  padding-left: 6rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-6 {
  padding-left: calc(4.5rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-6 .igx-grid__grouping-indicator {
  padding-left: 4.5rem;
}
.igx-grid__row-indentation--level-7 {
  padding-left: calc(10.5rem + 1.5rem);
}
.igx-grid__group-row--padding-level-7 .igx-grid__grouping-indicator {
  padding-left: 10.5rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-7 {
  padding-left: calc(7rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-7 .igx-grid__grouping-indicator {
  padding-left: 7rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-7 {
  padding-left: calc(5.25rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-7 .igx-grid__grouping-indicator {
  padding-left: 5.25rem;
}
.igx-grid__row-indentation--level-8 {
  padding-left: calc(12rem + 1.5rem);
}
.igx-grid__group-row--padding-level-8 .igx-grid__grouping-indicator {
  padding-left: 12rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-8 {
  padding-left: calc(8rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-8 .igx-grid__grouping-indicator {
  padding-left: 8rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-8 {
  padding-left: calc(6rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-8 .igx-grid__grouping-indicator {
  padding-left: 6rem;
}
.igx-grid__row-indentation--level-9 {
  padding-left: calc(13.5rem + 1.5rem);
}
.igx-grid__group-row--padding-level-9 .igx-grid__grouping-indicator {
  padding-left: 13.5rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-9 {
  padding-left: calc(9rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-9 .igx-grid__grouping-indicator {
  padding-left: 9rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-9 {
  padding-left: calc(6.75rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-9 .igx-grid__grouping-indicator {
  padding-left: 6.75rem;
}
.igx-grid__row-indentation--level-10 {
  padding-left: calc(15rem + 1.5rem);
}
.igx-grid__group-row--padding-level-10 .igx-grid__grouping-indicator {
  padding-left: 15rem;
}
.igx-grid--cosy .igx-grid__row-indentation--level-10 {
  padding-left: calc(10rem + 1.5rem);
}
.igx-grid--cosy .igx-grid__group-row--padding-level-10 .igx-grid__grouping-indicator {
  padding-left: 10rem;
}
.igx-grid--compact .igx-grid__row-indentation--level-10 {
  padding-left: calc(7.5rem + 1.5rem);
}
.igx-grid--compact .igx-grid__group-row--padding-level-10 .igx-grid__grouping-indicator {
  padding-left: 7.5rem;
}
.igx-grid__tree-cell--padding-level-1 {
  padding-left: 1.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-1 {
  padding-left: 1rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-1 {
  padding-left: 0.75rem;
}
.igx-grid__tree-cell--padding-level-2 {
  padding-left: 3rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-2 {
  padding-left: 2rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-2 {
  padding-left: 1.5rem;
}
.igx-grid__tree-cell--padding-level-3 {
  padding-left: 4.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-3 {
  padding-left: 3rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-3 {
  padding-left: 2.25rem;
}
.igx-grid__tree-cell--padding-level-4 {
  padding-left: 6rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-4 {
  padding-left: 4rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-4 {
  padding-left: 3rem;
}
.igx-grid__tree-cell--padding-level-5 {
  padding-left: 7.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-5 {
  padding-left: 5rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-5 {
  padding-left: 3.75rem;
}
.igx-grid__tree-cell--padding-level-6 {
  padding-left: 9rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-6 {
  padding-left: 6rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-6 {
  padding-left: 4.5rem;
}
.igx-grid__tree-cell--padding-level-7 {
  padding-left: 10.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-7 {
  padding-left: 7rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-7 {
  padding-left: 5.25rem;
}
.igx-grid__tree-cell--padding-level-8 {
  padding-left: 12rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-8 {
  padding-left: 8rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-8 {
  padding-left: 6rem;
}
.igx-grid__tree-cell--padding-level-9 {
  padding-left: 13.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-9 {
  padding-left: 9rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-9 {
  padding-left: 6.75rem;
}
.igx-grid__tree-cell--padding-level-10 {
  padding-left: 15rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-10 {
  padding-left: 10rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-10 {
  padding-left: 7.5rem;
}
.igx-grid__tree-cell--padding-level-11 {
  padding-left: 16.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-11 {
  padding-left: 11rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-11 {
  padding-left: 8.25rem;
}
.igx-grid__tree-cell--padding-level-12 {
  padding-left: 18rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-12 {
  padding-left: 12rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-12 {
  padding-left: 9rem;
}
.igx-grid__tree-cell--padding-level-13 {
  padding-left: 19.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-13 {
  padding-left: 13rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-13 {
  padding-left: 9.75rem;
}
.igx-grid__tree-cell--padding-level-14 {
  padding-left: 21rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-14 {
  padding-left: 14rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-14 {
  padding-left: 10.5rem;
}
.igx-grid__tree-cell--padding-level-15 {
  padding-left: 22.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-15 {
  padding-left: 15rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-15 {
  padding-left: 11.25rem;
}
.igx-grid__tree-cell--padding-level-16 {
  padding-left: 24rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-16 {
  padding-left: 16rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-16 {
  padding-left: 12rem;
}
.igx-grid__tree-cell--padding-level-17 {
  padding-left: 25.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-17 {
  padding-left: 17rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-17 {
  padding-left: 12.75rem;
}
.igx-grid__tree-cell--padding-level-18 {
  padding-left: 27rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-18 {
  padding-left: 18rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-18 {
  padding-left: 13.5rem;
}
.igx-grid__tree-cell--padding-level-19 {
  padding-left: 28.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-19 {
  padding-left: 19rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-19 {
  padding-left: 14.25rem;
}
.igx-grid__tree-cell--padding-level-20 {
  padding-left: 30rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-20 {
  padding-left: 20rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-20 {
  padding-left: 15rem;
}
.igx-grid__tree-cell--padding-level-21 {
  padding-left: 31.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-21 {
  padding-left: 21rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-21 {
  padding-left: 15.75rem;
}
.igx-grid__tree-cell--padding-level-22 {
  padding-left: 33rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-22 {
  padding-left: 22rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-22 {
  padding-left: 16.5rem;
}
.igx-grid__tree-cell--padding-level-23 {
  padding-left: 34.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-23 {
  padding-left: 23rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-23 {
  padding-left: 17.25rem;
}
.igx-grid__tree-cell--padding-level-24 {
  padding-left: 36rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-24 {
  padding-left: 24rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-24 {
  padding-left: 18rem;
}
.igx-grid__tree-cell--padding-level-25 {
  padding-left: 37.5rem;
}
.igx-grid--cosy .igx-grid__tree-cell--padding-level-25 {
  padding-left: 25rem;
}
.igx-grid--compact .igx-grid__tree-cell--padding-level-25 {
  padding-left: 18.75rem;
}
.igx-grid__outlet {
  z-index: 10002;
  position: fixed;
}
.igx-grid__loading-outlet {
  z-index: 10003;
}
.igx-grid__loading-outlet > .igx-overlay__wrapper--modal {
  background: none;
}
.igx-grid__loading-outlet .igx-circular-bar {
  width: 3.125rem;
  height: 3.125rem;
}
.igx-grid__row-editing-outlet {
  z-index: 10000;
  position: absolute;
}
.igx-grid__row-editing-outlet .igx-overlay__wrapper, .igx-grid__row-editing-outlet .igx-overlay__wrapper--modal, .igx-grid__row-editing-outlet .igx-overlay__wrapper--flex, .igx-grid__row-editing-outlet .igx-overlay__wrapper--flex-container {
  /* Change wrapper position from 'fixed' to 'absolute' so that it is hidden when scrolled below the parent grid body content. */
  position: absolute;
}
.igx-grid__addrow-snackbar {
  position: absolute;
  z-index: 5;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
}
.igx-grid__filtering-cell, .igx-grid__filtering-cell--selected {
  display: flex;
  align-items: center;
  border-right: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  border-top: var(--header-border-width) var(--header-border-style) var(--header-border-color);
  height: 3.125rem;
  padding: 0 1.5rem;
  overflow: hidden;
}
.igx-grid__filtering-cell igx-chips-area, .igx-grid__filtering-cell--selected igx-chips-area {
  transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  flex-wrap: nowrap;
}
.igx-grid__filtering-cell igx-chips-area .igx-filtering-chips__connector, .igx-grid__filtering-cell--selected igx-chips-area .igx-filtering-chips__connector {
  font-size: 0.75rem;
  text-transform: uppercase;
  font-weight: 600;
  margin: 0 0.5rem;
}
.igx-grid__filtering-cell--selected {
  color: var(--header-selected-text-color);
  background: var(--header-selected-background);
}
.igx-grid__filtering-cell-indicator, .igx-grid__filtering-cell-indicator--hidden {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 8px;
  margin-left: 8px;
  cursor: pointer;
  visibility: visible;
}
.igx-grid__filtering-cell-indicator igx-icon, .igx-grid__filtering-cell-indicator--hidden igx-icon {
  width: 18px;
  height: 18px;
  font-size: 18px;
}
.igx-grid__filtering-cell-indicator .igx-badge, .igx-grid__filtering-cell-indicator--hidden .igx-badge {
  /* start of IE vertical alignment fix */
  top: 50%;
  transform: translateY(-50%);
  /* end of IE vertical alignment fix */
  position: absolute;
  width: 14px;
  height: 14px;
  min-width: 14px;
  font-size: 12px;
  text-align: center;
  right: 0;
}
.igx-grid__filtering-cell-indicator--hidden {
  visibility: hidden;
}
.igx-grid__filtering-cell--cosy {
  height: 2.5rem;
  padding: 0 1.5rem;
}
.igx-grid__filtering-cell--compact {
  height: 2rem;
  padding: 0 1.5rem;
}
.igx-grid__filtering-row {
  position: absolute;
  display: flex;
  width: 100%;
  height: 3.125rem;
  padding: 0 1rem;
  align-items: center;
  justify-content: space-between;
  background: var(--filtering-row-background);
  color: var(--filtering-row-text-color);
  left: 0;
  bottom: 0;
  z-index: 3;
}
.igx-grid__filtering-row::after {
  display: block;
  position: absolute;
  content: "";
  background: inherit;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  box-shadow: 0 1px 0 var(--filtering-row-background), 0 4px 10px rgba(0, 0, 0, 0.12);
  z-index: -1;
}
.igx-grid__filtering-row igx-input-group {
  --theme: fluent;
  width: 100%;
  max-width: 12.5rem;
  min-width: 8.75rem;
}
.igx-grid__filtering-row igx-prefix:focus {
  color: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-grid__filtering-row igx-suffix igx-icon {
  outline-style: none;
}
.igx-grid__filtering-row igx-suffix igx-icon:focus {
  color: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-grid__filtering-row igx-suffix igx-icon + igx-icon {
  margin-left: 0.25rem;
}
.igx-grid__filtering-dropdown-items {
  display: flex;
  align-items: center;
}
.igx-grid__filtering-dropdown-text {
  margin-left: 1rem;
}
.igx-grid__filtering-row--cosy {
  height: 2.5rem;
}
.igx-grid__filtering-row--compact {
  height: 2rem;
}
.igx-grid__filtering-row-main {
  display: flex;
  flex: 1;
  overflow: hidden;
  max-width: calc(100% - 176px);
  min-width: 3.5rem;
}
.igx-grid__filtering-row-main igx-chips-area {
  transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  flex-wrap: nowrap;
  margin: 0 0.5rem;
}
.igx-grid__filtering-row-main igx-chip {
  margin: 0 0.25rem;
}
.igx-grid__filtering-row-main [igxButton] igx-icon {
  position: absolute;
  left: 0.75rem;
  /* IE fix for vertical alignment*/
  top: 50%;
  transform: translateY(-50%);
}
.igx-grid__filtering-row-main [igxButton] span {
  margin-left: 1rem;
}
.igx-grid__filtering-row-scroll-end::before, .igx-grid__filtering-row-scroll-start::after {
  display: block;
  position: absolute;
  content: "";
  top: -2px;
  bottom: -2px;
  width: 10px;
}
.igx-grid__filtering-row-scroll-start {
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
  margin: 0 8px;
  z-index: 1;
}
.igx-grid__filtering-row-scroll-start::after {
  left: calc(100% + 6px);
  background: linear-gradient(to right, var(--filtering-row-background), transparent);
}
.igx-grid__filtering-row-scroll-end {
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
  margin: 0 8px;
  z-index: 1;
}
.igx-grid__filtering-row-scroll-end::before {
  right: calc(100% + 6px);
  background: linear-gradient(to left, var(--filtering-row-background), transparent);
}
.igx-grid__tr--highlighted {
  position: relative;
}
.igx-grid__tr--highlighted::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: var(--row-highlight);
  z-index: 3;
}
.igx-grid__tr--highlighted .igx-grid__tr--edited::before {
  left: 4px;
}
.igx-grid__tr--highlighted::before {
  left: 4px;
}
.igx-grid__tr-container {
  border-bottom: 1px solid var(--row-border-color);
}
.igx-grid__hierarchical-expander, .igx-grid__hierarchical-expander--empty {
  -webkit-user-select: none;
          user-select: none;
  background: inherit;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 3;
  color: var(--expand-icon-color);
  background-clip: border-box;
}
.igx-grid__hierarchical-expander:focus, .igx-grid__hierarchical-expander--empty:focus {
  outline: none;
}
.igx-grid__hierarchical-expander:focus igx-icon, .igx-grid__hierarchical-expander--empty:focus igx-icon {
  color: var(--expand-icon-hover-color);
}
.igx-grid__hierarchical-expander:hover igx-icon, .igx-grid__hierarchical-expander--empty:hover igx-icon {
  color: var(--expand-icon-hover-color);
}
.igx-grid__hierarchical-expander igx-icon, .igx-grid__hierarchical-expander--empty igx-icon {
  color: var(--expand-icon-color);
  max-width: 24px;
  min-width: 24px;
}
.igx-grid__hierarchical-expander--empty, .igx-grid--cosy .igx-grid__hierarchical-expander--empty, .igx-grid--compact .igx-grid__hierarchical-expander--empty {
  cursor: default;
  pointer-events: none;
}
.igx-grid--cosy .igx-grid__hierarchical-expander, .igx-grid--cosy .igx-grid__hierarchical-expander--empty {
  padding-left: 1rem;
  padding-right: 1rem;
}
.igx-grid--compact .igx-grid__hierarchical-expander, .igx-grid--compact .igx-grid__hierarchical-expander--empty {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.igx-grid__hierarchical-expander--header {
  background: inherit;
  border-right: 1px solid var(--header-border-color);
  z-index: 3;
  background-clip: border-box;
}
.igx-grid__hierarchical-expander--header igx-icon {
  display: flex;
  align-items: center;
}
.igx-grid__hierarchical-expander--push {
  align-items: flex-start;
}
.igx-grid__hierarchical-expander--push igx-icon {
  min-height: 3.125rem;
  max-height: 3.125rem;
}
.igx-grid--cosy .igx-grid__hierarchical-expander--push igx-icon {
  min-height: 2.5rem;
}
.igx-grid--compact .igx-grid__hierarchical-expander--push igx-icon {
  min-height: 2rem;
}
.igx-grid__header-indentation--no-border {
  border-right: 1px solid transparent;
}
.igx-grid__hierarchical-indent {
  margin-left: calc(2 * 1.5rem + 24px);
  margin-top: 1.5rem;
  margin-right: 1.5rem;
  margin-bottom: 1.5rem;
}
.igx-grid__hierarchical-indent--scroll {
  margin-right: calc(1.5rem + 18px);
}
.igx-grid--cosy .igx-grid__hierarchical-indent {
  margin-left: calc(2 * 1rem + 24px);
  margin-top: 1rem;
  margin-right: 1rem;
  margin-bottom: 1rem;
}
.igx-grid--cosy .igx-grid__hierarchical-indent--scroll {
  margin-right: calc(1rem + 18px);
}
.igx-grid--compact .igx-grid__hierarchical-indent {
  margin-left: calc(2 * 0.75rem + 24px);
  margin-top: 0.75rem;
  margin-right: 0.75rem;
  margin-bottom: 0.75rem;
}
.igx-grid--compact .igx-grid__hierarchical-indent--scroll {
  margin-right: calc(0.75rem + 18px);
}
.igx-excel-filter {
  display: block;
  width: 20rem;
  height: 100%;
  flex-grow: 1;
  box-shadow: var(--igx-elevation-12);
  overflow: auto;
  min-width: 20rem;
}
.igx-excel-filter--inline {
  box-shadow: none;
  width: 100%;
}
.igx-excel-filter__loading {
  display: flex;
  justify-content: center;
  align-items: center;
}
.igx-excel-filter__icon, .igx-excel-filter__icon--filtered {
  display: flex;
  cursor: pointer;
}
.igx-excel-filter__icon igx-icon, .igx-excel-filter__icon--filtered igx-icon {
  width: 0.9375rem;
  height: 0.9375rem;
  font-size: 0.9375rem;
}
.igx-excel-filter__icon--filtered igx-icon {
  color: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-excel-filter__menu {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--filtering-row-background);
  border-radius: 0.25rem;
}
.igx-excel-filter__menu,
.igx-excel-filter__menu igx-buttongroup {
  --border-radius: var(--igx-button-group-border-radius, 4px);
  --idle-shadow-color: var(--igx-button-group-idle-shadow-color, transparent);
  --item-background: var(--igx-button-group-item-background, var(--filtering-row-background));
  --item-border-color: var(--igx-button-group-item-border-color, transparent);
  --item-text-color: var(--igx-button-group-item-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-hover-text-color: var(--igx-button-group-item-hover-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --item-hover-background: var(--igx-button-group-item-hover-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --item-selected-text-color: var(--igx-button-group-item-selected-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --item-selected-background: var(--igx-button-group-item-selected-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --item-selected-hover-background: var(--igx-button-group-item-selected-hover-background, hsla(var(--igx-grays-300), 0.8));
  --item-selected-border-color: var(--igx-button-group-item-selected-border-color, transparent);
  --disabled-text-color: var(--igx-button-group-disabled-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --disabled-background-color: var(--igx-button-group-disabled-background-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --item-disabled-border: var(--igx-button-group-item-disabled-border, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --border: var(--igx-button-group-border, none);
  --shadow: var(--igx-button-group-shadow, none);
}
.igx-excel-filter__menu .igx-button-group {
  display: flex;
  box-shadow: var(--shadow);
  transition: all 140ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
  border-radius: var(--border-radius);
}
.igx-excel-filter__menu .igx-button-group button {
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
}
.igx-excel-filter__menu .igx-button-group__item {
  border: 1px solid var(--item-border-color);
  color: var(--item-text-color);
  background: var(--item-background);
  min-width: 24px;
  display: flex;
  flex: 1 0 0%;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  position: relative;
  z-index: 0;
  transition: all 140ms cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-excel-filter__menu [igxButton].igx-button-group__item {
  border-radius: 0;
}
.igx-excel-filter__menu .igx-button-group__item:not(:nth-child(0)) {
  margin-left: -1px;
}
.igx-excel-filter__menu .igx-button-group__item:first-of-type {
  border-top-left-radius: var(--border-radius);
  border-bottom-left-radius: var(--border-radius);
}
.igx-excel-filter__menu .igx-button-group__item:last-of-type {
  border-top-right-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
}
.igx-excel-filter__menu [igxButton][disabled=true].igx-button-group__item {
  color: var(--disabled-text-color);
  background: var(--disabled-background-color);
  border-color: var(--item-disabled-border);
}
.igx-excel-filter__menu .igx-button-group__item:hover, .igx-excel-filter__menu .igx-button-group__item:focus {
  color: var(--item-hover-text-color);
  background: var(--item-hover-background);
}
.igx-excel-filter__menu .igx-button-group--vertical .igx-button-group__item:not(:nth-child(0)), .igx-button-group--vertical .igx-excel-filter__menu .igx-button-group__item:not(:nth-child(0)) {
  margin-top: -1px;
  margin-left: 0;
}
.igx-excel-filter__menu .igx-button-group--vertical .igx-button-group__item:first-of-type, .igx-button-group--vertical .igx-excel-filter__menu .igx-button-group__item:first-of-type {
  border-top-left-radius: var(--border-radius);
  border-top-right-radius: var(--border-radius);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.igx-excel-filter__menu .igx-button-group--vertical .igx-button-group__item:last-of-type, .igx-button-group--vertical .igx-excel-filter__menu .igx-button-group__item:last-of-type {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: var(--border-radius);
  border-bottom-right-radius: var(--border-radius);
}
.igx-excel-filter__menu .igx-button-group__item--selected {
  color: var(--item-selected-text-color);
  background: var(--item-selected-background);
  border-color: var(--item-selected-border-color);
  position: relative;
  z-index: 1;
}
.igx-excel-filter__menu .igx-button-group__item--selected:hover, .igx-excel-filter__menu .igx-button-group__item--selected:focus {
  color: var(--item-selected-text-color);
  background: var(--item-selected-hover-background);
}
.igx-excel-filter__menu .igx-button-group__item--selected:focus {
  z-index: 3;
}
.igx-excel-filter__menu [igxButton][disabled=true].igx-button-group__item--selected {
  position: relative;
}
.igx-excel-filter__menu [igxButton][disabled=true].igx-button-group__item--selected::before {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: hsla(var(--igx-grays-500), 0.12);
}
.igx-excel-filter__menu .igx-button-group--vertical {
  flex-flow: column;
}
.igx-excel-filter__menu .igx-button-group__item-content {
  display: flex;
  align-items: center;
  flex-flow: row nowrap;
  min-width: 0;
}
.igx-excel-filter__menu .igx-button-group__item-content * ~ * {
  margin-left: 0.625rem;
}
.igx-excel-filter__menu .igx-button-group__button-text {
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.igx-excel-filter__menu-header, .igx-excel-filter__secondary-header {
  display: flex;
  align-items: center;
  padding: 1rem;
  color: hsla(var(--igx-grays-700), var(--igx-grays-a));
}
.igx-excel-filter__menu-header-actions {
  display: flex;
  margin-left: auto;
}
.igx-excel-filter__menu-header-actions [igxButton] + [igxButton] {
  margin-left: 0.25rem;
}
.igx-excel-filter__menu-header-actions .igx-excel-filter__actions-pin, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-pin--disabled, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-unpin, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-hide, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-select, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-selected, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-filter, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-clear, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-clear--disabled {
  padding: 0 !important;
  margin: 0 !important;
}
.igx-excel-filter__menu-header-actions .igx-excel-filter__actions-pin, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-pin--disabled, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-unpin, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-hide, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-select, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-selected, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-filter, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-clear, .igx-excel-filter__menu-header-actions .igx-excel-filter__actions-clear--disabled {
  justify-content: center;
}
.igx-excel-filter__menu-footer, .igx-excel-filter__secondary-footer {
  display: flex;
  justify-content: space-between;
  padding: 0.5rem 1rem;
}
.igx-excel-filter__menu-footer .igx-excel-filter__apply, .igx-excel-filter__secondary-footer .igx-excel-filter__apply,
.igx-excel-filter__menu-footer .igx-excel-filter__cancel,
.igx-excel-filter__secondary-footer .igx-excel-filter__cancel {
  flex-grow: 1;
}
.igx-excel-filter__menu-footer .igx-excel-filter__apply [igxButton], .igx-excel-filter__secondary-footer .igx-excel-filter__apply [igxButton],
.igx-excel-filter__menu-footer .igx-excel-filter__cancel [igxButton],
.igx-excel-filter__secondary-footer .igx-excel-filter__cancel [igxButton] {
  width: 100%;
}
.igx-excel-filter__clear {
  flex-grow: 1;
}
.igx-excel-filter__cancel + .igx-excel-filter__apply {
  margin-left: 1rem;
}
.igx-excel-filter__sort,
.igx-excel-filter__move {
  display: block;
  padding: 0.5rem 1rem;
}
.igx-excel-filter__sort header,
.igx-excel-filter__move header {
  color: hsla(var(--igx-grays-700), var(--igx-grays-a));
  margin-bottom: 0.25rem;
}
.igx-excel-filter__sort igx-icon,
.igx-excel-filter__move igx-icon {
  font-size: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
  justify-content: initial;
}
.igx-excel-filter__menu--compact .igx-excel-filter__sort,
.igx-excel-filter__menu--compact .igx-excel-filter__move {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.igx-excel-filter__menu--compact .igx-excel-filter__sort header,
.igx-excel-filter__menu--compact .igx-excel-filter__move header {
  color: hsla(var(--igx-grays-700), var(--igx-grays-a));
  margin-right: auto;
}
.igx-excel-filter__actions {
  padding: 0.5rem 1rem;
}
.igx-excel-filter__actions-selected igx-icon {
  color: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-excel-filter__actions-pin, .igx-excel-filter__actions-pin--disabled, .igx-excel-filter__actions-unpin, .igx-excel-filter__actions-hide, .igx-excel-filter__actions-select, .igx-excel-filter__actions-selected, .igx-excel-filter__actions-filter, .igx-excel-filter__actions-clear, .igx-excel-filter__actions-clear--disabled {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  cursor: pointer;
  color: hsla(var(--igx-grays-700), var(--igx-grays-a));
  outline-style: none;
}
.igx-excel-filter__actions-pin:hover, .igx-excel-filter__actions-pin--disabled:hover, .igx-excel-filter__actions-unpin:hover, .igx-excel-filter__actions-hide:hover, .igx-excel-filter__actions-select:hover, .igx-excel-filter__actions-selected:hover, .igx-excel-filter__actions-filter:hover, .igx-excel-filter__actions-clear:hover, .igx-excel-filter__actions-clear--disabled:hover, .igx-excel-filter__actions-pin:focus, .igx-excel-filter__actions-pin--disabled:focus, .igx-excel-filter__actions-unpin:focus, .igx-excel-filter__actions-hide:focus, .igx-excel-filter__actions-select:focus, .igx-excel-filter__actions-selected:focus, .igx-excel-filter__actions-filter:focus, .igx-excel-filter__actions-clear:focus, .igx-excel-filter__actions-clear--disabled:focus {
  background: hsla(var(--igx-grays-100), var(--igx-grays-a));
}
.igx-excel-filter__actions-pin--disabled, .igx-excel-filter__actions-clear--disabled {
  color: hsla(var(--igx-grays-400), var(--igx-grays-a));
  pointer-events: none;
}
.igx-excel-filter__menu-main {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  overflow: hidden;
  padding: 0 1rem;
}
.igx-excel-filter__menu-main igx-list {
  flex-grow: 1;
  overflow: hidden;
  margin: 0.5rem -1rem 0;
  border: 0;
  border-top: 1px dashed hsla(var(--igx-grays-300), var(--igx-grays-a));
  border-bottom: 1px dashed hsla(var(--igx-grays-300), var(--igx-grays-a));
}
.igx-excel-filter__menu--cosy .igx-excel-filter__menu-header, .igx-excel-filter__menu--cosy .igx-excel-filter__secondary-header {
  justify-content: space-between;
  padding: 0.5rem;
}
.igx-excel-filter__menu--cosy .igx-excel-filter__sort {
  padding: 0.5rem;
}
.igx-excel-filter__menu--cosy .igx-excel-filter__move {
  padding: 0.5rem;
}
.igx-excel-filter__menu--cosy .igx-excel-filter__actions {
  padding: 0.5rem;
}
.igx-excel-filter__menu--cosy .igx-excel-filter__actions-pin, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-pin--disabled, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-unpin, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-hide, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-select, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-selected, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-filter, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-clear, .igx-excel-filter__menu--cosy .igx-excel-filter__actions-clear--disabled {
  padding: 0.5rem;
}
.igx-excel-filter__menu--cosy .igx-excel-filter__menu-main {
  padding: 0 0.5rem;
}
.igx-excel-filter__menu--cosy igx-list {
  margin: 0.5rem -0.5rem 0;
}
.igx-excel-filter__menu--cosy .igx-excel-filter__menu-footer, .igx-excel-filter__menu--cosy .igx-excel-filter__secondary-footer {
  padding: 0.5rem;
}
.igx-excel-filter__menu--compact .igx-excel-filter__menu-header, .igx-excel-filter__menu--compact .igx-excel-filter__secondary-header {
  justify-content: space-between;
  padding: 0.25rem;
}
.igx-excel-filter__menu--compact .igx-excel-filter__sort,
.igx-excel-filter__menu--compact .igx-excel-filter__move {
  padding: 0.25rem;
}
.igx-excel-filter__menu--compact .igx-excel-filter__sort igx-buttongroup,
.igx-excel-filter__menu--compact .igx-excel-filter__move igx-buttongroup {
  width: 13rem;
}
.igx-excel-filter__menu--compact .igx-excel-filter__move {
  margin-bottom: 0;
}
.igx-excel-filter__menu--compact .igx-excel-filter__actions {
  padding: 0.25rem;
}
.igx-excel-filter__menu--compact .igx-excel-filter__actions-pin, .igx-excel-filter__menu--compact .igx-excel-filter__actions-pin--disabled, .igx-excel-filter__menu--compact .igx-excel-filter__actions-unpin, .igx-excel-filter__menu--compact .igx-excel-filter__actions-hide, .igx-excel-filter__menu--compact .igx-excel-filter__actions-select, .igx-excel-filter__menu--compact .igx-excel-filter__actions-selected, .igx-excel-filter__menu--compact .igx-excel-filter__actions-filter, .igx-excel-filter__menu--compact .igx-excel-filter__actions-clear, .igx-excel-filter__menu--compact .igx-excel-filter__actions-clear--disabled {
  padding: 0.25rem;
}
.igx-excel-filter__menu--compact .igx-excel-filter__menu-main {
  padding: 0 0.25rem;
}
.igx-excel-filter__menu--compact igx-list {
  margin: 0.5rem -0.25rem 0;
}
.igx-excel-filter__menu--compact .igx-excel-filter__menu-footer, .igx-excel-filter__menu--compact .igx-excel-filter__secondary-footer {
  padding: 0.5rem 0.25rem;
}
.igx-excel-filter__secondary {
  width: 520px;
  min-width: 520px;
  background: var(--filtering-row-background);
  box-shadow: var(--igx-elevation-12);
  border-radius: 0.25rem;
}
.igx-excel-filter__secondary--cosy .igx-excel-filter__menu-header, .igx-excel-filter__secondary--cosy .igx-excel-filter__secondary-header {
  padding: 0.5rem;
}
.igx-excel-filter__secondary--cosy .igx-excel-filter__condition {
  padding: 0 0.5rem;
}
.igx-excel-filter__secondary--cosy .igx-excel-filter__add-filter {
  margin: 0 0.5rem 0.5rem;
}
.igx-excel-filter__secondary--cosy .igx-excel-filter__menu-footer, .igx-excel-filter__secondary--cosy .igx-excel-filter__secondary-footer {
  padding: 0.5rem;
}
.igx-excel-filter__secondary--compact .igx-excel-filter__menu-header, .igx-excel-filter__secondary--compact .igx-excel-filter__secondary-header {
  padding: 0.25rem;
}
.igx-excel-filter__secondary--compact .igx-excel-filter__condition {
  padding: 0 0.25rem;
}
.igx-excel-filter__secondary--compact .igx-excel-filter__add-filter {
  margin: 0 0.25rem 0.25rem;
}
.igx-excel-filter__secondary--compact .igx-excel-filter__menu-footer, .igx-excel-filter__secondary--compact .igx-excel-filter__secondary-footer {
  padding: 0.5rem 0.25rem;
}
.igx-excel-filter__secondary-header {
  border-bottom: 1px solid hsla(var(--igx-grays-300), var(--igx-grays-a));
}
.igx-excel-filter__secondary-main {
  height: 232px;
  overflow: auto;
}
.igx-excel-filter__secondary-footer {
  border-top: 1px dashed hsla(var(--igx-grays-300), var(--igx-grays-a));
}
.igx-excel-filter__secondary-footer .igx-excel-filter__apply,
.igx-excel-filter__secondary-footer .igx-excel-filter__cancel {
  flex-grow: 0;
}
.igx-excel-filter__condition {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0 1rem;
}
.igx-excel-filter__condition igx-select {
  flex-grow: 1;
  flex-basis: 40%;
  margin: 1rem 0;
}
.igx-excel-filter__condition igx-select ~ igx-input-group,
.igx-excel-filter__condition igx-select ~ igx-date-picker {
  margin-left: 1rem;
}
.igx-excel-filter__condition igx-buttongroup {
  min-width: 30%;
}
.igx-excel-filter__condition [igxButton=icon] {
  margin-left: 1rem;
}
.igx-excel-filter__add-filter {
  margin: 0 1rem 1rem;
}
.igx-excel-filter__add-filter igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
}
igx-excel-style-filter-operations,
[igxExcelStyleFilterOperations] {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  overflow: hidden;
}
.igx-advanced-filter {
  width: 660px;
  min-width: 660px;
  max-width: 720px;
  background-color: var(--filtering-row-background);
  box-shadow: var(--igx-elevation-12);
  border-radius: 0.25rem;
}
.igx-advanced-filter__header {
  display: flex;
  align-items: center;
  padding: 1rem;
  color: hsla(var(--igx-grays-700), var(--igx-grays-a));
  background-color: hsla(var(--igx-grays-100), var(--igx-grays-a));
  -webkit-user-select: none;
          user-select: none;
  cursor: grab;
}
.igx-advanced-filter__header h4,
.igx-advanced-filter__header .igx-typography__h6 {
  margin-bottom: 0;
}
.igx-advanced-filter__main {
  display: block;
  padding: 1rem;
  overflow: auto;
  min-height: 214px;
  max-height: 468px;
}
.igx-advanced-filter__main [igxButton] + [igxButton] {
  margin-left: 0.5rem;
}
.igx-advanced-filter__outlet igx-select-item > igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
  margin-right: 0.5rem;
}
.igx-filter-tree {
  display: flex;
}
.igx-filter-tree + .igx-filter-tree,
.igx-filter-tree + .igx-filter-tree__expression-item,
.igx-filter-tree + .igx-filter-tree__inputs {
  margin-top: 1rem;
}
.igx-filter-tree__line {
  width: 0.5rem;
  min-width: 0.5rem;
  background-color: white;
  margin-right: 1rem;
  outline-style: none;
  border-radius: 0.25rem;
  cursor: pointer;
}
.igx-filter-tree__line--and {
  background: var(--filtering-background-and);
}
.igx-filter-tree__line--selected.igx-filter-tree__line--and {
  background: var(--filtering-background-and--focus);
}
.igx-filter-tree__line--and:focus {
  box-shadow: inset 0 0 0 2px var(--filtering-background-and--focus);
}
.igx-filter-tree__line--or {
  background: var(--filtering-background-or);
}
.igx-filter-tree__line--selected.igx-filter-tree__line--or {
  background-color: var(--filtering-background-or--focus);
}
.igx-filter-tree__line--or:focus {
  box-shadow: inset 0 0 0 2px var(--filtering-background-or--focus);
}
.igx-filter-tree__expression {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.igx-filter-tree__expression-item {
  display: flex;
  align-items: center;
}
.igx-filter-tree__expression-item + .igx-filter-tree,
.igx-filter-tree__expression-item + .igx-filter-tree__inputs,
.igx-filter-tree__expression-item + .igx-filter-tree__expression-item {
  margin-top: 1rem;
}
.igx-filter-tree__expression-column {
  padding: 0 0.5rem;
}
.igx-filter-tree__expression-actions {
  display: inline-flex;
  margin: 0 0.5rem;
}
.igx-filter-tree__expression-actions igx-icon {
  cursor: pointer;
  color: hsla(var(--igx-grays-500), var(--igx-grays-a));
  outline-style: none;
}
.igx-filter-tree__expression-actions igx-icon:hover, .igx-filter-tree__expression-actions igx-icon:focus {
  color: hsla(var(--igx-grays-800), var(--igx-grays-a));
}
.igx-filter-tree__expression-actions igx-icon + igx-icon {
  margin-left: 0.5rem;
}
.igx-filter-tree__expression-condition {
  opacity: 0.7;
}
.igx-filter-tree__buttons {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1rem;
}
.igx-filter-tree__buttons + .igx-filter-tree,
.igx-filter-tree__buttons + .igx-filter-tree__expression-item,
.igx-filter-tree__buttons + .igx-filter-tree__inputs {
  margin-top: 1rem;
}
.igx-filter-tree__inputs {
  display: flex;
  justify-content: space-between;
}
.igx-filter-tree__inputs igx-select + igx-select,
.igx-filter-tree__inputs igx-select + igx-input-group,
.igx-filter-tree__inputs igx-select + igx-date-picker,
.igx-filter-tree__inputs igx-input-group + igx-select {
  margin-left: 0.5rem;
}
.igx-filter-tree__inputs + .igx-filter-tree,
.igx-filter-tree__inputs + .igx-filter-tree__expression-item {
  margin-top: 1rem;
}
.igx-filter-tree__inputs-actions {
  display: flex;
  margin: 0 0.5rem;
  align-items: center;
}
.igx-filter-tree__inputs-actions [igxButton] {
  transition: none;
}
.igx-filter-tree__inputs-actions [igxButton] + [igxButton] {
  margin-left: 0.5rem;
}
.igx-filter-legend {
  display: flex;
  margin-left: auto;
  pointer-events: none;
}
.igx-filter-legend__item, .igx-filter-legend__item--and, .igx-filter-legend__item--or {
  position: relative;
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
}
.igx-filter-legend__item::before, .igx-filter-legend__item--and::before, .igx-filter-legend__item--or::before {
  content: "";
  width: 1.5rem;
  height: 1.5rem;
  background: white;
  border-radius: 0.25rem;
  margin-right: 0.5rem;
}
.igx-filter-legend__item + .igx-filter-legend__item, .igx-filter-legend__item--and + .igx-filter-legend__item, .igx-filter-legend__item--or + .igx-filter-legend__item, .igx-filter-legend__item + .igx-filter-legend__item--and, .igx-filter-legend__item--and + .igx-filter-legend__item--and, .igx-filter-legend__item--or + .igx-filter-legend__item--and, .igx-filter-legend__item + .igx-filter-legend__item--or, .igx-filter-legend__item--and + .igx-filter-legend__item--or, .igx-filter-legend__item--or + .igx-filter-legend__item--or {
  margin-left: 1.5rem;
}
.igx-filter-legend__item--and::before {
  background: var(--filtering-background-and);
}
.igx-filter-legend__item--or::before {
  background: var(--filtering-background-or);
}
.igx-filter-contextual-menu {
  position: relative;
  display: flex;
  flex-flow: column;
  width: 196px;
  background-color: var(--filtering-row-background);
  padding: 1rem;
  margin-left: 1rem;
  border-radius: 0.25rem;
  border: 1px solid hsla(var(--igx-grays-200), var(--igx-grays-a));
}
.igx-filter-contextual-menu > [igxButton] + [igxButton],
.igx-filter-contextual-menu igx-buttongroup + [igxButton],
.igx-filter-contextual-menu [igxButton] + igx-buttongroup {
  margin-top: 1rem;
}
.igx-filter-contextual-menu > [igxButton].igx-filter-contextual-menu__close-btn + [igxButton],
.igx-filter-contextual-menu [igxButton].igx-filter-contextual-menu__close-btn + igx-buttongroup {
  margin-top: 0;
}
.igx-filter-contextual-menu [igxButton] > igx-icon + * {
  margin-left: 8px;
}
.igx-filter-contextual-menu igx-buttongroup > * {
  box-shadow: none;
}
.igx-filter-contextual-menu__delete-btn {
  color: hsla(var(--igx-error-500), var(--igx-error-a));
}
.igx-filter-contextual-menu__delete-btn:hover, .igx-filter-contextual-menu__delete-btn:focus {
  color: hsla(var(--igx-error-500), var(--igx-error-a));
}
.igx-filter-contextual-menu__close-btn {
  position: absolute;
  top: -1.125rem;
  right: -1.125rem;
  background-color: var(--filtering-row-background);
  border: 1px solid hsla(var(--igx-grays-200), var(--igx-grays-a));
}
.igx-filter-contextual-menu__close-btn:hover, .igx-filter-contextual-menu__close-btn:focus {
  background-color: var(--filtering-row-background);
}
.igx-filter-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 144px;
}
.igx-filter-empty__title {
  color: hsla(var(--igx-grays-500), var(--igx-grays-a));
}
.igx-advanced-filter--cosy .igx-advanced-filter__main {
  min-height: 164px;
  max-height: 394px;
}
.igx-advanced-filter--cosy .igx-filter-empty {
  height: 107px;
}
.igx-advanced-filter--cosy .igx-advanced-filter__main,
.igx-advanced-filter--cosy .igx-advanced-filter__header {
  padding: 0.75rem 1rem;
}
.igx-advanced-filter--cosy .igx-filter-tree__expression-actions igx-icon {
  font-size: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
}
.igx-advanced-filter--cosy .igx-filter-tree__line {
  margin-right: 0.75rem;
}
.igx-advanced-filter--cosy .igx-filter-tree + .igx-filter-tree,
.igx-advanced-filter--cosy .igx-filter-tree + .igx-filter-tree__expression-item,
.igx-advanced-filter--cosy .igx-filter-tree + .igx-filter-tree__inputs {
  margin-top: 0.75rem;
}
.igx-advanced-filter--cosy .igx-filter-tree__expression-item + .igx-filter-tree,
.igx-advanced-filter--cosy .igx-filter-tree__expression-item + .igx-filter-tree__inputs,
.igx-advanced-filter--cosy .igx-filter-tree__expression-item + .igx-filter-tree__expression-item {
  margin-top: 0.75rem;
}
.igx-advanced-filter--cosy .igx-filter-tree__buttons {
  margin-top: 0.75rem;
}
.igx-advanced-filter--cosy .igx-filter-tree__buttons + .igx-filter-tree,
.igx-advanced-filter--cosy .igx-filter-tree__buttons + .igx-filter-tree__expression-item,
.igx-advanced-filter--cosy .igx-filter-tree__buttons + .igx-filter-tree__inputs {
  margin-top: 0.75rem;
}
.igx-advanced-filter--cosy .igx-filter-tree__inputs + .igx-filter-tree,
.igx-advanced-filter--cosy .igx-filter-tree__inputs + .igx-filter-tree__expression-item {
  margin-top: 0.75rem;
}
.igx-advanced-filter--compact .igx-advanced-filter__main {
  min-height: 138px;
  max-height: 305px;
}
.igx-advanced-filter--compact .igx-filter-empty {
  height: 92px;
}
.igx-advanced-filter--compact .igx-advanced-filter__main,
.igx-advanced-filter--compact .igx-advanced-filter__header {
  padding: 0.5rem 1rem;
}
.igx-advanced-filter--compact .igx-filter-tree__expression-actions igx-icon {
  font-size: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
}
.igx-advanced-filter--compact .igx-filter-tree__line {
  margin-right: 0.5rem;
}
.igx-advanced-filter--compact .igx-filter-tree + .igx-filter-tree,
.igx-advanced-filter--compact .igx-filter-tree + .igx-filter-tree__expression-item,
.igx-advanced-filter--compact .igx-filter-tree + .igx-filter-tree__inputs {
  margin-top: 0.5rem;
}
.igx-advanced-filter--compact .igx-filter-tree__expression-item + .igx-filter-tree,
.igx-advanced-filter--compact .igx-filter-tree__expression-item + .igx-filter-tree__inputs,
.igx-advanced-filter--compact .igx-filter-tree__expression-item + .igx-filter-tree__expression-item {
  margin-top: 0.5rem;
}
.igx-advanced-filter--compact .igx-filter-tree__buttons {
  margin-top: 0.5rem;
}
.igx-advanced-filter--compact .igx-filter-tree__buttons + .igx-filter-tree,
.igx-advanced-filter--compact .igx-filter-tree__buttons + .igx-filter-tree__expression-item,
.igx-advanced-filter--compact .igx-filter-tree__buttons + .igx-filter-tree__inputs {
  margin-top: 0.5rem;
}
.igx-advanced-filter--compact .igx-filter-tree__inputs + .igx-filter-tree,
.igx-advanced-filter--compact .igx-filter-tree__inputs + .igx-filter-tree__expression-item {
  margin-top: 0.5rem;
}
.igx-advanced-filter--inline {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 100%;
  height: inherit;
  max-height: inherit;
  min-width: 480px;
  box-shadow: none;
}
.igx-advanced-filter--inline .igx-advanced-filter__main {
  min-height: initial;
  max-height: initial;
  flex-grow: 1;
}
.igx-filter-contextual-menu--cosy > [igxButton] + [igxButton],
.igx-filter-contextual-menu--cosy igx-buttongroup + [igxButton],
.igx-filter-contextual-menu--cosy [igxButton] + igx-buttongroup {
  margin-top: 0.75rem;
}
.igx-filter-contextual-menu--compact > [igxButton] + [igxButton],
.igx-filter-contextual-menu--compact igx-buttongroup + [igxButton],
.igx-filter-contextual-menu--compact [igxButton] + igx-buttongroup {
  margin-top: 0.5rem;
}
.igx-grid__filtering-row-editing-buttons--small,
.igx-grid__filtering-row-editing-buttons {
  display: flex;
  align-items: center;
}
.igx-grid__filtering-row-editing-buttons--small button,
.igx-grid__filtering-row-editing-buttons button {
  transition: none;
}
.igx-grid__filtering-row-editing-buttons--small button:not([disabled]) igx-icon {
  color: var(--sorted-header-icon-color);
}
.igx-grid__tr-action:last-of-type {
  border-right: var(--header-border-width) var(--header-border-style) var(--header-border-color);
}
.igx-grid-summary {
  --background-color: var(--igx-grid-summary-background-color, inherit);
  --focus-background-color: var(--igx-grid-summary-focus-background-color, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --label-color: var(--igx-grid-summary-label-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --label-hover-color: var(--igx-grid-summary-label-hover-color, hsla(var(--igx-primary-700), var(--igx-primary-a)));
  --result-color: var(--igx-grid-summary-result-color, 'currentColor');
  --border-color: var(--igx-grid-summary-border-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --pinned-border-width: var(--igx-grid-summary-pinned-border-width, 2px);
  --pinned-border-style: var(--igx-grid-summary-pinned-border-style, solid);
  --pinned-border-color: var(--igx-grid-summary-pinned-border-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
}
.igx-grid-summary, .igx-grid-summary--cosy, .igx-grid-summary--compact {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  padding: 0 1.5rem;
  background: var(--background-color, inherit);
  overflow: hidden;
  outline-style: none;
}
.igx-grid-summary::after, .igx-grid-summary--cosy::after, .igx-grid-summary--compact::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.igx-grid-summary:focus::after, .igx-grid-summary--cosy:focus::after, .igx-grid-summary--compact:focus::after {
  background: var(--focus-background-color);
}
.igx-grid-summary--cosy {
  padding: 0 1rem;
}
.igx-grid-summary--compact {
  padding: 0 0.75rem;
}
.igx-grid-summary--pinned {
  position: relative;
  z-index: 1;
}
.igx-grid-summary--fw {
  flex-grow: 0;
}
.igx-grid-summary--pinned-last {
  border-right: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color);
}
@media print {
  .igx-grid-summary--pinned-last {
    border-right: var(--pinned-border-width) var(--pinned-border-style) #999;
  }
}
.igx-grid-summary--pinned-first {
  border-left: var(--pinned-border-width) var(--pinned-border-style) var(--pinned-border-color);
}
@media print {
  .igx-grid-summary--pinned-first {
    border-left: var(--pinned-border-width) var(--pinned-border-style) #999;
  }
}
.igx-grid-summary__item {
  display: flex;
  align-items: center;
  padding: 0.375rem 0;
  font-size: 0.75rem;
  position: relative;
}
.igx-grid-summary--cosy .igx-grid-summary__item {
  padding: 0.125rem 0;
}
.igx-grid-summary--compact .igx-grid-summary__item {
  padding: 0;
}
.igx-grid-summary__label {
  color: var(--label-color);
  min-width: 1.875rem;
  margin-right: 0.1875rem;
}
.igx-grid-summary__label:hover {
  color: var(--label-hover-color);
}
.igx-grid-summary__result {
  color: var(--result-color);
  font-weight: 600;
  flex: 1 1 auto;
  text-align: right;
}
.igx-grid-summary__label,
.igx-grid-summary__result {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
igx-grid-toolbar, .igx-grid-toolbar__dd-list {
  --background-color: var(--igx-grid-toolbar-background-color, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --title-text-color: var(--igx-grid-toolbar-title-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --dropdown-background: var(--igx-grid-toolbar-dropdown-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --item-text-color: var(--igx-grid-toolbar-item-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --item-hover-background: var(--igx-grid-toolbar-item-hover-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --item-hover-text-color: var(--igx-grid-toolbar-item-hover-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --item-focus-background: var(--igx-grid-toolbar-item-focus-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --item-focus-text-color: var(--igx-grid-toolbar-item-focus-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
}
.igx-grid-toolbar, .igx-grid-toolbar--cosy, .igx-grid-toolbar--compact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  grid-row: 1;
  font-size: 1rem;
  border-bottom: 1px solid hsla(var(--igx-grays-300), var(--igx-grays-a));
  background: var(--background-color);
  height: auto;
  min-height: 3.625rem;
  position: relative;
  padding: 0 1rem 0 1.5rem;
}
.igx-grid-toolbar [igxButton], .igx-grid-toolbar--cosy [igxButton], .igx-grid-toolbar--compact [igxButton] {
  margin-left: 1rem;
}
.igx-grid-toolbar [igxButton]:first-of-type, .igx-grid-toolbar--cosy [igxButton]:first-of-type, .igx-grid-toolbar--compact [igxButton]:first-of-type {
  margin-left: 0;
}
.igx-grid-toolbar [igxButton]:last-of-type, .igx-grid-toolbar--cosy [igxButton]:last-of-type, .igx-grid-toolbar--compact [igxButton]:last-of-type {
  margin-right: 0;
}
[dir=rtl].igx-grid-toolbar, [dir=rtl].igx-grid-toolbar--cosy, [dir=rtl].igx-grid-toolbar--compact {
  text-align: right;
}
[dir=rtl].igx-grid-toolbar [igxButton], [dir=rtl].igx-grid-toolbar--cosy [igxButton], [dir=rtl].igx-grid-toolbar--compact [igxButton] {
  margin-left: 0;
  margin-right: 0.5rem;
}
[dir=rtl].igx-grid-toolbar [igxButton]:last-child, [dir=rtl].igx-grid-toolbar--cosy [igxButton]:last-child, [dir=rtl].igx-grid-toolbar--compact [igxButton]:last-child {
  margin-right: 0;
}
.igx-grid-toolbar--cosy {
  min-height: 3.25rem;
  padding: 0 0.75rem 0 1rem;
}
.igx-grid-toolbar--cosy [igxButton] {
  margin-left: 0.75rem;
}
.igx-grid-toolbar--compact {
  min-height: 2.75rem;
  padding: 0 0.5rem 0 0.75rem;
}
.igx-grid-toolbar--compact [igxButton] {
  margin-left: 0.5rem;
}
.igx-grid-toolbar__title {
  color: var(--title-text-color);
  flex: 1 1 auto;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 40ch;
  margin-right: 1rem;
}
.igx-grid-toolbar__custom-content {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
  justify-content: flex-end;
  margin-right: 1rem;
}
.igx-grid-toolbar__actions {
  display: flex;
  align-items: center;
  flex-flow: row wrap;
  margin-left: auto;
}
.igx-grid-toolbar__actions > * {
  display: flex;
  margin-left: 1rem;
}
.igx-grid-toolbar__actions > *:first-child {
  margin-left: 0;
}
.igx-grid-toolbar__actions:empty,
.igx-grid-toolbar__title:empty,
.igx-grid-toolbar__custom-content:empty {
  display: none;
}
.igx-grid-toolbar__title:empty + .igx-grid-toolbar__custom-content:empty + .igx-grid-toolbar__actions {
  width: 100%;
  margin-left: 0;
  justify-content: flex-end;
}
.igx-grid-toolbar__progress-bar {
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  bottom: -0.0625rem;
  height: 0.125rem;
  overflow: hidden;
  background: var(--background-color);
}
.igx-grid-toolbar__progress-bar igx-linear-bar > * {
  border-radius: 0;
}
.igx-grid-toolbar__progress-bar igx-linear-bar > *:first-child > div {
  background: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-grid-toolbar__adv-filter--filtered {
  border-color: hsla(var(--igx-secondary-500), var(--igx-secondary-a)) !important;
}
.igx-grid-toolbar__dropdown {
  position: relative;
}
.igx-grid-toolbar__dd-list {
  list-style: none;
  background: var(--dropdown-background);
  margin: 0;
  padding: 0;
  box-shadow: var(--igx-elevation-8);
}
.igx-grid-toolbar__dd-list-items {
  cursor: pointer;
  position: relative;
  padding: 0.5em 1em;
  color: var(--item-text-color);
  white-space: nowrap;
}
.igx-grid-toolbar__dd-list-items:hover {
  background: var(--item-hover-background);
  color: var(--item-hover-text-color);
}
.igx-grid-toolbar__dd-list-items:focus {
  background: var(--item-focus-background);
  color: var(--item-focus-text-color);
}
.igx-highlight {
  --resting-background: var(--igx-highlight-resting-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --resting-color: var(--igx-highlight-resting-color, var(--igx-grays-300-contrast));
  --active-background: var(--igx-highlight-active-background, hsla(var(--igx-secondary-A100), var(--igx-secondary-a)));
  --active-color: var(--igx-highlight-active-color, var(--igx-secondary-A100-contrast));
}
.igx-highlight, .igx-highlight--active {
  color: var(--resting-color);
  background: var(--resting-background);
}
.igx-highlight--active {
  color: var(--active-color);
  background: var(--active-background);
}
igx-icon {
  --color: var(--igx-icon-color, 'currentColor');
  --size: var(--igx-icon-size, 1.5rem);
  --disabled-color: var(--igx-icon-disabled-color, 'currentColor');
}
.igx-icon {
  display: inline-flex;
  width: var(--size);
  height: var(--size);
  font-size: var(--size);
  color: var(--color);
}
.igx-icon div,
.igx-icon svg {
  display: block;
  width: inherit;
  height: inherit;
  fill: currentColor;
}
.igx-icon--success {
  color: hsla(var(--igx-success-500), var(--igx-success-a));
}
.igx-icon--error {
  color: hsla(var(--igx-error-500), var(--igx-error-a));
}
.igx-icon--inactive {
  color: var(--disabled-color) !important;
  opacity: 0.54;
}
igx-input-group, igx-date-range-start, igx-date-range-end {
  --box-border-radius: var(--igx-input-group-box-border-radius, 4px 4px 0px 0px);
  --border-border-radius: var(--igx-input-group-border-border-radius, 4px);
  --search-border-radius: var(--igx-input-group-search-border-radius, 4px);
  --input-prefix-color: var(--igx-input-group-input-prefix-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --input-prefix-background: var(--igx-input-group-input-prefix-background, transparent);
  --input-suffix-color: var(--igx-input-group-input-suffix-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --input-suffix-background: var(--igx-input-group-input-suffix-background, transparent);
  --idle-text-color: var(--igx-input-group-idle-text-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --border-color: var(--igx-input-group-border-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --hover-border-color: var(--igx-input-group-hover-border-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --focused-border-color: var(--igx-input-group-focused-border-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --filled-text-color: var(--igx-input-group-filled-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --focused-text-color: var(--igx-input-group-focused-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --disabled-text-color: var(--igx-input-group-disabled-text-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --idle-secondary-color: var(--igx-input-group-idle-secondary-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --filled-secondary-color: var(--igx-input-group-filled-secondary-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --focused-secondary-color: var(--igx-input-group-focused-secondary-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --idle-bottom-line-color: var(--igx-input-group-idle-bottom-line-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --hover-bottom-line-color: var(--igx-input-group-hover-bottom-line-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --focused-bottom-line-color: var(--igx-input-group-focused-bottom-line-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --interim-bottom-line-color: var(--igx-input-group-interim-bottom-line-color, hsla(var(--igx-primary-500), 0.12));
  --disabled-bottom-line-color: var(--igx-input-group-disabled-bottom-line-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --disabled-border-color: var(--igx-input-group-disabled-border-color, hsla(var(--igx-grays-500), 0.12));
  --box-background: var(--igx-input-group-box-background, hsla(var(--igx-grays-200), 0.38));
  --box-disabled-background: var(--igx-input-group-box-disabled-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --border-background: var(--igx-input-group-border-background, transparent);
  --border-disabled-background: var(--igx-input-group-border-disabled-background, transparent);
  --label-floated-background: var(--igx-input-group-label-floated-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --label-floated-disabled-background: var(--igx-input-group-label-floated-disabled-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --search-background: var(--igx-input-group-search-background, hsla(var(--igx-grays-50), var(--igx-grays-a)));
  --search-disabled-background: var(--igx-input-group-search-disabled-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --success-secondary-color: var(--igx-input-group-success-secondary-color, hsla(var(--igx-success-500), var(--igx-success-a)));
  --warning-secondary-color: var(--igx-input-group-warning-secondary-color, hsla(var(--igx-warn-500), var(--igx-warn-a)));
  --error-secondary-color: var(--igx-input-group-error-secondary-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --placeholder-color: var(--igx-input-group-placeholder-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --disabled-placeholder-color: var(--igx-input-group-disabled-placeholder-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --search-resting-shadow: var(--igx-input-group-search-resting-shadow, var(--igx-elevation-1));
  --search-hover-shadow: var(--igx-input-group-search-hover-shadow, var(--igx-elevation-2));
  --search-disabled-shadow: var(--igx-input-group-search-disabled-shadow, var(--igx-elevation-0));
}
igx-input-group {
  --theme: material;
}
.igx-input-group, .igx-input-group--focused {
  position: relative;
  display: block;
  color: var(--idle-text-color);
}
.igx-input-group igx-prefix, .igx-input-group--focused igx-prefix,
.igx-input-group [igxPrefix],
.igx-input-group--focused [igxPrefix] {
  outline-style: none;
}
.igx-input-group igx-suffix, .igx-input-group--focused igx-suffix,
.igx-input-group [igxSuffix],
.igx-input-group--focused [igxSuffix] {
  outline-style: none;
}
.igx-input-group input, .igx-input-group--focused input,
.igx-input-group textarea,
.igx-input-group--focused textarea,
.igx-input-group span,
.igx-input-group--focused span {
  font: inherit;
  margin: 0;
}
.igx-input-group input[type=file], .igx-input-group--focused input[type=file] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: none;
  clip: rect(0, 0, 0, 0);
  outline: 0;
  pointer-events: none;
  overflow: hidden;
  -webkit-appearance: none;
          appearance: none;
}
.igx-input-group textarea, .igx-input-group--focused textarea {
  overflow: auto;
}
.igx-input-group input[type=number]::-webkit-inner-spin-button, .igx-input-group--focused input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  height: auto;
}
.igx-input-group input[type=search]::-webkit-search-cancel-button, .igx-input-group--focused input[type=search]::-webkit-search-cancel-button,
.igx-input-group input[type=search]::-webkit-search-decoration,
.igx-input-group--focused input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
.igx-input-group--box, .igx-input-group--border, .igx-input-group--indigo, .igx-input-group--search {
  margin-top: 0;
}
.igx-input-group--box .igx-input-group__wrapper, .igx-input-group--indigo .igx-input-group__wrapper {
  border-radius: var(--box-border-radius);
  overflow: hidden;
}
.igx-input-group:hover {
  cursor: pointer;
}
.igx-input-group--disabled, .igx-input-group--disabled.igx-input-group--required {
  -webkit-user-select: none;
          user-select: none;
  color: var(--disabled-text-color) !important;
}
.igx-input-group__bundle {
  position: relative;
  display: flex;
  align-items: center;
  flex-flow: row nowrap;
  max-width: 100%;
  padding-top: 1.125rem;
  box-shadow: inset 0 -1px 0 0 var(--idle-bottom-line-color);
  transition: box-shadow 0.25s cubic-bezier(0.215, 0.61, 0.355, 1), color 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.igx-input-group--cosy .igx-input-group__bundle {
  padding-top: 0.9473684211rem;
}
.igx-input-group--compact .igx-input-group__bundle {
  padding-top: 0.8181818182rem;
}
.igx-input-group--box .igx-input-group__bundle {
  padding: 0 0 0 1rem;
  background: var(--box-background);
  box-shadow: inset 0 -2px 0 0 var(--idle-bottom-line-color);
}
.igx-input-group--box .igx-input-group__bundle igx-suffix,
.igx-input-group--box .igx-input-group__bundle [igxSuffix] {
  padding-right: 1rem;
}
.igx-input-group--indigo .igx-input-group__bundle {
  padding: 0 1rem;
  background: transparent;
  transition: background 0.25s cubic-bezier(0.215, 0.61, 0.355, 1), box-shadow 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
  box-shadow: inset 0 -1px 0 0 var(--idle-bottom-line-color);
}
.igx-input-group--indigo .igx-input-group__bundle:hover, .igx-input-group--indigo .igx-input-group__bundle:focus {
  background: var(--box-background);
}
.igx-input-group--indigo.igx-input-group--focused .igx-input-group__bundle {
  background: var(--box-background);
}
.igx-input-group--indigo.igx-input-group--valid .igx-input-group__bundle {
  box-shadow: inset 0 -2px 0 0 var(--success-secondary-color);
}
.igx-input-group--indigo.igx-input-group--invalid .igx-input-group__bundle {
  box-shadow: inset 0 -2px 0 0 var(--error-secondary-color);
}
.igx-input-group--indigo.igx-input-group--disabled .igx-input-group__hint {
  color: var(--disabled-text-color);
}
.igx-input-group--box.igx-input-group--cosy .igx-input-group__bundle, .igx-input-group--indigo.igx-input-group--cosy .igx-input-group__bundle {
  padding: 0 0 0 0.8421052632rem;
}
.igx-input-group--box.igx-input-group--cosy .igx-input-group__bundle igx-suffix, .igx-input-group--indigo.igx-input-group--cosy .igx-input-group__bundle igx-suffix,
.igx-input-group--box.igx-input-group--cosy .igx-input-group__bundle [igxSuffix],
.igx-input-group--indigo.igx-input-group--cosy .igx-input-group__bundle [igxSuffix] {
  padding-right: 0.8421052632rem;
}
.igx-input-group--box.igx-input-group--compact .igx-input-group__bundle, .igx-input-group--indigo.igx-input-group--compact .igx-input-group__bundle {
  padding: 0 0 0 0.7272727273rem;
}
.igx-input-group--box.igx-input-group--compact .igx-input-group__bundle igx-suffix, .igx-input-group--indigo.igx-input-group--compact .igx-input-group__bundle igx-suffix,
.igx-input-group--box.igx-input-group--compact .igx-input-group__bundle [igxSuffix],
.igx-input-group--indigo.igx-input-group--compact .igx-input-group__bundle [igxSuffix] {
  padding-right: 0.7272727273rem;
}
.igx-input-group__bundle:hover {
  cursor: pointer;
  box-shadow: inset 0 -2px 0 0 var(--hover-bottom-line-color);
}
.igx-input-group--focused .igx-input-group__bundle, .igx-input-group--focused.igx-input-group--fluent .igx-input-group__bundle {
  caret-color: var(--focused-secondary-color);
  box-shadow: inset 0 -2px 0 0 var(--interim-bottom-line-color);
}
.igx-input-group--valid .igx-input-group__bundle {
  caret-color: var(--success-secondary-color);
  box-shadow: inset 0 -1px 0 0 var(--success-secondary-color);
}
.igx-input-group--invalid .igx-input-group__bundle {
  caret-color: var(--error-secondary-color);
  box-shadow: inset 0 -1px 0 0 var(--error-secondary-color);
}
.igx-input-group--disabled .igx-input-group__bundle, .igx-input-group--disabled.igx-input-group--required .igx-input-group__bundle {
  box-shadow: none;
  background-image: linear-gradient(to left, var(--disabled-bottom-line-color) 40%, transparent 10%);
  background-position: bottom;
  background-size: 4px 1px;
  background-repeat: repeat-x;
}
.igx-input-group--disabled.igx-input-group--box .igx-input-group__bundle, .igx-input-group--indigo.igx-input-group--disabled .igx-input-group__bundle {
  background: var(--box-disabled-background);
}
.igx-input-group--border .igx-input-group__bundle {
  padding: 0 0 0 1rem;
  box-shadow: inset 0 0 0 1px var(--border-color);
  border-radius: var(--border-border-radius);
  background: var(--border-background);
}
.igx-input-group--border .igx-input-group__bundle igx-suffix,
.igx-input-group--border .igx-input-group__bundle [igxSuffix] {
  padding-right: 1rem;
}
.igx-input-group--border.igx-input-group--cosy .igx-input-group__bundle {
  padding: 0 0 0 0.8421052632rem;
}
.igx-input-group--border.igx-input-group--cosy .igx-input-group__bundle igx-suffix,
.igx-input-group--border.igx-input-group--cosy .igx-input-group__bundle [igxSuffix] {
  padding-right: 0.8421052632rem;
}
.igx-input-group--border.igx-input-group--compact .igx-input-group__bundle {
  padding: 0 0 0 0.7272727273rem;
}
.igx-input-group--border.igx-input-group--compact .igx-input-group__bundle igx-suffix,
.igx-input-group--border.igx-input-group--compact .igx-input-group__bundle [igxSuffix] {
  padding-right: 0.7272727273rem;
}
.igx-input-group--border .igx-input-group__bundle:hover {
  box-shadow: inset 0 0 0 2px var(--hover-border-color);
}
.igx-input-group--focused.igx-input-group--border .igx-input-group__bundle {
  box-shadow: inset 0 0 0 2px var(--focused-border-color);
}
.igx-input-group--invalid.igx-input-group--border .igx-input-group__bundle {
  box-shadow: inset 0 0 0 2px var(--error-secondary-color);
}
.igx-input-group--valid.igx-input-group--border .igx-input-group__bundle {
  box-shadow: inset 0 0 0 2px var(--success-secondary-color);
}
.igx-input-group--disabled.igx-input-group--border .igx-input-group__bundle {
  background: var(--border-disabled-background);
  box-shadow: inset 0 0 0 1px var(--disabled-border-color);
}
.igx-input-group--fluent {
  display: flex;
  flex-direction: column;
}
.igx-input-group--fluent igx-prefix,
.igx-input-group--fluent [igxPrefix] {
  outline-style: none;
}
.igx-input-group--fluent igx-suffix,
.igx-input-group--fluent [igxSuffix] {
  outline-style: none;
}
.igx-input-group--fluent select {
  width: calc(100% + 0.5rem);
  margin-left: -0.5rem !important;
  cursor: pointer !important;
}
.igx-input-group--search.igx-input-group--fluent {
  display: flex;
  flex-direction: column;
}
.igx-input-group--search.igx-input-group--fluent igx-prefix,
.igx-input-group--search.igx-input-group--fluent [igxPrefix] {
  outline-style: none;
  overflow: hidden;
}
.igx-input-group--search.igx-input-group--fluent igx-suffix,
.igx-input-group--search.igx-input-group--fluent [igxSuffix] {
  outline-style: none;
}
.igx-input-group--focused.igx-input-group--fluent.igx-input-group--search igx-prefix,
.igx-input-group--focused.igx-input-group--fluent.igx-input-group--search [igxPrefix] {
  visibility: hidden;
  width: 0;
  padding-left: 0 !important;
}
.igx-input-group--cosy.igx-input-group--fluent igx-prefix,
.igx-input-group--cosy.igx-input-group--fluent [igxPrefix] {
  outline-style: none;
}
.igx-input-group--cosy.igx-input-group--fluent igx-suffix,
.igx-input-group--cosy.igx-input-group--fluent [igxSuffix] {
  outline-style: none;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy {
  display: flex;
  flex-direction: column;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy igx-prefix,
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy [igxPrefix] {
  outline-style: none;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy igx-suffix,
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy [igxSuffix] {
  outline-style: none;
}
.igx-input-group--compact.igx-input-group--fluent igx-prefix,
.igx-input-group--compact.igx-input-group--fluent [igxPrefix] {
  outline-style: none;
}
.igx-input-group--compact.igx-input-group--fluent igx-suffix,
.igx-input-group--compact.igx-input-group--fluent [igxSuffix] {
  outline-style: none;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact {
  display: flex;
  flex-direction: column;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact igx-prefix,
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact [igxPrefix] {
  outline-style: none;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact igx-suffix,
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact [igxSuffix] {
  outline-style: none;
}
.igx-input-group--required.igx-input-group--fluent .igx-input-group__bundle::after {
  content: "*";
  position: absolute;
  top: -0.5rem;
  left: calc(100% + 0.25rem);
  color: var(--error-secondary-color);
}
.igx-input-group--required.igx-input-group--fluent .igx-input-group__label + .igx-input-group__bundle::after, .igx-input-group--required.igx-input-group--fluent .igx-input-group--indigo .igx-input-group__label + .igx-input-group__bundle::after, .igx-input-group--required.igx-input-group--fluent .igx-input-group--search.igx-input-group--fluent .igx-input-group__label + .igx-input-group__bundle::after {
  display: none;
}
.igx-input-group--fluent .igx-input-group__bundle, .igx-input-group--search.igx-input-group--fluent .igx-input-group__bundle {
  padding: 0;
  min-height: 32px;
  border: 1px solid var(--border-color);
  box-shadow: none;
  border-radius: var(--border-border-radius);
  background: var(--border-background);
  position: relative;
  align-items: stretch;
}
.igx-input-group--fluent .igx-input-group__bundle:hover, .igx-input-group--search.igx-input-group--fluent .igx-input-group__bundle:hover {
  border-color: var(--hover-border-color);
  box-shadow: none;
}
.igx-input-group--focused.igx-input-group--fluent .igx-input-group__bundle:hover {
  border-color: var(--focused-border-color);
  box-shadow: none;
}
.igx-input-group--disabled.igx-input-group--fluent .igx-input-group__bundle:hover,
.igx-input-group--disabled.igx-input-group--fluent .igx-input-group__bundle {
  border-color: var(--disabled-border-color);
  background: var(--border-disabled-background);
}
.igx-input-group--invalid.igx-input-group--fluent .igx-input-group__bundle:hover, .igx-input-group--indigo.igx-input-group--invalid .igx-input-group__bundle:hover,
.igx-input-group--invalid.igx-input-group--fluent .igx-input-group__bundle {
  border-color: var(--error-secondary-color);
}
.igx-input-group--valid.igx-input-group--fluent .igx-input-group__bundle:hover,
.igx-input-group--valid.igx-input-group--fluent .igx-input-group__bundle {
  border-color: var(--success-secondary-color);
}
.igx-input-group--fluent .igx-input-group__input, .igx-input-group--fluent .igx-input-group__file-input, .igx-input-group--search.igx-input-group--fluent .igx-input-group__input {
  padding: 0;
  margin: 0;
  border: none;
}
.igx-input-group--disabled.igx-input-group--fluent .igx-input-group__input, .igx-input-group--disabled.igx-input-group--fluent .igx-input-group__input:hover, .igx-input-group--disabled.igx-input-group--fluent .igx-input-group__input:focus, .igx-input-group--disabled.igx-input-group--fluent .igx-input-group__file-input, .igx-input-group--disabled.igx-input-group--fluent .igx-input-group__file-input:hover, .igx-input-group--disabled.igx-input-group--fluent .igx-input-group__file-input:focus {
  color: var(--disabled-text-color);
}
.igx-input-group--fluent .igx-input-group__bundle-main, .igx-input-group--search.igx-input-group--fluent .igx-input-group__bundle-main {
  padding-left: 0.5rem;
  align-self: center;
}
.igx-input-group--fluent igx-prefix + .igx-input-group__bundle-main, .igx-input-group--search.igx-input-group--fluent igx-prefix + .igx-input-group__bundle-main,
.igx-input-group--fluent [igx-prefix] + .igx-input-group__bundle-main {
  padding-left: 0;
}
.igx-input-group--placeholder.igx-input-group--fluent .igx-input-group__label {
  transform: translateY(0) scale(1);
}
.igx-input-group--fluent .igx-input-group__label, .igx-input-group--indigo .igx-input-group__label, .igx-input-group--search.igx-input-group--fluent .igx-input-group__label {
  padding: 0.3125rem 0;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: normal !important;
  position: static;
  transform: translateY(0);
  transform-origin: top left;
  margin-top: 0 !important;
  height: auto;
  color: hsla(var(--igx-grays-800), var(--igx-grays-a));
}
.igx-input-group--valid.igx-input-group--fluent .igx-input-group__label {
  color: var(--idle-text-color);
}
.igx-input-group--invalid.igx-input-group--fluent .igx-input-group__label {
  color: var(--idle-text-color);
}
.igx-input-group--disabled.igx-input-group--fluent .igx-input-group__label {
  color: hsla(var(--igx-grays-500), var(--igx-grays-a));
}
.igx-input-group--filled.igx-input-group--fluent .igx-input-group__label, .igx-input-group--file.igx-input-group--fluent .igx-input-group__label {
  transform: translateY(0);
}
.igx-input-group--focused.igx-input-group--fluent .igx-input-group__label {
  color: hsla(var(--igx-grays-800), var(--igx-grays-a));
  transform: translateY(0) scale(1);
}
.igx-input-group--fluent .igx-input-group__textarea {
  padding: 0;
}
.igx-input-group--search .igx-input-group__bundle {
  padding: 0 1rem;
  border-radius: var(--search-border-radius);
  background: var(--search-background);
  box-shadow: var(--search-resting-shadow);
}
.bundle {
  padding: 0 0.8421052632rem;
}
.bundle {
  padding: 0 0.7272727273rem;
}
.igx-input-group--search .igx-input-group__bundle:hover {
  box-shadow: var(--search-hover-shadow);
  border-color: var(--hover-border-color);
}
.igx-input-group--focused.igx-input-group--search .igx-input-group__bundle {
  box-shadow: var(--search-hover-shadow);
  border-color: var(--hover-border-color);
}
.igx-input-group--disabled.igx-input-group--search .igx-input-group__bundle, .igx-input-group--disabled.igx-input-group--fluent.igx-input-group--search .igx-input-group__bundle {
  background: var(--search-disabled-background);
  box-shadow: var(--search-disabled-shadow);
  border-color: var(--disabled-border-color);
}
.igx-input-group__bundle-main {
  position: relative;
  flex-grow: 1;
  max-width: inherit;
}
.igx-input-group--box .igx-input-group__bundle-main, .igx-input-group--border .igx-input-group__bundle-main, .igx-input-group--indigo .igx-input-group__bundle-main, .igx-input-group--search .igx-input-group__bundle-main {
  padding-top: 1.125rem;
}
.igx-input-group--box.igx-input-group--cosy .igx-input-group__bundle-main, .igx-input-group--border.igx-input-group--cosy .igx-input-group__bundle-main, .igx-input-group--indigo.igx-input-group--cosy .igx-input-group__bundle-main, .igx-input-group--search.igx-input-group--cosy .igx-input-group__bundle-main {
  padding-top: 0.9473684211rem;
}
.igx-input-group--box.igx-input-group--compact .igx-input-group__bundle-main, .igx-input-group--border.igx-input-group--compact .igx-input-group__bundle-main, .igx-input-group--indigo.igx-input-group--compact .igx-input-group__bundle-main, .igx-input-group--search.igx-input-group--compact .igx-input-group__bundle-main {
  padding-top: 0.8181818182rem;
}
.igx-input-group__label {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  position: absolute;
  transform: translateY(50%);
  /* 8px, base is 16px */
  line-height: 1 !important;
  height: 1.125rem;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  will-change: transform;
  transform-origin: top left;
  transition: transform 0.25s cubic-bezier(0.215, 0.61, 0.355, 1), color 0.25s cubic-bezier(0.215, 0.61, 0.355, 1), margin 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.igx-input-group--cosy .igx-input-group__label {
  margin-top: -0.125rem;
}
.igx-input-group--compact .igx-input-group__label {
  margin-top: -0.25rem;
}
.igx-input-group--box .igx-input-group__label {
  transform: translateY(0);
}
.igx-input-group--box .igx-input-group__label + .igx-input-group__input,
.igx-input-group--box .igx-input-group__label ~ .igx-input-group__file-input {
  transform: translateY(0);
}
.igx-input-group--border .igx-input-group__label {
  padding: 0 0.25rem;
  transition: all 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.igx-input-group--border .igx-input-group__label,
.igx-input-group--search .igx-input-group__label {
  transform: translateY(0);
}
.igx-input-group--search .igx-input-group__label + .igx-input-group__input {
  transform: translateY(0);
}
.igx-input-group--focused .igx-input-group__label, .igx-input-group--placeholder .igx-input-group__label, .igx-input-group--filled .igx-input-group__label, .igx-input-group--file .igx-input-group__label {
  overflow: visible;
  transform: translateY(-50%) scale(0.75);
  margin-top: auto;
}
.igx-input-group--border.igx-input-group--filled .igx-input-group__label, .igx-input-group--border.igx-input-group--file .igx-input-group__label, .igx-input-group--border.igx-input-group--focused .igx-input-group__label, .igx-input-group--border.igx-input-group--placeholder .igx-input-group__label {
  transform: translateY(-130%) scale(0.75);
  background: var(--label-floated-background, inherit);
}
.igx-input-group--disabled.igx-input-group--border .igx-input-group__label {
  background: var(--label-floated-disabled-background, inherit);
}
.igx-input-group--border.igx-input-group--cosy.igx-input-group--filled .igx-input-group__label, .igx-input-group--border.igx-input-group--cosy.igx-input-group--file .igx-input-group__label, .igx-input-group--border.igx-input-group--cosy.igx-input-group--focused .igx-input-group__label, .igx-input-group--border.igx-input-group--cosy.igx-input-group--placeholder .igx-input-group__label {
  transform: translateY(-115%) scale(0.75);
}
.igx-input-group--border.igx-input-group--compact.igx-input-group--filled .igx-input-group__label, .igx-input-group--border.igx-input-group--compact.igx-input-group--file .igx-input-group__label, .igx-input-group--border.igx-input-group--compact.igx-input-group--focused .igx-input-group__label, .igx-input-group--border.igx-input-group--compact.igx-input-group--placeholder .igx-input-group__label {
  transform: translateY(-105%) scale(0.75);
}
.igx-input-group--placeholder .igx-input-group__label, .igx-input-group--disabled .igx-input-group__label, .igx-input-group--disabled.igx-input-group--required .igx-input-group__label {
  transition: color 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.igx-input-group--focused .igx-input-group__label {
  color: var(--focused-secondary-color);
}
.igx-input-group--valid .igx-input-group__label {
  color: var(--success-secondary-color);
}
.igx-input-group--invalid .igx-input-group__label {
  color: var(--error-secondary-color);
}
.igx-input-group--required .igx-input-group__label::after {
  content: "*";
  font-size: inherit;
  vertical-align: top;
  margin-left: 2px;
  /* 2px base is 16px */
  display: inline-block;
}
.igx-input-group__input, .igx-input-group__textarea {
  position: relative;
  display: block;
  border: none;
  height: 2rem;
  width: 100%;
  min-width: 0;
  overflow: visible;
  background: transparent;
  color: var(--filled-text-color);
  outline-style: none;
  box-shadow: none;
  border-top: 0.1875rem solid transparent;
  padding-bottom: 0.1875rem;
}
.igx-input-group__input:not([type=date]), .igx-input-group__textarea:not([type=date]) {
  line-height: 0 !important;
  /* Reset typography */
}
.igx-input-group__input::placeholder, .igx-input-group__textarea::placeholder {
  color: var(--placeholder-color);
  opacity: 1;
  line-height: normal;
  /* Fix placeholder position in Safari */
}
.igx-input-group__file-input {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  height: 2rem;
  color: var(--filled-text-color);
  line-height: 1;
}
.igx-input-group__file-input span {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  position: absolute;
  display: inline-block;
  width: inherit;
  max-width: inherit;
  top: 50%;
  transform: translateY(-50%);
}
.igx-input-group--cosy .igx-input-group__input {
  height: 1.6842105263rem;
}
.igx-input-group--cosy .igx-input-group__file-input {
  height: 1.6842105263rem;
}
.igx-input-group--compact .igx-input-group__input {
  font-size: 0.9545454545rem;
  height: 1.4545454545rem;
}
.igx-input-group--compact .igx-input-group__file-input {
  height: 1.4545454545rem;
}
.igx-input-group__upload-button {
  margin-bottom: 0.625rem;
}
.igx-input-group__clear-icon:focus {
  border-radius: 4px;
  background-color: hsla(var(--igx-primary-500), var(--igx-primary-a));
  color: var(--igx-primary-500-contrast);
  background-color: transparent;
  color: hsla(var(--igx-secondary-500), var(--igx-secondary-a));
}
.igx-input-group__input:-webkit-autofill {
  transition-delay: 99999s;
}
.igx-input-group__input::-ms-clear {
  display: none;
}
.igx-input-group--box .igx-input-group__input,
.igx-input-group--box .igx-input-group__file-input,
.igx-input-group--search .igx-input-group__input,
.igx-input-group--border .igx-input-group__input,
.igx-input-group--border .igx-input-group__file-input,
.igx-input-group--indigo .igx-input-group__input,
.igx-input-group--indigo .igx-input-group__file-input {
  transform: translateY(-25%);
}
.igx-input-group__input:hover, .igx-input-group__file-input:hover, .igx-input-group__textarea:hover {
  cursor: pointer;
}
.igx-input-group__input:focus, .igx-input-group__file-input:focus, .igx-input-group__textarea:focus {
  cursor: text;
  color: var(--focused-text-color);
}
.igx-input-group--disabled .igx-input-group__input, .igx-input-group--disabled .igx-input-group__file-input, .igx-input-group--disabled.igx-input-group--required .igx-input-group__input, .igx-input-group--disabled.igx-input-group--required .igx-input-group__file-input, .igx-input-group--indigo.igx-input-group--disabled .igx-input-group__input, .igx-input-group--indigo.igx-input-group--disabled .igx-input-group__file-input {
  color: var(--disabled-text-color) !important;
}
.igx-input-group--disabled .igx-input-group__input::placeholder, .igx-input-group--disabled .igx-input-group__file-input::placeholder, .igx-input-group--disabled.igx-input-group--required .igx-input-group__input::placeholder, .igx-input-group--disabled.igx-input-group--required .igx-input-group__file-input::placeholder, .igx-input-group--indigo.igx-input-group--disabled .igx-input-group__input::placeholder, .igx-input-group--indigo.igx-input-group--disabled .igx-input-group__file-input::placeholder {
  color: var(--disabled-placeholder-color);
}
.igx-input-group__textarea {
  min-height: 5.125rem;
  margin-right: -1rem;
  height: auto;
  resize: vertical;
  overflow: hidden;
  line-height: normal !important;
}
.igx-input-group__textarea:not([type="*"]) {
  line-height: normal !important;
  /* resets typography styles */
}
.igx-input-group--disabled .igx-input-group__textarea, .igx-input-group--disabled.igx-input-group--required .igx-input-group__textarea {
  color: var(--disabled-text-color) !important;
}
.igx-input-group--disabled .igx-input-group__textarea::placeholder, .igx-input-group--disabled.igx-input-group--required .igx-input-group__textarea::placeholder {
  color: var(--disabled-placeholder-color);
}
.igx-input-group--cosy .igx-input-group__textarea {
  min-height: 4.3157894737rem;
  margin-right: -0.8421052632rem;
}
.igx-input-group--compact .igx-input-group__textarea {
  min-height: 3.7272727273rem;
  margin-right: -0.7272727273rem;
}
.igx-input-group--indigo .igx-input-group__textarea {
  margin-top: -1.125rem !important;
}
.igx-input-group--indigo.igx-input-group--cosy .igx-input-group__textarea {
  margin-top: -0.9473684211rem !important;
}
.igx-input-group--indigo.igx-input-group--compact .igx-input-group__textarea {
  margin-top: -0.8181818182rem !important;
}
.igx-input-group igx-prefix, .igx-input-group--focused igx-prefix,
.igx-input-group [igxPrefix],
.igx-input-group--focused [igxPrefix],
.igx-input-group igx-suffix,
.igx-input-group--focused igx-suffix,
.igx-input-group [igxSuffix],
.igx-input-group--focused [igxSuffix] {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 2rem;
  transition: color 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.igx-input-group igx-prefix, .igx-input-group--focused igx-prefix,
.igx-input-group [igxPrefix],
.igx-input-group--focused [igxPrefix] {
  padding: 0.5rem 0.5rem 0.5rem 0;
}
.igx-input-group igx-suffix, .igx-input-group--focused igx-suffix,
.igx-input-group [igxSuffix],
.igx-input-group--focused [igxSuffix] {
  padding: 0.5rem 0;
}
.igx-input-group--cosy igx-prefix,
.igx-input-group--cosy [igxPrefix],
.igx-input-group--cosy igx-suffix,
.igx-input-group--cosy [igxSuffix] {
  height: 1.6842105263rem;
}
.igx-input-group--compact igx-prefix,
.igx-input-group--compact [igxPrefix],
.igx-input-group--compact igx-suffix,
.igx-input-group--compact [igxSuffix] {
  font-size: 0.9545454545rem;
  height: 1.4545454545rem;
}
.igx-input-group--cosy igx-prefix,
.igx-input-group--cosy [igxPrefix] {
  padding: 0.4210526316rem 0.4210526316rem 0.4210526316rem 0;
}
.igx-input-group--compact igx-prefix,
.igx-input-group--compact [igxPrefix] {
  padding: 0.3636363636rem 0.3636363636rem 0.3636363636rem 0;
}
.igx-input-group--cosy igx-suffix,
.igx-input-group--cosy [igxSuffix] {
  padding: 0.4210526316rem 0;
}
.igx-input-group--compact igx-suffix,
.igx-input-group--compact [igxSuffix] {
  padding: 0.3636363636rem 0;
}
.igx-input-group--fluent igx-prefix,
.igx-input-group--fluent [igxPrefix] {
  color: var(--input-prefix-color);
  background: var(--input-prefix-background);
  padding: 0.5rem;
  width: auto;
  height: auto;
  line-height: normal;
  font-weight: 400;
  border-radius: var(--border-border-radius) 0 0 var(--border-border-radius);
}
.igx-input-group--fluent igx-prefix igx-icon,
.igx-input-group--fluent [igxPrefix] igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
}
.igx-input-group--fluent igx-prefix:last-of-type,
.igx-input-group--fluent [igxPrefix]:last-of-type {
  margin-right: 0.5rem;
}
.igx-input-group--search.igx-input-group--fluent igx-prefix,
.igx-input-group--search.igx-input-group--fluent [igxPrefix] {
  padding: 0.5rem;
}
.igx-input-group--search.igx-input-group--fluent igx-prefix igx-icon,
.igx-input-group--search.igx-input-group--fluent [igxPrefix] igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
}
.igx-input-group--search.igx-input-group--fluent igx-prefix:last-of-type,
.igx-input-group--search.igx-input-group--fluent [igxPrefix]:last-of-type {
  margin-right: 0;
}
.igx-input-group--fluent igx-suffix,
.igx-input-group--fluent [igxSuffix] {
  color: var(--input-suffix-color);
  padding: 0.5rem;
  background: var(--input-suffix-background);
  width: auto;
  height: auto;
  line-height: normal;
  border-radius: 0 var(--border-border-radius) var(--border-border-radius) 0;
}
.igx-input-group--fluent igx-suffix igx-icon,
.igx-input-group--fluent [igxSuffix] igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
}
.igx-input-group--fluent igx-suffix:first-of-type,
.igx-input-group--fluent [igxSuffix]:first-of-type {
  margin-left: 0.5rem;
}
.igx-input-group--search.igx-input-group--fluent igx-suffix,
.igx-input-group--search.igx-input-group--fluent [igxSuffix] {
  width: auto;
  height: auto;
  padding: 0.5rem;
  line-height: normal;
}
.igx-input-group--search.igx-input-group--fluent igx-suffix igx-icon,
.igx-input-group--search.igx-input-group--fluent [igxSuffix] igx-icon {
  width: 1.125rem;
  height: 1.125rem;
  font-size: 1.125rem;
}
.igx-input-group--search.igx-input-group--fluent igx-suffix:first-of-type,
.igx-input-group--search.igx-input-group--fluent [igxSuffix]:first-of-type {
  margin-left: 0;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy igx-prefix,
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy igx-suffix,
.igx-input-group--cosy.igx-input-group--fluent igx-prefix,
.igx-input-group--cosy.igx-input-group--fluent [igxPrefix],
.igx-input-group--cosy.igx-input-group--fluent igx-suffix,
.igx-input-group--cosy.igx-input-group--fluent [igxSuffix] {
  height: auto;
  line-height: normal;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact igx-prefix,
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact igx-suffix,
.igx-input-group--compact.igx-input-group--fluent igx-prefix,
.igx-input-group--compact.igx-input-group--fluent [igxPrefix],
.igx-input-group--compact.igx-input-group--fluent igx-suffix,
.igx-input-group--compact.igx-input-group--fluent [igxSuffix] {
  font-size: 0.9545454545rem;
  height: auto;
  line-height: normal;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy igx-prefix,
.igx-input-group--cosy.igx-input-group--fluent igx-prefix,
.igx-input-group--cosy.igx-input-group--fluent [igxPrefix] {
  padding: 0.4210526316rem;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact igx-prefix,
.igx-input-group--compact.igx-input-group--fluent igx-prefix,
.igx-input-group--compact.igx-input-group--fluent [igxPrefix] {
  padding: 0.3636363636rem;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--cosy igx-suffix,
.igx-input-group--cosy.igx-input-group--fluent igx-suffix,
.igx-input-group--cosy.igx-input-group--fluent [igxSuffix] {
  padding: 0.4210526316rem;
}
.igx-input-group--fluent.igx-input-group--search.igx-input-group--compact igx-suffix,
.igx-input-group--compact.igx-input-group--fluent igx-suffix,
.igx-input-group--compact.igx-input-group--fluent [igxSuffix] {
  padding: 0.3636363636rem;
}
.igx-input-group--box igx-prefix, .igx-input-group--border igx-prefix, .igx-input-group--indigo igx-prefix, .igx-input-group--search igx-prefix,
.igx-input-group--box [igxPrefix],
.igx-input-group--border [igxPrefix],
.igx-input-group--indigo [igxPrefix],
.igx-input-group--search [igxPrefix] {
  padding: 0 0.5rem 0 0;
}
.igx-input-group--box.igx-input-group--cosy igx-prefix, .igx-input-group--border.igx-input-group--cosy igx-prefix, .igx-input-group--indigo.igx-input-group--cosy igx-prefix, .igx-input-group--search.igx-input-group--cosy igx-prefix,
.igx-input-group--box.igx-input-group--cosy [igxPrefix],
.igx-input-group--border.igx-input-group--cosy [igxPrefix],
.igx-input-group--indigo.igx-input-group--cosy [igxPrefix],
.igx-input-group--search.igx-input-group--cosy [igxPrefix] {
  padding: 0 0.4210526316rem 0 0;
}
.igx-input-group--box.igx-input-group--compact igx-prefix, .igx-input-group--border.igx-input-group--compact igx-prefix, .igx-input-group--indigo.igx-input-group--compact igx-prefix, .igx-input-group--search.igx-input-group--compact igx-prefix,
.igx-input-group--box.igx-input-group--compact [igxPrefix],
.igx-input-group--border.igx-input-group--compact [igxPrefix],
.igx-input-group--indigo.igx-input-group--compact [igxPrefix],
.igx-input-group--search.igx-input-group--compact [igxPrefix] {
  padding: 0 0.3636363636rem 0 0;
}
.igx-input-group--box igx-suffix, .igx-input-group--border igx-suffix, .igx-input-group--indigo igx-suffix, .igx-input-group--search igx-suffix,
.igx-input-group--box [igxSuffix],
.igx-input-group--border [igxSuffix],
.igx-input-group--indigo [igxSuffix],
.igx-input-group--search [igxSuffix] {
  padding: 0;
}
.igx-input-group--invalid igx-prefix,
.igx-input-group--invalid [igxPrefix],
.igx-input-group--invalid igx-suffix,
.igx-input-group--invalid [igxSuffix] {
  color: var(--error-secondary-color);
}
.igx-input-group__border {
  height: 2px;
  /* 2px, when base is 16px */
  margin-top: -2px;
  /* 2px, when base is 16px */
  transform: scaleX(0);
  transform-origin: center;
  background: var(--focused-secondary-color);
}
.igx-input-group--focused .igx-input-group__border {
  transform: scaleX(1);
  transition: transform 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.igx-input-group--valid .igx-input-group__border {
  background: var(--success-secondary-color);
}
.igx-input-group--invalid .igx-input-group__border {
  background: var(--error-secondary-color);
}
.igx-input-group--border .igx-input-group__border, .igx-input-group--search .igx-input-group__border {
  display: none;
}
.igx-input-group__hint {
  position: relative;
  display: flex;
  padding-top: 0.375rem;
  justify-content: space-between;
}
.igx-input-group__hint > * {
  margin-right: 0.5rem;
}
.igx-input-group__hint > *:last-child {
  margin-right: 0;
}
.igx-input-group__hint:empty {
  display: none;
}
.igx-input-group--box .igx-input-group__hint, .igx-input-group--border .igx-input-group__hint, .igx-input-group--indigo .igx-input-group__hint, .igx-input-group--search .igx-input-group__hint, .igx-input-group--search.igx-input-group--fluent .igx-input-group__hint {
  margin-left: 0.75rem;
  /* 16px, base is 12px */
  margin-right: 0.75rem;
  /* 16px, base is 12px */
}
.igx-input-group--valid .igx-input-group__hint {
  color: var(--success-secondary-color);
}
.igx-input-group--invalid .igx-input-group__hint {
  color: var(--error-secondary-color);
}
.igx-input-group__hint-item--start, .igx-input-group__hint-item--end {
  display: flex;
  align-items: center;
  position: relative;
}
.igx-input-group__hint-item--start {
  justify-content: flex-start;
}
.igx-input-group__hint-item--end {
  justify-content: flex-end;
}
.igx-input-group__hint-item--start,
.igx-input-group__hint-item--end {
  width: 100%;
}
.igx-input-group--disabled igx-prefix, .igx-input-group--disabled.igx-input-group--required igx-prefix,
.igx-input-group--disabled [igxPrefix],
.igx-input-group--disabled igx-suffix,
.igx-input-group--disabled.igx-input-group--required igx-suffix,
.igx-input-group--disabled [igxSuffix] {
  color: var(--disabled-text-color);
}
.igx-input-group--bootstrap igx-prefix:first-child,
.igx-input-group--bootstrap [igxPrefix]:first-child {
  border-top-left-radius: var(--box-border-radius);
  border-bottom-left-radius: var(--box-border-radius);
}
.igx-input-group--bootstrap igx-suffix:last-child,
.igx-input-group--bootstrap [igxSuffix]:last-child {
  border-top-right-radius: var(--box-border-radius);
  border-bottom-right-radius: var(--box-border-radius);
}
.igx-input-group--bootstrap .igx-input-group__input:not(:first-child), .igx-input-group--bootstrap .igx-input-group__textarea:not(:first-child),
.igx-input-group--bootstrap .igx-input-group__file-input:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.igx-input-group--bootstrap .igx-input-group__input:not(:last-child), .igx-input-group--bootstrap .igx-input-group__textarea:not(:last-child),
.igx-input-group--bootstrap .igx-input-group__file-input:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__bundle {
  background-image: none;
}
.igx-input-group--bootstrap .igx-input-group__bundle {
  align-items: stretch;
  padding: 0;
  box-shadow: none;
  z-index: 0;
}
.igx-input-group--bootstrap .igx-input-group__bundle:hover {
  border: none;
  box-shadow: none;
}
.igx-input-group--bootstrap igx-prefix,
.igx-input-group--bootstrap [igxPrefix],
.igx-input-group--bootstrap igx-suffix,
.igx-input-group--bootstrap [igxSuffix] {
  border: 1px solid var(--border-color);
  padding: 0.5rem 1rem;
  z-index: -1;
  width: auto;
  height: auto;
  font-size: 1.25rem;
  line-height: 1.5;
  white-space: nowrap;
}
.igx-input-group--bootstrap igx-prefix igx-icon,
.igx-input-group--bootstrap [igxPrefix] igx-icon,
.igx-input-group--bootstrap igx-suffix igx-icon,
.igx-input-group--bootstrap [igxSuffix] igx-icon {
  width: 1.25rem;
  height: 1.25rem;
  font-size: 1.25rem;
  font-weight: 400;
}
.igx-input-group--bootstrap igx-prefix,
.igx-input-group--bootstrap [igxPrefix] {
  color: var(--input-prefix-color);
  background: var(--input-prefix-background);
  border-right: 0;
}
.igx-input-group--bootstrap igx-suffix,
.igx-input-group--bootstrap [igxSuffix] {
  color: var(--input-suffix-color);
  background: var(--input-suffix-background);
  border-left: 0;
}
.igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__bundle igx-prefix,
.igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__bundle [igxPrefix],
.igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__bundle igx-suffix,
.igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__bundle [igxSuffix] {
  border: 1px solid var(--disabled-border-color);
  color: var(--disabled-text-color);
}
.igx-input-group--cosy.igx-input-group--bootstrap igx-prefix,
.igx-input-group--cosy.igx-input-group--bootstrap [igxPrefix],
.igx-input-group--cosy.igx-input-group--bootstrap igx-suffix,
.igx-input-group--cosy.igx-input-group--bootstrap [igxSuffix] {
  padding: 0.375rem 0.75rem;
  width: auto;
  height: auto;
}
.igx-input-group--cosy.igx-input-group--bootstrap igx-prefix igx-icon,
.igx-input-group--cosy.igx-input-group--bootstrap [igxPrefix] igx-icon,
.igx-input-group--cosy.igx-input-group--bootstrap igx-suffix igx-icon,
.igx-input-group--cosy.igx-input-group--bootstrap [igxSuffix] igx-icon {
  width: 1rem;
  height: 1rem;
  font-size: 1rem;
}
.igx-input-group--compact.igx-input-group--bootstrap igx-prefix,
.igx-input-group--compact.igx-input-group--bootstrap [igxPrefix],
.igx-input-group--compact.igx-input-group--bootstrap igx-suffix,
.igx-input-group--compact.igx-input-group--bootstrap [igxSuffix] {
  padding: 0.25rem 0.5rem;
  width: auto;
  height: auto;
}
.igx-input-group--compact.igx-input-group--bootstrap igx-prefix igx-icon,
.igx-input-group--compact.igx-input-group--bootstrap [igxPrefix] igx-icon,
.igx-input-group--compact.igx-input-group--bootstrap igx-suffix igx-icon,
.igx-input-group--compact.igx-input-group--bootstrap [igxSuffix] igx-icon {
  width: 0.875rem;
  height: 0.875rem;
  font-size: 0.875rem;
}
.igx-input-group--bootstrap .igx-input-group__label, .igx-input-group--focused.igx-input-group--bootstrap .igx-input-group__label, .igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__label, .igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__label {
  position: static;
  display: block;
  color: var(--idle-secondary-color);
  padding: 0;
  line-height: normal !important;
  transform: translateY(0);
  transform-origin: top left;
  margin-top: 0 !important;
  margin-bottom: 0.5rem;
  height: auto;
  font-size: 1rem;
}
.igx-input-group--cosy.igx-input-group--bootstrap .igx-input-group__label {
  font-size: 0.875rem;
  margin-bottom: 0.375rem;
}
.igx-input-group--compact.igx-input-group--bootstrap .igx-input-group__label {
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}
.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--bootstrap .igx-input-group__textarea {
  height: auto;
  line-height: 1.5 !important;
  margin: 0;
  border-radius: var(--box-border-radius);
  border: 1px solid var(--border-color);
  font-size: 1.25rem;
  padding: 0.5rem 1rem;
}
.igx-input-group--bootstrap .igx-input-group__file-input {
  width: calc(100% - 2rem);
  height: inherit;
  border-radius: var(--box-border-radius);
  border: 1px solid var(--border-color);
  padding: 0.5rem 1rem;
}
.igx-input-group--focused.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--focused.igx-input-group--bootstrap .igx-input-group__file-input, .igx-input-group--focused.igx-input-group--bootstrap .igx-input-group__textarea {
  border: 1px solid var(--focused-secondary-color);
  box-shadow: 0 0 0 0.1875rem var(--focused-secondary-color);
}
.igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__input:hover, .igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__file-input, .igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__file-input:hover, .igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__textarea, .igx-input-group--valid.igx-input-group--bootstrap .igx-input-group__textarea:hover {
  border: 1px solid var(--success-secondary-color);
  box-shadow: 0 0 0 0.1875rem var(--success-secondary-color);
}
.igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__input:hover, .igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__file-input, .igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__file-input:hover, .igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__textarea, .igx-input-group--invalid.igx-input-group--bootstrap .igx-input-group__textarea:hover {
  border: 1px solid var(--error-secondary-color);
  box-shadow: 0 0 0 0.1875rem var(--error-secondary-color);
}
.igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__file-input, .igx-input-group--disabled.igx-input-group--bootstrap .igx-input-group__textarea {
  background: var(--border-disabled-background);
  border: 1px solid var(--disabled-border-color);
  box-shadow: none;
}
.igx-input-group--search.igx-input-group--bootstrap .igx-input-group__input {
  transform: translateY(0);
}
.igx-input-group--cosy.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--cosy.igx-input-group--bootstrap .igx-input-group__textarea {
  font-size: 1rem;
  padding: 0.375rem 0.75rem;
}
.igx-input-group--compact.igx-input-group--bootstrap .igx-input-group__input, .igx-input-group--compact.igx-input-group--bootstrap .igx-input-group__textarea {
  font-size: 0.875rem;
  padding: 0.25rem 0.5rem;
}
igx-list {
  --border-radius: var(--igx-list-border-radius, 0px);
  --item-border-radius: var(--igx-list-item-border-radius, 0px);
  --background: var(--igx-list-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --header-background: var(--igx-list-header-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --header-text-color: var(--igx-list-header-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --item-background: var(--igx-list-item-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --item-background-hover: var(--igx-list-item-background-hover, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --item-background-active: var(--igx-list-item-background-active, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --item-text-color: var(--igx-list-item-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-text-color-hover: var(--igx-list-item-text-color-hover, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-text-color-active: var(--igx-list-item-text-color-active, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-title-color: var(--igx-list-item-title-color, 'currentColor');
  --item-title-color-hover: var(--igx-list-item-title-color-hover, 'currentColor');
  --item-title-color-active: var(--igx-list-item-title-color-active, 'currentColor');
  --item-action-color: var(--igx-list-item-action-color, 'currentColor');
  --item-action-color-hover: var(--igx-list-item-action-color-hover, 'currentColor');
  --item-action-color-active: var(--igx-list-item-action-color-active, 'currentColor');
  --item-subtitle-color: var(--igx-list-item-subtitle-color, 'currentColor');
  --item-subtitle-color-hover: var(--igx-list-item-subtitle-color-hover, 'currentColor');
  --item-subtitle-color-active: var(--igx-list-item-subtitle-color-active, 'currentColor');
  --item-thumbnail-color: var(--igx-list-item-thumbnail-color, 'currentColor');
  --item-thumbnail-color-hover: var(--igx-list-item-thumbnail-color-hover, 'currentColor');
  --item-thumbnail-color-active: var(--igx-list-item-thumbnail-color-active, 'currentColor');
  --border-color: var(--igx-list-border-color, transparent);
  --border-width: var(--igx-list-border-width, 0);
}
.igx-list, .igx-list--empty, .igx-list--compact, .igx-list--cosy {
  position: relative;
  display: flex;
  flex-flow: column nowrap;
  background: var(--background);
  height: 100%;
  overflow: hidden;
  z-index: 0;
  border-radius: var(--border-radius);
}
.igx-list--empty {
  justify-content: center;
  align-items: center;
}
.igx-list--empty .igx-list__message {
  text-align: center;
  color: var(--item-text-color);
  padding: 1rem;
  z-index: 1;
}
.igx-list__header {
  display: flex;
  align-items: center;
  color: var(--header-text-color);
  background: var(--header-background);
  padding: 0.5rem 1rem;
  -webkit-user-select: none;
          user-select: none;
}
.igx-list--cosy .igx-list__header {
  padding: 0.25rem 0.5rem;
}
.igx-list--compact .igx-list__header {
  padding: 0.125rem 0.25rem;
}
.igx-list__item-base {
  display: flex;
  flex-flow: column wrap;
  justify-content: center;
  border-radius: var(--item-border-radius);
  color: var(--item-text-color);
  background: var(--item-background);
}
.igx-list__item-base:hover {
  color: var(--item-text-color-hover);
  background: var(--item-background-hover);
}
.igx-list__item-base:hover .igx-list__item-lines {
  color: currentColor;
}
.igx-list__item-base:hover .igx-list__item-line-title {
  color: var(--item-title-color-hover);
}
.igx-list__item-base:hover .igx-list__item-line-subtitle {
  color: var(--item-subtitle-color-hover);
}
.igx-list__item-base:hover .igx-list__item-actions {
  color: var(--item-action-color-hover);
}
.igx-list__item-base:hover .igx-list__item-actions igx-icon {
  color: var(--item-action-color-hover);
}
.igx-list__item-base:hover .igx-list__item-thumbnail {
  color: var(--item-thumbnail-color-hover);
}
.igx-list__item-base:hover .igx-list__item-thumbnail igx-icon {
  color: var(--item-thumbnail-color-hover);
}
.igx-list__item-right, .igx-list__item-left {
  position: absolute;
  visibility: hidden;
  display: flex;
  z-index: 1;
}
.igx-list__item-lines {
  color: currentColor;
  display: flex;
  flex-direction: column;
  flex: 1 0 0%;
}
.igx-list__item-lines:empty {
  display: none;
}
.igx-list__item-line-subtitle {
  color: var(--item-subtitle-color);
  opacity: 0.74;
}
.igx-list__item-line-title {
  color: var(--item-title-color);
}
.igx-list__item-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--item-action-color);
}
.igx-list__item-actions > * {
  margin-left: 0.5rem;
}
.igx-list__item-actions:empty {
  display: none;
}
.igx-list__item-actions igx-icon {
  color: var(--item-action-color);
}
.igx-list__item-content, .igx-list__item-content:active {
  display: flex;
  align-items: center;
  position: relative;
  padding: 0.5rem 1rem;
  border-radius: var(--item-border-radius);
  background: inherit;
  z-index: 2;
}
.igx-list--compact .igx-list__item-content {
  padding: 0.125rem 0.25rem;
}
.igx-list--cosy .igx-list__item-content {
  padding: 0.25rem 0.5rem;
}
.igx-list__item-thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: 0;
  color: var(--item-thumbnail-color);
}
.igx-list__item-thumbnail > igx-icon {
  margin: 0.5rem 1rem 0.5rem 0;
}
.igx-list__item-thumbnail > igx-avatar > igx-icon {
  margin: 0;
}
.igx-list__item-thumbnail:empty {
  display: none;
}
.igx-list__item-thumbnail:not(:empty) + .igx-list__item-lines {
  margin: 0 0 0 1rem;
}
.igx-list--cosy .igx-list__item-thumbnail:not(:empty) + .igx-list__item-lines {
  margin: 0 0 0 0.75rem;
}
.igx-list--compact .igx-list__item-thumbnail:not(:empty) + .igx-list__item-lines {
  margin: 0 0 0 0.5rem;
}
.igx-list--cosy .igx-list__item-thumbnail > igx-icon {
  margin: 0.375rem 0.5rem 0.375rem 0;
}
.igx-list--compact .igx-list__item-thumbnail > igx-icon {
  margin: 0.25rem 0.25rem 0.25rem 0;
}
.igx-list--cosy .igx-list__item-actions > * {
  margin-left: 0.375rem;
}
.igx-list--compact .igx-list__item-actions > * {
  margin-left: 0.25rem;
}
.igx-list__item-lines + .igx-list__item-actions {
  margin-left: 0.5rem;
}
.igx-list__item-content:active {
  color: var(--item-text-color-active);
  background: var(--item-background-active);
  z-index: 3;
}
.igx-list__item-content:active .igx-list__item-line-title {
  color: var(--item-title-color-active);
}
.igx-list__item-content:active .igx-list__item-line-subtitle {
  color: var(--item-subtitle-color-active);
}
.igx-list__item-content:active .igx-list__item-actions {
  color: var(--item-action-color-active);
}
.igx-list__item-content:active .igx-list__item-actions igx-icon {
  color: var(--item-action-color-active);
}
.igx-list__item-content:active .igx-list__item-thumbnail {
  color: var(--item-thumbnail-color-active);
}
.igx-list__item-content:active .igx-list__item-thumbnail igx-icon {
  color: var(--item-thumbnail-color-active);
}
.igx-list__item-content:not(:active) {
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
igx-navbar {
  --background: var(--igx-navbar-background, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --text-color: var(--igx-navbar-text-color, var(--igx-primary-500-contrast));
  --idle-icon-color: var(--igx-navbar-idle-icon-color, var(--igx-primary-500-contrast));
  --hover-icon-color: var(--igx-navbar-hover-icon-color, var(--igx-primary-500-contrast));
  --shadow: var(--igx-navbar-shadow, var(--igx-elevation-4));
}
.igx-navbar {
  display: flex;
  position: relative;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 56px;
  max-height: 128px;
  padding: 1rem;
  background: var(--background);
  color: var(--text-color);
  box-shadow: var(--shadow);
  z-index: 4;
  overflow: hidden;
}
igx-navbar-title,
[igxNavbarTitle], igx-navbar-action,
[igxNavbarAction], .igx-navbar__right, .igx-navbar__left {
  display: flex;
  align-items: center;
}
igx-navbar-title,
[igxNavbarTitle], .igx-navbar__title {
  display: -webkit-inline-box;
  -webkit-line-clamp: 4;
  overflow: hidden;
  margin: 0;
  flex-grow: 1;
  -webkit-user-select: text;
          user-select: text;
  display: flex;
  flex-direction: row;
}
.igx-navbar__right, .igx-navbar__left {
  -webkit-user-select: none;
          user-select: none;
}
.igx-navbar__right > * + *, .igx-navbar__left > * + * {
  margin-left: 1rem;
}
.igx-navbar__right > igx-icon, .igx-navbar__left > igx-icon {
  cursor: pointer;
  color: var(--idle-icon-color);
  transition: color 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-navbar__right > igx-icon:hover, .igx-navbar__left > igx-icon:hover {
  color: var(--hover-icon-color);
}
.igx-navbar__left {
  flex-grow: 1;
}
igx-nav-drawer {
  --border-radius: var(--igx-nav-drawer-border-radius, 0px);
  --item-border-radius: var(--igx-nav-drawer-item-border-radius, 4px);
  --background: var(--igx-nav-drawer-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --border-color: var(--igx-nav-drawer-border-color, hsla(var(--igx-grays-900), 0.14));
  --item-header-text-color: var(--igx-nav-drawer-item-header-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --item-text-color: var(--igx-nav-drawer-item-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-icon-color: var(--igx-nav-drawer-item-icon-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-active-text-color: var(--igx-nav-drawer-item-active-text-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --item-active-background: var(--igx-nav-drawer-item-active-background, hsla(var(--igx-primary-500), 0.12));
  --item-hover-background: var(--igx-nav-drawer-item-hover-background, hsla(var(--igx-grays-200), 0.8));
  --item-hover-text-color: var(--igx-nav-drawer-item-hover-text-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --item-active-icon-color: var(--igx-nav-drawer-item-active-icon-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --item-hover-icon-color: var(--igx-nav-drawer-item-hover-icon-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --shadow: var(--igx-nav-drawer-shadow, var(--igx-elevation-16));
}
.igx-nav-drawer {
  transition: flex-basis;
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  flex-shrink: 0;
}
.igx-nav-drawer__aside {
  position: fixed;
  height: 100%;
  max-width: 90%;
  min-height: 100%;
  overflow-x: hidden;
  background: var(--background);
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  transition: width, transform;
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94), cubic-bezier(0.25, 0.46, 0.45, 0.94);
  box-shadow: var(--shadow);
  border-right: 1px solid var(--border-color);
  border-radius: var(--border-radius);
}
.igx-nav-drawer__aside.panning {
  overflow-x: hidden;
  transition: none;
}
.igx-nav-drawer__aside--pinned {
  position: relative;
  max-width: 100%;
  box-shadow: none;
  z-index: 0;
}
.igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right {
  transform: translate3d(300px, 0, 0);
  box-shadow: none;
}
.igx-nav-drawer__aside--pinned.igx-nav-drawer__aside--collapsed {
  transform: none;
  width: 0;
  overflow: hidden;
  border: none;
}
.igx-nav-drawer__aside--collapsed {
  transform: translate3d(-300px, 0, 0);
  box-shadow: none;
}
.igx-nav-drawer__aside--right {
  left: auto;
  right: 0;
  border-right: none;
  border-left: 1px solid var(--border-color);
}
.igx-nav-drawer__aside--mini {
  width: 3.75rem;
  transition-duration: 0.2s, 0.2s;
}
.igx-nav-drawer__aside--mini .igx-nav-drawer__item, .igx-nav-drawer__aside--mini .igx-nav-drawer__item--active {
  justify-content: center;
}
.igx-nav-drawer__aside--normal {
  width: 15.125rem;
  transition-duration: 0.3s, 0.3s;
}
.igx-nav-drawer__overlay {
  opacity: 1;
  background: hsla(var(--igx-grays-500), 0.54);
  transition: opacity, visibility;
  transition-duration: 0.25s, 0.25s;
  transition-timing-function: ease-in, step-start;
  transition-delay: 0s, 0s;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  visibility: visible;
  z-index: 999;
}
.igx-nav-drawer__overlay.panning {
  transform: translate3d(0, 0, 0);
  transition: none;
}
.igx-nav-drawer__overlay--hidden {
  transition-timing-function: ease-in-out, step-end;
  visibility: hidden;
  opacity: 0;
}
.igx-nav-drawer__overlay.panning.igx-nav-drawer__overlay--hidden {
  /* must be visible during pan.. */
  visibility: visible;
}
.igx-nav-drawer__item, .igx-nav-drawer__item--active {
  position: relative;
  display: flex;
  align-items: center;
  flex-flow: row nowrap;
  color: var(--item-text-color);
  max-height: 3rem;
  min-width: 2rem;
  margin: 0.5rem !important;
  padding: 0.75rem 0.5rem;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  outline: transparent;
  white-space: nowrap;
  border-radius: var(--item-border-radius);
  text-decoration: none;
  width: calc(100% - 1rem);
  border: none;
  justify-content: flex-start;
}
.igx-nav-drawer__item > igx-icon + span, .igx-nav-drawer__item--active > igx-icon + span {
  margin-left: 2rem;
}
.igx-nav-drawer__item igx-icon, .igx-nav-drawer__item--active igx-icon {
  color: var(--item-icon-color);
}
[igxButton].igx-nav-drawer__item, [igxButton].igx-nav-drawer__item--active {
  background: transparent;
  border: none;
  box-shadow: none;
}
[igxButton].igx-nav-drawer__item igx-icon, [igxButton].igx-nav-drawer__item--active igx-icon {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1.5rem;
  margin: 0;
}
[igxButton].igx-nav-drawer__item:hover, [igxButton].igx-nav-drawer__item--active:hover, [igxButton].igx-nav-drawer__item:focus, [igxButton].igx-nav-drawer__item--active:focus {
  box-shadow: none;
  border: none;
}
.igx-nav-drawer__item.igx-button--fab, .igx-nav-drawer__item--active.igx-button--fab {
  min-height: auto;
}
.igx-nav-drawer__item.igx-button--icon, .igx-nav-drawer__item--active.igx-button--icon {
  height: auto;
  transition: none;
}
.igx-nav-drawer__item:hover, .igx-nav-drawer__item--active:hover, .igx-nav-drawer__item:focus, .igx-nav-drawer__item--active:focus {
  background: var(--item-hover-background);
  color: var(--item-hover-text-color);
  box-shadow: none;
}
.igx-nav-drawer__item:hover igx-icon, .igx-nav-drawer__item--active:hover igx-icon, .igx-nav-drawer__item:focus igx-icon, .igx-nav-drawer__item--active:focus igx-icon {
  color: var(--item-hover-icon-color);
}
.igx-nav-drawer__item--active {
  color: var(--item-active-text-color);
  background: var(--item-active-background);
}
.igx-nav-drawer__item--active igx-icon {
  color: var(--item-active-icon-color);
}
[igxButton].igx-nav-drawer__item--active {
  box-shadow: none;
}
[igxButton].igx-nav-drawer__item--active igx-icon {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1.5rem;
  margin: 0;
}
[igxButton].igx-nav-drawer__item--active:hover, [igxButton].igx-nav-drawer__item--active:focus {
  box-shadow: none;
  border: none;
}
.igx-nav-drawer__item--active:focus, .igx-nav-drawer__item--active:hover {
  color: var(--item-active-text-color);
  background: var(--item-active-background);
}
.igx-nav-drawer__item--active:focus igx-icon, .igx-nav-drawer__item--active:hover igx-icon {
  color: var(--item-active-icon-color);
}
.igx-nav-drawer__item--header {
  display: block;
  padding: 0.75rem 1rem;
  white-space: nowrap;
  color: var(--item-header-text-color);
}
.igx-nav-drawer__style-dummy {
  height: 0;
  background: none;
  box-shadow: none;
  transition: none;
  visibility: hidden;
}
.igx-nav-drawer--disable-animation {
  transition-duration: 0s;
}
.igx-overlay__wrapper--modal, .igx-overlay__content--modal {
  --background-color: var(--igx-overlay-background-color, hsla(var(--igx-grays-500), 0.54));
}
.igx-overlay {
  width: 0;
  height: 0;
  box-sizing: content-box;
}
.igx-overlay__wrapper, .igx-overlay__wrapper--modal, .igx-overlay__wrapper--flex, .igx-overlay__wrapper--flex-container {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: transparent;
  transition: background 0.25s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  pointer-events: none;
  z-index: 10005;
  box-sizing: content-box;
}
.igx-overlay__wrapper--modal {
  background: var(--background-color);
  pointer-events: initial;
}
.igx-overlay__wrapper--flex {
  display: flex;
}
.igx-overlay__wrapper--flex-container {
  display: flex;
  position: absolute;
}
.igx-overlay__content, .igx-overlay__content--modal, .igx-overlay__content--elastic, .igx-overlay__content--relative {
  position: absolute;
  pointer-events: all;
  box-sizing: content-box;
}
.igx-overlay__content--modal {
  pointer-events: initial;
}
.igx-overlay__content--elastic {
  overflow: auto;
}
.igx-overlay__content--relative {
  position: relative;
}
.igx-toggle--hidden {
  display: none !important;
}
igx-paginator {
  --text-color: var(--igx-paginator-text-color, hsla(var(--igx-grays-800), var(--igx-grays-a)));
  --background-color: var(--igx-paginator-background-color, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --border-color: var(--igx-paginator-border-color, hsla(var(--igx-grays-200), var(--igx-grays-a)));
}
.igx-paginator, .igx-paginator--cosy, .igx-paginator--compact {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--text-color);
  background: var(--background-color);
  grid-row: 7;
  font-size: 12px;
  border-top: 1px solid var(--border-color);
  z-index: 1;
  padding: 0 1.5rem;
  height: 3.5rem;
  width: 100%;
}
.igx-paginator:empty, .igx-paginator--cosy:empty, .igx-paginator--compact:empty {
  padding: 0;
}
.igx-paginator--cosy {
  padding: 0 1rem;
  height: 3rem;
}
.igx-paginator--compact {
  padding: 0 0.75rem;
  height: 2.75rem;
}
.igx-paginator-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.igx-page-size {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex: 1;
}
.igx-page-size__label {
  margin-right: 8px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.igx-page-size__select {
  display: flex;
  max-width: 90px;
  min-width: 80px;
}
.igx-page-nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex: 1;
}
.igx-page-nav > * {
  margin-left: 0.5rem;
}
.igx-page-nav__text {
  display: flex;
}
@keyframes rotate-center {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
igx-circular-bar {
  --track-border-radius: var(--igx-circular-bar-track-border-radius, 0);
  --base-circle-color: var(--igx-circular-bar-base-circle-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --progress-circle-color: var(--igx-circular-bar-progress-circle-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --text-color: var(--igx-circular-bar-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --progress-circle-color-start: var(--igx-circular-bar-progress-circle-color-start, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --progress-circle-color-end: var(--igx-circular-bar-progress-circle-color-end, hsla(var(--igx-primary-500), var(--igx-primary-a)));
}
.igx-circular-bar {
  display: inline-flex;
  flex: 1 1 auto;
  width: 2rem;
  height: 2rem;
}
.igx-circular-bar svg {
  width: 100%;
  height: 100%;
  min-width: inherit;
  min-height: inherit;
}
.igx-circular-bar--indeterminate {
  animation: rotate-center 3s linear normal infinite;
  transform-origin: 50% 50%;
}
.igx-circular-bar__inner {
  stroke-width: 0.25rem;
  fill: transparent;
  stroke: var(--base-circle-color);
}
.igx-circular-bar__outer {
  fill: transparent;
  stroke-width: 0.25rem;
  stroke-dashoffset: 289;
  stroke-dasharray: 289;
  transform-origin: 50% 50%;
  transform: rotate(-90deg);
}
.igx-circular-bar--indeterminate .igx-circular-bar__outer {
  stroke-dasharray: 289;
  animation: indeterminate-accordion 1.5s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;
}
.igx-circular-bar__text {
  font-size: 2rem;
  font-weight: 600;
  fill: var(--text-color);
}
.igx-circular-bar--indeterminate .igx-circular-bar__text {
  visibility: hidden;
}
.igx-circular-bar__gradient-start {
  stop-color: var(--progress-circle-color-start);
}
.igx-circular-bar__gradient-end {
  stop-color: var(--progress-circle-color-end);
}
@keyframes indeterminate-accordion {
  from {
    stroke-dashoffset: 578;
    stroke-dasharray: 259;
  }
  to {
    stroke-dashoffset: 120;
  }
}
igx-linear-bar {
  --track-border-radius: var(--igx-linear-bar-track-border-radius, 0px);
  --track-color: var(--igx-linear-bar-track-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --fill-color-default: var(--igx-linear-bar-fill-color-default, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --fill-color-danger: var(--igx-linear-bar-fill-color-danger, hsla(var(--igx-error-500), var(--igx-error-a)));
  --fill-color-warning: var(--igx-linear-bar-fill-color-warning, hsla(var(--igx-warn-500), var(--igx-warn-a)));
  --fill-color-info: var(--igx-linear-bar-fill-color-info, hsla(var(--igx-info-500), var(--igx-info-a)));
  --fill-color-success: var(--igx-linear-bar-fill-color-success, hsla(var(--igx-success-500), var(--igx-success-a)));
  --stripes-color: var(--igx-linear-bar-stripes-color, hsla(var(--igx-grays-50), 0.7));
  --text-color: var(--igx-linear-bar-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
}
.igx-linear-bar {
  position: relative;
  display: flex;
  width: 100%;
  flex: 1 1 100%;
  flex-direction: column;
}
.igx-linear-bar__base {
  position: relative;
  width: inherit;
  height: 0.25rem;
  background: var(--track-color);
  overflow: hidden;
  border-radius: var(--track-border-radius);
  z-index: 0;
}
.igx-linear-bar__indicator {
  width: 100%;
  position: relative;
  height: inherit;
}
.igx-linear-bar--striped .igx-linear-bar__indicator {
  background-image: linear-gradient(-45deg, var(--stripes-color) 25%, transparent 25%, transparent 50%, var(--stripes-color) 50%, var(--stripes-color) 75%, transparent 75%, transparent);
  background-size: 2.5rem 2.5rem;
}
.igx-linear-bar--indeterminate .igx-linear-bar__indicator {
  animation: indeterminate-bar 2s cubic-bezier(0, 0.085, 0.68, 0.53) normal infinite;
  width: 100% !important;
}
.igx-linear-bar--indeterminate .igx-linear-bar__indicator::before {
  position: absolute;
  content: "";
  top: 0;
  left: -200%;
  width: 100%;
  height: inherit;
  background-color: inherit;
  transform-origin: top right;
}
.igx-linear-bar__indicator {
  background: var(--fill-color-default);
}
.igx-linear-bar--danger .igx-linear-bar__indicator {
  background-color: var(--fill-color-danger);
}
.igx-linear-bar--warning .igx-linear-bar__indicator {
  background-color: var(--fill-color-warning);
}
.igx-linear-bar--info .igx-linear-bar__indicator {
  background-color: var(--fill-color-info);
}
.igx-linear-bar--success .igx-linear-bar__indicator {
  background-color: var(--fill-color-success);
}
.igx-linear-bar__value, .igx-linear-bar__value--start, .igx-linear-bar__value--center, .igx-linear-bar__value--end, .igx-linear-bar__value--top, .igx-linear-bar__value--hidden, .igx-linear-bar--indeterminate .igx-linear-bar__value {
  margin: 0;
  color: var(--text-color);
  font-size: 0.875em;
  font-weight: 600;
}
.igx-linear-bar__value, .igx-linear-bar__value--start {
  align-self: flex-start;
}
.igx-linear-bar__value--center {
  align-self: center;
}
.igx-linear-bar__value--end {
  align-self: flex-end;
}
.igx-linear-bar__value--top {
  order: -1;
}
.igx-linear-bar__value--hidden, .igx-linear-bar--indeterminate .igx-linear-bar__value {
  display: none;
}
@keyframes indeterminate-bar {
  0% {
    transform: scaleX(0) translateX(-100%);
    transform-origin: left;
  }
  50% {
    transform: scaleX(1) translateX(50%);
    transform-origin: right;
  }
  100% {
    transform: scaleX(0) translateX(200%);
    transform-origin: right;
  }
}
igx-radio {
  --hover-color: var(--igx-radio-hover-color, transparent);
  --fill-hover-border-color: var(--igx-radio-fill-hover-border-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --label-color: var(--igx-radio-label-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --empty-color: var(--igx-radio-empty-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --fill-color: var(--igx-radio-fill-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --fill-color-hover: var(--igx-radio-fill-color-hover, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --disabled-color: var(--igx-radio-disabled-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
}
.igx-radio {
  position: relative;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  color: var(--label-color);
}
.igx-radio__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: none;
  clip: rect(0, 0, 0, 0);
  outline: 0;
  pointer-events: none;
  overflow: hidden;
  -webkit-appearance: none;
          appearance: none;
}
.igx-radio--disabled {
  pointer-events: none;
  color: var(--disabled-color);
  -webkit-user-select: none;
          user-select: none;
}
.igx-radio__composite {
  position: relative;
  display: inline-block;
  width: 1.25em;
  height: 1.25em;
  min-width: 1.25em;
  line-height: 1.25em;
  cursor: pointer;
  color: var(--label-color);
  -webkit-user-select: none;
          user-select: none;
}
.igx-radio__composite::before, .igx-radio__composite::after {
  position: absolute;
  content: "";
  width: 1.25em;
  height: 1.25em;
  left: 0;
  top: 0;
  border-radius: 50% 50%;
}
.igx-radio__composite::before {
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transform: scale(0);
  transition: all 0.2s ease-in;
  z-index: 1;
}
.igx-radio__composite::after {
  border: 0.125rem solid var(--empty-color);
}
.igx-radio--checked .igx-radio__composite::before {
  border: 0.125rem solid var(--fill-color);
  background: var(--fill-color-hover);
  transform: scale(0.5);
}
.igx-radio--checked .igx-radio__composite::after {
  border: 0.125rem solid var(--fill-color);
}
.igx-radio:hover .igx-radio__composite::before, .igx-radio:active .igx-radio__composite::before {
  background: var(--fill-color-hover);
}
.igx-radio--checked:hover .igx-radio__composite::before, .igx-radio--checked:active .igx-radio__composite::before {
  background: var(--fill-color-hover);
  border-color: var(--fill-hover-border-color);
}
.igx-radio--checked:hover .igx-radio__composite::after, .igx-radio--checked:active .igx-radio__composite::after {
  border-color: var(--fill-hover-border-color);
}
.igx-radio--disabled .igx-radio__composite::after {
  border: 0.125rem solid var(--disabled-color);
}
.igx-radio--checked.igx-radio--disabled .igx-radio__composite::after {
  border: 0.125rem solid var(--disabled-color);
}
.igx-radio--checked.igx-radio--disabled .igx-radio__composite::before {
  background: var(--disabled-color);
  border: 0.125rem solid transparent;
}
.igx-radio__label, .igx-radio__label--before {
  color: currentColor;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  word-wrap: break-all;
}
.igx-radio__label:empty, .igx-radio__label--before:empty {
  display: none;
}
.igx-radio__label {
  margin-left: 0.5em;
}
.igx-radio__label--before {
  order: -1;
  margin-right: 0.5em;
}
.igx-radio__label--before:empty,
.igx-radio__label:empty {
  margin: 0;
}
.igx-radio__ripple {
  display: block;
  position: absolute;
  top: calc(50% - 1.5em);
  left: calc(50% - 1.5em);
  width: 3em;
  height: 3em;
  border-radius: 1.5em;
  overflow: hidden;
  pointer-events: none;
  filter: opacity(1);
}
.igx-radio__ripple,
.igx-radio__ripple [igxRipple] {
  --color: var(--igx-ripple-color, var(--fill-color));
}
.igx-radio__ripple .igx-ripple__inner {
  display: block;
  position: absolute;
  border-radius: 50%;
  background: var(--color);
  pointer-events: none;
  transform-origin: center;
  transform: translate3d(0, 0, 0) scale(0);
  will-change: opacity, transform;
  opacity: 0.5;
  margin: 0 !important;
  border: none !important;
}
.igx-radio__ripple .igx-ripple {
  overflow: hidden;
}
.igx-radio__ripple,
.igx-radio__ripple [igxRipple] {
  --color: var(--igx-ripple-color, var(--fill-color));
}
.igx-radio--focused .igx-radio__ripple, .igx-radio--focused.igx-radio--checked .igx-radio__ripple {
  background: var(--empty-color);
  transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 0.12;
}
.igx-radio--focused.igx-radio--checked .igx-radio__ripple {
  background: var(--fill-color);
}
.igx-radio:hover .igx-radio__ripple::after, .igx-radio:active .igx-radio__ripple::after, .igx-radio--checked:hover .igx-radio__ripple::after, .igx-radio--checked:active .igx-radio__ripple::after {
  position: absolute;
  content: "";
  opacity: 0.06;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.igx-radio:hover .igx-radio__ripple::after, .igx-radio:active .igx-radio__ripple::after {
  background: var(--empty-color);
}
.igx-radio--checked:hover .igx-radio__ripple::after, .igx-radio--checked:active .igx-radio__ripple::after {
  background: var(--fill-color);
}
.igx-radio:active .igx-radio__ripple::after, .igx-radio--checked:active .igx-radio__ripple::after {
  opacity: 0.12;
}
.igx-scrollbar {
  --size: var(--igx-scrollbar-size, 16px);
  --thumb-background: var(--igx-scrollbar-thumb-background, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --track-background: var(--igx-scrollbar-track-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
}
.igx-scrollbar {
  scrollbar-width: var(--size);
  scrollbar-color: var(--thumb-background) var(--track-background);
}
.igx-scrollbar ::-webkit-scrollbar {
  width: var(--size);
  height: var(--size);
  background: var(--track-background);
}
.igx-scrollbar ::-webkit-scrollbar-thumb {
  background: var(--thumb-background);
}
@media (hover: none) {
  .igx-scrollbar ::-webkit-scrollbar {
    width: auto;
    height: auto;
  }
}
igx-slider {
  --tick-color: var(--igx-slider-tick-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --thumb-focus-color: var(--igx-slider-thumb-focus-color, transparent);
  --tick-color-tall: var(--igx-slider-tick-color-tall, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --tick-label-color: var(--igx-slider-tick-label-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --tick-label-color-tall: var(--igx-slider-tick-label-color-tall, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --track-color: var(--igx-slider-track-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --track-step-color: var(--igx-slider-track-step-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --thumb-color: var(--igx-slider-thumb-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --thumb-border-color: var(--igx-slider-thumb-border-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --label-background-color: var(--igx-slider-label-background-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --label-text-color: var(--igx-slider-label-text-color, var(--igx-secondary-500-contrast));
  --disabled-thumb-color: var(--igx-slider-disabled-thumb-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --disabled-base-track-color: var(--igx-slider-disabled-base-track-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --thumb-disabled-border-color: var(--igx-slider-thumb-disabled-border-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --base-track-color: var(--igx-slider-base-track-color, hsla(var(--igx-secondary-500), 0.24));
  --base-track-hover-color: var(--igx-slider-base-track-hover-color, hsla(var(--igx-secondary-500), 0.24));
  --track-hover-color: var(--igx-slider-track-hover-color, hsla(var(--igx-secondary-400), var(--igx-secondary-a)));
}
.igx-slider {
  display: flex;
  position: relative;
  height: 3rem;
  flex-grow: 1;
  align-items: center;
  transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-slider:hover .igx-slider__track-fill {
  background: var(--track-hover-color);
}
.igx-slider:hover .igx-slider__track {
  background: var(--base-track-hover-color);
}
.igx-slider:hover .igx-slider-thumb-from__dot::before, .igx-slider:hover .igx-slider-thumb-to__dot::before {
  border-color: var(--track-hover-color);
}
.igx-slider--disabled:hover .igx-slider__track {
  background: var(--disabled-base-track-color);
}
.igx-slider--disabled:hover .igx-slider-thumb-from__dot::before, .igx-slider--disabled:hover .igx-slider-thumb-to__dot::before {
  border-color: var(--thumb-disabled-border-color);
}
.igx-slider__thumbs {
  position: absolute;
  width: 100%;
  height: 0;
  cursor: default;
  z-index: 1;
  left: 0;
}
.igx-slider__track {
  position: relative;
  width: 100%;
  height: 0.125rem;
  background: var(--base-track-color);
  transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-slider--disabled .igx-slider__track {
  background: var(--disabled-base-track-color);
}
.igx-slider__track-fill {
  position: absolute;
  width: 100%;
  height: inherit;
  background: var(--track-color);
  transform-origin: left center;
  transform: scaleX(0);
}
.igx-slider--disabled .igx-slider__track-fill {
  visibility: hidden;
}
.igx-slider__ticks {
  width: 100%;
  display: flex;
  position: absolute;
  top: 0.25rem;
  justify-content: space-between;
  z-index: -1;
}
.igx-slider__ticks.igx-slider__ticks--top {
  bottom: 0.25rem;
  top: auto;
  align-items: flex-end;
}
.igx-slider__ticks-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.igx-slider__ticks-group:first-of-type {
  margin-left: -0.0625rem;
}
.igx-slider__ticks-group:last-of-type {
  margin-left: -0.0625rem;
}
.igx-slider__ticks-label {
  color: var(--tick-label-color);
  position: absolute;
  top: 1rem;
  transform: translate(-50%);
  line-height: 0.7;
  opacity: 1;
  transition: opacity 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-slider__ticks-tick {
  background: var(--tick-color);
  height: 0.5rem;
  width: 0.125rem;
}
.igx-slider__ticks--tall .igx-slider__ticks-label {
  top: calc(1rem + 0.5rem);
}
.igx-slider--disabled .igx-slider__ticks-tick {
  background: var(--disabled-base-track-color) !important;
}
.igx-slider--disabled .igx-slider__ticks-label {
  color: var(--disabled-base-track-color) !important;
}
.igx-slider__ticks-group--tall .igx-slider__ticks-tick {
  height: 1rem;
  background: var(--tick-color-tall);
}
.igx-slider__ticks-group--tall .igx-slider__ticks-label {
  top: calc(1rem + 0.5rem);
  color: var(--tick-label-color-tall);
}
.igx-slider__ticks--top .igx-slider__ticks-label {
  bottom: calc(0.5rem + 0.5rem);
  top: auto;
}
.igx-slider__ticks--top.igx-slider__ticks--tall .igx-slider__ticks-label {
  bottom: calc(1rem + 0.5rem);
  top: auto;
}
.igx-slider__tick-label--hidden {
  opacity: 0;
}
.igx-slider__track-steps {
  position: absolute;
  width: 100%;
  height: 0.125rem;
  transition: opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: 1;
}
.igx-slider--disabled .igx-slider__track-steps {
  visibility: hidden;
}
.igx-slider__tick-labels--top-bottom .igx-slider__ticks-group {
  display: block;
}
.igx-slider__tick-labels--top-bottom .igx-slider__ticks-label {
  writing-mode: vertical-rl;
  transform: translate(-50%) rotate(0deg);
}
.igx-slider__tick-labels--top-bottom .igx-slider__ticks--tall .igx-slider__ticks-label {
  top: calc(1rem + 0.125rem);
}
.igx-slider__tick-labels--top-bottom.igx-slider__ticks--top .igx-slider__ticks-label {
  writing-mode: vertical-rl;
  transform: translate(-50%) rotate(0deg);
}
.igx-slider__tick-labels--top-bottom.igx-slider__ticks--top .igx-slider__ticks--tall .igx-slider__ticks-label {
  bottom: calc(1rem + 0.125rem);
}
.igx-slider__tick-labels--bottom-top .igx-slider__ticks-group {
  display: block;
}
.igx-slider__tick-labels--bottom-top .igx-slider__ticks-label {
  writing-mode: vertical-rl;
  transform: translate(-50%) rotate(180deg);
}
.igx-slider__tick-labels--bottom-top.igx-slider__ticks--top .igx-slider__ticks-label {
  writing-mode: vertical-rl;
  transform: translate(-50%) rotate(180deg);
}
.igx-slider__tick-labels--bottom-top.igx-slider__ticks--top .igx-slider__ticks--tall .igx-slider__ticks-label {
  bottom: calc(1rem + 0.125rem);
}
.igx-slider-thumb-from, .igx-slider-thumb-to {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 40px;
  height: 40px;
  outline-style: none;
  top: -1.25rem;
  margin-left: -1.25rem;
}
.igx-slider-thumb-from:focus div::after, .igx-slider-thumb-to:focus div::after {
  opacity: 0.18;
  /* 32 / 40 */
  transform: scale(0.8);
}
.igx-slider-thumb-from:focus div::before, .igx-slider-thumb-to:focus div::before {
  box-shadow: 0 0 0 0.1875rem var(--thumb-focus-color);
}
.igx-slider-thumb-from--disabled:focus div::before, .igx-slider-thumb-to--disabled:focus div::before {
  box-shadow: none;
}
.igx-slider-thumb-from--disabled:focus div::after, .igx-slider-thumb-to--disabled:focus div::after {
  transform: scale(0);
}
.igx-slider-thumb-label-from, .igx-slider-thumb-label-to {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  height: 40px;
  outline-style: none;
  top: -1.25rem;
  margin: 0 auto;
}
.igx-slider-thumb-label-from__container, .igx-slider-thumb-label-to__container {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  top: -2.25rem;
  left: -50%;
  pointer-events: none;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.125rem;
  border-radius: 1.125rem;
  margin: 0 auto;
  line-height: 1.125rem;
  color: var(--label-text-color);
  background: var(--label-background-color);
  opacity: 0;
  border-color: var(--label-background-color) transparent transparent;
  z-index: -1;
}
.igx-slider-thumb-label-from__container::after, .igx-slider-thumb-label-to__container::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -18px;
  width: 2.25rem;
  height: 36px;
  border-radius: 0 18px 18px;
  background: inherit;
  transform: rotate(-135deg);
  z-index: -1;
}
.igx-slider-thumb-label-from__container::before, .igx-slider-thumb-label-to__container::before {
  content: "";
  position: absolute;
  top: 2.5rem;
  left: calc(50% - 1px);
  border-left: 1px solid;
  border-right: 1px solid;
  border-top: 0.875rem solid;
  border-color: inherit;
}
.igx-slider-thumb-from__dot, .igx-slider-thumb-to__dot {
  position: relative;
  left: 0;
  padding: 1.25rem;
  pointer-events: none;
}
.igx-slider-thumb-from__dot:hover::after, .igx-slider-thumb-to__dot:hover::after {
  opacity: 0.12;
  /* 32 / 40 */
  transform: scale(0.8);
}
.igx-slider-thumb-from__dot::before, .igx-slider-thumb-to__dot::before {
  position: absolute;
  content: "";
  width: 0.75rem;
  height: 0.75rem;
  left: 0.875rem;
  top: 0.875rem;
  background: var(--thumb-color);
  border: 0rem solid var(--thumb-border-color);
  transform: rotate(45deg);
  transition: transform 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-radius 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border-radius: 1.25rem;
}
.igx-slider-thumb-from__dot::after, .igx-slider-thumb-to__dot::after {
  display: block;
  position: absolute;
  content: "";
  width: 2.5rem;
  height: 2.5rem;
  background: var(--thumb-color);
  top: 0;
  left: 0;
  opacity: 0;
  transform: scale(0);
  transform-origin: center center;
  transition: transform 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border-radius: 50%;
}
.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot, .igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot {
  pointer-events: none;
}
.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot::before, .igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot::before {
  background: var(--disabled-thumb-color);
  border-color: var(--thumb-disabled-border-color);
  border-radius: 1.25rem;
}
.igx-slider-thumb-from--active .igx-slider-thumb-from__dot::before, .igx-slider-thumb-to--active .igx-slider-thumb-to__dot::before {
  border-radius: 0 20px 20px;
}
.igx-slider-thumb-from--pressed .igx-slider-thumb-from__dot::after, .igx-slider-thumb-to--pressed .igx-slider-thumb-to__dot::after {
  opacity: 0.24 !important;
  /* 48 / 40 */
  transform: scale(1.2) !important;
}
.igx-slider-thumb-label-from--active .igx-slider-thumb-label-from__container, .igx-slider-thumb-label-to--active .igx-slider-thumb-label-to__container {
  opacity: 1;
}
.igx-slider-thumb-label-from--pressed .igx-slider-thumb-label-from__container, .igx-slider-thumb-label-to--pressed .igx-slider-thumb-label-to__container {
  z-index: 1;
}
igx-snackbar {
  --border-radius: var(--igx-snackbar-border-radius, 4px);
  --background: var(--igx-snackbar-background, hsla(var(--igx-grays-900), 0.9));
  --text-color: var(--igx-snackbar-text-color, var(--igx-grays-900-contrast));
  --button-color: var(--igx-snackbar-button-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --shadow: var(--igx-snackbar-shadow, var(--igx-elevation-4));
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.igx-snackbar {
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  min-height: 3rem;
  padding: 0.4375rem 1.5rem;
  margin: 8px;
  color: var(--text-color);
  background: var(--background);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  box-shadow: var(--shadow);
  border-radius: var(--border-radius);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
.igx-snackbar__message {
  animation: "fade-in" 0.35s ease-out;
}
.igx-snackbar__button {
  background: transparent;
  color: var(--button-color);
  border: 0;
  line-height: 1rem;
  margin-left: 1.5rem;
  text-transform: uppercase;
  -webkit-user-select: none;
          user-select: none;
  font-weight: 600;
  -webkit-tap-highlight-color: transparent;
  outline: none;
  transition: color 0.2s ease;
  font-size: inherit;
  font-family: inherit;
  cursor: pointer;
  animation: "fade-in" 0.35s ease-out;
}
.igx-snackbar__button:hover {
  color: var(--button-color);
}
igx-switch {
  --border-radius-track: var(--igx-switch-border-radius-track, 7px);
  --border-radius-thumb: var(--igx-switch-border-radius-thumb, 10px);
  --border-radius-ripple: var(--igx-switch-border-radius-ripple, 24px);
  --border-color: var(--igx-switch-border-color, transparent);
  --border-hover-color: var(--igx-switch-border-hover-color, transparent);
  --border-disabled-color: var(--igx-switch-border-disabled-color, transparent);
  --border-on-color: var(--igx-switch-border-on-color, transparent);
  --border-on-hover-color: var(--igx-switch-border-on-hover-color, transparent);
  --thumb-on-color: var(--igx-switch-thumb-on-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --track-on-color: var(--igx-switch-track-on-color, hsla(var(--igx-secondary-200), var(--igx-secondary-a)));
  --thumb-off-color: var(--igx-switch-thumb-off-color, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --track-disabled-color: var(--igx-switch-track-disabled-color, hsla(var(--igx-grays-300), 0.54));
  --track-off-color: var(--igx-switch-track-off-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --thumb-disabled-color: var(--igx-switch-thumb-disabled-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --label-color: var(--igx-switch-label-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --label-disabled-color: var(--igx-switch-label-disabled-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --resting-shadow: var(--igx-switch-resting-shadow, var(--igx-elevation-2));
  --hover-shadow: var(--igx-switch-hover-shadow, var(--igx-elevation-3));
  --disabled-shadow: var(--igx-switch-disabled-shadow, var(--igx-elevation-1));
}
.igx-switch {
  position: relative;
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
}
.igx-switch__input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: none;
  clip: rect(0, 0, 0, 0);
  outline: 0;
  pointer-events: none;
  overflow: hidden;
  -webkit-appearance: none;
          appearance: none;
}
.igx-switch--disabled {
  -webkit-user-select: none;
          user-select: none;
  pointer-events: none;
  cursor: initial;
}
.igx-switch__composite {
  display: flex;
  align-items: center;
  width: 2.25rem;
  height: 0.875rem;
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius-track);
  background: var(--track-off-color);
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.igx-switch__composite:hover, .igx-switch__composite:focus {
  border-color: var(--border-hover-color);
}
.igx-switch--checked .igx-switch__composite {
  background: var(--track-on-color);
  border-color: var(--border-on-color);
}
.igx-switch--checked .igx-switch__composite:hover, .igx-switch--checked .igx-switch__composite:focus {
  border-color: var(--border-on-hover-color);
}
.igx-switch--disabled .igx-switch__composite {
  background: var(--track-disabled-color);
  border-color: var(--border-disabled-color);
}
.igx-switch__composite-thumb {
  position: relative;
  display: block;
  width: 1.25rem;
  height: 20px;
  min-width: 1.25rem;
  border-radius: var(--border-radius-thumb);
  background: var(--thumb-off-color);
  box-shadow: var(--resting-shadow);
  transition: all 0.2s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transform: translateX(-0.0625rem);
}
.igx-switch__composite-thumb:hover {
  box-shadow: var(--hover-shadow);
}
.igx-switch--checked .igx-switch__composite-thumb {
  background: var(--thumb-on-color);
  transform: translateX(0.9375rem);
}
.igx-switch--disabled .igx-switch__composite-thumb {
  background: var(--thumb-disabled-color);
  box-shadow: var(--disabled-shadow);
}
.igx-switch__ripple {
  display: block;
  position: absolute;
  top: calc(50% - 1.5em);
  left: calc(50% - 1.5em);
  width: 3em;
  height: 3em;
  overflow: hidden;
  pointer-events: none;
  filter: opacity(1);
  border-radius: var(--border-radius-ripple);
}
.igx-switch__ripple,
.igx-switch__ripple [igxRipple] {
  --color: var(--igx-ripple-color, var(--thumb-on-color));
}
.igx-switch__ripple .igx-ripple__inner {
  display: block;
  position: absolute;
  border-radius: 50%;
  background: var(--color);
  pointer-events: none;
  transform-origin: center;
  transform: translate3d(0, 0, 0) scale(0);
  will-change: opacity, transform;
  opacity: 0.5;
  margin: 0 !important;
  border: none !important;
}
.igx-switch__ripple .igx-ripple {
  overflow: hidden;
}
.igx-switch__ripple,
.igx-switch__ripple [igxRipple] {
  --color: var(--igx-ripple-color, var(--thumb-on-color));
}
.igx-switch--focused .igx-switch__ripple, .igx-switch--focused.igx-switch--checked .igx-switch__ripple {
  background: var(--track-off-color);
  transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  opacity: 0.12;
}
.igx-switch--focused.igx-switch--checked .igx-switch__ripple {
  background: var(--thumb-on-color);
}
.igx-switch__label, .igx-switch__label--before {
  display: inline-block;
  color: var(--label-color);
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  word-wrap: break-all;
}
.igx-switch__label:empty, .igx-switch__label--before:empty {
  margin: 0;
}
.igx-switch__label--before:empty,
.igx-switch__label:empty {
  margin: 0;
}
.igx-switch__label {
  margin-left: 0.5em;
}
.igx-switch__label--before {
  order: -1;
  margin-right: 0.5em;
}
.igx-switch--disabled .igx-switch__label, .igx-switch--disabled .igx-switch__label--before {
  color: var(--label-disabled-color);
}
.igx-switch:hover .igx-switch__ripple::after, .igx-switch:active .igx-switch__ripple::after, .igx-switch--checked:hover .igx-switch__ripple::after, .igx-switch--checked:active .igx-switch__ripple::after {
  position: absolute;
  content: "";
  opacity: 0.06;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.igx-switch:hover .igx-switch__ripple::after, .igx-switch:active .igx-switch__ripple::after {
  background: var(--track-off-color);
}
.igx-switch--checked:hover .igx-switch__ripple::after, .igx-switch--checked:active .igx-switch__ripple::after {
  background: var(--thumb-on-color);
}
.igx-switch:active .igx-switch__ripple::after, .igx-switch--checked:active .igx-switch__ripple::after {
  opacity: 0.12;
}
igx-tabs {
  --border-radius: var(--igx-tabs-border-radius, 0px);
  --item-text-color: var(--igx-tabs-item-text-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-background: var(--igx-tabs-item-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --item-hover-background: var(--igx-tabs-item-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --item-hover-color: var(--igx-tabs-item-hover-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --item-active-color: var(--igx-tabs-item-active-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --item-active-icon-color: var(--igx-tabs-item-active-icon-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --item-active-background: var(--igx-tabs-item-active-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --indicator-color: var(--igx-tabs-indicator-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --button-color: var(--igx-tabs-button-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --button-background: var(--igx-tabs-button-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --button-hover-background: var(--igx-tabs-button-hover-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --button-hover-color: var(--igx-tabs-button-hover-color, hsla(var(--igx-grays-600), var(--igx-grays-a)));
  --tab-ripple-color: var(--igx-tabs-tab-ripple-color, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --button-ripple-color: var(--igx-tabs-button-ripple-color, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --border-color: var(--igx-tabs-border-color, transparent);
  --border-color--hover: var(--igx-tabs-border-color--hover, transparent);
  --tab-area-shadow: var(--igx-tabs-tab-area-shadow, var(--igx-elevation-1));
  --buttons-shadow: var(--igx-tabs-buttons-shadow, var(--igx-elevation-4));
}
.igx-tabs__header,
.igx-tabs__header-button,
.igx-tabs__header-item-inner,
.igx-tabs__header-content {
  display: flex;
}
.igx-tabs {
  display: block;
}
.igx-tabs__header {
  overflow: hidden;
  background: var(--item-background);
  box-shadow: var(--tab-area-shadow);
  min-height: 2.625rem;
  z-index: 1;
}
.igx-tabs__header-content {
  flex: 1 1 auto;
  overflow: hidden;
  scroll-behavior: smooth;
}
.igx-tabs__header-wrapper {
  position: relative;
  flex-grow: 1;
}
.igx-tabs__header-scroll {
  display: flex;
  height: 100%;
}
.igx-tabs__header-button {
  align-items: center;
  justify-content: center;
  z-index: 1;
  border: none;
  padding: 0;
  min-width: 3rem;
  width: 3rem;
  cursor: pointer;
  position: relative;
  background: var(--button-background);
  color: var(--button-color);
  outline: 0;
  box-shadow: var(--buttons-shadow);
}
.igx-tabs__header-button:hover {
  background: var(--button-hover-background);
  color: var(--button-hover-color);
}
.igx-tabs__header-button:focus {
  outline: 0;
  background: var(--button-hover-background);
}
.igx-tabs__header-button::-moz-focus-inner {
  border: 0;
}
.igx-tabs__header-button--hidden {
  visibility: hidden;
}
.igx-tabs__header-button--none {
  display: none;
}
.igx-tabs__header-button,
.igx-tabs__header-button [igxRipple] {
  --color: var(--igx-ripple-color, var(--button-ripple-color));
}
.igx-tabs__header-button .igx-ripple__inner {
  display: block;
  position: absolute;
  border-radius: 50%;
  background: var(--color);
  pointer-events: none;
  transform-origin: center;
  transform: translate3d(0, 0, 0) scale(0);
  will-change: opacity, transform;
  opacity: 0.5;
  margin: 0 !important;
  border: none !important;
}
.igx-tabs__header-button .igx-ripple {
  overflow: hidden;
}
.igx-tabs__header-button,
.igx-tabs__header-button [igxRipple] {
  --color: var(--igx-ripple-color, var(--button-ripple-color));
}
.igx-tabs__header-item {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 90px;
  max-width: 360px;
  word-wrap: break-word;
  flex-basis: auto;
  flex-shrink: 0;
  padding: 0.6875rem 1rem;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  transition: all 0.3s cubic-bezier(0.35, 0, 0.25, 1);
  -webkit-user-select: none;
          user-select: none;
  background: var(--item-background);
  color: var(--item-text-color);
  outline: 0;
  border: 1px solid var(--border-color);
}
.igx-tabs__header-item > * {
  margin-left: 0.75rem;
}
.igx-tabs__header-item > *:first-child {
  margin-left: 0;
}
.igx-tabs__header-item::-moz-focus-inner {
  border: 0;
}
.igx-tabs__header-item:focus {
  background: var(--item-active-background);
  border-bottom-color: transparent;
}
.igx-tabs__header-item:hover {
  background: var(--item-hover-background);
  color: var(--item-hover-color);
}
.igx-tabs__header-item:hover, .igx-tabs__header-item:focus {
  border: 1px solid var(--border-color--hover);
}
.igx-tabs__header-item,
.igx-tabs__header-item [igxRipple] {
  --color: var(--igx-ripple-color, var(--tab-ripple-color));
}
.igx-tabs__header-item .igx-ripple__inner {
  display: block;
  position: absolute;
  border-radius: 50%;
  background: var(--color);
  pointer-events: none;
  transform-origin: center;
  transform: translate3d(0, 0, 0) scale(0);
  will-change: opacity, transform;
  opacity: 0.5;
  margin: 0 !important;
  border: none !important;
}
.igx-tabs__header-item .igx-ripple {
  overflow: hidden;
}
.igx-tabs__header-item,
.igx-tabs__header-item [igxRipple] {
  --color: var(--igx-ripple-color, var(--tab-ripple-color));
}
.igx-tabs__header-item--selected {
  outline: 0;
  color: var(--item-active-color);
}
.igx-tabs__header-item--selected:focus {
  background: var(--item-active-background);
  color: var(--item-active-color);
}
.igx-tabs__header-item--selected:hover {
  background: var(--item-active-background);
  color: var(--item-active-color);
}
.igx-tabs__header-item--selected igx-icon {
  color: var(--item-active-icon-color);
}
.igx-tabs__header-item--disabled {
  outline: 0;
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}
.igx-tabs__header-item-inner {
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.igx-tabs__header-item-inner > [igxtabheadericon] {
  margin-bottom: 0.5rem;
}
.igx-tabs__header-item-inner > [igxtabheadericon]:last-child {
  margin-bottom: 0;
}
.igx-tabs__header-active-indicator {
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translateX(0);
  height: 2px;
  min-width: 90px;
  background: var(--indicator-color);
  transition: transform 0.3s cubic-bezier(0.35, 0, 0.25, 1), width 0.2s cubic-bezier(0.35, 0, 0.25, 1);
}
.igx-tabs__panels {
  position: relative;
  overflow: hidden;
  flex-grow: 1;
}
.igx-tabs__panel {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.igx-tabs__panel::-moz-focus-inner {
  border: 0;
}
.igx-tabs__panel:focus {
  outline-width: 0;
}
[tabindex="0"].igx-tabs__panel {
  position: relative;
}
.igx-tabs__header-scroll--start {
  justify-content: flex-start;
}
.igx-tabs__header-scroll--end {
  justify-content: flex-end;
}
.igx-tabs__header-scroll--center {
  justify-content: center;
}
.igx-tabs__header-scroll--justify .igx-tabs__header-item {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
}
igx-stepper {
  --border-radius-indicator: var(--igx-stepper-border-radius-indicator, 100px);
  --border-radius-step-header: var(--igx-stepper-border-radius-step-header, 0px);
  --step-background: var(--igx-stepper-step-background, transparent);
  --step-hover-background: var(--igx-stepper-step-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --step-focus-background: var(--igx-stepper-step-focus-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --indicator-background: var(--igx-stepper-indicator-background, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --indicator-outline: var(--igx-stepper-indicator-outline, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --indicator-color: var(--igx-stepper-indicator-color, var(--igx-grays-400-contrast));
  --title-color: var(--igx-stepper-title-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --title-hover-color: var(--igx-stepper-title-hover-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --title-focus-color: var(--igx-stepper-title-focus-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --subtitle-color: var(--igx-stepper-subtitle-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --subtitle-hover-color: var(--igx-stepper-subtitle-hover-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --subtitle-focus-color: var(--igx-stepper-subtitle-focus-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --complete-step-background: var(--igx-stepper-complete-step-background, transparent);
  --complete-step-hover-background: var(--igx-stepper-complete-step-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --complete-step-focus-background: var(--igx-stepper-complete-step-focus-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --complete-indicator-background: var(--igx-stepper-complete-indicator-background, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --complete-indicator-outline: var(--igx-stepper-complete-indicator-outline, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --complete-indicator-color: var(--igx-stepper-complete-indicator-color, var(--igx-grays-900-contrast));
  --complete-title-color: var(--igx-stepper-complete-title-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --complete-title-hover-color: var(--igx-stepper-complete-title-hover-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --complete-title-focus-color: var(--igx-stepper-complete-title-focus-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --complete-subtitle-color: var(--igx-stepper-complete-subtitle-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --complete-subtitle-hover-color: var(--igx-stepper-complete-subtitle-hover-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --complete-subtitle-focus-color: var(--igx-stepper-complete-subtitle-focus-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --current-step-background: var(--igx-stepper-current-step-background, transparent);
  --current-step-hover-background: var(--igx-stepper-current-step-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --current-step-focus-background: var(--igx-stepper-current-step-focus-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --current-indicator-background: var(--igx-stepper-current-indicator-background, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --current-indicator-outline: var(--igx-stepper-current-indicator-outline, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --current-indicator-color: var(--igx-stepper-current-indicator-color, var(--igx-grays-900-contrast));
  --current-title-color: var(--igx-stepper-current-title-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --current-title-hover-color: var(--igx-stepper-current-title-hover-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --current-title-focus-color: var(--igx-stepper-current-title-focus-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --current-subtitle-color: var(--igx-stepper-current-subtitle-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --current-subtitle-hover-color: var(--igx-stepper-current-subtitle-hover-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --current-subtitle-focus-color: var(--igx-stepper-current-subtitle-focus-color, hsla(var(--igx-grays-700), var(--igx-grays-a)));
  --invalid-step-background: var(--igx-stepper-invalid-step-background, transparent);
  --invalid-step-hover-background: var(--igx-stepper-invalid-step-hover-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --invalid-step-focus-background: var(--igx-stepper-invalid-step-focus-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --invalid-indicator-background: var(--igx-stepper-invalid-indicator-background, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-indicator-outline: var(--igx-stepper-invalid-indicator-outline, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-indicator-color: var(--igx-stepper-invalid-indicator-color, var(--igx-grays-900-contrast));
  --invalid-title-color: var(--igx-stepper-invalid-title-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-title-hover-color: var(--igx-stepper-invalid-title-hover-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-title-focus-color: var(--igx-stepper-invalid-title-focus-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-subtitle-color: var(--igx-stepper-invalid-subtitle-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-subtitle-hover-color: var(--igx-stepper-invalid-subtitle-hover-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --invalid-subtitle-focus-color: var(--igx-stepper-invalid-subtitle-focus-color, hsla(var(--igx-error-500), var(--igx-error-a)));
  --disabled-indicator-color: var(--igx-stepper-disabled-indicator-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --disabled-indicator-background: var(--igx-stepper-disabled-indicator-background, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --disabled-indicator-outline: var(--igx-stepper-disabled-indicator-outline, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --disabled-title-color: var(--igx-stepper-disabled-title-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --disabled-subtitle-color: var(--igx-stepper-disabled-subtitle-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --step-separator-color: var(--igx-stepper-step-separator-color, hsla(var(--igx-grays-300), var(--igx-grays-a)));
  --complete-step-separator-color: var(--igx-stepper-complete-step-separator-color, hsla(var(--igx-grays-900), var(--igx-grays-a)));
  --step-separator-style: var(--igx-stepper-step-separator-style, dashed);
  --complete-step-separator-style: var(--igx-stepper-complete-step-separator-style, solid);
}
.igx-stepper,
.igx-stepper__header,
.igx-stepper__body,
.igx-stepper__step {
  display: flex;
}
.igx-stepper {
  flex-direction: column;
  width: 100%;
}
.igx-stepper__header {
  white-space: nowrap;
  flex-direction: column;
  width: 100%;
}
.igx-stepper__body {
  position: relative;
}
.igx-stepper,
.igx-stepper__body,
.igx-stepper__step-header,
.igx-stepper__step-title-wrapper {
  overflow: hidden;
}
.igx-stepper__step-title {
  color: var(--title-color);
}
.igx-stepper__step-subtitle {
  color: var(--subtitle-color);
}
.igx-stepper__step {
  position: relative;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  min-width: 6.25rem;
}
.igx-stepper__step:focus {
  outline: none;
}
.igx-stepper__step:focus .igx-stepper__step-title {
  color: var(--title-focus-color);
}
.igx-stepper__step:focus .igx-stepper__step-subtitle {
  color: var(--subtitle-focus-color);
}
.igx-stepper__step:focus .igx-stepper__step-header {
  background: var(--step-focus-background);
  color: var(--title-focus-color);
}
.igx-stepper__step:focus .igx-stepper__step-header--current {
  background: var(--current-step-focus-background) !important;
}
.igx-stepper__step:focus .igx-stepper__step-header--current .igx-stepper__step-title {
  color: var(--current-title-focus-color);
}
.igx-stepper__step:focus .igx-stepper__step-header--current .igx-stepper__step-subtitle {
  color: var(--current-subtitle-focus-color);
}
.igx-stepper__step:focus .igx-stepper__step-header--invalid {
  background: var(--invalid-step-focus-background);
}
.igx-stepper__step:focus .igx-stepper__step-header--invalid .igx-stepper__step-title {
  color: var(--invalid-title-focus-color);
}
.igx-stepper__step:focus .igx-stepper__step-header--invalid .igx-stepper__step-subtitle {
  color: var(--invalid-subtitle-focus-color);
}
.igx-stepper__step:first-of-type .igx-stepper__step-header::before {
  visibility: hidden;
}
.igx-stepper__step:last-of-type .igx-stepper__step-content-wrapper::before {
  display: none;
}
.igx-stepper__step:last-of-type .igx-stepper__step-header::after {
  visibility: hidden;
}
.igx-stepper__step-header {
  display: flex;
  padding: 1.5rem;
  position: relative;
  line-height: normal;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  cursor: pointer;
  background: var(--step-background);
  border-radius: var(--border-radius-step-header);
}
.igx-stepper__step-header:hover {
  background: var(--step-hover-background);
  color: var(--title-hover-color);
}
.igx-stepper__step-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: 0.75rem;
  height: 1.5rem;
  width: 1.5rem;
  white-space: nowrap;
  border-radius: var(--border-radius-indicator);
  color: var(--indicator-color);
  background: var(--indicator-background);
  box-shadow: 0 0 0 0.0625rem var(--indicator-outline);
}
.igx-stepper__step-indicator > igx-icon {
  width: calc(1.5rem - 0.375rem);
  height: calc(1.5rem - 0.375rem);
  font-size: calc(1.5rem - 0.375rem);
  color: inherit;
}
.igx-stepper__step-indicator div > igx-icon,
.igx-stepper__step-indicator div > igx-avatar,
.igx-stepper__step-indicator div > igx-circular-bar {
  max-height: 1.5rem;
  max-width: 1.5rem;
}
.igx-stepper__step-header--current {
  background: var(--current-step-background) !important;
  color: var(--current-title-color);
}
.igx-stepper__step-header--current .igx-stepper__step-indicator {
  color: var(--current-indicator-color) !important;
  background: var(--current-indicator-background) !important;
  box-shadow: 0 0 0 0.0625rem var(--current-indicator-outline) !important;
}
.igx-stepper__step-header--current .igx-stepper__step-title {
  color: var(--current-title-color);
}
.igx-stepper__step-header--current .igx-stepper__step-subtitle {
  color: var(--current-subtitle-color);
}
.igx-stepper__step-header--current:hover {
  background: var(--current-step-hover-background) !important;
}
.igx-stepper__step-header--current:hover .igx-stepper__step-title {
  color: var(--current-title-hover-color);
}
.igx-stepper__step-header--current:hover .igx-stepper__step-subtitle {
  color: var(--current-subtitle-hover-color);
}
.igx-stepper__step--disabled {
  color: var(--disabled-title-color);
  pointer-events: none;
  cursor: default;
}
.igx-stepper__step--disabled .igx-stepper__step-indicator {
  color: var(--disabled-indicator-color);
  background: var(--disabled-indicator-background);
  box-shadow: 0 0 0 0.0625rem var(--disabled-indicator-outline);
}
.igx-stepper__step--disabled .igx-stepper__step-title {
  color: var(--disabled-title-color);
}
.igx-stepper__step--disabled .igx-stepper__step-subtitle {
  color: var(--disabled-subtitle-color);
}
.igx-stepper__step-header--invalid {
  background: var(--invalid-step-background);
  color: var(--invalid-title-color);
}
.igx-stepper__step-header--invalid .igx-stepper__step-indicator {
  color: var(--invalid-indicator-color);
  background: var(--invalid-indicator-background);
  box-shadow: 0 0 0 0.0625rem var(--invalid-indicator-outline);
}
.igx-stepper__step-header--invalid .igx-stepper__step-title {
  color: var(--invalid-title-color);
}
.igx-stepper__step-header--invalid .igx-stepper__step-subtitle {
  color: var(--invalid-subtitle-color);
}
.igx-stepper__step-header--invalid:hover {
  background: var(--invalid-step-hover-background);
}
.igx-stepper__step-header--invalid:hover .igx-stepper__step-title {
  color: var(--invalid-title-hover-color);
}
.igx-stepper__step-header--invalid:hover .igx-stepper__step-subtitle {
  color: var(--invalid-subtitle-hover-color);
}
.igx-stepper--horizontal .igx-stepper__body-content {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  z-index: -1;
}
.igx-stepper__step-content-wrapper,
.igx-stepper--horizontal .igx-stepper__body-content {
  padding: 1rem;
}
.igx-stepper--horizontal .igx-stepper__body-content--active {
  z-index: 1;
  position: relative;
}
.igx-stepper__step-content-wrapper {
  margin-left: calc(1.5rem + (1.5rem / 2));
  position: relative;
  min-height: 2rem;
}
.igx-stepper__step-content-wrapper::before {
  content: "";
  position: absolute;
  left: calc(-0.0625rem / 2);
  top: calc(-1.5rem + 0.5rem);
  bottom: calc(-1.5rem + 0.5rem);
  width: 0.0625rem;
  border-left: 0.0625rem var(--step-separator-style) var(--step-separator-color);
}
.igx-stepper__step-title-wrapper {
  white-space: nowrap;
  text-overflow: ellipsis;
  min-width: 2rem;
}
.igx-stepper__step-title-wrapper:empty {
  display: none;
}
.igx-stepper__step-title-wrapper > * {
  display: block;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.igx-stepper__step--start .igx-stepper__step-header,
.igx-stepper__step--end .igx-stepper__step-header {
  flex-direction: row;
  align-items: center;
}
.igx-stepper__step--start .igx-stepper__step-title-wrapper,
.igx-stepper__step--top .igx-stepper__step-title-wrapper {
  order: -1;
}
.igx-stepper__step--completed .igx-stepper__step-header {
  background: var(--complete-step-background);
}
.igx-stepper__step--completed .igx-stepper__step-header:hover {
  background: var(--complete-step-hover-background);
}
.igx-stepper__step--completed .igx-stepper__step-header:hover .igx-stepper__step-title {
  color: var(--complete-title-hover-color);
}
.igx-stepper__step--completed .igx-stepper__step-header:hover .igx-stepper__step-subtitle {
  color: var(--complete-subtitle-hover-color);
}
.igx-stepper__step--completed .igx-stepper__step-header::after {
  border-top-color: var(--complete-step-separator-color) !important;
  border-top-style: var(--complete-step-separator-style) !important;
}
.igx-stepper__step--completed .igx-stepper__step-indicator {
  color: var(--complete-indicator-color);
  background: var(--complete-indicator-background);
  box-shadow: 0 0 0 0.0625rem var(--complete-indicator-outline);
}
.igx-stepper__step--completed .igx-stepper__step-title {
  color: var(--complete-title-color);
}
.igx-stepper__step--completed .igx-stepper__step-subtitle {
  color: var(--complete-subtitle-color);
}
.igx-stepper__step--completed:focus .igx-stepper__step-header {
  background: var(--complete-step-focus-background);
}
.igx-stepper__step--completed:focus .igx-stepper__step-header .igx-stepper__step-title {
  color: var(--complete-title-focus-color);
}
.igx-stepper__step--completed:focus .igx-stepper__step-header .igx-stepper__step-subtitle {
  color: var(--complete-subtitle-focus-color);
}
.igx-stepper__step--completed .igx-stepper__step-content-wrapper::before {
  border-left-style: var(--complete-step-separator-style);
  border-left-color: var(--complete-step-separator-color);
}
.igx-stepper__step--completed + .igx-stepper__step::before {
  border-top-color: var(--complete-step-separator-color) !important;
  border-top-style: var(--complete-step-separator-style) !important;
}
.igx-stepper__step--completed + .igx-stepper__step .igx-stepper__step-header::before {
  border-top-color: var(--complete-step-separator-color) !important;
  border-top-style: var(--complete-step-separator-style) !important;
}
.igx-stepper__step--simple .igx-stepper__step-indicator {
  min-width: 1.5rem;
  min-height: 1.5rem;
  width: initial;
  height: initial;
}
.igx-stepper__step--simple .igx-stepper__step-indicator div > igx-icon,
.igx-stepper__step--simple .igx-stepper__step-indicator div > igx-avatar,
.igx-stepper__step--simple .igx-stepper__step-indicator div > igx-circular-bar {
  max-width: initial;
  max-height: initial;
}
.igx-stepper--horizontal .igx-stepper__header {
  flex-direction: row;
}
.igx-stepper--horizontal .igx-stepper__step {
  overflow: hidden;
  flex-direction: row;
  flex-grow: 1;
}
.igx-stepper--horizontal .igx-stepper__step::before {
  content: "";
  width: auto;
  min-width: 0.625rem;
  height: 0.0625rem;
  flex: 1;
  position: relative;
  z-index: -1;
  top: calc((1.5rem / 2) + 1.5rem - (0.0625rem / 2));
  border-top: 0.0625rem var(--step-separator-style) var(--step-separator-color);
}
.igx-stepper--horizontal .igx-stepper__step:first-of-type {
  flex-grow: 0;
  min-width: 0;
}
.igx-stepper--horizontal .igx-stepper__step:first-of-type::before {
  display: none;
}
.igx-stepper--horizontal .igx-stepper__step-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.igx-stepper--horizontal .igx-stepper__step-header::before, .igx-stepper--horizontal .igx-stepper__step-header::after {
  content: "";
  position: absolute;
  z-index: -1;
  height: 0.0625rem;
  width: calc(50% - (1.5rem - 0.25rem));
  top: calc((1.5rem / 2) + 1.5rem - (0.0625rem / 2));
  flex: 1;
  border-top: 0.0625rem var(--step-separator-style) var(--step-separator-color);
}
.igx-stepper--horizontal .igx-stepper__step-header::before {
  left: 0;
}
.igx-stepper--horizontal .igx-stepper__step-header::after {
  right: 0;
}
.igx-stepper--horizontal .igx-stepper__step--simple {
  text-align: center;
}
.igx-stepper--horizontal .igx-stepper__step--simple .igx-stepper__step-header {
  align-self: center;
  padding: 0.5rem;
  height: auto;
}
.igx-stepper--horizontal .igx-stepper__step--simple .igx-stepper__step-header::before, .igx-stepper--horizontal .igx-stepper__step--simple .igx-stepper__step-header::after {
  display: none;
}
.igx-stepper--horizontal .igx-stepper__step--simple.igx-stepper__step::before {
  top: calc(50% - (0.0625rem / 2));
}
.igx-stepper--horizontal .igx-stepper__step-title-wrapper {
  width: 100%;
}
.igx-stepper--horizontal .igx-stepper__step--top .igx-stepper__step-header {
  justify-content: flex-end;
}
.igx-stepper--horizontal .igx-stepper__step--top .igx-stepper__step-header::before, .igx-stepper--horizontal .igx-stepper__step--top .igx-stepper__step-header::after {
  top: calc(100% - ((1.5rem / 2) + 1.5rem + (0.0625rem / 2)));
}
.igx-stepper--horizontal .igx-stepper__step--top.igx-stepper__step::before {
  border-top: 0.0625rem var(--step-separator-style) var(--step-separator-color);
  top: calc(100% - ((1.5rem / 2) + 1.5rem + (0.0625rem / 2)));
}
.igx-stepper--horizontal .igx-stepper__step--bottom .igx-stepper__step-header {
  justify-content: flex-start;
}
.igx-stepper--horizontal .igx-stepper__step--top .igx-stepper__step-title-wrapper,
.igx-stepper--horizontal .igx-stepper__step--bottom .igx-stepper__step-title-wrapper {
  text-align: center;
}
.igx-stepper--horizontal .igx-stepper__step--top .igx-stepper__step-header,
.igx-stepper--horizontal .igx-stepper__step--bottom .igx-stepper__step-header {
  flex-direction: column;
}
.igx-stepper--horizontal .igx-stepper__step--start .igx-stepper__step-title-wrapper {
  text-align: right;
}
.igx-stepper--horizontal .igx-stepper__step--start .igx-stepper__step-indicator,
.igx-stepper--horizontal .igx-stepper__step--end .igx-stepper__step-indicator {
  flex: 1 0 auto;
}
.igx-stepper--horizontal .igx-stepper__step--start .igx-stepper__step-header,
.igx-stepper--horizontal .igx-stepper__step--end .igx-stepper__step-header {
  padding: calc(1.5rem / 2);
}
.igx-stepper--horizontal .igx-stepper__step--start .igx-stepper__step-header::before, .igx-stepper--horizontal .igx-stepper__step--start .igx-stepper__step-header::after,
.igx-stepper--horizontal .igx-stepper__step--end .igx-stepper__step-header::before,
.igx-stepper--horizontal .igx-stepper__step--end .igx-stepper__step-header::after {
  display: none;
}
.igx-stepper--horizontal .igx-stepper__step--start.igx-stepper__step::before,
.igx-stepper--horizontal .igx-stepper__step--end.igx-stepper__step::before {
  top: calc(50% - (0.0625rem / 2));
}
.igx-stepper--horizontal .igx-stepper__step-content:focus {
  outline: none;
}
.igx-stepper--horizontal .igx-stepper__step-content::before {
  display: none;
}
.igx-stepper--horizontal .igx-stepper__step-content-wrapper {
  text-align: center;
}
igx-toast {
  --border-radius: var(--igx-toast-border-radius, 26px);
  --background: var(--igx-toast-background, hsla(var(--igx-grays-700), 0.9));
  --text-color: var(--igx-toast-text-color, var(--igx-grays-700-contrast));
  --shadow: var(--igx-toast-shadow, var(--igx-elevation-0));
}
.igx-toast {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 2.625rem auto;
  padding: 1rem 1.5rem;
  min-width: 52px;
  color: var(--text-color);
  background: var(--background);
  border: none;
  border-radius: var(--border-radius);
  box-shadow: var(--igx-elevation-0);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
}
.igx-tooltip--desktop, .igx-tooptip--mobile {
  --border-radius: var(--igx-tooltip-border-radius, 4px);
  --background: var(--igx-tooltip-background, hsla(var(--igx-grays-700), 0.9));
  --text-color: var(--igx-tooltip-text-color, var(--igx-grays-700-contrast));
  --roundness: var(--igx-tooltip-roundness, 0.25rem);
}
.igx-tooltip, .igx-tooltip--desktop, .igx-tooltip--mobile {
  display: inline-flex;
  justify-content: center;
  flex-flow: column wrap;
  background: var(--background);
  color: var(--text-color);
  border-radius: var(--border-radius);
  margin: 0 auto;
}
.igx-tooltip--desktop {
  padding: 0 0.5rem;
  min-height: 1.5rem;
}
.igx-tooltip--mobile {
  padding: 0 1rem;
  min-height: 2rem;
}
.igx-time-picker {
  --border-radius: var(--igx-time-picker-border-radius, 4px);
  --active-item-border-radius: var(--igx-time-picker-active-item-border-radius, 15px);
  --text-color: var(--igx-time-picker-text-color, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --hover-text-color: var(--igx-time-picker-hover-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --selected-text-color: var(--igx-time-picker-selected-text-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --active-item-background: var(--igx-time-picker-active-item-background, hsla(var(--igx-grays-100), var(--igx-grays-a)));
  --disabled-text-color: var(--igx-time-picker-disabled-text-color, hsla(var(--igx-grays-400), var(--igx-grays-a)));
  --disabled-item-background: var(--igx-time-picker-disabled-item-background, transparent);
  --header-background: var(--igx-time-picker-header-background, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --header-hour-text-color: var(--igx-time-picker-header-hour-text-color, var(--igx-secondary-500-contrast));
  --header-time-period-color: var(--igx-time-picker-header-time-period-color, var(--igx-secondary-500-contrast));
  --background-color: var(--igx-time-picker-background-color, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --modal-shadow: var(--igx-time-picker-modal-shadow, var(--igx-elevation-24));
  --dropdown-shadow: var(--igx-time-picker-dropdown-shadow, var(--igx-elevation-8));
}
.igx-time-picker {
  display: flex;
  flex-flow: column nowrap;
  max-width: 21.25rem;
  min-width: 20rem;
  border-radius: var(--border-radius);
  box-shadow: var(--modal-shadow);
  overflow: hidden;
}
.igx-time-picker--vertical {
  flex-flow: row nowrap;
  min-width: 33.75rem;
}
.igx-time-picker__main {
  background: var(--background-color);
  flex: 1 1 auto;
}
.igx-time-picker--dropdown {
  min-width: 12.5rem;
  box-shadow: var(--dropdown-shadow);
}
.igx-time-picker__body {
  display: flex;
  padding: 0.625rem 0;
  justify-content: center;
}
.igx-time-picker__hourList {
  text-align: right;
}
.igx-time-picker__minuteList {
  text-align: center;
}
.igx-time-picker__secondsList {
  text-align: center;
}
.igx-time-picker__ampmList {
  display: flex;
  flex-direction: column;
  padding-top: 3rem;
}
.igx-time-picker__column {
  max-width: 4rem;
  height: 20.3125rem;
  padding: 0;
  cursor: pointer;
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  align-items: center;
  color: var(--text-color);
  overflow: hidden;
}
.igx-time-picker__column:focus, .igx-time-picker__column:active {
  outline: none;
}
.igx-time-picker__item {
  width: 3.375rem;
  padding: 0.3125rem 0.625rem;
  border-radius: var(--active-item-border-radius);
  height: 3rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.igx-time-picker__item:focus, .igx-time-picker__item:active {
  outline: none;
}
.igx-time-picker__item:hover {
  color: var(--hover-text-color);
}
.igx-time-picker__item--selected {
  font-size: 1.5rem;
  color: var(--selected-text-color);
}
.igx-time-picker__item--active {
  background: var(--active-item-background);
}
.igx-time-picker__item--disabled {
  color: var(--disabled-text-color);
  background: var(--disabled-item-background);
  pointer-events: none;
}
.igx-time-picker__header {
  background: var(--header-background);
  padding: 1.5rem 1rem;
}
.igx-time-picker__header-ampm {
  color: var(--header-time-period-color);
}
.igx-time-picker--vertical .igx-time-picker__header {
  width: 10.5rem;
}
.igx-time-picker__header-hour {
  display: flex;
  color: var(--header-hour-text-color);
}
.igx-time-picker__header-ampm,
.igx-time-picker__header-hour {
  margin: 0;
}
.igx-time-picker__buttons {
  display: flex;
  justify-content: flex-end;
  height: 3.25rem;
  padding: 0.5rem;
}
.igx-time-picker__buttons [igxButton] + [igxButton] {
  margin-left: 0.5rem;
}
igx-tree {
  --background: var(--igx-tree-background, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --foreground: var(--igx-tree-foreground, var(--igx-surface-500-contrast));
  --background-selected: var(--igx-tree-background-selected, hsla(var(--igx-secondary-200), var(--igx-secondary-a)));
  --foreground-selected: var(--igx-tree-foreground-selected, var(--igx-secondary-200-contrast));
  --background-active: var(--igx-tree-background-active, hsla(var(--igx-grays-200), var(--igx-grays-a)));
  --foreground-active: var(--igx-tree-foreground-active, var(--igx-grays-200-contrast));
  --background-active-selected: var(--igx-tree-background-active-selected, hsla(var(--igx-secondary-300), var(--igx-secondary-a)));
  --foreground-active-selected: var(--igx-tree-foreground-active-selected, var(--igx-secondary-300-contrast));
  --border-color: var(--igx-tree-border-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --background-disabled: var(--igx-tree-background-disabled, hsla(var(--igx-surface-500), var(--igx-surface-a)));
  --foreground-disabled: var(--igx-tree-foreground-disabled, hsla(var(--igx-grays-500), var(--igx-grays-a)));
  --drop-area-color: var(--igx-tree-drop-area-color, hsla(var(--igx-secondary-500), var(--igx-secondary-a)));
  --hover-color: var(--igx-tree-hover-color, hsla(var(--igx-grays-900), 0.1));
}
.igx-tree {
  display: block;
  z-index: 0;
}
.igx-tree-node,
.igx-tree-node__wrapper,
.igx-tree-node__toggle-button,
.igx-tree-node__content,
.igx-tree-node__select {
  display: flex;
}
.igx-tree-node {
  flex-direction: column;
}
.igx-tree-node__wrapper,
.igx-tree-node__toggle-button,
.igx-tree-node__select {
  align-items: center;
}
.igx-tree-node__toggle-button,
.igx-tree-node__select {
  margin-right: 0.5rem;
}
.igx-tree-node__content,
.igx-tree-node__toggle-button,
.igx-tree-node__select {
  z-index: 1;
}
.igx-tree-node__toggle-button--hidden {
  visibility: hidden;
}
.igx-tree-node__wrapper {
  min-height: 3.125rem;
  padding: 0 1.5rem;
  position: relative;
  background: var(--background);
  color: var(--foreground);
}
.igx-tree-node__wrapper igx-icon {
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1.5rem;
}
.igx-tree-node__wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  z-index: 0;
}
.igx-tree-node__wrapper:hover::after {
  background: var(--hover-color);
}
.igx-tree-node__wrapper:focus {
  outline-width: 0;
}
.igx-tree-node__wrapper igx-circular-bar {
  width: 1.5rem;
  height: 1.5rem;
}
.igx-tree-node__wrapper--cosy {
  min-height: 2.5rem;
  padding: 0 1rem;
}
.igx-tree-node__wrapper--cosy .igx-tree-node__spacer {
  width: 1rem;
}
.igx-tree-node__wrapper--cosy .igx-tree-node__drop-indicator {
  right: 1rem;
  width: calc(100% - ((1rem * 2) + (1.5rem + 0.5rem)));
}
.igx-tree-node__wrapper--cosy igx-circular-bar {
  width: calc(1.5rem - 4px);
  height: calc(1.5rem - 4px);
}
.igx-tree-node__wrapper--compact {
  min-height: 2rem;
  padding: 0 0.75rem;
}
.igx-tree-node__wrapper--compact .igx-tree-node__spacer {
  width: 0.75rem;
}
.igx-tree-node__wrapper--compact .igx-tree-node__drop-indicator {
  right: 0.75rem;
  width: calc(100% - ((0.75rem * 2) + (1.5rem + 0.5rem)));
}
.igx-tree-node__wrapper--compact igx-circular-bar {
  width: calc(1.5rem - 6px);
  height: calc(1.5rem - 6px);
}
.igx-tree-node__wrapper--selected {
  background: var(--background-selected);
  color: var(--foreground-selected);
}
.igx-tree-node__wrapper--active {
  background: var(--background-active);
  color: var(--foreground-active);
}
.igx-tree-node__wrapper--active.igx-tree-node__wrapper--selected {
  background: var(--background-active-selected);
  color: var(--foreground-active-selected);
}
.igx-tree-node__wrapper--focused {
  box-shadow: inset 0 0 0 1px var(--border-color);
}
.igx-tree-node__wrapper--disabled {
  background: var(--background-disabled) !important;
  color: var(--foreground-disabled) !important;
  box-shadow: none !important;
  pointer-events: none;
}
.igx-tree-node__wrapper--disabled::after {
  display: none;
}
.igx-tree-node__wrapper--disabled .igx-tree-node__toggle-button {
  color: var(--foreground-disabled) !important;
}
.igx-tree-node__spacer {
  display: inline-block;
  width: 1.5rem;
}
.igx-tree-node__content {
  display: block;
  align-items: center;
  flex: 1;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.igx-tree-node__toggle-button {
  justify-content: center;
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  min-width: 1.5rem;
}
.igx-tree-node__drop-indicator {
  display: flex;
  visibility: hidden;
  position: absolute;
  right: 1.5rem;
  bottom: 0;
  width: calc(100% - ((1.5rem * 2) + (1.5rem + 0.5rem)));
}
.igx-tree-node__drop-indicator > div {
  flex: 1;
  height: 0.0625rem;
  background: var(--drop-area-color);
}
.igx-tree-node__group {
  overflow: hidden;
}
igx-watermark {
  --border-radius: var(--igx-watermark-border-radius, 0px);
  --link-background: var(--igx-watermark-link-background, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --background-image: var(--igx-watermark-background-image, url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTg0IiBoZWlnaHQ9IjEwNCIgdmlld0JveD0iMCAwIDE4NCAxMDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIG9wYWNpdHk9IjAuMDUiIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTYuNyAxMC4xTDEwLjMgOC4zOTk5OUwxMi4xIDEuNjk5OTlMNy4xIDAuMzk5OTk0TDUuMyA3LjA5OTk5TDIuMyA2LjI5OTk5TDEuMSAxMC42TDQuMSAxMS40TDEuMiAyMi4yQzAuMjk5OTk3IDI1LjUgMC4xOTk5OTcgMjcuOSAwLjc5OTk5NyAyOS40QzEuNSAzMC45IDMuMSAzMiA1LjcgMzIuN0M3LjMgMzMuMSA5IDMzLjMgMTAuNiAzMy40TDExLjUgMjkuM0w3LjcgMjguNEM2LjYgMjguMSA1LjkgMjcuNiA1LjggMjYuOUM1LjggMjUuNiA2IDI0LjMgNi40IDIzTDkuMSAxMi44TDE1LjUgMTQuNUwxNi43IDEwLjFaTTE5LjcgMzUuOEwyNCAxOS42TDI1LjEgMTkuNUMyNy41IDE5LjIgMzAgMTkuMSAzMi41IDE5LjNMMzMuOSAxNC4yQzMwLjkgMTQgMjcuOSAxNC40IDI1LjEgMTUuNEwyNS44IDEyLjZMMjAuOCAxMS4zTDE0LjYgMzQuNUwxOS43IDM1LjhaTTM2LjUgNDAuM0w0Mi43IDE3LjFMMzcuNiAxNS43TDMxLjQgMzguOUwzNi41IDQwLjNaTTQzLjggMTMuMkw0NS4yIDcuODk5OTlMNDAuMSA2LjQ5OTk5TDM4LjcgMTEuOEw0My44IDEzLjJaTTYzLjggMjQuMkM2Mi45IDIyLjYgNjEgMjEuNSA1OC4yIDIwLjdDNTUgMTkuOSA1MS44IDE5LjUgNDguNiAxOS40TDQ3LjcgMjNMNDkuMiAyMy4zQzUyLjIgMjMuOCA1NC44IDI0LjQgNTYuNyAyNC45QzU3LjYgMjUuMSA1OC40IDI1LjYgNTguOSAyNi4zQzU5LjMgMjcuMiA1OS40IDI4LjIgNTkgMjkuMUw1OC41IDMwLjhMNTIuNCAyOS43QzUwLjMgMjkuMiA0OC4xIDI5LjMgNDYuMSAzMC4xQzQ0LjYgMzAuOCA0My41IDMyLjMgNDIuOCAzNC43QzQxLjUgMzkuNiA0My4xIDQyLjcgNDcuNyA0My45QzUwLjMgNDQuNiA1MyA0NC43IDU1LjYgNDQuMkM1Ny4xIDQ1LjkgNTkuMSA0Ny4xIDYxLjMgNDcuNkw2Mi41IDQzLjhDNjIgNDMuNiA2MS41IDQzLjMgNjEuMiA0Mi44QzYxIDQyLjMgNjAuOSA0MS43IDYxLjEgNDEuMUw2My45IDMwLjVDNjQuOCAyNy44IDY0LjcgMjUuNyA2My44IDI0LjJaTTU3LjcgMzQuNEw1NiA0MC41TDU1LjEgNDAuNkM1My40IDQwLjYgNTEuNiA0MC41IDUwIDQwQzQ4LjEgMzkuNSA0Ny41IDM4LjIgNDggMzZDNDguMyAzNC4yIDQ5LjkgMzMgNTEuNyAzMy4zQzUxLjkgMzMuMyA1MiAzMy40IDUyLjIgMzMuNEw1Ny43IDM0LjRaTTcxLjUgNDkuNkw4MC4zIDE2LjhMNzUuMiAxNS40TDY2LjQgNDguMkw3MS41IDQ5LjZaIiBmaWxsPSIjMDA5OUZGIi8+Cjwvc3ZnPgo="));
  --color: var(--igx-watermark-color, #fff);
  --border-color: var(--igx-watermark-border-color, hsla(var(--igx-primary-500), var(--igx-primary-a)));
}
.igx-watermark {
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  pointer-events: none;
}
.igx-watermark__link {
  display: inline-flex;
  align-items: center;
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 0.875rem;
  padding: 0.125rem 0.25rem;
  line-height: normal;
  border-radius: var(--border-radius);
  border: 1px solid var(--border-color);
  color: var(--color);
  z-index: 10002;
  background-color: var(--link-background);
  pointer-events: all;
  text-decoration: none;
}
.igx-watermark__background-img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10001;
  pointer-events: none;
  background-image: var(--background-image);
  background-repeat: repeat;
  background-position: 1rem 1rem;
}
@media all and (-ms-high-contrast: none) {
  .igx-watermark__background-img {
    background-image: none;
  }
}
igx-navbar {
  --background: var(--igx-navbar-background, #47585C);
  --text-color: var(--igx-navbar-text-color, #FBFAF5);
  --idle-icon-color: var(--igx-navbar-idle-icon-color, white);
  --hover-icon-color: var(--igx-navbar-hover-icon-color, white);
  --shadow: var(--igx-navbar-shadow, var(--igx-elevation-4));
}
.igx-navbar {
  display: flex;
  position: relative;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 56px;
  max-height: 128px;
  padding: 1rem;
  background: var(--background);
  color: var(--text-color);
  box-shadow: var(--shadow);
  z-index: 4;
  overflow: hidden;
}
.igx-navbar__left, .igx-navbar__right, igx-navbar-action,
[igxNavbarAction], igx-navbar-title,
[igxNavbarTitle] {
  display: flex;
  align-items: center;
}
.igx-navbar__title, igx-navbar-title,
[igxNavbarTitle] {
  display: -webkit-inline-box;
  -webkit-line-clamp: 4;
  overflow: hidden;
  margin: 0;
  flex-grow: 1;
  -webkit-user-select: text;
          user-select: text;
  display: flex;
  flex-direction: row;
}
.igx-navbar__left, .igx-navbar__right {
  -webkit-user-select: none;
          user-select: none;
}
.igx-navbar__left > * + *, .igx-navbar__right > * + * {
  margin-left: 1rem;
}
.igx-navbar__left > igx-icon, .igx-navbar__right > igx-icon {
  cursor: pointer;
  color: var(--idle-icon-color);
  transition: color 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.igx-navbar__left > igx-icon:hover, .igx-navbar__right > igx-icon:hover {
  color: var(--hover-icon-color);
}
.igx-navbar__left {
  flex-grow: 1;
}
:root {
  --igx-secondary-50: 194, 56%, 92%;
  --igx-navbar-background: var(--tertiary);
  --igx-navbar-text-color: var(--surface);
  --igx-nav-drawer-item-active-text-color: var(--tertiary);
  --portal-background: var(--igx-navbar-background, hsla(var(--igx-primary-500), var(--igx-primary-a)));
  --pending-changes: var(--igx-primary-700);
  --pending-changes-contrast: var(--igx-primary-700-contrast);
}
body {
  background: hsla(var(--igx-surface-500));
  color: var(--igx-surface-500-contrast);
}
html, body {
  height: 100%;
}
h1, h2, h3, h4, h5, h6 {
  font-family: "Copernicus", "Times New Roman", Times, serif;
}
.igx-typography {
  /*It seems like this is a duplication of the above declaration*/
  /* h1 {
    font-size: 3rem;
  }

  h2 {
    font-size: 2.125rem;
  }

  h3 {
    font-size: 1.5rem;
  }

  h4 {
    font-size: 1.25rem;
  }

  h5 {
    font-size: 1rem;
  }

  h6 {
    font-size: 0.875rem;
  }*/
}
.igx-typography h1, .igx-typography h2, .igx-typography h3, .igx-typography h4, .igx-typography h5, .igx-typography h6, .igx-typography p, .igx-typography .igx-typography__body-1 {
  margin: 0;
}
.igx-typography h1, .igx-typography h2, .igx-typography h3 {
  color: hsla(var(--igx-primary-700));
}
.igx-typography h2, .igx-typography h3, .igx-typography h4, .igx-typography h5, .igx-typography h6, .igx-typography p, .igx-typography .igx-typography__body-1 {
  margin: 0;
}
.everywhen-logo-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 1rem;
}
.everywhen-logo-image {
  max-width: 100%;
  height: auto;
  width: 300px;
}
@media (max-width: 768px) {
  .everywhen-logo-image {
    width: 250px;
  }
}
@media (max-width: 480px) {
  .everywhen-logo-image {
    width: 200px;
  }
}
.outer-wrapper > *:not(router-outlet) {
  width: 100%;
}
.container {
  overflow: auto;
  padding: 0.5rem;
  width: 100%;
  align-items: stretch;
}
.row {
  display: flex;
  flex-direction: row;
}
.column {
  display: flex;
  flex-direction: column;
}
.wrap-panel {
  display: flex;
  flex-wrap: wrap;
}
.group {
  width: 100%;
  min-width: 2.5rem;
  min-height: 2.5rem;
  position: relative;
}
.module-group {
  padding: 1.25rem;
  height: 100%;
  width: 100%;
  min-width: 2.5rem;
  min-height: 2.5rem;
  align-items: stretch;
  position: relative;
}
.loading-group {
  padding: 1.25rem;
}
.fill {
  height: 100%;
  width: 100%;
}
.fill-height {
  height: 100%;
}
.fill-width {
  width: 100%;
}
.image {
  min-width: 0;
  min-height: 0;
  object-fit: cover;
  position: relative;
}
.centred {
  align-items: center;
}
.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}
.flex-row-grow {
  display: flex;
  flex-flow: row;
  flex-grow: 1;
}
.flex-column-grow {
  display: flex;
  flex-flow: column;
  flex-grow: 1;
}
.space-between {
  align-content: space-between;
  justify-content: space-between;
}
.stretch-self {
  align-self: stretch;
  justify-self: stretch;
}
.welcome {
  justify-content: center;
  align-items: center;
  text-align: center;
  margin: 0.5rem;
}
.no-padding {
  padding: 0px !important;
}
.heading-row {
  display: flex;
  padding: 0 0 1.25rem;
  align-items: stretch;
  position: relative;
  justify-content: space-between;
}
.read-only-panel {
  padding: 1rem;
  background-color: hsla(var(--igx-grays-100));
  border-top: 1px solid hsla(var(--igx-grays-700));
  border-bottom: 1px solid hsla(var(--igx-grays-700));
}
.no-wrap {
  white-space: nowrap;
}
.align-right {
  align-self: flex-end;
}
.justified {
  text-align: justify;
}
.pre {
  white-space: pre-wrap;
}
/* Hints */
.igx-input-group__hint:has(.portal-hint) {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
/* Dialogs 

.igx-overlay__wrapper--flex, .igx-overlay__wrapper--modal,
.igx-overlay__content--relative, .igx-overlay__content--modal {
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.igx-dialog {
  max-height: 95% !important;
}
.igx-dialog__window {
  max-height: 100% !important;
}

*/
/* Grids */
.grid {
  min-width: 2.5rem;
}
.grid-row {
  flex-grow: 1;
  flex-basis: 0;
  min-width: 2.5rem;
  min-height: 25rem;
  align-items: stretch;
  position: relative;
}
.grid-key {
  display: flex;
  flex-flow: row;
  width: 100%;
  color: var(--header-text-color);
  justify-content: flex-start;
  align-items: center;
}
.grid-key-title {
  margin-right: 0.5rem;
}
.grid-key-item {
  margin: 0 0.5rem;
  border: 1px solid hsla(var(--igx-grays-300));
  padding: 0.25rem 0.5rem;
}
.grid-icon {
  height: 100%;
  width: 100%;
  align-content: center;
  justify-content: center;
}
.currentSubmissionItemRow {
  --current-submission-background: var(--igx-secondary-300);
  --current-submission-color: var(--igx-secondary-300-contrast);
  --current-submission-font-weight: 600;
  background: hsla(var(--current-submission-background), 0.45);
  border: hsla(var(--igx-primary-500));
  color: var(--current-submission-color);
  font-weight: var(--current-submission-font-weight);
}
.currentSubmissionItemRow .icon {
  color: var(--current-submission-color);
}
.currentSubmissionItemRow .change-type {
  color: var(--current-submission-color) !important;
  font-weight: var(--current-submission-font-weight) !important;
}
.currentSubmissionItemRow:hover {
  color: var(--primary);
}
.currentSubmissionItemRow:hover .icon, .currentSubmissionItemRow:hover .change-type {
  color: var(--primary) !important;
}
.grid-key-item.currentSubmissionItemRow:hover {
  color: var(--current-submission-color);
}
.pendingSubmissionItemRow {
  --pending-submission-background: var(--igx-primary-100);
  --pending-submission-color: var(--igx-primary-100-contrast);
  --pending-submission-font-weight: 400;
  background: hsla(var(--pending-submission-background), 0.25);
  border: hsla(var(--igx-primary-500));
  color: var(--pending-submission-color);
  font-weight: var(--pending-submission-font-weight);
}
.pendingSubmissionItemRow .icon {
  color: var(--pending-submission-color);
}
.pendingSubmissionItemRow .change-type {
  color: var(--pending-submission-color) !important;
  font-weight: var(--pending-submission-font-weight) !important;
}
.pendingSubmissionItemRow:hover .icon, .pendingSubmissionItemRow:hover .change-type {
  color: var(--row-hover-text-color) !important;
}
.igx-grid__tr--selected.currentSubmissionItemRow,
.igx-grid__tr--selected.pendingSubmissionItemRow {
  background: hsla(var(--igx-secondary-50));
  color: var(--igx-secondary-50-contrast);
}
.igx-grid__tr--selected.currentSubmissionItemRow .icon, .igx-grid__tr--selected.currentSubmissionItemRow .change-type,
.igx-grid__tr--selected.pendingSubmissionItemRow .icon,
.igx-grid__tr--selected.pendingSubmissionItemRow .change-type {
  color: var(--igx-secondary-50-contrast) !important;
}
/* Changes */
.pending-changes {
  position: absolute;
  z-index: 100;
  background: hsla(var(--pending-changes));
  border-radius: 0.3rem;
  color: var(--pending-changes-contrast) !important;
  font-size: x-small;
  line-height: normal;
}
.pending-changes.warning {
  background: hsla(var(--igx-error-500));
}
/* Navigation */
.nav-item-detail {
  margin: 0 0.8rem;
  text-align: right;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Widgets */
.widget-panel {
  display: flex;
  flex-wrap: wrap;
  margin: 0.75rem;
}
.widget {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 33%;
  min-width: 25rem;
  min-height: 12rem;
}
.widget-title {
  flex-grow: 1;
  align-self: center;
}
.widget-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  margin: 0.75rem;
  padding: 1.5rem;
  border: 2px solid hsla(var(--igx-grays-700));
  border-radius: 2rem;
  cursor: pointer;
}
.widget-container:hover {
  border-color: hsla(var(--igx-grays-900));
  background-color: hsla(var(--igx-grays-200), 0.5);
}
.widget-container:hover .header-group .widget-icon {
  color: hsla(var(--igx-grays-900));
}
.widget-container .button-group {
  background: none !important;
  justify-content: center;
  height: 100%;
  align-items: center;
  margin: 0rem;
}
.widget-icon {
  font-size: 2rem;
  width: 2rem;
  height: 2rem;
  margin: 0.5rem 1rem 0.5rem 0;
  color: hsla(var(--igx-grays-700));
  align-self: center;
}
.widget-submission-change-count {
  display: flex;
  flex-direction: row;
  flex-grow: 0;
  flex-shrink: 1;
  align-self: center;
  align-items: center;
  justify-self: center;
  justify-content: center;
  min-width: 2.5rem;
  min-height: 2.5rem;
  background: hsla(var(--pending-changes));
  border-radius: 0.75rem;
  color: var(--pending-changes-contrast);
  line-height: normal;
  font-weight: 400;
  font-size: 1.5rem;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
}
@media screen and (max-width: 992px) {
  .widget {
    width: 50%;
  }
}
@media screen and (max-width: 768px) {
  .widget {
    width: 100%;
  }
}
/* Detail fields */
.detail-title {
  margin: 10px 10px 20px;
}
.detail-subtitle {
  margin: 0 0 10px !important;
}
.detail-wrapper {
  margin: 1rem 2rem;
}
.detail-section {
  display: flex;
  flex-direction: column;
  margin-top: 0.5rem;
}
.detail-panel {
  display: flex;
}
.field-group {
  margin: 0rem;
  width: 50%;
  align-items: stretch;
  height: max-content;
}
.wide-field-group {
  margin: 0rem;
  width: 100%;
  align-items: stretch;
  height: max-content;
  text-align: justify;
}
.wide-field-group .group-detail {
  flex-direction: column;
}
.wide-field-group .group-detail .label {
  width: auto !important;
}
@media screen and (max-width: 992px) {
  .field-group {
    width: 100%;
  }
}
/* Side Panel Wrapper Content Styling */
.side-panel-container form {
  display: flex;
  flex-flow: column;
  align-items: center;
  padding: 0.5rem;
  width: 100%;
  min-width: 245px;
}
.side-panel-container form > * {
  width: 100%;
}
.side-panel-container a {
  padding-top: 0.5rem;
  cursor: pointer;
}
.side-panel-container button {
  margin-top: 15px;
  width: 100%;
}
/* Items e.g. School/Policy */
.current-item {
  color: var(--primary);
}
.past-item {
  color: var(--igx-grays-600);
}
/* Submission */
.submit-changes-button {
  align-self: flex-end;
  color: hsla(var(--igx-primary-500));
  background: hsla(var(--igx-primary-500-contrast));
  border: 0.2rem solid hsla(var(--igx-primary-500));
}
.submit-changes-button:active {
  color: hsla(var(--igx-primary-500));
  background: hsla(var(--igx-primary-500-contrast));
  border: 0.2rem solid hsla(var(--igx-primary-500));
  filter: brightness(0.9);
}
.submit-changes-button:hover {
  color: hsla(var(--igx-primary-500));
  background: hsla(var(--igx-primary-500-contrast));
  border: 0.2rem solid hsla(var(--igx-primary-500));
  filter: brightness(1.1);
}
.submission-change-panel {
  width: 100%;
}
.submission-change-header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex: 1 0 0%;
  padding: 1rem;
  font-weight: 400;
  font-size: 1.5rem;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.75rem;
  border-radius: 0.25rem;
  background-color: hsla(var(--igx-grays-200));
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.submission-change-title {
  flex-grow: 1;
  max-width: 100%;
}
.submission-change-count {
  float: right;
  background: hsla(var(--pending-changes));
  border-radius: 0.5rem;
  padding: 0.2rem 0.45rem;
  color: var(--pending-changes-contrast);
  line-height: normal;
  font-size: smaller;
}
.submission-change-rows {
  max-height: 24rem;
  overflow-y: auto;
}
.submission-change-row {
  display: flex;
  flex-flow: row;
  margin-bottom: 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid hsla(var(--igx-grays-200));
}
.submission-change-row .icon-button {
  height: 2.25rem;
  width: 2.25rem;
  margin: 0 0.25rem;
  align-self: center;
}
.submission-change-row .icon-button .icon {
  font-size: 1.5rem;
  width: 1.5rem;
  height: 1.5rem;
}
.submission-item-change {
  width: 100%;
  align-self: center;
  margin-right: 1rem;
}
.item-change-edit {
  /*color: orange;*/
  color: var(--igx-primary-500);
}
.item-change-remove {
  /*color: black;*/
  color: var(--igx-primary-500);
}
.item-change-add {
  color: var(--igx-primary-500);
}
.submission-changes-button {
  display: flex;
  flex-basis: content;
  margin-right: 1rem;
}
/* Forms */
form {
  align-content: inherit;
  justify-content: inherit;
}
form > .button {
  margin: 0.5rem;
  height: max-content;
  min-width: 10rem;
}
.submission-controls {
  display: flex;
  flex-direction: row;
  padding: 0 0.5rem 0 1.25rem;
  position: relative;
  min-width: 2.5rem;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
}
.submission-controls .button {
  margin: 0.5rem;
  min-width: 10rem;
  width: min-content;
  flex-shrink: 0;
  height: max-content;
}
/* Dialogs */
.dialog-content {
  display: flex;
  flex-direction: row;
}
.dialog-icon {
  min-width: 2.25rem !important;
  padding: 0.25rem !important;
  min-height: 2.25rem !important;
  justify-content: center;
  align-items: center;
  margin-right: 0.5rem;
}
.dialog-message {
  align-self: center;
}
/* Buttons */
.button-group {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  align-items: stretch;
  position: relative;
  margin: 0 0 0.5rem;
  background-color: hsla(var(--igx-grays-200));
}
.icon-button {
  min-width: 2.25rem !important;
  padding: 0.25rem 0.25rem !important;
  min-height: 2.25rem !important;
  color: var(--surface);
}
.back-button {
  top: 1.25rem;
  position: relative;
  margin: 0 0.5rem;
  color: hsla(var(--igx-surface-500));
  background-color: hsla(var(--igx-secondary-700));
}
/*Note that using these interferes with setting the IgxButton attribute value to outlined.*/
.button-primary {
  color: hsla(var(--igx-surface-500));
  background-color: hsla(var(--igx-primary-600));
}
.button-secondary {
  color: hsla(var(--igx-surface-500));
  background-color: hsla(var(--igx-primary-600));
}
/* Input styles */
.checkbox-input {
  width: 1.25rem;
  margin: 0rem 0rem 0rem auto !important;
}
.checkbox-label {
  transform: translateY(50%) !important;
  overflow: hidden !important;
  margin: unset !important;
  align-items: center;
}
.radio-group {
  width: max-content;
  height: max-content;
}
.radio {
  padding: 0.1rem 0.5rem;
}
/* READONLY not disabled */
.igx-input-group--disabled .igx-input-group__input,
.igx-input-group--disabled .igx-input-group__file-input,
.igx-input-group--disabled.igx-input-group--required .igx-input-group__input,
.igx-input-group--disabled.igx-input-group--required .igx-input-group__file-input,
.igx-input-group--indigo.igx-input-group--disabled .igx-input-group__input,
.igx-input-group--indigo.igx-input-group--disabled .igx-input-group__file-input {
  color: var(--igx-surface-500-contrast) !important;
}
.igx-input-group--disabled,
.igx-input-group--disabled.igx-input-group--required {
  color: var(--igx-surface-500-contrast) !important;
}
/* Borders */
.border-red {
  border: 2px solid red;
  border-radius: 5px;
  padding: 2px;
}
.border-orange {
  border: 2px solid orange;
  border-radius: 5px;
  padding: 2px;
}
.border-yellow {
  border: 2px solid yellow;
  border-radius: 5px;
  padding: 2px;
}
.border-green {
  border: 2px solid green;
  border-radius: 5px;
  padding: 2px;
}
/* Alerts */
.alert-primary {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary), white 80%);
  border-color: color-mix(in srgb, var(--primary), white 50%);
}
.alert-secondary {
  color: var(--tertiary);
  background-color: color-mix(in srgb, var(--tertiary), white 90%);
  border-color: color-mix(in srgb, var(--tertiary), white 60%);
}
.alert-success {
  color: var(--success);
  background-color: color-mix(in srgb, var(--success), white 90%);
  border-color: color-mix(in srgb, var(--success), white 60%);
}
.alert-danger {
  color: var(--error);
  background-color: color-mix(in srgb, var(--error), white 90%);
  border-color: color-mix(in srgb, var(--error), white 60%);
}
.alert-warning {
  color: var(--warn);
  background-color: color-mix(in srgb, var(--warn), white 90%);
  border-color: color-mix(in srgb, var(--warn), white 60%);
}
.alert-info {
  color: var(--info);
  background-color: color-mix(in srgb, var(--info), white 90%);
  border-color: color-mix(in srgb, var(--info), white 60%);
}
.alert {
  position: relative;
  padding: 0.75rem 1.25rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  width: 100%;
}
/* App loading */
.index-outer {
  height: 100%;
  width: 100%;
  background-color: var(--portal-background);
}
.index-inner {
  height: 60%;
  width: 60%;
  max-width: 700px;
  min-width: 380px;
  min-height: 420px;
  border-radius: 40px;
  background-color: var(--surface);
}
.index-message {
  font-weight: bold !important;
  margin-top: 40px !important;
}
/* Loading spinner */
.loading-spinner {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
  margin-top: 40px;
}
.loading-spinner div {
  position: absolute;
  width: 6px;
  height: 6px;
  background: var(--portal-background);
  border-radius: 50%;
  animation: loading-spinner 1.2s linear infinite;
}
.loading-spinner div:nth-child(1) {
  animation-delay: 0s;
  top: 37px;
  left: 66px;
}
.loading-spinner div:nth-child(2) {
  animation-delay: -0.1s;
  top: 22px;
  left: 62px;
}
.loading-spinner div:nth-child(3) {
  animation-delay: -0.2s;
  top: 11px;
  left: 52px;
}
.loading-spinner div:nth-child(4) {
  animation-delay: -0.3s;
  top: 7px;
  left: 37px;
}
.loading-spinner div:nth-child(5) {
  animation-delay: -0.4s;
  top: 11px;
  left: 22px;
}
.loading-spinner div:nth-child(6) {
  animation-delay: -0.5s;
  top: 22px;
  left: 11px;
}
.loading-spinner div:nth-child(7) {
  animation-delay: -0.6s;
  top: 37px;
  left: 7px;
}
.loading-spinner div:nth-child(8) {
  animation-delay: -0.7s;
  top: 52px;
  left: 11px;
}
.loading-spinner div:nth-child(9) {
  animation-delay: -0.8s;
  top: 62px;
  left: 22px;
}
.loading-spinner div:nth-child(10) {
  animation-delay: -0.9s;
  top: 66px;
  left: 37px;
}
.loading-spinner div:nth-child(11) {
  animation-delay: -1s;
  top: 62px;
  left: 52px;
}
.loading-spinner div:nth-child(12) {
  animation-delay: -1.1s;
  top: 52px;
  left: 62px;
}
@keyframes loading-spinner {
  0%, 20%, 80%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
}
.hidden {
  display: none !important;
}