:host {
  --padding: 0.25rem;

  --background: var(--l-color-surface-overlay);
  --border-radius: 6px;
  --shadow: var(--l-shadow-md);
  --show-duration: 150;
  --hide-duration: 150;

  display: inline-block;
  position: relative;
}

.trigger {
  display: contents;
}

[popover] {
  inset: unset;
  overflow: visible;
  box-sizing: border-box;
  width: max-content;
  padding: var(--padding);
  margin: 0;
  border: 1px solid var(--l-color-border-overlay);
  border-radius: var(--border-radius);
  background: var(--background);
  color: var(--l-color-text-primary);
  box-shadow: var(--shadow);
  font-size: 0.875rem;
  line-height: 1.5;
}

/* Lightweight separator alternative to <l-divider> — same dimensions, no extra import. */
::slotted(hr) {
  height: 1px;
  margin-block: var(--padding);
  margin-inline: calc(var(--padding) * -1);
  border: 0;
  background: var(--l-color-divider);
}