:where(:root),
:where(:host) {
  --vaadin-overlay-border-width: 0px;
  --vaadin-overlay-backdrop-background: light-dark(
    oklch(from var(--aura-background-color-light) calc(l * 0.5) min(0.05, c * 4) h / 0.3),
    oklch(from var(--aura-background-color-dark) calc(l * 0.5) min(0.05, c * 4) h / 0.3)
  );
  --aura-overlay-outline-color: light-dark(
    oklch(from var(--aura-background-color-light) 0.1 c h / max(0.04, 0.03 + 0.04 * var(--aura-contrast-level))),
    oklch(from var(--aura-background-color-dark) 0.1 c h / max(0.04, 0.03 + 0.04 * var(--aura-contrast-level)))
  );
  --aura-overlay-inner-outline-color: hsla(0deg, 0%, 100%, max(3%, 2% + 4% * var(--aura-contrast-level)));
  --aura-overlay-outline-shadow:
    inset 0 0 0 1px var(--aura-overlay-inner-outline-color), 0 0 0 1px var(--aura-overlay-outline-color);
  --aura-overlay-shadow: var(--aura-shadow-m);
  --aura-overlay-backdrop-filter: blur(20px) brightness(1.1) saturate(1.2);
  --aura-overlay-surface-opacity: 0.85;

  @media (prefers-reduced-transparency: reduce) {
    --aura-overlay-surface-opacity: 1 !important;
  }
  --vaadin-popover-arrow-size: 8px;
  --vaadin-popover-arrow-inset: var(--vaadin-gap-l);
  --vaadin-popover-border-radius: var(--vaadin-radius-l);
  --vaadin-slider-bubble-arrow-size: 6px;
}

::part(overlay) {
  background: var(--vaadin-overlay-background, var(--aura-surface-color));
  --aura-surface-level: 4;
  --aura-surface-opacity: var(--aura-overlay-surface-opacity);
  box-shadow: var(--aura-overlay-outline-shadow), var(--vaadin-overlay-shadow, var(--aura-overlay-shadow));
  -webkit-backdrop-filter: var(--aura-overlay-backdrop-filter);
  backdrop-filter: var(--aura-overlay-backdrop-filter);
}

:not(vaadin-tooltip, vaadin-slider-bubble)::part(overlay) {
  font-family: var(--aura-font-family);
  font-size: var(--aura-font-size-m);
  font-weight: var(--aura-font-weight-regular);
  line-height: var(--aura-line-height-m);
  color: var(--vaadin-text-color);
}

vaadin-popover,
vaadin-slider-bubble {
  &::part(arrow) {
    background: var(--aura-surface-color-solid);
    margin: 1px;
  }
}