diff --git a/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/constants/ThemeConstants.java b/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/constants/ThemeConstants.java
new file mode 100644
index 0000000000..a0e9991dbc
--- /dev/null
+++ b/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/constants/ThemeConstants.java
@@ -0,0 +1,26 @@
+package com.adobe.cq.forms.core.components.internal.constants;
+
+/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+  ~ Copyright 2024 Adobe
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~     http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
+
+public class ThemeConstants {
+
+    public static final String RELATIVE_PATH_METADATA = "/metadata";
+    public static final String THEME_OVERRIDE = "themeOverride";
+    public static final String THEME_REF = "themeRef";
+    public static final String PROPERTY_CLIENTLIB_CATEGORY = "clientlibCategory";
+
+}
diff --git a/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/form/FormStructureParserImpl.java b/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/form/FormStructureParserImpl.java
index 59e8d89d32..46d52e7743 100644
--- a/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/form/FormStructureParserImpl.java
+++ b/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/form/FormStructureParserImpl.java
@@ -18,8 +18,10 @@
 import java.io.StringWriter;
 import java.io.Writer;
 
+import org.apache.commons.lang3.StringUtils;
 import org.apache.sling.api.SlingHttpServletRequest;
 import org.apache.sling.api.resource.Resource;
+import org.apache.sling.api.resource.ValueMap;
 import org.apache.sling.models.annotations.Model;
 import org.apache.sling.models.annotations.injectorspecific.InjectionStrategy;
 import org.apache.sling.models.annotations.injectorspecific.SlingObject;
@@ -28,6 +30,7 @@
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
+import com.adobe.cq.forms.core.components.internal.constants.ThemeConstants;
 import com.adobe.cq.forms.core.components.models.form.FormContainer;
 import com.adobe.cq.forms.core.components.models.form.FormStructureParser;
 import com.adobe.cq.forms.core.components.models.form.HtlUtil;
@@ -60,6 +63,36 @@ public String getClientLibRefFromFormContainer() {
         return getPropertyFromFormContainer(resource, FormContainer.PN_CLIENT_LIB_REF);
     }
 
+    @Override
+    public String getThemeClientLibRefFromFormContainer() {
+        String themeContentPath = null;
+        String themeClientLibRef = null;
+        if (request != null) {
+            themeContentPath = (String) request.getAttribute(ThemeConstants.THEME_OVERRIDE); // theme editor use-case
+        }
+        if (StringUtils.isBlank(themeContentPath)) {
+            if (request != null) {
+                themeContentPath = request.getParameter(ThemeConstants.THEME_OVERRIDE); // embed component use-case
+            }
+            if (StringUtils.isBlank(themeContentPath)) {
+                themeContentPath = getPropertyFromFormContainer(resource, ThemeConstants.THEME_REF); // normal including theme in form
+                                                                                                     // runtime
+            }
+        }
+        // get client library from theme content path
+        if (StringUtils.isNotBlank(themeContentPath)) {
+            Resource themeResource = resource.getResourceResolver().getResource(themeContentPath + ThemeConstants.RELATIVE_PATH_METADATA);
+            if (themeResource != null) {
+                ValueMap themeProps = themeResource.getValueMap();
+                themeClientLibRef = themeProps.get(ThemeConstants.PROPERTY_CLIENTLIB_CATEGORY, "");
+            } else {
+                logger.error("Invalid Theme Name {}", themeContentPath);
+            }
+        }
+
+        return themeClientLibRef;
+    }
+
     @Override
     public Boolean containsFormContainer() {
         return containsFormContainer(resource);
diff --git a/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/models/form/FormStructureParser.java b/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/models/form/FormStructureParser.java
index 6f01ed2943..22b5c00dfa 100644
--- a/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/models/form/FormStructureParser.java
+++ b/bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/models/form/FormStructureParser.java
@@ -37,6 +37,12 @@ public interface FormStructureParser {
      */
     String getClientLibRefFromFormContainer();
 
+    /**
+     *
+     * @returns reference to the client lib of the theme from form container
+     */
+    String getThemeClientLibRefFromFormContainer();
+
     /**
      * Checks if this resource contains a form container
      *
diff --git a/bundles/af-core/src/test/java/com/adobe/cq/forms/core/components/internal/models/v1/form/FormStructureParserImplTest.java b/bundles/af-core/src/test/java/com/adobe/cq/forms/core/components/internal/models/v1/form/FormStructureParserImplTest.java
index 4c2fc43a74..21ed91b95f 100644
--- a/bundles/af-core/src/test/java/com/adobe/cq/forms/core/components/internal/models/v1/form/FormStructureParserImplTest.java
+++ b/bundles/af-core/src/test/java/com/adobe/cq/forms/core/components/internal/models/v1/form/FormStructureParserImplTest.java
@@ -28,6 +28,7 @@
 import org.junit.jupiter.api.extension.ExtendWith;
 
 import com.adobe.cq.export.json.SlingModelFilter;
+import com.adobe.cq.forms.core.components.internal.constants.ThemeConstants;
 import com.adobe.cq.forms.core.components.internal.form.FormConstants;
 import com.adobe.cq.forms.core.components.models.form.*;
 import com.adobe.cq.forms.core.context.FormsCoreComponentTestContext;
@@ -179,6 +180,67 @@ public void containsFormContainer_should_return_false() {
         assertFalse(result);
     }
 
+    @Test
+    void testGetThemeClientLibRefFromFormContainer() {
+        String path = CONTENT_ROOT + "/myTestPage";
+        FormStructureParser formStructureParser = getFormStructureParserUnderTest(path);
+        String themeClientLibRef = formStructureParser.getThemeClientLibRefFromFormContainer();
+        assertEquals("fdtheme.test-theme", themeClientLibRef);
+    }
+
+    @Test
+    void testGetThemeClientLibRefWithRequestAttribute() {
+        String path = CONTENT_ROOT + "/myTestPage";
+        context.currentResource(path);
+        MockSlingHttpServletRequest request = context.request();
+        request.setAttribute(ThemeConstants.THEME_OVERRIDE, "/content/dam/formsanddocuments-themes/test-theme");
+        FormStructureParser formStructureParser = request.adaptTo(FormStructureParser.class);
+        String themeClientLibRef = formStructureParser.getThemeClientLibRefFromFormContainer();
+        assertEquals("fdtheme.test-theme", themeClientLibRef);
+    }
+
+    @Test
+    void testGetThemeClientLibRefWithRequestParameter() {
+        String path = CONTENT_ROOT + "/myTestPage";
+        context.currentResource(path);
+        MockSlingHttpServletRequest request = context.request();
+        request.setParameterMap(Collections.singletonMap(ThemeConstants.THEME_OVERRIDE,
+            "/content/dam/formsanddocuments-themes/test-theme"));
+        FormStructureParser formStructureParser = request.adaptTo(FormStructureParser.class);
+        String themeClientLibRef = formStructureParser.getThemeClientLibRefFromFormContainer();
+        assertEquals("fdtheme.test-theme", themeClientLibRef);
+    }
+
+    @Test
+    void testGetThemeClientLibRefWithInvalidThemePath() {
+        String path = CONTENT_ROOT + "/myTestPage";
+        context.currentResource(path);
+        MockSlingHttpServletRequest request = context.request();
+        request.setAttribute(ThemeConstants.THEME_OVERRIDE, "/content/dam/formsanddocuments-themes/invalid-theme");
+        FormStructureParser formStructureParser = request.adaptTo(FormStructureParser.class);
+        String themeClientLibRef = formStructureParser.getThemeClientLibRefFromFormContainer();
+        assertNull(themeClientLibRef);
+    }
+
+    @Test
+    void testGetThemeClientLibRefWithNonExistentTheme() {
+        String path = CONTENT_ROOT + "/myTestPage";
+        context.currentResource(path);
+        MockSlingHttpServletRequest request = context.request();
+        request.setAttribute(ThemeConstants.THEME_OVERRIDE, "/content/dam/formsanddocuments-themes/non-existent");
+        FormStructureParser formStructureParser = request.adaptTo(FormStructureParser.class);
+        String themeClientLibRef = formStructureParser.getThemeClientLibRefFromFormContainer();
+        assertNull(themeClientLibRef);
+    }
+
+    @Test
+    void testGetThemeClientLibRefWithoutTheme() {
+        String path = FORM_CONTAINER_PATH + "/container1";
+        FormStructureParser formStructureParser = getFormStructureParserUnderTest(path);
+        String themeClientLibRef = formStructureParser.getThemeClientLibRefFromFormContainer();
+        assertNull(themeClientLibRef);
+    }
+
     private FormStructureParser getFormStructureParserUnderTest(String resourcePath) {
         context.currentResource(resourcePath);
         MockSlingHttpServletRequest request = context.request();
diff --git a/bundles/af-core/src/test/resources/form/formstructparser/test-content.json b/bundles/af-core/src/test/resources/form/formstructparser/test-content.json
index cc387188f7..ff6f8de10e 100644
--- a/bundles/af-core/src/test/resources/form/formstructparser/test-content.json
+++ b/bundles/af-core/src/test/resources/form/formstructparser/test-content.json
@@ -14,6 +14,7 @@
         "thankyouPage": "/a/b/c",
         "thankyouMessage": "message",
         "clientLibRef" : "abc",
+        "themeRef": "/content/dam/formsanddocuments-themes/test-theme",
         "datepicker": {
           "jcr:primaryType": "nt:unstructured",
           "sling:resourceType": "core/fd/components/form/datepicker/v1/datepicker",
@@ -88,5 +89,27 @@
         }
       }
     }
+  },
+  "dam": {
+    "jcr:primaryType": "nt:unstructured",
+    "formsanddocuments-themes": {
+      "jcr:primaryType": "nt:unstructured",
+      "test-theme": {
+        "jcr:primaryType": "nt:unstructured",
+        "jcr:content": {
+          "jcr:primaryType": "dam:AssetContent",
+          "metadata": {
+            "jcr:primaryType": "nt:unstructured",
+            "clientlibCategory": "fdtheme.test-theme"
+          }
+        }
+      },
+      "invalid-theme": {
+        "jcr:primaryType": "nt:unstructured",
+        "jcr:content": {
+          "jcr:primaryType": "dam:AssetContent"
+        }
+      }
+    }
   }
 }
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/accordion/v1/accordion/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/accordion/v1/accordion/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..057cbf08dc
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/accordion/v1/accordion/_cq_styleConfig/.content.xml
@@ -0,0 +1,220 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="panel">
+    <items jcr:primaryType="nt:unstructured">
+        <accordionPanel
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Accordion"
+            id="af2_accordionpanel"
+            cssSelector=".cmp-accordion"
+            longTitle="Accordion Panel Container"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <accordionLabelContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Label Container"
+                        id="af2_accordionlabelcontainer"
+                        cssSelector=".cmp-accordion__label-container"
+                        longTitle="Accordion Label Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <accordionLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label"
+                                id="af2_accordionlabel"
+                                cssSelector=".cmp-accordion__label"
+                                longTitle="Accordion Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-accordion__label:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-accordion__label:focus"/>
+                            </states>
+                        </accordionLabel>
+                        <accordionHelpIcon
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Help Icon"
+                                id="af2_accordionhelpicon"
+                                cssSelector=".cmp-accordion__questionmark"
+                                longTitle="Accordion Help Icon"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_helpicon">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-accordion__questionmark:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-accordion__questionmark:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-accordion__questionmark:disabled"/>
+                            </states>
+                        </accordionHelpIcon>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-accordion__label-container:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-accordion__label-container:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-accordion__label-container:focus"/>
+                    </states>
+                </accordionLabelContainer>
+                <accordionDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_accordiondescriptionshort"
+                        cssSelector=".cmp-accordion__shortdescription"
+                        longTitle="Accordion Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </accordionDescriptionShort>
+                <accordionDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_accordiondescriptionlong"
+                        cssSelector=".cmp-accordion__longdescription"
+                        longTitle="Accordion Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-accordion__longdescription:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-accordion__longdescription:hover"/>
+                    </states>
+                </accordionDescriptionLong>
+                <accordionPanelItem
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Panel Item"
+                    id="af2_accordionpanelitem"
+                    cssSelector=".cmp-accordion__item"
+                    longTitle="Accordion Panel Item"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <accordionHeader
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Header"
+                                id="af2_accordionpanelheader"
+                                cssSelector=".cmp-accordion__header"
+                                longTitle="Accordion Header"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <active
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Active"
+                                        cssSelector=".cmp-accordion__header:active"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-accordion__header:hover"/>
+                            </states>
+                        </accordionHeader>
+                        <accordionHeaderButton
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Header Button"
+                            id="af2_accordionheaderbutton"
+                            cssSelector=".cmp-accordion__button"
+                            longTitle="Accordion Header Button"
+                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <accordionHeaderTitle
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Title"
+                                        id="af2_accordionheadertitle"
+                                        cssSelector=".cmp-accordion__title"
+                                        longTitle="Accordion Header Title"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <active
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Active"
+                                                cssSelector=".cmp-accordion__title:active"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-accordion__title:hover"/>
+                                    </states>
+                                </accordionHeaderTitle>
+                                <accordionHeaderIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Icon"
+                                        id="af2_accordionheadericon"
+                                        cssSelector=".cmp-accordion__icon"
+                                        longTitle="Accordion Header Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <active
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Active"
+                                                cssSelector=".cmp-accordion__icon:active"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-accordion__icon:hover"/>
+                                    </states>
+                                </accordionHeaderIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <active
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Active"
+                                        cssSelector=".cmp-accordion__button:active"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-accordion__button:hover"/>
+                            </states>
+                        </accordionHeaderButton>
+                        <accordionPanelWidget
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Widget"
+                                id="af2_accordionpanelwidget"
+                                cssSelector=".cmp-accordion__panel"
+                                longTitle="Accordion Panel Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <active
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Active"
+                                        cssSelector=".cmp-accordion__panel:active"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-accordion__panel:hover"/>
+                            </states>
+                        </accordionPanelWidget>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <active
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Active"
+                                cssSelector=".cmp-accordion__item:active"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-accordion__item:hover"/>
+                    </states>
+                </accordionPanelItem>
+            </items>
+        </accordionPanel>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v1/reset/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v1/reset/README.md
index 2934f943c4..420c90c207 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v1/reset/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v1/reset/README.md
@@ -46,6 +46,7 @@ It should be added to a relevant site client library using the `embed` property.
 BLOCK cmp-adaptiveform-button
     ELEMENT cmp-adaptiveform-button__widget
     ELEMENT cmp-adaptiveform-button__text
+    ELEMENT cmp-adaptiveform-button__help-container
     ELEMENT cmp-adaptiveform-button__icon
     ELEMENT cmp-adaptiveform-button__questionmark
     ELEMENT cmp-adaptiveform-button__shortdescription
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v2/reset/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v2/reset/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..49cdbcb0b5
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/reset/v2/reset/_cq_styleConfig/.content.xml
@@ -0,0 +1,134 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Button">
+    <items jcr:primaryType="nt:unstructured">
+        <button
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Reset"
+            id="af2_resetbutton"
+            cssSelector=".reset .cmp-adaptiveform-button__widget"
+            longTitle="Reset Button"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+            secondarySelectors="af2_guideContainer:af2_button">
+            <items jcr:primaryType="nt:unstructured">
+                <buttonText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Reset Button Text"
+                    id="af2_resetbuttontext"
+                    cssSelector=".reset .cmp-adaptiveform-button__text"
+                    longTitle="Reset Button Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_buttontext">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".reset .cmp-adaptiveform-button__text:focus"/>
+                        <active
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Down"
+                                cssSelector=".reset .cmp-adaptiveform-button__text:active"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".reset .cmp-adaptiveform-button__text:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".reset .cmp-adaptiveform-button__text:hover"/>
+                    </states>
+                </buttonText>
+                <buttonDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_resetbuttondescriptionshort"
+                        cssSelector=".reset .cmp-adaptiveform-button__shortdescription"
+                        longTitle="Reset Button Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </buttonDescriptionShort>
+                <buttonDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_resetbuttondescriptionlong"
+                        cssSelector=".reset .cmp-adaptiveform-button__longdescription"
+                        longTitle="Reset Button Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".reset .cmp-adaptiveform-button__longdescription:focus"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".reset .cmp-adaptiveform-button__longdescription:required"/>
+                    </states>
+                </buttonDescriptionLong>
+                <buttonHelpContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Help Container"
+                        id="af2_resetbuttonhelpcontainer"
+                        cssSelector=".reset .cmp-adaptiveform-button__help-container"
+                        longTitle="Reset Button Help Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".reset .cmp-adaptiveform-button__help-container:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".reset .cmp-adaptiveform-button__help-container:hover"/>
+                    </states>
+                </buttonHelpContainer>
+                <buttonHelpIcon
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Help Icon"
+                        id="af2_resetbuttonhelpicon"
+                        cssSelector=".reset .cmp-adaptiveform-button__questionmark"
+                        longTitle="Reset Button Help Icon"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".reset .cmp-adaptiveform-button__questionmark:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".reset .cmp-adaptiveform-button__questionmark:hover"/>
+                    </states>
+                </buttonHelpIcon>
+            </items>
+            <states jcr:primaryType="nt:unstructured">
+                <focus
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Focus"
+                        cssSelector=".reset .cmp-adaptiveform-button__widget:focus"/>
+                <active
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Down"
+                        cssSelector=".reset .cmp-adaptiveform-button__widget:active"/>
+                <disabled
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Disabled"
+                        cssSelector=".reset .cmp-adaptiveform-button__widget:disabled"/>
+                <hover
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Hover"
+                        cssSelector=".reset .cmp-adaptiveform-button__widget:hover"/>
+                <error
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Error"
+                        cssSelector=".reset .cmp-adaptiveform-button[data-cmp-valid='false']"/>
+                <success
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Success"
+                        cssSelector=".reset .cmp-adaptiveform-button[data-cmp-valid='true']"/>
+            </states>
+        </button>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v1/submit/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v1/submit/README.md
index 1901b3eed3..bf680c9bff 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v1/submit/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v1/submit/README.md
@@ -55,6 +55,7 @@ When the Submit button is activated and the form begins submission, the form con
 BLOCK cmp-adaptiveform-button
     ELEMENT cmp-adaptiveform-button__widget
     ELEMENT cmp-adaptiveform-button__text
+    ELEMENT cmp-adaptiveform-button__help-container
     ELEMENT cmp-adaptiveform-button__icon
     ELEMENT cmp-adaptiveform-button__questionmark
     ELEMENT cmp-adaptiveform-button__shortdescription
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/README.md
index 879be3df5d..a8aab9390f 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/README.md
@@ -51,7 +51,6 @@ It should be added to a relevant site client library using the `embed` property.
 BLOCK cmp-adaptiveform-button
     ELEMENT cmp-adaptiveform-button__widget
     ELEMENT cmp-adaptiveform-button__text
-    ELEMENT cmp-adaptiveform-button__icon
     ELEMENT cmp-adaptiveform-button__questionmark
     ELEMENT cmp-adaptiveform-button__shortdescription
     ELEMENT cmp-adaptiveform-button__longdescription
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..52d96a18ea
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/actions/submit/v2/submit/_cq_styleConfig/.content.xml
@@ -0,0 +1,134 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Button">
+    <items jcr:primaryType="nt:unstructured">
+        <button
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Submit"
+            id="af2_submitbutton"
+            cssSelector=".submit .cmp-adaptiveform-button__widget"
+            longTitle="Submit Button"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+            secondarySelectors="af2_guideContainer:af2_button">
+            <items jcr:primaryType="nt:unstructured">
+                <buttonText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Submit Button Text"
+                    id="af2_submitbuttontext"
+                    cssSelector=".submit .cmp-adaptiveform-button__text"
+                    longTitle="Submit Button Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_buttontext">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".submit .cmp-adaptiveform-button__text:focus"/>
+                        <active
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Down"
+                                cssSelector=".submit .cmp-adaptiveform-button__text:active"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".submit .cmp-adaptiveform-button__text:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".submit .cmp-adaptiveform-button__text:hover"/>
+                    </states>
+                </buttonText>
+                <buttonDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_submitbuttondescriptionshort"
+                        cssSelector=".submit .cmp-adaptiveform-button__shortdescription"
+                        longTitle="Submit Button Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </buttonDescriptionShort>
+                <buttonDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_submitbuttondescriptionlong"
+                        cssSelector=".submit .cmp-adaptiveform-button__longdescription"
+                        longTitle="Submit Button Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".submit .cmp-adaptiveform-button__longdescription:focus"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".submit .cmp-adaptiveform-button__longdescription:required"/>
+                    </states>
+                </buttonDescriptionLong>
+                <buttonHelpContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Help Container"
+                        id="af2_submitbuttonhelpcontainer"
+                        cssSelector=".submit .cmp-adaptiveform-button__help-container"
+                        longTitle="Submit Button Help Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".submit .cmp-adaptiveform-button__help-container:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".submit .cmp-adaptiveform-button__help-container:hover"/>
+                    </states>
+                </buttonHelpContainer>
+                <buttonHelpIcon
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Help Icon"
+                        id="af2_submitbuttonhelpicon"
+                        cssSelector=".submit .cmp-adaptiveform-button__questionmark"
+                        longTitle="Submit Button Help Icon"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".submit .cmp-adaptiveform-button__questionmark:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".submit .cmp-adaptiveform-button__questionmark:hover"/>
+                    </states>
+                </buttonHelpIcon>
+            </items>
+            <states jcr:primaryType="nt:unstructured">
+                <focus
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Focus"
+                        cssSelector=".submit .cmp-adaptiveform-button__widget:focus"/>
+                <active
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Down"
+                        cssSelector=".submit .cmp-adaptiveform-button__widget:active"/>
+                <disabled
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Disabled"
+                        cssSelector=".submit .cmp-adaptiveform-button__widget:disabled"/>
+                <hover
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Hover"
+                        cssSelector=".submit .cmp-adaptiveform-button__widget:hover"/>
+                <error
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Error"
+                        cssSelector=".submit .cmp-adaptiveform-button[data-cmp-valid='false']"/>
+                <success
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Success"
+                        cssSelector=".submit .cmp-adaptiveform-button[data-cmp-valid='true']"/>
+            </states>
+        </button>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/base/v1/base/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/base/v1/base/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..47f418b74d
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/base/v1/base/_cq_styleConfig/.content.xml
@@ -0,0 +1,94 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Field">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Field"
+            id="af2_base"
+            cssSelector=".cmp-adaptiveform-container .base"
+            longTitle="Field"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Widget and Text"
+                    id="af2_basewidgetandtext"
+                    cssSelector=".cmp-adaptiveform-container input,select,textarea"
+                    longTitle="Field Widget and Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Focus"
+                            cssSelector=".cmp-adaptiveform-container input:focus,select:focus,textarea:focus"/>
+                        <disabled
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Disabled"
+                            cssSelector=".cmp-adaptiveform-container input:disabled,select:disabled,textarea:disabled"/>
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector=".cmp-adaptiveform-container input:hover,select:hover,textarea:hover"/>
+                        <mandatory
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Mandatory"
+                            cssSelector=".cmp-adaptiveform-container input:required,select:required,textarea:required"/>
+                    </states>
+                </widgetAndText>
+                <fieldLabel
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Label"
+                    id="af2_baselabel"
+                    cssSelector=".cmp-adaptiveform-container label"
+                    longTitle="Field Label"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Focus"
+                            cssSelector=".cmp-adaptiveform-container label:focus"/>
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector=".cmp-adaptiveform-container label:hover"/>
+                        <disabled
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Disabled"
+                            cssSelector=".cmp-adaptiveform-container label:disabled"/>
+                        <mandatory
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Mandatory"
+                            cssSelector=".cmp-adaptiveform-container label:required"/>
+                    </states>
+                </fieldLabel>
+                <errorMessage
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Error Message"
+                        id="af2_baseerrormessage"
+                        cssSelector=".cmp-adaptiveform-container [class$='__errormessage']"
+                        longTitle="Field Error Message"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"/>
+            </items>
+            <states jcr:primaryType="nt:unstructured">
+                <focus
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Focus"
+                    cssSelector=".cmp-adaptiveform-container .base:focus"/>
+                <hover
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Hover"
+                    cssSelector=".cmp-adaptiveform-container .base:hover"/>
+                <disabled
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Disabled"
+                    cssSelector=".cmp-adaptiveform-container .base:disabled"/>
+                <mandatory
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Mandatory"
+                    cssSelector=".cmp-adaptiveform-container .base:required"/>
+            </states>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/button/v2/button/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/button/v2/button/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..9c73f74dc3
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/button/v2/button/_cq_styleConfig/.content.xml
@@ -0,0 +1,132 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Button">
+    <items jcr:primaryType="nt:unstructured">
+        <button
+            jcr:primaryType="nt:unstructured"
+            jcr:title="All Buttons"
+            id="af2_button"
+            cssSelector=".cmp-adaptiveform-button__widget"
+            longTitle="Button"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <buttonText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Button Text"
+                    id="af2_buttontext"
+                    cssSelector=".cmp-adaptiveform-button__text"
+                    longTitle="Button Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-button__text:focus"/>
+                        <active
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Down"
+                                cssSelector=".cmp-adaptiveform-button__text:active"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-button__text:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-button__text:hover"/>
+                    </states>
+                </buttonText>
+                <buttonDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_buttondescriptionshort"
+                        cssSelector=".cmp-adaptiveform-button__shortdescription"
+                        longTitle="Button Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </buttonDescriptionShort>
+                <buttonDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_buttondescriptionlong"
+                        cssSelector=".cmp-adaptiveform-button__longdescription"
+                        longTitle="Button Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-button__longdescription:focus"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-button__longdescription:required"/>
+                    </states>
+                </buttonDescriptionLong>
+                <buttonHelpContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Help Container"
+                        id="af2_buttonhelpcontainer"
+                        cssSelector=".cmp-adaptiveform-button__help-container"
+                        longTitle="Button Help Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-button__help-container:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-button__help-container:hover"/>
+                    </states>
+                </buttonHelpContainer>
+                <buttonHelpIcon
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Help Icon"
+                        id="af2_buttonhelpicon"
+                        cssSelector=".cmp-adaptiveform-button__questionmark"
+                        longTitle="Button Help Icon"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-button__questionmark:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-button__questionmark:hover"/>
+                    </states>
+                </buttonHelpIcon>
+            </items>
+            <states jcr:primaryType="nt:unstructured">
+                <focus
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Focus"
+                        cssSelector=".cmp-adaptiveform-button__widget:focus"/>
+                <active
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Down"
+                        cssSelector=".cmp-adaptiveform-button__widget:active"/>
+                <disabled
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Disabled"
+                        cssSelector=".cmp-adaptiveform-button__widget:disabled"/>
+                <hover
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Hover"
+                        cssSelector=".cmp-adaptiveform-button__widget:hover"/>
+                <error
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Error"
+                        cssSelector=".cmp-adaptiveform-button[data-cmp-valid='false']"/>
+                <success
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Success"
+                        cssSelector=".cmp-adaptiveform-button[data-cmp-valid='true']"/>
+            </states>
+        </button>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/README.md
index 16395ddc44..7417cd0e9e 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/README.md
@@ -53,7 +53,7 @@ JavaScript handling for dialog interaction. It is already included by its edit d
 ## BEM Description
 ```
 BLOCK cmp-adaptiveform-checkbox
-    ELEMENT cmp-adaptiveform-checkbox__label
+    ELEMENT cmp-adaptiveform-checkbox__widget-container
     ELEMENT cmp-adaptiveform-checkbox__widget
     ELEMENT cmp-adaptiveform-checkbox__label
     ELEMENT cmp-adaptiveform-checkbox__help-container
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..c417d038a4
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkbox/v1/checkbox/_cq_styleConfig/.content.xml
@@ -0,0 +1,200 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Checkbox">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_checkboxfield"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Checkbox"
+                    id="af2_checkboxfieldwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-checkbox"
+                    longTitle="Checkbox Widget And Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <checkBoxItem
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Checkbox Item"
+                            id="af2_checkboxitem"
+                            cssSelector=".cmp-adaptiveform-checkbox__widget-container"
+                            longTitle="Checkbox Item"
+                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <checkBoxLabel
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Label"
+                                    id="af2_checkboxlabel"
+                                    cssSelector=".cmp-adaptiveform-checkbox__label"
+                                    longTitle="Checkbox Label"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-checkbox__label:disabled"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-checkbox__label:hover"/>
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-checkbox__label:focus"/>
+                                    </states>
+                                </checkBoxLabel>
+                                <checkBoxWidgetAndText
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Checkbox"
+                                    id="af2_checkboxwidgetandtext"
+                                    cssSelector=".cmp-adaptiveform-checkbox__widget"
+                                    longTitle="Checkbox Widget"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-checkbox__widget:focus"/>
+                                        <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-checkbox__widget:disabled"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-checkbox__widget:hover"/>
+                                        <checked
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Selected"
+                                            cssSelector=".cmp-adaptiveform-checkbox__widget:checked"/>
+                                    </states>
+                                </checkBoxWidgetAndText>
+                                <checkBoxDescriptionShort
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Short Description"
+                                        id="af2_checkboxdescriptionshort"
+                                        cssSelector=".cmp-adaptiveform-checkbox__shortdescription"
+                                        longTitle="Checkbox Short Description"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </checkBoxDescriptionShort>
+                                <checkBoxDescriptionLong
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Long Description"
+                                        id="af2_checkboxdescriptionlong"
+                                        cssSelector=".cmp-adaptiveform-checkbox__longdescription"
+                                        longTitle="Checkbox Long Description"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-checkbox__longdescription:focus"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-checkbox__longdescription:hover"/>
+                                    </states>
+                                </checkBoxDescriptionLong>
+                                <checkBoxHelpContainer
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Container"
+                                        id="af2_checkboxhelpcontainer"
+                                        cssSelector=".cmp-adaptiveform-checkbox__help-container"
+                                        longTitle="Checkbox Help Container"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-checkbox__help-container:focus"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-checkbox__help-container:hover"/>
+                                        <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-checkbox__help-container:disabled"/>
+                                    </states>
+                                </checkBoxHelpContainer>
+                                <checkBoxHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_checkboxhelpicon"
+                                        cssSelector=".cmp-adaptiveform-checkbox__questionmark"
+                                        longTitle="Checkbox Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-checkbox__questionmark:focus"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-checkbox__questionmark:hover"/>
+                                        <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-checkbox__questionmark:disabled"/>
+                                    </states>
+                                </checkBoxHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Focus"
+                                    cssSelector=".cmp-adaptiveform-checkbox__widget-container:focus"/>
+                                <hover
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Hover"
+                                    cssSelector=".cmp-adaptiveform-checkbox__widget-container:hover"/>
+                                <disabled
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Disabled"
+                                    cssSelector=".cmp-adaptiveform-checkbox__widget-container input[type='checkbox']:disabled"/>
+                            </states>
+                        </checkBoxItem>
+                        <checkBoxErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Checkbox Error Message"
+                                id="af2_checkboxerrormessage"
+                                cssSelector=".cmp-adaptiveform-checkbox__errormessage"
+                                longTitle="Checkbox Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </checkBoxErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-checkbox:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-checkbox:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-checkbox[data-cmp-enabled='false']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-checkbox[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-checkbox[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/README.md
index ce32fe6121..818d52d621 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/README.md
@@ -55,8 +55,8 @@ BLOCK cmp-adaptiveform-checkboxgroup
     ELEMENT cmp-adaptiveform-checkboxgroup__label
     ELEMENT cmp-adaptiveform-checkboxgroup__label-container
     ELEMENT cmp-adaptiveform-checkboxgroup__widget
-    ELEMENT cmp-adaptiveform-checkbox__widget
-    ELEMENT cmp-adaptiveform-checkbox__label
+    ELEMENT cmp-adaptiveform-checkboxgroup-item
+    ELEMENT cmp-adaptiveform-checkboxgroup__option-label
     ELEMENT cmp-adaptiveform-checkboxgroup__questionmark
     ELEMENT cmp-adaptiveform-checkboxgroup__shortdescription
     ELEMENT cmp-adaptiveform-checkboxgroup__longdescription
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..03374683ac
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/_cq_styleConfig/.content.xml
@@ -0,0 +1,514 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="CheckBox">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_checkboxgroupfield"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Checkbox Group"
+                    id="af2_checkboxgroupfieldwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-checkboxgroup"
+                    longTitle="Checkbox Group Widget And Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <checkBoxGroupLabelContainer
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Label Container"
+                            id="af2_checkboxgrouplabelcontainer"
+                            cssSelector=".cmp-adaptiveform-checkboxgroup__label-container"
+                            longTitle="Checkbox Group Label Container"
+                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <checkBoxGroupLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_checkboxgrouplabel"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__label"
+                                        longTitle="Checkbox Group Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-checkboxgroup__label:hover"/>
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-checkboxgroup__label:focus"/>
+                                    </states>
+                                </checkBoxGroupLabel>
+                                <checkBoxGroupHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_checkboxgrouphelpicon"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__questionmark"
+                                        longTitle="Checkbox Group Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup__questionmark:disabled"/>
+                                    </states>
+                                </checkBoxGroupHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__label-container:focus"/>
+                            </states>
+                        </checkBoxGroupLabelContainer>
+                        <checkBoxGroupWidget
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Checkbox Group Items Widget"
+                                id="af2_checkboxgroupitemswidget"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__widget"
+                                longTitle="Checkbox Group Items Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <checkBoxGroupItem
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Checkbox Item"
+                                        id="af2_checkboxgroupitem"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup-item"
+                                        longTitle="Checkbox Group Item"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <checkBoxGroupItemLabelContainer
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Checkbox Item Label Container"
+                                                id="af2_checkboxgroupitemlabelcontainer"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label"
+                                                longTitle="Checkbox Group Item Label Container"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <items jcr:primaryType="nt:unstructured">
+                                                <checkBoxGroupItemLabel
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Label"
+                                                        id="af2_checkboxgroupitemlabel"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span"
+                                                        longTitle="Checkbox Group Item Label"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span:hover"/>
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span:focus"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label input[type='checkbox']:checked + span"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup[data-cmp-required='true'] .cmp-adaptiveform-checkboxgroup__option-label span"/>
+                                                    </states>
+                                                </checkBoxGroupItemLabel>
+                                                <checkBoxWidgetAndText
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Checkbox"
+                                                        id="af2_checkboxgroupwidgetandtext"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget"
+                                                        longTitle="Checkbox Group Item Widget"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:focus"/>
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:hover"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:checked"/>
+                                                    </states>
+                                                </checkBoxWidgetAndText>
+                                            </items>
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label:hover"/>
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label:focus"/>
+                                            </states>
+                                        </checkBoxGroupItemLabelContainer>
+                                    </items>
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item .cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item:hover"/>
+                                        <checked
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Selected"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item .cmp-adaptiveform-checkboxgroup__option__widget:checked"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item:focus"/>
+                                    </states>
+                                </checkBoxGroupItem>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__widget:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__widget:focus"/>
+                            </states>
+                        </checkBoxGroupWidget>
+                        <checkBoxGroupWidgetHorizontal
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Checkbox Group Items Widget Horizontal"
+                                id="af2_checkboxgroupitemswidgethorizontal"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__widget.HORIZONTAL"
+                                longTitle="Checkbox Group Items Widget Horizontal"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <checkBoxGroupItemHorizontal
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Checkbox Item"
+                                        id="af2_checkboxgroupitemhorizontal"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup-item"
+                                        longTitle="Checkbox Group Item"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <checkBoxGroupItemLabelContainerHorizontal
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Checkbox Item Label Container"
+                                                id="af2_checkboxgroupitemlabelcontainerhorizontal"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label"
+                                                longTitle="Checkbox Group Item Label Container"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <items jcr:primaryType="nt:unstructured">
+                                                <checkBoxGroupItemLabelHorizontal
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Label"
+                                                        id="af2_checkboxgroupitemlabelhorizontal"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span"
+                                                        longTitle="Checkbox Group Item Label"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span:hover"/>
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span:focus"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label input[type='checkbox']:checked + span"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup[data-cmp-required='true'] .cmp-adaptiveform-checkboxgroup__option-label span"/>
+                                                    </states>
+                                                </checkBoxGroupItemLabelHorizontal>
+                                                <checkBoxWidgetAndTextHorizontal
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Checkbox"
+                                                        id="af2_checkboxgroupwidgetandtexthorizontal"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget"
+                                                        longTitle="Checkbox Group Item Widget"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:focus"/>
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:hover"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:checked"/>
+                                                    </states>
+                                                </checkBoxWidgetAndTextHorizontal>
+                                            </items>
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label:hover"/>
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label:focus"/>
+                                            </states>
+                                        </checkBoxGroupItemLabelContainerHorizontal>
+                                    </items>
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item .cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item:hover"/>
+                                        <checked
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Selected"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item .cmp-adaptiveform-checkboxgroup__option__widget:checked"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item:focus"/>
+                                    </states>
+                                </checkBoxGroupItemHorizontal>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__widget.HORIZONTAL:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__widget.HORIZONTAL:focus"/>
+                            </states>
+                        </checkBoxGroupWidgetHorizontal>
+                        <checkBoxGroupWidgetVertical
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Checkbox Group Items Widget Vertical"
+                                id="af2_checkboxgroupitemswidgetvertical"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__widget.VERTICAL"
+                                longTitle="Checkbox Group Items Widget Vertical"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <checkBoxGroupItemVertical
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Checkbox Item"
+                                        id="af2_checkboxgroupitemvertical"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup-item"
+                                        longTitle="Checkbox Group Item"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <checkBoxGroupItemLabelContainerVertical
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Checkbox Item Label Container"
+                                                id="af2_checkboxgroupitemlabelcontainervertical"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label"
+                                                longTitle="Checkbox Group Item Label Container"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <items jcr:primaryType="nt:unstructured">
+                                                <checkBoxGroupItemLabelVertical
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Label"
+                                                        id="af2_checkboxgroupitemlabelvertical"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span"
+                                                        longTitle="Checkbox Group Item Label"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span:hover"/>
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label span:focus"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option-label input[type='checkbox']:checked + span"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup[data-cmp-required='true'] .cmp-adaptiveform-checkboxgroup__option-label span"/>
+                                                    </states>
+                                                </checkBoxGroupItemLabelVertical>
+                                                <checkBoxWidgetAndTextVertical
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Checkbox"
+                                                        id="af2_checkboxgroupwidgetandtextvertical"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget"
+                                                        longTitle="Checkbox Group Item Widget"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:focus"/>
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:hover"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-checkboxgroup__option__widget:checked"/>
+                                                    </states>
+                                                </checkBoxWidgetAndTextVertical>
+                                            </items>
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label:hover"/>
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-checkboxgroup__option-label:focus"/>
+                                            </states>
+                                        </checkBoxGroupItemLabelContainerVertical>
+                                    </items>
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item .cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item:hover"/>
+                                        <checked
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Selected"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item .cmp-adaptiveform-checkboxgroup__option__widget:checked"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-checkboxgroup-item:focus"/>
+                                    </states>
+                                </checkBoxGroupItemVertical>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__widget.VERTICAL:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__widget.VERTICAL:focus"/>
+                            </states>
+                        </checkBoxGroupWidgetVertical>
+                        <checkBoxGroupDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_checkboxgroupdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__shortdescription"
+                                longTitle="Checkbox Group Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </checkBoxGroupDescriptionShort>
+                        <checkBoxGroupDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_checkboxgroupdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__longdescription"
+                                longTitle="Checkbox Group Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-checkboxgroup__longdescription:hover"/>
+                            </states>
+                        </checkBoxGroupDescriptionLong>
+                        <checkBoxGroupErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Checkbox Group Error Message"
+                                id="af2_checkboxgrouperrormessage"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__errormessage"
+                                longTitle="Checkbox Group Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </checkBoxGroupErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__widget .cmp-adaptiveform-checkboxgroup__option__widget:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__widget:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup__widget:focus"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-checkboxgroup[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/container/v2/container/_cq_themeConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/container/v2/container/_cq_themeConfig/.content.xml
new file mode 100644
index 0000000000..fe5a906ff5
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/container/v2/container/_cq_themeConfig/.content.xml
@@ -0,0 +1,186 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    componentId="af2_guideContainer"
+    label="CC Container">
+    <items jcr:primaryType="nt:unstructured">
+        <afPage
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Page"
+            id="af2_page"
+            cssSelector="body"
+            longTitle="Page"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"/>
+        <form
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Form"
+            id="af2_form"
+            cssSelector=".cmp-adaptiveform-container"
+            longTitle="Form"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <formTitle
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/title/v2/title/cq:styleConfig/items/formTitle"/>
+            </items>
+        </form>
+        <base
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Field"
+            id="af2_base"
+            cssSelector=".base"
+            longTitle="Field"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <states jcr:primaryType="nt:unstructured">
+                <focus
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Focus"
+                    cssSelector=".base:focus"/>
+                <hover
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Hover"
+                    cssSelector=".base:hover"/>
+                <disabled
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Disabled"
+                    cssSelector=".base:disabled"/>
+                <mandatory
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Mandatory"
+                        cssSelector=".base:required"/>
+            </states>
+            <items jcr:primaryType="nt:unstructured">
+                <fieldLabel
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/base/v1/base/cq:styleConfig/items/field/items/fieldLabel"/>
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Widget"
+                    id="af2_widgetAndText"
+                    cssSelector="input,select,textarea"
+                    longTitle="Field Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <textWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/text/v1/text/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <textBoxWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/textinput/v1/textinput/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <textAreaWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/textinput/v1/textinput/cq:styleConfig/items/field/items/textAreaWidgetAndText"/>
+                        <numericBoxWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/numberinput/v1/numberinput/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <emailWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/emailinput/v1/emailinput/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <telephoneWidgetAndText
+                                jcr:primaryType="nt:unstructured"
+                                target="/mnt/override/apps/core/fd/components/form/telephoneinput/v1/telephoneinput/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <dropDownListWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/dropdown/v1/dropdown/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <datePickerWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/datepicker/v1/datepicker/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <checkBoxWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/checkbox/v1/checkbox/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <checkBoxGroupWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/checkboxgroup/v1/checkboxgroup/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <radioButtonGroupWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/radiobutton/v1/radiobutton/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <switchWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/switch/v1/switch/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <fileUploadButton
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/fileinput/v3/fileinput/cq:styleConfig/items/field/items/widgetAndText"/>
+                        <tncWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            target="/mnt/override/apps/core/fd/components/form/termsandconditions/v1/termsandconditions/cq:styleConfig/items/field/items/widgetAndText"/>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Focus"
+                            cssSelector="input:focus,select:focus,textarea:focus"/>
+                        <disabled
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Disabled"
+                            cssSelector="input:disabled,select:disabled,textarea:disabled"/>
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector="input:hover,select:hover,textarea:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector="input:required,select:required,textarea:required"/>
+                    </states>
+                </widgetAndText>
+                <errorMessage
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/base/v1/base/cq:styleConfig/items/field/items/errorMessage"/>
+            </items>
+        </base>
+        <button
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Button">
+            <items jcr:primaryType="nt:unstructured">
+                <allButton
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/button/v2/button/cq:styleConfig/items/button"/>
+                <submit
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/actions/submit/v2/submit/cq:styleConfig/items/button"/>
+                <reset
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/actions/reset/v2/reset/cq:styleConfig/items/button"/>
+            </items>
+        </button>
+        <panel
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Panel">
+            <items jcr:primaryType="nt:unstructured">
+                <responsivePanel
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/panelcontainer/v1/panelcontainer/cq:styleConfig/items/responsivePanel"/>
+                <accordionPanel
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/accordion/v1/accordion/cq:styleConfig/items/accordionPanel"/>
+                <tabsOnLeftPanel
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/cq:styleConfig/items/tabsOnLeftPanel"/>
+                <tabsOnTopPanel
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/tabsontop/v1/tabsontop/cq:styleConfig/items/tabsOnTopPanel"/>
+                <wizardPanel
+                    jcr:primaryType="nt:unstructured"
+                    target="/mnt/override/apps/core/fd/components/form/wizard/v2/wizard/cq:styleConfig/items/wizardPanel"/>
+            </items>
+        </panel>
+<!--        <mobileMenu-->
+<!--            jcr:primaryType="nt:unstructured"-->
+<!--            target="/mnt/override/libs/fd/af/components/guideContainer/cq:styleConfig/items/mobileMenu"/>-->
+<!--        <mobileTitleBar-->
+<!--            jcr:primaryType="nt:unstructured"-->
+<!--            target="/mnt/override/libs/fd/af/components/guideContainer/cq:styleConfig/items/mobileTitleBar"/>-->
+<!--        <mobileScrollIndicator-->
+<!--            jcr:primaryType="nt:unstructured"-->
+<!--            target="/mnt/override/libs/fd/af/components/guideContainer/cq:styleConfig/items/mobileScrollIndicator"/>-->
+        <Image
+            jcr:primaryType="nt:unstructured"
+            target="/mnt/override/apps/core/fd/components/form/image/v1/image/cq:styleConfig/items/Image"/>
+        <hcaptcha
+            jcr:primaryType="nt:unstructured"
+            target="/mnt/override/apps/core/fd/components/form/hcaptcha/v1/hcaptcha/cq:styleConfig/items/field/items/captcha"/>
+        <recaptcha
+                jcr:primaryType="nt:unstructured"
+                target="/mnt/override/apps/core/fd/components/form/recaptcha/v1/recaptcha/cq:styleConfig/items/field/items/captcha"/>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datepicker/v1/datepicker/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datepicker/v1/datepicker/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..3cbb08fe79
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datepicker/v1/datepicker/_cq_styleConfig/.content.xml
@@ -0,0 +1,179 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Datepicker">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_datepicker"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Date Picker"
+                    id="af2_dateinputwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-datepicker"
+                    longTitle="Date Picker Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <datepickerLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_datepickerlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-datepicker__label-container"
+                                longTitle="Datepicker Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <datepickerLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_datepickerlabel"
+                                        cssSelector=".cmp-adaptiveform-datepicker__label"
+                                        longTitle="Datepicker Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-datepicker__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-datepicker__label:focus"/>
+                                    </states>
+                                </datepickerLabel>
+                                <datepickerHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_datepickerhelpicon"
+                                        cssSelector=".cmp-adaptiveform-datepicker__questionmark"
+                                        longTitle="Datepicker Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-datepicker__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-datepicker__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-datepicker__questionmark:disabled"/>
+                                    </states>
+                                </datepickerHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-datepicker__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-datepicker__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-datepicker__label-container:focus"/>
+                            </states>
+                        </datepickerLabelContainer>
+                        <datepickerWidgetAndText
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Datepicker"
+                                id="af2_datepickerwidgetandtext"
+                                cssSelector=".cmp-adaptiveform-datepicker__widget"
+                                longTitle="Datepicker Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-datepicker__widget:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-datepicker__widget:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-datepicker__widget:disabled"/>
+                                <mandatory
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Mandatory"
+                                        cssSelector=".cmp-adaptiveform-datepicker__widget:required"/>
+                            </states>
+                        </datepickerWidgetAndText>
+                        <datepickerDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_datepickerdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-datepicker__shortdescription"
+                                longTitle="Datepicker Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </datepickerDescriptionShort>
+                        <datepickerDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_datepickerdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-datepicker__longdescription"
+                                longTitle="Datepicker Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-datepicker__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-datepicker__longdescription:hover"/>
+                            </states>
+                        </datepickerDescriptionLong>
+                        <datepickerErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Datepicker Error Message"
+                                id="af2_datepickererrormessage"
+                                cssSelector=".cmp-adaptiveform-datepicker__errormessage"
+                                longTitle="Datepicker Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </datepickerErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-datepicker:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-datepicker[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-datepicker:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-datepicker[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-datepicker[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-datepicker[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datetime/v1/datetime/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datetime/v1/datetime/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..1557b71996
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datetime/v1/datetime/_cq_styleConfig/.content.xml
@@ -0,0 +1,185 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Date Time">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_datetime"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Date Time"
+                    id="af2_datetimewidgetandtext"
+                    cssSelector=".cmp-adaptiveform-datetime"
+                    longTitle="Date Time Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <datetimeLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_datetimelabelcontainer"
+                                cssSelector=".cmp-adaptiveform-datetime__label-container"
+                                longTitle="Date Time Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <datetimeLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_datetimelabel"
+                                        cssSelector=".cmp-adaptiveform-datetime__label"
+                                        longTitle="Date Time Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-datetime__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-datetime__label:focus"/>
+                                    </states>
+                                </datetimeLabel>
+                                <datetimeHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_datetimehelpicon"
+                                        cssSelector=".cmp-adaptiveform-datetime__questionmark"
+                                        longTitle="Date Time Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-datetime__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-datetime__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-datetime__questionmark:disabled"/>
+                                    </states>
+                                </datetimeHelpIcon>
+                            </items>
+                        </datetimeLabelContainer>
+                        <datetimeInputWrapper
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Input Wrapper"
+                                id="af2_datetimeinputwrapper"
+                                cssSelector=".cmp-adaptiveform-datetime__input-wrapper"
+                                longTitle="Date Time Input Wrapper"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <datetimeWidget
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Date Time Input"
+                                        id="af2_datetimewidget"
+                                        cssSelector=".cmp-adaptiveform-datetime__widget"
+                                        longTitle="Date Time Widget"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-datetime__widget:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-datetime__widget:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-datetime__widget:disabled"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-datetime__widget:required"/>
+                                    </states>
+                                </datetimeWidget>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-datetime__input-wrapper:hover"/>
+                                <focusWithin
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus Within"
+                                        cssSelector=".cmp-adaptiveform-datetime__input-wrapper:focus-within"/>
+                            </states>
+                        </datetimeInputWrapper>
+                        <datetimeDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_datetimedescriptionshort"
+                                cssSelector=".cmp-adaptiveform-datetime__shortdescription"
+                                longTitle="Date Time Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </datetimeDescriptionShort>
+                        <datetimeDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_datetimedescriptionlong"
+                                cssSelector=".cmp-adaptiveform-datetime__longdescription"
+                                longTitle="Date Time Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-datetime__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-datetime__longdescription:hover"/>
+                            </states>
+                        </datetimeDescriptionLong>
+                        <datetimeErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Date Time Error Message"
+                                id="af2_datetimeerrormessage"
+                                cssSelector=".cmp-adaptiveform-datetime__errormessage"
+                                longTitle="Date Time Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </datetimeErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-datetime:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-datetime[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-datetime:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-datetime[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-datetime[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-datetime[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/dropdown/v1/dropdown/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/dropdown/v1/dropdown/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..a4615a1e22
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/dropdown/v1/dropdown/_cq_styleConfig/.content.xml
@@ -0,0 +1,179 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="DropdownList">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_dropdownlist"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Dropdown"
+                    id="af2_dropdownlistwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-dropdown"
+                    longTitle="Dropdown Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <dropdownLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_dropdownlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-dropdown__label-container"
+                                longTitle="Dropdown Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <dropdownLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_dropdownlabel"
+                                        cssSelector=".cmp-adaptiveform-dropdown__label"
+                                        longTitle="Dropdown Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-dropdown__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-dropdown__label:focus"/>
+                                    </states>
+                                </dropdownLabel>
+                                <dropdownHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_dropdownhelpicon"
+                                        cssSelector=".cmp-adaptiveform-dropdown__questionmark"
+                                        longTitle="Dropdown Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-dropdown__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-dropdown__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-dropdown__questionmark:disabled"/>
+                                    </states>
+                                </dropdownHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-dropdown__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-dropdown__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-dropdown__label-container:focus"/>
+                            </states>
+                        </dropdownLabelContainer>
+                        <dropdownWidgetAndText
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Dropdown"
+                                id="af2_dropdownwidgetandtext"
+                                cssSelector=".cmp-adaptiveform-dropdown__widget"
+                                longTitle="Dropdown Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-dropdown__widget:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-dropdown__widget:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-dropdown__widget:disabled"/>
+                                <mandatory
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Mandatory"
+                                        cssSelector=".cmp-adaptiveform-dropdown__widget:required"/>
+                            </states>
+                        </dropdownWidgetAndText>
+                        <dropdownDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_dropdowndescriptionshort"
+                                cssSelector=".cmp-adaptiveform-dropdown__shortdescription"
+                                longTitle="Dropdown Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </dropdownDescriptionShort>
+                        <dropdownDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_dropdowndescriptionlong"
+                                cssSelector=".cmp-adaptiveform-dropdown__longdescription"
+                                longTitle="Dropdown Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-dropdown__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-dropdown__longdescription:hover"/>
+                            </states>
+                        </dropdownDescriptionLong>
+                        <dropdownErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Dropdown Error Message"
+                                id="af2_dropdownerrormessage"
+                                cssSelector=".cmp-adaptiveform-dropdown__errormessage"
+                                longTitle="Dropdown Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </dropdownErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-dropdown:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-dropdown[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-dropdown:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-dropdown[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-dropdown[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-dropdown[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/emailinput/v1/emailinput/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/emailinput/v1/emailinput/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..9cec5398bb
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/emailinput/v1/emailinput/_cq_styleConfig/.content.xml
@@ -0,0 +1,177 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field jcr:primaryType="nt:unstructured">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Email"
+                    cssSelector=".cmp-adaptiveform-emailinput"
+                    id="af2_emailinputwidgetandtext"
+                    longTitle="Email Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <emailLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_emaillabelcontainer"
+                                cssSelector=".cmp-adaptiveform-emailinput__label-container"
+                                longTitle="Email Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <emailLabel
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Label"
+                                    id="af2_emaillabel"
+                                    cssSelector=".cmp-adaptiveform-emailinput__label"
+                                    longTitle="Email Label"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-emailinput__label:hover"/>
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-emailinput__label:focus"/>
+                                    </states>
+                                </emailLabel>
+                                <emailHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_emailhelpicon"
+                                        cssSelector=".cmp-adaptiveform-emailinput__questionmark"
+                                        longTitle="Email Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-emailinput__questionmark:focus"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-emailinput__questionmark:hover"/>
+                                        <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-emailinput__questionmark:disabled"/>
+                                    </states>
+                                </emailHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Disabled"
+                                    cssSelector=".cmp-adaptiveform-emailinput__label-container:disabled"/>
+                                <hover
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Hover"
+                                    cssSelector=".cmp-adaptiveform-emailinput__label-container:hover"/>
+                                <focus
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Focus"
+                                    cssSelector=".cmp-adaptiveform-emailinput__label-container:focus"/>
+                            </states>
+                        </emailLabelContainer>
+                        <emailWidgetAndText
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Email"
+                            id="af2_emailwidgetandtext"
+                            cssSelector=".cmp-adaptiveform-emailinput__widget"
+                            longTitle="Email Widget"
+                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                            secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Focus"
+                                    cssSelector=".cmp-adaptiveform-emailinput__widget:focus"/>
+                                <hover
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Hover"
+                                    cssSelector=".cmp-adaptiveform-emailinput__widget:hover"/>
+                                <disabled
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Disabled"
+                                    cssSelector=".cmp-adaptiveform-emailinput__widget:disabled"/>
+                                <mandatory
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Mandatory"
+                                    cssSelector=".cmp-adaptiveform-emailinput__widget:required"/>
+                            </states>
+                        </emailWidgetAndText>
+                        <emailDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_emaildescriptionshort"
+                                cssSelector=".cmp-adaptiveform-emailinput__shortdescription"
+                                longTitle="Email Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </emailDescriptionShort>
+                        <emailDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_emaildescriptionlong"
+                                cssSelector=".cmp-adaptiveform-emailinput__longdescription"
+                                longTitle="Email Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Focus"
+                                    cssSelector=".cmp-adaptiveform-emailinput__longdescription:focus"/>
+                                <hover
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Hover"
+                                    cssSelector=".cmp-adaptiveform-emailinput__longdescription:hover"/>
+                            </states>
+                        </emailDescriptionLong>
+                        <emailErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Email Error Message"
+                                id="af2_emailerrormessage"
+                                cssSelector=".cmp-adaptiveform-emailinput__errormessage"
+                                longTitle="Email Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </emailErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-emailinput:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-emailinput[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-emailinput:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-emailinput[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-emailinput[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-emailinput[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+                <textAreaWidgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    sling:hideResource="{Boolean}true"/>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/README.md
index ee4087b649..a47e034163 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/README.md
@@ -75,6 +75,9 @@ BLOCK cmp-adaptiveform-fileinput
     ELEMENT cmp-adaptiveform-fileinput__filename
     ELEMENT cmp-adaptiveform-fileinput__filedelete
     ELEMENT cmp-adaptiveform-fileinput__widgetlabel
+    ELEMENT cmp-adaptiveform-fileinput__dragarea
+    ELEMENT cmp-adaptiveform-fileinput__icon
+    ELEMENT cmp-adaptiveform-fileinput__dragtext
 ```
 
 ### Note
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..9a5537c5d7
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v3/fileinput/_cq_styleConfig/.content.xml
@@ -0,0 +1,273 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="FileUpload">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_fileuploadfield"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="File Upload Button"
+                    id="af2_fileuploadfieldwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-fileinput"
+                    longTitle="File Upload Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <fileinputLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_fileinputlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-fileinput__label-container"
+                                longTitle="File Input Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <fileinputLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_fileinputlabel"
+                                        cssSelector=".cmp-adaptiveform-fileinput__label"
+                                        longTitle="File Input Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__label:focus"/>
+                                    </states>
+                                </fileinputLabel>
+                                <fileinputHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_fileinputhelpicon"
+                                        cssSelector=".cmp-adaptiveform-fileinput__questionmark"
+                                        longTitle="File Input Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-fileinput__questionmark:disabled"/>
+                                    </states>
+                                </fileinputHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-fileinput__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-fileinput__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-fileinput__label-container:focus"/>
+                            </states>
+                        </fileinputLabelContainer>
+                        <fileinputWidgetAndText
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="File Input Widget and Text"
+                                id="af2_fileinputcontainer"
+                                cssSelector=".cmp-adaptiveform-fileinput__container"
+                                longTitle="File Input Widget Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                            <items jcr:primaryType="nt:unstructured">
+                                <fileinputDragArea
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="File Input Drag Area"
+                                        id="af2_fileinputdragarea"
+                                        cssSelector=".cmp-adaptiveform-fileinput__dragarea"
+                                        longTitle="File Input Widget Drag Area"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragarea:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragarea:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragarea:disabled"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragarea:required"/>
+                                    </states>
+                                </fileinputDragArea>
+                                <fileinputIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="File Input Icon"
+                                        id="af2_fileinputicon"
+                                        cssSelector=".cmp-adaptiveform-fileinput__icon"
+                                        longTitle="File Input Widget Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__icon:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__icon:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-fileinput__icon:disabled"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-fileinput__icon:required"/>
+                                    </states>
+                                </fileinputIcon>
+                                <fileinputDragText
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="File Input Drag Text"
+                                        id="af2_fileinputdragtext"
+                                        cssSelector=".cmp-adaptiveform-fileinput__dragtext"
+                                        longTitle="File Input Widget Drag Text"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragtext:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragtext:focus"/>
+                                    </states>
+                                </fileinputDragText>
+                                <fileinputWidget
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="File Input Widget"
+                                        id="af2_fileinputwidgetlabel"
+                                        cssSelector=".cmp-adaptiveform-fileinput__widgetlabel"
+                                        longTitle="File Input Widget"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:focus"/>
+                                        <active
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Down"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:active"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:disabled"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:hover"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:required"/>
+                                    </states>
+                                </fileinputWidget>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-fileinput__container:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-fileinput__container:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-fileinput__container:disabled"/>
+                                <mandatory
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Mandatory"
+                                        cssSelector=".cmp-adaptiveform-fileinput__container:required"/>
+                            </states>
+                        </fileinputWidgetAndText>
+                        <fileinputDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_fileinputdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-fileinput__shortdescription"
+                                longTitle="File Input Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </fileinputDescriptionShort>
+                        <fileinputDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_fileinputdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-fileinput__longdescription"
+                                longTitle="File Input Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Focus"
+                                    cssSelector=".cmp-adaptiveform-fileinput__longdescription:focus"/>
+                                <hover
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Hover"
+                                    cssSelector=".cmp-adaptiveform-fileinput__longdescription:hover"/>
+                            </states>
+                        </fileinputDescriptionLong>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-fileinput:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-fileinput:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v4/fileinput/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v4/fileinput/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..5359b00a27
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/fileinput/v4/fileinput/_cq_styleConfig/.content.xml
@@ -0,0 +1,208 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="File Input">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_fileinput"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="File Input"
+                    id="af2_fileinputwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-fileinput"
+                    longTitle="File Input Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <fileinputLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_fileinputlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-fileinput__label-container"
+                                longTitle="File Input Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <fileinputLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_fileinputlabel"
+                                        cssSelector=".cmp-adaptiveform-fileinput__label"
+                                        longTitle="File Input Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__label:focus"/>
+                                    </states>
+                                </fileinputLabel>
+                                <fileinputHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_fileinputhelpicon"
+                                        cssSelector=".cmp-adaptiveform-fileinput__questionmark"
+                                        longTitle="File Input Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-fileinput__questionmark:disabled"/>
+                                    </states>
+                                </fileinputHelpIcon>
+                            </items>
+                        </fileinputLabelContainer>
+                        <fileinputContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Container"
+                                id="af2_fileinputcontainer"
+                                cssSelector=".cmp-adaptiveform-fileinput__container"
+                                longTitle="File Input Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <fileinputDragarea
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Drag Area"
+                                        id="af2_fileinputdragarea"
+                                        cssSelector=".cmp-adaptiveform-fileinput__dragarea"
+                                        longTitle="File Input Drag Area"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__dragarea:hover"/>
+                                    </states>
+                                </fileinputDragarea>
+                                <fileinputIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Icon"
+                                        id="af2_fileinputicon"
+                                        cssSelector=".cmp-adaptiveform-fileinput__icon"
+                                        longTitle="File Input Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </fileinputIcon>
+                                <fileinputDragtext
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Drag Text"
+                                        id="af2_fileinputdragtext"
+                                        cssSelector=".cmp-adaptiveform-fileinput__dragtext"
+                                        longTitle="File Input Drag Text"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </fileinputDragtext>
+                                <fileinputWidgetlabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Button"
+                                        id="af2_fileinputwidgetlabel"
+                                        cssSelector=".cmp-adaptiveform-fileinput__widgetlabel"
+                                        longTitle="File Input Button"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:focus"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-fileinput__widgetlabel:disabled"/>
+                                    </states>
+                                </fileinputWidgetlabel>
+                                <fileinputFilelist
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="File List"
+                                        id="af2_fileinputfilelist"
+                                        cssSelector=".cmp-adaptiveform-fileinput__filelist"
+                                        longTitle="File Input File List"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </fileinputFilelist>
+                            </items>
+                        </fileinputContainer>
+                        <fileinputDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_fileinputdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-fileinput__shortdescription"
+                                longTitle="File Input Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </fileinputDescriptionShort>
+                        <fileinputDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_fileinputdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-fileinput__longdescription"
+                                longTitle="File Input Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-fileinput__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-fileinput__longdescription:hover"/>
+                            </states>
+                        </fileinputDescriptionLong>
+                        <fileinputErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="File Input Error Message"
+                                id="af2_fileinputerrormessage"
+                                cssSelector=".cmp-adaptiveform-fileinput__errormessage"
+                                longTitle="File Input Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </fileinputErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-fileinput:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-fileinput:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-fileinput[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
\ No newline at end of file
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/footer/v1/footer/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/footer/v1/footer/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..25e690c4b9
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/footer/v1/footer/_cq_styleConfig/.content.xml
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="footer">
+    <items jcr:primaryType="nt:unstructured">
+        <footer
+            longTitle="Footer"
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Footer"
+            id="af2_footer"
+            cssSelector=".cmp-adaptiveform-footer"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <footerText
+                    longTitle="Footer Text"
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Footer Text"
+                    id="af2_footertext"
+                    cssSelector=".cmp-adaptiveform-footer__text .cq-Editable-dom"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector=".cmp-adaptiveform-footer__text:hover"/>
+                    </states>
+                </footerText>
+            </items>
+            <states jcr:primaryType="nt:unstructured">
+                <hover
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Hover"
+                    cssSelector=".cmp-adaptiveform-footer:hover"/>
+            </states>
+        </footer>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/footer/v1/footer/_cq_themeConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/footer/v1/footer/_cq_themeConfig/.content.xml
new file mode 100644
index 0000000000..b8d3222c74
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/footer/v1/footer/_cq_themeConfig/.content.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    componentId="af2_footer">
+    <items jcr:primaryType="nt:unstructured">
+        <footer
+            jcr:primaryType="nt:unstructured"
+            target="/mnt/override/apps/core/fd/components/form/footer/v1/footer/cq:styleConfig/items/footer"/>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/hcaptcha/v1/hcaptcha/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/hcaptcha/v1/hcaptcha/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..eccd425665
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/hcaptcha/v1/hcaptcha/_cq_styleConfig/.content.xml
@@ -0,0 +1,93 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0"
+          xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+          xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+          jcr:primaryType="nt:unstructured"
+          jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field jcr:primaryType="nt:unstructured">
+            <items jcr:primaryType="nt:unstructured">
+                <captcha
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="hCaptcha"
+                        id="af2_hcaptchacontainer"
+                        cssSelector=".cmp-adaptiveform-hcaptcha"
+                        longTitle="hCaptcha Widget and Text"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <captchaLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="hCaptcha Label"
+                                id="af2_hcaptchawidgetlabel"
+                                cssSelector=".cmp-adaptiveform-hcaptcha__label"
+                                longTitle="hCaptcha Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-hcaptcha__label:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-hcaptcha__label:hover"/>
+                            </states>
+                        </captchaLabel>
+                        <captchaWidget
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="hCaptcha Widget"
+                                id="af2_hcaptchawidget"
+                                cssSelector=".cmp-adaptiveform-hcaptcha__widget"
+                                longTitle="hCaptcha Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-hcaptcha__widget:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-hcaptcha__widget:hover"/>
+                            </states>
+                        </captchaWidget>
+                        <captchaErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="hCaptcha Error Message"
+                                id="af2_hcaptchaerrormessage"
+                                cssSelector=".cmp-adaptiveform-hcaptcha__errormessage"
+                                longTitle="hCaptcha Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </captchaErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-hcaptcha:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-hcaptcha:hover"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-hcaptcha[data-cmp-enabled='false']"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-hcaptcha[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-hcaptcha[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-hcaptcha[data-cmp-valid='true']"/>
+                    </states>
+                </captcha>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/image/v1/image/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/image/v1/image/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..aadc3fe504
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/image/v1/image/_cq_styleConfig/.content.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="image">
+    <items jcr:primaryType="nt:unstructured">
+        <Image
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Image"
+            id="af2_image"
+            cssSelector=".cmp-image__image"
+            longTitle="Image"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"/>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/README.md
index 155b3dfd46..e87468d950 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/README.md
@@ -94,13 +94,13 @@ For languages not listed above, such as `es-CO` (Spanish - Colombia), the curren
 ## BEM Description
 ```
 BLOCK cmp-adaptiveform-numberinput
-    ELEMENT cmp-adaptiveform-numberinput
     ELEMENT cmp-adaptiveform-numberinput__label
     ELEMENT cmp-adaptiveform-numberinput__label-container
     ELEMENT cmp-adaptiveform-numberinput__widget
     ELEMENT cmp-adaptiveform-numberinput__questionmark
     ELEMENT cmp-adaptiveform-numberinput__shortdescription
     ELEMENT cmp-adaptiveform-numberinput__longdescription
+    ELEMENT cmp-adaptiveform-numberinput__errormessage
 ```
 
 ### Note
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..66a38169cb
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/numberinput/v1/numberinput/_cq_styleConfig/.content.xml
@@ -0,0 +1,179 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_numericbox"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Numeric Box"
+                    id="af2_numericboxwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-numberinput"
+                    longTitle="Number Input Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <numberinputLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_numberinputlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-numberinput__label-container"
+                                longTitle="Number Input Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <numberinputLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_numberinputlabel"
+                                        cssSelector=".cmp-adaptiveform-numberinput__label"
+                                        longTitle="Number Input Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-numberinput__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-numberinput__label:focus"/>
+                                    </states>
+                                </numberinputLabel>
+                                <numberinputHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_numberinputhelpicon"
+                                        cssSelector=".cmp-adaptiveform-numberinput__questionmark"
+                                        longTitle="Number Input Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-numberinput__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-numberinput__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-numberinput__questionmark:disabled"/>
+                                    </states>
+                                </numberinputHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-numberinput__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-numberinput__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-numberinput__label-container:focus"/>
+                            </states>
+                        </numberinputLabelContainer>
+                        <numberinputWidgetAndText
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Number Input Widget and Text"
+                                id="af2_numberinputwidgetandtext"
+                                cssSelector=".cmp-adaptiveform-numberinput__widget"
+                                longTitle="Number Input Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-numberinput__widget:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-numberinput__widget:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-numberinput__widget:disabled"/>
+                                <mandatory
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Mandatory"
+                                        cssSelector=".cmp-adaptiveform-numberinput__widget:required"/>
+                            </states>
+                        </numberinputWidgetAndText>
+                        <numberinputDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_numberinputdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-numberinput__shortdescription"
+                                longTitle="Number Input Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </numberinputDescriptionShort>
+                        <numberinputDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_numberinputdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-numberinput__longdescription"
+                                longTitle="Number Input Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-numberinput__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-numberinput__longdescription:hover"/>
+                            </states>
+                        </numberinputDescriptionLong>
+                        <numberinputErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Number Input Error Message"
+                                id="af2_numberinputerrormessage"
+                                cssSelector=".cmp-adaptiveform-numberinput__errormessage"
+                                longTitle="Number Input Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </numberinputErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-numberinput:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-numberinput[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-numberinput:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-numberinput[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-numberinput[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-numberinput[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/pageheader/v1/pageheader/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/pageheader/v1/pageheader/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..c2f0fd2e9e
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/pageheader/v1/pageheader/_cq_styleConfig/.content.xml
@@ -0,0 +1,51 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="pageHeader">
+    <items jcr:primaryType="nt:unstructured">
+        <header
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Header"
+            id="af2_header"
+            cssSelector=".cmp-adaptiveform-pageheader"
+            longTitle="Header"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <logoImage
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Logo"
+                    id="af2_headerlogo"
+                    cssSelector=".cmp-adaptiveform-pageheader .cmp-image img"
+                    longTitle="Header Logo"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector=".cmp-adaptiveform-pageheader .cmp-image img:hover"/>
+                    </states>
+                </logoImage>
+                <headerText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Text"
+                    id="af2_headertext"
+                    cssSelector=".cmp-adaptiveform-pageheader .cq-Editable-dom p"
+                    longTitle="Header Text"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector=".cmp-adaptiveform-pageheader .cq-Editable-dom p:hover"/>
+                    </states>
+                </headerText>
+            </items>
+            <states jcr:primaryType="nt:unstructured">
+                <hover
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Hover"
+                    cssSelector=".cmp-adaptiveform-pageheader:hover"/>
+            </states>
+        </header>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/pageheader/v1/pageheader/_cq_themeConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/pageheader/v1/pageheader/_cq_themeConfig/.content.xml
new file mode 100644
index 0000000000..b1e50cc529
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/pageheader/v1/pageheader/_cq_themeConfig/.content.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    componentId="af2_header">
+    <items jcr:primaryType="nt:unstructured">
+        <header
+            jcr:primaryType="nt:unstructured"
+            target="/mnt/override/apps/core/fd/components/form/pageheader/v1/pageheader/cq:styleConfig/items/header"/>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/panelcontainer/v1/panelcontainer/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/panelcontainer/v1/panelcontainer/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..97242cf488
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/panelcontainer/v1/panelcontainer/_cq_styleConfig/.content.xml
@@ -0,0 +1,108 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="panel">
+    <items jcr:primaryType="nt:unstructured">
+        <responsivePanel
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Panel"
+            id="af2_panel"
+            cssSelector=".cmp-container"
+            longTitle="Panel Container"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <panelLabelContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Label Container"
+                        id="af2_panellabelcontainer"
+                        cssSelector=".cmp-container__label-container"
+                        longTitle="Panel Label Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <panelLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label"
+                                id="af2_panellabel"
+                                cssSelector=".cmp-container__label"
+                                longTitle="Panel Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-container__label:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-container__label:focus"/>
+                            </states>
+                        </panelLabel>
+                        <panelHelpIcon
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Help Icon"
+                                id="af2_panelhelpicon"
+                                cssSelector=".cmp-container__questionmark"
+                                longTitle="Panel Help Icon"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_helpicon">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-container__questionmark:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-container__questionmark:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-container__questionmark:disabled"/>
+                            </states>
+                        </panelHelpIcon>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-container__label-container:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-container__label-container:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-container__label-container:focus"/>
+                    </states>
+                </panelLabelContainer>
+                <panelDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_paneldescriptionshort"
+                        cssSelector=".cmp-container__shortdescription"
+                        longTitle="Panel Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </panelDescriptionShort>
+                <panelDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_paneldescriptionlong"
+                        cssSelector=".cmp-container__longdescription"
+                        longTitle="Panel Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-container__longdescription:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-container__longdescription:hover"/>
+                    </states>
+                </panelDescriptionLong>
+            </items>
+        </responsivePanel>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/radiobutton/v1/radiobutton/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/radiobutton/v1/radiobutton/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..0763225207
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/radiobutton/v1/radiobutton/_cq_styleConfig/.content.xml
@@ -0,0 +1,526 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_radiobutton"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Radio Button Group"
+                    id="af2_radiobuttonwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-radiobutton"
+                    longTitle="Radio Button Group Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <radioButtonLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_radiobuttonlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-radiobutton__label-container"
+                                longTitle="Radio Button Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <radioButtonLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_radiobuttonlabel"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__label"
+                                        longTitle="Radio Button Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__label:focus"/>
+                                    </states>
+                                </radioButtonLabel>
+                                <radioButtonHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_radiobuttonhelpicon"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__questionmark"
+                                        longTitle="Radio Button Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__questionmark:disabled"/>
+                                    </states>
+                                </radioButtonHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__label-container:focus"/>
+                            </states>
+                        </radioButtonLabelContainer>
+                        <radioButtonWidget
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Radio Button Widget"
+                                id="af2_radiobuttonitemswidget"
+                                cssSelector=".cmp-adaptiveform-radiobutton__widget"
+                                longTitle="Radio Button Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <radioButtonItem
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Radio Button Item"
+                                        id="af2_radiobuttonitem"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__option"
+                                        longTitle="Radio Button Item"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <radioButtonItemLabelContainer
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Radio Button Item Label Container"
+                                                id="af2_radiobuttonitemlabelcontainer"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label"
+                                                longTitle="Radio Button Item Label Container"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <items jcr:primaryType="nt:unstructured">
+                                                <radioButtonLabel
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Label"
+                                                        id="af2_radiobuttonitemlabel"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label span"
+                                                        longTitle="Radio Button Item Label"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label input[disabled] + span"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label:hover span"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option input[type='radio']:checked + span"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true'] .cmp-adaptiveform-radiobutton__option-label span"/>
+                                                    </states>
+                                                </radioButtonLabel>
+                                                <radioButtonWidgetAndText
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Radio Button"
+                                                        id="af2_radiobuttonwidget"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option__widget"
+                                                        longTitle="Radio Button Item Widget"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:focus"/>
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:disabled"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:hover"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:checked"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:required"/>
+                                                    </states>
+                                                </radioButtonWidgetAndText>
+                                            </items>
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label:hover"/>
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label:focus"/>
+                                            </states>
+                                        </radioButtonItemLabelContainer>
+                                    </items>
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option input[disabled] + span"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option:focus"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true'] .cmp-adaptiveform-radiobutton__option"/>
+                                    </states>
+                                </radioButtonItem>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__widget:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__widget:focus"/>
+                            </states>
+                        </radioButtonWidget>
+                        <radioButtonWidgetHorizontal
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Radio Button Widget Horizontal"
+                                id="af2_radiobuttonitemswidgethorizontal"
+                                cssSelector=".cmp-adaptiveform-radiobutton__widget.HORIZONTAL"
+                                longTitle="Radio Button Widget Horizontal"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <radioButtonItemHorizontal
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Radio Button Item"
+                                        id="af2_radiobuttonitemhorizontal"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__option"
+                                        longTitle="Radio Button Item"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <radioButtonItemLabelContainerHorizontal
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Radio Button Item Label Container"
+                                                id="af2_radiobuttonitemlabelcontainerhorizontal"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label"
+                                                longTitle="Radio Button Item Label Container"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <items jcr:primaryType="nt:unstructured">
+                                                <radioButtonLabelHorizontal
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Label"
+                                                        id="af2_radiobuttonitemlabelhorizontal"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label span"
+                                                        longTitle="Radio Button Item Label"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label input[disabled] + span"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label:hover span"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option input[type='radio']:checked + span"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true'] .cmp-adaptiveform-radiobutton__option-label span"/>
+                                                    </states>
+                                                </radioButtonLabelHorizontal>
+                                                <radioButtonWidgetAndTextHorizontal
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Radio Button"
+                                                        id="af2_radiobuttonwidgethorizontal"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option__widget"
+                                                        longTitle="Radio Button Item Widget"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:focus"/>
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:disabled"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:hover"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:checked"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:required"/>
+                                                    </states>
+                                                </radioButtonWidgetAndTextHorizontal>
+                                            </items>
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label:hover"/>
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label:focus"/>
+                                            </states>
+                                        </radioButtonItemLabelContainerHorizontal>
+                                    </items>
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option input[disabled] + span"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option:focus"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true'] .cmp-adaptiveform-radiobutton__option"/>
+                                    </states>
+                                </radioButtonItemHorizontal>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__widget.HORIZONTAL:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__widget.HORIZONTAL:focus"/>
+                            </states>
+                        </radioButtonWidgetHorizontal>
+                        <radioButtonWidgetVertical
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Radio Button Widget Vertical"
+                                id="af2_radiobuttonitemswidgetvertical"
+                                cssSelector=".cmp-adaptiveform-radiobutton__widget.VERTICAL"
+                                longTitle="Radio Button Widget Vertical"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <radioButtonItemVertical
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Radio Button Item"
+                                        id="af2_radiobuttonitemvertical"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__option"
+                                        longTitle="Radio Button Item"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <radioButtonItemLabelContainerVertical
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Radio Button Item Label Container"
+                                                id="af2_radiobuttonitemlabelcontainervertical"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label"
+                                                longTitle="Radio Button Item Label Container"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <items jcr:primaryType="nt:unstructured">
+                                                <radioButtonLabelVertical
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Label"
+                                                        id="af2_radiobuttonitemlabelvertical"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label span"
+                                                        longTitle="Radio Button Item Label"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label input[disabled] + span"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option-label:hover span"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option input[type='radio']:checked + span"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true'] .cmp-adaptiveform-radiobutton__option-label span"/>
+                                                    </states>
+                                                </radioButtonLabelVertical>
+                                                <radioButtonWidgetAndTextVertical
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Radio Button"
+                                                        id="af2_radiobuttonwidgetvertical"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option__widget"
+                                                        longTitle="Radio Button Item Widget"
+                                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                                    <states jcr:primaryType="nt:unstructured">
+                                                        <focus
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Focus"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:focus"/>
+                                                        <disabled
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Disabled"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:disabled"/>
+                                                        <hover
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Hover"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:hover"/>
+                                                        <checked
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Selected"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:checked"/>
+                                                        <mandatory
+                                                                jcr:primaryType="nt:unstructured"
+                                                                jcr:title="Mandatory"
+                                                                cssSelector=".cmp-adaptiveform-radiobutton__option__widget:required"/>
+                                                    </states>
+                                                </radioButtonWidgetAndTextVertical>
+                                            </items>
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label:hover"/>
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-radiobutton__option-label:focus"/>
+                                            </states>
+                                        </radioButtonItemLabelContainerVertical>
+                                    </items>
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option input[disabled] + span"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-radiobutton__option:focus"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true'] .cmp-adaptiveform-radiobutton__option"/>
+                                    </states>
+                                </radioButtonItemVertical>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__widget.VERTICAL:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__widget.VERTICAL:focus"/>
+                            </states>
+                        </radioButtonWidgetVertical>
+                        <radioButtonDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_radiobuttondescriptionshort"
+                                cssSelector=".cmp-adaptiveform-radiobutton__shortdescription"
+                                longTitle="Radio Button Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </radioButtonDescriptionShort>
+                        <radioButtonDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_radiobuttondescriptionlong"
+                                cssSelector=".cmp-adaptiveform-radiobutton__longdescription"
+                                longTitle="Radio Button Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-radiobutton__longdescription:hover"/>
+                            </states>
+                        </radioButtonDescriptionLong>
+                        <radioButtonErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Radio Button Error Message"
+                                id="af2_radiobuttonerrormessage"
+                                cssSelector=".cmp-adaptiveform-radiobutton__errormessage"
+                                longTitle="Radio Button Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </radioButtonErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-radiobutton:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-radiobutton:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-radiobutton[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/recaptcha/v1/recaptcha/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/recaptcha/v1/recaptcha/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..581a202030
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/recaptcha/v1/recaptcha/_cq_styleConfig/.content.xml
@@ -0,0 +1,93 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0"
+          xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+          xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+          jcr:primaryType="nt:unstructured"
+          jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field jcr:primaryType="nt:unstructured">
+            <items jcr:primaryType="nt:unstructured">
+                <captcha
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="reCaptcha"
+                        id="af2_recaptchacontainer"
+                        cssSelector=".cmp-adaptiveform-recaptcha"
+                        longTitle="reCaptcha Widget and Text"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <captchaLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="reCaptcha Label"
+                                id="af2_recaptchawidgetlabel"
+                                cssSelector=".cmp-adaptiveform-recaptcha__label"
+                                longTitle="reCaptcha Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-recaptcha__label:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-recaptcha__label:hover"/>
+                            </states>
+                        </captchaLabel>
+                        <captchaWidget
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="reCaptcha Widget"
+                                id="af2_recaptchawidget"
+                                cssSelector=".cmp-adaptiveform-recaptcha__widget"
+                                longTitle="reCaptcha Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-recaptcha__widget:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-recaptcha__widget:hover"/>
+                            </states>
+                        </captchaWidget>
+                        <captchaErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="reCaptcha Error Message"
+                                id="af2_recaptchaerrormessage"
+                                cssSelector=".cmp-adaptiveform-recaptcha__errormessage"
+                                longTitle="reCaptcha Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </captchaErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-recaptcha:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-recaptcha:hover"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-recaptcha[data-cmp-enabled='false']"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-recaptcha[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-recaptcha[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-recaptcha[data-cmp-valid='true']"/>
+                    </states>
+                </captcha>
+            </items>
+        </field>
+    </items>
+</jcr:root>
\ No newline at end of file
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/review/v1/review/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/review/v1/review/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..5d8c4ef29b
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/review/v1/review/_cq_styleConfig/.content.xml
@@ -0,0 +1,223 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Review">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_review"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Review"
+                    id="af2_reviewwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-review"
+                    longTitle="Review Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <reviewContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Container"
+                                id="af2_reviewcontainer"
+                                cssSelector=".cmp-adaptiveform-review__container"
+                                longTitle="Review Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </reviewContainer>
+                        <reviewField
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Field"
+                                id="af2_reviewfield"
+                                cssSelector=".cmp-adaptiveform-review__field"
+                                longTitle="Review Field"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <reviewLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_reviewlabel"
+                                        cssSelector=".cmp-adaptiveform-review__label"
+                                        longTitle="Review Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-review__label:hover"/>
+                                    </states>
+                                </reviewLabel>
+                                <reviewValue
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Value"
+                                        id="af2_reviewvalue"
+                                        cssSelector=".cmp-adaptiveform-review__value"
+                                        longTitle="Review Value"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-review__value:hover"/>
+                                    </states>
+                                </reviewValue>
+                                <reviewEditButton
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Edit Button"
+                                        id="af2_revieweditbutton"
+                                        cssSelector=".cmp-adaptiveform-review__edit-button"
+                                        longTitle="Review Edit Button"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-review__edit-button:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-review__edit-button:hover"/>
+                                        <active
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Active"
+                                                cssSelector=".cmp-adaptiveform-review__edit-button:active"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-review__edit-button:disabled"/>
+                                    </states>
+                                </reviewEditButton>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-review__field:hover"/>
+                            </states>
+                        </reviewField>
+                        <reviewPanel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Panel"
+                                id="af2_reviewpanel"
+                                cssSelector=".cmp-adaptiveform-review__panel"
+                                longTitle="Review Panel"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <reviewPanelLabelContainer
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label Container"
+                                        id="af2_reviewpanellabelcontainer"
+                                        cssSelector=".cmp-adaptiveform-review__label-container"
+                                        longTitle="Review Panel Label Container"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <items jcr:primaryType="nt:unstructured">
+                                        <reviewPanelLabel
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Label"
+                                                id="af2_reviewpanellabel"
+                                                cssSelector=".cmp-adaptiveform-review__label"
+                                                longTitle="Review Panel Label"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-review__panel .cmp-adaptiveform-review__label:hover"/>
+                                            </states>
+                                        </reviewPanelLabel>
+                                        <reviewPanelEditButton
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Edit Button"
+                                                id="af2_reviewpaneleditbutton"
+                                                cssSelector=".cmp-adaptiveform-review__edit-button"
+                                                longTitle="Review Panel Edit Button"
+                                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                            <states jcr:primaryType="nt:unstructured">
+                                                <focus
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Focus"
+                                                        cssSelector=".cmp-adaptiveform-review__panel .cmp-adaptiveform-review__edit-button:focus"/>
+                                                <hover
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Hover"
+                                                        cssSelector=".cmp-adaptiveform-review__panel .cmp-adaptiveform-review__edit-button:hover"/>
+                                                <active
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Active"
+                                                        cssSelector=".cmp-adaptiveform-review__panel .cmp-adaptiveform-review__edit-button:active"/>
+                                                <disabled
+                                                        jcr:primaryType="nt:unstructured"
+                                                        jcr:title="Disabled"
+                                                        cssSelector=".cmp-adaptiveform-review__panel .cmp-adaptiveform-review__edit-button:disabled"/>
+                                            </states>
+                                        </reviewPanelEditButton>
+                                    </items>
+                                </reviewPanelLabelContainer>
+                                <reviewPanelContent
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Content"
+                                        id="af2_reviewpanelcontent"
+                                        cssSelector=".cmp-adaptiveform-review__content"
+                                        longTitle="Review Panel Content"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </reviewPanelContent>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-review__panel:hover"/>
+                            </states>
+                        </reviewPanel>
+                        <reviewText
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Text"
+                                id="af2_reviewtext"
+                                cssSelector=".cmp-adaptiveform-review__text"
+                                longTitle="Review Text"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <reviewTextLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_reviewtextlabel"
+                                        cssSelector=".cmp-adaptiveform-review__label"
+                                        longTitle="Review Text Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-review__text .cmp-adaptiveform-review__label:hover"/>
+                                    </states>
+                                </reviewTextLabel>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-review__text:hover"/>
+                            </states>
+                        </reviewText>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-review:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-review[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-review:hover"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/scribble/v1/scribble/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/scribble/v1/scribble/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..8781b56067
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/scribble/v1/scribble/_cq_styleConfig/.content.xml
@@ -0,0 +1,200 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Scribble">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_scribble"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Scribble"
+                    id="af2_scribblewidgetandtext"
+                    cssSelector=".cmp-adaptiveform-scribble"
+                    longTitle="Scribble Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <scribbleLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_scribblelabelcontainer"
+                                cssSelector=".cmp-adaptiveform-scribble__label-container"
+                                longTitle="Scribble Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <scribbleLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_scribblelabel"
+                                        cssSelector=".cmp-adaptiveform-scribble__label"
+                                        longTitle="Scribble Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-scribble__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-scribble__label:focus"/>
+                                    </states>
+                                </scribbleLabel>
+                                <scribbleHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_scribblehelpicon"
+                                        cssSelector=".cmp-adaptiveform-scribble__questionmark"
+                                        longTitle="Scribble Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-scribble__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-scribble__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-scribble__questionmark:disabled"/>
+                                    </states>
+                                </scribbleHelpIcon>
+                            </items>
+                        </scribbleLabelContainer>
+                        <scribbleCanvasContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Canvas Signed Container"
+                                id="af2_scribblecanvascontainer"
+                                cssSelector=".cmp-adaptiveform-scribble__canvas-signed-container"
+                                longTitle="Scribble Canvas Signed Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <scribbleCanvasImage
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Canvas Signed Image"
+                                        id="af2_scribblecanvasimage"
+                                        cssSelector=".cmp-adaptiveform-scribble__canvas-signed-image"
+                                        longTitle="Scribble Canvas Signed Image"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </scribbleCanvasImage>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-scribble__canvas-signed-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-scribble__canvas-signed-container:focus"/>
+                            </states>
+                        </scribbleCanvasContainer>
+                        <scribbleContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Container"
+                                id="af2_scribblecontainer"
+                                cssSelector=".cmp-adaptiveform-scribble__container"
+                                longTitle="Scribble Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <scribbleHeader
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Header"
+                                        id="af2_scribbleheader"
+                                        cssSelector=".cmp-adaptiveform-scribble__header"
+                                        longTitle="Scribble Header"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </scribbleHeader>
+                                <scribbleCanvas
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Canvas"
+                                        id="af2_scribblecanvas"
+                                        cssSelector=".cmp-adaptiveform-scribble__canvas"
+                                        longTitle="Scribble Canvas"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </scribbleCanvas>
+                                <scribbleControlpanel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Control Panel"
+                                        id="af2_scribblecontrolpanel"
+                                        cssSelector=".cmp-adaptiveform-scribble__controlpanel"
+                                        longTitle="Scribble Control Panel"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                </scribbleControlpanel>
+                            </items>
+                        </scribbleContainer>
+                        <scribbleDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_scribbledescriptionshort"
+                                cssSelector=".cmp-adaptiveform-scribble__shortdescription"
+                                longTitle="Scribble Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </scribbleDescriptionShort>
+                        <scribbleDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_scribbledescriptionlong"
+                                cssSelector=".cmp-adaptiveform-scribble__longdescription"
+                                longTitle="Scribble Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-scribble__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-scribble__longdescription:hover"/>
+                            </states>
+                        </scribbleDescriptionLong>
+                        <scribbleErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Scribble Error Message"
+                                id="af2_scribbleerrormessage"
+                                cssSelector=".cmp-adaptiveform-scribble__errormessage"
+                                longTitle="Scribble Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </scribbleErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-scribble:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-scribble[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-scribble:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-scribble[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-scribble[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-scribble[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
\ No newline at end of file
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/README.md
index 81da3cc512..5ddeecb3ff 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/README.md
@@ -52,6 +52,7 @@ JavaScript handling for dialog interaction. It is already included by its edit d
 ```
 BLOCK cmp-adaptiveform-switch
     ELEMENT cmp-adaptiveform-switch__label-container
+    ELEMENT cmp-adaptiveform-switch__label
     ELEMENT cmp-adaptiveform-switch__container
     ELEMENT cmp-adaptiveform-switch__option
     ELEMENT cmp-adaptiveform-switch__option--off
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..3b72c321e8
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/switch/v1/switch/_cq_styleConfig/.content.xml
@@ -0,0 +1,254 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Switch">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_switch"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Switch"
+                    id="af2_switchwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-switch"
+                    longTitle="Switch Handle Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <switchLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_switchlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-switch__label-container"
+                                longTitle="Switch Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <switchLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_switchlabel"
+                                        cssSelector=".cmp-adaptiveform-switch__label"
+                                        longTitle="Switch Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-switch__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-switch__label:focus"/>
+                                    </states>
+                                </switchLabel>
+                                <switchHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_switchhelpicon"
+                                        cssSelector=".cmp-adaptiveform-switch__questionmark"
+                                        longTitle="Switch Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-switch__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-switch__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-switch__questionmark:disabled"/>
+                                    </states>
+                                </switchHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-switch__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-switch__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-switch__label-container:focus"/>
+                            </states>
+                        </switchLabelContainer>
+                        <switchContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Switch Widget Container"
+                                id="af2_switchwidgetcontainer"
+                                cssSelector=".cmp-adaptiveform-switch__container"
+                                longTitle="Switch Widget Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <switchOption
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Option"
+                                        id="af2_switchoption"
+                                        cssSelector=".cmp-adaptiveform-switch__option"
+                                        longTitle="Switch Option"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-switch__option:hover"/>
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-switch__option:focus"/>
+                                    </states>
+                                </switchOption>
+                                <switchWidget
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Widget"
+                                        id="af2_switchwidget"
+                                        cssSelector=".adaptiveform-switch__widget-label"
+                                        longTitle="Switch Widget"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-switch__widget-label:hover"/>
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-switch__widget-label:focus"/>
+                                        <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-switch__widget-label:disabled"/>
+                                    </states>
+                                </switchWidget>
+                                <switchHandle
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Handle"
+                                        id="af2_switchhandle"
+                                        cssSelector=".cmp-adaptiveform-switch__circle-indicator"
+                                        longTitle="Switch Handle"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:focus + .cmp-adaptiveform-switch__widget-slider .cmp-adaptiveform-switch__circle-indicator"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:disabled + .cmp-adaptiveform-switch__widget-slider .cmp-adaptiveform-switch__circle-indicator"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:hover + .cmp-adaptiveform-switch__widget-slider .cmp-adaptiveform-switch__circle-indicator"/>
+                                        <checked
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Selected"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:checked + .cmp-adaptiveform-switch__widget-slider .cmp-adaptiveform-switch__circle-indicator"/>
+                                    </states>
+                                </switchHandle>
+                                <switchSlider
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Slider"
+                                        id="af2_switchonlabel"
+                                        cssSelector=".cmp-adaptiveform-switch__widget-slider"
+                                        longTitle="Switch Slider"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:focus + .cmp-adaptiveform-switch__widget-slider"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:disabled + .cmp-adaptiveform-switch__widget-slider"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:hover + .cmp-adaptiveform-switch__widget-slider"/>
+                                        <checked
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Selected"
+                                                cssSelector=".cmp-adaptiveform-switch__widget:checked + .cmp-adaptiveform-switch__widget-slider"/>
+                                    </states>
+                                </switchSlider>
+                            </items>
+                        </switchContainer>
+                        <switchDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_switchdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-switch__shortdescription"
+                                longTitle="Switch Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </switchDescriptionShort>
+                        <switchDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_switchdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-switch__longdescription"
+                                longTitle="Switch Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-switch__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-switch__longdescription:hover"/>
+                            </states>
+                        </switchDescriptionLong>
+                        <switchErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Switch Error Message"
+                                id="af2_switcherrormessage"
+                                cssSelector=".cmp-adaptiveform-switch__errormessage"
+                                longTitle="Switch Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </switchErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <checked
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Checked"
+                                cssSelector=".cmp-adaptiveform-switch:checked"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-switch:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-switch[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-switch:hover"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-switch[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-switch[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/README.md
index 95c3bffba8..5137d1a604 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/README.md
@@ -52,8 +52,6 @@ BLOCK cmp-tabs
         MOD cmp-tabs__tab--active
         MOD cmp-tabs__tab--stepped
     ELEMENT cmp-tabs__title
-    ELEMENT cmp-tabs__icon
-    ELEMENT cmp-tabs__label
     ELEMENT cmp-tabs__shortdescription
     ELEMENT cmp-tabs__longdescription
     ELEMENT cmp-tabs__questionmark
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..7023e602b1
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/tabsontop/v1/tabsontop/_cq_styleConfig/.content.xml
@@ -0,0 +1,158 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="panel">
+    <items jcr:primaryType="nt:unstructured">
+        <tabsOnTopPanel
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Tabs on Top"
+            id="af2_tabsontop"
+            cssSelector=".cmp-tabs"
+            longTitle="Tabs on Top Panel Container"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <tabsOnTopLabelContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Label Container"
+                        id="af2_tabsontoplabelcontainer"
+                        cssSelector=".cmp-tabs__label-container"
+                        longTitle="Tabs on Top Label Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <tabsOnTopLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label"
+                                id="af2_tabsOnToplabel"
+                                cssSelector=".cmp-tabs__label"
+                                longTitle="Tabs On Top Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-tabs__label:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-tabs__label:focus"/>
+                            </states>
+                        </tabsOnTopLabel>
+                        <tabsOnTopHelpIcon
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Help Icon"
+                                id="af2_tabsOnTophelpicon"
+                                cssSelector=".cmp-tabs__questionmark"
+                                longTitle="Tabs On Top Help Icon"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_helpicon">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-tabs__questionmark:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-tabs__questionmark:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-tabs__questionmark:disabled"/>
+                            </states>
+                        </tabsOnTopHelpIcon>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-tabs__label-container:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-tabs__label-container:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-tabs__label-container:focus"/>
+                    </states>
+                </tabsOnTopLabelContainer>
+                <tabsOnTopDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_tabsOnTopdescriptionshort"
+                        cssSelector=".cmp-tabs__shortdescription"
+                        longTitle="Tabs On Top Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </tabsOnTopDescriptionShort>
+                <tabsOnTopDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_tabsOnTopdescriptionlong"
+                        cssSelector=".cmp-tabs__longdescription"
+                        longTitle="Tabs On Top Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-tabs__longdescription:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-tabs__longdescription:hover"/>
+                    </states>
+                </tabsOnTopDescriptionLong>
+                <tabsOnTopTabList
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Tabs List"
+                        id="af2_tabsOnToptablist"
+                        cssSelector=".cmp-tabs__tablist"
+                        longTitle="Tabs On Top Tab List"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <tabsOnTopTab
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Tab"
+                                id="af2_tabsOnToptab"
+                                cssSelector=".cmp-tabs__tab"
+                                longTitle="Tabs On Top Tab"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <active
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Active"
+                                        cssSelector=".cmp-tabs__tab--active"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-tabs__tab:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-tabs__tab:focus"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-tabs__tab:disabled"/>
+                            </states>
+                        </tabsOnTopTab>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-tabs__tablist:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-tabs__tablist:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-tabs__tablist:disabled"/>
+                    </states>
+                </tabsOnTopTabList>
+            </items>
+        </tabsOnTopPanel>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/telephoneinput/v1/telephoneinput/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/telephoneinput/v1/telephoneinput/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..1565e3b8be
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/telephoneinput/v1/telephoneinput/_cq_styleConfig/.content.xml
@@ -0,0 +1,177 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field jcr:primaryType="nt:unstructured">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Telephone Input"
+                        id="af2_telephonewidgetandtext"
+                        cssSelector=".cmp-adaptiveform-telephoneinput"
+                        longTitle="Telephone Input Widget"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                        secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                        <items jcr:primaryType="nt:unstructured">
+                            <telephoneinputLabelContainer
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Label Container"
+                                    id="af2_telephoneinputlabelcontainer"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput__label-container"
+                                    longTitle="Telephone Input Label Container"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                <items jcr:primaryType="nt:unstructured">
+                                    <telephoneinputLabel
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Label"
+                                            id="af2_telephoneinputlabel"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__label"
+                                            longTitle="Telephone Input Label"
+                                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                        <states jcr:primaryType="nt:unstructured">
+                                            <hover
+                                                    jcr:primaryType="nt:unstructured"
+                                                    jcr:title="Hover"
+                                                    cssSelector=".cmp-adaptiveform-telephoneinput__label:hover"/>
+                                            <focus
+                                                    jcr:primaryType="nt:unstructured"
+                                                    jcr:title="Focus"
+                                                    cssSelector=".cmp-adaptiveform-telephoneinput__label:focus"/>
+                                        </states>
+                                    </telephoneinputLabel>
+                                    <telephoneinputHelpIcon
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Help Icon"
+                                            id="af2_telephoneinputhelpicon"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__questionmark"
+                                            longTitle="Telephone Input Help Icon"
+                                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                            secondarySelectors="af2_guideContainer:af2_helpicon">
+                                        <states jcr:primaryType="nt:unstructured">
+                                            <focus
+                                                    jcr:primaryType="nt:unstructured"
+                                                    jcr:title="Focus"
+                                                    cssSelector=".cmp-adaptiveform-telephoneinput__questionmark:focus"/>
+                                            <hover
+                                                    jcr:primaryType="nt:unstructured"
+                                                    jcr:title="Hover"
+                                                    cssSelector=".cmp-adaptiveform-telephoneinput__questionmark:hover"/>
+                                            <disabled
+                                                    jcr:primaryType="nt:unstructured"
+                                                    jcr:title="Disabled"
+                                                    cssSelector=".cmp-adaptiveform-telephoneinput__questionmark:disabled"/>
+                                        </states>
+                                    </telephoneinputHelpIcon>
+                                </items>
+                                <states jcr:primaryType="nt:unstructured">
+                                    <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector="cmp-adaptiveform-telephoneinput__label-container:disabled"/>
+                                    <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector="cmp-adaptiveform-telephoneinput__label-container:hover"/>
+                                    <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector="cmp-adaptiveform-telephoneinput__label-container:focus"/>
+                                </states>
+                            </telephoneinputLabelContainer>
+                            <telephoneinputWidgetAndText
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Telephone Input"
+                                    id="af2_telephoneinputwidgetandtext"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput__widget"
+                                    longTitle="Telephone Input Widget"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                                <states jcr:primaryType="nt:unstructured">
+                                    <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__widget:focus"/>
+                                    <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__widget:hover"/>
+                                    <disabled
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Disabled"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__widget:disabled"/>
+                                    <mandatory
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Mandatory"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__widget:required"/>
+                                </states>
+                            </telephoneinputWidgetAndText>
+                            <telephoneinputDescriptionShort
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Short Description"
+                                    id="af2_telephoneinputdescriptionshort"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput__shortdescription"
+                                    longTitle="Telephone Input Short Description"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            </telephoneinputDescriptionShort>
+                            <telephoneinputDescriptionLong
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Long Description"
+                                    id="af2_telephoneinputdescriptionlong"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput__longdescription"
+                                    longTitle="Telephone Input Long Description"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                <states jcr:primaryType="nt:unstructured">
+                                    <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__longdescription:focus"/>
+                                    <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-telephoneinput__longdescription:hover"/>
+                                </states>
+                            </telephoneinputDescriptionLong>
+                            <telephoneinputErrorMessage
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Telephone Input Error Message"
+                                    id="af2_telephoneerrormessage"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput__errormessage"
+                                    longTitle="Telephone Input Error Message"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            </telephoneinputErrorMessage>
+                        </items>
+                        <states jcr:primaryType="nt:unstructured">
+                            <focus
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Focus"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput:focus"/>
+                            <disabled
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Disabled"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput[data-cmp-enabled='false']"/>
+                            <hover
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Hover"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput:hover"/>
+                            <mandatory
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Mandatory"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput[data-cmp-required='true']"/>
+                            <error
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Error"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput[data-cmp-valid='false']"/>
+                            <success
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Success"
+                                    cssSelector=".cmp-adaptiveform-telephoneinput[data-cmp-valid='true']"/>
+                        </states>
+                </widgetAndText>
+                <textAreaWidgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    sling:hideResource="{Boolean}true"/>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/termsandconditions/v1/termsandconditions/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/termsandconditions/v1/termsandconditions/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..5f0b230d23
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/termsandconditions/v1/termsandconditions/_cq_styleConfig/.content.xml
@@ -0,0 +1,236 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="TermsAndConditions">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_tnc"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Terms And Conditions"
+                    id="af2_tncwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-termsandcondition"
+                    longTitle="Terms And Conditions Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <tncLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_tnclabelcontainer"
+                                cssSelector=".cmp-adaptiveform-termsandcondition__label-container"
+                                longTitle="Terms and Conditions Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <tncLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_tnclabel"
+                                        cssSelector=".cmp-adaptiveform-termsandcondition__label"
+                                        longTitle="Terms and Conditions Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__label:focus"/>
+                                    </states>
+                                </tncLabel>
+                                <tncHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_tnchelpicon"
+                                        cssSelector=".cmp-adaptiveform-termsandcondition__questionmark"
+                                        longTitle="Terms and Conditions Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__questionmark:disabled"/>
+                                    </states>
+                                </tncHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-termsandcondition__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-termsandcondition__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-termsandcondition__label-container:focus"/>
+                            </states>
+                        </tncLabelContainer>
+                        <tncContentContainer
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Container"
+                            id="af2_tnccontentcontainer"
+                            cssSelector=".cmp-adaptiveform-termsandcondition__content-container"
+                            longTitle="Terms And Conditions Content Container"
+                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <tncContent
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Content"
+                                    id="af2_tnccontent"
+                                    cssSelector=".cmp-adaptiveform-termsandcondition__content"
+                                    longTitle="Terms And Conditions Content"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-termsandcondition__content:hover"/>
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-termsandcondition__content:focus"/>
+                                    </states>
+                                </tncContent>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-termsandcondition__content-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-termsandcondition__content-container:focus"/>
+                            </states>
+                        </tncContentContainer>
+                        <tncConsentArea
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Consent Area"
+                            id="af2_tncconsentarea"
+                            cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox"
+                            longTitle="Terms And Conditions Consent Area"
+                            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <tncCheckbox
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Checkbox"
+                                    id="af2_tncconsentcheckbox"
+                                    cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__widget-container input[type='checkbox']"
+                                    longTitle="Terms And Conditions Checkbox"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Focus"
+                                            cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__widget-container input[type='checkbox']:focus"/>
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__widget-container input[type='checkbox']:hover"/>
+                                        <checked
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Selected"
+                                            cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__widget-container input[type='checkbox']:checked"/>
+                                    </states>
+                                </tncCheckbox>
+                                <tncCheckBoxLabel
+                                    jcr:primaryType="nt:unstructured"
+                                    jcr:title="Checkbox Label"
+                                    id="af2_tnccheckboxlabel"
+                                    cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__label"
+                                    longTitle="Terms And Conditions Checkbox Label"
+                                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__widget-container input[type='checkbox']:disabled + .cmp-adaptiveform-checkbox__label"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__label:hover"/>
+                                        <checked
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Selected"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox__widget-container input[type='checkbox']:checked + .cmp-adaptiveform-checkbox__label"/>
+                                        <mandatory
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Mandatory"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox[data-cmp-required='true'] .cmp-adaptiveform-checkbox__label"/>
+                                        <error
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Error"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox[data-cmp-valid='false'] .cmp-adaptiveform-checkbox__label"/>
+                                        <success
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Success"
+                                                cssSelector=".cmp-adaptiveform-termsandcondition__approvalcheckbox .cmp-adaptiveform-checkbox[data-cmp-valid='true'] .cmp-adaptiveform-checkbox__label"/>
+                                    </states>
+                                </tncCheckBoxLabel>
+                            </items>
+                            <states
+                                jcr:primaryType="nt:unstructured"
+                                sling:hideResource="{Boolean}true"/>
+                        </tncConsentArea>
+                        <tncDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_tncdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-termsandcondition__shortdescription"
+                                longTitle="Terms And Conditions Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </tncDescriptionShort>
+                        <tncDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_tncdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-termsandcondition__longdescription"
+                                longTitle="Terms And Conditions Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-termsandcondition__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-termsandcondition__longdescription:hover"/>
+                            </states>
+                        </tncDescriptionLong>
+                        <tncErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Terms And Conditions Error Message"
+                                id="af2_tncerrormessage"
+                                cssSelector=".cmp-adaptiveform-termsandcondition__errormessage"
+                                longTitle="Terms And Conditions Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </tncErrorMessage>
+                    </items>
+                    <states
+                        jcr:primaryType="nt:unstructured"
+                        sling:hideResource="{Boolean}true"/>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..b3d4323beb
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/_cq_styleConfig/.content.xml
@@ -0,0 +1,43 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_text"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Text"
+                    id="af2_textwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-text"
+                    longTitle="Text Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-text:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-text:hover"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-text[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-text[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/text.html b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/text.html
index 292486590b..32c3429881 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/text.html
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/text/v1/text/text.html
@@ -20,7 +20,7 @@
      id="${textModel.id}"
      data-cmp-data-layer="${textModel.data.json}"
      data-cmp-adaptiveformcontainer-path="${formstructparser.formContainerPath}"
-     data-cmp-visible="${textModel.visible}"
+     data-cmp-visible="${textModel.visible ? 'true' : 'false'}"
      class="cmp-adaptiveform-text cmp-adaptiveform-text__label"
      data-richtext>
     <div
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/textinput/v1/textinput/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/textinput/v1/textinput/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..20ce99c843
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/textinput/v1/textinput/_cq_styleConfig/.content.xml
@@ -0,0 +1,206 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="Base">
+    <items jcr:primaryType="nt:unstructured">
+        <field
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Base"
+            id="af2_textbox"
+            longTitle="Base"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <widgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Text Input"
+                    id="af2_textboxwidgetandtext"
+                    cssSelector=".cmp-adaptiveform-textinput"
+                    longTitle="Text Input Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <items jcr:primaryType="nt:unstructured">
+                        <textinputLabelContainer
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label Container"
+                                id="af2_textinputlabelcontainer"
+                                cssSelector=".cmp-adaptiveform-textinput__label-container"
+                                longTitle="Text Input Label Container"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <textinputLabel
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Label"
+                                        id="af2_textinputlabel"
+                                        cssSelector=".cmp-adaptiveform-textinput__label"
+                                        longTitle="Text Input Label"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-textinput__label:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-textinput__label:focus"/>
+                                    </states>
+                                </textinputLabel>
+                                <textinputHelpIcon
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Help Icon"
+                                        id="af2_textinputhelpicon"
+                                        cssSelector=".cmp-adaptiveform-textinput__questionmark"
+                                        longTitle="Text Input Help Icon"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                        secondarySelectors="af2_guideContainer:af2_helpicon">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-adaptiveform-textinput__questionmark:focus"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-textinput__questionmark:hover"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-adaptiveform-textinput__questionmark:disabled"/>
+                                    </states>
+                                </textinputHelpIcon>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector="cmp-adaptiveform-textinput__label-container:disabled"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector="cmp-adaptiveform-textinput__label-container:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector="cmp-adaptiveform-textinput__label-container:focus"/>
+                            </states>
+                        </textinputLabelContainer>
+                        <textinputWidgetAndText
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Text Input"
+                                id="af2_textinputwidgetandtext"
+                                cssSelector=".cmp-adaptiveform-textinput__widget"
+                                longTitle="Text Input Widget"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-textinput__widget:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-textinput__widget:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-textinput__widget:disabled"/>
+                                <mandatory
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Mandatory"
+                                        cssSelector=".cmp-adaptiveform-textinput__widget:required"/>
+                            </states>
+                        </textinputWidgetAndText>
+                        <textinputDescriptionShort
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Short Description"
+                                id="af2_textinputdescriptionshort"
+                                cssSelector=".cmp-adaptiveform-textinput__shortdescription"
+                                longTitle="Text Input Short Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </textinputDescriptionShort>
+                        <textinputDescriptionLong
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Long Description"
+                                id="af2_textinputdescriptionlong"
+                                cssSelector=".cmp-adaptiveform-textinput__longdescription"
+                                longTitle="Text Input Long Description"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-textinput__longdescription:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-textinput__longdescription:hover"/>
+                            </states>
+                        </textinputDescriptionLong>
+                        <textinputErrorMessage
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Text Input Error Message"
+                                id="af2_textinputerrormessage"
+                                cssSelector=".cmp-adaptiveform-textinput__errormessage"
+                                longTitle="Text Input Error Message"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                        </textinputErrorMessage>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-textinput:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-textinput[data-cmp-enabled='false']"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-textinput:hover"/>
+                        <mandatory
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Mandatory"
+                                cssSelector=".cmp-adaptiveform-textinput[data-cmp-required='true']"/>
+                        <error
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Error"
+                                cssSelector=".cmp-adaptiveform-textinput[data-cmp-valid='false']"/>
+                        <success
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Success"
+                                cssSelector=".cmp-adaptiveform-textinput[data-cmp-valid='true']"/>
+                    </states>
+                </widgetAndText>
+                <textAreaWidgetAndText
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Text Area"
+                    id="af2_textareawidgetandtext"
+                    cssSelector="textarea.cmp-adaptiveform-textinput__widget"
+                    longTitle="Text Area Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                    secondarySelectors="af2_guideContainer:af2_widgetAndText">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Focus"
+                            cssSelector="textarea.cmp-adaptiveform-textinput__widget:focus"/>
+                        <disabled
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Disabled"
+                            cssSelector="textarea.cmp-adaptiveform-textinput__widget:disabled"/>
+                        <hover
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Hover"
+                            cssSelector="textarea.cmp-adaptiveform-textinput__widget:hover"/>
+                        <mandatory
+                            jcr:primaryType="nt:unstructured"
+                            jcr:title="Mandatory"
+                            cssSelector="textarea.cmp-adaptiveform-textinput__widget:required"/>
+                    </states>
+                </textAreaWidgetAndText>
+            </items>
+        </field>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/title/v2/title/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/title/v2/title/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..6208ac2aac
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/title/v2/title/_cq_styleConfig/.content.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="FormTitle">
+    <items jcr:primaryType="nt:unstructured">
+        <formTitle
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Title"
+            id="af2_formtitle"
+            cssSelector=".cmp-title"
+            longTitle="Form Title"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"/>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/README.md
index 8a5f4638b9..676b0d2e48 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/README.md
@@ -46,6 +46,7 @@ BLOCK cmp-verticaltabs
     ELEMENT cmp-verticaltabs__tablist
     ELEMENT cmp-verticaltabs__label
     ELEMENT cmp-verticaltabs__label-container
+    ELEMENT cmp-verticaltabs__tabs-container
     ELEMENT cmp-verticaltabs__tab
         MOD cmp-verticaltabs__tab--active
         MOD cmp-verticaltabs__tab--stepped
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..488eaabf16
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/verticaltabs/v1/verticaltabs/_cq_styleConfig/.content.xml
@@ -0,0 +1,182 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="panel">
+    <items jcr:primaryType="nt:unstructured">
+        <tabsOnLeftPanel
+                jcr:primaryType="nt:unstructured"
+                jcr:title="Tabs on Left"
+                id="af2_tabsonleft"
+                cssSelector=".cmp-verticaltabs"
+                longTitle="Vertical Tabs Panel Container"
+                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <verticalTabsLabelContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Label Container"
+                        id="af2_verticalTabslabelcontainer"
+                        cssSelector=".cmp-verticaltabs__label-container"
+                        longTitle="Vertical Tabs Label Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <verticalTabsLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label"
+                                id="af2_verticalTabslabel"
+                                cssSelector=".cmp-verticaltabs__label"
+                                longTitle="Vertical Tabs Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-verticaltabs__label:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-verticaltabs__label:focus"/>
+                            </states>
+                        </verticalTabsLabel>
+                        <verticalTabsHelpIcon
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Help Icon"
+                                id="af2_verticalTabshelpicon"
+                                cssSelector=".cmp-verticaltabs__questionmark"
+                                longTitle="Vertical Tabs Help Icon"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_helpicon">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-verticaltabs__questionmark:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-verticaltabs__questionmark:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-verticaltabs__questionmark:disabled"/>
+                            </states>
+                        </verticalTabsHelpIcon>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-verticaltabs__label-container:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-verticaltabs__label-container:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-verticaltabs__label-container:focus"/>
+                    </states>
+                </verticalTabsLabelContainer>
+                <verticalTabsDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_verticalTabsdescriptionshort"
+                        cssSelector=".cmp-verticaltabs__shortdescription"
+                        longTitle="Vertical Tabs Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </verticalTabsDescriptionShort>
+                <verticalTabsDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_verticalTabsdescriptionlong"
+                        cssSelector=".cmp-verticaltabs__longdescription"
+                        longTitle="Vertical Tabs Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-verticaltabs__longdescription:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-verticaltabs__longdescription:hover"/>
+                    </states>
+                </verticalTabsDescriptionLong>
+                <verticalTabsTabContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Tab Container"
+                        id="af2_verticalTabstabcontainer"
+                        cssSelector=".cmp-verticaltabs__tabs-container"
+                        longTitle="Vertical Tabs Tab Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <verticalTabsTabList
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Tabs List"
+                                id="af2_verticalTabstablist"
+                                cssSelector=".cmp-verticaltabs__tablist"
+                                longTitle="Vertical Tabs Tab List"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <verticalTabsTab
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Tab"
+                                        id="af2_verticalTabstab"
+                                        cssSelector=".cmp-verticaltabs__tab"
+                                        longTitle="Vertical Tabs Tab"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <active
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Active"
+                                                cssSelector=".cmp-verticaltabs__tab--active"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-verticaltabs__tab:hover"/>
+                                        <focus
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Focus"
+                                                cssSelector=".cmp-verticaltabs__tab:focus"/>
+                                        <disabled
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Disabled"
+                                                cssSelector=".cmp-verticaltabs__tab:disabled"/>
+                                    </states>
+                                </verticalTabsTab>
+                            </items>
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-verticaltabs__tablist:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-verticaltabs__tablist:focus"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-verticaltabs__tablist:disabled"/>
+                            </states>
+                        </verticalTabsTabList>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-verticaltabs__tabs-container:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-verticaltabs__tabs-container:focus"/>
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-verticaltabs__tabs-container:disabled"/>
+                    </states>
+                </verticalTabsTabContainer>
+            </items>
+        </tabsOnLeftPanel>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/README.md b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/README.md
index d9263968fa..1e767eb330 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/README.md
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/README.md
@@ -47,8 +47,14 @@ It is already included by its edit and policy dialogs.
 BLOCK cmp-adaptiveform-wizard
     ELEMENT cmp-adaptiveform-wizard__label
     ELEMENT cmp-adaptiveform-wizard__label-container
+    ELEMENT cmp-adaptiveform-wizard__questionmark
+    ELEMENT cmp-adaptiveform-wizard__shortdescription
+    ELEMENT cmp-adaptiveform-wizard__longdescription
+    ELEMENT cmp-adaptiveform-wizard__widget
+    ELEMENT cmp-adaptiveform-wizard__tabs-container
     ELEMENT cmp-adaptiveform-wizard__tab
     ELEMENT cmp-adaptiveform-wizard__wizardpanel
+    ELEMENT cmp-adaptiveform-wizard__containerNav
     ELEMENT cmp-adaptiveform-wizard__nav 
       MODIFIER cmp-adaptiveform-wizard__nav--previous
       MODIFIER cmp-adaptiveform-wizard__nav--next
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/_cq_styleConfig/.content.xml b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/_cq_styleConfig/.content.xml
new file mode 100644
index 0000000000..9f2acc53ac
--- /dev/null
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v2/wizard/_cq_styleConfig/.content.xml
@@ -0,0 +1,194 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
+    jcr:primaryType="nt:unstructured"
+    jcr:title="panel">
+    <items jcr:primaryType="nt:unstructured">
+        <wizardPanel
+            jcr:primaryType="nt:unstructured"
+            jcr:title="Wizard"
+            id="af2_wizard"
+            cssSelector=".cmp-adaptiveform-wizard--v2"
+            longTitle="Wizard Panel Container"
+            propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+            <items jcr:primaryType="nt:unstructured">
+                <wizardLabelContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Label Container"
+                        id="af2_wizardlabelcontainer"
+                        cssSelector=".cmp-adaptiveform-wizard__label-container"
+                        longTitle="Wizard Label Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <wizardLabel
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Label"
+                                id="af2_wizardlabel"
+                                cssSelector=".cmp-adaptiveform-wizard__label"
+                                longTitle="Wizard Label"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <states jcr:primaryType="nt:unstructured">
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-wizard__label:hover"/>
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-wizard__label:focus"/>
+                            </states>
+                        </wizardLabel>
+                        <wizardHelpIcon
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Help Icon"
+                                id="af2_wizardhelpicon"
+                                cssSelector=".cmp-adaptiveform-wizard__questionmark"
+                                longTitle="Wizard Help Icon"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common"
+                                secondarySelectors="af2_guideContainer:af2_helpicon">
+                            <states jcr:primaryType="nt:unstructured">
+                                <focus
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Focus"
+                                        cssSelector=".cmp-adaptiveform-wizard__questionmark:focus"/>
+                                <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-wizard__questionmark:hover"/>
+                                <disabled
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Disabled"
+                                        cssSelector=".cmp-adaptiveform-wizard__questionmark:disabled"/>
+                            </states>
+                        </wizardHelpIcon>
+                    </items>
+                    <states jcr:primaryType="nt:unstructured">
+                        <disabled
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Disabled"
+                                cssSelector=".cmp-adaptiveform-wizard__label-container:disabled"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-wizard__label-container:hover"/>
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-wizard__label-container:focus"/>
+                    </states>
+                </wizardLabelContainer>
+                <wizardDescriptionShort
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Short Description"
+                        id="af2_wizarddescriptionshort"
+                        cssSelector=".cmp-adaptiveform-wizard__shortdescription"
+                        longTitle="Wizard Short Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                </wizardDescriptionShort>
+                <wizardDescriptionLong
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Long Description"
+                        id="af2_wizarddescriptionlong"
+                        cssSelector=".cmp-adaptiveform-wizard__longdescription"
+                        longTitle="Wizard Long Description"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <states jcr:primaryType="nt:unstructured">
+                        <focus
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Focus"
+                                cssSelector=".cmp-adaptiveform-wizard__longdescription:focus"/>
+                        <hover
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Hover"
+                                cssSelector=".cmp-adaptiveform-wizard__longdescription:hover"/>
+                    </states>
+                </wizardDescriptionLong>
+                <wizardWidget
+                    jcr:primaryType="nt:unstructured"
+                    jcr:title="Widget"
+                    id="af2_wizardwidget"
+                    cssSelector=".cmp-adaptiveform-wizard__widget"
+                    longTitle="Wizard Widget"
+                    propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <wizardPanelNavigationGroup
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Wizard Navigation Group"
+                                id="af2_wizardnavgrp"
+                                cssSelector=".cmp-adaptiveform-wizard__tabs-container"
+                                longTitle="Wizard Panel Navigation Group"
+                                propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                            <items jcr:primaryType="nt:unstructured">
+                                <wizardNavigationItem
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Title"
+                                        id="af2_wizardnavitemtitle"
+                                        cssSelector=".cmp-adaptiveform-wizard__tab"
+                                        longTitle="Wizard Navigation Item Title"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <active
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Active"
+                                                cssSelector=".cmp-adaptiveform-wizard__tab:active"/>
+                                        <stepped
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Visited"
+                                                cssSelector=".cmp-adaptiveform-wizard__tab.stepped"/>
+                                        <hover
+                                                jcr:primaryType="nt:unstructured"
+                                                jcr:title="Hover"
+                                                cssSelector=".cmp-adaptiveform-wizard__tab:hover"/>
+                                    </states>
+                                </wizardNavigationItem>
+                            </items>
+                        </wizardPanelNavigationGroup>
+                    </items>
+                </wizardWidget>
+                <wizardPanelNavContainer
+                        jcr:primaryType="nt:unstructured"
+                        jcr:title="Navigation Container"
+                        id="af2_wizarddescription"
+                        cssSelector=".cmp-adaptiveform-wizard__containerNav"
+                        longTitle="Wizard Navigation Container"
+                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                    <items jcr:primaryType="nt:unstructured">
+                        <wizardPanelScrollers
+                                jcr:primaryType="nt:unstructured"
+                                jcr:title="Scrollers">
+                            <items jcr:primaryType="nt:unstructured">
+                                <panelNextScroll
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Panel Next Scroll"
+                                        id="af2_wizardpanelnextscroll"
+                                        cssSelector=".cmp-adaptiveform-wizard__nav--next"
+                                        longTitle="Wizard Panel Next Scroll"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                <states jcr:primaryType="nt:unstructured">
+                                    <hover
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Hover"
+                                        cssSelector=".cmp-adaptiveform-wizard__nav--next:hover"/>
+                                </states>
+                                </panelNextScroll>
+                                <panelPreviousScroll
+                                        jcr:primaryType="nt:unstructured"
+                                        jcr:title="Panel Previous Scroll"
+                                        id="af2_wizardpanelprevscroll"
+                                        cssSelector=".cmp-adaptiveform-wizard__nav--previous"
+                                        longTitle="Wizard Panel Previous Scroll"
+                                        propertySheet="/mnt/overlay/fd/af/components/stylePropertySheet/common">
+                                    <states jcr:primaryType="nt:unstructured">
+                                        <hover
+                                            jcr:primaryType="nt:unstructured"
+                                            jcr:title="Hover"
+                                            cssSelector=".cmp-adaptiveform-wizard__nav--previous:hover"/>
+                                    </states>
+                                </panelPreviousScroll>
+                            </items>
+                        </wizardPanelScrollers>
+                    </items>
+                </wizardPanelNavContainer>
+            </items>
+        </wizardPanel>
+    </items>
+</jcr:root>
diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/page/v1/page/customheaderlibs.html b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/page/v1/page/customheaderlibs.html
index 50b97a1e1b..72b20ddf7f 100644
--- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/page/v1/page/customheaderlibs.html
+++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/page/v1/page/customheaderlibs.html
@@ -14,9 +14,13 @@
   ~ limitations under the License.
   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
 <sly data-sly-use.clientlib="core/wcm/components/commons/v1/templates/clientlib.html"
-     data-sly-use.formstructparser="com.adobe.cq.forms.core.components.models.form.FormStructureParser"
-     data-sly-test.clientLibRef="${formstructparser.clientLibRefFromFormContainer}">
-    <sly data-sly-test="${clientLibRef}" data-sly-call="${clientlib.css @ categories=clientLibRef}"/>
+     data-sly-use.formstructparser="com.adobe.cq.forms.core.components.models.form.FormStructureParser">
+    <sly data-sly-test.clientLibRef="${formstructparser.clientLibRefFromFormContainer}">
+        <sly data-sly-call="${clientlib.css @ categories=clientLibRef}"/>
+    </sly>
+    <sly data-sly-test.clientLibRefTheme="${formstructparser.themeClientLibRefFromFormContainer}">
+        <sly data-sly-call="${clientlib.css @ categories=clientLibRefTheme}"/>
+    </sly>
 </sly>
 <sly data-sly-use.clientlib="core/wcm/components/commons/v1/templates/clientlib.html">
     <!-- Loading runtime css in authoring -->