.list {
  display: block;
  width: 100%;
  max-width: 352px;
  height: 100%;
  background: var(--color-ui-4);
  border-color: var(--color-ui-4);
  list-style: none;
  padding: 0;
  margin: 0;

  li:nth-child(even){
    background: var(--color-ui-3-50);
  }


  li[aria-selected="true"] {
    background: var(--color-brand-light-50);
    z-index: 1;
    color: var(--color-ui-1);
    font-weight: $font-weight-bold;
    .suppressed{
      opacity: 1;
    }
  }

  li:hover{
  background: var(--color-ui-2-80);
  }

  li[aria-selected="true"]:hover {
    background: var(--color-brand-light-80);

  }
}

ul {
  @include ignore-device-rendering();
}

ul[role="listbox"] {
  list-style: none;
  padding: 0;
  margin: 0;
}

[role="listitem"] {
  display: block;
  cursor: pointer;
}



