Custom CSS styling - For the 'List View Swipe' widget

Hello,

I don't seem to be able to custom style the List Style Widget.

In the documentation is says the following can be overwritten:

Styling

• Styling base class is .widget-listview-swipe
• Default style, could be overwritten in CSS:
  • The 'widget-listview-swipe-foreground' will be white #FFFFF
  • The 'widget-listview-swipe-background' will be light light gray #d3d3d3
  • The 'widget-listview-swipe-background-after' will be gray #808080
• Custom style applied to the .mx-listview-item ar normal
• Custom style to all swipe widget could also be applied to:
  • .widget-listview-swipe-foreground
  • .widget-listview-swipe-background-left
  • .widget-listview-swipe-background-right
  • .widget-listview-swipe-background-shared
  • .widget-listview-swipe-background-after-left
  • .widget-listview-swipe-background-after-right
  • .widget-listview-swipe-background-after-shared
• Interactive classes
  • .will-accept-swipe
  • .swiping-right
  • .swiping-left

In my <app folder>\theme\styles\css\custom\custom.css I have the following entry:

.widget-listview-swipe-foreground {
 background-color: #C4DFFC;
}

However it doesn't seem to have taken affect when I inspect the styling:

Does anyone know where I'm going wrong?

Thanks in advance.

Adrian