.rich-select {
  flex: 1;
}

/* v3 theming for <just-rich-select> — match the cream text inputs.
   Custom properties inherit into the component's shadow tree. */
just-rich-select {
  --theme-refresh-background-white: rgba(255, 255, 255, 0.6);
  --theme-refresh-background-grey-1: rgba(255, 255, 255, 0.6);
  --theme-refresh-background-blue-1: rgba(255, 255, 255, 0.6);
  --theme-refresh-border-grey-medium: rgba(6, 6, 8, 0.15);
  --border-radius: 0;
  --input-height-refresh: 50px;
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 15px;
  color: var(--color-near-black);
}

just-rich-select .just-rich-option-plain {
  background-color: #FAF7F0;
}

just-rich-select just-rich-option[active] .just-rich-option-plain,
just-rich-select just-rich-option:active[selected] .just-rich-option-plain {
  background-color: #F3E5D5;
}

/* v3 theming for <just-currency-picker> — scoped (not shadow), so style descendants directly */
just-currency-picker .just-currency-picker .flex-box {
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(6, 6, 8, 0.15);
  border-radius: 0;
  min-height: 50px;
  padding: 4px 6px;
  transition: border-color 0.2s ease-out;
}

just-currency-picker .just-currency-picker .flex-box:hover,
just-currency-picker .just-currency-picker .flex-box:focus-within {
  border: 1px solid var(--color-amber);
}

just-currency-picker .just-currency-picker input {
  background: transparent;
  border: none;
  padding: 10px 10px;
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 15px;
  color: var(--color-near-black);
}

just-currency-picker .just-currency-picker .pill {
  border-radius: 0;
  border: 1px solid rgba(6, 6, 8, 0.15);
  background: rgba(6, 6, 8, 0.04);
  color: var(--color-near-black);
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 13px;
  padding: 4px 10px;
}

just-currency-picker .just-currency-picker .pill svg {
  stroke: var(--color-near-black);
}

just-currency-picker .just-currency-picker .pill:hover {
  background: var(--color-near-black);
  color: var(--color-hard-white);
  border-color: var(--color-near-black);
}

just-currency-picker .just-currency-picker .pill:hover svg {
  stroke: var(--color-hard-white);
}

just-currency-picker .just-currency-picker .active-pill {
  background: var(--color-near-black);
  color: var(--color-hard-white);
  border-color: var(--color-near-black);
}

just-currency-picker .just-currency-picker .active-pill svg {
  stroke: var(--color-hard-white);
}