diff --git a/iframe.html b/iframe.html
index 07d9028..f4ff04a 100644
--- a/iframe.html
+++ b/iframe.html
@@ -621,6 +621,284 @@
                 color: #7fa464;
             }
         }
+
+        /* Modal Styles */
+        .dog-calculator-modal {
+            display: none;
+            position: fixed;
+            z-index: 10000;
+            left: 0;
+            top: 0;
+            width: 100%;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0.5);
+            animation: fadeIn 0.3s ease;
+        }
+
+        @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
+        }
+
+        .dog-calculator-modal-content {
+            position: relative;
+            background-color: #ffffff;
+            margin: 5% auto;
+            padding: 30px;
+            border: 1px solid #e8e3ed;
+            border-radius: 12px;
+            width: 90%;
+            max-width: 500px;
+            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
+            animation: slideIn 0.3s ease;
+        }
+
+        .dog-calculator-modal-embed {
+            max-width: 700px;
+        }
+
+        @keyframes slideIn {
+            from { 
+                opacity: 0;
+                transform: translateY(-20px);
+            }
+            to { 
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        .dog-calculator-modal-close {
+            position: absolute;
+            right: 20px;
+            top: 20px;
+            font-size: 28px;
+            font-weight: 300;
+            color: #6f3f6d;
+            cursor: pointer;
+            transition: color 0.2s ease;
+        }
+
+        .dog-calculator-modal-close:hover {
+            color: #f19a5f;
+        }
+
+        .dog-calculator-modal h3 {
+            margin: 0 0 24px 0;
+            color: #6f3f6d;
+            font-size: 1.5rem;
+        }
+
+        /* Share Modal */
+        .dog-calculator-share-buttons {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
+            gap: 12px;
+            margin-bottom: 20px;
+        }
+
+        .dog-calculator-share-btn {
+            padding: 12px 16px;
+            border: none;
+            border-radius: 6px;
+            font-size: 0.9rem;
+            font-weight: 500;
+            color: white;
+            cursor: pointer;
+            transition: all 0.2s ease;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 8px;
+            font-family: inherit;
+        }
+
+        .dog-calculator-share-facebook { background: #1877f2; }
+        .dog-calculator-share-facebook:hover { background: #1664d1; transform: translateY(-1px); }
+        .dog-calculator-share-twitter { background: #1da1f2; }
+        .dog-calculator-share-twitter:hover { background: #1991da; transform: translateY(-1px); }
+        .dog-calculator-share-linkedin { background: #0a66c2; }
+        .dog-calculator-share-linkedin:hover { background: #084d95; transform: translateY(-1px); }
+        .dog-calculator-share-email { background: #6f3f6d; }
+        .dog-calculator-share-email:hover { background: #5a3357; transform: translateY(-1px); }
+        .dog-calculator-share-copy { background: #f19a5f; }
+        .dog-calculator-share-copy:hover { background: #e87741; transform: translateY(-1px); }
+
+        .dog-calculator-share-url input {
+            flex: 1;
+            padding: 10px 16px;
+            border: 1px solid #e8e3ed;
+            border-radius: 6px;
+            font-size: 0.9rem;
+            font-family: monospace;
+            background: #f8f5fa;
+            color: #6f3f6d;
+        }
+
+        /* Embed Modal */
+        .dog-calculator-embed-options {
+            display: flex;
+            flex-direction: column;
+            gap: 24px;
+        }
+
+        .dog-calculator-embed-option {
+            border: 1px solid #e8e3ed;
+            border-radius: 8px;
+            padding: 20px;
+            background: #fcfafd;
+        }
+
+        .dog-calculator-embed-option h4 {
+            margin: 0 0 8px 0;
+            color: #6f3f6d;
+            font-size: 1.1rem;
+        }
+
+        .dog-calculator-embed-option p {
+            margin: 0 0 16px 0;
+            color: #635870;
+            font-size: 0.9rem;
+        }
+
+        /* Default (light theme) code containers */
+        .dog-calculator-code-container {
+            position: relative;
+            background: #ffffff;
+            border: 1px solid #e8e3ed;
+            border-radius: 6px;
+            overflow: hidden;
+        }
+
+        .dog-calculator-code-container pre {
+            margin: 0;
+            padding: 16px 60px 16px 16px;
+            overflow-x: auto;
+        }
+
+        .dog-calculator-code-container code {
+            color: #312b3b;
+            font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
+            font-size: 0.85rem;
+            line-height: 1.4;
+        }
+
+        .dog-calculator-copy-btn {
+            position: absolute;
+            top: 8px;
+            right: 8px;
+            padding: 6px 10px;
+            background: #f19a5f;
+            color: white;
+            border: none;
+            border-radius: 4px;
+            font-size: 0.8rem;
+            font-weight: 500;
+            cursor: pointer;
+            transition: all 0.2s ease;
+            font-family: inherit;
+            z-index: 1;
+        }
+
+        .dog-calculator-copy-btn:hover { background: #e87741; }
+        .dog-calculator-copy-btn.copied { background: #7fa464; }
+        .dog-calculator-copy-btn.copied:hover { background: #7fa464; }
+
+        /* Dark theme modal styles */
+        .dog-calculator-container.theme-dark .dog-calculator-modal-content {
+            background-color: #24202d;
+            border-color: #433c4f;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-modal h3 {
+            color: #f5f3f7;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-modal-close {
+            color: #f5f3f7;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-modal-close:hover {
+            color: #f19a5f;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-share-url input {
+            background: #312b3b;
+            border-color: #433c4f;
+            color: #f5f3f7;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-embed-option {
+            background: #312b3b;
+            border-color: #433c4f;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-embed-option h4 {
+            color: #f5f3f7;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-embed-option p {
+            color: #b8b0c2;
+        }
+
+        /* Dark theme code containers - different from embed option background */
+        .dog-calculator-container.theme-dark .dog-calculator-code-container {
+            background: #1a1621;
+            border-color: #2a2330;
+        }
+
+        .dog-calculator-container.theme-dark .dog-calculator-code-container code {
+            color: #f5f3f7;
+        }
+
+        /* System theme modal styles */
+        @media (prefers-color-scheme: dark) {
+            .dog-calculator-container.theme-system .dog-calculator-modal-content {
+                background-color: #24202d;
+                border-color: #433c4f;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-modal h3 {
+                color: #f5f3f7;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-modal-close {
+                color: #f5f3f7;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-modal-close:hover {
+                color: #f19a5f;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-share-url input {
+                background: #312b3b;
+                border-color: #433c4f;
+                color: #f5f3f7;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-embed-option {
+                background: #312b3b;
+                border-color: #433c4f;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-embed-option h4 {
+                color: #f5f3f7;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-embed-option p {
+                color: #b8b0c2;
+            }
+
+            /* System theme code containers - different from embed option background */
+            .dog-calculator-container.theme-system .dog-calculator-code-container {
+                background: #1a1621;
+                border-color: #2a2330;
+            }
+
+            .dog-calculator-container.theme-system .dog-calculator-code-container code {
+                color: #f5f3f7;
+            }
+        }
     </style>
 </head>
 <body>
@@ -719,10 +997,10 @@
         </div>
 
         <div class="dog-calculator-action-buttons">
-            <button class="dog-calculator-btn dog-calculator-btn-share" onclick="alert('Share functionality not available in iframe mode')">
+            <button class="dog-calculator-btn dog-calculator-btn-share" id="shareBtn">
                 Share
             </button>
-            <button class="dog-calculator-btn dog-calculator-btn-embed" onclick="alert('Embed functionality not available in iframe mode')">
+            <button class="dog-calculator-btn dog-calculator-btn-embed" id="embedBtn">
                 Embed
             </button>
         </div>
@@ -734,6 +1012,64 @@
         </div>
     </div>
 
+    <!-- Share Modal -->
+    <div id="shareModal" class="dog-calculator-modal" style="display: none;">
+        <div class="dog-calculator-modal-content">
+            <span class="dog-calculator-modal-close" id="shareModalClose">&times;</span>
+            <h3>Share Calculator</h3>
+            <div class="dog-calculator-share-buttons">
+                <button class="dog-calculator-share-btn dog-calculator-share-facebook" id="shareFacebook">
+                    Facebook
+                </button>
+                <button class="dog-calculator-share-btn dog-calculator-share-twitter" id="shareTwitter">
+                    Twitter
+                </button>
+                <button class="dog-calculator-share-btn dog-calculator-share-linkedin" id="shareLinkedIn">
+                    LinkedIn
+                </button>
+                <button class="dog-calculator-share-btn dog-calculator-share-email" id="shareEmail">
+                    Email
+                </button>
+                <button class="dog-calculator-share-btn dog-calculator-share-copy" id="shareCopy">
+                    Copy Link
+                </button>
+            </div>
+            <div class="dog-calculator-share-url">
+                <input type="text" id="shareUrl" readonly>
+            </div>
+        </div>
+    </div>
+
+    <!-- Embed Modal -->
+    <div id="embedModal" class="dog-calculator-modal" style="display: none;">
+        <div class="dog-calculator-modal-content dog-calculator-modal-embed">
+            <span class="dog-calculator-modal-close" id="embedModalClose">&times;</span>
+            <h3>⚡ Embed the Calculator</h3>
+            
+            <div class="dog-calculator-embed-options">
+                <div class="dog-calculator-embed-option">
+                    <h4>⚡ JavaScript Widget</h4>
+                    <div class="dog-calculator-code-container">
+                        <pre><code id="widgetCode"></code></pre>
+                        <button class="dog-calculator-copy-btn" id="copyWidget">
+                            Copy
+                        </button>
+                    </div>
+                </div>
+                
+                <div class="dog-calculator-embed-option">
+                    <h4>🛡️ iframe Embed</h4>
+                    <div class="dog-calculator-code-container">
+                        <pre><code id="iframeCode"></code></pre>
+                        <button class="dog-calculator-copy-btn" id="copyIframe">
+                            Copy
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
     <script>
         /**
          * Dog Calorie Calculator - iframe version
@@ -768,7 +1104,7 @@
             applyTheme() {
                 const container = document.getElementById('dogCalculator');
                 container.classList.remove('theme-light', 'theme-dark', 'theme-system');
-                container.classList.add(`theme-${this.theme}`);
+                container.classList.add('theme-' + this.theme);
             }
 
             bindEvents() {
@@ -799,6 +1135,53 @@
                 if (unitSelect) unitSelect.addEventListener('change', () => this.updateFoodCalculations());
                 
                 if (unitToggle) unitToggle.addEventListener('change', () => this.toggleUnits());
+
+                // Modal event listeners
+                const shareBtn = document.getElementById('shareBtn');
+                const embedBtn = document.getElementById('embedBtn');
+                const shareModalClose = document.getElementById('shareModalClose');
+                const embedModalClose = document.getElementById('embedModalClose');
+
+                if (shareBtn) shareBtn.addEventListener('click', () => this.showShareModal());
+                if (embedBtn) embedBtn.addEventListener('click', () => this.showEmbedModal());
+                if (shareModalClose) shareModalClose.addEventListener('click', () => this.hideShareModal());
+                if (embedModalClose) embedModalClose.addEventListener('click', () => this.hideEmbedModal());
+
+                // Share buttons
+                const shareFacebook = document.getElementById('shareFacebook');
+                const shareTwitter = document.getElementById('shareTwitter');
+                const shareLinkedIn = document.getElementById('shareLinkedIn');
+                const shareEmail = document.getElementById('shareEmail');
+                const shareCopy = document.getElementById('shareCopy');
+
+                if (shareFacebook) shareFacebook.addEventListener('click', () => this.shareToFacebook());
+                if (shareTwitter) shareTwitter.addEventListener('click', () => this.shareToTwitter());
+                if (shareLinkedIn) shareLinkedIn.addEventListener('click', () => this.shareToLinkedIn());
+                if (shareEmail) shareEmail.addEventListener('click', () => this.shareViaEmail());
+                if (shareCopy) shareCopy.addEventListener('click', () => this.copyShareLink());
+
+                // Copy buttons
+                const copyWidget = document.getElementById('copyWidget');
+                const copyIframe = document.getElementById('copyIframe');
+
+                if (copyWidget) copyWidget.addEventListener('click', () => this.copyEmbedCode('widget'));
+                if (copyIframe) copyIframe.addEventListener('click', () => this.copyEmbedCode('iframe'));
+
+                // Close modals on outside click
+                const shareModal = document.getElementById('shareModal');
+                const embedModal = document.getElementById('embedModal');
+
+                if (shareModal) {
+                    shareModal.addEventListener('click', (e) => {
+                        if (e.target === shareModal) this.hideShareModal();
+                    });
+                }
+
+                if (embedModal) {
+                    embedModal.addEventListener('click', (e) => {
+                        if (e.target === embedModal) this.hideEmbedModal();
+                    });
+                }
             }
 
             toggleUnits() {
@@ -838,12 +1221,10 @@
                         foodEnergyInput.step = "0.01";
                     }
                     if (unitSelect) {
-                        unitSelect.innerHTML = `
-                            <option value="oz">ounces (oz)</option>
-                            <option value="lb">pounds (lb)</option>
-                            <option value="g">grams (g)</option>
-                            <option value="kg">kilograms (kg)</option>
-                        `;
+                        unitSelect.innerHTML = '<option value="oz">ounces (oz)</option>' +
+                            '<option value="lb">pounds (lb)</option>' +
+                            '<option value="g">grams (g)</option>' +
+                            '<option value="kg">kilograms (kg)</option>';
                     }
                 } else {
                     if (weightLabel) weightLabel.textContent = "Dog's Weight (kg):";
@@ -859,12 +1240,10 @@
                         foodEnergyInput.step = "1";
                     }
                     if (unitSelect) {
-                        unitSelect.innerHTML = `
-                            <option value="g">grams (g)</option>
-                            <option value="kg">kilograms (kg)</option>
-                            <option value="oz">ounces (oz)</option>
-                            <option value="lb">pounds (lb)</option>
-                        `;
+                        unitSelect.innerHTML = '<option value="g">grams (g)</option>' +
+                            '<option value="kg">kilograms (kg)</option>' +
+                            '<option value="oz">ounces (oz)</option>' +
+                            '<option value="lb">pounds (lb)</option>';
                     }
                 }
             }
@@ -1110,6 +1489,124 @@
                     }, '*');
                 }
             }
+
+            // Modal functionality
+            showShareModal() {
+                const modal = document.getElementById('shareModal');
+                const shareUrl = document.getElementById('shareUrl');
+                if (modal && shareUrl) {
+                    shareUrl.value = window.location.href;
+                    modal.style.display = 'block';
+                }
+            }
+
+            hideShareModal() {
+                const modal = document.getElementById('shareModal');
+                if (modal) modal.style.display = 'none';
+            }
+
+            showEmbedModal() {
+                const modal = document.getElementById('embedModal');
+                const widgetCode = document.getElementById('widgetCode');
+                const iframeCode = document.getElementById('iframeCode');
+                
+                if (modal && widgetCode && iframeCode) {
+                    // Build embed URL
+                    const baseUrl = window.location.protocol + '//embed.' + window.location.hostname;
+                    
+                    // Create widget code using createElement to avoid quote issues
+                    const scriptTag = document.createElement('script');
+                    scriptTag.src = baseUrl + '/dog-calorie-calculator/dog-food-calculator-widget.js';
+                    const divTag = document.createElement('div');
+                    divTag.id = 'dog-calorie-calculator';
+                    
+                    const widgetHtml = scriptTag.outerHTML + '\n' + divTag.outerHTML;
+                    widgetCode.textContent = widgetHtml;
+                    
+                    // Create iframe code using createElement
+                    const iframe = document.createElement('iframe');
+                    iframe.src = baseUrl + '/dog-calorie-calculator/iframe.html';
+                    iframe.width = '100%';
+                    iframe.height = '600';
+                    iframe.frameBorder = '0';
+                    iframe.title = 'Dog Calorie Calculator';
+                    
+                    iframeCode.textContent = iframe.outerHTML;
+                    modal.style.display = 'block';
+                }
+            }
+
+            hideEmbedModal() {
+                const modal = document.getElementById('embedModal');
+                if (modal) modal.style.display = 'none';
+            }
+
+            shareToFacebook() {
+                const url = encodeURIComponent(window.location.href);
+                window.open('https://www.facebook.com/sharer/sharer.php?u=' + url, '_blank', 'width=600,height=400');
+            }
+
+            shareToTwitter() {
+                const url = encodeURIComponent(window.location.href);
+                const text = encodeURIComponent('Check out this useful dog calorie calculator!');
+                window.open('https://twitter.com/intent/tweet?url=' + url + '&text=' + text, '_blank', 'width=600,height=400');
+            }
+
+            shareToLinkedIn() {
+                const url = encodeURIComponent(window.location.href);
+                window.open('https://www.linkedin.com/sharing/share-offsite/?url=' + url, '_blank', 'width=600,height=400');
+            }
+
+            shareViaEmail() {
+                const subject = encodeURIComponent('Dog Calorie Calculator');
+                const body = encodeURIComponent('Check out this useful dog calorie calculator: ' + window.location.href);
+                window.location.href = 'mailto:?subject=' + subject + '&body=' + body;
+            }
+
+            async copyShareLink() {
+                const shareUrl = document.getElementById('shareUrl');
+                const copyBtn = document.getElementById('shareCopy');
+                
+                if (shareUrl && copyBtn) {
+                    try {
+                        await navigator.clipboard.writeText(shareUrl.value);
+                        const originalText = copyBtn.textContent;
+                        copyBtn.textContent = 'Copied!';
+                        copyBtn.classList.add('copied');
+                        
+                        setTimeout(() => {
+                            copyBtn.textContent = originalText;
+                            copyBtn.classList.remove('copied');
+                        }, 2000);
+                    } catch (err) {
+                        // Fallback for older browsers
+                        shareUrl.select();
+                        document.execCommand('copy');
+                    }
+                }
+            }
+
+            async copyEmbedCode(type) {
+                const codeElement = document.getElementById(type === 'widget' ? 'widgetCode' : 'iframeCode');
+                const copyBtn = document.getElementById(type === 'widget' ? 'copyWidget' : 'copyIframe');
+                
+                if (codeElement && copyBtn) {
+                    try {
+                        await navigator.clipboard.writeText(codeElement.textContent);
+                        const originalText = copyBtn.textContent;
+                        copyBtn.textContent = 'Copied!';
+                        copyBtn.classList.add('copied');
+                        
+                        setTimeout(() => {
+                            copyBtn.textContent = originalText;
+                            copyBtn.classList.remove('copied');
+                        }, 2000);
+                    } catch (err) {
+                        // Fallback for older browsers
+                        console.log('Copy fallback needed');
+                    }
+                }
+            }
         }
 
         // Initialize calculator when DOM is ready