$lookup-panel-background-color: var(--rz-base-background-color) !default;
$lookup-panel-padding: 1rem !default;
$lookup-search-gap: 0.5rem !default;
$lookup-search-margin-bottom: 0.5rem !default;

.rz-lookup-panel {
  background-color: var(--rz-lookup-panel-background-color);
  padding: var(--rz-lookup-panel-padding);
  container-type: inline-size;
  container-name: rz-lookup-panel;
}

.rz-lookup-search {
  display: flex;
  gap: var(--rz-lookup-search-gap);
  margin-bottom: var(--rz-lookup-search-margin-bottom);
  align-items: center;

  input {
    flex: auto;
    @extend %input;
  }
}

.rz-lookup-search-input-container {
  position: relative;
  flex: auto;
  display: flex;
  align-items: center;

  input {
    flex: auto;
    padding-inline-end: 1.75rem;
    @extend %input;
  }

  .rz-dropdown-clear-icon {
    position: absolute;
    inset-inline-end: 0.25rem;
    inset-block-start: 50%;
    transform: translateY(-50%);
    height: auto;
  }
}
