/* prettier-ignore */
:host {
  --bce-c300:var(--bce-c300-primary);
  --bce-c400:var(--bce-c400-primary);
  --bce-c500:var(--bce-c500-primary);
  --bce-c600:var(--bce-c600-primary);
  --bce-c700:var(--bce-c700-primary);
  --bce-con1:var(--bce-con1-primary);
  --bce-con2:var(--bce-con2-primary);
  --bce-con3:var(--bce-con3-primary);
  --bce-con4:var(--bce-con4-primary);
  display: inline-block;
}
:host .trigger {
  --bce-c300:var(--bce-con3-surface);
  --bce-c400:var(--bce-con3-surface);
  --bce-c500:var(--bce-con2-surface);
  --bce-c600:var(--bce-con2-surface);
  --bce-c700:var(--bce-con1-surface);
  cursor: pointer;
  text-transform: none;
}
:host [role=menu] {
  --bce-c-surface:var(--bce-c008-surface);
  z-index: 8;
  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.4);
  background-color: var(--bce-c500);
  border-radius: 4px;
  transition: opacity 150ms ease-in-out;
  opacity: 0;
  max-width: 400px;
  pointer-events: none;
}
:host [role=menu][data-active] {
  display: block;
  opacity: 1;
  pointer-events: auto;
}