/*
 * Copyright (C) 2017-2019 Dremio Corporation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@use "../../utilities/bg";
@use "../../utilities/border";
@use "../../utilities/flex";
@use "../../utilities/gap";
@use "../../utilities/margin";
@use "../../utilities/padding";
@use "../../utilities/text";

.listbox,
.listbox-group {
  @extend .flex;
  @extend .flex-col;
}

.listbox-group + .listbox-group,
.listbox-group + .listbox-group-label {
  &:before {
    display: block;
    border-top: 1px solid var(--border--neutral);
    content: "";
  }
}

.listbox-group + .listbox-group-label:before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.listbox-group-label {
  @extend .px-1;
  @extend .pt-1;
  @extend .text-sm;
  @extend .text-medium;
  color: var(--text--primary);
  position: relative;
}

.listbox-item {
  @extend .flex;
  @extend .items-center;
  @extend .p-1;

  &:hover {
    background: var(--fill--primary--hover);
  }

  &--active,
  &[aria-selected="true"] {
    background: var(--fill--primary--selected);
    &:hover {
      background: var(--fill--primary--selected--hover);
    }
  }

  &[aria-disabled="true"],
  &:disabled,
  &[disabled] {
    background: transparent;
    color: var(--text--disabled);
    cursor: default;
  }
}
