fix(components): include mode classes on components for use in shadow (#17838)

- removes mode-less component classes from the internal CSS, use element instead
- adds mode specific classes `md` or `ios` for styling inside of shadow components
- adds e2e test that verifies mode classes exist on all ionic components, plus checks for specific classes that the components need for internal styling

fixes #17608

core/src/components/col/col.tsx

@@ -1,5 +1,6 @@
 import { Component, ComponentInterface, Element, Listen, Prop } from '@stencil/core';
 
+import { Mode } from '../../interface';
 import { matchBreakpoint } from '../../utils/media';
 
 const win = window as any;
@@ -12,6 +13,8 @@ const BREAKPOINTS = ['', 'xs', 'sm', 'md', 'lg', 'xl'];
   shadow: true
 })
 export class Col implements ComponentInterface {
+  mode!: Mode;
+
   @Prop({ context: 'window' }) win!: Window;
 
   @Element() el!: HTMLStencilElement;
@@ -247,6 +250,9 @@ export class Col implements ComponentInterface {
   hostData() {
     const isRTL = this.win.document.dir === 'rtl';
     return {
+      class: {
+        [`${this.mode}`]: true
+      },
       style: {
         ...this.calculateOffset(isRTL),
         ...this.calculatePull(isRTL),