From 89f26646a47dab22c80904f43cfb2f8c7e23ba35 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 20:23:38 +0000
Subject: [PATCH 1/6] Update src/app/about/page.tsx

---
 src/app/about/page.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx
index 574e779..6a796de 100644
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -55,21 +55,21 @@ export default function AboutPage() {
               id: 1,
               title: "Founded on Tradition",
               description: "Starting with family recipes passed down through generations, we honor authentic Mexican baking heritage while creating innovative flavors that delight modern palates.",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girls-buys-buns-bakery_1157-24661.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girls-buys-buns-bakery_1157-24661.jpg?_wi=3",
               imageAlt: "Traditional Mexican bakery heritage and culture"
             },
             {
               id: 2,
               title: "Fresh Every Day",
               description: "Our skilled bakers start their work before dawn, ensuring that every pastry, bread, and cake meets our strict quality standards. Freshness is not just a promise—it's our guarantee.",
-              imageSrc: "http://img.b2bpic.net/free-photo/mid-aged-couple-love-home_23-2147986283.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/mid-aged-couple-love-home_23-2147986283.jpg?_wi=3",
               imageAlt: "Daily fresh baking process and quality control"
             },
             {
               id: 3,
               title: "Community First",
               description: "We're more than a bakery; we're part of your neighborhood. We support local events, celebrate with families, and create memories one pastry at a time.",
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-young-woman-standing-front-display-cabinet-showing-blank-slate_23-2148027989.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-young-woman-standing-front-display-cabinet-showing-blank-slate_23-2148027989.jpg?_wi=2",
               imageAlt: "Community gatherings and celebrations at International Bakery"
             }
           ]}
@@ -129,7 +129,7 @@ export default function AboutPage() {
           description="Ready to discover your new favorite pastry? International Bakery Inc welcomes you with open doors, warm smiles, and the aroma of fresh-baked goodness. Whether you're a first-time visitor or a longtime friend, we have something special waiting for you."
           background={{ variant: "plain" }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg?_wi=2"
           imageAlt="Inviting interior of International Bakery"
           mediaPosition="right"
           mediaAnimation="slide-up"

From 836b7bd2da67e77c2faff1ac9b9aa4e4c9826b4e Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 20:23:39 +0000
Subject: [PATCH 2/6] Update src/app/cakes/page.tsx

---
 src/app/cakes/page.tsx | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/app/cakes/page.tsx b/src/app/cakes/page.tsx
index b9524d0..b9f1390 100644
--- a/src/app/cakes/page.tsx
+++ b/src/app/cakes/page.tsx
@@ -56,21 +56,21 @@ export default function CakesPage() {
               id: "tres-leches",
               name: "Tres Leches Cake",
               price: "$24.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/sweet-cake-with-basket-roses-marble-surface_114579-21578.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/sweet-cake-with-basket-roses-marble-surface_114579-21578.jpg?_wi=2",
               imageAlt: "Traditional tres leches cake with cream and fruit"
             },
             {
               id: "chocolate",
               name: "Chocolate Celebration Cake",
               price: "$22.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg?_wi=5",
               imageAlt: "Rich chocolate celebration cake"
             },
             {
               id: "vanilla",
               name: "Vanilla Dream Cake",
               price: "$20.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg?_wi=4",
               imageAlt: "Classic vanilla dream cake with fresh toppings"
             }
           ]}
@@ -88,37 +88,37 @@ export default function CakesPage() {
             {
               id: "1",
               name: "Maria Lopez",
-              imageSrc: "http://img.b2bpic.net/free-photo/confectioner-uniform-decorates-cake_1157-33465.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/confectioner-uniform-decorates-cake_1157-33465.jpg?_wi=2",
               imageAlt: "Maria Lopez celebration photo"
             },
             {
               id: "2",
               name: "James Wilson",
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-bakery-shop-owner-taking-phone-order_23-2148028001.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-bakery-shop-owner-taking-phone-order_23-2148028001.jpg?_wi=2",
               imageAlt: "James Wilson celebration photo"
             },
             {
               id: "3",
               name: "Sofia Garcia",
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg?_wi=2",
               imageAlt: "Sofia Garcia celebration photo"
             },
             {
               id: "4",
               name: "Carlos Mendez",
-              imageSrc: "http://img.b2bpic.net/free-photo/queer-couple-celebrating-birthday-together_23-2149570899.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/queer-couple-celebrating-birthday-together_23-2149570899.jpg?_wi=2",
               imageAlt: "Carlos Mendez celebration photo"
             },
             {
               id: "5",
               name: "Isabella Santos",
-              imageSrc: "http://img.b2bpic.net/free-photo/shop-assistant-preparing-croissant-bag_23-2147985156.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/shop-assistant-preparing-croissant-bag_23-2147985156.jpg?_wi=2",
               imageAlt: "Isabella Santos celebration photo"
             },
             {
               id: "6",
               name: "Diego Ruiz",
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-showing-approval_23-2148334512.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-showing-approval_23-2148334512.jpg?_wi=2",
               imageAlt: "Diego Ruiz celebration photo"
             }
           ]}
@@ -134,7 +134,7 @@ export default function CakesPage() {
           description="Whether it's a birthday, anniversary, wedding, or special occasion, our cakes bring joy to every celebration. Contact us to order your custom cake or visit us to explore more options. We also offer custom decorations and flavors to make your moment uniquely yours."
           background={{ variant: "plain" }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg?_wi=3"
           imageAlt="International Bakery cake selection counter"
           mediaPosition="right"
           mediaAnimation="slide-up"

From 6f5ec0ee88fe496f404bd753d34b90b46844c1ec Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 20:23:39 +0000
Subject: [PATCH 3/6] Update src/app/contact/page.tsx

---
 src/app/contact/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index 3d4dd75..284d168 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -50,7 +50,7 @@ export default function ContactPage() {
             variant: "plain",
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg?_wi=4"
           imageAlt="Warm interior of International Bakery with fresh pastries"
           mediaPosition="right"
           mediaAnimation="slide-up"

From 5be10d739a4498e72c914fbd59976c112c33b473 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 20:23:40 +0000
Subject: [PATCH 4/6] Update src/app/layout.tsx

---
 src/app/layout.tsx | 1367 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 1367 insertions(+)

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 5eb0b54..53911be 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1427,6 +1427,1373 @@ export default function RootLayout({
   
   window.parent.postMessage({ type: 'webild-editor-ready' }, '*');
 })();
+`
+          }}
+        />
+      
+        <script
+          dangerouslySetInnerHTML={{
+            __html: `
+(function() {
+  if (window.self === window.top) return;
+
+  if (window.__webildEditorInitialized) return;
+  window.__webildEditorInitialized = true;
+
+  let isActive = false;
+  let hoveredElement = null;
+  let selectedElement = null;
+  let originalContent = null;
+  let isEditing = false;
+  let elementTypeLabel = null;
+  let hoverOverlay = null;
+  let scrollTimeout = null;
+  let isScrolling = false;
+
+  const invalidElements = ['html', 'body', 'script', 'style', 'meta', 'link', 'head', 'noscript', 'title'];
+  const hoverClass = 'webild-hover';
+  const selectedClass = 'webild-selected';
+
+  const style = document.createElement('style');
+  style.id = 'webild-inspector-styles';
+  style.textContent = '' +
+    '.webild-hover {' +
+    '  outline: 2px dashed #4d96ff80 !important;' +
+    '  border-radius: 0 !important;' +
+    '  outline-offset: 2px !important;' +
+    '  cursor: pointer !important;' +
+    '  transition: outline 0.15s ease !important;' +
+    '  background-color: #4d96ff05 !important;' +
+    '}' +
+    '.webild-selected {' +
+    '  outline: 2px solid #4d96ff !important;' +
+    '  outline-offset: 2px !important;' +
+    '  transition: outline 0.15s ease !important;' +
+    '  background-color: #4d96ff05 !important;' +
+    '  border-radius: 0 !important;' +
+    '}' +
+    '[contenteditable="true"].webild-selected {' +
+    '  outline: 2px solid #4d96ff !important;' +
+    '  background-color: #4d96ff05 !important;' +
+    '}' +
+    'img.webild-hover,' +
+    'img.webild-selected,' +
+    'video.webild-hover,' +
+    'video.webild-selected {' +
+    '  outline-offset: 2px !important;' +
+    '}' +
+    '.webild-element-type-label {' +
+    '  position: fixed !important;' +
+    '  z-index: 999999 !important;' +
+    '  background: #4d96ff !important;' +
+    '  color: white !important;' +
+    '  padding: 4px 8px !important;' +
+    '  font-size: 11px !important;' +
+    '  font-weight: 600 !important;' +
+    '  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;' +
+    '  pointer-events: none !important;' +
+    '  white-space: nowrap !important;' +
+    '  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;' +
+    '  letter-spacing: 0.3px !important;' +
+    '  border: 1px solid #4d96ff20 !important;' +
+    '}' +
+    '.webild-element-type-label.label-top {' +
+    '  border-radius: 6px 6px 0 0 !important;' +
+    '}' +
+    '.webild-element-type-label.label-bottom {' +
+    '  border-radius: 0 0 6px 6px !important;' +
+    '}' +
+    '.webild-hover-overlay {' +
+    '  position: fixed !important;' +
+    '  background-color: #4d96ff15 !important;' +
+    '  pointer-events: none !important;' +
+    '  z-index: 999998 !important;' +
+    '  transition: all 0.15s ease !important;' +
+    '}';
+  document.head.appendChild(style);
+  
+  const getUniqueSelector = (element, assignId = false) => {
+    if (element.dataset && element.dataset.webildSelector) {
+      return element.dataset.webildSelector;
+    }
+    
+    const existingId = element.getAttribute('data-webild-id');
+    if (existingId) {
+      return '[data-webild-id="' + existingId + '"]';
+    }
+    
+    if (assignId) {
+      const uniqueId = 'webild-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);
+      element.setAttribute('data-webild-id', uniqueId);
+      return '[data-webild-id="' + uniqueId + '"]';
+    }
+    
+    return null;
+  };
+  
+  const getSectionId = (element) => {
+    let current = element;
+    while (current && current !== document.body) {
+      const sectionId = current.getAttribute('data-section');
+      if (sectionId) {
+        return sectionId;
+      }
+      current = current.parentElement;
+    }
+    return 'hero';
+  };
+  
+  const getElementType = (element) => {
+  const tagName = element.tagName.toLowerCase();
+  const computedStyle = window.getComputedStyle(element);
+
+  if (tagName === 'img') {
+    return 'Image';
+  }
+
+  if (tagName === 'video') {
+    return 'Video';
+  }
+
+  const backgroundImage = computedStyle.backgroundImage;
+  if (backgroundImage && backgroundImage !== 'none') {
+    const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/);
+    if (urlMatch && urlMatch[1] && !urlMatch[1].includes('gradient')) {
+      const area = element.offsetWidth * element.offsetHeight;
+      const hasReasonableSize = area > 1000;
+      const hasFewChildren = element.children.length <= 2;
+      
+      if (hasReasonableSize && hasFewChildren) {
+        return 'Image';
+      }
+    }
+  }
+
+    if (tagName === 'button') return 'Button';
+    if (tagName === 'a' && element.getAttribute('href')) return 'Button';
+    if (element.getAttribute('role') === 'button') return 'Button';
+
+    const buttonClasses = ['btn', 'button', 'cta', 'action-button'];
+    const hasButtonClass = buttonClasses.some(cls =>
+      element.classList.contains(cls) || element.classList.contains(\`btn-\${cls}\`)
+    );
+
+    if (hasButtonClass && element.textContent && element.textContent.trim().length > 0) {
+      return 'Button';
+    }
+
+    const textTags = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'span', 'label', 'li'];
+    if (textTags.includes(tagName)) {
+      return 'Text';
+    }
+
+    if (tagName === 'div') {
+      const hasDirectText = Array.from(element.childNodes).some(node => 
+        node.nodeType === Node.TEXT_NODE && node.textContent && node.textContent.trim().length > 0
+      );
+      
+      if (hasDirectText && !element.querySelector('div, section, article, main, header, footer')) {
+        return 'Text';
+      }
+      
+      return 'Div';
+    }
+
+    if (tagName === 'article') {
+      return 'Article';
+    }
+
+    if (tagName === 'a' && !element.getAttribute('href')) {
+      return 'Text';
+    }
+
+    return 'Section';
+  };
+
+  const extractOriginalUrl = (url) => {
+    if (!url) return url;
+
+    if (url.includes('/_next/')) {
+      try {
+        const urlObj = new URL(url);
+        const originalPath = urlObj.searchParams.get('url');
+        if (originalPath) {
+          return originalPath;
+        }
+      } catch (e) {
+        return url;
+      }
+    }
+    
+    if (url.includes('.webild.io/')) {
+      try {
+        const urlObj = new URL(url);
+        return urlObj.pathname;
+      } catch (e) {
+        return url;
+      }
+    }
+
+    return url;
+  };
+
+  const getMediaTypeFromUrl = (url) => {
+    const videoExts = ['.mp4', '.webm', '.ogg', '.mov', '.avi', '.mkv', '.m4v', '.wmv'];
+    const imageExts = ['.jpg', '.jpeg', '.png', '.gif', '.webp', '.svg', '.bmp', '.ico', '.tiff', '.avif'];
+    try {
+      const pathname = new URL(url).pathname.toLowerCase();
+      if (videoExts.some(function(ext) { return pathname.endsWith(ext); })) return 'video';
+      if (imageExts.some(function(ext) { return pathname.endsWith(ext); })) return 'image';
+    } catch(e) {}
+    return 'unknown';
+  };
+
+  const swapMediaElement = (oldEl, newTag, newSrc) => {
+    const newEl = document.createElement(newTag);
+    Array.from(oldEl.attributes).forEach(function(attr) {
+      if (attr.name !== 'src' && attr.name !== 'alt' && attr.name !== 'srcset' && attr.name !== 'autoplay' && attr.name !== 'loop' && attr.name !== 'muted' && attr.name !== 'playsinline') {
+        try { newEl.setAttribute(attr.name, attr.value); } catch(e) {}
+      }
+    });
+    newEl.style.cssText = oldEl.style.cssText;
+    if (newTag === 'video') {
+      newEl.setAttribute('autoplay', '');
+      newEl.setAttribute('loop', '');
+      newEl.setAttribute('muted', '');
+      newEl.setAttribute('playsinline', '');
+    }
+    newEl.src = newSrc;
+    if (oldEl.parentNode) {
+      oldEl.parentNode.replaceChild(newEl, oldEl);
+    }
+    return newEl;
+  };
+
+  const getElementInfo = (element, assignId = false) => {
+    const rect = element.getBoundingClientRect();
+    const tagName = element.tagName.toLowerCase();
+    const selector = getUniqueSelector(element, assignId);
+    const sectionId = getSectionId(element);
+    
+    let className = undefined;
+    try {
+      if (element.className) {
+        if (typeof element.className === 'string') {
+          className = element.className;
+        } else if (element.className.baseVal !== undefined) {
+          className = element.className.baseVal;
+        }
+      }
+    } catch (e) {}
+    
+    const info = {
+      tagName: tagName,
+      id: element.id || undefined,
+      className: className,
+      selector: selector,
+      elementType: null,
+      sectionId: sectionId,
+      boundingBox: {
+        x: rect.left,
+        y: rect.top,
+        width: rect.width,
+        height: rect.height
+      }
+    };
+    
+    if (tagName === 'img') {
+      const originalSrc = extractOriginalUrl(element.src);
+      info.imageData = {
+        src: originalSrc,
+        alt: element.alt || undefined,
+        naturalWidth: element.naturalWidth,
+        naturalHeight: element.naturalHeight,
+        isBackground: false
+      };
+    }
+
+    if (tagName === 'video') {
+      const rawSrc = element.src || element.currentSrc || (element.querySelector('source') && element.querySelector('source').src) || '';
+      const resolvedSrc = extractOriginalUrl(rawSrc);
+      info.imageData = {
+        src: resolvedSrc,
+        alt: element.getAttribute('aria-label') || undefined,
+        isBackground: false,
+        isVideo: true
+      };
+    }
+
+    const computedStyle = window.getComputedStyle(element);
+    const backgroundImage = computedStyle.backgroundImage;
+    if (backgroundImage && backgroundImage !== 'none') {
+      const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/);
+      if (urlMatch) {
+        const originalBgSrc = extractOriginalUrl(urlMatch[1]);
+        if (tagName !== 'img') {
+          info.imageData = {
+            src: originalBgSrc,
+            isBackground: true
+          };
+        } else {
+          if (!info.imageData) info.imageData = {};
+          info.imageData.backgroundImageSrc = originalBgSrc;
+        }
+      }
+    }
+    
+    const elementType = getElementType(element);
+    info.elementType = elementType;
+    
+    if (elementType === 'Button') {
+      const buttonText = element.textContent?.trim() || element.value || element.getAttribute('aria-label') || '';
+      const buttonHref = element.getAttribute('href') ||
+                        element.getAttribute('data-href') ||
+                        element.getAttribute('onclick') ||
+                        element.dataset?.link ||
+                        undefined;
+
+      info.buttonData = {
+        text: buttonText,
+        href: buttonHref
+      };
+    }
+
+    if (elementType === 'Text') {
+      info.textContent = element.textContent || '';
+    }
+    
+    return info;
+  };
+  
+  const isValidElement = (element) => {
+    if (!isActive) return false;
+    const tagName = element.tagName?.toLowerCase();
+    if (invalidElements.includes(tagName)) return false;
+    const isImage = tagName === 'img';
+    const isVideo = tagName === 'video';
+    if (isImage || isVideo) return true;
+    const hasInnerHTML = element.innerHTML && element.innerHTML.trim().length > 0;
+    const hasTextContent = element.textContent && element.textContent.trim().length > 0;
+    const hasChildren = element.children && element.children.length > 0;
+    if (!hasInnerHTML && !hasTextContent && !hasChildren) {
+      return false;
+    }
+    const hasBackgroundImage = window.getComputedStyle(element).backgroundImage !== 'none';
+    if (hasBackgroundImage && !hasChildren && !hasTextContent) {
+      return false;
+    }
+    
+    return true;
+  };
+
+  const getMostSpecificElement = (x, y) => {
+    const elements = document.elementsFromPoint(x, y);
+    const validElements = elements.filter(el =>
+      isValidElement(el) &&
+      !el.classList.contains('webild-hover-overlay') &&
+      !el.classList.contains('webild-element-type-label')
+    );
+
+    if (validElements.length === 0) return null;
+    const scoredElements = validElements.map(element => {
+      let score = 0;
+      const rect = element.getBoundingClientRect();
+      const tagName = element.tagName.toLowerCase();
+      const computedStyle = window.getComputedStyle(element);
+      let depth = 0;
+      let current = element;
+      while (current && current !== document.body) {
+        depth++;
+        current = current.parentElement;
+      }
+      score += depth * 2;
+      const hasDirectText = Array.from(element.childNodes).some(node => 
+        node.nodeType === Node.TEXT_NODE && node.textContent && node.textContent.trim().length > 0
+      );
+
+      const hasImages = element.tagName === 'IMG' || element.tagName === 'VIDEO' || computedStyle.backgroundImage !== 'none' || element.querySelector('img') || element.querySelector('video');
+      const isInteractive = ['BUTTON', 'A', 'INPUT', 'SELECT', 'TEXTAREA'].includes(element.tagName);
+      const hasFewChildren = element.children.length <= 3;
+      const area = rect.width * rect.height;
+      const viewportArea = window.innerWidth * window.innerHeight;
+      const isSmallElement = area < viewportArea * 0.1;
+      if (hasDirectText) score += 20;
+      if (hasImages) score += 15;
+      if (isInteractive) score += 25;
+      if (hasFewChildren) score += 10;
+      if (isSmallElement) score += 5;
+      if (area > viewportArea * 0.3) score -= 30;
+      if (element.hasAttribute('data-section')) score -= 15;
+      if (['h1', 'h2', 'h3', 'h4', 'h5', 'h6'].includes(tagName)) score += 20;
+      if (['p', 'span', 'label'].includes(tagName)) score += 15;
+      if (tagName === 'div' && !hasDirectText && element.children.length > 2) score -= 10;
+
+      return { element, score };
+    });
+    scoredElements.sort((a, b) => b.score - a.score);
+    return scoredElements[0]?.element || validElements[0];
+  };
+
+  const isTextElement = (element) => {
+    const elementType = getElementType(element);
+    return elementType === 'Text';
+  };
+
+  const isButtonElement = (element) => {
+    const elementType = getElementType(element);
+    return elementType === 'Button';
+  };
+
+  const updateButtonText = (element, newText) => {
+    const textNodes = [];
+    const walker = document.createTreeWalker(
+      element,
+      NodeFilter.SHOW_TEXT,
+      null
+    );
+
+    let node;
+    while (node = walker.nextNode()) {
+      if (node.textContent && node.textContent.trim()) {
+        textNodes.push(node);
+      }
+    }
+
+    if (textNodes.length > 0) {
+      textNodes[0].textContent = newText;
+      for (let i = 1; i < textNodes.length; i++) {
+        textNodes[i].textContent = '';
+      }
+    } else {
+      element.textContent = newText;
+    }
+  };
+
+  const makeEditable = (element, clickEvent) => {
+    if (!isTextElement(element)) return;
+    
+    originalContent = element.textContent;
+    element.contentEditable = 'true';
+    
+    if (!element.dataset.webildOriginalWhiteSpace) {
+      const computedStyle = window.getComputedStyle(element);
+      element.dataset.webildOriginalWhiteSpace = computedStyle.whiteSpace;
+      element.dataset.webildOriginalWordWrap = computedStyle.wordWrap;
+      element.dataset.webildOriginalOverflowWrap = computedStyle.overflowWrap;
+      element.dataset.webildOriginalOverflow = computedStyle.overflow;
+    }
+    
+    element.style.whiteSpace = 'pre-wrap';
+    element.style.wordWrap = 'break-word';
+    element.style.overflowWrap = 'break-word';
+    element.style.overflow = 'visible';
+    
+    element.focus();
+    isEditing = true;
+    
+    window.parent.postMessage({
+      type: 'webild-text-editing-started',
+      data: { selector: getElementInfo(element).selector }
+    }, '*');
+    
+    const handleBeforeInput = (e) => {
+      // Prevent deletion if it would leave the element empty
+      const currentText = element.textContent || '';
+      const inputType = e.inputType;
+      
+      // Check if this is a delete operation that would leave the element empty
+      if ((inputType === 'deleteContentBackward' || inputType === 'deleteContentForward' || inputType === 'deleteByCut') && currentText.length <= 1) {
+        e.preventDefault();
+        element.textContent = ' ';
+        // Move cursor to the beginning
+        const range = document.createRange();
+        const sel = window.getSelection();
+        range.setStart(element.firstChild || element, 0);
+        range.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(range);
+      }
+    };
+    
+    const handleInput = () => {
+      const elementInfo = getElementInfo(element);
+      let currentText = element.textContent;
+      
+      // Ensure there's always at least a space to keep the element editable
+      if (currentText === '' || currentText === null || currentText.length === 0) {
+        element.textContent = ' ';
+        currentText = ' ';
+        // Move cursor to the beginning
+        try {
+          const range = document.createRange();
+          const sel = window.getSelection();
+          range.setStart(element.firstChild || element, 0);
+          range.collapse(true);
+          sel.removeAllRanges();
+          sel.addRange(range);
+        } catch (e) {
+          // Ignore cursor positioning errors
+        }
+      }
+
+      window.parent.postMessage({
+        type: 'webild-element-changed',
+        data: {
+          type: 'updateText',
+          selector: elementInfo.selector,
+          oldValue: originalContent,
+          newValue: currentText,
+          elementType: elementInfo.elementType,
+          sectionId: elementInfo.sectionId,
+          timestamp: Date.now()
+        }
+      }, '*');
+      
+      if (currentText !== originalContent) {
+        window.parent.postMessage({
+          type: 'webild-text-changed',
+          data: { 
+            selector: elementInfo.selector,
+            hasChanges: true
+          }
+        }, '*');
+      }
+    };
+    
+    element.addEventListener('beforeinput', handleBeforeInput);
+    element.addEventListener('input', handleInput);
+    element.dataset.inputHandler = 'true';
+    element.dataset.beforeInputHandler = 'true';
+    
+    if (clickEvent && element.childNodes.length > 0) {
+      try {
+        let range = null;
+        
+        if (document.caretRangeFromPoint) {
+          range = document.caretRangeFromPoint(clickEvent.clientX, clickEvent.clientY);
+        } else if (document.caretPositionFromPoint) {
+          const position = document.caretPositionFromPoint(clickEvent.clientX, clickEvent.clientY);
+          if (position) {
+            range = document.createRange();
+            range.setStart(position.offsetNode, position.offset);
+            range.collapse(true);
+          }
+        }
+        
+        if (range) {
+          const selection = window.getSelection();
+          selection.removeAllRanges();
+          selection.addRange(range);
+        }
+      } catch (e) {
+        console.warn('[Webild] Could not set caret position:', e);
+      }
+    }
+  };
+  
+  const makeUneditable = (element, save = false) => {
+    if (!element || element.contentEditable !== 'true') return;
+    
+    element.contentEditable = 'false';
+    isEditing = false;
+    
+    if (element.dataset.webildOriginalWhiteSpace) {
+      element.style.whiteSpace = element.dataset.webildOriginalWhiteSpace === 'normal' ? '' : element.dataset.webildOriginalWhiteSpace;
+      delete element.dataset.webildOriginalWhiteSpace;
+    }
+    if (element.dataset.webildOriginalWordWrap) {
+      element.style.wordWrap = element.dataset.webildOriginalWordWrap === 'normal' ? '' : element.dataset.webildOriginalWordWrap;
+      delete element.dataset.webildOriginalWordWrap;
+    }
+    if (element.dataset.webildOriginalOverflowWrap) {
+      element.style.overflowWrap = element.dataset.webildOriginalOverflowWrap === 'normal' ? '' : element.dataset.webildOriginalOverflowWrap;
+      delete element.dataset.webildOriginalOverflowWrap;
+    }
+    if (element.dataset.webildOriginalOverflow) {
+      element.style.overflow = element.dataset.webildOriginalOverflow === 'visible' ? '' : element.dataset.webildOriginalOverflow;
+      delete element.dataset.webildOriginalOverflow;
+    }
+    
+    if (element.dataset.beforeInputHandler === 'true') {
+      element.removeEventListener('beforeinput', () => {});
+      delete element.dataset.beforeInputHandler;
+    }
+    
+    if (element.dataset.inputHandler === 'true') {
+      element.removeEventListener('input', () => {});
+      delete element.dataset.inputHandler;
+    }
+    
+    window.parent.postMessage({
+      type: 'webild-text-editing-ended',
+      data: { selector: getElementInfo(element).selector }
+    }, '*');
+    
+    if (save && originalContent !== element.textContent) {
+      const elementInfo = getElementInfo(element);
+      let finalText = element.textContent;
+      
+      // Trim the final text and convert space-only to empty string for saving
+      if (finalText === ' ' || finalText.trim() === '') {
+        finalText = '';
+        // Update the actual element text to empty for display
+        element.textContent = '';
+      }
+      
+      const change = {
+        type: 'updateText',
+        selector: elementInfo.selector,
+        oldValue: originalContent,
+        newValue: finalText,
+        elementType: elementInfo.elementType,
+        sectionId: elementInfo.sectionId,
+        timestamp: Date.now()
+      };
+
+      saveChangeToStorage(change);
+
+      window.parent.postMessage({
+        type: 'webild-element-changed',
+        data: change
+      }, '*');
+    } else if (!save && originalContent !== null) {
+      element.textContent = originalContent;
+    }
+    
+    originalContent = null;
+  };
+  
+  const createHoverOverlay = (element) => {
+    const rect = element.getBoundingClientRect();
+    const overlay = document.createElement('div');
+    overlay.className = 'webild-hover-overlay';
+    overlay.style.cssText = \`
+      position: fixed !important;
+      top: \${rect.top - 2}px !important;
+      left: \${rect.left - 2}px !important;
+      width: \${rect.width + 4}px !important;
+      height: \${rect.height + 4}px !important;
+      background-color: rgba(90, 113, 230, 0.15) !important;
+      pointer-events: none !important;
+      z-index: 999998 !important;
+      transition: all 0.15s ease !important;
+    \`;
+    document.body.appendChild(overlay);
+    return overlay;
+  };
+  
+  const removeHoverOverlay = () => {
+    if (hoverOverlay) {
+      hoverOverlay.remove();
+      hoverOverlay = null;
+    }
+  };
+  
+  const showElementTypeLabel = (element, elementType) => {
+    if (!elementType) return;
+
+    removeElementTypeLabel();
+
+    const rect = element.getBoundingClientRect();
+    elementTypeLabel = document.createElement('div');
+    elementTypeLabel.className = 'webild-element-type-label';
+    const ariaLabel = element.getAttribute('aria-label');
+    let labelText;
+    
+    if (elementType === 'Div') {
+      labelText = 'Div';
+    } else if (elementType === 'Article') {
+      labelText = 'Article';
+    } else if (elementType === 'Section') {
+      labelText = ariaLabel || 'Section';
+    } else {
+      labelText = elementType;
+    }
+    
+    elementTypeLabel.textContent = labelText;
+    document.body.appendChild(elementTypeLabel);
+    const labelRect = elementTypeLabel.getBoundingClientRect();
+    let labelTop = rect.top - labelRect.height - 2;
+    let labelLeft = rect.left - 3;
+    let isLabelOnTop = true;
+    if (labelTop < 0) {
+      labelTop = rect.bottom + 1;
+      isLabelOnTop = false;
+    }
+    if (labelTop + labelRect.height > window.innerHeight) {
+      labelTop = rect.bottom - labelRect.height;
+      isLabelOnTop = false;
+      if (labelTop < 0) {
+        labelTop = rect.top;
+        isLabelOnTop = true;
+      }
+    }
+    if (labelLeft + labelRect.width > window.innerWidth) {
+      labelLeft = window.innerWidth - labelRect.width;
+    }
+    if (labelLeft < 0) {
+      labelLeft = 0;
+    }
+    if (isLabelOnTop) {
+      elementTypeLabel.classList.add('label-top');
+    } else {
+      elementTypeLabel.classList.add('label-bottom');
+    }
+
+    elementTypeLabel.style.cssText = \`
+      left: \${labelLeft}px !important;
+      top: \${labelTop}px !important;
+      transform: none !important;
+    \`;
+  };
+  
+  const removeElementTypeLabel = () => {
+    if (elementTypeLabel) {
+      elementTypeLabel.remove();
+      elementTypeLabel = null;
+    }
+  };
+  
+  const handleMouseOver = (e) => {
+    if (!isActive) return;
+
+    lastMouseX = e.clientX;
+    lastMouseY = e.clientY;
+
+    const target = getMostSpecificElement(e.clientX, e.clientY) || e.target;
+
+    if (!isValidElement(target) || target === hoveredElement || target === selectedElement) {
+      return;
+    }
+    
+    if (hoveredElement && hoveredElement !== selectedElement) {
+      hoveredElement.classList.remove(hoverClass);
+      if (hoveredElement.dataset.webildOriginalPosition) {
+        hoveredElement.style.position = hoveredElement.dataset.webildOriginalPosition === 'none' ? '' : hoveredElement.dataset.webildOriginalPosition;
+        delete hoveredElement.dataset.webildOriginalPosition;
+      }
+      removeHoverOverlay();
+      removeElementTypeLabel();
+    }
+    
+    hoveredElement = target;
+    
+    const computedStyle = window.getComputedStyle(target);
+    const currentPosition = computedStyle.position;
+    
+    if (currentPosition === 'static' || currentPosition === '') {
+      hoveredElement.dataset.webildOriginalPosition = currentPosition || 'none';
+      hoveredElement.style.position = 'relative';
+    }
+    
+    hoveredElement.classList.add(hoverClass);
+    
+    if ((!selectedElement || selectedElement !== target) && !isScrolling) {
+      hoverOverlay = createHoverOverlay(target);
+    }
+    
+    const elementType = getElementType(target);
+    showElementTypeLabel(target, elementType);
+    
+    window.parent.postMessage({
+      type: 'webild-element-hover',
+      data: getElementInfo(target, false)
+    }, '*');
+  };
+  
+  const handleMouseOut = (e) => {
+    if (!isActive) return;
+    
+    if (hoveredElement && hoveredElement !== selectedElement) {
+      hoveredElement.classList.remove(hoverClass);
+      
+      if (hoveredElement.dataset.webildOriginalPosition) {
+        hoveredElement.style.position = hoveredElement.dataset.webildOriginalPosition === 'none' ? '' : hoveredElement.dataset.webildOriginalPosition;
+        delete hoveredElement.dataset.webildOriginalPosition;
+      }
+      
+      removeHoverOverlay();
+      removeElementTypeLabel();
+      
+      hoveredElement = null;
+      
+      window.parent.postMessage({
+        type: 'webild-element-hover',
+        data: null
+      }, '*');
+    }
+  };
+  
+  const handleClick = (e) => {
+  if (!isActive) return;
+
+  if (isEditing) {
+    e.stopPropagation();
+    return;
+  }
+
+  e.preventDefault();
+  e.stopPropagation();
+
+  const target = getMostSpecificElement(e.clientX, e.clientY) || e.target;  
+  if (!isValidElement(target)) return;
+    
+    if (selectedElement && selectedElement !== target) {
+      makeUneditable(selectedElement, false);
+      selectedElement.classList.remove(selectedClass);
+      selectedElement.classList.remove(hoverClass);
+      
+      if (selectedElement.dataset.webildOriginalPosition) {
+        selectedElement.style.position = selectedElement.dataset.webildOriginalPosition === 'none' ? '' : selectedElement.dataset.webildOriginalPosition;
+        delete selectedElement.dataset.webildOriginalPosition;
+      }
+      
+      removeHoverOverlay();
+      removeElementTypeLabel();
+    }
+    
+    if (selectedElement === target) {
+      if (target.dataset.webildOriginalPosition) {
+        target.style.position = target.dataset.webildOriginalPosition === 'none' ? '' : target.dataset.webildOriginalPosition;
+        delete target.dataset.webildOriginalPosition;
+      }
+      
+      removeHoverOverlay();
+      removeElementTypeLabel();
+      
+      selectedElement = null;
+      window.parent.postMessage({
+        type: 'webild-element-selected',
+        data: null
+      }, '*');
+      return;
+    }
+    
+    selectedElement = target;
+    selectedElement.classList.add(selectedClass);
+    
+    removeHoverOverlay();
+    removeElementTypeLabel();
+    
+    if (hoveredElement === target) {
+      hoveredElement.classList.remove(hoverClass);
+      hoveredElement = null;
+    }
+    
+    const elementInfo = getElementInfo(target, true);
+    selectedElement.dataset.webildSelector = elementInfo.selector;
+    showElementTypeLabel(target, elementInfo.elementType);
+    
+    window.parent.postMessage({
+      type: 'webild-element-selected',
+      data: elementInfo
+    }, '*');
+    
+    if (isTextElement(target)) {
+      setTimeout(() => makeEditable(target, e), 50);
+    }
+  };
+  
+  const handleKeyDown = (e) => {
+    if (!isActive) return;
+    if (!isEditing || !selectedElement) return;
+    
+    if (e.key === 'Enter' && !e.shiftKey) {
+      e.preventDefault();
+      makeUneditable(selectedElement, true);
+    } else if (e.key === 'Escape') {
+      e.preventDefault();
+      makeUneditable(selectedElement, false);
+    }
+  };
+  
+  const handleBlur = (e) => {
+    if (!isActive) return;
+    if (isEditing && selectedElement && e.target === selectedElement) {
+      makeUneditable(selectedElement, true);
+    }
+  };
+  
+  let lastMouseX = 0;
+  let lastMouseY = 0;
+
+  const handleScroll = () => {
+    if (!isActive) return;
+    
+    if (isEditing) return;
+    
+    if (selectedElement) {
+      makeUneditable(selectedElement, false);
+      selectedElement.classList.remove(selectedClass);
+      if (selectedElement.dataset.webildOriginalPosition) {
+        selectedElement.style.position = selectedElement.dataset.webildOriginalPosition === 'none' ? '' : selectedElement.dataset.webildOriginalPosition;
+        delete selectedElement.dataset.webildOriginalPosition;
+      }
+      selectedElement = null;
+
+      window.parent.postMessage({
+        type: 'webild-element-selected',
+        data: null
+      }, '*');
+    }
+
+    if (hoveredElement) {
+      hoveredElement.classList.remove(hoverClass);
+      if (hoveredElement.dataset.webildOriginalPosition) {
+        hoveredElement.style.position = hoveredElement.dataset.webildOriginalPosition === 'none' ? '' : hoveredElement.dataset.webildOriginalPosition;
+        delete hoveredElement.dataset.webildOriginalPosition;
+      }
+      hoveredElement = null;
+
+      window.parent.postMessage({
+        type: 'webild-element-hover',
+        data: null
+      }, '*');
+    }
+
+    removeHoverOverlay();
+    removeElementTypeLabel();
+
+    isScrolling = true;
+
+    if (scrollTimeout) {
+      clearTimeout(scrollTimeout);
+    }
+
+    scrollTimeout = setTimeout(() => {
+      isScrolling = false;
+
+      if (lastMouseX > 0 && lastMouseY > 0) {
+        const target = getMostSpecificElement(lastMouseX, lastMouseY);
+        if (target && isValidElement(target) && target !== selectedElement) {
+          hoveredElement = target;
+
+          const computedStyle = window.getComputedStyle(target);
+          const currentPosition = computedStyle.position;
+
+          if (currentPosition === 'static' || currentPosition === '') {
+            hoveredElement.dataset.webildOriginalPosition = currentPosition || 'none';
+            hoveredElement.style.position = 'relative';
+          }
+
+          hoveredElement.classList.add(hoverClass);
+          hoverOverlay = createHoverOverlay(target);
+
+          const elementType = getElementType(target);
+          showElementTypeLabel(target, elementType);
+
+          window.parent.postMessage({
+            type: 'webild-element-hover',
+            data: getElementInfo(target, false)
+          }, '*');
+        }
+      }
+    }, 150);
+
+    window.parent.postMessage({
+      type: 'webild-iframe-scroll'
+    }, '*');
+  };
+  
+  const getStorageKey = () => {
+    const url = new URL(window.location.href);
+    const pathParts = url.pathname.split('/').filter(Boolean);
+    return \`webild-changes-\${pathParts.join('-')}\`;
+  };
+
+  const saveChangeToStorage = (change) => {
+    try {
+      const storageKey = getStorageKey();
+      const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]');
+
+      const filteredChanges = existingChanges.filter(c => {
+        return !(c.oldValue === change.oldValue && c.sectionId === change.sectionId);
+      });
+      filteredChanges.push(change);
+
+      localStorage.setItem(storageKey, JSON.stringify(filteredChanges));
+
+      window.parent.postMessage({
+        type: 'webild-change-saved-locally',
+        data: { change, allChanges: filteredChanges }
+      }, '*');
+    } catch (error) {
+      console.error('Failed to save change to localStorage:', error);
+    }
+  };
+
+  const clearLocalChanges = () => {
+    try {
+      const storageKey = getStorageKey();
+      localStorage.removeItem(storageKey);
+      window.parent.postMessage({
+        type: 'webild-local-changes-cleared',
+        data: {}
+      }, '*');
+    } catch (error) {
+      console.error('Failed to clear local changes:', error);
+    }
+  };
+
+  const handleMessage = (e) => {
+    if (!e.data || !e.data.type) return;
+
+    if (e.data.type === 'webild-activate-editor') {
+      if (!isActive) {
+        isActive = true;
+        window.parent.postMessage({ type: 'webild-editor-activated' }, '*');
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-deactivate-editor') {
+      if (isActive) {
+        isActive = false;
+
+        if (selectedElement) {
+          makeUneditable(selectedElement, false);
+          selectedElement.classList.remove(selectedClass);
+          selectedElement = null;
+        }
+        if (hoveredElement) {
+          hoveredElement.classList.remove(hoverClass);
+          hoveredElement = null;
+        }
+
+        removeHoverOverlay();
+        removeElementTypeLabel();
+        window.parent.postMessage({ type: 'webild-editor-deactivated' }, '*');
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-clear-local-changes') {
+      clearLocalChanges();
+      return;
+    }
+
+    if (e.data.type === 'webild-cancel-changes') {
+      try {
+        const storageKey = getStorageKey();
+        const savedChanges = localStorage.getItem(storageKey);
+        if (savedChanges) {
+          const changes = JSON.parse(savedChanges);
+          changes.forEach(change => {
+            try {
+              const element = document.querySelector(change.selector);
+              if (!element) return;
+
+              if (change.type === 'updateText') {
+                if (isTextElement(element)) {
+                  element.textContent = change.oldValue;
+                }
+              } else if (change.type === 'updateButton') {
+                if (isButtonElement(element)) {
+                  updateButtonText(element, change.oldValue);
+                }
+              } else if (change.type === 'replaceImage') {
+                const revertTag = element.tagName.toLowerCase();
+                const isBackground = revertTag !== 'img' && revertTag !== 'video';
+                if (isBackground) {
+                  element.style.backgroundImage = change.oldValue ? 'url(' + change.oldValue + ')' : '';
+                } else {
+                  const oldMediaType = getMediaTypeFromUrl(change.oldValue);
+                  if (revertTag === 'video' && oldMediaType === 'image') {
+                    swapMediaElement(element, 'img', change.oldValue);
+                  } else if (revertTag === 'img' && oldMediaType === 'video') {
+                    swapMediaElement(element, 'video', change.oldValue);
+                  } else if (revertTag === 'video') {
+                    element.src = change.oldValue;
+                    element.load();
+                  } else {
+                    element.src = change.oldValue;
+                  }
+                }
+              }
+            } catch (err) {
+              console.warn('[Webild] Failed to revert change:', err);
+            }
+          });
+        }
+        clearLocalChanges();
+      } catch (error) {
+        console.error('[Webild] Failed to cancel changes:', error);
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-update-text') {
+      const { selector, newValue, oldValue, sectionId } = e.data.data;
+      try {
+        let element = null;
+        
+        if (selectedElement && isTextElement(selectedElement)) {
+          element = selectedElement;
+        }
+        else if (selector) {
+          try {
+            element = document.querySelector(selector);
+          } catch (err) {
+            console.warn('[Webild] Invalid selector:', selector);
+          }
+        }
+        
+        if (!element && sectionId) {
+          const sectionElement = document.querySelector('[data-section="' + sectionId + '"]');
+          if (sectionElement) {
+            const textElements = sectionElement.querySelectorAll('h1, h2, h3, h4, h5, h6, p, span, a, button, div');
+            for (let i = 0; i < textElements.length; i++) {
+              const el = textElements[i];
+              if (isTextElement(el) && el.textContent.trim() === (oldValue || '').trim()) {
+                element = el;
+                const newSelector = getUniqueSelector(element, true);
+                if (newSelector) {
+                  element.dataset.webildSelector = newSelector;
+                }
+                break;
+              }
+            }
+          }
+        }
+        
+        if (element && isTextElement(element)) {
+          element.textContent = newValue;
+          const finalSelector = element.dataset.webildSelector || getUniqueSelector(element, true);
+          
+          window.parent.postMessage({
+            type: 'webild-text-update-success',
+            data: {
+              selector: finalSelector,
+              newValue: newValue
+            }
+          }, '*');
+        } else {
+          window.parent.postMessage({
+            type: 'webild-text-update-failed',
+            data: { selector, newValue }
+          }, '*');
+        }
+      } catch (error) {
+        window.parent.postMessage({
+          type: 'webild-text-update-failed',
+          data: { selector, newValue, error: error.message }
+        }, '*');
+      }
+      return;
+    }
+
+    if (e.data.type === 'webild-update-button') {
+      const { selector, text, href } = e.data.data;
+      try {
+        const element = document.querySelector(selector);
+        if (element && isButtonElement(element)) {
+          if (text !== undefined) {
+            updateButtonText(element, text);
+          }
+          if (href !== undefined) {
+            if (element.tagName.toLowerCase() === 'a') {
+              element.href = href;
+            } else {
+              element.setAttribute('data-href', href);
+            }
+          }
+        }
+      } catch (error) {
+        console.error('[Webild] Invalid selector for button update:', selector, error);
+      }
+      return;
+    }
+
+    if (!isActive) return;
+
+    if (e.data.type === 'webild-replace-image') {
+      const { selector, newSrc, isBackground, allowMediaTypeSwap } = e.data.data;
+      let element = null;
+
+      try {
+        element = document.querySelector(selector);
+      } catch {
+        window.parent.postMessage({
+          type: 'webild-image-replacement-error',
+          data: { selector, message: 'Invalid selector: ' + error.message, success: false }
+        }, '*');
+        return;
+      }
+
+      if (!element) {
+        window.parent.postMessage({
+          type: 'webild-image-replacement-error',
+          data: { selector, message: 'Element not found', success: false }
+        }, '*');
+        return;
+      }
+
+      try {
+        let replaced = false;
+        let oldValue = '';
+
+        if (isBackground) {
+          oldValue = window.getComputedStyle(element).backgroundImage;
+          element.style.backgroundImage = \`url('\${newSrc}')\`;
+          replaced = true;
+        } else if (element.tagName.toLowerCase() === 'img') {
+          oldValue = element.src;
+          const newMediaType = getMediaTypeFromUrl(newSrc);
+          if (newMediaType === 'video' && allowMediaTypeSwap) {
+            const swapped = swapMediaElement(element, 'video', newSrc);
+            if (selectedElement === element) selectedElement = swapped;
+            element = swapped;
+          } else {
+            element.src = newSrc;
+          }
+          replaced = true;
+        } else if (element.tagName.toLowerCase() === 'video') {
+          oldValue = element.src || element.currentSrc || '';
+          const newMediaType = getMediaTypeFromUrl(newSrc);
+          const sources = element.querySelectorAll('source');
+          if (newMediaType === 'image' && allowMediaTypeSwap) {
+            const swapped = swapMediaElement(element, 'img', newSrc);
+            if (selectedElement === element) selectedElement = swapped;
+            element = swapped;
+          } else {
+            if (sources.length > 0) {
+              sources.forEach(function(source) { source.src = newSrc; });
+              element.load();
+            } else {
+              element.src = newSrc;
+              element.load();
+            }
+          }
+          replaced = true;
+        } else {
+          const hasBackgroundImage = window.getComputedStyle(element).backgroundImage !== 'none';
+          if (hasBackgroundImage) {
+            oldValue = window.getComputedStyle(element).backgroundImage;
+            element.style.backgroundImage = \`url('\${newSrc}')\`;
+            replaced = true;
+          }
+        }
+
+        if (replaced) {
+          const elementInfo = getElementInfo(element);
+
+          let cleanOldValue = oldValue;
+          if (oldValue.includes('url(')) {
+            const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/);
+            if (urlMatch) {
+              cleanOldValue = urlMatch[1];
+            }
+          }
+
+          cleanOldValue = extractOriginalUrl(cleanOldValue);
+
+          const change = {
+            type: 'replaceImage',
+            selector: selector,
+            oldValue: cleanOldValue,
+            newValue: newSrc,
+            elementType: elementInfo.elementType,
+            sectionId: elementInfo.sectionId,
+            timestamp: Date.now()
+          };
+
+          saveChangeToStorage(change);
+
+          window.parent.postMessage({
+            type: 'webild-element-changed',
+            data: change
+          }, '*');
+
+          window.parent.postMessage({
+            type: 'webild-image-replaced',
+            data: { selector, newSrc, success: true }
+          }, '*');
+        } else {
+          window.parent.postMessage({
+            type: 'webild-image-replacement-error',
+            data: { selector, message: 'Could not determine how to replace image', success: false }
+          }, '*');
+        }
+      } catch (error) {
+        window.parent.postMessage({
+          type: 'webild-image-replacement-error',
+          data: { selector, message: error.message || 'Failed to replace image', success: false }
+        }, '*');
+      }
+    }
+  };
+  
+  document.addEventListener('mouseover', handleMouseOver, true);
+  document.addEventListener('mouseout', handleMouseOut, true);
+  document.addEventListener('click', handleClick, true);
+  document.addEventListener('keydown', handleKeyDown, true);
+  document.addEventListener('blur', handleBlur, true);
+  window.addEventListener('scroll', handleScroll, true);
+  window.addEventListener('message', handleMessage, true);
+  
+  let lastPathname = window.location.pathname;
+  
+  const notifyPageChange = () => {
+    window.parent.postMessage({
+      type: 'webild-page-changed',
+      data: { pathname: window.location.pathname }
+    }, '*');
+  };
+  
+  window.addEventListener('popstate', () => {
+    if (lastPathname !== window.location.pathname) {
+      lastPathname = window.location.pathname;
+      notifyPageChange();
+    }
+  }, true);
+  
+  const urlCheckInterval = setInterval(() => {
+    if (lastPathname !== window.location.pathname) {
+      lastPathname = window.location.pathname;
+      notifyPageChange();
+    }
+  }, 500);
+  
+  notifyPageChange();
+  
+  window.webildCleanup = () => {
+    isActive = false;
+    
+    if (selectedElement) {
+      makeUneditable(selectedElement, false);
+    }
+    
+    removeHoverOverlay();
+    removeElementTypeLabel();
+    
+    if (urlCheckInterval) {
+      clearInterval(urlCheckInterval);
+    }
+    
+    document.removeEventListener('mouseover', handleMouseOver, true);
+    document.removeEventListener('mouseout', handleMouseOut, true);
+    document.removeEventListener('click', handleClick, true);
+    document.removeEventListener('keydown', handleKeyDown, true);
+    document.removeEventListener('blur', handleBlur, true);
+    window.removeEventListener('scroll', handleScroll, true);
+    window.removeEventListener('message', handleMessage, true);
+    
+    document.querySelectorAll('.' + hoverClass).forEach(el => {
+      el.classList.remove(hoverClass);
+    });
+    document.querySelectorAll('.' + selectedClass).forEach(el => {
+      el.classList.remove(selectedClass);
+    });
+    
+    const styleEl = document.getElementById('webild-inspector-styles');
+    if (styleEl) styleEl.remove();
+    
+    hoveredElement = null;
+    selectedElement = null;
+  };
+  
+  window.parent.postMessage({ type: 'webild-editor-ready' }, '*');
+})();
 `
           }}
         />

From 8085b4fdc545ff907d1f1eef983057f528d0dca3 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 20:23:41 +0000
Subject: [PATCH 5/6] Update src/app/menu/page.tsx

---
 src/app/menu/page.tsx | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/app/menu/page.tsx b/src/app/menu/page.tsx
index 1a783c8..cf92500 100644
--- a/src/app/menu/page.tsx
+++ b/src/app/menu/page.tsx
@@ -60,7 +60,7 @@ export default function MenuPage() {
               id: "conchas",
               name: "Mexican Conchas",
               price: "$3.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg?_wi=3",
               imageAlt: "Colorful Mexican concha pastries",
               initialQuantity: 1,
             },
@@ -68,7 +68,7 @@ export default function MenuPage() {
               id: "empanadas",
               name: "Empanadas",
               price: "$4.49",
-              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg?_wi=2",
               imageAlt: "Golden baked empanadas",
               initialQuantity: 1,
             },
@@ -76,7 +76,7 @@ export default function MenuPage() {
               id: "cream-buns",
               name: "Cream Cheese Buns",
               price: "$2.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/event-wedding-buffet-snack-meat_1203-5102.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/event-wedding-buffet-snack-meat_1203-5102.jpg?_wi=2",
               imageAlt: "Fresh cream cheese buns",
               initialQuantity: 1,
             },
@@ -99,21 +99,21 @@ export default function MenuPage() {
               id: 1,
               title: "Tres Leches Cake",
               description: "Our signature three-milk cake, moist and delicious. Perfect for celebrations and special occasions.",
-              imageSrc: "http://img.b2bpic.net/free-photo/sweet-cake-with-basket-roses-marble-surface_114579-21578.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/sweet-cake-with-basket-roses-marble-surface_114579-21578.jpg?_wi=1",
               imageAlt: "Tres leches cake decorated with fruit",
             },
             {
               id: 2,
               title: "Custom Celebration Cakes",
               description: "Beautiful custom cakes for birthdays, weddings, and special events. Order in advance for your perfect cake.",
-              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg?_wi=4",
               imageAlt: "Celebration cake display",
             },
             {
               id: 3,
               title: "Seasonal Specials",
               description: "Rotating seasonal items featuring fresh ingredients and limited-time flavors. Ask our staff what's new today!",
-              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg?_wi=3",
               imageAlt: "Seasonal pastry selection",
             },
           ]}
@@ -136,21 +136,21 @@ export default function MenuPage() {
               id: "visit-now",
               name: "Visit Us Today",
               price: "Find Us",
-              imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-portrait-person-managing-owning-their-business_23-2151456949.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-portrait-person-managing-owning-their-business_23-2151456949.jpg?_wi=2",
               imageAlt: "Welcoming bakery experience",
             },
             {
               id: "call-order",
               name: "Call to Order",
               price: "Contact",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girls-buys-buns-bakery_1157-24661.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girls-buys-buns-bakery_1157-24661.jpg?_wi=2",
               imageAlt: "Customer service at bakery",
             },
             {
               id: "corporate",
               name: "Corporate Orders",
               price: "Catering",
-              imageSrc: "http://img.b2bpic.net/free-photo/mid-aged-couple-love-home_23-2147986283.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/mid-aged-couple-love-home_23-2147986283.jpg?_wi=2",
               imageAlt: "Corporate event catering",
             },
           ]}

From 5376ba3461b9b0a11e993576f433212cb77de033 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 9 Mar 2026 20:23:41 +0000
Subject: [PATCH 6/6] Update src/app/page.tsx

---
 src/app/page.tsx | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 61d0d24..13a4ec5 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -57,11 +57,11 @@ export default function HomePage() {
           }}
           mediaItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-portrait-person-managing-owning-their-business_23-2151456949.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-portrait-person-managing-owning-their-business_23-2151456949.jpg?_wi=1",
               imageAlt: "Customers grabbing trays and selecting pastries at International Bakery",
             },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg?_wi=1",
               imageAlt: "Colorful selection of fresh pastries and conchas",
             },
           ]}
@@ -97,21 +97,21 @@ export default function HomePage() {
               id: 1,
               title: "Grab a Tray",
               description: "Start your journey by selecting a tray and tongs from our welcoming entrance. Experience the freedom to explore at your own pace.",
-              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girls-buys-buns-bakery_1157-24661.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girls-buys-buns-bakery_1157-24661.jpg?_wi=1",
               imageAlt: "Customer grabbing a tray at the bakery entrance",
             },
             {
               id: 2,
               title: "Fill It With Your Favorites",
               description: "Browse our abundant selection of fresh pastries, Mexican breads, cookies, and seasonal treats. Every item baked fresh daily.",
-              imageSrc: "http://img.b2bpic.net/free-photo/mid-aged-couple-love-home_23-2147986283.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/mid-aged-couple-love-home_23-2147986283.jpg?_wi=1",
               imageAlt: "Customer filling tray with colorful pastries",
             },
             {
               id: 3,
               title: "Checkout & Enjoy",
               description: "Head to our friendly checkout counter. We weigh your tray, ring you up, and send you home with delicious memories.",
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-young-woman-standing-front-display-cabinet-showing-blank-slate_23-2148027989.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-young-woman-standing-front-display-cabinet-showing-blank-slate_23-2148027989.jpg?_wi=1",
               imageAlt: "Customer at checkout counter with filled pastry tray",
             },
           ]}
@@ -134,7 +134,7 @@ export default function HomePage() {
               id: "conchas",
               name: "Mexican Conchas",
               price: "$3.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/epiphany-day-dessert-with-paper-crown-tablecloth_23-2148740590.jpg?_wi=2",
               imageAlt: "Colorful Mexican concha pastries",
               initialQuantity: 1,
             },
@@ -142,7 +142,7 @@ export default function HomePage() {
               id: "empanadas",
               name: "Empanadas",
               price: "$4.49",
-              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-food-frame_23-2148708269.jpg?_wi=1",
               imageAlt: "Golden baked empanadas",
               initialQuantity: 1,
             },
@@ -150,7 +150,7 @@ export default function HomePage() {
               id: "cream-buns",
               name: "Cream Cheese Buns",
               price: "$2.99",
-              imageSrc: "http://img.b2bpic.net/free-photo/event-wedding-buffet-snack-meat_1203-5102.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/event-wedding-buffet-snack-meat_1203-5102.jpg?_wi=1",
               imageAlt: "Fresh cream cheese buns",
               initialQuantity: 1,
             },
@@ -169,37 +169,37 @@ export default function HomePage() {
             {
               id: "1",
               name: "Sarah Johnson",
-              imageSrc: "http://img.b2bpic.net/free-photo/confectioner-uniform-decorates-cake_1157-33465.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/confectioner-uniform-decorates-cake_1157-33465.jpg?_wi=1",
               imageAlt: "Sarah Johnson customer photo",
             },
             {
               id: "2",
               name: "Michael Chen",
-              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-bakery-shop-owner-taking-phone-order_23-2148028001.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/happy-young-bakery-shop-owner-taking-phone-order_23-2148028001.jpg?_wi=1",
               imageAlt: "Michael Chen customer photo",
             },
             {
               id: "3",
               name: "Emma Rodriguez",
-              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg?_wi=1",
               imageAlt: "Emma Rodriguez customer photo",
             },
             {
               id: "4",
               name: "David Kim",
-              imageSrc: "http://img.b2bpic.net/free-photo/queer-couple-celebrating-birthday-together_23-2149570899.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/queer-couple-celebrating-birthday-together_23-2149570899.jpg?_wi=1",
               imageAlt: "David Kim customer photo",
             },
             {
               id: "5",
               name: "Jessica Martinez",
-              imageSrc: "http://img.b2bpic.net/free-photo/shop-assistant-preparing-croissant-bag_23-2147985156.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/shop-assistant-preparing-croissant-bag_23-2147985156.jpg?_wi=1",
               imageAlt: "Jessica Martinez customer photo",
             },
             {
               id: "6",
               name: "Thomas Anderson",
-              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-showing-approval_23-2148334512.jpg",
+              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-showing-approval_23-2148334512.jpg?_wi=1",
               imageAlt: "Thomas Anderson customer photo",
             },
           ]}
@@ -261,7 +261,7 @@ export default function HomePage() {
             variant: "plain",
           }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg"
+          imageSrc="http://img.b2bpic.net/free-photo/woman-selecting-packed-food-food-counter_107420-63658.jpg?_wi=1"
           imageAlt="Warm interior of International Bakery with fresh pastries"
           mediaPosition="right"
           mediaAnimation="slide-up"