:global(.ui-group) {
  &[data-state~="wrap"] {
    flex-wrap: wrap;
    &[data-state~="primary"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--primary-color);
      }
    }
    &[data-state~="secondary"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--secondary-color);
      }
    }
    &[data-state~="accent"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--accent-color);
      }
    }
    &[data-state~="triadic"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--triadic-color);
      }
    }
    &[data-state~="split"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--split-color);
      }
    }
    &[data-state~="dark"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--palette-dark-02);
      }
    }
    &[data-state~="gray"] {
      & > :global(.ui-input),
      & > :global(.ui-dropdown .ui-button),
      & > :global(.ember-power-select-multiple-trigger),
      & > :global(.ui-button) {
        box-shadow: 0 -1px 0 0 var(--palette-light-01);
      }
    }
  }
}