select.select-base--selected,
select.select-base:focus {
  border-color: var(--hs-palette-primary-main);
  color: var(--hs-palette-primary-main);
}

select.select-base:disabled {
  cursor: default;
}

select.select-base:checked,
select.select-base:valid {
  color: var(--hs-palette-primary-main);
}

select.select-base:checked:invalid {
  color: var(--hs-color-input-fg);
}

.select-base {
  height: 4.6rem;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  border: var(--hs-border-dark);
  border-radius: var(--hs-radius-input);
  color: var(--hs-palette-primary-main);
  background-color: var(--hs-color-input-bg);
  padding: var(--hs-spacing-base) calc(var(--hs-spacing-large) * 2.5) var(--hs-spacing-base) var(--hs-spacing-large);
  gap: var(--hs-spacing-base);
  font-family: inherit;
  font-size: 1.4rem;
  cursor: pointer;
  outline: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -4 32 32'%3E%3Cpath d='M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z' /%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  transition-property: color, border-color, background-color, background-image;
  transition-duration: var(--hs-transitions-duration-base);
  transition-timing-function: var(--hs-transitions-easing);
}
