@use 'sass:map';
@use '../index' as *;

$select: (
  arrow-width: 2.75rem,
  border-color-focus: var(--c-p),
  border-radius: 2px,
  border-color: var(--c-d-80),
  border-color-hover: var(--c-d-80),
  border-color-invalid: var(--c-er),
  border-color-invalid-hover: var(--c-er),
  border-color-disabled: var(--c-d-80),
  border-width: 1px,
  border-width-focus: 2px,
  color-input: var(--c-d-100),
  color-placeholder: var(--c-d-100),
  counter-color: var(--c-d-100),
  group-separator-color: var(--c-n-60),
  group-title-font: var(--f-m),
  group-title-color: var(--c-d-100),
  shadow: none,
  shadow-hover: none,
  arrow-background-color: map.get($color, 'white'),
  arrow-background-color-hover: map.get($color, 'white'),
  arrow-background-color-invalid: map.get($color, 'white'),
  arrow-background-color-invalid-hover: map.get($color, 'white'),
  icon-fill: var(--c-d-100),
  icon-size: map.get($icon, 'xs'),
  multiple-dropdown-background-color: map.get($color, 'white'),
  multiple-dropdown-border: none,
  multiple-dropdown-separator-color: transparent,
  multiple-select-all-after: true,
  multiple-dropdown-toolbar-separator-color: transparent,
  multiple-dropdown-border-radius: 2px,
  multiple-dropdown-shadow: var(--sh-6),
  multiple-dropdown-margin: var(--s-2xs),
  multiple-dropdown-input-margin: var(--s-m) var(--s-m) var(--s-s),
  multiple-dropdown-input-width: calc(100% - (var(--s-m) * 2)),
  multiple-dropdown-container-max-height: 16rem,
  multiple_counter_background: var(--c-p-20),
  padding-vertical: var(--s-xs),
);
