/* Keep the visible icons in place while expanding each link's touch target. */
.menu-overlay .menu-overlay__social-row {
  gap: 10px;
}

body[data-menu-overlay-version="mobile"] .menu-overlay__social-row {
  gap: 48px;
}

.menu-overlay .menu-overlay__social-link {
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  padding: 11px;
  touch-action: manipulation;
}

.menu-overlay .menu-overlay__social-icon {
  width: 22px;
  height: 22px;
  pointer-events: none;
}

.menu-overlay .menu-overlay__social-icon.menu-overlay__social-icon--hover {
  inset: 11px;
}

/* Touch devices follow the native link immediately, without a hover preview. */
@media (hover: none), (pointer: coarse) {
  .menu-overlay .menu-overlay__social-icon--default {
    opacity: 1 !important;
    transition: none;
  }

  .menu-overlay .menu-overlay__social-icon--hover {
    display: none !important;
  }
}