/* The fill stays behind text without wrapping/reparenting primitive items. */
:where(.fluid-hover-surface) {
  position: relative;
  isolation: isolate;
}

/* A list paints the fill in its own current-row colour (`--fluid-hover-fill`),
   so a row lit by the pointer and one lit by the keyboard look the same. */
.fluid-hover-highlight {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: -1;
  border-radius: calc(var(--nested-radius, var(--radius-icon)) * var(--nested-corner-smoothing, 1));
  corner-shape: var(--nested-corner-shape, round);
  background: var(--fluid-hover-fill, var(--control-hover-surface));
}

/* Only replace the hovered row's fill once a measured overlay is available.
   Focus rings, checked marks, text colors and destructive states stay native. */
.fluid-hover-surface[data-fluid-hover-painted] [data-fluid-hover-item][data-fluid-hover-active] {
  background-color: transparent;
  transition-property: color, border-color;
}