<style>	  
	.bodyx {
      font-family: Arial, sans-serif;
      padding: 20px;
      max-width: 600px;
      margin: auto;
    }
    form {
      display: flex;
      flex-direction: column;
    }
    label {
      margin-bottom: 5px;
      font-weight: bold;
    }
    input, textarea, button {
      margin-bottom: 15px;
      padding: 10px;
      font-size: 16px;
    }
    button {
      background-color: #28a745;
      color: white;
      border: none;
      cursor: pointer;
    }
    button:hover {
      background-color: #218838;
    }
  </style>

	
<form id="contactForm">
    <label>Name:</label>
    <input id="name" name="name" required="" type="text" />
    <label>Email:</label>
    <input id="email" name="email" required="" type="email" />
    <label>Phone Number:</label>
    <input id="phone" name="phone" required="" type="tel" />
    <label>Message:</label>
    <textarea id="message" name="message" required="" rows="5"></textarea>
    <button class="buttonX" type="submit">Send</button>
  </form>

 
 <script>
	const botToken = 'ENTER_YOUR_BOT_TOKEN';
    const chatId = 'ENTER_YOUR_CHAT_ID';
 	document.getElementById('contactForm').addEventListener('submit', async (e) => {
      e.preventDefault();
      const name = document.getElementById('name').value;
      const email = document.getElementById('email').value;
      const phone = document.getElementById('phone').value;
      const message = document.getElementById('message').value;
      const text = `
        New Contact Form Submission:
        - Name: ${name}
        - Email: ${email}
        - Phone: ${phone}
        - Message: ${message}
      `;
      try {
        const response = await fetch(`https://api.telegram.org/bot${botToken}/sendMessage`, {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({
            chat_id: chatId,
            text: text
          })
        });
        if (response.ok) {
          alert('Message sent successfully!');   document.getElementById('contactForm').reset();
        } else {
          alert('Failed to send message. Please try again.');
        }
      } catch (error) {
        console.error('Error:', error);
        alert('An error occurred. Please try again later.');
      }
    });
  </script>