/* One centre-out fill for every boxed action. The timing and starting rectangle
   match the original header Contact control, including its keyboard state. */
:is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--control-border, #777);
  border-radius: 7px;
  background: transparent;
  color: var(--control-foreground, var(--background-white));
  box-shadow: none;
  transition: color .22s ease, border-color .32s ease;
}

:is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact])::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: 5px;
  background: var(--background-white);
  transform: scale(.12, .24);
  transform-origin: center;
  opacity: 0;
  pointer-events: none;
  transition: transform .36s cubic-bezier(.2, .7, .25, 1), opacity .18s ease;
}

/* Labels and icons stay above the fill without scaling their rendered pixels. */
:is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]) > * {
  position: relative;
  z-index: 1;
}

:is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]) > .link-label::before {
  display: none;
}

:is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]):not(:disabled):not([aria-disabled="true"]):focus-visible {
  color: var(--black);
  border-color: var(--background-white);
}

:is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]):not(:disabled):not([aria-disabled="true"]):focus-visible::before {
  transform: scale(1);
  opacity: 1;
}

@media (hover: hover) {
  :is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]):not(:disabled):not([aria-disabled="true"]):hover {
    color: var(--black);
    border-color: var(--background-white);
  }

  :is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]):not(:disabled):not([aria-disabled="true"]):hover::before {
    transform: scale(1);
    opacity: 1;
  }
}

:is(.button, .lineup-control):is(:disabled, [aria-disabled="true"]) {
  color: var(--control-foreground, var(--background-white));
  border-color: var(--control-border, #777);
  cursor: default;
  opacity: .55;
}

:is(.button, .lineup-control):is(:disabled, [aria-disabled="true"])::before {
  opacity: 0;
  transform: scale(.12, .24);
}

:is(.button, .lineup-control):is(:disabled, [aria-disabled="true"]) .label-text {
  font-size: 1em;
}

.lineup-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 44px;
  padding: 10px 14px;
  font-size: 13px;
  line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
  :is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact]),
  :is(.button, .lineup-control, .product-info .text-link, .site-header .site-nav a[data-nav-contact])::before {
    transition: none;
  }
}