function validate() {

    const tabs = Array.from(document.querySelectorAll('fw-tab'));
    const allTabsHiddenExceptFirst = tabs.slice(1).every(tab => tab.style.visibility === 'hidden');

    if (allTabsHiddenExceptFirst) {
        showErrorToast("Error! Please Click Validate to Validate the App and then Click Install/Save.");
        return false;
    }

  
  const merchantDropdown = document.querySelector('#merchantFieldDropdown');
  const vendorDropdown = document.querySelector('#vendorFieldDropdown');

  if ((!merchantDropdown || !merchantDropdown.value || merchantDropdown.value === 'default') &&
    (!vendorDropdown || !vendorDropdown.value || vendorDropdown.value === 'default')) {
      moveToTab('fieldstab');
      showErrorToast("Error! Please choose a Merchant and Vendor Field.");
    return false;
  } else if (!merchantDropdown || !merchantDropdown.value || merchantDropdown.value === 'default') {
    moveToTab('fieldstab'); 
    showErrorToast("Error! Please choose a Merchant Field.");
    return false;
  } else if (!vendorDropdown || !vendorDropdown.value || vendorDropdown.value === 'default') {
    moveToTab('fieldstab'); 
    showErrorToast("Error! Please choose a Vendor Field.");
    return false;
  }



  // Workspace Dropdown Validations
  const merchantWorkspaceDropdown = document.querySelector('#merchantWorkspaceSelect');
  const vendorWorkspaceDropdown = document.querySelector('#vendorWorkspaceSelect');

  if ((!merchantWorkspaceDropdown || !merchantWorkspaceDropdown.value || merchantWorkspaceDropdown.value === 'default') &&
    (!vendorWorkspaceDropdown || !vendorWorkspaceDropdown.value || vendorWorkspaceDropdown.value === 'default')) {
      moveToTab('workspace-tab'); 

      showErrorToast("Error! Please choose a Merchant and Vendor Workspace.");
    return false;
  } else if (!merchantWorkspaceDropdown || !merchantWorkspaceDropdown.value || merchantWorkspaceDropdown.value === 'default') {
    moveToTab('workspace-tab');
    showErrorToast("Error! Please choose a Merchant Workspace.");
    return false;
  } else if (!vendorWorkspaceDropdown || !vendorWorkspaceDropdown.value || vendorWorkspaceDropdown.value === 'default') {
    moveToTab('workspace-tab');
    showErrorToast("Error! Please choose a Vendor Workspace.");
    return false;
  }



  if (ticketworkflowconditions.length === 0) {
    showErrorToast("Error! Please Choose an Event.");
    moveToTab('ticketworkflow');
    return false;
  }
  
  const fieldsDropdowns = document.querySelectorAll('.field-name-dropdown');
  const choicesDropdowns = document.querySelectorAll('.choices-dropdown');
  for (let i = 0; i < fieldsDropdowns.length; i++) {
    const fieldDropdown = fieldsDropdowns[i];
    const choicesDropdown = choicesDropdowns[i];

    if (!fieldDropdown.value || fieldDropdown.value === 'default') {
      showErrorToast(`Error! Please select a Field.`);
      moveToTab('ticketworkflow');
      return false;
    }

    if (!choicesDropdown || !choicesDropdown.value || choicesDropdown.value === 'default') {
      showErrorToast(`Error! Please select a choice for the Field.`);
      moveToTab('ticketworkflow');
      return false;
    }
  }










    // Mandatory Fields Validation
    let unfilledFields = [];
    
    const mandatoryFields = document.querySelectorAll(
        '#tabs3 .form-group input:not([type="checkbox"]), #tabs3 .form-group select, #tabs4 .form-group input:not([type="checkbox"]), #tabs4 .form-group select, #tabs3 .form-group fw-select[multiple], #tabs3 .form-group fw-select, #tabs4 .form-group fw-select'
    );

    mandatoryFields.forEach((field) => {
        const fieldLabelElement = field.closest('.form-group').querySelector('label, h6');
        const fieldLabel = fieldLabelElement ? fieldLabelElement.textContent.trim() : '';
        const fieldName = fieldLabel.replace(/\s*\*\s*$/, '');

        if (!field.value || field.value === 'default') {
            if (!unfilledFields.includes(fieldName)) {
                unfilledFields.push(fieldName);
            }
        }

        if (field.hasAttribute('data-dependent')) {
            if (!field.value || field.value === 'default') {
                if (!unfilledFields.includes(field.label)) {
                    unfilledFields.push(field.label);
                }
            }
        }
        
        if (field.tagName.toLowerCase() === 'fw-select' && field.hasAttribute('multiple')) {
            if (!field.value || field.value.length === 0) {
                if (!unfilledFields.includes(field.label)) {
                    unfilledFields.push(field.label);
                }
            }
        }
    });
    
    if (unfilledFields.length > 0) {
        const errorMessage = `Error! Please fill in the following Mandatory Fields: ${unfilledFields.join(', ')}.`;
        moveToTab('mandatoryFields');
        showErrorToast(errorMessage);
        return false; 
    }


  const isStatusSyncEnabled = statusToggle.checked;
  const isDepartmentSyncEnabled = departmentToggle.checked;

  if (isStatusSyncEnabled && Object.keys(mappings).length === 0) {
    showErrorToast("Error! Please add at least one Status Mapping.");
    moveToTab('status-mapping'); 
    return false;
  }

  if (isDepartmentSyncEnabled && Object.keys(dmappings).length === 0) {
    showErrorToast("Error! Please add at least one Department Mapping.");
    moveToTab('departmentfields-mapping');
    return false;
  }

  const agentEmailsSelected = email_config.agent_email;
  const externalEmailsTyped = email_config.external_email;

  if (!agentEmailsSelected || agentEmailsSelected.length === 0) {
    showErrorToast("Error! Please choose at least one agent in the Agent Email dropdown.");
    moveToTab('email-tab'); 
    return false;
  }




    return true;
}




in this validation in mandatory fields part, add customparagraph validation to the existing code 

function createCustomParagraph(container, field, fieldName, alldata) {
console.log("Field Data :", field.required_for_agents);

const fieldContainer = document.createElement('div');
fieldContainer.classList.add('form-group');
fieldContainer.style.marginBottom = '10px';

// Create and append the label
const fieldLabelElement = document.createElement('label');
fieldLabelElement.innerHTML = `${field.label} <span style="color: red;">*</span>`;
fieldLabelElement.setAttribute('for', `paragraph_input_${field.id}`);
fieldLabelElement.style.fontWeight = '600';
fieldLabelElement.style.marginBottom = '8px';
fieldContainer.appendChild(fieldLabelElement);

// Create a wrapper for the textarea and delete button in a single row
const rowContainer = document.createElement('div');
rowContainer.style.display = 'flex';
rowContainer.style.alignItems = 'center';

// Create and append the textarea element
const newParagraphInput = document.createElement('textarea');
newParagraphInput.id = `paragraph_input_${field.id}`;
newParagraphInput.classList.add('form-control');
newParagraphInput.style.flex = '1';
newParagraphInput.style.marginRight = '10px';

// Set initial value if exists
selectedMandatoryFields[field.name] = alldata.mandatory_fields?.[field.name] || '';
if (alldata.mandatory_fields && alldata.mandatory_fields[field.name] !== undefined) {
  newParagraphInput.value = alldata.mandatory_fields[field.name];
}

// Add input event listener to update alldata and selectedMandatoryFields
newParagraphInput.addEventListener('input', function () {
  if (newParagraphInput.value !== '') {
    selectedMandatoryFields[field.name] = newParagraphInput.value;
    alldata.mandatory_fields[field.name] = newParagraphInput.value;
  } else {
    delete selectedMandatoryFields[field.name];
    delete alldata.mandatory_fields[field.name];
  }
});

rowContainer.appendChild(newParagraphInput);

if (field.required_for_agents) {
  // Wrap delete button in a tooltip if required_for_agents is true
  const tooltip = document.createElement('fw-tooltip');
  tooltip.setAttribute('content', 'This field is chosen as mandatory');

  const deleteButton = document.createElement('fw-button');
  deleteButton.setAttribute('size', 'icon');
  deleteButton.setAttribute('color', 'secondary');
  deleteButton.innerHTML = '<fw-icon name="delete" size="20"></fw-icon>';
  deleteButton.setAttribute('disabled', 'true');

  tooltip.appendChild(deleteButton);
  rowContainer.appendChild(tooltip);
} else {
  // Add standard delete button for non-mandatory fields
  const deleteButton = document.createElement('fw-button');
  deleteButton.setAttribute('size', 'icon');
  deleteButton.setAttribute('color', 'secondary');
  deleteButton.innerHTML = '<fw-icon name="delete" size="20"></fw-icon>';

  deleteButton.addEventListener('click', function () {
      // Use the modal for confirmation
      const modal = document.getElementById('composition');
      if (modal) {
        modal.setAttribute('is-open', 'true');
        modal.querySelector('fw-modal-title').innerHTML = `<span>Delete Mapping</span>`;
        modal.querySelector('fw-modal-content').innerHTML = `
          <span>Are you sure you want to delete this field mapping?</span>
        `;

        // Add event listener for the modal's "Yes" (submit) button
        modal.addEventListener('fwSubmit', function () {
          container.removeChild(fieldContainer); // Remove from UI
          delete selectedMandatoryFields[field.name]; // Remove from selectedMandatoryFields
          delete alldata.mandatory_fields[field.name]; // Remove from alldata.mandatory_fields

          console.log('Remaining mandatory fields:', selectedMandatoryFields); // Log remaining mandatory fields
          document.body.removeChild(modal); // Close the modal
        });
      }
    });

  rowContainer.appendChild(deleteButton);
}

// Append rowContainer (textarea + delete button) to fieldContainer
fieldContainer.appendChild(rowContainer);

// Add hint text below the textarea and delete button
const hintText = document.createElement('div');
hintText.classList.add('hint-text');
hintText.style.fontSize = '12px';
hintText.style.color = '#6c757d';
hintText.style.marginTop = '4px';
hintText.textContent = 'Enter a detailed paragraph';
fieldContainer.appendChild(hintText);

container.appendChild(fieldContainer);
}