{"id":19659,"date":"2026-06-15T01:47:23","date_gmt":"2026-06-14T11:47:23","guid":{"rendered":"https:\/\/delta-medlab.com\/blog\/?page_id=19659"},"modified":"2026-07-16T07:40:50","modified_gmt":"2026-07-15T17:40:50","slug":"test-page","status":"publish","type":"page","link":"https:\/\/delta-medlab.com\/blog\/test-page\/","title":{"rendered":"test page"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"19659\" class=\"elementor elementor-19659\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e3f414 e-con-full e-flex e-con e-parent\" data-id=\"9e3f414\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d8cbf5d elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"d8cbf5d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-bmi-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-bmi-iframe\" style=\"width: 100%; min-height: 850px; height: 850px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    \/\/ \u0643\u0648\u062f \u0627\u0644\u0640 HTML \u0627\u0644\u0645\u062a\u0643\u0627\u0645\u0644 \u0627\u0644\u062e\u0627\u0635 \u0628\u0627\u0644\u062d\u0627\u0633\u0628\u0629 \u0645\u0639 \u0627\u0644\u0640 Tailwind \u0648\u0627\u0644\u0640 Fonts\r\n    const calculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\",\r\n                    \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\",\r\n                    \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\",\r\n                    \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\",\r\n                    \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\",\r\n                    \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\",\r\n                    \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\",\r\n                    \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\",\r\n                    \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\",\r\n                    \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\",\r\n                    \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\",\r\n                    \"secondary\": \"#3A428A\",\r\n                    \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\",\r\n                    \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\",\r\n                    \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\",\r\n                    \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\",\r\n                    \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\",\r\n                    \"light-green\": \"#F5F8ED\",\r\n                    \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\",\r\n                    \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\",\r\n                    \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\",\r\n                    \"soft-bg\": \"#F8F9FC\",\r\n                    \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\",\r\n                    \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\",\r\n                    \"tertiary\": \"#854883\",\r\n                    \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\",\r\n                    \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\",\r\n                    \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\",\r\n                    \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": {\r\n                    \"DEFAULT\": \"0.25rem\",\r\n                    \"lg\": \"0.5rem\",\r\n                    \"xl\": \"12px\",\r\n                    \"2xl\": \"24px\",\r\n                    \"full\": \"9999px\"\r\n            },\r\n            \"fontFamily\": {\r\n                    \"cairo\": [\"Cairo\", \"sans-serif\"]\r\n            }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n\r\n        .bmi-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n\r\n        .floating-label-group {\r\n            position: relative;\r\n        }\r\n\r\n        .floating-label-group input:focus ~ label,\r\n        .floating-label-group input:not(:placeholder-shown) ~ label {\r\n            top: -10px;\r\n            right: 12px;\r\n            font-size: 12px;\r\n            color: #A3BF64;\r\n            background: white;\r\n            padding: 0 4px;\r\n        }\r\n\r\n        .floating-label-group label {\r\n            position: absolute;\r\n            top: 18px;\r\n            right: 16px;\r\n            transition: all 0.2s ease;\r\n            pointer-events: none;\r\n            color: #757969;\r\n        }\r\n\r\n        .gauge-bar {\r\n            height: 12px;\r\n            border-radius: 6px;\r\n            background: linear-gradient(to left, #EF4444 0%, #F59E0B 25%, #22C55E 50%, #F59E0B 75%, #EF4444 100%);\r\n        }\r\n\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n\r\n        [data-state] {\r\n            display: none;\r\n        }\r\n\r\n        [data-state=\"active\"] {\r\n            display: block;\r\n            animation: fadeIn 0.4s ease-out;\r\n        }\r\n\r\n        @keyframes fadeIn {\r\n            from { opacity: 0; transform: translateY(10px); }\r\n            to { opacity: 1; transform: translateY(0); }\r\n        }\r\n\r\n        .material-symbols-outlined {\r\n            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\r\n            vertical-align: middle;\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n<div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\">\r\n<div class=\"p-8 pb-4 text-center\">\r\n<div class=\"flex justify-center mb-4\">\r\n<div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n<span class=\"material-symbols-outlined text-primary text-3xl\">vital_signs<\/span>\r\n<\/div>\r\n<\/div>\r\n<div data-state=\"active\" id=\"pre-header\">\r\n<h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0645\u0624\u0634\u0631 \u0643\u062a\u0644\u0629 \u0627\u0644\u062c\u0633\u0645 (BMI)<\/h1>\r\n<p class=\"text-on-surface-variant text-sm\">\u0623\u062f\u0627\u0629 \u0637\u0628\u064a\u0629 \u062f\u0642\u064a\u0642\u0629 \u0644\u062a\u0642\u064a\u064a\u0645 \u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0627\u0644\u0645\u0639\u0627\u064a\u064a\u0631 \u0627\u0644\u0639\u0627\u0644\u0645\u064a\u0629.<\/p>\r\n<\/div>\r\n<div data-state=\"hidden\" id=\"result-header\">\r\n<h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0646\u062a\u064a\u062c\u062a\u0643 \u0627\u0644\u0646\u0647\u0627\u0626\u064a\u0629<\/h1>\r\n<p class=\"text-on-surface-variant text-sm\">\u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0627\u0644\u062a\u064a \u0642\u0645\u062a \u0628\u0625\u062f\u062e\u0627\u0644\u0647\u0627\u060c \u0625\u0644\u064a\u0643 \u0627\u0644\u062a\u0642\u0631\u064a\u0631:<\/p>\r\n<\/div>\r\n<\/div>\r\n<div class=\"px-8 pb-8\">\r\n<div class=\"space-y-6\" data-state=\"active\" id=\"calculator-view\">\r\n<div class=\"flex p-1 bg-surface rounded-full border border-border-light\">\r\n<button class=\"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 bg-primary text-white\" id=\"btn-male\" onclick=\"setGender('male')\">\r\n<span class=\"material-symbols-outlined\" style=\"font-variation-settings: 'FILL' 1;\">male<\/span>\r\n                        \u0630\u0643\u0631\r\n                    <\/button>\r\n<button class=\"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 text-on-surface-variant\" id=\"btn-female\" onclick=\"setGender('female')\">\r\n<span class=\"material-symbols-outlined\">female<\/span>\r\n                        \u0623\u0646\u062b\u0649\r\n                    <\/button>\r\n<\/div>\r\n<div class=\"grid grid-cols-2 gap-4\">\r\n<div class=\"floating-label-group\">\r\n<input class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"weight\" placeholder=\" \" type=\"number\"\/>\r\n<label class=\"font-medium\">\u0627\u0644\u0648\u0632\u0646 (\u0643\u062c\u0645)<\/label>\r\n<\/div>\r\n<div class=\"floating-label-group\">\r\n<input class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"height\" placeholder=\" \" type=\"number\"\/>\r\n<label class=\"font-medium\">\u0627\u0644\u0637\u0648\u0644 (\u0633\u0645)<\/label>\r\n<\/div>\r\n<\/div>\r\n<div class=\"floating-label-group\">\r\n<input class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"age\" placeholder=\" \" type=\"number\"\/>\r\n<label class=\"font-medium\">\u0627\u0644\u0639\u0645\u0631<\/label>\r\n<\/div>\r\n<button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90\" onclick=\"calculateBMI()\">\r\n                    \u0627\u062d\u0633\u0628 \u0627\u0644\u0646\u062a\u064a\u062c\u0629\r\n                <\/button>\r\n<div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10\">\r\n<div class=\"flex items-start gap-3\">\r\n<span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n<p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                            <strong>\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u0647\u0630\u0627 \u0627\u0644\u0641\u062d\u0635\u061f<\/strong> \u0645\u0624\u0634\u0631 \u0643\u062a\u0644\u0629 \u0627\u0644\u062c\u0633\u0645 \u0647\u0648 \u0645\u0639\u064a\u0627\u0631 \u0637\u0628\u064a \u0639\u0627\u0644\u0645\u064a \u064a\u0648\u0636\u062d \u0627\u0644\u0639\u0644\u0627\u0642\u0629 \u0628\u064a\u0646 \u0627\u0644\u0637\u0648\u0644 \u0648\u0627\u0644\u0648\u0632\u0646\u060c \u0648\u064a\u064f\u0639\u062f \u0645\u0624\u0634\u0631\u0627\u064b \u062d\u064a\u0648\u064a\u0627\u064b \u0623\u0648\u0644\u064a\u0627\u064b \u0644\u0644\u0643\u0634\u0641 \u0627\u0644\u0645\u0628\u0643\u0631 \u0639\u0646 \u0623\u064a \u0645\u062e\u0627\u0637\u0631 \u0635\u062d\u064a\u0629 \u062a\u062a\u0639\u0644\u0642 \u0628\u0627\u0644\u0633\u0645\u0646\u0629 \u0623\u0648 \u0627\u0644\u0646\u062d\u0627\u0641\u0629 \u0627\u0644\u0645\u0641\u0631\u0637\u0629.\r\n                        <\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<div class=\"space-y-8 py-4\" data-state=\"hidden\" id=\"result-view\">\r\n<div class=\"text-center\">\r\n<div class=\"inline-flex flex-col items-center justify-center bg-light-green w-32 h-32 rounded-full border-4 border-white shadow-sm mb-4\">\r\n<span class=\"text-4xl font-extrabold text-primary\" id=\"bmi-value\">24.5<\/span>\r\n<span class=\"text-xs text-on-surface-variant font-medium\">BMI<\/span>\r\n<\/div>\r\n<div>\r\n<span class=\"px-4 py-1.5 bg-success\/10 text-success rounded-full text-sm font-bold border border-success\/20\" id=\"bmi-status\">\u0637\u0628\u064a\u0639\u064a<\/span>\r\n<\/div>\r\n<\/div>\r\n<div class=\"relative pt-4\">\r\n<div class=\"gauge-bar w-full\"><\/div>\r\n<div class=\"absolute -top-1 transition-all duration-1000 ease-out\" id=\"gauge-pointer\" style=\"right: 50%;\">\r\n<div class=\"w-4 h-4 bg-on-surface border-2 border-white rounded-full shadow-md -mr-2\"><\/div>\r\n<\/div>\r\n<div class=\"flex justify-between mt-2 text-[10px] text-on-surface-variant font-medium\">\r\n<span>\u0646\u062d\u0627\u0641\u0629<\/span>\r\n<span>\u0637\u0628\u064a\u0639\u064a<\/span>\r\n<span>\u0648\u0632\u0646 \u0632\u0627\u0626\u062f<\/span>\r\n<span>\u0633\u0645\u0646\u0629<\/span>\r\n<\/div>\r\n<\/div>\r\n<div class=\"bg-light-blue rounded-xl p-5 border-r-4 border-secondary\">\r\n<h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n<span class=\"material-symbols-outlined text-sm\">analytics<\/span>\r\n                        \u062a\u062d\u0644\u064a\u0644 \u0627\u0644\u0646\u062a\u064a\u062c\u0629\r\n                    <\/h3>\r\n<p class=\"text-sm text-on-surface-variant leading-relaxed\" id=\"bmi-interpretation\">\r\n                        \u0648\u0632\u0646\u0643 \u064a\u0642\u0639 \u0636\u0645\u0646 \u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0635\u062d\u064a \u0627\u0644\u0645\u062b\u0627\u0644\u064a. \u0627\u0633\u062a\u0645\u0631 \u0641\u064a \u0627\u062a\u0628\u0627\u0639 \u0646\u0645\u0637 \u062d\u064a\u0627\u0629 \u0646\u0634\u0637 \u0648\u0646\u0638\u0627\u0645 \u063a\u0630\u0627\u0626\u064a \u0645\u062a\u0648\u0627\u0632\u0646 \u0644\u0644\u062d\u0641\u0627\u0638 \u0639\u0644\u0649 \u0647\u0630\u0647 \u0627\u0644\u0646\u062a\u064a\u062c\u0629 \u0627\u0644\u0645\u0645\u062a\u0627\u0632\u0629.\r\n                    <\/p>\r\n<\/div>\r\n<div class=\"flex flex-col gap-3\">\r\n<a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n<span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                        \u0630\u0647\u0627\u0628 \u0644\u0644\u0641\u062d\u0635 \u0627\u0644\u0645\u062e\u0628\u0631\u064a\r\n                    <\/a>\r\n<button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" onclick=\"resetCalculator()\">\r\n<span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                        \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n<script>\r\n        let currentGender = 'male';\r\n\r\n        function setGender(gender) {\r\n            currentGender = gender;\r\n            const maleBtn = document.getElementById('btn-male');\r\n            const femaleBtn = document.getElementById('btn-female');\r\n            \r\n            if (gender === 'male') {\r\n                maleBtn.classList.add('bg-primary', 'text-white');\r\n                maleBtn.classList.remove('text-on-surface-variant');\r\n                maleBtn.querySelector('span').style.fontVariationSettings = \"'FILL' 1\";\r\n                \r\n                femaleBtn.classList.remove('bg-primary', 'text-white');\r\n                femaleBtn.classList.add('text-on-surface-variant');\r\n                femaleBtn.querySelector('span').style.fontVariationSettings = \"'FILL' 0\";\r\n            } else {\r\n                femaleBtn.classList.add('bg-primary', 'text-white');\r\n                femaleBtn.classList.remove('text-on-surface-variant');\r\n                femaleBtn.querySelector('span').style.fontVariationSettings = \"'FILL' 1\";\r\n                \r\n                maleBtn.classList.remove('bg-primary', 'text-white');\r\n                maleBtn.classList.add('text-on-surface-variant');\r\n                maleBtn.querySelector('span').style.fontVariationSettings = \"'FILL' 0\";\r\n            }\r\n        }\r\n\r\n        function calculateBMI() {\r\n            const weight = parseFloat(document.getElementById('weight').value);\r\n            const height = parseFloat(document.getElementById('height').value) \/ 100;\r\n            const age = document.getElementById('age').value;\r\n\r\n            if (!weight || !height || !age) {\r\n                alert(\"\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u062c\u0645\u064a\u0639 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0627\u0644\u0645\u0637\u0644\u0648\u0628\u0629\");\r\n                return;\r\n            }\r\n\r\n            const bmi = (weight \/ (height * height)).toFixed(1);\r\n            displayResults(bmi);\r\n        }\r\n\r\n        function displayResults(bmi) {\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-view').setAttribute('data-state', 'active');\r\n            document.getElementById('result-header').setAttribute('data-state', 'active');\r\n\r\n            document.getElementById('bmi-value').innerText = bmi;\r\n            \r\n            let status = '';\r\n            let colorClass = '';\r\n            let pointerPos = 0;\r\n            let interpretation = '';\r\n\r\n            if (bmi < 18.5) {\r\n                status = '\u0646\u062d\u0627\u0641\u0629';\r\n                colorClass = 'bg-warning\/10 text-warning border-warning\/20';\r\n                pointerPos = 15;\r\n                interpretation = '\u0648\u0632\u0646\u0643 \u0623\u0642\u0644 \u0645\u0646 \u0627\u0644\u0645\u0639\u062f\u0644 \u0627\u0644\u0637\u0628\u064a\u0639\u064a. \u0646\u0646\u0635\u062d\u0643 \u0628\u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0627\u062e\u062a\u0635\u0627\u0635\u064a \u062a\u063a\u0630\u064a\u0629 \u0641\u064a \u0645\u062e\u062a\u0628\u0631\u0627\u062a \u062f\u0644\u062a\u0627 \u0644\u0645\u0631\u0627\u062c\u0639\u0629 \u0646\u0638\u0627\u0645\u0643 \u0627\u0644\u063a\u0630\u0627\u0626\u064a.';\r\n            } else if (bmi < 25) {\r\n                status = '\u0637\u0628\u064a\u0639\u064a';\r\n                colorClass = 'bg-success\/10 text-success border-success\/20';\r\n                pointerPos = 50;\r\n                interpretation = '\u0648\u0632\u0646\u0643 \u0645\u062b\u0627\u0644\u064a \u0648\u0645\u0646\u0627\u0633\u0628 \u0644\u0637\u0648\u0644\u0643. \u0627\u0644\u062d\u0641\u0627\u0638 \u0639\u0644\u0649 \u0647\u0630\u0627 \u0627\u0644\u0645\u0633\u062a\u0648\u0649 \u064a\u0642\u0644\u0644 \u0645\u0646 \u0645\u062e\u0627\u0637\u0631 \u0627\u0644\u0625\u0635\u0627\u0628\u0629 \u0628\u0627\u0644\u0623\u0645\u0631\u0627\u0636 \u0627\u0644\u0645\u0632\u0645\u0646\u0629.';\r\n            } else if (bmi < 30) {\r\n                status = '\u0648\u0632\u0646 \u0632\u0627\u0626\u062f';\r\n                colorClass = 'bg-warning\/10 text-warning border-warning\/20';\r\n                pointerPos = 75;\r\n                interpretation = '\u0644\u062f\u064a\u0643 \u0632\u064a\u0627\u062f\u0629 \u0628\u0633\u064a\u0637\u0629 \u0641\u064a \u0627\u0644\u0648\u0632\u0646. \u064a\u0641\u0636\u0644 \u0627\u0644\u0627\u0646\u062a\u0628\u0627\u0647 \u0644\u0644\u0646\u0634\u0627\u0637 \u0627\u0644\u0628\u062f\u0646\u064a \u0648\u062c\u062f\u0648\u0644\u0629 \u0641\u062d\u0635 \u0634\u0627\u0645\u0644 \u0644\u0644\u0633\u0643\u0631\u064a \u0648\u0627\u0644\u0643\u0648\u0644\u064a\u0633\u062a\u0631\u0648\u0644.';\r\n            } else {\r\n                status = '\u0633\u0645\u0646\u0629';\r\n                colorClass = 'bg-error\/10 text-error border-error\/20';\r\n                pointerPos = 90;\r\n                interpretation = '\u062a\u0635\u0646\u0641 \u0647\u0630\u0647 \u0627\u0644\u0646\u062a\u064a\u062c\u0629 \u0636\u0645\u0646 \u0646\u0637\u0627\u0642 \u0627\u0644\u0633\u0645\u0646\u0629. \u0645\u0646 \u0627\u0644\u0636\u0631\u0648\u0631\u064a \u0645\u0631\u0627\u062c\u0639\u0629 \u0627\u0644\u0637\u0628\u064a\u0628 \u0627\u0644\u0645\u062e\u062a\u0635 \u0644\u0639\u0645\u0644 \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u0644\u0627\u0632\u0645\u0629 \u0648\u0648\u0636\u0639 \u062e\u0637\u0629 \u0639\u0644\u0627\u062c\u064a\u0629.';\r\n            }\r\n\r\n            const statusBadge = document.getElementById('bmi-status');\r\n            statusBadge.innerText = status;\r\n            statusBadge.className = \"px-4 py-1.5 rounded-full text-sm font-bold border \" + colorClass;\r\n            \r\n            document.getElementById('gauge-pointer').style.right = pointerPos + \"%\";\r\n            document.getElementById('bmi-interpretation').innerText = interpretation;\r\n        }\r\n\r\n        function resetCalculator() {\r\n            document.getElementById('result-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'active');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'active');\r\n            \r\n            document.getElementById('weight').value = '';\r\n            document.getElementById('height').value = '';\r\n            document.getElementById('age').value = '';\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    \/\/ \u062d\u0642\u0646 \u0627\u0644\u0643\u0648\u062f \u0628\u0627\u0644\u0643\u0627\u0645\u0644 \u0643\u0640 Blob URL \u062f\u0627\u062e\u0644 \u0627\u0644\u0640 iframe \u0644\u0645\u0646\u0639 \u0627\u0644\u062a\u0636\u0627\u0631\u0628 \u0646\u0647\u0627\u0626\u064a\u0627\u064b\r\n    const iframe = document.getElementById('delta-bmi-iframe');\r\n    const blob = new Blob([calculatorHtml], { type: 'text\/html' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4c554ab elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"4c554ab\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-bodyfat-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-bodyfat-iframe\" style=\"width: 100%; min-height: 850px; height: 850px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    \/\/ \u0643\u0648\u062f \u0627\u0644\u0640 HTML \u0627\u0644\u0645\u062a\u0643\u0627\u0645\u0644 \u0627\u0644\u062e\u0627\u0635 \u0628\u062d\u0627\u0633\u0628\u0629 \u0646\u0633\u0628\u0629 \u0627\u0644\u062f\u0647\u0648\u0646 \u0627\u0644\u0645\u062a\u0648\u0627\u0641\u0642\u0629 \u0645\u0639 \u0627\u0644\u0640 Tailwind \u0648\u0627\u0644\u0640 Fonts\r\n    const bodyFatCalculatorHtml = `<!DOCTYPE html>\r\n<html lang=\"ar\" dir=\"rtl\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>\u062d\u0627\u0633\u0628\u0629 \u0646\u0633\u0628\u0629 \u0627\u0644\u062f\u0647\u0648\u0646 \u0641\u064a \u0627\u0644\u062c\u0633\u0645 | \u0645\u062e\u062a\u0628\u0631\u0627\u062a \u062f\u0644\u062a\u0627 \u0627\u0644\u0637\u0628\u064a\u0629<\/title>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n    <link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200\" \/>\r\n    <script>\r\n        tailwind.config = {\r\n            theme: {\r\n                extend: {\r\n                    colors: {\r\n                        primary: '#A3BF64',\r\n                        secondary: '#3A428A',\r\n                        'surface': '#f8f9ff',\r\n                        'light-green': '#F5F8ED',\r\n                        'light-blue': '#F4F5FB',\r\n                        'on-surface-variant': '#6B7280',\r\n                        'outline-variant': '#E5E7EB',\r\n                        'success': '#22C55E',\r\n                        'warning': '#F59E0B',\r\n                        'error': '#EF4444',\r\n                        'border-light': '#E5E7EB',\r\n                        'on-surface': '#121c2a',\r\n                    },\r\n                    fontFamily: {\r\n                        'cairo': ['Cairo', 'sans-serif'],\r\n                    },\r\n                    borderRadius: {\r\n                        'xl': '12px',\r\n                        '2xl': '24px',\r\n                    },\r\n                    boxShadow: {\r\n                        'card': '0 10px 30px rgba(0,0,0,0.05)',\r\n                    }\r\n                }\r\n            }\r\n        }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n        .bf-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n        \/* Floating Labels *\/\r\n        .floating-label-group {\r\n            position: relative;\r\n        }\r\n        .floating-label-group input:focus ~ label,\r\n        .floating-label-group input:not(:placeholder-shown) ~ label {\r\n            top: -10px;\r\n            right: 12px;\r\n            font-size: 12px;\r\n            color: #A3BF64;\r\n            background: white;\r\n            padding: 0 4px;\r\n        }\r\n        .floating-label-group label {\r\n            position: absolute;\r\n            top: 18px;\r\n            right: 16px;\r\n            transition: all 0.2s ease;\r\n            pointer-events: none;\r\n            color: #757969;\r\n        }\r\n        \/* \u0627\u0644\u062a\u062f\u0631\u062c \u0627\u0644\u0644\u0648\u0646\u064a \u0644\u0644\u0628\u0627\u0631 \u0627\u0644\u0633\u0641\u0644\u064a *\/\r\n        .gauge-bar {\r\n            height: 12px;\r\n            border-radius: 6px;\r\n            background: linear-gradient(to left, #EF4444 0%, #F59E0B 30%, #22C55E 65%, #F59E0B 85%, #EF4444 100%);\r\n        }\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n        .fade-enter {\r\n            opacity: 0;\r\n            transform: translateY(10px);\r\n        }\r\n        .fade-enter-active {\r\n            opacity: 1;\r\n            transform: translateY(0);\r\n            transition: all 0.4s ease-out;\r\n        }\r\n        @keyframes gauge-fill {\r\n            from { width: 0%; }\r\n        }\r\n        .gauge-bar-fill {\r\n            animation: gauge-fill 1s ease-out forwards;\r\n        }\r\n        .hidden { display: none !important; }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bf-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-app\">\r\n        \r\n        <div id=\"input-view\" class=\"p-8 pb-8 space-y-6\">\r\n            <div class=\"text-center space-y-2\">\r\n                <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center mx-auto mb-4\">\r\n                    <span class=\"material-symbols-outlined text-primary text-3xl\">monitoring<\/span>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface\">\u062d\u0627\u0633\u0628\u0629 \u0646\u0633\u0628\u0629 \u0627\u0644\u062f\u0647\u0648\u0646 \u0641\u064a \u0627\u0644\u062c\u0633\u0645<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0627\u062d\u0635\u0644 \u0639\u0644\u0649 \u062a\u0642\u062f\u064a\u0631 \u062f\u0642\u064a\u0642 \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0642\u064a\u0627\u0633\u0627\u062a \u0627\u0644\u062c\u0633\u0645 \u0627\u0644\u062d\u064a\u0648\u064a\u0629 \u0627\u0644\u0645\u0639\u062a\u0645\u062f\u0647.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"flex p-1 bg-surface rounded-full border border-border-light\">\r\n                <button onclick=\"setGender('male')\" id=\"btn-male\" class=\"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 bg-primary text-white\">\r\n                    <span class=\"material-symbols-outlined\" style=\"font-variation-settings: 'FILL' 1;\">male<\/span>\r\n                    \u0630\u0643\u0631\r\n                <\/button>\r\n                <button onclick=\"setGender('female')\" id=\"btn-female\" class=\"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 text-on-surface-variant\">\r\n                    <span class=\"material-symbols-outlined\">female<\/span>\r\n                    \u0623\u0646\u062b\u0649\r\n                <\/button>\r\n            <\/div>\r\n\r\n            <div class=\"grid grid-cols-2 gap-4\">\r\n                <div class=\"floating-label-group\">\r\n                    <input type=\"number\" id=\"weight\" placeholder=\" \" class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\">\r\n                    <label class=\"font-medium\">\u0627\u0644\u0648\u0632\u0646 (\u0643\u062c\u0645)<\/label>\r\n                <\/div>\r\n                <div class=\"floating-label-group\">\r\n                    <input type=\"number\" id=\"height\" placeholder=\" \" class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\">\r\n                    <label class=\"font-medium\">\u0627\u0644\u0637\u0648\u0644 (\u0633\u0645)<\/label>\r\n                <\/div>\r\n                <div class=\"floating-label-group\">\r\n                    <input type=\"number\" id=\"age\" placeholder=\" \" class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\">\r\n                    <label class=\"font-medium\">\u0627\u0644\u0639\u0645\u0631<\/label>\r\n                <\/div>\r\n                <div class=\"floating-label-group\" id=\"neck-group\">\r\n                    <input type=\"number\" id=\"neck\" placeholder=\" \" class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\">\r\n                    <label class=\"font-medium\">\u0645\u062d\u064a\u0637 \u0627\u0644\u0631\u0642\u0628\u0629 (\u0633\u0645)<\/label>\r\n                <\/div>\r\n                <div class=\"floating-label-group col-span-2\" id=\"waist-group\">\r\n                    <input type=\"number\" id=\"waist\" placeholder=\" \" class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\">\r\n                    <label class=\"font-medium\">\u0645\u062d\u064a\u0637 \u0627\u0644\u062e\u0635\u0631 (\u0633\u0645)<\/label>\r\n                <\/div>\r\n                <div class=\"floating-label-group hidden\" id=\"hip-group\">\r\n                    <input type=\"number\" id=\"hip\" placeholder=\" \" class=\"w-full h-[60px] border border-border-light rounded-xl px-4 pt-2 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\">\r\n                    <label class=\"font-medium\">\u0645\u062d\u064a\u0637 \u0627\u0644\u062d\u0648\u0636 (\u0633\u0645)<\/label>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <button onclick=\"calculate()\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\">\r\n                <span class=\"material-symbols-outlined\">calculate<\/span>\r\n                \u0627\u062d\u0633\u0628 \u0627\u0644\u0646\u0633\u0628\u0629 \u0627\u0644\u0622\u0646\r\n            <\/button>\r\n\r\n            <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10 flex gap-3\">\r\n                <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                    \u062a\u0639\u062a\u0628\u0631 \u0646\u0633\u0628\u0629 \u0627\u0644\u062f\u0647\u0648\u0646 \u0645\u0624\u0634\u0631\u0627\u064b \u0623\u062f\u0642 \u0644\u0644\u0635\u062d\u0629 \u0645\u0646 \u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0643\u0644\u064a\u060c \u062d\u064a\u062b \u062a\u0633\u0627\u0639\u062f \u0641\u064a \u062a\u0645\u064a\u064a\u0632 \u062d\u062c\u0645 \u0627\u0644\u0639\u0636\u0644\u0627\u062a \u0639\u0646 \u0627\u0644\u062f\u0647\u0648\u0646 \u0627\u0644\u0645\u062a\u0631\u0627\u0643\u0645\u0629\u060c \u0645\u0645\u0627 \u064a\u0642\u0644\u0644 \u0645\u062e\u0627\u0637\u0631 \u0627\u0644\u0625\u0635\u0627\u0628\u0629 \u0628\u0623\u0645\u0631\u0627\u0636 \u0627\u0644\u0642\u0644\u0628 \u0648\u0627\u0644\u0633\u0643\u0631\u064a \u0645\u0646 \u0627\u0644\u0646\u0648\u0639 \u0627\u0644\u062b\u0627\u0646\u064a.\r\n                <\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div id=\"result-view\" class=\"hidden fade-enter p-8 space-y-8\">\r\n            <div class=\"text-center space-y-2\">\r\n                <h2 class=\"text-2xl font-bold text-on-surface mb-2\">\u0646\u062a\u064a\u062c\u062a\u0643 \u0627\u0644\u0646\u0647\u0627\u0626\u064a\u0629<\/h2>\r\n                <div class=\"relative w-44 h-44 mx-auto flex items-center justify-center\">\r\n                    <svg class=\"w-full h-full transform -rotate-90\">\r\n                        <circle cx=\"88\" cy=\"88\" r=\"80\" stroke=\"currentColor\" stroke-width=\"10\" fill=\"transparent\" class=\"text-light-blue\" \/>\r\n                        <circle cx=\"88\" cy=\"88\" r=\"80\" stroke=\"currentColor\" stroke-width=\"10\" fill=\"transparent\" stroke-dasharray=\"502.65\" id=\"progress-circle\" class=\"text-primary transition-all duration-1000\" \/>\r\n                    <\/svg>\r\n                    <div class=\"absolute inset-0 flex flex-col items-center justify-center\">\r\n                        <span id=\"result-value\" class=\"text-4xl font-extrabold text-secondary\">0%<\/span>\r\n                        <span id=\"result-status\" class=\"px-4 py-1.5 rounded-full text-sm font-bold mt-3 border\">\u0637\u0628\u064a\u0639\u064a<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"relative pt-4\">\r\n                <div class=\"gauge-bar w-full\"><\/div>\r\n                <div class=\"absolute -top-1 transition-all duration-1000 ease-out\" id=\"gauge-pointer\" style=\"right: 0%;\">\r\n                    <div class=\"w-4 h-4 bg-on-surface border-2 border-white rounded-full shadow-md -mr-2\"><\/div>\r\n                <\/div>\r\n                <div class=\"flex justify-between mt-2 text-[10px] text-on-surface-variant font-medium\">\r\n                    <span>\u0644\u064a\u0627\u0642\u0629<\/span>\r\n                    <span>\u0645\u0642\u0628\u0648\u0644<\/span>\r\n                    <span>\u0633\u0645\u0646\u0629<\/span>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div id=\"advice-box\" class=\"bg-light-blue rounded-xl p-5 border-r-4 border-secondary space-y-1\">\r\n                <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                    <span class=\"material-symbols-outlined text-sm\">analytics<\/span>\r\n                    \u0627\u0644\u062a\u0648\u0635\u064a\u0629 \u0627\u0644\u0637\u0628\u064a\u0629:\r\n                <\/h3>\r\n                <p id=\"advice-text\" class=\"text-sm text-on-surface-variant leading-relaxed\"><\/p>\r\n            <\/div>\r\n\r\n            <div class=\"flex flex-col gap-3\">\r\n                <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                    <span class=\"material-symbols-outlined\">biotech<\/span>\r\n                    \u0630\u0647\u0627\u0628 \u0644\u0644\u0641\u062d\u0635 \u0627\u0644\u0645\u062e\u0628\u0631\u064a\r\n                <\/a>\r\n                <button onclick=\"reset()\" class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\">\r\n                    <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                    \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                <\/button>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    <script>\r\n        let gender = 'male';\r\n\r\n        function setGender(val) {\r\n            gender = val;\r\n            const btnMale = document.getElementById('btn-male');\r\n            const btnFemale = document.getElementById('btn-female');\r\n            const hipGroup = document.getElementById('hip-group');\r\n            const waistGroup = document.getElementById('waist-group');\r\n            const neckGroup = document.getElementById('neck-group');\r\n\r\n            if (val === 'male') {\r\n                btnMale.className = \"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 bg-primary text-white\";\r\n                btnMale.querySelector('span').style.fontVariationSettings = \"'FILL' 1\";\r\n                \r\n                btnFemale.className = \"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 text-on-surface-variant\";\r\n                btnFemale.querySelector('span').style.fontVariationSettings = \"'FILL' 0\";\r\n                \r\n                hipGroup.classList.add('hidden');\r\n                \r\n                \/\/ \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062e\u0635\u0631 \u0644\u064a\u0623\u062e\u0630 \u0627\u0644\u0639\u0631\u0636 \u0627\u0644\u0643\u0627\u0645\u0644 \u0648\u0627\u0644\u0631\u0642\u0628\u0629 \u0645\u0643\u0627\u0646\u0647\u0627 \u0627\u0644\u0637\u0628\u064a\u0639\u064a \u0641\u064a \u062d\u0627\u0644\u0629 \u0627\u0644\u0630\u0643\u0631\r\n                waistGroup.className = \"floating-label-group col-span-2\";\r\n                neckGroup.className = \"floating-label-group\";\r\n            } else {\r\n                btnFemale.className = \"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 bg-primary text-white\";\r\n                btnFemale.querySelector('span').style.fontVariationSettings = \"'FILL' 1\";\r\n                \r\n                btnMale.className = \"flex-1 py-3 rounded-full text-sm font-semibold transition-all flex items-center justify-center gap-2 text-on-surface-variant\";\r\n                btnMale.querySelector('span').style.fontVariationSettings = \"'FILL' 0\";\r\n                \r\n                hipGroup.classList.remove('hidden');\r\n                \r\n                \/\/ \u062a\u0639\u062f\u064a\u0644 \u0627\u0644\u0643\u0644\u0627\u0633\u0627\u062a \u0644\u064a\u0635\u0628\u062d \u0627\u0644\u062e\u0635\u0631 \u0648\u0627\u0644\u062d\u0648\u0636 \u0645\u062a\u062c\u0627\u0648\u0631\u064a\u0646 \u062a\u0645\u0627\u0645\u0627\u064b \u0641\u064a \u0627\u0644\u0633\u0637\u0631 \u0627\u0644\u0623\u062e\u064a\u0631\r\n                waistGroup.className = \"floating-label-group col-span-1\";\r\n                hipGroup.className = \"floating-label-group col-span-1\";\r\n                neckGroup.className = \"floating-label-group\";\r\n            }\r\n        }\r\n\r\n        function calculate() {\r\n            const w = parseFloat(document.getElementById('weight').value);\r\n            const h = parseFloat(document.getElementById('height').value);\r\n            const a = parseFloat(document.getElementById('age').value);\r\n            const n = parseFloat(document.getElementById('neck').value);\r\n            const wa = parseFloat(document.getElementById('waist').value);\r\n            const hi = parseFloat(document.getElementById('hip').value);\r\n\r\n            if (!w || !h || !a || !n || !wa || (gender === 'female' && !hi)) {\r\n                alert('\u064a\u0631\u062c\u0649 \u0625\u0643\u0645\u0627\u0644 \u062c\u0645\u064a\u0639 \u0627\u0644\u0642\u064a\u0627\u0633\u0627\u062a \u0627\u0644\u0645\u0637\u0644\u0648\u0628\u0629');\r\n                return;\r\n            }\r\n\r\n            let bfp = 0;\r\n            if (gender === 'male') {\r\n                bfp = 495 \/ (1.0324 - 0.19077 * Math.log10(wa - n) + 0.15456 * Math.log10(h)) - 450;\r\n            } else {\r\n                bfp = 495 \/ (1.29579 - 0.35004 * Math.log10(wa + hi - n) + 0.221 * Math.log10(h)) - 450;\r\n            }\r\n\r\n            bfp = Math.max(2, Math.min(60, bfp));\r\n            showResults(bfp.toFixed(1));\r\n        }\r\n\r\n        function showResults(val) {\r\n            const inputView = document.getElementById('input-view');\r\n            const resultView = document.getElementById('result-view');\r\n            const resultVal = document.getElementById('result-value');\r\n            const resultStatus = document.getElementById('result-status');\r\n            const progressCircle = document.getElementById('progress-circle');\r\n            const pointer = document.getElementById('gauge-pointer');\r\n            const adviceText = document.getElementById('advice-text');\r\n\r\n            inputView.classList.add('hidden');\r\n            resultView.classList.remove('hidden');\r\n            resultView.classList.add('fade-enter-active');\r\n\r\n            resultVal.innerText = val + '%';\r\n            \r\n            let status = '';\r\n            let color = '#A3BF64';\r\n            let colorClass = '';\r\n            let advice = '';\r\n            const bfp = parseFloat(val);\r\n\r\n            if (gender === 'male') {\r\n                if (bfp < 6) { status = '\u062f\u0647\u0648\u0646 \u0623\u0633\u0627\u0633\u064a\u0629'; color = '#3A428A'; colorClass = 'bg-secondary\/10 text-secondary border-secondary\/20'; advice = '\u0646\u0633\u0628\u0629 \u062f\u0647\u0648\u0646 \u0645\u0646\u062e\u0641\u0636\u0629 \u062c\u062f\u0627\u064b\u060c \u062a\u0623\u0643\u0651\u062f \u0645\u0646 \u062d\u0635\u0648\u0644\u0643 \u0639\u0644\u0649 \u062a\u063a\u0630\u064a\u0629 \u0643\u0627\u0641\u064a\u0629 \u0648\u0645\u062a\u0648\u0627\u0632\u0646\u0629 \u0644\u062d\u0645\u0627\u064a\u0629 \u0627\u0644\u0623\u0639\u0636\u0627\u0621 \u0627\u0644\u062d\u064a\u0648\u064a\u0629.'; }\r\n                else if (bfp < 14) { status = '\u0631\u064a\u0627\u0636\u064a'; color = '#22C55E'; colorClass = 'bg-success\/10 text-success border-success\/20'; advice = '\u0623\u062f\u0627\u0621 \u0628\u062f\u0646\u064a \u0645\u0645\u062a\u0627\u0632 \u0648\u0628\u0646\u064a\u0629 \u0639\u0636\u0644\u064a\u0629 \u0631\u0627\u0626\u0639\u0629\u060c \u0627\u0633\u062a\u0645\u0631 \u0641\u064a \u0627\u0644\u062d\u0641\u0627\u0638 \u0639\u0644\u0649 \u0647\u0630\u0627 \u0627\u0644\u0645\u0633\u062a\u0648\u0649 \u0627\u0644\u0635\u062d\u064a.'; }\r\n                else if (bfp < 18) { status = '\u0644\u064a\u0627\u0642\u0629'; color = '#A3BF64'; colorClass = 'bg-primary\/10 text-primary border-primary\/20'; advice = '\u0646\u0633\u0628\u0629 \u0645\u062b\u0627\u0644\u064a\u0629 \u062c\u062f\u0627\u064b \u0644\u0644\u0635\u062d\u0629 \u0627\u0644\u0639\u0627\u0645\u0629 \u0648\u0627\u0644\u0646\u0634\u0627\u0637 \u0627\u0644\u064a\u0648\u0645\u064a. \u0627\u0633\u062a\u0645\u0631 \u0639\u0644\u0649 \u0647\u0630\u0627 \u0627\u0644\u0646\u0645\u0637 \u0627\u0644\u0645\u0645\u062a\u0627\u0632.'; }\r\n                else if (bfp < 25) { status = '\u0645\u0642\u0628\u0648\u0644'; color = '#F59E0B'; colorClass = 'bg-warning\/10 text-warning border-warning\/20'; advice = '\u0646\u0633\u0628\u062a\u0643 \u062a\u0642\u0639 \u0641\u064a \u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0645\u062a\u0648\u0633\u0637 \u0627\u0644\u0645\u0642\u0628\u0648\u0644\u060c \u0645\u0645\u0627\u0631\u0633\u0629 \u062a\u0645\u0627\u0631\u064a\u0646 \u0627\u0644\u0645\u0642\u0627\u0648\u0645\u0629 \u0648\u0627\u0644\u0643\u0627\u0631\u062f\u064a\u0648 \u0633\u062a\u0633\u0627\u0639\u062f\u0643 \u0639\u0644\u0649 \u062a\u062d\u0633\u064a\u0646\u0647\u0627.'; }\r\n                else { status = '\u0633\u0645\u0646\u0629'; color = '#EF4444'; colorClass = 'bg-error\/10 text-error border-error\/20'; advice = '\u0627\u0644\u0646\u062a\u064a\u062c\u0629 \u062a\u0634\u064a\u0631 \u0644\u0627\u0631\u062a\u0641\u0627\u0639 \u0646\u0633\u0628\u0629 \u0627\u0644\u062f\u0647\u0648\u0646\u061b \u0646\u0646\u0635\u062d\u0643 \u0628\u062c\u062f\u0648\u0644\u0629 \u0641\u062d\u0635 \u0645\u062e\u0628\u0631\u064a \u0634\u0627\u0645\u0644 \u0648\u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0623\u062e\u0635\u0627\u0626\u064a \u0644\u0648\u0636\u0639 \u0628\u0631\u0646\u0627\u0645\u062c \u0645\u0646\u0627\u0633\u0628.'; }\r\n            } else {\r\n                if (bfp < 14) { status = '\u062f\u0647\u0648\u0646 \u0623\u0633\u0627\u0633\u064a\u0629'; color = '#3A428A'; colorClass = 'bg-secondary\/10 text-secondary border-secondary\/20'; advice = '\u0646\u0633\u0628\u0629 \u062f\u0647\u0648\u0646 \u0645\u0646\u062e\u0641\u0636\u0629 \u062c\u062f\u0627\u064b \u0628\u0627\u0644\u0646\u0633\u0628\u0629 \u0644\u0644\u0646\u0633\u0627\u0621\u060c \u0642\u062f \u062a\u0624\u062b\u0631 \u0639\u0644\u0649 \u0627\u0646\u062a\u0638\u0627\u0645 \u0627\u0644\u0647\u0631\u0645\u0648\u0646\u0627\u062a \u0648\u0627\u0644\u0648\u0638\u0627\u0626\u0641 \u0627\u0644\u062d\u064a\u0648\u064a\u0629.'; }\r\n                else if (bfp < 21) { status = '\u0631\u064a\u0627\u0636\u064a'; color = '#22C55E'; colorClass = 'bg-success\/10 text-success border-success\/20'; advice = '\u0645\u0633\u062a\u0648\u0649 \u0644\u064a\u0627\u0642\u0629 \u0639\u0627\u0644\u064d \u062c\u062f\u0627\u064b \u0648\u0643\u062a\u0644\u0629 \u0639\u0636\u0644\u064a\u0629 \u0645\u062a\u0646\u0627\u0633\u0642\u0629. \u062d\u0627\u0641\u0638\u064a \u0639\u0644\u0649 \u0647\u0630\u0627 \u0627\u0644\u0646\u0634\u0627\u0637.'; }\r\n                else if (bfp < 25) { status = '\u0644\u064a\u0627\u0642\u0629'; color = '#A3BF64'; colorClass = 'bg-primary\/10 text-primary border-primary\/20'; advice = '\u0646\u0633\u0628\u0629 \u062f\u0647\u0648\u0646 \u0635\u062d\u064a\u0629 \u0648\u0645\u062b\u0627\u0644\u064a\u0629 \u0648\u0645\u0646\u0627\u0633\u0628\u0629 \u062c\u062f\u0627\u064b \u0644\u0644\u062d\u064a\u0648\u064a\u0629 \u0648\u0627\u0644\u0631\u0634\u0627\u0642\u0629 \u0627\u0644\u0639\u0627\u0645\u0629.'; }\r\n                else if (bfp < 32) { status = '\u0645\u0642\u0628\u0648\u0644'; color = '#F59E0B'; colorClass = 'bg-warning\/10 text-warning border-warning\/20'; advice = '\u0641\u064a \u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0645\u0642\u0628\u0648\u0644 \u0648\u0644\u0643\u0646 \u064a\u0641\u0636\u0644 \u0632\u064a\u0627\u062f\u0629 \u0627\u0644\u0646\u0634\u0627\u0637 \u0627\u0644\u0628\u062f\u0646\u064a \u0627\u0644\u0645\u0639\u062a\u062f\u0644 \u0648\u0627\u0644\u062a\u062d\u0643\u0645 \u0641\u064a \u0643\u0645\u064a\u0627\u062a \u0627\u0644\u0648\u062c\u0628\u0627\u062a.'; }\r\n                else { status = '\u0633\u0645\u0646\u0629'; color = '#EF4444'; colorClass = 'bg-error\/10 text-error border-error\/20'; advice = '\u0627\u0644\u0646\u0633\u0628\u0629 \u0645\u0631\u062a\u0641\u0639\u0629 \u0648\u0642\u062f \u062a\u0632\u064a\u062f \u0645\u0646 \u0627\u0644\u0645\u062e\u0627\u0637\u0631 \u0627\u0644\u0635\u062d\u064a\u0629\u061b \u0646\u0646\u0635\u062d\u0643 \u0628\u0639\u0645\u0644 \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u062f\u0648\u0631\u064a\u0629 \u0648\u0645\u062a\u0627\u0628\u0639\u0629 \u0646\u0638\u0627\u0645 \u063a\u0630\u0627\u0626\u064a \u0645\u062a\u0643\u0627\u0645\u0644.'; }\r\n            }\r\n\r\n            resultStatus.innerText = status;\r\n            resultStatus.className = \"px-4 py-1.5 rounded-full text-sm font-bold border \" + colorClass;\r\n            \r\n            progressCircle.style.color = color;\r\n            \r\n            \/\/ Circle Progress Calculator: 2 * PI * r = 2 * 3.14159 * 80 = 502.65\r\n            const offset = 502.65 - (bfp \/ 60) * 502.65;\r\n            progressCircle.style.strokeDashoffset = offset;\r\n            \r\n            let pointerPos = (bfp \/ 60) * 100;\r\n            pointerPos = Math.min(100, Math.max(0, pointerPos));\r\n            pointer.style.right = pointerPos + '%';\r\n            \r\n            adviceText.innerText = advice;\r\n        }\r\n\r\n        function reset() {\r\n            document.querySelectorAll('input').forEach(i => i.value = '');\r\n            document.getElementById('input-view').classList.remove('hidden');\r\n            document.getElementById('result-view').classList.add('hidden');\r\n            document.getElementById('result-view').classList.remove('fade-enter-active');\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-bodyfat-iframe');\r\n    const blob = new Blob([bodyFatCalculatorHtml], { type: 'text\/html' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e30a5ff elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"e30a5ff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-pregnancy-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-pregnancy-iframe\" style=\"width: 100%; min-height: 860px; height: 860px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const pregnancyCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\",\r\n                    \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\",\r\n                    \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\",\r\n                    \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\",\r\n                    \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\",\r\n                    \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\",\r\n                    \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\",\r\n                    \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\",\r\n                    \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\",\r\n                    \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\",\r\n                    \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\",\r\n                    \"secondary\": \"#3A428A\",\r\n                    \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\",\r\n                    \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\",\r\n                    \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\",\r\n                    \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\",\r\n                    \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\",\r\n                    \"light-green\": \"#F5F8ED\",\r\n                    \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\",\r\n                    \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\",\r\n                    \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\",\r\n                    \"soft-bg\": \"#F8F9FC\",\r\n                    \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\",\r\n                    \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\",\r\n                    \"tertiary\": \"#854883\",\r\n                    \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\",\r\n                    \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\",\r\n                    \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\",\r\n                    \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": {\r\n                    \"DEFAULT\": \"0.25rem\",\r\n                    \"lg\": \"0.5rem\",\r\n                    \"xl\": \"12px\",\r\n                    \"2xl\": \"24px\",\r\n                    \"full\": \"9999px\"\r\n            },\r\n            \"fontFamily\": {\r\n                    \"cairo\": [\"Cairo\", \"sans-serif\"]\r\n            }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n\r\n        .bmi-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n\r\n        .material-symbols-outlined {\r\n            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\r\n            vertical-align: middle;\r\n        }\r\n\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator {\r\n            cursor: pointer;\r\n            opacity: 0.6;\r\n            transition: 0.2s;\r\n        }\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator:hover {\r\n            opacity: 1;\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- ============ INPUT VIEW ============ -->\r\n        <div class=\"flex flex-col w-full transition-all duration-300 opacity-100 transform translate-y-0\" id=\"view-input\">\r\n\r\n            <div class=\"p-8 pb-4 text-center\">\r\n                <div class=\"flex justify-center mb-4\">\r\n                    <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                        <span class=\"material-symbols-outlined text-primary text-3xl\">pregnant_woman<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0627\u0644\u062d\u0645\u0644 \u0628\u0627\u0644\u0623\u0633\u0627\u0628\u064a\u0639 \u0648\u0627\u0644\u0623\u0634\u0647\u0631<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u062a\u062a\u0628\u0639\u064a \u0645\u0631\u0627\u062d\u0644 \u062d\u0645\u0644\u0643 \u0628\u0643\u0644 \u062f\u0642\u0629 \u0648\u0623\u0645\u0627\u0646.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"px-8 pb-8\">\r\n                <div class=\"flex flex-col gap-6 w-full\">\r\n                    <div class=\"flex flex-col gap-2 w-full\">\r\n                        <label class=\"text-sm font-medium text-on-surface-variant px-1\" for=\"lmp-date\">\u062a\u0627\u0631\u064a\u062e \u0623\u0648\u0644 \u064a\u0648\u0645 \u0644\u0622\u062e\u0631 \u062f\u0648\u0631\u0629 \u0634\u0647\u0631\u064a\u0629<\/label>\r\n                        <input class=\"w-full h-[60px] rounded-xl border border-border-light bg-white text-on-surface px-4 text-lg focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"lmp-date\" required=\"\" type=\"date\"\/>\r\n                    <\/div>\r\n                    <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\" id=\"btn-calculate\">\r\n                        \u062a\u062a\u0628\u0639 \u062d\u0627\u0644\u0629 \u0627\u0644\u062d\u0645\u0644 \u0627\u0644\u0622\u0646\r\n                    <\/button>\r\n\r\n                    <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10\">\r\n                        <div class=\"flex items-start gap-3\">\r\n                            <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                            <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                                <strong>\u0644\u0645\u0627\u0630\u0627 \u062a\u062a\u0627\u0628\u0639\u064a\u0646 \u0623\u0633\u0627\u0628\u064a\u0639 \u0627\u0644\u062d\u0645\u0644\u061f<\/strong> \u0645\u0639\u0631\u0641\u0629 \u0627\u0644\u0623\u0633\u0628\u0648\u0639 \u0648\u0627\u0644\u0634\u0647\u0631 \u0627\u0644\u062d\u0627\u0644\u064a \u064a\u0633\u0627\u0639\u062f\u0643 \u0639\u0644\u0649 \u0641\u0647\u0645 \u0645\u0631\u062d\u0644\u0629 \u0646\u0645\u0648 \u0637\u0641\u0644\u0643\u060c \u0648\u0627\u0644\u0627\u0644\u062a\u0632\u0627\u0645 \u0628\u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0648\u0627\u0644\u062a\u062d\u0627\u0644\u064a\u0644 \u0627\u0644\u0645\u0648\u0635\u0649 \u0628\u0647\u0627 \u0641\u064a \u0643\u0644 \u062b\u0644\u062b \u0645\u0646 \u0627\u0644\u062d\u0645\u0644.\r\n                            <\/p>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- ============ RESULTS VIEW ============ -->\r\n        <div class=\"hidden flex-col w-full transition-all duration-300 opacity-0 transform translate-y-10 z-10 bg-white\" id=\"view-results\">\r\n\r\n            <div class=\"p-8 pb-4 text-center\">\r\n                <div class=\"flex justify-center mb-4\">\r\n                    <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                        <span class=\"material-symbols-outlined text-primary text-3xl\">monitoring<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0646\u062a\u0627\u0626\u062c \u0627\u0644\u062d\u0645\u0644<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0625\u0644\u064a\u0643\u0650 \u062a\u062a\u0628\u0639\u0627\u064b \u062a\u0641\u0635\u064a\u0644\u064a\u0627\u064b \u0644\u0645\u0631\u062d\u0644\u0629 \u062d\u0645\u0644\u0643 \u0627\u0644\u062d\u0627\u0644\u064a\u0629.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"px-8 pb-8\">\r\n\r\n                <div class=\"flex flex-col items-center justify-center py-2\">\r\n                    <div class=\"relative w-48 h-48 flex items-center justify-center\">\r\n                        <svg class=\"w-full h-full transform -rotate-90 drop-shadow-sm\" viewBox=\"0 0 100 100\">\r\n                            <circle cx=\"50\" cy=\"50\" fill=\"none\" r=\"42\" stroke=\"#E8ECF4\" stroke-linecap=\"round\" stroke-width=\"10\"><\/circle>\r\n                            <circle id=\"progress-circle\" class=\"transition-all duration-1000 ease-out\" cx=\"50\" cy=\"50\" fill=\"none\" r=\"42\" stroke=\"#A3BF64\" stroke-dasharray=\"264\" stroke-dashoffset=\"264\" stroke-linecap=\"round\" stroke-width=\"10\"><\/circle>\r\n                        <\/svg>\r\n                        <div class=\"absolute inset-0 flex flex-col items-center justify-center pt-2\">\r\n                            <span class=\"text-xs text-on-surface-variant font-bold mb-1\">\u0623\u0646\u062a\u0650 \u0627\u0644\u0622\u0646 \u0641\u064a<\/span>\r\n                            <span class=\"text-5xl text-secondary font-extrabold leading-none\" id=\"res-week-num\">12<\/span>\r\n                            <span class=\"text-sm text-on-surface font-bold mt-2\">\u0627\u0644\u0623\u0633\u0628\u0648\u0639<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <div class=\"mt-6 bg-surface-container-high text-secondary py-2 px-8 rounded-full inline-block font-bold text-sm shadow-sm\">\r\n                        <span id=\"res-month-num\">\u0627\u0644\u0634\u0647\u0631 \u0627\u0644\u062b\u0627\u0644\u062b<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"grid grid-cols-2 gap-4 mt-8\">\r\n                    <div class=\"bg-white p-4 rounded-xl border border-border-light flex flex-col gap-2 shadow-sm\">\r\n                        <div class=\"flex items-center gap-1 text-on-surface-variant text-xs font-bold\">\r\n                            <span class=\"material-symbols-outlined text-[16px] text-tertiary\">hourglass_top<\/span>\r\n                            \u0623\u064a\u0627\u0645 \u0645\u062a\u0628\u0642\u064a\u0629\r\n                        <\/div>\r\n                        <div class=\"font-bold text-on-surface text-base\" id=\"res-days-left\">196 \u064a\u0648\u0645<\/div>\r\n                    <\/div>\r\n\r\n                    <div class=\"bg-white p-4 rounded-xl border border-border-light flex flex-col gap-2 shadow-sm\">\r\n                        <div class=\"flex items-center gap-1 text-on-surface-variant text-xs font-bold\">\r\n                            <span class=\"material-symbols-outlined text-[16px] text-primary\">event<\/span>\r\n                            \u062a\u0627\u0631\u064a\u062e \u0627\u0644\u0648\u0644\u0627\u062f\u0629 \u0627\u0644\u0645\u062a\u0648\u0642\u0639\r\n                        <\/div>\r\n                        <div class=\"font-bold text-on-surface text-base\" id=\"res-due-date\">15 \u0623\u0643\u062a\u0648\u0628\u0631 2024<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"mt-6 bg-light-blue rounded-xl p-5 border-r-4 border-secondary relative\">\r\n                    <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                        <span class=\"material-symbols-outlined text-sm\">lightbulb<\/span>\r\n                        \u0646\u0635\u064a\u062d\u0629 \u0627\u0644\u0623\u0633\u0628\u0648\u0639\r\n                    <\/h3>\r\n                    <p class=\"text-sm text-on-surface-variant leading-relaxed\" id=\"res-advice\">\r\n                        \u0641\u064a \u0647\u0630\u0647 \u0627\u0644\u0645\u0631\u062d\u0644\u0629\u060c \u064a\u0628\u062f\u0623 \u0646\u0645\u0648 \u0623\u0639\u0636\u0627\u0621 \u0637\u0641\u0644\u0643 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629. \u0627\u062d\u0631\u0635\u064a \u0639\u0644\u0649 \u062a\u0646\u0627\u0648\u0644 \u062d\u0645\u0636 \u0627\u0644\u0641\u0648\u0644\u064a\u0643 \u0628\u0627\u0646\u062a\u0638\u0627\u0645 \u0648\u062a\u062c\u0646\u0628\u064a \u0627\u0644\u0625\u062c\u0647\u0627\u062f \u0627\u0644\u0628\u062f\u0646\u064a \u0627\u0644\u0634\u062f\u064a\u062f.\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-3 mt-6\">\r\n                    <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                        <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                        \u0627\u062d\u062c\u0632\u064a \u0641\u062d\u0648\u0635\u0627\u062a \u0645\u062a\u0627\u0628\u0639\u0629 \u0627\u0644\u062d\u0645\u0644\r\n                    <\/a>\r\n                    <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" id=\"btn-back\">\r\n                        <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                        \u0627\u0644\u0639\u0648\u062f\u0629 \u0644\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', () => {\r\n            const btnCalculate = document.getElementById('btn-calculate');\r\n            const btnBack = document.getElementById('btn-back');\r\n            const viewInput = document.getElementById('view-input');\r\n            const viewResults = document.getElementById('view-results');\r\n            const lmpDateInput = document.getElementById('lmp-date');\r\n            \r\n            const today = new Date().toISOString().split('T')[0];\r\n            if(lmpDateInput) lmpDateInput.setAttribute('max', today);\r\n\r\n            const arabicMonths = ['\u0627\u0644\u0623\u0648\u0644', '\u0627\u0644\u062b\u0627\u0646\u064a', '\u0627\u0644\u062b\u0627\u0644\u062b', '\u0627\u0644\u0631\u0627\u0628\u0639', '\u0627\u0644\u062e\u0627\u0645\u0633', '\u0627\u0644\u0633\u0627\u062f\u0633', '\u0627\u0644\u0633\u0627\u0628\u0639', '\u0627\u0644\u062b\u0627\u0645\u0646', '\u0627\u0644\u062a\u0627\u0633\u0639'];\r\n\r\n            function calculatePregnancy() {\r\n                const lmpDateStr = lmpDateInput.value;\r\n                if (!lmpDateStr) {\r\n                    lmpDateInput.classList.add('border-red-500');\r\n                    setTimeout(() => lmpDateInput.classList.remove('border-red-500'), 1000);\r\n                    return;\r\n                }\r\n\r\n                const lmpDate = new Date(lmpDateStr);\r\n                const currentDate = new Date();\r\n                const pregnancyDurationMs = 280 * 24 * 60 * 60 * 1000;\r\n                const dueDate = new Date(lmpDate.getTime() + pregnancyDurationMs);\r\n                \r\n                const elapsedMs = currentDate.getTime() - lmpDate.getTime();\r\n                const elapsedDays = Math.floor(elapsedMs \/ (1000 * 60 * 60 * 24));\r\n                \r\n                let currentWeek = Math.floor(elapsedDays \/ 7);\r\n                let daysLeft = 280 - elapsedDays;\r\n                \r\n                if (currentWeek < 0) currentWeek = 0;\r\n                if (currentWeek > 42) currentWeek = 42;\r\n                if (daysLeft < 0) daysLeft = 0;\r\n\r\n                let currentMonth = Math.floor(currentWeek \/ 4.33); \r\n                if (currentMonth < 1) currentMonth = 1;\r\n                if (currentMonth > 9) currentMonth = 9;\r\n\r\n                document.getElementById('res-week-num').textContent = currentWeek;\r\n                document.getElementById('res-month-num').textContent = \"\u0627\u0644\u0634\u0647\u0631 \" + (arabicMonths[currentMonth - 1] || '\u0627\u0644\u062a\u0627\u0633\u0639');\r\n                \r\n                const options = { year: 'numeric', month: 'long', day: 'numeric' };\r\n                document.getElementById('res-due-date').textContent = dueDate.toLocaleDateString('ar-SA', options);\r\n                document.getElementById('res-days-left').textContent = \\`\\${daysLeft} \u064a\u0648\u0645\\`;\r\n\r\n                const progressCircle = document.getElementById('progress-circle');\r\n                const circumference = 2 * Math.PI * 42; \r\n                const percent = Math.min((currentWeek \/ 40) * 100, 100);\r\n                const offset = circumference - (percent \/ 100) * circumference;\r\n                \r\n                setTimeout(() => {\r\n                    progressCircle.style.strokeDashoffset = offset;\r\n                }, 100);\r\n\r\n                const adviceEl = document.getElementById('res-advice');\r\n                if (currentWeek <= 13) {\r\n                    adviceEl.textContent = \"\u0641\u064a \u0647\u0630\u0647 \u0627\u0644\u0645\u0631\u062d\u0644\u0629 (\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u0623\u0648\u0644)\u060c \u064a\u0628\u062f\u0623 \u0646\u0645\u0648 \u0623\u0639\u0636\u0627\u0621 \u0637\u0641\u0644\u0643 \u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629. \u0627\u062d\u0631\u0635\u064a \u0639\u0644\u0649 \u062a\u0646\u0627\u0648\u0644 \u062d\u0645\u0636 \u0627\u0644\u0641\u0648\u0644\u064a\u0643 \u0628\u0627\u0646\u062a\u0638\u0627\u0645 \u0648\u062a\u062c\u0646\u0628\u064a \u0627\u0644\u0625\u062c\u0647\u0627\u062f \u0627\u0644\u0628\u062f\u0646\u064a.\";\r\n                } else if (currentWeek <= 27) {\r\n                    adviceEl.textContent = \"\u0623\u0646\u062a\u0650 \u0627\u0644\u0622\u0646 \u0641\u064a \u0627\u0644\u062b\u0644\u062b \u0627\u0644\u062b\u0627\u0646\u064a\u060c \u0648\u0647\u064a \u0645\u0631\u062d\u0644\u0629 \u0646\u0645\u0648 \u0633\u0631\u064a\u0639 \u0644\u0637\u0641\u0644\u0643. \u062d\u0627\u0641\u0638\u064a \u0639\u0644\u0649 \u0646\u0638\u0627\u0645 \u063a\u0630\u0627\u0626\u064a \u0645\u062a\u0648\u0627\u0632\u0646 \u0648\u0627\u0634\u0631\u0628\u064a \u0643\u0645\u064a\u0627\u062a \u0643\u0627\u0641\u064a\u0629 \u0645\u0646 \u0627\u0644\u0645\u0627\u0621.\";\r\n                } else {\r\n                    adviceEl.textContent = \"\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u0623\u062e\u064a\u0631! \u0637\u0641\u0644\u0643 \u064a\u0643\u062a\u0633\u0628 \u0648\u0632\u0646\u0627\u064b \u0633\u0631\u064a\u0639\u0627\u064b \u0627\u0633\u062a\u0639\u062f\u0627\u062f\u0627\u064b \u0644\u0644\u0648\u0644\u0627\u062f\u0629. \u062e\u0635\u0635\u064a \u0648\u0642\u062a\u0627\u064b \u0644\u0644\u0631\u0627\u062d\u0629 \u0648\u0627\u0633\u062a\u0639\u062f\u064a \u0644\u064a\u0648\u0645\u0643 \u0627\u0644\u0643\u0628\u064a\u0631.\";\r\n                }\r\n\r\n                viewInput.classList.remove('opacity-100', 'translate-y-0');\r\n                viewInput.classList.add('opacity-0', '-translate-y-10');\r\n                \r\n                setTimeout(() => {\r\n                    viewInput.classList.add('hidden');\r\n                    viewResults.classList.remove('hidden');\r\n                    requestAnimationFrame(() => {\r\n                        viewResults.classList.remove('opacity-0', 'translate-y-10');\r\n                        viewResults.classList.add('opacity-100', 'translate-y-0');\r\n                    });\r\n                }, 300);\r\n            }\r\n\r\n            function goBack() {\r\n                const progressCircle = document.getElementById('progress-circle');\r\n                progressCircle.style.strokeDashoffset = 264;\r\n\r\n                viewResults.classList.remove('opacity-100', 'translate-y-0');\r\n                viewResults.classList.add('opacity-0', 'translate-y-10');\r\n                \r\n                setTimeout(() => {\r\n                    viewResults.classList.add('hidden');\r\n                    viewInput.classList.remove('hidden');\r\n                    requestAnimationFrame(() => {\r\n                        viewInput.classList.remove('opacity-0', '-translate-y-10');\r\n                        viewInput.classList.add('opacity-100', 'translate-y-0');\r\n                    });\r\n                }, 300);\r\n            }\r\n\r\n            if(btnCalculate) btnCalculate.addEventListener('click', calculatePregnancy);\r\n            if(btnBack) btnBack.addEventListener('click', goBack);\r\n        });\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-pregnancy-iframe');\r\n    const blob = new Blob([pregnancyCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f85b135 elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"f85b135\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-ovulation-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-ovulation-iframe\" style=\"width: 100%; min-height: 820px; height: 820px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const ovulationCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\",\r\n                    \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\",\r\n                    \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\",\r\n                    \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\",\r\n                    \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\",\r\n                    \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\",\r\n                    \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\",\r\n                    \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\",\r\n                    \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\",\r\n                    \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\",\r\n                    \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\",\r\n                    \"secondary\": \"#3A428A\",\r\n                    \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\",\r\n                    \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\",\r\n                    \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\",\r\n                    \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\",\r\n                    \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\",\r\n                    \"light-green\": \"#F5F8ED\",\r\n                    \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\",\r\n                    \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\",\r\n                    \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\",\r\n                    \"soft-bg\": \"#F8F9FC\",\r\n                    \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\",\r\n                    \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\",\r\n                    \"tertiary\": \"#854883\",\r\n                    \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\",\r\n                    \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\",\r\n                    \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\",\r\n                    \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": {\r\n                    \"DEFAULT\": \"0.25rem\",\r\n                    \"lg\": \"0.5rem\",\r\n                    \"xl\": \"12px\",\r\n                    \"2xl\": \"24px\",\r\n                    \"full\": \"9999px\"\r\n            },\r\n            \"fontFamily\": {\r\n                    \"cairo\": [\"Cairo\", \"sans-serif\"]\r\n            }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n\r\n        .bmi-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n\r\n        .material-symbols-outlined {\r\n            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\r\n            vertical-align: middle;\r\n        }\r\n\r\n        \/* \u0622\u0644\u064a\u0627\u062a \u062a\u0628\u062f\u064a\u0644 \u0627\u0644\u0639\u0631\u0636 (\u0645\u0631\u062a\u0628\u0637\u0629 \u0628\u0645\u0646\u0637\u0642 JS \u2014 \u062a\u064f\u0631\u0643\u062a \u0643\u0645\u0627 \u0647\u064a) *\/\r\n        .fade-enter { opacity: 0; transform: translateY(10px); }\r\n        .fade-enter-active { opacity: 1; transform: translateY(0); transition: opacity 400ms, transform 400ms; }\r\n        .fade-exit { opacity: 1; transform: translateY(0); }\r\n        .fade-exit-active { opacity: 0; transform: translateY(-10px); transition: opacity 300ms, transform 300ms; }\r\n\r\n        ::-webkit-scrollbar { width: 0px; background: transparent; }\r\n\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: 0.6; transition: 0.2s; }\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- Header (shared) -->\r\n        <div class=\"p-8 pb-4 text-center\">\r\n            <div class=\"flex justify-center mb-4\">\r\n                <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                    <span class=\"material-symbols-outlined text-primary text-3xl\">calendar_month<\/span>\r\n                <\/div>\r\n            <\/div>\r\n            <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0627\u0644\u062a\u0628\u0648\u064a\u0636 \u0648\u0623\u064a\u0627\u0645 \u0627\u0644\u062e\u0635\u0648\u0628\u0629<\/h1>\r\n            <p class=\"text-on-surface-variant text-sm\">\u062a\u062d\u062f\u064a\u062f \u0623\u064a\u0627\u0645 \u0627\u0644\u062e\u0635\u0648\u0628\u0629 \u0627\u0644\u0639\u0627\u0644\u064a\u0629 \u0628\u062f\u0642\u0629 \u0648\u0633\u0647\u0648\u0644\u0629.<\/p>\r\n        <\/div>\r\n\r\n        <!-- Body -->\r\n        <div class=\"px-8 pb-8\">\r\n\r\n            <!-- VIEW 1: INPUT FORM -->\r\n            <div class=\"flex flex-col gap-6 fade-enter-active\" id=\"input-view\">\r\n                <div class=\"flex flex-col gap-2\">\r\n                    <label class=\"text-sm font-medium text-on-surface-variant px-1\" for=\"last-period-date\">\u062a\u0627\u0631\u064a\u062e \u0623\u0648\u0644 \u064a\u0648\u0645 \u0644\u0622\u062e\u0631 \u062f\u0648\u0631\u0629 \u0634\u0647\u0631\u064a\u0629<\/label>\r\n                    <input class=\"h-[60px] w-full rounded-xl border border-border-light bg-white px-4 text-lg text-on-surface focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"last-period-date\" required=\"\" type=\"date\"\/>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-2 relative\">\r\n                    <label class=\"text-sm font-medium text-on-surface-variant px-1\" for=\"cycle-length\">\u0645\u062a\u0648\u0633\u0637 \u0637\u0648\u0644 \u0627\u0644\u062f\u0648\u0631\u0629 \u0627\u0644\u0634\u0647\u0631\u064a\u0629<\/label>\r\n                    <div class=\"relative\">\r\n                        <select class=\"h-[60px] w-full rounded-xl border border-border-light bg-white pr-4 pl-10 text-lg text-on-surface appearance-none cursor-pointer focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"cycle-length\">\r\n                            <!-- Options generated by JS -->\r\n                        <\/select>\r\n                        <div class=\"pointer-events-none absolute top-0 left-0 h-[60px] flex items-center px-4 text-on-surface-variant\">\r\n                            <span class=\"material-symbols-outlined\">expand_more<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center\" id=\"calculate-btn\">\r\n                    \u0627\u062d\u0633\u0628\u064a \u0623\u064a\u0627\u0645 \u0627\u0644\u062e\u0635\u0648\u0628\u0629 \u0627\u0644\u0622\u0646\r\n                <\/button>\r\n\r\n                <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10\">\r\n                    <div class=\"flex items-start gap-3\">\r\n                        <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                        <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                            <strong>\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u062a\u062d\u062f\u064a\u062f \u0623\u064a\u0627\u0645 \u0627\u0644\u062a\u0628\u0648\u064a\u0636\u061f<\/strong> \u0645\u0639\u0631\u0641\u0629 \u0646\u0627\u0641\u0630\u0629 \u0627\u0644\u062e\u0635\u0648\u0628\u0629 \u0627\u0644\u0639\u0627\u0644\u064a\u0629 \u062a\u0633\u0627\u0639\u062f\u0643 \u0639\u0644\u0649 \u0627\u0644\u062a\u062e\u0637\u064a\u0637 \u0627\u0644\u0623\u0645\u062b\u0644\u060c \u0648\u062a\u064f\u0639\u062f \u062e\u0637\u0648\u0629 \u0623\u0648\u0644\u0649 \u0645\u0647\u0645\u0629 \u0639\u0646\u062f \u0627\u0644\u062a\u0641\u0643\u064a\u0631 \u0641\u064a \u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u062e\u0635\u0648\u0628\u0629 \u0648\u0627\u0644\u0647\u0631\u0645\u0648\u0646\u0627\u062a \u0644\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u0635\u0648\u0631\u0629 \u062f\u0642\u064a\u0642\u0629 \u0639\u0646 \u0635\u062d\u062a\u0643 \u0627\u0644\u0625\u0646\u062c\u0627\u0628\u064a\u0629.\r\n                        <\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- VIEW 2: RESULTS -->\r\n            <div class=\"flex flex-col gap-6 hidden fade-enter\" id=\"results-view\">\r\n\r\n                <div class=\"flex flex-col items-center justify-center pt-2\">\r\n                    <div class=\"w-32 h-32 rounded-full border-4 border-light-green relative flex flex-col items-center justify-center mb-4 bg-white shadow-sm\">\r\n                        <svg class=\"absolute inset-0 w-full h-full -rotate-90\" viewbox=\"0 0 100 100\">\r\n                            <circle cx=\"50\" cy=\"50\" fill=\"none\" r=\"46\" stroke=\"#F5F8ED\" stroke-width=\"8\"><\/circle>\r\n                            <circle class=\"transition-all duration-1000 ease-out\" cx=\"50\" cy=\"50\" fill=\"none\" id=\"gauge-fill\" r=\"46\" stroke=\"#A3BF64\" stroke-dasharray=\"289\" stroke-dashoffset=\"100\" stroke-width=\"8\"><\/circle>\r\n                        <\/svg>\r\n                        <span class=\"text-sm text-on-surface-variant font-medium z-10\">\u064a\u0648\u0645 \u0627\u0644\u062a\u0628\u0648\u064a\u0636<\/span>\r\n                        <span class=\"text-xl font-bold text-secondary z-10 mt-1\" id=\"ovulation-date-display\">--<\/span>\r\n                    <\/div>\r\n                    <span class=\"px-4 py-1.5 bg-success\/10 text-success font-bold rounded-full text-sm border border-success\/20\">\u0623\u064a\u0627\u0645 \u062e\u0635\u0648\u0628\u0629 \u0639\u0627\u0644\u064a\u0629<\/span>\r\n                <\/div>\r\n\r\n                <!-- Window Info -->\r\n                <div class=\"bg-light-blue rounded-xl p-4 border border-secondary\/10 flex flex-col gap-3\">\r\n                    <div class=\"flex justify-between items-center text-sm\">\r\n                        <span class=\"text-on-surface-variant\">\u0646\u0627\u0641\u0630\u0629 \u0627\u0644\u062e\u0635\u0648\u0628\u0629:<\/span>\r\n                        <span class=\"font-bold text-on-surface\" id=\"fertile-window-display\">-- \u0625\u0644\u0649 --<\/span>\r\n                    <\/div>\r\n                    <div class=\"w-full h-2 rounded-full bg-surface-variant relative overflow-hidden\">\r\n                        <div class=\"absolute right-[20%] w-[30%] h-full bg-gradient-to-r from-primary\/40 via-primary to-primary\/40 rounded-full\"><\/div>\r\n                    <\/div>\r\n                    <div class=\"flex justify-between text-xs text-outline\">\r\n                        <span>\u0623\u064a\u0627\u0645 \u0622\u0645\u0646\u0629<\/span>\r\n                        <span class=\"text-primary font-bold\">\u062e\u0635\u0648\u0628\u0629<\/span>\r\n                        <span>\u0623\u064a\u0627\u0645 \u0622\u0645\u0646\u0629<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Advice Box -->\r\n                <div class=\"bg-light-blue rounded-xl p-5 border-r-4 border-secondary\">\r\n                    <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                        <span class=\"material-symbols-outlined text-sm\">health_and_safety<\/span>\r\n                        \u0646\u0635\u064a\u062d\u0629 \u0637\u0628\u064a\u0629\r\n                    <\/h3>\r\n                    <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                        \u0644\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u062a\u0642\u064a\u064a\u0645 \u062f\u0642\u064a\u0642 \u0644\u062e\u0635\u0648\u0628\u062a\u0643\u060c \u064a\u064f\u0646\u0635\u062d \u0628\u0625\u062c\u0631\u0627\u0621 \u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u0647\u0631\u0645\u0648\u0646\u0627\u062a \u0627\u0644\u0634\u0627\u0645\u0644\u0629 (\u0645\u062b\u0644 \u0641\u062d\u0635 \u0647\u0631\u0645\u0648\u0646 \u0627\u0644\u0628\u0631\u0648\u062c\u0633\u062a\u0631\u0648\u0646 \u0648\u0641\u062d\u0635 \u0645\u062e\u0632\u0648\u0646 \u0627\u0644\u0645\u0628\u064a\u0636 AMH) \u0641\u064a \u0645\u062e\u062a\u0628\u0631\u0627\u062a \u062f\u0644\u062a\u0627 \u0627\u0644\u0637\u0628\u064a\u0629.\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-3\">\r\n                    <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                        <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                        \u0627\u062d\u062c\u0632\u064a \u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u062e\u0635\u0648\u0628\u0629 \u0648\u0627\u0644\u0647\u0631\u0645\u0648\u0646\u0627\u062a\r\n                    <\/a>\r\n                    <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" id=\"recalculate-btn\">\r\n                        <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                        \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', () => {\r\n            \/\/ Elements\r\n            const selectCycleLength = document.getElementById('cycle-length');\r\n            const inputDate = document.getElementById('last-period-date');\r\n            const btnCalculate = document.getElementById('calculate-btn');\r\n            const btnRecalculate = document.getElementById('recalculate-btn');\r\n            \r\n            const viewInput = document.getElementById('input-view');\r\n            const viewResults = document.getElementById('results-view');\r\n            \r\n            const displayOvulation = document.getElementById('ovulation-date-display');\r\n            const displayWindow = document.getElementById('fertile-window-display');\r\n            const gaugeFill = document.getElementById('gauge-fill');\r\n\r\n            \/\/ Populate Cycle Length Options (22 to 45, default 28)\r\n            for (let i = 22; i <= 45; i++) {\r\n                const option = document.createElement('option');\r\n                option.value = i;\r\n                option.textContent = \\`\\${i} \u064a\u0648\u0645\\`;\r\n                if (i === 28) option.selected = true;\r\n                selectCycleLength.appendChild(option);\r\n            }\r\n\r\n            \/\/ Set default date to today for convenience\r\n            const today = new Date().toISOString().split('T')[0];\r\n            inputDate.value = today;\r\n\r\n            \/\/ Date Formatting utility (Arabic)\r\n            const formatDateAr = (date) => {\r\n                const options = { day: 'numeric', month: 'long', year: 'numeric' };\r\n                return new Intl.DateTimeFormat('ar-EG', options).format(date);\r\n            };\r\n\r\n            \/\/ Calculate Logic\r\n            const calculateFertility = () => {\r\n                const startDateStr = inputDate.value;\r\n                const cycleLength = parseInt(selectCycleLength.value, 10);\r\n\r\n                if (!startDateStr) {\r\n                    alert(\"\u0627\u0644\u0631\u062c\u0627\u0621 \u0625\u062f\u062e\u0627\u0644 \u062a\u0627\u0631\u064a\u062e \u0623\u0648\u0644 \u064a\u0648\u0645 \u0644\u0622\u062e\u0631 \u062f\u0648\u0631\u0629 \u0634\u0647\u0631\u064a\u0629.\");\r\n                    return;\r\n                }\r\n\r\n                const startDate = new Date(startDateStr);\r\n                \r\n                \/\/ Luteal phase is generally 14 days\r\n                const lutealPhase = 14;\r\n                \r\n                \/\/ Ovulation is cycle length - luteal phase\r\n                const ovulationDayOffset = cycleLength - lutealPhase;\r\n                \r\n                \/\/ Calculate Ovulation Date\r\n                const ovulationDate = new Date(startDate);\r\n                ovulationDate.setDate(startDate.getDate() + ovulationDayOffset);\r\n\r\n                \/\/ Calculate Fertile Window (typically 5 days before + day of ovulation)\r\n                const fertileStart = new Date(ovulationDate);\r\n                fertileStart.setDate(ovulationDate.getDate() - 5);\r\n                \r\n                const fertileEnd = new Date(ovulationDate);\r\n                fertileEnd.setDate(ovulationDate.getDate() + 1);\r\n\r\n                \/\/ Update UI\r\n                displayOvulation.textContent = formatDateAr(ovulationDate).split(' ').slice(0,2).join(' '); \/\/ Just Day & Month to fit\r\n                displayWindow.textContent = \\`\\${formatDateAr(fertileStart).split(' ').slice(0,2).join(' ')} - \\${formatDateAr(fertileEnd).split(' ').slice(0,2).join(' ')}\\`;\r\n\r\n                \/\/ Switch Views with Transition\r\n                switchView(viewInput, viewResults, () => {\r\n                    \/\/ Animate gauge\r\n                    setTimeout(() => {\r\n                        gaugeFill.style.strokeDashoffset = '70'; \/\/ Arbitrary filled state\r\n                    }, 100);\r\n                });\r\n            };\r\n\r\n            \/\/ Reset Logic\r\n            const resetCalculator = () => {\r\n                gaugeFill.style.strokeDashoffset = '289'; \/\/ Reset gauge\r\n                switchView(viewResults, viewInput);\r\n            };\r\n\r\n            \/\/ View Switcher Utility\r\n            const switchView = (hideEl, showEl, callback) => {\r\n                \/\/ Exit current\r\n                hideEl.classList.remove('fade-enter-active');\r\n                hideEl.classList.add('fade-exit-active');\r\n                \r\n                setTimeout(() => {\r\n                    hideEl.classList.add('hidden');\r\n                    hideEl.classList.remove('fade-exit-active');\r\n                    \r\n                    \/\/ Enter new\r\n                    showEl.classList.remove('hidden');\r\n                    showEl.classList.add('fade-enter');\r\n                    \r\n                    \/\/ Trigger reflow\r\n                    void showEl.offsetWidth;\r\n                    \r\n                    showEl.classList.remove('fade-enter');\r\n                    showEl.classList.add('fade-enter-active');\r\n                    \r\n                    if (callback) callback();\r\n                }, 300); \/\/ Matches CSS transition duration\r\n            };\r\n\r\n            \/\/ Event Listeners\r\n            btnCalculate.addEventListener('click', calculateFertility);\r\n            btnRecalculate.addEventListener('click', resetCalculator);\r\n        });\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-ovulation-iframe');\r\n    const blob = new Blob([ovulationCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0522e4c elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"0522e4c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-duedate-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-duedate-iframe\" style=\"width: 100%; min-height: 880px; height: 880px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const dueDateCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\",\r\n                    \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\",\r\n                    \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\",\r\n                    \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\",\r\n                    \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\",\r\n                    \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\",\r\n                    \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\",\r\n                    \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\",\r\n                    \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\",\r\n                    \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\",\r\n                    \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\",\r\n                    \"secondary\": \"#3A428A\",\r\n                    \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\",\r\n                    \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\",\r\n                    \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\",\r\n                    \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\",\r\n                    \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\",\r\n                    \"light-green\": \"#F5F8ED\",\r\n                    \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\",\r\n                    \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\",\r\n                    \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\",\r\n                    \"soft-bg\": \"#F8F9FC\",\r\n                    \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\",\r\n                    \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\",\r\n                    \"tertiary\": \"#854883\",\r\n                    \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\",\r\n                    \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\",\r\n                    \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\",\r\n                    \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": {\r\n                    \"DEFAULT\": \"0.25rem\",\r\n                    \"lg\": \"0.5rem\",\r\n                    \"xl\": \"12px\",\r\n                    \"2xl\": \"24px\",\r\n                    \"full\": \"9999px\"\r\n            },\r\n            \"fontFamily\": {\r\n                    \"cairo\": [\"Cairo\", \"sans-serif\"]\r\n            }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n\r\n        .bmi-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n\r\n        .material-symbols-outlined {\r\n            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\r\n            vertical-align: middle;\r\n        }\r\n\r\n        \/* \u0639\u0646\u0627\u0635\u0631 \u0628\u0635\u0631\u064a\u0629 \u062e\u0627\u0635\u0629 \u0628\u062d\u0627\u0633\u0628\u0629 \u0627\u0644\u0648\u0644\u0627\u062f\u0629 (\u0645\u0631\u062a\u0628\u0637\u0629 \u0628\u0645\u0646\u0637\u0642 JS \u2014 \u062a\u064f\u0631\u0643\u062a \u0643\u0645\u0627 \u0647\u064a) *\/\r\n        .circular-chart { display: block; margin: 10px auto; max-width: 80%; max-height: 250px; }\r\n        .circle-bg { fill: none; stroke: #E8ECF4; stroke-width: 3.8; }\r\n        .circle { fill: none; stroke-width: 2.8; stroke-linecap: round; transition: stroke-dasharray 1s ease-out; }\r\n        .percentage { fill: #3A428A; font-weight: 700; font-size: 0.5em; text-anchor: middle; }\r\n\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: 0.6; transition: 0.2s; }\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- ============ INPUT VIEW ============ -->\r\n        <div class=\"flex flex-col w-full transition-all duration-300 opacity-100 transform translate-y-0\" id=\"input-view\">\r\n\r\n            <div class=\"p-8 pb-4 text-center\">\r\n                <div class=\"flex justify-center mb-4\">\r\n                    <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                        <span class=\"material-symbols-outlined text-primary text-3xl\">child_care<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0645\u0648\u0639\u062f \u0627\u0644\u0648\u0644\u0627\u062f\u0629 \u0627\u0644\u0645\u062a\u0648\u0642\u0639<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u062a\u0639\u0631\u0641\u064a \u0639\u0644\u0649 \u0627\u0644\u0645\u0648\u0639\u062f \u0627\u0644\u062a\u0642\u0631\u064a\u0628\u064a \u0648\u0627\u0644\u0645\u0631\u0627\u062d\u0644 \u0627\u0644\u0623\u0633\u0627\u0633\u064a\u0629 \u0644\u0627\u0633\u062a\u0642\u0628\u0627\u0644 \u0637\u0641\u0644\u0643.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"px-8 pb-8\">\r\n                <form class=\"space-y-6\" id=\"calculator-form\">\r\n                    <div class=\"space-y-2\">\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant\" for=\"lmp-date\">\u062a\u0627\u0631\u064a\u062e \u0623\u0648\u0644 \u064a\u0648\u0645 \u0644\u0622\u062e\u0631 \u062f\u0648\u0631\u0629 \u0634\u0647\u0631\u064a\u0629<\/label>\r\n                        <input class=\"w-full h-[60px] border border-border-light rounded-xl px-4 text-lg text-on-surface focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"lmp-date\" required=\"\" type=\"date\"\/>\r\n                    <\/div>\r\n\r\n                    <div class=\"space-y-2 relative\">\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant\" for=\"cycle-length\">\u0645\u062a\u0648\u0633\u0637 \u0637\u0648\u0644 \u0627\u0644\u062f\u0648\u0631\u0629 \u0627\u0644\u0634\u0647\u0631\u064a\u0629<\/label>\r\n                        <select class=\"w-full h-[60px] border border-border-light rounded-xl pr-4 pl-10 text-lg text-on-surface appearance-none focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"cycle-length\" required=\"\">\r\n                            <\/select>\r\n                        <div class=\"pointer-events-none absolute bottom-0 left-0 h-[60px] flex items-center px-4 text-on-surface-variant\">\r\n                            <span class=\"material-symbols-outlined\">expand_more<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90\" type=\"submit\">\r\n                        \u0627\u062d\u0633\u0628 \u0627\u0644\u0645\u0648\u0639\u062f \u0627\u0644\u0622\u0646\r\n                    <\/button>\r\n\r\n                    <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10\">\r\n                        <div class=\"flex items-start gap-3\">\r\n                            <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                            <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                                <strong>\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u0647\u0630\u0627 \u0627\u0644\u062d\u0633\u0627\u0628\u061f<\/strong> \u062a\u062d\u062f\u064a\u062f \u0645\u0648\u0639\u062f \u0627\u0644\u0648\u0644\u0627\u062f\u0629 \u0627\u0644\u0645\u062a\u0648\u0642\u0639 \u064a\u0633\u0627\u0639\u062f\u0643 \u0639\u0644\u0649 \u0645\u062a\u0627\u0628\u0639\u0629 \u0645\u0631\u0627\u062d\u0644 \u062d\u0645\u0644\u0643 \u0628\u062f\u0642\u0629\u060c \u0648\u062c\u062f\u0648\u0644\u0629 \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u062f\u0648\u0631\u064a\u0629 \u0641\u064a \u0648\u0642\u062a\u0647\u0627 \u0627\u0644\u0645\u0646\u0627\u0633\u0628\u060c \u0648\u0627\u0644\u0627\u0633\u062a\u0639\u062f\u0627\u062f \u0627\u0644\u0645\u0628\u0643\u0631 \u0644\u0627\u0633\u062a\u0642\u0628\u0627\u0644 \u0645\u0648\u0644\u0648\u062f\u0643 \u0628\u0623\u0645\u0627\u0646 \u0648\u0627\u0637\u0645\u0626\u0646\u0627\u0646.\r\n                            <\/p>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/form>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- ============ RESULTS VIEW ============ -->\r\n        <div class=\"hidden flex-col w-full transition-all duration-300 opacity-0 transform translate-y-10\" id=\"results-view\">\r\n\r\n            <div class=\"p-8 pb-4 text-center\">\r\n                <div class=\"flex justify-center mb-4\">\r\n                    <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                        <span class=\"material-symbols-outlined text-primary text-3xl\">calendar_month<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0645\u0648\u0639\u062f \u0627\u0644\u0648\u0644\u0627\u062f\u0629 \u0627\u0644\u0645\u062a\u0648\u0642\u0639<\/h1>\r\n                <p class=\"text-2xl font-bold text-secondary\" id=\"due-date-result\"><\/p>\r\n            <\/div>\r\n\r\n            <div class=\"px-8 pb-8\">\r\n\r\n                <div class=\"relative w-full aspect-square max-h-[250px] mx-auto mb-10 flex items-center justify-center\">\r\n                    <svg class=\"circular-chart w-full h-full\" viewBox=\"0 0 36 36\">\r\n                        <path class=\"circle-bg\" d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\"><\/path>\r\n                        <path class=\"circle\" id=\"progress-circle\" d=\"M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831\" stroke=\"#A3BF64\" stroke-dasharray=\"0, 100\"><\/path>\r\n                        <text class=\"percentage\" id=\"weeks-pregnant\" x=\"18\" y=\"16.5\" style=\"font-size: 6px; fill: #3A428A; font-weight: bold;\"><\/text>\r\n                        <text class=\"percentage\" x=\"18\" y=\"21.5\" style=\"font-size: 3px; fill: #757969;\">\u0623\u0633\u0628\u0648\u0639 \u062d\u0627\u0645\u0644<\/text>\r\n                    <\/svg>\r\n\r\n                    <div class=\"absolute -bottom-4 left-1\/2 -translate-x-1\/2 bg-surface-container-high px-6 py-2 rounded-full shadow-sm text-sm font-bold text-secondary whitespace-nowrap\" id=\"trimester-badge\">\r\n                        <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"mb-8 px-2 mt-4\">\r\n                    <div class=\"h-3 w-full bg-[#E8ECF4] rounded-full overflow-hidden relative\">\r\n                        <div class=\"absolute top-0 right-0 h-full bg-gradient-to-l from-primary to-[#8EB04F] rounded-full transition-all duration-1000 ease-out\" id=\"linear-progress\" style=\"width: 0%;\"><\/div>\r\n                    <\/div>\r\n                    <div class=\"flex justify-between text-[10px] text-on-surface-variant mt-2 font-medium\">\r\n                        <span>\u0627\u0644\u0628\u062f\u0627\u064a\u0629<\/span>\r\n                        <span>\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u0623\u0648\u0644<\/span>\r\n                        <span>\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u062b\u0627\u0646\u064a<\/span>\r\n                        <span>\u0627\u0644\u0646\u0647\u0627\u064a\u0629<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"bg-light-blue rounded-xl p-5 border-r-4 border-secondary mb-6\">\r\n                    <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                        <span class=\"material-symbols-outlined text-sm\">info<\/span>\r\n                        \u0645\u0644\u0627\u062d\u0638\u0629 \u0647\u0627\u0645\u0629\r\n                    <\/h3>\r\n                    <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                        \u0647\u0630\u0647 \u0627\u0644\u062d\u0627\u0633\u0628\u0629 \u062a\u0648\u0641\u0631 \u0645\u0648\u0639\u062f\u0627\u064b \u062a\u0642\u0631\u064a\u0628\u064a\u0627\u064b \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u062f\u0648\u0631\u062a\u0643 \u0627\u0644\u0634\u0647\u0631\u064a\u0629. \u064a\u064f\u0631\u062c\u0649 \u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0637\u0628\u064a\u0628\u0643 \u0627\u0644\u0645\u062e\u062a\u0635 \u0644\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u0645\u062a\u0627\u0628\u0639\u0629 \u062f\u0642\u064a\u0642\u0629 \u0644\u0645\u0631\u0627\u062d\u0644 \u062d\u0645\u0644\u0643.\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-3\">\r\n                    <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                        <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                        \u0627\u062d\u062c\u0632\u064a \u0641\u062d\u0648\u0635\u0627\u062a \u0645\u062a\u0627\u0628\u0639\u0629 \u0627\u0644\u062d\u0645\u0644\r\n                    <\/a>\r\n                    <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" id=\"recalculate-btn\">\r\n                        <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                        \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', () => {\r\n            const cycleSelect = document.getElementById('cycle-length');\r\n            for (let i = 22; i <= 45; i++) {\r\n                const option = document.createElement('option');\r\n                option.value = i;\r\n                option.textContent = \\`\\${i} \u064a\u0648\u0645\\`;\r\n                if (i === 28) option.selected = true;\r\n                cycleSelect.appendChild(option);\r\n            }\r\n\r\n            const form = document.getElementById('calculator-form');\r\n            const inputView = document.getElementById('input-view');\r\n            const resultsView = document.getElementById('results-view');\r\n            const recalculateBtn = document.getElementById('recalculate-btn');\r\n\r\n            const formatDate = (date) => {\r\n                return new Intl.DateTimeFormat('ar-SA', {\r\n                    weekday: 'long',\r\n                    year: 'numeric',\r\n                    month: 'long',\r\n                    day: 'numeric'\r\n                }).format(date);\r\n            };\r\n\r\n            const calculateDueDetails = (lmpDate, cycleLength) => {\r\n                const lmp = new Date(lmpDate);\r\n                const cycleAdjustment = cycleLength - 28;\r\n                \r\n                const edd = new Date(lmp);\r\n                edd.setDate(lmp.getDate() + 280 + cycleAdjustment);\r\n                \r\n                const today = new Date();\r\n                const diffTime = today.getTime() - lmp.getTime();\r\n                const diffDays = Math.floor(diffTime \/ (1000 * 60 * 60 * 24));\r\n                \r\n                let currentWeek = Math.floor(diffDays \/ 7);\r\n                if(currentWeek < 0) currentWeek = 0;\r\n                if(currentWeek > 42) currentWeek = 42;\r\n\r\n                let percentage = (currentWeek \/ 40) * 100;\r\n                if(percentage > 100) percentage = 100;\r\n                if(percentage < 0) percentage = 0;\r\n\r\n                let trimester = \"\";\r\n                if (currentWeek < 13) trimester = \"\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u0623\u0648\u0644\";\r\n                else if (currentWeek < 27) trimester = \"\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u062b\u0627\u0646\u064a\";\r\n                else trimester = \"\u0627\u0644\u062b\u0644\u062b \u0627\u0644\u0623\u062e\u064a\u0631\";\r\n\r\n                return { edd, currentWeek, percentage, trimester };\r\n            };\r\n\r\n            form.addEventListener('submit', (e) => {\r\n                e.preventDefault();\r\n                \r\n                const lmpDate = document.getElementById('lmp-date').value;\r\n                const cycleLength = parseInt(document.getElementById('cycle-length').value, 10);\r\n                \r\n                if (!lmpDate) return;\r\n\r\n                const details = calculateDueDetails(lmpDate, cycleLength);\r\n                \r\n                document.getElementById('due-date-result').textContent = formatDate(details.edd);\r\n                document.getElementById('weeks-pregnant').textContent = details.currentWeek;\r\n                document.getElementById('trimester-badge').textContent = details.trimester;\r\n                \r\n                inputView.classList.remove('opacity-100', 'translate-y-0');\r\n                inputView.classList.add('opacity-0', '-translate-y-10');\r\n                \r\n                setTimeout(() => {\r\n                    inputView.classList.add('hidden');\r\n                    resultsView.classList.remove('hidden');\r\n                    \r\n                    requestAnimationFrame(() => {\r\n                        resultsView.classList.remove('opacity-0', 'translate-y-10');\r\n                        resultsView.classList.add('opacity-100', 'translate-y-0');\r\n                        \r\n                        setTimeout(() => {\r\n                            document.getElementById('progress-circle').setAttribute('stroke-dasharray', \\`\\${details.percentage}, 100\\`);\r\n                            document.getElementById('linear-progress').style.width = \\`\\${details.percentage}%\\`;\r\n                        }, 100);\r\n                    });\r\n                }, 300);\r\n            });\r\n\r\n            recalculateBtn.addEventListener('click', () => {\r\n                document.getElementById('progress-circle').setAttribute('stroke-dasharray', \\`0, 100\\`);\r\n                document.getElementById('linear-progress').style.width = \\`0%\\`;\r\n\r\n                resultsView.classList.remove('opacity-100', 'translate-y-0');\r\n                resultsView.classList.add('opacity-0', 'translate-y-10');\r\n                \r\n                setTimeout(() => {\r\n                    resultsView.classList.add('hidden');\r\n                    inputView.classList.remove('hidden');\r\n                    \r\n                    requestAnimationFrame(() => {\r\n                        inputView.classList.remove('opacity-0', '-translate-y-10');\r\n                        inputView.classList.add('opacity-100', 'translate-y-0');\r\n                    });\r\n                }, 300);\r\n            });\r\n        });\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-duedate-iframe');\r\n    const blob = new Blob([dueDateCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b08bb63 elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"b08bb63\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-ibw-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-ibw-iframe\" style=\"width: 100%; min-height: 840px; height: 840px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const ibwCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\",\r\n                    \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\",\r\n                    \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\",\r\n                    \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\",\r\n                    \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\",\r\n                    \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\",\r\n                    \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\",\r\n                    \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\",\r\n                    \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\",\r\n                    \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\",\r\n                    \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\",\r\n                    \"secondary\": \"#3A428A\",\r\n                    \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\",\r\n                    \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\",\r\n                    \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\",\r\n                    \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\",\r\n                    \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\",\r\n                    \"light-green\": \"#F5F8ED\",\r\n                    \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\",\r\n                    \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\",\r\n                    \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\",\r\n                    \"soft-bg\": \"#F8F9FC\",\r\n                    \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\",\r\n                    \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\",\r\n                    \"tertiary\": \"#854883\",\r\n                    \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\",\r\n                    \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\",\r\n                    \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\",\r\n                    \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": {\r\n                    \"DEFAULT\": \"0.25rem\",\r\n                    \"lg\": \"0.5rem\",\r\n                    \"xl\": \"12px\",\r\n                    \"2xl\": \"24px\",\r\n                    \"full\": \"9999px\"\r\n            },\r\n            \"fontFamily\": {\r\n                    \"cairo\": [\"Cairo\", \"sans-serif\"],\r\n                    \"card-title\": [\"Cairo\", \"sans-serif\"],\r\n                    \"body-lg\": [\"Cairo\", \"sans-serif\"],\r\n                    \"small-text\": [\"Cairo\", \"sans-serif\"],\r\n                    \"caption\": [\"Cairo\", \"sans-serif\"]\r\n            },\r\n            \"fontSize\": {\r\n                    \"card-title\": [\"22px\", { lineHeight: \"1.4\", fontWeight: \"600\" }],\r\n                    \"body-lg\": [\"18px\", { lineHeight: \"1.6\", fontWeight: \"400\" }],\r\n                    \"small-text\": [\"16px\", { lineHeight: \"1.5\", fontWeight: \"500\" }],\r\n                    \"caption\": [\"14px\", { lineHeight: \"1.4\", fontWeight: \"400\" }]\r\n            }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n\r\n        .bmi-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n\r\n        \/* \u0627\u0644\u0632\u0631 \u0627\u0644\u0646\u0634\u0637 \u0641\u064a \u0645\u0641\u062a\u0627\u062d \u0627\u0644\u062c\u0646\u0633: \u062d\u0628\u0629 \u062e\u0636\u0631\u0627\u0621 \u0628\u0646\u0635 \u0623\u0628\u064a\u0636 (\u0645\u0637\u0627\u0628\u0642\u0629 \u0644\u0644\u0645\u0631\u062c\u0639) *\/\r\n        #gender-slider { background: #A3BF64 !important; }\r\n        #btn-male.text-primary-container,\r\n        #btn-female.text-primary-container { color: #ffffff !important; }\r\n\r\n        \/* \u0644\u0648\u0646 \u0627\u0644\u0646\u0635 \u0627\u0644\u062a\u0648\u0636\u064a\u062d\u064a \u0644\u0644\u062d\u0642\u0648\u0644 (\u0645\u0637\u0627\u0628\u0642 \u0644\u0644\u0645\u0631\u062c\u0639) *\/\r\n        #height-input::placeholder,\r\n        #weight-input::placeholder { color: #757969; opacity: 1; }\r\n\r\n        .material-symbols-outlined {\r\n            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\r\n            vertical-align: middle;\r\n        }\r\n\r\n        \/* \u0625\u062e\u0641\u0627\u0621 \u0623\u0633\u0647\u0645 \u062d\u0642\u0644 \u0627\u0644\u0623\u0631\u0642\u0627\u0645 *\/\r\n        input[type=\"number\"]::-webkit-inner-spin-button,\r\n        input[type=\"number\"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }\r\n        input[type=\"number\"] { -moz-appearance: textfield; }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- ============ INPUT VIEW ============ -->\r\n        <div class=\"transition-all duration-300\" id=\"input-view\">\r\n\r\n            <div class=\"p-8 pb-4 text-center\">\r\n                <div class=\"flex justify-center mb-4\">\r\n                    <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                        <span class=\"material-symbols-outlined text-primary text-3xl\">accessibility_new<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0627\u062d\u0633\u0628 \u0648\u0632\u0646\u0643 \u0627\u0644\u0645\u062b\u0627\u0644\u064a \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0637\u0648\u0644\u0643 \u0648\u062c\u0646\u0633\u0643.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"px-8 pb-8\">\r\n\r\n                <!-- Gender Toggle -->\r\n                <div class=\"bg-surface p-1 rounded-full flex mb-6 relative border border-border-light\">\r\n                    <div class=\"absolute inset-y-1 w-[calc(50%-4px)] bg-white rounded-full shadow-sm transition-transform duration-300 ease-out\" id=\"gender-slider\" style=\"right: 4px;\"><\/div>\r\n                    <button class=\"relative z-10 flex-1 py-3 flex items-center justify-center gap-2 text-primary-container font-bold text-sm transition-colors\" id=\"btn-male\" onclick=\"selectGender('male')\" type=\"button\">\r\n                        <span class=\"material-symbols-outlined\">man<\/span>\r\n                        \u0630\u0643\u0631\r\n                    <\/button>\r\n                    <button class=\"relative z-10 flex-1 py-3 flex items-center justify-center gap-2 text-on-surface-variant font-bold text-sm transition-colors\" id=\"btn-female\" onclick=\"selectGender('female')\" type=\"button\">\r\n                        <span class=\"material-symbols-outlined\">woman<\/span>\r\n                        \u0623\u0646\u062b\u0649\r\n                    <\/button>\r\n                <\/div>\r\n\r\n                <!-- Inputs -->\r\n                <div class=\"grid grid-cols-2 gap-4 mb-6\">\r\n                    <div>\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant mb-2\">\u0627\u0644\u0637\u0648\u0644 (\u0633\u0645)<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-4 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface text-right\" dir=\"rtl\" id=\"height-input\" placeholder=\"\u0627\u0644\u0637\u0648\u0644 \u0628\u0627\u0644\u0633\u0646\u062a\u064a\u0645\u062a\u0631\" type=\"number\"\/>\r\n                        <span class=\"text-error text-xs hidden mt-1\" id=\"height-error\">\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u0637\u0648\u0644 \u0635\u062d\u064a\u062d<\/span>\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant mb-2\">\u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u062d\u0627\u0644\u064a (\u0643\u062c\u0645)<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-4 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface text-right\" dir=\"rtl\" id=\"weight-input\" placeholder=\"\u0627\u0644\u0648\u0632\u0646 \u0643\u062c\u0645\" type=\"number\"\/>\r\n                        <span class=\"text-error text-xs hidden mt-1\" id=\"weight-error\">\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u0648\u0632\u0646 \u0635\u062d\u064a\u062d<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\" onclick=\"calculateIBW()\">\r\n                    \u0627\u062d\u0633\u0628 \u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a \u0627\u0644\u0622\u0646\r\n                <\/button>\r\n\r\n                <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10 mt-6\">\r\n                    <div class=\"flex items-start gap-3\">\r\n                        <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                        <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                            <strong>\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u0645\u0639\u0631\u0641\u0629 \u0648\u0632\u0646\u0643 \u0627\u0644\u0645\u062b\u0627\u0644\u064a\u061f<\/strong> \u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a \u0645\u0624\u0634\u0631 \u0645\u0631\u062c\u0639\u064a \u064a\u0633\u0627\u0639\u062f\u0643 \u0639\u0644\u0649 \u062a\u0642\u064a\u064a\u0645 \u0648\u0636\u0639\u0643 \u0627\u0644\u062d\u0627\u0644\u064a \u0645\u0642\u0627\u0631\u0646\u0629 \u0628\u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0635\u062d\u064a \u0627\u0644\u0645\u0648\u0635\u0649 \u0628\u0647 \u0644\u0637\u0648\u0644\u0643 \u0648\u062c\u0646\u0633\u0643\u060c \u0648\u064a\u064f\u0639\u062f \u0646\u0642\u0637\u0629 \u0627\u0646\u0637\u0644\u0627\u0642 \u062c\u064a\u062f\u0629 \u0644\u0645\u062a\u0627\u0628\u0639\u0629 \u0635\u062d\u062a\u0643 \u0628\u0634\u0643\u0644 \u0623\u062f\u0642.\r\n                        <\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <!-- ============ RESULT VIEW ============ -->\r\n        <div class=\"hidden opacity-0 transition-all duration-300\" id=\"result-view\">\r\n\r\n            <div class=\"p-8 pb-4 text-center\">\r\n                <div class=\"flex justify-center mb-4\">\r\n                    <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                        <span class=\"material-symbols-outlined text-primary text-3xl\">monitoring<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0627\u0644\u0646\u062a\u064a\u062c\u0629<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0625\u0644\u064a\u0643 \u062a\u0642\u062f\u064a\u0631 \u0648\u0632\u0646\u0643 \u0627\u0644\u0645\u062b\u0627\u0644\u064a \u0648\u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0635\u062d\u064a \u0627\u0644\u0645\u0648\u0635\u0649 \u0628\u0647.<\/p>\r\n            <\/div>\r\n\r\n            <div class=\"px-8 pb-8 flex flex-col items-center\">\r\n\r\n                <div class=\"relative w-48 h-48 mb-6 flex items-center justify-center\">\r\n                    <svg class=\"w-full h-full transform -rotate-90\" viewbox=\"0 0 100 100\">\r\n                        <circle cx=\"50\" cy=\"50\" fill=\"none\" r=\"45\" stroke=\"#F5F8ED\" stroke-linecap=\"round\" stroke-width=\"8\"><\/circle>\r\n                        <circle class=\"transition-all duration-1000 ease-out\" cx=\"50\" cy=\"50\" fill=\"none\" r=\"45\" stroke=\"#A3BF64\" stroke-dasharray=\"282.7\" stroke-dashoffset=\"70\" stroke-linecap=\"round\" stroke-width=\"8\"><\/circle>\r\n                    <\/svg>\r\n                    <div class=\"absolute inset-0 flex flex-col items-center justify-center\">\r\n                        <span class=\"text-xs text-on-surface-variant mb-1\">\u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a<\/span>\r\n                        <span class=\"text-[28px] font-extrabold text-primary leading-none mb-1\" id=\"ibw-result\">--<\/span>\r\n                        <span class=\"text-sm text-on-surface-variant\">\u0643\u062c\u0645<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Status Badge -->\r\n                <div class=\"px-4 py-2 rounded-full bg-light-green text-primary-container font-small-text text-small-text mb-8 border border-primary-container\/20\" id=\"status-badge\">\r\n                    \u0648\u0632\u0646 \u0645\u062b\u0627\u0644\u064a \u0635\u062d\u064a\r\n                <\/div>\r\n\r\n                <!-- Range Info Box -->\r\n                <div class=\"w-full bg-light-blue rounded-xl p-5 border-r-4 border-secondary\">\r\n                    <div class=\"flex justify-between items-center mb-2\">\r\n                        <span class=\"text-sm text-on-surface-variant\">\u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0635\u062d\u064a \u0627\u0644\u0645\u0648\u0635\u0649 \u0628\u0647:<\/span>\r\n                        <span class=\"text-lg font-bold text-secondary\" id=\"range-result\">--<\/span>\r\n                    <\/div>\r\n                    <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                        \u0647\u0630\u0627 \u0627\u0644\u0646\u0637\u0627\u0642 \u0645\u0628\u0646\u064a \u0639\u0644\u0649 \u0645\u0639\u0627\u062f\u0644\u0629 \u062f\u064a\u0641\u064a\u0646 (Devine Formula) \u0644\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a\u060c \u0648\u0647\u064a \u062a\u0642\u062f\u064a\u0631 \u0639\u0627\u0645. \u0642\u062f \u064a\u062e\u062a\u0644\u0641 \u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u0645\u062b\u0627\u0644\u064a \u0627\u0644\u0641\u0639\u0644\u064a \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u062a\u0643\u0648\u064a\u0646 \u0627\u0644\u062c\u0633\u0645 \u0648\u0643\u062a\u0644\u0629 \u0627\u0644\u0639\u0636\u0644\u0627\u062a.\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-3 w-full mt-6\">\r\n                    <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                        <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                        \u0627\u062d\u062c\u0632 \u0641\u062d\u0635\u0643 \u0627\u0644\u0645\u062e\u0628\u0631\u064a \u0627\u0644\u0634\u0627\u0645\u0644\r\n                    <\/a>\r\n                    <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" onclick=\"resetCalculator()\">\r\n                        <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                        \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        let currentGender = 'male';\r\n\r\n        function selectGender(gender) {\r\n            currentGender = gender;\r\n            const slider = document.getElementById('gender-slider');\r\n            const btnMale = document.getElementById('btn-male');\r\n            const btnFemale = document.getElementById('btn-female');\r\n\r\n            if (gender === 'male') {\r\n                slider.style.transform = 'translateX(0)';\r\n                btnMale.classList.replace('text-on-surface-variant', 'text-primary-container');\r\n                btnFemale.classList.replace('text-primary-container', 'text-on-surface-variant');\r\n            } else {\r\n                slider.style.transform = 'translateX(-100%)';\r\n                btnFemale.classList.replace('text-on-surface-variant', 'text-primary-container');\r\n                btnMale.classList.replace('text-primary-container', 'text-on-surface-variant');\r\n            }\r\n        }\r\n\r\n        function calculateIBW() {\r\n            const heightInput = document.getElementById('height-input');\r\n            const weightInput = document.getElementById('weight-input');\r\n            const heightError = document.getElementById('height-error');\r\n            const weightError = document.getElementById('weight-error');\r\n\r\n            const heightCm = parseFloat(heightInput.value);\r\n            const currentWeight = parseFloat(weightInput.value);\r\n\r\n            let isValid = true;\r\n\r\n            if (!heightCm || heightCm < 100 || heightCm > 250) {\r\n                heightError.classList.remove('hidden');\r\n                heightInput.classList.add('border-error');\r\n                isValid = false;\r\n            } else {\r\n                heightError.classList.add('hidden');\r\n                heightInput.classList.remove('border-error');\r\n            }\r\n\r\n            if (!currentWeight || currentWeight < 30 || currentWeight > 300) {\r\n                weightError.classList.remove('hidden');\r\n                weightInput.classList.add('border-error');\r\n                isValid = false;\r\n            } else {\r\n                weightError.classList.add('hidden');\r\n                weightInput.classList.remove('border-error');\r\n            }\r\n\r\n            if (!isValid) return;\r\n\r\n            \/\/ Devine Formula\r\n            \/\/ Male: 50.0 kg + 2.3 kg per inch over 5 feet\r\n            \/\/ Female: 45.5 kg + 2.3 kg per inch over 5 feet\r\n            \/\/ 5 feet = 60 inches = 152.4 cm\r\n            \/\/ 1 inch = 2.54 cm\r\n\r\n            let ibw = 0;\r\n            const baseHeightCm = 152.4;\r\n            const heightDiffInches = (heightCm - baseHeightCm) \/ 2.54;\r\n\r\n            if (currentGender === 'male') {\r\n                ibw = 50.0 + (2.3 * Math.max(0, heightDiffInches));\r\n            } else {\r\n                ibw = 45.5 + (2.3 * Math.max(0, heightDiffInches));\r\n            }\r\n\r\n            \/\/ Calculate range (+\/- 10%)\r\n            const lowerBound = (ibw * 0.9).toFixed(1);\r\n            const upperBound = (ibw * 1.1).toFixed(1);\r\n            const formattedIbw = ibw.toFixed(1);\r\n\r\n            \/\/ Determine Status\r\n            let status = \"\u0648\u0632\u0646 \u0645\u062b\u0627\u0644\u064a\";\r\n            let statusColor = \"bg-light-green text-primary-container border-primary-container\/20\";\r\n            \r\n            if (currentWeight < lowerBound) {\r\n                status = \"\u0648\u0632\u0646 \u0623\u0642\u0644 \u0645\u0646 \u0627\u0644\u0637\u0628\u064a\u0639\u064a\";\r\n                statusColor = \"bg-surface-container-high text-secondary border-secondary\/20\";\r\n            } else if (currentWeight > upperBound) {\r\n                status = \"\u0648\u0632\u0646 \u0632\u0627\u0626\u062f\";\r\n                statusColor = \"bg-error-container text-on-error-container border-error\/20\";\r\n            }\r\n\r\n            \/\/ Update UI\r\n            document.getElementById('ibw-result').textContent = formattedIbw;\r\n            document.getElementById('range-result').textContent = \\`\\${lowerBound} - \\${upperBound} \u0643\u062c\u0645\\`;\r\n            \r\n            const badge = document.getElementById('status-badge');\r\n            badge.textContent = status;\r\n            badge.className = \\`px-4 py-2 rounded-full font-small-text text-small-text mb-8 border \\${statusColor}\\`;\r\n\r\n            \/\/ Transition Views\r\n            showResult();\r\n        }\r\n\r\n        function showResult() {\r\n            const inputView = document.getElementById('input-view');\r\n            const resultView = document.getElementById('result-view');\r\n\r\n            inputView.style.opacity = '0';\r\n            setTimeout(() => {\r\n                inputView.classList.add('hidden');\r\n                resultView.classList.remove('hidden');\r\n                \/\/ Force reflow\r\n                void resultView.offsetWidth;\r\n                resultView.style.opacity = '1';\r\n                resultView.classList.remove('pointer-events-none');\r\n            }, 300);\r\n        }\r\n\r\n        function resetCalculator() {\r\n            const inputView = document.getElementById('input-view');\r\n            const resultView = document.getElementById('result-view');\r\n\r\n            resultView.style.opacity = '0';\r\n            setTimeout(() => {\r\n                resultView.classList.add('hidden');\r\n                inputView.classList.remove('hidden');\r\n                \/\/ Force reflow\r\n                void inputView.offsetWidth;\r\n                inputView.style.opacity = '1';\r\n            }, 300);\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-ibw-iframe');\r\n    const blob = new Blob([ibwCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c01d510 elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"c01d510\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-calorie-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-calorie-iframe\" style=\"width: 100%; min-height: 880px; height: 880px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const calorieCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\",\r\n                    \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\",\r\n                    \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\",\r\n                    \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\",\r\n                    \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\",\r\n                    \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\",\r\n                    \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\",\r\n                    \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\",\r\n                    \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\",\r\n                    \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\",\r\n                    \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\",\r\n                    \"secondary\": \"#3A428A\",\r\n                    \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\",\r\n                    \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\",\r\n                    \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\",\r\n                    \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\",\r\n                    \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\",\r\n                    \"light-green\": \"#F5F8ED\",\r\n                    \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\",\r\n                    \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\",\r\n                    \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\",\r\n                    \"soft-bg\": \"#F8F9FC\",\r\n                    \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\",\r\n                    \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\",\r\n                    \"tertiary\": \"#854883\",\r\n                    \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\",\r\n                    \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\",\r\n                    \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\",\r\n                    \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": {\r\n                    \"DEFAULT\": \"0.25rem\",\r\n                    \"lg\": \"0.5rem\",\r\n                    \"xl\": \"12px\",\r\n                    \"2xl\": \"24px\",\r\n                    \"full\": \"9999px\"\r\n            },\r\n            \"fontFamily\": {\r\n                    \"cairo\": [\"Cairo\", \"sans-serif\"]\r\n            }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif;\r\n            background: transparent !important;\r\n            margin: 0;\r\n            padding: 10px;\r\n            display: flex;\r\n            justify-content: center;\r\n            align-items: flex-start;\r\n        }\r\n\r\n        .bmi-card {\r\n            transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);\r\n            box-shadow: 0 10px 30px rgba(0,0,0,.05);\r\n        }\r\n\r\n        .delta-gradient-btn {\r\n            background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%);\r\n        }\r\n\r\n        \/* \u0627\u0644\u0632\u0631 \u0627\u0644\u0646\u0634\u0637 \u0641\u064a \u0645\u0641\u062a\u0627\u062d \u0627\u0644\u062c\u0646\u0633: \u062d\u0628\u0629 \u062e\u0636\u0631\u0627\u0621 \u0628\u0646\u0635 \u0623\u0628\u064a\u0636 *\/\r\n        #gender-slider { background: #A3BF64; }\r\n        #btn-male.gender-active,\r\n        #btn-female.gender-active { color: #ffffff; }\r\n\r\n        .material-symbols-outlined {\r\n            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;\r\n            vertical-align: middle;\r\n        }\r\n\r\n        #height-input::placeholder,\r\n        #weight-input::placeholder,\r\n        #age-input::placeholder { color: #757969; opacity: 1; }\r\n\r\n        input[type=\"number\"]::-webkit-inner-spin-button,\r\n        input[type=\"number\"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }\r\n        input[type=\"number\"] { -moz-appearance: textfield; }\r\n\r\n        [data-state] { display: none; }\r\n        [data-state=\"active\"] { display: block; animation: fadeIn 0.4s ease-out; }\r\n        @keyframes fadeIn {\r\n            from { opacity: 0; transform: translateY(10px); }\r\n            to { opacity: 1; transform: translateY(0); }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- Header -->\r\n        <div class=\"p-8 pb-4 text-center\">\r\n            <div class=\"flex justify-center mb-4\">\r\n                <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                    <span class=\"material-symbols-outlined text-primary text-3xl\" id=\"header-icon\">local_fire_department<\/span>\r\n                <\/div>\r\n            <\/div>\r\n            <div data-state=\"active\" id=\"pre-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0627\u0644\u0633\u0639\u0631\u0627\u062a \u0627\u0644\u062d\u0631\u0627\u0631\u064a\u0629<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0627\u062d\u0633\u0628 \u0627\u062d\u062a\u064a\u0627\u062c\u0643 \u0627\u0644\u064a\u0648\u0645\u064a \u0645\u0646 \u0627\u0644\u0633\u0639\u0631\u0627\u062a \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0646\u0634\u0627\u0637\u0643.<\/p>\r\n            <\/div>\r\n            <div data-state=\"hidden\" id=\"result-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0627\u062d\u062a\u064a\u0627\u062c\u0643 \u0627\u0644\u064a\u0648\u0645\u064a<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0625\u0644\u064a\u0643 \u062a\u0642\u062f\u064a\u0631 \u0633\u0639\u0631\u0627\u062a\u0643 \u0627\u0644\u062d\u0631\u0627\u0631\u064a\u0629 \u0627\u0644\u064a\u0648\u0645\u064a\u0629 \u062d\u0633\u0628 \u0647\u062f\u0641\u0643.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"px-8 pb-8\">\r\n\r\n            <!-- ============ INPUT VIEW ============ -->\r\n            <div data-state=\"active\" id=\"calculator-view\">\r\n\r\n                <!-- Gender Toggle -->\r\n                <div class=\"bg-surface p-1 rounded-full flex mb-6 relative border border-border-light\">\r\n                    <div class=\"absolute inset-y-1 w-[calc(50%-4px)] rounded-full shadow-sm transition-transform duration-300 ease-out\" id=\"gender-slider\" style=\"right: 4px;\"><\/div>\r\n                    <button class=\"relative z-10 flex-1 py-3 flex items-center justify-center gap-2 font-bold text-sm transition-colors gender-active text-white\" id=\"btn-male\" onclick=\"selectGender('male')\" type=\"button\">\r\n                        <span class=\"material-symbols-outlined\">man<\/span>\r\n                        \u0630\u0643\u0631\r\n                    <\/button>\r\n                    <button class=\"relative z-10 flex-1 py-3 flex items-center justify-center gap-2 font-bold text-sm transition-colors text-on-surface-variant\" id=\"btn-female\" onclick=\"selectGender('female')\" type=\"button\">\r\n                        <span class=\"material-symbols-outlined\">woman<\/span>\r\n                        \u0623\u0646\u062b\u0649\r\n                    <\/button>\r\n                <\/div>\r\n\r\n                <!-- Inputs row: \u0627\u0644\u0639\u0645\u0631 \/ \u0627\u0644\u0648\u0632\u0646 \/ \u0627\u0644\u0637\u0648\u0644 -->\r\n                <div class=\"grid grid-cols-3 gap-3 mb-6\">\r\n                    <div>\r\n                        <label class=\"block text-xs font-medium text-on-surface-variant mb-2 text-center\">\u0627\u0644\u0639\u0645\u0631<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-2 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface text-center\" id=\"age-input\" placeholder=\"\u0627\u0644\u0633\u0646\u0648\u0627\u062a\" type=\"number\"\/>\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-xs font-medium text-on-surface-variant mb-2 text-center\">\u0627\u0644\u0648\u0632\u0646 (\u0643\u062c\u0645)<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-2 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface text-center\" id=\"weight-input\" placeholder=\"\u0643\u062c\u0645\" type=\"number\"\/>\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-xs font-medium text-on-surface-variant mb-2 text-center\">\u0627\u0644\u0637\u0648\u0644 (\u0633\u0645)<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-2 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface text-center\" id=\"height-input\" placeholder=\"\u0633\u0645\" type=\"number\"\/>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Activity Level -->\r\n                <div class=\"relative mb-6\">\r\n                    <label class=\"block text-sm font-medium text-on-surface-variant mb-2\" for=\"activity-level\">\u0645\u0633\u062a\u0648\u0649 \u0627\u0644\u0646\u0634\u0627\u0637<\/label>\r\n                    <div class=\"relative\">\r\n                        <select class=\"w-full h-[60px] rounded-xl border border-border-light bg-white pr-4 pl-10 text-base text-on-surface appearance-none cursor-pointer focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"activity-level\">\r\n                            <option value=\"1.2\">\u062e\u0627\u0645\u0644 (\u0642\u0644\u064a\u0644 \u0645\u0646 \u0627\u0644\u062a\u0645\u0627\u0631\u064a\u0646 \u0623\u0648 \u0628\u062f\u0648\u0646\u0647\u0627)<\/option>\r\n                            <option value=\"1.375\">\u0646\u0634\u0627\u0637 \u062e\u0641\u064a\u0641 (\u062a\u0645\u0627\u0631\u064a\u0646 1-3 \u0623\u064a\u0627\u0645 \u0623\u0633\u0628\u0648\u0639\u064a\u0627\u064b)<\/option>\r\n                            <option value=\"1.55\">\u0646\u0634\u0627\u0637 \u0645\u062a\u0648\u0633\u0637 (\u062a\u0645\u0627\u0631\u064a\u0646 3-5 \u0623\u064a\u0627\u0645 \u0623\u0633\u0628\u0648\u0639\u064a\u0627\u064b)<\/option>\r\n                            <option value=\"1.725\">\u0646\u0634\u0627\u0637 \u0639\u0627\u0644\u064d (\u062a\u0645\u0627\u0631\u064a\u0646 6-7 \u0623\u064a\u0627\u0645 \u0623\u0633\u0628\u0648\u0639\u064a\u0627\u064b)<\/option>\r\n                            <option value=\"1.9\">\u0646\u0634\u0627\u0637 \u0634\u062f\u064a\u062f \u062c\u062f\u0627\u064b (\u0639\u0645\u0644 \u0628\u062f\u0646\u064a + \u062a\u0645\u0627\u0631\u064a\u0646 \u0645\u0643\u062b\u0641\u0629)<\/option>\r\n                        <\/select>\r\n                        <div class=\"pointer-events-none absolute top-0 left-0 h-[60px] flex items-center px-4 text-on-surface-variant\">\r\n                            <span class=\"material-symbols-outlined\">expand_more<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\" onclick=\"calculateCalories()\">\r\n                    \u0627\u062d\u0633\u0628 \u0627\u0644\u0633\u0639\u0631\u0627\u062a \u0627\u0644\u0622\u0646\r\n                <\/button>\r\n\r\n                <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10 mt-6\">\r\n                    <div class=\"flex items-start gap-3\">\r\n                        <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                        <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                            <strong>\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u0647\u0630\u0627 \u0627\u0644\u062d\u0633\u0627\u0628\u061f<\/strong> \u062a\u0648\u0627\u0632\u0646 \u0627\u0644\u0633\u0639\u0631\u0627\u062a \u0627\u0644\u062d\u0631\u0627\u0631\u064a\u0629 \u0647\u0648 \u0627\u0644\u0645\u0641\u062a\u0627\u062d \u0644\u0625\u062f\u0627\u0631\u0629 \u0627\u0644\u0648\u0632\u0646 \u0628\u0635\u062d\u0629. \u0645\u0639\u0631\u0641\u0629 \u0627\u062d\u062a\u064a\u0627\u062c\u0643 \u0627\u0644\u064a\u0648\u0645\u064a \u064a\u0633\u0627\u0639\u062f \u0645\u062e\u062a\u0635\u064a\u0646\u0627 \u0641\u064a \u062a\u0642\u062f\u064a\u0645 \u062a\u062d\u0627\u0644\u064a\u0644 \u0647\u0631\u0645\u0648\u0646\u064a\u0629 \u0648\u062a\u063a\u0630\u0648\u064a\u0629 \u0623\u0643\u062b\u0631 \u062f\u0642\u0629 \u0644\u0643.\r\n                        <\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- ============ RESULT VIEW ============ -->\r\n            <div data-state=\"hidden\" id=\"result-view\">\r\n\r\n                <div class=\"flex flex-col items-center\">\r\n\r\n                    <!-- Circular gauge -->\r\n                    <div class=\"relative w-48 h-48 mb-6 flex items-center justify-center\">\r\n                        <svg class=\"w-full h-full transform -rotate-90\" viewbox=\"0 0 100 100\">\r\n                            <circle cx=\"50\" cy=\"50\" fill=\"none\" r=\"45\" stroke=\"#F5F8ED\" stroke-linecap=\"round\" stroke-width=\"8\"><\/circle>\r\n                            <circle class=\"transition-all duration-1000 ease-out\" cx=\"50\" cy=\"50\" fill=\"none\" id=\"gauge-fill\" r=\"45\" stroke=\"#A3BF64\" stroke-dasharray=\"282.7\" stroke-dashoffset=\"70\" stroke-linecap=\"round\" stroke-width=\"8\"><\/circle>\r\n                        <\/svg>\r\n                        <div class=\"absolute inset-0 flex flex-col items-center justify-center\">\r\n                            <span class=\"text-xs text-on-surface-variant mb-1\">\u0633\u0639\u0631\u0627\u062a\u0643 \u0627\u0644\u064a\u0648\u0645\u064a\u0629<\/span>\r\n                            <span class=\"text-4xl font-extrabold text-primary leading-none mb-1\" id=\"calorie-result\">--<\/span>\r\n                            <span class=\"text-sm text-on-surface-variant\">\u0633\u0639\u0631\u0629 \/ \u064a\u0648\u0645<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Goal breakdown -->\r\n                    <div class=\"w-full grid grid-cols-1 gap-3 mb-6\">\r\n                        <div class=\"flex items-center justify-between bg-light-green rounded-xl p-4 border border-primary\/10\">\r\n                            <div class=\"flex items-center gap-2\">\r\n                                <span class=\"material-symbols-outlined text-primary\">balance<\/span>\r\n                                <span class=\"text-sm font-bold text-on-surface\">\u0644\u0644\u062d\u0641\u0627\u0638 \u0639\u0644\u0649 \u0648\u0632\u0646\u0643<\/span>\r\n                            <\/div>\r\n                            <span class=\"text-base font-extrabold text-primary\"><span id=\"cal-maintain\">--<\/span> \u0633\u0639\u0631\u0629<\/span>\r\n                        <\/div>\r\n                        <div class=\"flex items-center justify-between bg-light-blue rounded-xl p-4 border border-secondary\/10\">\r\n                            <div class=\"flex items-center gap-2\">\r\n                                <span class=\"material-symbols-outlined text-secondary\">trending_down<\/span>\r\n                                <span class=\"text-sm font-bold text-on-surface\">\u0644\u0625\u0646\u0642\u0627\u0635 \u0627\u0644\u0648\u0632\u0646<\/span>\r\n                            <\/div>\r\n                            <span class=\"text-base font-extrabold text-secondary\"><span id=\"cal-lose\">--<\/span> \u0633\u0639\u0631\u0629<\/span>\r\n                        <\/div>\r\n                        <div class=\"flex items-center justify-between bg-light-blue rounded-xl p-4 border border-secondary\/10\">\r\n                            <div class=\"flex items-center gap-2\">\r\n                                <span class=\"material-symbols-outlined text-secondary\">trending_up<\/span>\r\n                                <span class=\"text-sm font-bold text-on-surface\">\u0644\u0632\u064a\u0627\u062f\u0629 \u0627\u0644\u0648\u0632\u0646<\/span>\r\n                            <\/div>\r\n                            <span class=\"text-base font-extrabold text-secondary\"><span id=\"cal-gain\">--<\/span> \u0633\u0639\u0631\u0629<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Medical note -->\r\n                    <div class=\"w-full bg-light-blue rounded-xl p-5 border-r-4 border-secondary\">\r\n                        <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                            <span class=\"material-symbols-outlined text-sm\">info<\/span>\r\n                            \u0645\u0644\u0627\u062d\u0638\u0629 \u0647\u0627\u0645\u0629\r\n                        <\/h3>\r\n                        <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                            \u0647\u0630\u0627 \u0627\u0644\u062a\u0642\u062f\u064a\u0631 \u0645\u0628\u0646\u064a \u0639\u0644\u0649 \u0645\u0639\u0627\u062f\u0644\u0629 Mifflin-St Jeor \u0648\u0647\u0648 \u0625\u0631\u0634\u0627\u062f\u064a \u0641\u0642\u0637. \u0644\u0644\u062d\u0635\u0648\u0644 \u0639\u0644\u0649 \u062e\u0637\u0629 \u062a\u063a\u0630\u064a\u0629 \u062f\u0642\u064a\u0642\u0629\u060c \u064a\u064f\u0646\u0635\u062d \u0628\u0625\u062c\u0631\u0627\u0621 \u0627\u0644\u062a\u062d\u0627\u0644\u064a\u0644 \u0627\u0644\u0644\u0627\u0632\u0645\u0629 \u0648\u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0645\u062e\u062a\u0635 \u0641\u064a \u0645\u062e\u062a\u0628\u0631\u0627\u062a \u062f\u0644\u062a\u0627 \u0627\u0644\u0637\u0628\u064a\u0629.\r\n                        <\/p>\r\n                    <\/div>\r\n\r\n                    <div class=\"flex flex-col gap-3 w-full mt-6\">\r\n                        <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                            <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                            \u0627\u062d\u062c\u0632 \u0641\u062d\u0635\u0643 \u0627\u0644\u0645\u062e\u0628\u0631\u064a \u0627\u0644\u0634\u0627\u0645\u0644\r\n                        <\/a>\r\n                        <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" onclick=\"resetCalculator()\">\r\n                            <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                            \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        let currentGender = 'male';\r\n\r\n        function selectGender(gender) {\r\n            currentGender = gender;\r\n            const slider = document.getElementById('gender-slider');\r\n            const btnMale = document.getElementById('btn-male');\r\n            const btnFemale = document.getElementById('btn-female');\r\n\r\n            if (gender === 'male') {\r\n                slider.style.transform = 'translateX(0)';\r\n                btnMale.classList.add('gender-active', 'text-white');\r\n                btnMale.classList.remove('text-on-surface-variant');\r\n                btnFemale.classList.remove('gender-active', 'text-white');\r\n                btnFemale.classList.add('text-on-surface-variant');\r\n            } else {\r\n                slider.style.transform = 'translateX(-100%)';\r\n                btnFemale.classList.add('gender-active', 'text-white');\r\n                btnFemale.classList.remove('text-on-surface-variant');\r\n                btnMale.classList.remove('gender-active', 'text-white');\r\n                btnMale.classList.add('text-on-surface-variant');\r\n            }\r\n        }\r\n\r\n        function calculateCalories() {\r\n            const age = parseFloat(document.getElementById('age-input').value);\r\n            const weight = parseFloat(document.getElementById('weight-input').value);\r\n            const height = parseFloat(document.getElementById('height-input').value);\r\n            const activityFactor = parseFloat(document.getElementById('activity-level').value);\r\n\r\n            if (!age || !weight || !height || age < 1 || weight < 20 || height < 80) {\r\n                alert(\"\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u062c\u0645\u064a\u0639 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0628\u0634\u0643\u0644 \u0635\u062d\u064a\u062d (\u0627\u0644\u0639\u0645\u0631\u060c \u0627\u0644\u0648\u0632\u0646\u060c \u0627\u0644\u0637\u0648\u0644).\");\r\n                return;\r\n            }\r\n\r\n            \/\/ Mifflin-St Jeor BMR\r\n            let bmr;\r\n            if (currentGender === 'male') {\r\n                bmr = (10 * weight) + (6.25 * height) - (5 * age) + 5;\r\n            } else {\r\n                bmr = (10 * weight) + (6.25 * height) - (5 * age) - 161;\r\n            }\r\n\r\n            const maintenance = Math.round(bmr * activityFactor);\r\n            const lose = maintenance - 500;\r\n            const gain = maintenance + 500;\r\n\r\n            document.getElementById('calorie-result').textContent = maintenance.toLocaleString('en-US');\r\n            document.getElementById('cal-maintain').textContent = maintenance.toLocaleString('en-US');\r\n            document.getElementById('cal-lose').textContent = lose.toLocaleString('en-US');\r\n            document.getElementById('cal-gain').textContent = gain.toLocaleString('en-US');\r\n\r\n            \/\/ Switch views\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-view').setAttribute('data-state', 'active');\r\n            document.getElementById('result-header').setAttribute('data-state', 'active');\r\n        }\r\n\r\n        function resetCalculator() {\r\n            document.getElementById('result-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'active');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'active');\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-calorie-iframe');\r\n    const blob = new Blob([calorieCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-58cb911 elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"58cb911\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-growth-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-growth-iframe\" style=\"width: 100%; min-height: 900px; height: 900px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const growthCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\", \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\", \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\", \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\", \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\", \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\", \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\", \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\", \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\", \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\", \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\", \"secondary\": \"#3A428A\", \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\", \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\", \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\", \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\", \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\", \"light-green\": \"#F5F8ED\", \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\", \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\", \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\", \"soft-bg\": \"#F8F9FC\", \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\", \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\", \"tertiary\": \"#854883\", \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\", \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\", \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\", \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": { \"DEFAULT\": \"0.25rem\", \"lg\": \"0.5rem\", \"xl\": \"12px\", \"2xl\": \"24px\", \"full\": \"9999px\" },\r\n            \"fontFamily\": { \"cairo\": [\"Cairo\", \"sans-serif\"] }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif; background: transparent !important;\r\n            margin: 0; padding: 10px; display: flex; justify-content: center; align-items: flex-start;\r\n        }\r\n        .bmi-card { transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 10px 30px rgba(0,0,0,.05); }\r\n        .delta-gradient-btn { background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%); }\r\n        #gender-slider { background: #A3BF64; }\r\n        #btn-boy.gender-active, #btn-girl.gender-active { color: #ffffff; }\r\n        #unit-months.unit-active, #unit-years.unit-active { background: #A3BF64; color: #fff; }\r\n        .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; vertical-align: middle; }\r\n        #age-input::placeholder, #weight-input::placeholder, #height-input::placeholder { color: #757969; opacity: 1; }\r\n        input[type=\"number\"]::-webkit-inner-spin-button, input[type=\"number\"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }\r\n        input[type=\"number\"] { -moz-appearance: textfield; }\r\n        [data-state] { display: none; }\r\n        [data-state=\"active\"] { display: block; animation: fadeIn 0.4s ease-out; }\r\n        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\r\n        .gauge-fill { transition: stroke-dashoffset 1s ease-out; }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- Header -->\r\n        <div class=\"p-8 pb-4 text-center\">\r\n            <div class=\"flex justify-center mb-4\">\r\n                <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                    <span class=\"material-symbols-outlined text-primary text-3xl\" id=\"header-icon\">child_care<\/span>\r\n                <\/div>\r\n            <\/div>\r\n            <div data-state=\"active\" id=\"pre-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0646\u0645\u0648 \u0627\u0644\u0637\u0641\u0644<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0642\u064a\u0651\u0645\u064a \u0648\u0632\u0646 \u0648\u0637\u0648\u0644 \u0637\u0641\u0644\u0643 \u0645\u0642\u0627\u0631\u0646\u0629 \u0628\u0645\u0639\u0627\u064a\u064a\u0631 \u0627\u0644\u0646\u0645\u0648 \u062d\u0633\u0628 \u0627\u0644\u0639\u0645\u0631 \u0648\u0627\u0644\u062c\u0646\u0633.<\/p>\r\n            <\/div>\r\n            <div data-state=\"hidden\" id=\"result-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0646\u062a\u064a\u062c\u0629 \u062a\u0642\u064a\u064a\u0645 \u0627\u0644\u0646\u0645\u0648<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0627\u0644\u0645\u062f\u062e\u0644\u0629\u060c \u0625\u0644\u064a\u0643 \u062a\u062d\u0644\u064a\u0644 \u0646\u0645\u0648 \u0637\u0641\u0644\u0643.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"px-8 pb-8\">\r\n\r\n            <!-- ============ INPUT VIEW ============ -->\r\n            <div data-state=\"active\" id=\"calculator-view\">\r\n\r\n                <!-- Gender -->\r\n                <label class=\"block text-sm font-medium text-on-surface-variant mb-2\">\u0627\u0644\u062c\u0646\u0633<\/label>\r\n                <div class=\"bg-surface p-1 rounded-full flex mb-6 relative border border-border-light\">\r\n                    <div class=\"absolute inset-y-1 w-[calc(50%-4px)] rounded-full shadow-sm transition-transform duration-300 ease-out\" id=\"gender-slider\" style=\"right: 4px;\"><\/div>\r\n                    <button class=\"relative z-10 flex-1 py-3 flex items-center justify-center gap-2 font-bold text-sm transition-colors gender-active text-white\" id=\"btn-boy\" onclick=\"selectGender('boy')\" type=\"button\">\r\n                        <span class=\"material-symbols-outlined\">boy<\/span> \u0648\u0644\u062f\r\n                    <\/button>\r\n                    <button class=\"relative z-10 flex-1 py-3 flex items-center justify-center gap-2 font-bold text-sm transition-colors text-on-surface-variant\" id=\"btn-girl\" onclick=\"selectGender('girl')\" type=\"button\">\r\n                        <span class=\"material-symbols-outlined\">girl<\/span> \u0628\u0646\u062a\r\n                    <\/button>\r\n                <\/div>\r\n\r\n                <!-- Age with unit toggle -->\r\n                <div class=\"flex items-center justify-between mb-2\">\r\n                    <label class=\"block text-sm font-medium text-on-surface-variant\" for=\"age-input\">\u0639\u0645\u0631 \u0627\u0644\u0637\u0641\u0644<\/label>\r\n                    <div class=\"flex bg-surface rounded-full p-0.5 border border-border-light text-xs font-bold\">\r\n                        <button class=\"px-3 py-1 rounded-full transition-colors unit-active\" id=\"unit-months\" onclick=\"setUnit('months')\" type=\"button\">\u0623\u0634\u0647\u0631<\/button>\r\n                        <button class=\"px-3 py-1 rounded-full transition-colors text-on-surface-variant\" id=\"unit-years\" onclick=\"setUnit('years')\" type=\"button\">\u0633\u0646\u0648\u0627\u062a<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n                <input class=\"w-full h-[60px] bg-white px-4 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface mb-6\" id=\"age-input\" placeholder=\"\u0623\u062f\u062e\u0644 \u0627\u0644\u0639\u0645\u0631\" type=\"number\"\/>\r\n\r\n                <!-- Weight + Height -->\r\n                <div class=\"grid grid-cols-2 gap-4 mb-6\">\r\n                    <div>\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant mb-2\">\u0648\u0632\u0646 \u0627\u0644\u0637\u0641\u0644 (\u0643\u062c\u0645)<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-4 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface\" id=\"weight-input\" placeholder=\"00.0\" type=\"number\"\/>\r\n                    <\/div>\r\n                    <div>\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant mb-2\">\u0637\u0648\u0644 \u0627\u0644\u0637\u0641\u0644 (\u0633\u0645)<\/label>\r\n                        <input class=\"w-full h-[60px] bg-white px-4 rounded-xl border border-border-light focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all text-lg text-on-surface\" id=\"height-input\" placeholder=\"000\" type=\"number\"\/>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\" onclick=\"calculateGrowth()\">\r\n                    \u0627\u062d\u0633\u0628\u064a \u0645\u0639\u062f\u0644 \u0627\u0644\u0646\u0645\u0648\r\n                <\/button>\r\n\r\n                <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10 mt-6\">\r\n                    <div class=\"flex items-start gap-3\">\r\n                        <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                        <p class=\"text-sm text-on-surface-variant leading-relaxed\">\r\n                            <strong>\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u0645\u062a\u0627\u0628\u0639\u0629 \u0627\u0644\u0646\u0645\u0648\u061f<\/strong> \u062a\u0633\u0627\u0639\u062f \u0645\u062a\u0627\u0628\u0639\u0629 \u0645\u0646\u062d\u0646\u064a\u0627\u062a \u0627\u0644\u0646\u0645\u0648 \u0641\u064a \u0627\u0644\u0643\u0634\u0641 \u0627\u0644\u0645\u0628\u0643\u0631 \u0639\u0646 \u0623\u064a \u0627\u0636\u0637\u0631\u0627\u0628\u0627\u062a \u0635\u062d\u064a\u0629 \u0623\u0648 \u063a\u0630\u0627\u0626\u064a\u0629\u060c \u0645\u0645\u0627 \u064a\u0636\u0645\u0646 \u062d\u0635\u0648\u0644 \u0637\u0641\u0644\u0643 \u0639\u0644\u0649 \u0627\u0644\u0631\u0639\u0627\u064a\u0629 \u0627\u0644\u0645\u062b\u0627\u0644\u064a\u0629 \u0641\u064a \u0627\u0644\u0648\u0642\u062a \u0627\u0644\u0645\u0646\u0627\u0633\u0628.\r\n                        <\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- ============ RESULT VIEW ============ -->\r\n            <div data-state=\"hidden\" id=\"result-view\">\r\n\r\n                <div class=\"grid grid-cols-2 gap-4 mb-6\">\r\n                    <!-- Height-for-age -->\r\n                    <div class=\"bg-surface-container-low rounded-2xl p-4 flex flex-col items-center border border-border-light\">\r\n                        <div class=\"relative w-24 h-24 flex items-center justify-center mb-2\">\r\n                            <svg class=\"w-full h-full transform -rotate-90\" viewbox=\"0 0 100 100\">\r\n                                <circle cx=\"50\" cy=\"50\" fill=\"none\" r=\"44\" stroke=\"#E8ECF4\" stroke-width=\"9\"><\/circle>\r\n                                <circle class=\"gauge-fill\" cx=\"50\" cy=\"50\" fill=\"none\" id=\"gauge-height\" r=\"44\" stroke=\"#A3BF64\" stroke-dasharray=\"276.5\" stroke-dashoffset=\"276.5\" stroke-linecap=\"round\" stroke-width=\"9\"><\/circle>\r\n                            <\/svg>\r\n                            <span class=\"absolute text-xl font-extrabold text-on-surface\" id=\"height-pct\">--<\/span>\r\n                        <\/div>\r\n                        <span class=\"text-sm font-bold text-on-surface-variant\">\u0627\u0644\u0637\u0648\u0644 \u062d\u0633\u0628 \u0627\u0644\u0639\u0645\u0631<\/span>\r\n                    <\/div>\r\n                    <!-- Weight-for-age -->\r\n                    <div class=\"bg-surface-container-low rounded-2xl p-4 flex flex-col items-center border border-border-light\">\r\n                        <div class=\"relative w-24 h-24 flex items-center justify-center mb-2\">\r\n                            <svg class=\"w-full h-full transform -rotate-90\" viewbox=\"0 0 100 100\">\r\n                                <circle cx=\"50\" cy=\"50\" fill=\"none\" r=\"44\" stroke=\"#E8ECF4\" stroke-width=\"9\"><\/circle>\r\n                                <circle class=\"gauge-fill\" cx=\"50\" cy=\"50\" fill=\"none\" id=\"gauge-weight\" r=\"44\" stroke=\"#A3BF64\" stroke-dasharray=\"276.5\" stroke-dashoffset=\"276.5\" stroke-linecap=\"round\" stroke-width=\"9\"><\/circle>\r\n                            <\/svg>\r\n                            <span class=\"absolute text-xl font-extrabold text-on-surface\" id=\"weight-pct\">--<\/span>\r\n                        <\/div>\r\n                        <span class=\"text-sm font-bold text-on-surface-variant\">\u0627\u0644\u0648\u0632\u0646 \u062d\u0633\u0628 \u0627\u0644\u0639\u0645\u0631<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Status badge -->\r\n                <div class=\"flex justify-center mb-6\">\r\n                    <span class=\"px-5 py-2 rounded-full text-sm font-bold border flex items-center gap-2 bg-success\/10 text-success border-success\/20\" id=\"status-badge\">\r\n                        <span class=\"material-symbols-outlined text-sm\">check_circle<\/span>\r\n                        \u0636\u0645\u0646 \u0627\u0644\u0645\u0639\u062f\u0644 \u0627\u0644\u0637\u0628\u064a\u0639\u064a\r\n                    <\/span>\r\n                <\/div>\r\n\r\n                <!-- Summary -->\r\n                <div class=\"bg-light-blue rounded-xl p-5 border-r-4 border-secondary mb-6\">\r\n                    <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                        <span class=\"material-symbols-outlined text-sm\">info<\/span> \u0645\u0644\u062e\u0635 \u0627\u0644\u062d\u0627\u0644\u0629\r\n                    <\/h3>\r\n                    <p class=\"text-sm text-on-surface-variant leading-relaxed\" id=\"summary-text\">--<\/p>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-3\">\r\n                    <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                        <span class=\"material-symbols-outlined\">calendar_month<\/span> \u0627\u062d\u062c\u0632\u064a \u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0645\u062a\u0627\u0628\u0639\u0629 \u0627\u0644\u0646\u0645\u0648\r\n                    <\/a>\r\n                    <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" onclick=\"resetCalculator()\">\r\n                        <span class=\"material-symbols-outlined\">restart_alt<\/span> \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n                <\/div>\r\n\r\n                <p class=\"text-center text-xs text-on-surface-variant mt-6\">\r\n                    \u062a\u0639\u062a\u0645\u062f \u0647\u0630\u0647 \u0627\u0644\u0646\u062a\u0627\u0626\u062c \u0639\u0644\u0649 \u0645\u0639\u0627\u064a\u064a\u0631 \u0645\u0646\u0638\u0645\u0629 \u0627\u0644\u0635\u062d\u0629 \u0627\u0644\u0639\u0627\u0644\u0645\u064a\u0629 (WHO) \u0644\u0644\u0646\u0645\u0648.\r\n                <\/p>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        \/\/ ===== WHO Child Growth Standards \u2014 official LMS parameters (0\u201360 months) =====\r\n        \/\/ Source: WHO Child Growth Standards expanded tables (via CDC\/WHO). [L, M, S] per whole month.\r\n        const WHO_LMS = {\"wfa_boys\":[[0.3487,3.3464,0.14602],[0.2303,4.4525,0.13413],[0.1969,5.5714,0.12382],[0.174,6.369,0.11732],[0.1551,7.0069,0.11313],[0.1396,7.5077,0.11081],[0.1256,7.9389,0.10957],[0.1134,8.2963,0.10902],[0.1019,8.62,0.10882],[0.0917,8.9019,0.10881],[0.0821,9.1618,0.1089],[0.0729,9.4136,0.10906],[0.0645,9.646,0.10925],[0.0563,9.8772,0.10949],[0.0487,10.0944,0.10976],[0.0412,10.3139,0.11008],[0.0343,10.5228,0.11041],[0.0276,10.7289,0.11078],[0.021,10.9393,0.1112],[0.0149,11.1409,0.11163],[0.0087,11.3478,0.11212],[0.0029,11.5474,0.11261],[-0.0029,11.7528,0.11315],[-0.0083,11.951,0.11369],[-0.0136,12.1482,0.11425],[-0.0189,12.3506,0.11485],[-0.0239,12.5442,0.11544],[-0.0289,12.7413,0.11604],[-0.0337,12.9288,0.11663],[-0.0385,13.1188,0.11723],[-0.0431,13.2993,0.11781],[-0.0477,13.4824,0.1184],[-0.052,13.6567,0.11896],[-0.0563,13.8285,0.11952],[-0.0607,14.0038,0.12008],[-0.0648,14.1719,0.12062],[-0.0689,14.3443,0.12116],[-0.0729,14.5102,0.12168],[-0.0769,14.6811,0.12221],[-0.0808,14.8462,0.12271],[-0.0846,15.0167,0.12323],[-0.0883,15.1816,0.12373],[-0.092,15.3465,0.12424],[-0.0957,15.5168,0.12478],[-0.0992,15.6815,0.12531],[-0.1028,15.8514,0.12587],[-0.1063,16.0156,0.12642],[-0.1098,16.1851,0.12701],[-0.1131,16.3489,0.12759],[-0.1164,16.5126,0.12818],[-0.1198,16.6818,0.12881],[-0.123,16.8454,0.12942],[-0.1263,17.0145,0.13006],[-0.1294,17.1782,0.13068],[-0.1326,17.3473,0.13133],[-0.1356,17.5107,0.13196],[-0.1387,17.674,0.1326],[-0.1417,17.8425,0.13325],[-0.1447,18.0053,0.13389],[-0.1477,18.1732,0.13454],[-0.1506,18.3352,0.13517]],\"wfa_girls\":[[0.3809,3.2322,0.14171],[0.1727,4.1716,0.13738],[0.0959,5.1315,0.12998],[0.0407,5.8393,0.12622],[-0.0053,6.428,0.12401],[-0.0428,6.8959,0.12274],[-0.0759,7.3016,0.12204],[-0.1039,7.6416,0.12178],[-0.1292,7.9534,0.12181],[-0.1507,8.2259,0.12199],[-0.1698,8.4769,0.12222],[-0.1873,8.7207,0.12247],[-0.2022,8.9462,0.12267],[-0.216,9.1722,0.12283],[-0.2277,9.3861,0.12294],[-0.2385,9.6038,0.12299],[-0.2478,9.8124,0.12303],[-0.2561,10.0196,0.12305],[-0.2637,10.2324,0.12309],[-0.2702,10.4372,0.12315],[-0.2763,10.6481,0.12324],[-0.2814,10.8521,0.12335],[-0.2862,11.0633,0.12351],[-0.2903,11.2684,0.12369],[-0.294,11.4741,0.12389],[-0.2975,11.6868,0.12414],[-0.3005,11.8922,0.12441],[-0.3033,12.1028,0.12472],[-0.3057,12.3042,0.12506],[-0.308,12.5093,0.12545],[-0.3101,12.7047,0.12587],[-0.312,12.9033,0.12634],[-0.3138,13.093,0.12683],[-0.3155,13.2809,0.12736],[-0.3171,13.4739,0.12794],[-0.3186,13.6599,0.12854],[-0.3201,13.8518,0.1292],[-0.3216,14.0373,0.12987],[-0.323,14.2288,0.1306],[-0.3243,14.4136,0.13134],[-0.3257,14.6041,0.13214],[-0.327,14.7877,0.13294],[-0.3283,14.9704,0.13375],[-0.3296,15.1584,0.13461],[-0.3309,15.3395,0.13544],[-0.3322,15.5259,0.13631],[-0.3335,15.7056,0.13715],[-0.3348,15.8908,0.13801],[-0.3361,16.0697,0.13884],[-0.3374,16.2485,0.13967],[-0.3387,16.433,0.14051],[-0.34,16.6114,0.14132],[-0.3414,16.7957,0.14214],[-0.3427,16.9737,0.14292],[-0.344,17.1573,0.14372],[-0.3453,17.3344,0.14448],[-0.3466,17.5107,0.14524],[-0.3479,17.692,0.146],[-0.3492,17.8664,0.14674],[-0.3505,18.0456,0.14749],[-0.3518,18.2179,0.14821]],\"lhfa_boys\":[[1.0,49.8842,0.03795],[1.0,54.6645,0.03559],[1.0,58.4384,0.03423],[1.0,61.4013,0.03329],[1.0,63.9041,0.03257],[1.0,65.8912,0.03204],[1.0,67.6435,0.03165],[1.0,69.1615,0.03139],[1.0,70.6224,0.03124],[1.0,71.9714,0.03117],[1.0,73.2653,0.03118],[1.0,74.5464,0.03125],[1.0,75.7391,0.03137],[1.0,76.9304,0.03154],[1.0,78.0451,0.03174],[1.0,79.1613,0.03197],[1.0,80.2113,0.03222],[1.0,81.234,0.03249],[1.0,82.2628,0.03279],[1.0,83.2318,0.0331],[1.0,84.2074,0.03342],[1.0,85.1291,0.03375],[1.0,86.0589,0.0341],[1.0,86.9392,0.03445],[1.0,87.8018,0.03479],[1.0,87.9737,0.03542],[1.0,88.7964,0.03576],[1.0,89.6247,0.0361],[1.0,90.4056,0.03642],[1.0,91.1906,0.03674],[1.0,91.9297,0.03704],[1.0,92.6735,0.03733],[1.0,93.3753,0.03761],[1.0,94.0612,0.03787],[1.0,94.7559,0.03812],[1.0,95.4168,0.03836],[1.0,96.0889,0.03858],[1.0,96.7298,0.03879],[1.0,97.3827,0.039],[1.0,98.006,0.03919],[1.0,98.6412,0.03937],[1.0,99.2471,0.03954],[1.0,99.8441,0.0397],[1.0,100.4522,0.03986],[1.0,101.0326,0.04002],[1.0,101.6246,0.04017],[1.0,102.191,0.04031],[1.0,102.7706,0.04045],[1.0,103.3273,0.04059],[1.0,103.8806,0.04073],[1.0,104.4496,0.04086],[1.0,104.9984,0.041],[1.0,105.5641,0.04113],[1.0,106.1104,0.04126],[1.0,106.6736,0.04139],[1.0,107.2176,0.04152],[1.0,107.7607,0.04165],[1.0,108.3209,0.04177],[1.0,108.8621,0.0419],[1.0,109.4203,0.04202],[1.0,109.9593,0.04214]],\"lhfa_girls\":[[1.0,49.1477,0.0379],[1.0,53.6326,0.03641],[1.0,57.0796,0.03568],[1.0,59.7773,0.0352],[1.0,62.1071,0.03486],[1.0,64.019,0.03463],[1.0,65.751,0.03448],[1.0,67.2842,0.03441],[1.0,68.7732,0.0344],[1.0,70.1463,0.03444],[1.0,71.4656,0.03452],[1.0,72.7788,0.03464],[1.0,74.0049,0.03479],[1.0,75.2297,0.03496],[1.0,76.377,0.03514],[1.0,77.5258,0.03534],[1.0,78.6055,0.03555],[1.0,79.6559,0.03576],[1.0,80.7121,0.03598],[1.0,81.708,0.0362],[1.0,82.7116,0.03643],[1.0,83.6595,0.03665],[1.0,84.6154,0.03689],[1.0,85.5184,0.03711],[1.0,86.4008,0.03733],[1.0,86.5922,0.03786],[1.0,87.4358,0.03808],[1.0,88.2881,0.0383],[1.0,89.0938,0.03851],[1.0,89.9072,0.03872],[1.0,90.6765,0.03893],[1.0,91.4539,0.03913],[1.0,92.1906,0.03933],[1.0,92.9135,0.03952],[1.0,93.6473,0.03971],[1.0,94.346,0.03989],[1.0,95.0572,0.04007],[1.0,95.7356,0.04024],[1.0,96.427,0.04041],[1.0,97.0871,0.04057],[1.0,97.7601,0.04074],[1.0,98.4028,0.04089],[1.0,99.0369,0.04105],[1.0,99.6834,0.0412],[1.0,100.3007,0.04135],[1.0,100.9301,0.0415],[1.0,101.5312,0.04164],[1.0,102.1446,0.04179],[1.0,102.7312,0.04193],[1.0,103.3113,0.04206],[1.0,103.9045,0.0422],[1.0,104.4727,0.04233],[1.0,105.0541,0.04247],[1.0,105.6114,0.04259],[1.0,106.1817,0.04272],[1.0,106.7284,0.04285],[1.0,107.2698,0.04297],[1.0,107.8238,0.0431],[1.0,108.3547,0.04322],[1.0,108.8981,0.04335],[1.0,109.4189,0.04346]]};\r\n\r\n        let currentGender = 'boy';\r\n        let currentUnit = 'months';\r\n        const RADIUS = 44;\r\n        const CIRC = 2 * Math.PI * RADIUS; \/\/ 276.46\r\n\r\n        function selectGender(g) {\r\n            currentGender = g;\r\n            const slider = document.getElementById('gender-slider');\r\n            const boy = document.getElementById('btn-boy');\r\n            const girl = document.getElementById('btn-girl');\r\n            if (g === 'boy') {\r\n                slider.style.transform = 'translateX(0)';\r\n                boy.classList.add('gender-active','text-white'); boy.classList.remove('text-on-surface-variant');\r\n                girl.classList.remove('gender-active','text-white'); girl.classList.add('text-on-surface-variant');\r\n            } else {\r\n                slider.style.transform = 'translateX(-100%)';\r\n                girl.classList.add('gender-active','text-white'); girl.classList.remove('text-on-surface-variant');\r\n                boy.classList.remove('gender-active','text-white'); boy.classList.add('text-on-surface-variant');\r\n            }\r\n        }\r\n\r\n        function setUnit(u) {\r\n            currentUnit = u;\r\n            const m = document.getElementById('unit-months');\r\n            const y = document.getElementById('unit-years');\r\n            if (u === 'months') {\r\n                m.classList.add('unit-active'); m.classList.remove('text-on-surface-variant');\r\n                y.classList.remove('unit-active'); y.classList.add('text-on-surface-variant');\r\n            } else {\r\n                y.classList.add('unit-active'); y.classList.remove('text-on-surface-variant');\r\n                m.classList.remove('unit-active'); m.classList.add('text-on-surface-variant');\r\n            }\r\n        }\r\n\r\n        \/\/ Normal CDF (Abramowitz & Stegun 7.1.26)\r\n        function normalCDF(z) {\r\n            const t = 1 \/ (1 + 0.2316419 * Math.abs(z));\r\n            const d = 0.3989423 * Math.exp(-z*z\/2);\r\n            let p = d * t * (0.3193815 + t*(-0.3565638 + t*(1.781478 + t*(-1.821256 + t*1.330274))));\r\n            return z > 0 ? 1 - p : p;\r\n        }\r\n\r\n        function lmsPercentile(X, lms) {\r\n            const L = lms[0], M = lms[1], S = lms[2];\r\n            const z = (L !== 0) ? (Math.pow(X\/M, L) - 1) \/ (L*S) : Math.log(X\/M) \/ S;\r\n            return { z: z, pct: normalCDF(z) * 100 };\r\n        }\r\n\r\n        function calculateGrowth() {\r\n            let ageVal = parseFloat(document.getElementById('age-input').value);\r\n            const weight = parseFloat(document.getElementById('weight-input').value);\r\n            const height = parseFloat(document.getElementById('height-input').value);\r\n\r\n            if (!ageVal || ageVal <= 0 || !weight || weight <= 0 || !height || height <= 0) {\r\n                alert(\"\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u062c\u0645\u064a\u0639 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0628\u0634\u0643\u0644 \u0635\u062d\u064a\u062d (\u0627\u0644\u0639\u0645\u0631\u060c \u0627\u0644\u0648\u0632\u0646\u060c \u0627\u0644\u0637\u0648\u0644).\");\r\n                return;\r\n            }\r\n\r\n            const ageMonths = currentUnit === 'years' ? Math.round(ageVal * 12) : Math.round(ageVal);\r\n\r\n            \/\/ WHO 0\u20135 years range only\r\n            if (ageMonths < 0 || ageMonths > 60) {\r\n                alert(\"\u0647\u0630\u0647 \u0627\u0644\u062d\u0627\u0633\u0628\u0629 \u062a\u0639\u062a\u0645\u062f \u0639\u0644\u0649 \u0645\u0639\u0627\u064a\u064a\u0631 \u0645\u0646\u0638\u0645\u0629 \u0627\u0644\u0635\u062d\u0629 \u0627\u0644\u0639\u0627\u0644\u0645\u064a\u0629 \u0644\u0644\u0623\u0637\u0641\u0627\u0644 \u0645\u0646 \u0627\u0644\u0648\u0644\u0627\u062f\u0629 \u0648\u062d\u062a\u0649 \u0639\u0645\u0631 5 \u0633\u0646\u0648\u0627\u062a (60 \u0634\u0647\u0631\u0627\u064b). \u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u0639\u0645\u0631 \u0636\u0645\u0646 \u0647\u0630\u0627 \u0627\u0644\u0646\u0637\u0627\u0642\u060c \u0623\u0648 \u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0645\u062e\u062a\u0635 \u0644\u062a\u0642\u064a\u064a\u0645 \u0627\u0644\u0623\u0637\u0641\u0627\u0644 \u0627\u0644\u0623\u0643\u0628\u0631 \u0633\u0646\u0627\u064b.\");\r\n                return;\r\n            }\r\n\r\n            const wfa = lmsPercentile(weight, WHO_LMS['wfa_' + (currentGender === 'boy' ? 'boys' : 'girls')][ageMonths]);\r\n            const hfa = lmsPercentile(height, WHO_LMS['lhfa_' + (currentGender === 'boy' ? 'boys' : 'girls')][ageMonths]);\r\n\r\n            const wPct = Math.round(wfa.pct);\r\n            const hPct = Math.round(hfa.pct);\r\n\r\n            document.getElementById('weight-pct').textContent = wPct + '%';\r\n            document.getElementById('height-pct').textContent = hPct + '%';\r\n\r\n            \/\/ Animate rings (offset: full = empty, 0 = full)\r\n            const setRing = (id, pct) => {\r\n                const el = document.getElementById(id);\r\n                const offset = CIRC - (Math.max(2, Math.min(100, pct)) \/ 100) * CIRC;\r\n                requestAnimationFrame(() => { el.style.strokeDashoffset = offset; });\r\n            };\r\n\r\n            \/\/ Overall status from z-scores (WHO flags |z|>2 as needing attention, |z|>3 severe)\r\n            const worstZ = Math.min(wfa.z, hfa.z);\r\n            const maxAbsZ = Math.max(Math.abs(wfa.z), Math.abs(hfa.z));\r\n            const badge = document.getElementById('status-badge');\r\n            const summary = document.getElementById('summary-text');\r\n            const childWord = currentGender === 'boy' ? '\u0637\u0641\u0644\u0643' : '\u0637\u0641\u0644\u062a\u0643';\r\n\r\n            let badgeClass, badgeIcon, badgeText, summaryText;\r\n            if (maxAbsZ <= 2) {\r\n                badgeClass = 'bg-success\/10 text-success border-success\/20';\r\n                badgeIcon = 'check_circle';\r\n                badgeText = '\u0636\u0645\u0646 \u0627\u0644\u0645\u0639\u062f\u0644 \u0627\u0644\u0637\u0628\u064a\u0639\u064a';\r\n                summaryText = childWord + ' \u064a\u0646\u0645\u0648 \u0636\u0645\u0646 \u0627\u0644\u0645\u0639\u062f\u0644 \u0627\u0644\u0637\u0628\u064a\u0639\u064a \u0645\u0642\u0627\u0631\u0646\u0629 \u0628\u0645\u0639\u0627\u064a\u064a\u0631 \u0645\u0646\u0638\u0645\u0629 \u0627\u0644\u0635\u062d\u0629 \u0627\u0644\u0639\u0627\u0644\u0645\u064a\u0629. \u0646\u0646\u0635\u062d \u0628\u0627\u0644\u0627\u0633\u062a\u0645\u0631\u0627\u0631 \u0639\u0644\u0649 \u0646\u0638\u0627\u0645 \u063a\u0630\u0627\u0626\u064a \u0645\u062a\u0648\u0627\u0632\u0646 \u0648\u0645\u062a\u0627\u0628\u0639\u0629 \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u062f\u0648\u0631\u064a\u0629 \u0644\u0636\u0645\u0627\u0646 \u0627\u0633\u062a\u0645\u0631\u0627\u0631\u064a\u0629 \u0627\u0644\u062a\u0637\u0648\u0631 \u0627\u0644\u0635\u062d\u064a \u0627\u0644\u0633\u0644\u064a\u0645.';\r\n            } else if (maxAbsZ <= 3) {\r\n                badgeClass = 'bg-warning\/10 text-warning border-warning\/20';\r\n                badgeIcon = 'warning';\r\n                badgeText = '\u064a\u062d\u062a\u0627\u062c \u0625\u0644\u0649 \u0645\u062a\u0627\u0628\u0639\u0629';\r\n                summaryText = '\u062a\u0634\u064a\u0631 \u0625\u062d\u062f\u0649 \u0627\u0644\u0642\u0631\u0627\u0621\u0627\u062a \u0625\u0644\u0649 \u0627\u0646\u062d\u0631\u0627\u0641 \u0628\u0633\u064a\u0637 \u0639\u0646 \u0627\u0644\u0645\u0639\u062f\u0644 \u0627\u0644\u0637\u0628\u064a\u0639\u064a. \u0644\u0627 \u062f\u0627\u0639\u064a \u0644\u0644\u0642\u0644\u0642\u060c \u0644\u0643\u0646 \u064a\u064f\u0646\u0635\u062d \u0628\u0645\u062a\u0627\u0628\u0639\u0629 \u0646\u0645\u0648 ' + childWord + ' \u0645\u0639 \u0637\u0628\u064a\u0628 \u0627\u0644\u0623\u0637\u0641\u0627\u0644 \u0648\u0625\u062c\u0631\u0627\u0621 \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u0645\u0646\u0627\u0633\u0628\u0629 \u0644\u0644\u0627\u0637\u0645\u0626\u0646\u0627\u0646.';\r\n            } else {\r\n                badgeClass = 'bg-error\/10 text-error border-error\/20';\r\n                badgeIcon = 'error';\r\n                badgeText = '\u062e\u0627\u0631\u062c \u0627\u0644\u0645\u0639\u062f\u0644 \u0627\u0644\u0637\u0628\u064a\u0639\u064a';\r\n                summaryText = '\u062a\u0642\u0639 \u0625\u062d\u062f\u0649 \u0627\u0644\u0642\u0631\u0627\u0621\u0627\u062a \u062e\u0627\u0631\u062c \u0627\u0644\u0646\u0637\u0627\u0642 \u0627\u0644\u0637\u0628\u064a\u0639\u064a \u0628\u0634\u0643\u0644 \u0645\u0644\u062d\u0648\u0638. \u0645\u0646 \u0627\u0644\u0645\u0647\u0645 \u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0637\u0628\u064a\u0628 \u0645\u062e\u062a\u0635 \u0641\u064a \u0623\u0642\u0631\u0628 \u0648\u0642\u062a \u0644\u062a\u0642\u064a\u064a\u0645 \u062d\u0627\u0644\u0629 ' + childWord + ' \u0648\u0625\u062c\u0631\u0627\u0621 \u0627\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u0644\u0627\u0632\u0645\u0629.';\r\n            }\r\n\r\n            badge.className = 'px-5 py-2 rounded-full text-sm font-bold border flex items-center gap-2 ' + badgeClass;\r\n            badge.innerHTML = '<span class=\"material-symbols-outlined text-sm\">' + badgeIcon + '<\/span> ' + badgeText;\r\n            summary.textContent = summaryText;\r\n\r\n            \/\/ Switch views\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-view').setAttribute('data-state', 'active');\r\n            document.getElementById('result-header').setAttribute('data-state', 'active');\r\n\r\n            setTimeout(() => { setRing('gauge-weight', wPct); setRing('gauge-height', hPct); }, 150);\r\n        }\r\n\r\n        function resetCalculator() {\r\n            document.getElementById('gauge-weight').style.strokeDashoffset = CIRC;\r\n            document.getElementById('gauge-height').style.strokeDashoffset = CIRC;\r\n            document.getElementById('result-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'active');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'active');\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-growth-iframe');\r\n    const blob = new Blob([growthCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8240a9e elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"8240a9e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-water-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-water-iframe\" style=\"width: 100%; min-height: 900px; height: 900px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const waterCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\", \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\", \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\", \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\", \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\", \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\", \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\", \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\", \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\", \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\", \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\", \"secondary\": \"#3A428A\", \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\", \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\", \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\", \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\", \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\", \"light-green\": \"#F5F8ED\", \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\", \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\", \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\", \"soft-bg\": \"#F8F9FC\", \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\", \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\", \"tertiary\": \"#854883\", \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\", \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\", \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\", \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": { \"DEFAULT\": \"0.25rem\", \"lg\": \"0.5rem\", \"xl\": \"12px\", \"2xl\": \"24px\", \"full\": \"9999px\" },\r\n            \"fontFamily\": { \"cairo\": [\"Cairo\", \"sans-serif\"] }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif; background: transparent !important;\r\n            margin: 0; padding: 10px; display: flex; justify-content: center; align-items: flex-start;\r\n        }\r\n        .bmi-card { transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 10px 30px rgba(0,0,0,.05); }\r\n        .delta-gradient-btn { background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%); }\r\n        .active-pill { background-color: #A3BF64 !important; color: #fff !important; border-color: #A3BF64 !important; }\r\n        .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; vertical-align: middle; }\r\n        #weight-input::placeholder { color: #757969; opacity: 1; }\r\n        input[type=\"number\"]::-webkit-inner-spin-button, input[type=\"number\"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }\r\n        input[type=\"number\"] { -moz-appearance: textfield; }\r\n        [data-state] { display: none; }\r\n        [data-state=\"active\"] { display: block; animation: fadeIn 0.4s ease-out; }\r\n        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\r\n        .gauge-fill { transition: stroke-dashoffset 1s ease-out; }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- Header -->\r\n        <div class=\"p-8 pb-4 text-center\">\r\n            <div class=\"flex justify-center mb-4\">\r\n                <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                    <span class=\"material-symbols-outlined text-primary text-3xl\">water_drop<\/span>\r\n                <\/div>\r\n            <\/div>\r\n            <div data-state=\"active\" id=\"pre-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0627\u062d\u062a\u064a\u0627\u062c \u0627\u0644\u0645\u0627\u0621 \u0627\u0644\u064a\u0648\u0645\u064a<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0627\u062d\u0633\u0628 \u0643\u0645\u064a\u0629 \u0627\u0644\u0645\u0627\u0621 \u0627\u0644\u062a\u064a \u064a\u062d\u062a\u0627\u062c\u0647\u0627 \u062c\u0633\u0645\u0643 \u064a\u0648\u0645\u064a\u0627\u064b \u0644\u0644\u062d\u0641\u0627\u0638 \u0639\u0644\u0649 \u062a\u0631\u0637\u064a\u0628 \u0645\u062b\u0627\u0644\u064a.<\/p>\r\n            <\/div>\r\n            <div data-state=\"hidden\" id=\"result-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0627\u062d\u062a\u064a\u0627\u062c\u0643 \u0627\u0644\u064a\u0648\u0645\u064a \u0645\u0646 \u0627\u0644\u0645\u0627\u0621<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0628\u064a\u0627\u0646\u0627\u062a\u0643\u060c \u0647\u0630\u0647 \u0647\u064a \u0643\u0645\u064a\u0629 \u0627\u0644\u0645\u0627\u0621 \u0627\u0644\u0645\u0648\u0635\u0649 \u0628\u0647\u0627 \u064a\u0648\u0645\u064a\u0627\u064b.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"px-8 pb-8\">\r\n\r\n            <!-- ============ INPUT VIEW ============ -->\r\n            <div data-state=\"active\" id=\"calculator-view\">\r\n\r\n                <!-- Gender -->\r\n                <div class=\"space-y-2 mb-6\">\r\n                    <label class=\"block text-sm font-medium text-on-surface-variant\">\u0627\u0644\u062c\u0646\u0633<\/label>\r\n                    <div class=\"grid grid-cols-2 gap-3 h-[60px]\">\r\n                        <button class=\"gender-pill flex items-center justify-center gap-2 rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all active-pill\" data-gender=\"male\" onclick=\"selectPill(this,'gender-pill')\" type=\"button\">\r\n                            <span class=\"material-symbols-outlined\">man<\/span><span class=\"font-bold text-sm\">\u0630\u0643\u0631<\/span>\r\n                        <\/button>\r\n                        <button class=\"gender-pill flex items-center justify-center gap-2 rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all\" data-gender=\"female\" onclick=\"selectPill(this,'gender-pill')\" type=\"button\">\r\n                            <span class=\"material-symbols-outlined\">woman<\/span><span class=\"font-bold text-sm\">\u0623\u0646\u062b\u0649<\/span>\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Weight -->\r\n                <div class=\"space-y-2 mb-6\">\r\n                    <label class=\"block text-sm font-medium text-on-surface-variant\">\u0627\u0644\u0648\u0632\u0646 \u0627\u0644\u062d\u0627\u0644\u064a<\/label>\r\n                    <div class=\"relative\">\r\n                        <input class=\"w-full h-[60px] px-4 rounded-xl bg-white border border-border-light text-lg text-on-surface focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"weight-input\" placeholder=\"\u0627\u0644\u0648\u0632\u0646 \u0643\u062c\u0645\" type=\"number\"\/>\r\n                        <span class=\"absolute left-4 top-1\/2 -translate-y-1\/2 text-on-surface-variant\/70 text-sm font-medium\">\u0643\u062c\u0645<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Activity Level -->\r\n                <div class=\"space-y-2 mb-6\">\r\n                    <label class=\"block text-sm font-medium text-on-surface-variant\">\u0645\u0633\u062a\u0648\u0649 \u0627\u0644\u0646\u0634\u0627\u0637 \u0627\u0644\u0628\u062f\u0646\u064a<\/label>\r\n                    <div class=\"grid grid-cols-3 gap-2 h-[56px]\">\r\n                        <button class=\"activity-pill text-sm font-bold rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all active-pill\" data-act=\"1.0\" onclick=\"selectPill(this,'activity-pill')\" type=\"button\">\u062e\u0641\u064a\u0641<\/button>\r\n                        <button class=\"activity-pill text-sm font-bold rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all\" data-act=\"1.12\" onclick=\"selectPill(this,'activity-pill')\" type=\"button\">\u0645\u062a\u0648\u0633\u0637<\/button>\r\n                        <button class=\"activity-pill text-sm font-bold rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all\" data-act=\"1.25\" onclick=\"selectPill(this,'activity-pill')\" type=\"button\">\u0639\u0627\u0644\u064d<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Climate -->\r\n                <div class=\"space-y-2 mb-6\">\r\n                    <label class=\"block text-sm font-medium text-on-surface-variant\">\u0627\u0644\u0645\u0646\u0627\u062e \u0627\u0644\u0645\u062d\u064a\u0637<\/label>\r\n                    <div class=\"grid grid-cols-3 gap-2 h-[56px]\">\r\n                        <button class=\"climate-pill text-sm font-bold rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all active-pill\" data-clim=\"1.0\" onclick=\"selectPill(this,'climate-pill')\" type=\"button\">\u0645\u0639\u062a\u062f\u0644<\/button>\r\n                        <button class=\"climate-pill text-sm font-bold rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all\" data-clim=\"1.1\" onclick=\"selectPill(this,'climate-pill')\" type=\"button\">\u062d\u0627\u0631<\/button>\r\n                        <button class=\"climate-pill text-sm font-bold rounded-xl border border-border-light bg-surface text-on-surface-variant transition-all\" data-clim=\"1.2\" onclick=\"selectPill(this,'climate-pill')\" type=\"button\">\u062d\u0627\u0631 \u062c\u062f\u0627\u064b<\/button>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\" onclick=\"calculateWater()\">\r\n                    \u0627\u062d\u0633\u0628 \u0627\u062d\u062a\u064a\u0627\u062c\u064a \u0645\u0646 \u0627\u0644\u0645\u0627\u0621\r\n                <\/button>\r\n\r\n                <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10 mt-6\">\r\n                    <div class=\"flex items-start gap-3\">\r\n                        <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                        <div>\r\n                            <h3 class=\"font-bold text-on-surface text-sm mb-1\">\u0644\u0645\u0627\u0630\u0627 \u064a\u0647\u0645\u0643 \u0634\u0631\u0628 \u0627\u0644\u0645\u0627\u0621\u061f<\/h3>\r\n                            <p class=\"text-sm text-on-surface-variant leading-relaxed\">\u064a\u0633\u0627\u0639\u062f \u0634\u0631\u0628 \u0627\u0644\u0645\u0627\u0621 \u0627\u0644\u0643\u0627\u0641\u064a \u0641\u064a \u062a\u062d\u0633\u064a\u0646 \u0648\u0638\u0627\u0626\u0641 \u0627\u0644\u0643\u0644\u0649\u060c \u062a\u0639\u0632\u064a\u0632 \u0646\u0636\u0627\u0631\u0629 \u0627\u0644\u0628\u0634\u0631\u0629\u060c \u0648\u0631\u0641\u0639 \u0645\u0633\u062a\u0648\u064a\u0627\u062a \u0627\u0644\u0637\u0627\u0642\u0629 \u0648\u0627\u0644\u062a\u0631\u0643\u064a\u0632 \u0637\u0648\u0627\u0644 \u0627\u0644\u064a\u0648\u0645.<\/p>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- ============ RESULT VIEW ============ -->\r\n            <div data-state=\"hidden\" id=\"result-view\">\r\n                <div class=\"flex flex-col items-center\">\r\n\r\n                    <!-- Gauge -->\r\n                    <div class=\"relative w-48 h-48 mb-6 flex items-center justify-center\">\r\n                        <svg class=\"w-full h-full transform -rotate-90\" viewbox=\"0 0 200 200\">\r\n                            <circle cx=\"100\" cy=\"100\" r=\"90\" fill=\"none\" stroke=\"#E6EEFF\" stroke-width=\"12\"><\/circle>\r\n                            <circle class=\"gauge-fill\" cx=\"100\" cy=\"100\" r=\"90\" fill=\"none\" id=\"gauge-fill\" stroke=\"#A3BF64\" stroke-width=\"12\" stroke-linecap=\"round\" stroke-dasharray=\"565.48\" stroke-dashoffset=\"565.48\"><\/circle>\r\n                        <\/svg>\r\n                        <div class=\"absolute inset-0 flex flex-col items-center justify-center text-center\">\r\n                            <span class=\"text-5xl font-extrabold text-primary leading-none\" id=\"liters-result\">2.6<\/span>\r\n                            <span class=\"text-sm text-on-surface-variant mt-1\">\u0644\u062a\u0631 \/ \u064a\u0648\u0645<\/span>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <!-- Cups -->\r\n                    <div class=\"flex items-center gap-2 mb-4 text-on-surface\">\r\n                        <span class=\"material-symbols-outlined text-secondary\">local_drink<\/span>\r\n                        <span class=\"text-base\">\u0645\u0627 \u064a\u0639\u0627\u062f\u0644 \u062a\u0642\u0631\u064a\u0628\u0627\u064b <strong class=\"font-bold\" id=\"cups-result\">10<\/strong> \u0643\u0648\u0628 \u0645\u0627\u0621<\/span>\r\n                    <\/div>\r\n\r\n                    <!-- ML detail -->\r\n                    <div class=\"w-full bg-light-green border border-primary\/20 rounded-xl py-3 px-6 flex justify-between items-center mb-6\">\r\n                        <span class=\"text-on-surface-variant text-sm font-medium\">\u0627\u0644\u0643\u0645\u064a\u0629 \u0627\u0644\u062f\u0642\u064a\u0642\u0629<\/span>\r\n                        <span class=\"text-lg font-bold text-primary\"><span id=\"ml-result\">2600<\/span> \u0645\u0644<\/span>\r\n                    <\/div>\r\n\r\n                    <!-- Tip \/ caution box -->\r\n                    <div class=\"w-full bg-light-blue rounded-xl p-5 border-r-4 border-secondary mb-6\">\r\n                        <h3 class=\"text-secondary font-bold mb-2 flex items-center gap-2\">\r\n                            <span class=\"material-symbols-outlined text-sm\">info<\/span>\r\n                            <span id=\"tip-title\">\u0646\u0635\u064a\u062d\u0629 \u0635\u062d\u064a\u0629<\/span>\r\n                        <\/h3>\r\n                        <p class=\"text-sm text-on-surface-variant leading-relaxed\" id=\"tip-text\">\r\n                            \u0627\u062d\u0631\u0635 \u0639\u0644\u0649 \u0634\u0631\u0628 \u0627\u0644\u0645\u0627\u0621 \u0628\u0627\u0646\u062a\u0638\u0627\u0645 \u0637\u0648\u0627\u0644 \u0627\u0644\u064a\u0648\u0645. \u062a\u0630\u0643\u0631 \u0632\u064a\u0627\u062f\u0629 \u0627\u0633\u062a\u0647\u0644\u0627\u0643\u0643 \u0641\u064a \u0627\u0644\u0623\u062c\u0648\u0627\u0621 \u0627\u0644\u062d\u0627\u0631\u0629 \u0623\u0648 \u0639\u0646\u062f \u0645\u0645\u0627\u0631\u0633\u0629 \u0627\u0644\u0646\u0634\u0627\u0637 \u0627\u0644\u0628\u062f\u0646\u064a \u0627\u0644\u0645\u0643\u062b\u0641.\r\n                        <\/p>\r\n                    <\/div>\r\n\r\n                    <div class=\"w-full flex flex-col gap-3\">\r\n                        <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                            <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                            \u0627\u062d\u062c\u0632 \u0641\u062d\u0635\u0643 \u0627\u0644\u0645\u062e\u0628\u0631\u064a \u0627\u0644\u0634\u0627\u0645\u0644\r\n                        <\/a>\r\n                        <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" onclick=\"resetCalculator()\">\r\n                            <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                            \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                        <\/button>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        let gender = 'male', activityFactor = 1.0, climateFactor = 1.0;\r\n        const CIRC = 2 * Math.PI * 90; \/\/ 565.48\r\n\r\n        function selectPill(el, cls) {\r\n            document.querySelectorAll('.' + cls).forEach(p => p.classList.remove('active-pill'));\r\n            el.classList.add('active-pill');\r\n            if (cls === 'gender-pill') gender = el.dataset.gender;\r\n            else if (cls === 'activity-pill') activityFactor = parseFloat(el.dataset.act);\r\n            else if (cls === 'climate-pill') climateFactor = parseFloat(el.dataset.clim);\r\n        }\r\n\r\n        function calculateWater() {\r\n            const weight = parseFloat(document.getElementById('weight-input').value);\r\n            if (!weight || weight < 20 || weight > 300) {\r\n                alert(\"\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u0648\u0632\u0646 \u0635\u062d\u064a\u062d (\u0628\u064a\u0646 20 \u0648 300 \u0643\u062c\u0645).\");\r\n                return;\r\n            }\r\n\r\n            \/\/ Base need: ml per kg of body weight (males slightly higher), adjusted by activity & climate\r\n            const basePerKg = gender === 'male' ? 35 : 31;\r\n            let ml = weight * basePerKg * activityFactor * climateFactor;\r\n\r\n            \/\/ Safe cap to avoid recommending unsafe volumes\r\n            const CAP = 4000;\r\n            let capped = false;\r\n            if (ml > CAP) { ml = CAP; capped = true; }\r\n\r\n            const mlRounded = Math.round(ml \/ 50) * 50;\r\n            const liters = (mlRounded \/ 1000).toFixed(1);\r\n            const cups = Math.round(mlRounded \/ 250);\r\n\r\n            document.getElementById('liters-result').textContent = liters;\r\n            document.getElementById('ml-result').textContent = mlRounded.toLocaleString('en-US');\r\n            document.getElementById('cups-result').textContent = cups;\r\n\r\n            \/\/ Tip \/ caution\r\n            const tipTitle = document.getElementById('tip-title');\r\n            const tipText = document.getElementById('tip-text');\r\n            if (capped) {\r\n                tipTitle.textContent = '\u0645\u0644\u0627\u062d\u0638\u0629 \u0647\u0627\u0645\u0629';\r\n                tipText.textContent = '\u0627\u062d\u062a\u064a\u0627\u062c\u0643 \u0627\u0644\u062a\u0642\u062f\u064a\u0631\u064a \u0645\u0631\u062a\u0641\u0639. \u0627\u0644\u0642\u064a\u0645\u0629 \u0627\u0644\u0645\u0639\u0631\u0648\u0636\u0629 \u0647\u064a \u062d\u062f \u0623\u0642\u0635\u0649 \u0625\u0631\u0634\u0627\u062f\u064a \u0622\u0645\u0646\u061b \u0648\u064a\u064f\u0641\u0636\u0651\u0644 \u062a\u0648\u0632\u064a\u0639 \u0634\u0631\u0628 \u0627\u0644\u0645\u0627\u0621 \u0639\u0644\u0649 \u0645\u062f\u0627\u0631 \u0627\u0644\u064a\u0648\u0645 \u0648\u0627\u0633\u062a\u0634\u0627\u0631\u0629 \u0645\u062e\u062a\u0635 \u0644\u062a\u0642\u064a\u064a\u0645 \u0627\u062d\u062a\u064a\u0627\u062c\u0643 \u0627\u0644\u0641\u0639\u0644\u064a \u0628\u062f\u0642\u0629.';\r\n            } else {\r\n                tipTitle.textContent = '\u0646\u0635\u064a\u062d\u0629 \u0635\u062d\u064a\u0629';\r\n                tipText.textContent = '\u0627\u062d\u0631\u0635 \u0639\u0644\u0649 \u0634\u0631\u0628 \u0627\u0644\u0645\u0627\u0621 \u0628\u0627\u0646\u062a\u0638\u0627\u0645 \u0637\u0648\u0627\u0644 \u0627\u0644\u064a\u0648\u0645. \u062a\u0630\u0643\u0651\u0631 \u0632\u064a\u0627\u062f\u0629 \u0627\u0633\u062a\u0647\u0644\u0627\u0643\u0643 \u0641\u064a \u0627\u0644\u0623\u062c\u0648\u0627\u0621 \u0627\u0644\u062d\u0627\u0631\u0629 \u0623\u0648 \u0639\u0646\u062f \u0645\u0645\u0627\u0631\u0633\u0629 \u0627\u0644\u0646\u0634\u0627\u0637 \u0627\u0644\u0628\u062f\u0646\u064a \u0627\u0644\u0645\u0643\u062b\u0641.';\r\n            }\r\n\r\n            \/\/ Animate gauge: scale relative to a 4L reference, min 8% so it's always visible\r\n            const pct = Math.max(0.08, Math.min(1, mlRounded \/ 4000));\r\n            const offset = CIRC - (pct * CIRC);\r\n\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-view').setAttribute('data-state', 'active');\r\n            document.getElementById('result-header').setAttribute('data-state', 'active');\r\n\r\n            setTimeout(() => { document.getElementById('gauge-fill').style.strokeDashoffset = offset; }, 150);\r\n        }\r\n\r\n        function resetCalculator() {\r\n            document.getElementById('gauge-fill').style.strokeDashoffset = CIRC;\r\n            document.getElementById('result-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'active');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'active');\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-water-iframe');\r\n    const blob = new Blob([waterCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a8b6f5e elementor-widget__width-initial elementor-widget-tablet__width-inherit elementor-widget elementor-widget-html\" data-id=\"a8b6f5e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"delta-age-widget-container\" style=\"width: 100%; max-width: 520px; margin: 0 auto;\">\r\n    <iframe id=\"delta-age-iframe\" style=\"width: 100%; min-height: 880px; height: 880px; border: none; overflow: hidden; display: block;\" scrolling=\"no\"><\/iframe>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n    const ageCalculatorHtml = `<!DOCTYPE html>\r\n<html dir=\"rtl\" lang=\"ar\">\r\n<head>\r\n    <meta charset=\"utf-8\"\/>\r\n    <meta content=\"width=device-width, initial-scale=1.0\" name=\"viewport\"\/>\r\n    <script src=\"https:\/\/cdn.tailwindcss.com?plugins=forms,container-queries\"><\\\/script>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;500;600;700&display=swap\" rel=\"stylesheet\"\/>\r\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap\" rel=\"stylesheet\"\/>\r\n    <script id=\"tailwind-config\">\r\n      tailwind.config = {\r\n        darkMode: \"class\",\r\n        theme: {\r\n          extend: {\r\n            \"colors\": {\r\n                    \"surface-container-low\": \"#eff4ff\", \"primary-container\": \"#a3bf64\",\r\n                    \"on-primary-fixed\": \"#151f00\", \"surface-dim\": \"#d0dbed\",\r\n                    \"on-tertiary-fixed-variant\": \"#6a306a\", \"surface\": \"#f8f9ff\",\r\n                    \"error\": \"#EF4444\", \"surface-container-lowest\": \"#ffffff\",\r\n                    \"light-blue\": \"#F4F5FB\", \"tertiary-fixed-dim\": \"#f7aef2\",\r\n                    \"on-tertiary\": \"#ffffff\", \"on-surface\": \"#121c2a\",\r\n                    \"primary-fixed\": \"#d0ee8d\", \"on-secondary-container\": \"#363e86\",\r\n                    \"on-primary-fixed-variant\": \"#394e00\", \"on-error-container\": \"#93000a\",\r\n                    \"background\": \"#f8f9ff\", \"tertiary-fixed\": \"#ffd6f8\",\r\n                    \"primary-fixed-dim\": \"#b4d174\", \"outline-variant\": \"#c5c8b6\",\r\n                    \"success\": \"#22C55E\", \"secondary\": \"#3A428A\", \"border-light\": \"#E5E7EB\",\r\n                    \"on-secondary-fixed-variant\": \"#384088\", \"inverse-primary\": \"#b4d174\",\r\n                    \"on-tertiary-fixed\": \"#37003b\", \"tertiary-container\": \"#e49ddf\",\r\n                    \"on-primary-container\": \"#384d00\", \"surface-bright\": \"#f8f9ff\",\r\n                    \"secondary-container\": \"#a5adfd\", \"on-tertiary-container\": \"#69306a\",\r\n                    \"on-error\": \"#ffffff\", \"light-green\": \"#F5F8ED\", \"error-container\": \"#ffdad6\",\r\n                    \"secondary-fixed\": \"#dfe0ff\", \"inverse-on-surface\": \"#eaf1ff\",\r\n                    \"surface-container-high\": \"#dee9fc\", \"on-secondary-fixed\": \"#060e5b\",\r\n                    \"on-primary\": \"#ffffff\", \"soft-bg\": \"#F8F9FC\", \"on-secondary\": \"#ffffff\",\r\n                    \"surface-container\": \"#e6eeff\", \"outline\": \"#757969\",\r\n                    \"surface-variant\": \"#d9e3f6\", \"tertiary\": \"#854883\", \"warning\": \"#F59E0B\",\r\n                    \"on-surface-variant\": \"#45483a\", \"on-background\": \"#121c2a\",\r\n                    \"surface-container-highest\": \"#d9e3f6\", \"surface-tint\": \"#4f6615\",\r\n                    \"secondary-fixed-dim\": \"#bdc2ff\", \"inverse-surface\": \"#27313f\",\r\n                    \"primary\": \"#A3BF64\"\r\n            },\r\n            \"borderRadius\": { \"DEFAULT\": \"0.25rem\", \"lg\": \"0.5rem\", \"xl\": \"12px\", \"2xl\": \"24px\", \"full\": \"9999px\" },\r\n            \"fontFamily\": { \"cairo\": [\"Cairo\", \"sans-serif\"] }\r\n          },\r\n        },\r\n      }\r\n    <\\\/script>\r\n    <style>\r\n        body {\r\n            font-family: 'Cairo', sans-serif; background: transparent !important;\r\n            margin: 0; padding: 10px; display: flex; justify-content: center; align-items: flex-start;\r\n        }\r\n        .bmi-card { transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: 0 10px 30px rgba(0,0,0,.05); }\r\n        .delta-gradient-btn { background: linear-gradient(90deg, #A3BF64 0%, #8EB04F 100%); }\r\n        .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; vertical-align: middle; }\r\n        input[type=\"date\"]::-webkit-calendar-picker-indicator {\r\n            filter: invert(64%) sepia(18%) saturate(900%) hue-rotate(38deg) brightness(92%) contrast(86%);\r\n            cursor: pointer;\r\n        }\r\n        [data-state] { display: none; }\r\n        [data-state=\"active\"] { display: block; animation: fadeIn 0.4s ease-out; }\r\n        @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div class=\"bmi-card bg-white w-full max-w-[520px] rounded-2xl overflow-hidden flex flex-col border border-border-light\" id=\"calculator-widget\">\r\n\r\n        <!-- Header -->\r\n        <div class=\"p-8 pb-4 text-center\">\r\n            <div class=\"flex justify-center mb-4\">\r\n                <div class=\"w-12 h-12 bg-light-green rounded-xl flex items-center justify-center\">\r\n                    <span class=\"material-symbols-outlined text-primary text-3xl\" id=\"header-icon\">cake<\/span>\r\n                <\/div>\r\n            <\/div>\r\n            <div data-state=\"active\" id=\"pre-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u062d\u0627\u0633\u0628\u0629 \u0627\u0644\u0639\u0645\u0631<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0627\u062d\u0633\u0628 \u0639\u0645\u0631\u0643 \u0628\u062f\u0642\u0629 \u0628\u0627\u0644\u0633\u0646\u0648\u0627\u062a \u0648\u0627\u0644\u0623\u0634\u0647\u0631 \u0648\u0627\u0644\u0623\u064a\u0627\u0645\u060c \u0648\u0627\u0643\u062a\u0634\u0641 \u0645\u0648\u0639\u062f \u0639\u064a\u062f \u0645\u064a\u0644\u0627\u062f\u0643 \u0627\u0644\u0642\u0627\u062f\u0645.<\/p>\r\n            <\/div>\r\n            <div data-state=\"hidden\" id=\"result-header\">\r\n                <h1 class=\"text-2xl font-bold text-on-surface mb-2\">\u0646\u062a\u064a\u062c\u0629 \u062d\u0633\u0627\u0628 \u0627\u0644\u0639\u0645\u0631<\/h1>\r\n                <p class=\"text-on-surface-variant text-sm\">\u0625\u0644\u064a\u0643 \u062a\u0641\u0627\u0635\u064a\u0644 \u0639\u0645\u0631\u0643 \u0628\u062f\u0642\u0629\u060c \u0648\u0627\u0644\u0648\u0642\u062a \u0627\u0644\u0645\u062a\u0628\u0642\u064a \u0644\u0639\u064a\u062f \u0645\u064a\u0644\u0627\u062f\u0643 \u0627\u0644\u0642\u0627\u062f\u0645.<\/p>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"px-8 pb-8\">\r\n\r\n            <!-- ============ INPUT VIEW ============ -->\r\n            <div data-state=\"active\" id=\"calculator-view\">\r\n                <div class=\"space-y-6\">\r\n                    <div class=\"space-y-2\">\r\n                        <label class=\"block text-sm font-medium text-on-surface-variant\" for=\"birth-date\">\u062a\u0627\u0631\u064a\u062e \u0627\u0644\u0645\u064a\u0644\u0627\u062f<\/label>\r\n                        <input class=\"w-full h-[60px] px-4 rounded-xl border border-border-light bg-white text-lg text-on-surface focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"birth-date\" type=\"date\"\/>\r\n                    <\/div>\r\n                    <div class=\"space-y-2\">\r\n                        <div class=\"flex items-center gap-2 flex-wrap\">\r\n                            <label class=\"text-sm font-medium text-on-surface-variant\" for=\"target-date\">\u0627\u062d\u0633\u0628 \u0627\u0644\u0639\u0645\u0631 \u062d\u062a\u0649 \u062a\u0627\u0631\u064a\u062e<\/label>\r\n                            <span class=\"text-xs text-on-surface-variant\/80\">(\u0627\u062a\u0631\u0643\u0647 \u0641\u0627\u0631\u063a\u0627\u064b \u0644\u0627\u0633\u062a\u062e\u062f\u0627\u0645 \u062a\u0627\u0631\u064a\u062e \u0627\u0644\u064a\u0648\u0645)<\/span>\r\n                        <\/div>\r\n                        <input class=\"w-full h-[60px] px-4 rounded-xl border border-border-light bg-white text-lg text-on-surface focus:ring-2 focus:ring-primary\/20 focus:border-primary outline-none transition-all\" id=\"target-date\" type=\"date\"\/>\r\n                    <\/div>\r\n\r\n                    <button class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all hover:opacity-90 flex items-center justify-center gap-2\" onclick=\"calculateAge()\">\r\n                        \u0627\u062d\u0633\u0628 \u0627\u0644\u0639\u0645\u0631\r\n                    <\/button>\r\n\r\n                    <div class=\"bg-light-blue p-4 rounded-xl border border-secondary\/10\">\r\n                        <div class=\"flex items-start gap-3\">\r\n                            <span class=\"material-symbols-outlined text-secondary mt-0.5\">info<\/span>\r\n                            <div>\r\n                                <h3 class=\"font-bold text-on-surface text-sm mb-1\">\u0644\u0645\u0627\u0630\u0627 \u062a\u062d\u0633\u0628 \u0639\u0645\u0631\u0643 \u0628\u062f\u0642\u0629\u061f<\/h3>\r\n                                <p class=\"text-sm text-on-surface-variant leading-relaxed\">\u064a\u0633\u0627\u0639\u062f \u062d\u0633\u0627\u0628 \u0627\u0644\u0639\u0645\u0631 \u0627\u0644\u062f\u0642\u064a\u0642 \u0641\u064a \u062a\u062d\u062f\u064a\u062f \u0627\u0644\u0646\u0637\u0627\u0642\u0627\u062a \u0627\u0644\u0645\u0631\u062c\u0639\u064a\u0629 \u0627\u0644\u0637\u0628\u064a\u0629 \u0627\u0644\u0645\u0646\u0627\u0633\u0628\u0629 \u0644\u0644\u0641\u062d\u0648\u0635\u0627\u062a \u0627\u0644\u0645\u062e\u0628\u0631\u064a\u0629\u060c \u062d\u064a\u062b \u062a\u062e\u062a\u0644\u0641 \u0627\u0644\u0645\u0639\u0627\u064a\u064a\u0631 \u0627\u0644\u0635\u062d\u064a\u0629 \u0628\u0646\u0627\u0621\u064b \u0639\u0644\u0649 \u0627\u0644\u0641\u0626\u0629 \u0627\u0644\u0639\u0645\u0631\u064a\u0629 \u0628\u062f\u0642\u0629 \u0627\u0644\u0623\u064a\u0627\u0645 \u0648\u0627\u0644\u0634\u0647\u0648\u0631.<\/p>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- ============ RESULT VIEW ============ -->\r\n            <div data-state=\"hidden\" id=\"result-view\">\r\n\r\n                <!-- Main Y\/M\/D block -->\r\n                <div class=\"bg-light-green rounded-2xl p-6 flex flex-row items-center justify-around text-center mb-6 border border-primary\/10\">\r\n                    <div class=\"flex flex-col\">\r\n                        <span class=\"text-primary font-extrabold text-4xl leading-tight\" id=\"res-years\">0<\/span>\r\n                        <span class=\"text-sm text-on-surface-variant mt-1\">\u0633\u0646\u0648\u0627\u062a<\/span>\r\n                    <\/div>\r\n                    <div class=\"w-px h-12 bg-outline-variant\/40\"><\/div>\r\n                    <div class=\"flex flex-col\">\r\n                        <span class=\"text-primary font-extrabold text-4xl leading-tight\" id=\"res-months\">0<\/span>\r\n                        <span class=\"text-sm text-on-surface-variant mt-1\">\u0623\u0634\u0647\u0631<\/span>\r\n                    <\/div>\r\n                    <div class=\"w-px h-12 bg-outline-variant\/40\"><\/div>\r\n                    <div class=\"flex flex-col\">\r\n                        <span class=\"text-primary font-extrabold text-4xl leading-tight\" id=\"res-days\">0<\/span>\r\n                        <span class=\"text-sm text-on-surface-variant mt-1\">\u0623\u064a\u0627\u0645<\/span>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Stat cards -->\r\n                <div class=\"grid grid-cols-2 gap-4 mb-6\">\r\n                    <div class=\"p-4 bg-white border border-border-light rounded-xl flex flex-col items-start gap-2\">\r\n                        <div class=\"flex items-center gap-2 text-secondary\">\r\n                            <span class=\"material-symbols-outlined text-lg\">calendar_today<\/span>\r\n                            <span class=\"text-xs font-medium\">\u0625\u062c\u0645\u0627\u0644\u064a \u0627\u0644\u0623\u064a\u0627\u0645<\/span>\r\n                        <\/div>\r\n                        <div class=\"text-lg font-bold text-on-surface\" id=\"res-total-days\">--<\/div>\r\n                    <\/div>\r\n                    <div class=\"p-4 bg-white border border-border-light rounded-xl flex flex-col items-start gap-2\">\r\n                        <div class=\"flex items-center gap-2 text-secondary\">\r\n                            <span class=\"material-symbols-outlined text-lg\">date_range<\/span>\r\n                            <span class=\"text-xs font-medium\">\u0625\u062c\u0645\u0627\u0644\u064a \u0627\u0644\u0623\u0633\u0627\u0628\u064a\u0639<\/span>\r\n                        <\/div>\r\n                        <div class=\"text-lg font-bold text-on-surface\" id=\"res-total-weeks\">--<\/div>\r\n                    <\/div>\r\n                    <div class=\"p-4 bg-white border border-border-light rounded-xl flex flex-col items-start gap-2\">\r\n                        <div class=\"flex items-center gap-2 text-secondary\">\r\n                            <span class=\"material-symbols-outlined text-lg\">schedule<\/span>\r\n                            <span class=\"text-xs font-medium\">\u0625\u062c\u0645\u0627\u0644\u064a \u0627\u0644\u0633\u0627\u0639\u0627\u062a<\/span>\r\n                        <\/div>\r\n                        <div class=\"text-lg font-bold text-on-surface\" id=\"res-total-hours\">--<\/div>\r\n                    <\/div>\r\n                    <div class=\"p-4 bg-white border border-border-light rounded-xl flex flex-col items-start gap-2\">\r\n                        <div class=\"flex items-center gap-2 text-secondary\">\r\n                            <span class=\"material-symbols-outlined text-lg\">event<\/span>\r\n                            <span class=\"text-xs font-medium\">\u064a\u0648\u0645 \u0645\u064a\u0644\u0627\u062f\u0643<\/span>\r\n                        <\/div>\r\n                        <div class=\"text-lg font-bold text-on-surface\" id=\"res-born-day\">--<\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <!-- Next birthday -->\r\n                <div class=\"bg-light-blue border-r-4 border-secondary rounded-xl p-5 flex items-center gap-3 mb-6\">\r\n                    <span class=\"material-symbols-outlined text-secondary text-2xl\">cake<\/span>\r\n                    <p class=\"text-sm text-on-surface-variant\" id=\"res-next-bday-wrap\">\r\n                        \u064a\u062a\u0628\u0642\u0649 \u0639\u0644\u0649 \u0639\u064a\u062f \u0645\u064a\u0644\u0627\u062f\u0643 \u0627\u0644\u0642\u0627\u062f\u0645 <span class=\"text-secondary font-bold text-xl mx-1\" id=\"res-next-bday\">--<\/span> \u064a\u0648\u0645\u0627\u064b\r\n                    <\/p>\r\n                <\/div>\r\n\r\n                <div class=\"flex flex-col gap-3\">\r\n                    <a href=\"https:\/\/delta-medlab.com\/packages\/\" target=\"_blank\" class=\"delta-gradient-btn w-full h-[60px] text-white font-bold text-lg rounded-xl shadow-lg shadow-primary\/20 active:scale-95 transition-all flex items-center justify-center gap-3 decoration-none outline-none\">\r\n                        <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n                        \u0627\u062d\u062c\u0632 \u0641\u062d\u0635\u0643 \u0627\u0644\u0645\u062e\u0628\u0631\u064a \u0627\u0644\u0634\u0627\u0645\u0644\r\n                    <\/a>\r\n                    <button class=\"w-full h-[60px] bg-white border border-secondary text-secondary font-bold text-lg rounded-xl active:scale-95 transition-all hover:bg-surface flex items-center justify-center gap-3\" onclick=\"resetCalculator()\">\r\n                        <span class=\"material-symbols-outlined\">restart_alt<\/span>\r\n                        \u0625\u0639\u0627\u062f\u0629 \u0627\u0644\u062d\u0633\u0627\u0628\r\n                    <\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n\r\n    <script>\r\n        const AR_DAYS = ['\u0627\u0644\u0623\u062d\u062f','\u0627\u0644\u0625\u062b\u0646\u064a\u0646','\u0627\u0644\u062b\u0644\u0627\u062b\u0627\u0621','\u0627\u0644\u0623\u0631\u0628\u0639\u0627\u0621','\u0627\u0644\u062e\u0645\u064a\u0633','\u0627\u0644\u062c\u0645\u0639\u0629','\u0627\u0644\u0633\u0628\u062a'];\r\n        const MS = 86400000;\r\n\r\n        function addMonths(date, n) {\r\n            const y = date.getFullYear();\r\n            const m = date.getMonth() + n;\r\n            const day = date.getDate();\r\n            const lastDay = new Date(y, m + 1, 0).getDate();\r\n            return new Date(y, m, Math.min(day, lastDay));\r\n        }\r\n\r\n        function calculateAge() {\r\n            const birthStr = document.getElementById('birth-date').value;\r\n            const targetStr = document.getElementById('target-date').value;\r\n\r\n            if (!birthStr) {\r\n                alert(\"\u064a\u0631\u062c\u0649 \u0625\u062f\u062e\u0627\u0644 \u062a\u0627\u0631\u064a\u062e \u0627\u0644\u0645\u064a\u0644\u0627\u062f.\");\r\n                return;\r\n            }\r\n\r\n            const b = new Date(birthStr + \"T00:00:00\");\r\n            const tRaw = targetStr ? new Date(targetStr + \"T00:00:00\") : new Date();\r\n            const a = new Date(tRaw.getFullYear(), tRaw.getMonth(), tRaw.getDate());\r\n\r\n            if (b > a) {\r\n                alert(\"\u062a\u0627\u0631\u064a\u062e \u0627\u0644\u0645\u064a\u0644\u0627\u062f \u0644\u0627 \u064a\u0645\u0643\u0646 \u0623\u0646 \u064a\u0643\u0648\u0646 \u0628\u0639\u062f \u062a\u0627\u0631\u064a\u062e \u0627\u0644\u062d\u0633\u0627\u0628. \u064a\u0631\u062c\u0649 \u0627\u0644\u0645\u0631\u0627\u062c\u0639\u0629.\");\r\n                return;\r\n            }\r\n\r\n            \/\/ Y\/M\/D via month-anchoring (always non-negative)\r\n            let months = (a.getFullYear() - b.getFullYear()) * 12 + (a.getMonth() - b.getMonth());\r\n            let anchor = addMonths(b, months);\r\n            if (anchor > a) { months--; anchor = addMonths(b, months); }\r\n            const days = Math.round((a - anchor) \/ MS);\r\n            const years = Math.floor(months \/ 12);\r\n            const remMonths = months % 12;\r\n\r\n            \/\/ Totals\r\n            const bMid = new Date(b.getFullYear(), b.getMonth(), b.getDate());\r\n            const totalDays = Math.round((a - bMid) \/ MS);\r\n            const totalWeeks = Math.floor(totalDays \/ 7);\r\n            const totalHours = totalDays * 24;\r\n\r\n            \/\/ Next birthday (handles Feb 29 -> Mar 1 in non-leap years)\r\n            const mo = b.getMonth(), da = b.getDate();\r\n            let nb = new Date(a.getFullYear(), mo, da);\r\n            if (nb.getMonth() !== mo) nb = new Date(a.getFullYear(), mo + 1, 1);\r\n            if (nb <= a) {\r\n                nb = new Date(a.getFullYear() + 1, mo, da);\r\n                if (nb.getMonth() !== mo) nb = new Date(a.getFullYear() + 1, mo + 1, 1);\r\n            }\r\n            const daysToNextBday = Math.ceil((nb - a) \/ MS);\r\n\r\n            \/\/ Fill UI\r\n            document.getElementById('res-years').textContent = years;\r\n            document.getElementById('res-months').textContent = remMonths;\r\n            document.getElementById('res-days').textContent = days;\r\n            document.getElementById('res-total-days').textContent = totalDays.toLocaleString('en-US');\r\n            document.getElementById('res-total-weeks').textContent = totalWeeks.toLocaleString('en-US');\r\n            document.getElementById('res-total-hours').textContent = totalHours.toLocaleString('en-US');\r\n            document.getElementById('res-born-day').textContent = AR_DAYS[b.getDay()];\r\n\r\n            const nbEl = document.getElementById('res-next-bday');\r\n            const wrap = document.getElementById('res-next-bday-wrap');\r\n            if (daysToNextBday === 0) {\r\n                wrap.innerHTML = '<span class=\"text-secondary font-bold\">\ud83c\udf89 \u0639\u064a\u062f \u0645\u064a\u0644\u0627\u062f\u0643 \u0647\u0648 \u0627\u0644\u064a\u0648\u0645! \u0643\u0644 \u0639\u0627\u0645 \u0648\u0623\u0646\u062a \u0628\u062e\u064a\u0631<\/span>';\r\n            } else {\r\n                nbEl.textContent = daysToNextBday.toLocaleString('en-US');\r\n            }\r\n\r\n            \/\/ Switch views\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-view').setAttribute('data-state', 'active');\r\n            document.getElementById('result-header').setAttribute('data-state', 'active');\r\n        }\r\n\r\n        function resetCalculator() {\r\n            \/\/ restore next-birthday template (in case it was replaced by the birthday message)\r\n            const wrap = document.getElementById('res-next-bday-wrap');\r\n            wrap.innerHTML = '\u064a\u062a\u0628\u0642\u0649 \u0639\u0644\u0649 \u0639\u064a\u062f \u0645\u064a\u0644\u0627\u062f\u0643 \u0627\u0644\u0642\u0627\u062f\u0645 <span class=\"text-secondary font-bold text-xl mx-1\" id=\"res-next-bday\">--<\/span> \u064a\u0648\u0645\u0627\u064b';\r\n            document.getElementById('result-view').setAttribute('data-state', 'hidden');\r\n            document.getElementById('result-header').setAttribute('data-state', 'hidden');\r\n            document.getElementById('calculator-view').setAttribute('data-state', 'active');\r\n            document.getElementById('pre-header').setAttribute('data-state', 'active');\r\n        }\r\n    <\\\/script>\r\n<\/body>\r\n<\/html>`;\r\n\r\n    const iframe = document.getElementById('delta-age-iframe');\r\n    const blob = new Blob([ageCalculatorHtml], { type: 'text\/html;charset=utf-8' });\r\n    iframe.src = URL.createObjectURL(blob);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-5cf1c48 e-flex e-con-boxed e-con e-parent\" data-id=\"5cf1c48\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<form class=\"e-con e-atomic-element e-form-base form-state-default e-3cd12ea-c0aed4f \"\n      data-id=\"3cd12ea\"\n      data-element_type=\"e-form\"\n      data-e-type=\"e-form\"\n      data-interaction-id=\"3cd12ea\"\n      data-interactions=\"null\"\n      x-data=\"eForm3cd12ea\"\n      x-on:submit=\"submit\"      aria-label=\"&#x0646;&#x0645;&#x0648;&#x0630;&#x062C;\"\n      data-form-name=\"&#x0646;&#x0645;&#x0648;&#x0630;&#x062C;\"\n      >\n    \t\t\t<input \n\tid=e-form-first-name\n\tname=e-form-first-name\n\tclass=\"e-696c40b-b17a812 e-form-input-base\"\n\ttype=\"text\"\n\tdata-interaction-id=\"696c40b\"\n\tdata-e-type=\"widget\" data-id=\"696c40b\" \n\t\n\tplaceholder=&#x0627;&#x062F;&#x062E;&#x0644;&#x20;&#x0627;&#x0633;&#x0645;&#x0643;&#x20;&#x0643;&#x0627;&#x0645;&#x0644;&#x20;\n\t\n\t\n\/>\n\t\t\t\t\t<input \n\tid=e-form-email\n\tname=e-form-email\n\tclass=\"e-a6bcea8-14c8e23 e-form-input-base\"\n\ttype=\"email\"\n\tdata-interaction-id=\"a6bcea8\"\n\tdata-e-type=\"widget\" data-id=\"a6bcea8\" \n\t\n\tplaceholder=&#x0627;&#x062F;&#x062E;&#x0644;&#x20;&#x0628;&#x0631;&#x064A;&#x062F;&#x0643;&#x20;&#x0627;&#x0644;&#x0627;&#x0644;&#x0643;&#x062A;&#x0631;&#x0648;&#x0646;&#x0649;\n\t\n\t\n\/>\n\t\t\t\t\t<input \n\tid=e-form-input-6\n\tname=e-form-input-6\n\tclass=\"e-a1e4541-7bb8201 e-form-input-base\"\n\ttype=\"tel\"\n\tdata-interaction-id=\"a1e4541\"\n\tdata-e-type=\"widget\" data-id=\"a1e4541\" \n\t\n\tplaceholder=&#x0627;&#x062F;&#x062E;&#x0644;&#x20;&#x0631;&#x0642;&#x0645;&#x20;&#x062C;&#x0648;&#x0627;&#x0644;&#x0643;\n\t\n\t\n\/>\n\t\t\t\t\t<textarea\t\n\tid=e-form-textarea-8\n\tname=e-form-textarea-8\n\tclass=\"e-ab6e246-4fe8e02 e-form-textarea-base\"\n\tdata-interaction-id=\"ab6e246\"\n\tdata-e-type=\"widget\" data-id=\"ab6e246\"\n\t\n\tplaceholder=&#x0627;&#x0636;&#x0641;&#x20;&#x0645;&#x0644;&#x0627;&#x062D;&#x0638;&#x0627;&#x062A;&#x0643;\n\t\n\t\n\trows=4\n\t\n\t\n\tdata-resizable\n><\/textarea>\n\t\t\t\t\t<button \n\t\n\tclass=\"e-ade892f-d909ec2 e-form-submit-button-base\"\n\ttype=\"submit\"\n\tdata-interaction-id=\"ade892f\"\n\tdata-e-type=\"widget\" data-id=\"ade892f\"\n\t\n>\u0627\u062d\u062c\u0632 \u0627\u0644\u0627\u0646<\/button>\n\t\t<div class=\"e-con e-atomic-element e-form-success-message-base message-success \"\n     data-id=\"1508d24\"\n     data-element_type=\"e-form-success-message\"\n     data-e-type=\"e-form-success-message\"\n     data-interaction-id=\"1508d24\"\n     >\n    \t\t\t<p class=\"e-paragraph-base\" data-interaction-id=\"f5b29b6\" data-e-type=\"widget\" data-id=\"f5b29b6\">Great! We\u2019ve received your information.<\/p>\n\t\t\n<\/div>\n<div class=\"e-con e-atomic-element e-form-error-message-base message-error \"\n     data-id=\"c5e6740\"\n     data-element_type=\"e-form-error-message\"\n     data-e-type=\"e-form-error-message\"\n     data-interaction-id=\"c5e6740\"\n     >\n    \t\t\t<p class=\"e-paragraph-base\" data-interaction-id=\"a4506a2\" data-e-type=\"widget\" data-id=\"a4506a2\">We couldn\u2019t process your submission. Please retry<\/p>\n\t\t\n<\/div>\n\n<\/form>\n\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0627\u062d\u062c\u0632 \u0627\u0644\u0627\u0646 Great! We\u2019ve received your information. We couldn\u2019t process your submission. Please retry<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-19659","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/pages\/19659","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/comments?post=19659"}],"version-history":[{"count":9,"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/pages\/19659\/revisions"}],"predecessor-version":[{"id":20500,"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/pages\/19659\/revisions\/20500"}],"wp:attachment":[{"href":"https:\/\/delta-medlab.com\/blog\/wp-json\/wp\/v2\/media?parent=19659"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}