diff --git a/src/components/client/SignDocument.tsx b/src/components/client/SignDocument.tsx
index 94f3af7..dc7a873 100644
--- a/src/components/client/SignDocument.tsx
+++ b/src/components/client/SignDocument.tsx
@@ -380,6 +380,9 @@ const SignDocument = () => {
         let value = fitObj[indx].value;
         if (value === "FIT") value = "100";
         setZoomScale?.(Number(value));
+        setTimeout(() => {
+            setIsFitDd(false)
+        }, 0)
     }
 
     // const zoom = (percentage: number, contentClass: string) => {
@@ -675,6 +678,8 @@ const SignDocument = () => {
             }
         }
 
+        console.log(createTagsAndSubmit)
+
         // return;
         try {
             dispatch(showLoader("Signing ..."));
@@ -1089,7 +1094,7 @@ const SignDocument = () => {
                                                 key={indx}
                                                 // onClick={() => setSelFitIndx(indx)}
                                                 onClick={() => handleFitSelect(indx)}
-                                                className='flex z-50 items-center justify-between gap-2 w-[70px] p-2 text-xs cursor-default hover:bg-slate-100'>
+                                                className='flex z-50 items-center justify-between gap-2 w-[70px] p-2 text-xs cursor-default hover:bg-slate-100 text-slate-600'>
                                                 <div
 
                                                     className='flex items-center justify-between w-full'>
diff --git a/src/components/client/TagsCon.tsx b/src/components/client/TagsCon.tsx
index 6415596..9004efe 100644
--- a/src/components/client/TagsCon.tsx
+++ b/src/components/client/TagsCon.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useEffect, useRef, useState } from 'react'
 import { DroppedItem, TagsTypes } from '../../utlity/types';
 import { RiDragMoveFill } from 'react-icons/ri';
 import { IoMdClose } from 'react-icons/io';
@@ -325,6 +325,68 @@ const TagsCon: React.FC<TagsConProps> = ({
         }
     }
 
+    // useEffect(() => {
+
+    //     if ((!signatureContainerRef.current || !signatureFontRef.current) || (!initialContainerRef.current || !initialFontRef.current)) return;
+
+    //     if (signatureContainerRef.current && signatureFontRef.current) {
+    //         const containerWidth = signatureContainerRef.current.offsetWidth;
+    //         // Start with base font
+    //         signatureFontRef.current.style.fontSize = "100px";
+    //         const textWidth = signatureFontRef.current.offsetWidth;
+    //         const scale = containerWidth / textWidth;
+    //         signatureFontRef.current.style.fontSize = `${100 * scale}px`;
+    //     }
+
+    //     if (initialContainerRef.current && initialFontRef.current) {
+    //         const containerWidth = initialContainerRef.current.offsetWidth;
+    //         // Start with base font
+    //         initialFontRef.current.style.fontSize = "100px";
+    //         const textWidth = initialFontRef.current.offsetWidth;
+    //         const scale = containerWidth / textWidth;
+    //         initialFontRef.current.style.fontSize = `${100 * scale}px`;
+    //     }
+    // }, [saved.signature]);
+
+
+    useEffect(() => {
+        const signatureContainers = document.querySelectorAll(".signature-container");
+        const initialContainers = document.querySelectorAll(".initial-container");
+
+        setTimeout(() => {
+
+            signatureContainers.forEach(container => {
+                const span = container.querySelector(".signature-text");
+
+                if (!span) return;
+
+                span.style.fontSize = "100px";
+
+                const containerWidth = container.clientWidth;
+                const textWidth = span.scrollWidth;
+
+                if (textWidth === 0) return;
+
+                span.style.fontSize = `${100 * containerWidth / textWidth}px`;
+            });
+
+            initialContainers.forEach(container => {
+                const span = container.querySelector(".initial-text");
+
+                if (!span) return;
+
+                span.style.fontSize = "100px";
+
+                const containerWidth = container.clientWidth;
+                const textWidth = span.scrollWidth;
+
+                if (textWidth === 0) return;
+
+                span.style.fontSize = `${100 * containerWidth / textWidth}px`;
+            });
+        }, 0)
+    }, [saved.signature, signConfObj]);
+
     return (
         <>
             {currDocTags.map((item, index) => {
@@ -406,8 +468,8 @@ const TagsCon: React.FC<TagsConProps> = ({
                                 id={item.navigationOrder}
                                 tabIndex={1}
                                 className={`h-full w-full rounded border-slate-100 ${transparentTags || hideTags
-                                        ? "pointer-events-none"
-                                        : "bg-slate-200 shadow-sm opacity-80"
+                                    ? "pointer-events-none"
+                                    : "bg-slate-200 shadow-sm opacity-80"
                                     }`}
                                 style={{ overflow: "hidden" }}  // clip content to container
                             >
@@ -744,9 +806,9 @@ const TagsCon: React.FC<TagsConProps> = ({
                             item.type == "SIGNATURE" &&
                             <div
                                 tabIndex={1}
-                                id={item.navigationOrder}
+                                id={item.navigationOrder + ""}
                                 onClick={() => handleSignClick(index, item.id)}
-                                className={`flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none bg-transparent" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`}
+                                className={`signature-container flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none bg-transparent" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`}
                             // style={{ height: item.dimensions.height + "px" }}
                             >
                                 {/* <input type="checkbox" className=""  /> */}
@@ -755,9 +817,9 @@ const TagsCon: React.FC<TagsConProps> = ({
                                         (
                                             (item.id != null && item.id != undefined && item.id != "")
                                                 ? (
-                                                    (`${item.id}`) in signConfObj && signConfObj[`${item.id}`].accepted
+                                                    (`${item.id}`) in signConfObj && signConfObj[`${item.id}`]?.accepted
                                                 ) : (
-                                                    (`${index}`) in signConfObj && signConfObj[`${index}`].accepted
+                                                    (`${index}`) in signConfObj && signConfObj[`${index}`]?.accepted
                                                 )
                                         )
                                     )) ? (
@@ -765,13 +827,13 @@ const TagsCon: React.FC<TagsConProps> = ({
                                     ) : saved && saved.saveType != null && saved.saveType == "SELECT" ? (
                                         <>
                                             <span
-                                                className={`absolute left-0 bottom-0 text-nowrap`}
+                                                className={`signature-text absolute left-0 bottom-0 text-nowrap`}
                                                 style={{
-                                                    color: item.styles.color,
-                                                    fontSize: `${item.styles?.textSize}px`,
-                                                    fontStyle: item.styles.italic ? "italic" : "normal",
-                                                    fontWeight: item.styles.bold ? "600" : "400",
-                                                    textDecoration: item.styles.underline ? "underline" : "none",
+                                                    color: item?.styles?.color,
+                                                    // fontSize: `${item.styles?.textSize}px`,
+                                                    fontStyle: item?.styles?.italic ? "italic" : "normal",
+                                                    fontWeight: item?.styles?.bold ? "600" : "400",
+                                                    textDecoration: item?.styles?.underline ? "underline" : "none",
                                                     fontFamily: saved?.font
                                                 }}
                                             >
@@ -802,7 +864,7 @@ const TagsCon: React.FC<TagsConProps> = ({
                                 tabIndex={1}
                                 id={item.navigationOrder}
                                 onClick={() => handleSignClick(index, item.id)}
-                                className={`flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`}
+                                className={`initial-container flex justify-center items-center h-full w-full rounded cursor-pointer ${transparentTags || hideTags ? "pointer-events-none" : "bg-slate-200 shadow-sm border-slate-100 opacity-80"}`}
                             // style={{ height: item.dimensions.height + "px" }}
                             >
                                 {((!transparentTags && !hideTags) && !(saved.save &&
@@ -819,10 +881,10 @@ const TagsCon: React.FC<TagsConProps> = ({
                                     : saved && saved.saveType != null && saved.saveType == "SELECT" ? (
                                         <>
                                             <span
-                                                className={`absolute left-0 bottom-0`}
+                                                className={`initial-text absolute left-0 bottom-0`}
                                                 style={{
                                                     color: item.styles.color,
-                                                    fontSize: `${item.styles?.textSize}px`,
+                                                    // fontSize: `${item.styles?.textSize}px`,
                                                     fontStyle: item.styles.italic ? "italic" : "normal",
                                                     fontWeight: item.styles.bold ? "600" : "400",
                                                     textDecoration: item.styles.underline ? "underline" : "none",
diff --git a/src/components/process/processStepTwo/DocumentContainer.tsx b/src/components/process/processStepTwo/DocumentContainer.tsx
index 7fab608..2f518c3 100644
--- a/src/components/process/processStepTwo/DocumentContainer.tsx
+++ b/src/components/process/processStepTwo/DocumentContainer.tsx
@@ -483,7 +483,6 @@ const DocumentContainer = forwardRef<DocumentContainerRef, DocumentContainerProp
             }
         };
 
-
         const handleTransactionProcess = async (save: boolean = false, isNavigate: boolean = false, navigateTo: string = "/") => {
 
             // if (TRANSACTION_TEMPLATE_TOGGLE.TEMPLATES === transactionTemplateToggle) save = true;
@@ -804,10 +803,10 @@ const DocumentContainer = forwardRef<DocumentContainerRef, DocumentContainerProp
                         <div className="zoom-con"
                             style={{
                                 transform: `scale(${scaleFactor})`,
-                                transformOrigin: 'top left',  // ← change to top left
+                                transformOrigin: 'top left',
                                 width: `${100 / scaleFactor}%`,
                                 height: scaleFactor < 1
-                                    ? `${100 / scaleFactor}%`  // zoomed out — expand to fill
+                                    ? `${100 / scaleFactor}%`   // zoomed out — expand to fill
                                     : 'auto',                   // zoomed in — let content grow
                             }}>
                             {
@@ -912,7 +911,6 @@ const DocumentContainer = forwardRef<DocumentContainerRef, DocumentContainerProp
                                                 }
                                             </div>
 
-
                                         </div>
                                     )
                                 }) : <Loader />
diff --git a/src/components/process/processStepTwo/NavTwo.tsx b/src/components/process/processStepTwo/NavTwo.tsx
index 4e84259..19e6bef 100644
--- a/src/components/process/processStepTwo/NavTwo.tsx
+++ b/src/components/process/processStepTwo/NavTwo.tsx
@@ -54,6 +54,10 @@ const fitObj = [
         label: "50%",
         value: "50"
     },
+    {
+        label: "130%",
+        value: "130"
+    },
     {
         label: "150%",
         value: "150"
@@ -115,7 +119,7 @@ const NavTwo: React.FC<NavTwoProps> = ({
     const params = useParams<{ accountId?: string; transactionId?: string; templateId?: string }>();
     let accountId = params.accountId;
     let transactionId = params.transactionId
-    
+
     if (!transactionId) {
         transactionTemplateToggle = TRANSACTION_TEMPLATE_TOGGLE.TEMPLATES;
         transactionId = params.templateId;
@@ -226,6 +230,9 @@ const NavTwo: React.FC<NavTwoProps> = ({
         let value = fitObj[indx].value;
         if (value === "FIT") value = "100";
         onZoomChange?.(Number(value));
+        setTimeout(() => {
+            setIsFitDd(false)
+        }, 0)
     }
 
 
diff --git a/src/components/signature/ClientSignCon.tsx b/src/components/signature/ClientSignCon.tsx
index ac5d1e9..b2e2f6c 100644
--- a/src/components/signature/ClientSignCon.tsx
+++ b/src/components/signature/ClientSignCon.tsx
@@ -134,9 +134,7 @@ const ClientSignCon: React.FC<ClientSignConProps> = ({
         },
     });
 
-    const [selectedSignature, setSelectedSignature] = useState<SelectStyle>(
-        signatureOptions.length > 0 ? { id: signatureOptions[0].id, style: signatureOptions[0].style } : { id: 0, style: "" }
-    );
+    const [selectedSignature, setSelectedSignature] = useState<SelectStyle>({ id: fontsMap[0].acronym, style: fontsMap[0].family });
 
     // Store the actual file
     const [file1, setFile1] = useState<File | null>(null);
@@ -679,7 +677,7 @@ const ClientSignCon: React.FC<ClientSignConProps> = ({
                             <button
                                 className="cursor-pointer px-4 py-3 sm:py-2 w-full sm:w-auto text-xs md:text-sm font-medium rounded-lg bg-[var(--mainPrimaryBtn)] text-white hover:opacity-90 hover:shadow-lg flex items-center justify-center gap-1 md:gap-2 disabled:opacity-60 disabled:cursor-not-allowed transition-all duration-200"
                                 onClick={handleSubmit}
-                                disabled={isSubmitting}
+                                disabled={isSubmitting || (activeTab === "SELECT" && (initials == '' || fullName == ''))}
                             >
                                 {isSubmitting ? (
                                     <>