FORMS-25002: Adding styles for Signature Step, Summary Step, Adobe Sign Block

src/components/adobesignblock/_adobesignblock.scss

@@ -0,0 +1,45 @@
+/* =============== Adobe Sign Block ================== */
+
+.adobeSignBlockText,
+.cmp-adaptiveform-adobesignblock {
+    border: 1px solid rgba(0, 0, 0, 0.15);
+    border-radius: 4px;
+    padding: 0.5rem;
+    background: rgba(0, 0, 0, 0.02);
+}
+
+/* Adobe Sign field placeholders — rendered as inline elements by the signing JS */
+
+/* Prevent text selection from revealing the transparent placeholder text */
+[data-adobesigntype]::selection {
+    color: rgba(0, 0, 0, 0);
+}
+
+[data-adobesigntype]::-moz-selection {
+    color: rgba(0, 0, 0, 0);
+}
+
+[data-adobesigntype] {
+    width: 6rem;
+    display: inline-block;
+    color: rgba(0, 0, 0, 0);
+    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
+    margin-left: 0.5rem;
+    margin-right: 0.5rem;
+    white-space: nowrap;
+    overflow: hidden;
+    cursor: pointer;
+}
+
+[data-adobesigntype='radio'],
+[data-adobesigntype='checkbox'] {
+    border-bottom-width: 0;
+    background-repeat: no-repeat;
+    background-position: left center;
+    width: 3rem;
+}
+
+[data-adobesigntype='dropdown'] {
+    background-repeat: no-repeat;
+    background-position: right center;
+}

src/components/signaturestep/_signaturestep.scss

@@ -0,0 +1,53 @@
+/* =============== Signature Step ================== */
+
+.cmp-adaptiveform-signaturestep {
+    position: relative;
+    height: 540px;
+    border: 1px solid $very-light-gray;
+    overflow: auto;
+    max-width: 100%;
+    text-align: center;
+}
+
+.cmp-adaptiveform-signaturestep__header {
+    font-size: 2em;
+    padding: 0.05em;
+    background-color: transparent;
+}
+
+.cmp-adaptiveform-signaturestep__title {
+    color: $dark-gray;
+    font-weight: 400;
+}
+
+.cmp-adaptiveform-signaturestep__body {
+    width: 100%;
+    height: calc(100% - 3.5em);
+    overflow: auto;
+}
+
+.cmp-adaptiveform-signaturestep__template-message {
+    width: 100%;
+    height: 90%;
+    border: 1px solid $gray;
+    font-size: 1.2em;
+    color: $dark-gray;
+    text-align: center;
+    padding-top: 30%;
+    overflow: auto;
+    box-sizing: border-box;
+}
+
+.cmp-adaptiveform-signaturestep__iframe {
+    width: 100%;
+    height: 100%;
+}
+
+.cmp-adaptiveform-signaturestep__error {
+    padding: 1em;
+    font-size: 1.2em;
+    color: $error;
+    background-color: $light-error;
+    text-align: center;
+    border-radius: 4px;
+}

src/components/summarystep/_summarystep.scss

@@ -0,0 +1,35 @@
+/* =============== Summary Step ================== */
+
+.cmp-adaptiveform-summarystep {
+    position: relative;
+    height: 500px;
+    border: 1px solid $very-light-gray;
+    overflow: auto;
+    max-width: 100%;
+    text-align: center;
+}
+
+.cmp-adaptiveform-summarystep__title {
+    font-size: 2em;
+    padding: 0.05em;
+    background-color: transparent;
+    color: $dark-gray;
+    font-weight: 400;
+}
+
+.cmp-adaptiveform-summarystep__content {
+    width: 100%;
+    height: calc(100% - 3.5em);
+    overflow: auto;
+}
+
+.cmp-adaptiveform-summarystep__message {
+    color: $dark-gray;
+    font-size: $font-md;
+    line-height: 1.5;
+
+    a {
+        color: $vivid-blue;
+        text-decoration: underline;
+    }
+}

src/theme.scss

@@ -43,5 +43,8 @@
 @import './components/turnstile/_turnstile.scss';
 @import './components/review/_review.scss';
 @import './components/scribble/_scribble.scss';
+@import './components/signaturestep/_signaturestep.scss';
+@import './components/summarystep/_summarystep.scss';
+@import './components/adobesignblock/_adobesignblock.scss';
 @import './components/datetime/_datetime.scss';
 @import './components/imagechoice/_imagechoice.scss';