/**
 * @license EUPL-1.2
 * Copyright (c) 2020-2024 Frameless B.V.
 * Copyright (c) 2021-2024 Gemeente Utrecht
 */
.utrecht-select {
  background-color: var(--utrecht-select-background-color, var(--utrecht-form-control-background-color));
  border-block-end-width: var(--utrecht-select-border-block-end-width, var(--utrecht-select-border-width, var(--utrecht-form-control-border-width)));
  border-block-start-width: var(--utrecht-select-border-width, var(--utrecht-form-control-border-width));
  border-color: var(--utrecht-select-border-color, var(--utrecht-form-control-border-color));
  border-inline-end-width: var(--utrecht-select-border-width, var(--utrecht-form-control-border-width));
  border-inline-start-width: var(--utrecht-select-border-width, var(--utrecht-form-control-border-width));
  border-radius: var(--utrecht-select-border-radius, var(--utrecht-form-control-border-radius, 0));
  border-style: solid;
  color: var(--utrecht-select-color, var(--utrecht-form-control-color));
  font-family: var(--utrecht-select-font-family, var(--utrecht-form-control-font-family));
  font-size: var(--utrecht-select-font-size, var(--utrecht-form-control-font-size));
  font-weight: var(--utrecht-select-font-size, var(--utrecht-form-control-font-weight, initial));
  inline-size: 100%;
  line-height: var(--utrecht-select-line-height, var(--utrecht-form-control-line-height, initial));
  min-block-size: var(--utrecht-select-min-block-size, var(--utrecht-pointer-target-min-size, 44px));
  min-inline-size: var(--utrecht-pointer-target-min-size, 44px);
  max-inline-size: var(--utrecht-select-max-inline-size, var(--utrecht-form-control-max-inline-size));
  padding-block-end: var(--utrecht-select-padding-block-end, var(--utrecht-form-control-padding-block-end));
  padding-block-start: var(--utrecht-select-padding-block-start, var(--utrecht-form-control-padding-block-start));
  padding-inline-end: var(--utrecht-select-padding-inline-end, var(--utrecht-form-control-padding-inline-end));
  padding-inline-start: var(--utrecht-select-padding-inline-start, var(--utrecht-form-control-padding-inline-start));
}

.utrecht-select--disabled {
  background-color: var(--utrecht-select-disabled-background-color, var(--utrecht-form-control-disabled-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-color: var(--utrecht-select-disabled-border-color, var(--utrecht-form-control-disabled-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
  color: var(--utrecht-select-disabled-color, var(--utrecht-form-control-disabled-color, var(--utrecht-select-color, var(--utrecht-form-control-color))));
  cursor: var(--utrecht-action-disabled-cursor, not-allowed);
}

.utrecht-select--hover {
  background-color: var(--utrecht-select-hover-background-color, var(--utrecht-form-control-hover-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-color: var(--utrecht-select-hover-border-color, var(--utrecht-form-control-hover-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
  color: var(--utrecht-select-hover-color, var(--utrecht-form-control-hover-color, var(--utrecht-select-color, var(--utrecht-form-control-color))));
}

.utrecht-select--focus {
  background-color: var(--utrecht-select-focus-background-color, var(--utrecht-form-control-focus-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-color: var(--utrecht-select-focus-border-color, var(--utrecht-form-control-focus-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
  color: var(--utrecht-select-focus-color, var(--utrecht-form-control-focus-color, var(--utrecht-select-color, var(--utrecht-form-control-color))));
}

.utrecht-select--focus-visible {
  --_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0)
    var(--utrecht-focus-inverse-outline-color, transparent);
  box-shadow: var(--_utrecht-focus-ring-box-shadow);
  outline-color: var(--utrecht-focus-outline-color, revert);
  outline-offset: var(--utrecht-focus-outline-offset, revert);
  outline-style: var(--utrecht-focus-outline-style, revert);
  outline-width: var(--utrecht-focus-outline-width, revert);
  z-index: 1;
}

.utrecht-select--busy {
  cursor: var(--utrecht-action-busy-cursor, busy);
}

.utrecht-select--invalid {
  --_utrecht-select-border-width: var(
    --utrecht-select-invalid-border-width,
    var(
      --utrecht-form-control-invalid-border-width,
      var(--utrecht-select-border-width, var(--utrecht-form-control-border-width))
    )
  );
  background-color: var(--utrecht-select-invalid-background-color, var(--utrecht-form-control-invalid-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-width: var(--_utrecht-select-border-width);
  border-block-end-width: var(--utrecht-select-invalid-border-block-end-width, var(--utrecht-form-control-invalid-border-block-end-width, var(--utrecht-select-border-block-end-width, var(--utrecht-form-control-border-block-end-width, var(--_utrecht-select-border-width)))));
  border-color: var(--utrecht-select-invalid-border-color, var(--utrecht-form-control-invalid-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
}
.utrecht-select--html-select {
}
.utrecht-select--html-select:hover {
  background-color: var(--utrecht-select-hover-background-color, var(--utrecht-form-control-hover-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-color: var(--utrecht-select-hover-border-color, var(--utrecht-form-control-hover-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
  color: var(--utrecht-select-hover-color, var(--utrecht-form-control-hover-color, var(--utrecht-select-color, var(--utrecht-form-control-color))));
}
.utrecht-select--html-select:focus {
  background-color: var(--utrecht-select-focus-background-color, var(--utrecht-form-control-focus-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-color: var(--utrecht-select-focus-border-color, var(--utrecht-form-control-focus-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
  color: var(--utrecht-select-focus-color, var(--utrecht-form-control-focus-color, var(--utrecht-select-color, var(--utrecht-form-control-color))));
}
.utrecht-select--html-select:focus-visible {
  --_utrecht-focus-ring-box-shadow: 0 0 0 var(--utrecht-focus-outline-width, 0)
    var(--utrecht-focus-inverse-outline-color, transparent);
  box-shadow: var(--_utrecht-focus-ring-box-shadow);
  outline-color: var(--utrecht-focus-outline-color, revert);
  outline-offset: var(--utrecht-focus-outline-offset, revert);
  outline-style: var(--utrecht-focus-outline-style, revert);
  outline-width: var(--utrecht-focus-outline-width, revert);
  z-index: 1;
}
.utrecht-select--html-select:disabled {
  background-color: var(--utrecht-select-disabled-background-color, var(--utrecht-form-control-disabled-background-color, var(--utrecht-select-background-color, var(--utrecht-form-control-background-color))));
  border-color: var(--utrecht-select-disabled-border-color, var(--utrecht-form-control-disabled-border-color, var(--utrecht-select-border-color, var(--utrecht-form-control-border-color))));
  color: var(--utrecht-select-disabled-color, var(--utrecht-form-control-disabled-color, var(--utrecht-select-color, var(--utrecht-form-control-color))));
  cursor: var(--utrecht-action-disabled-cursor, not-allowed);
}

.utrecht-select--html-select:not([multiple]) {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-image: var(--utrecht-select-background-image);
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 1.4em;
}