\u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438<\/title>\r\n <style>\r\n :root {\r\n --primary: #025a87;\r\n --primary-hover: #014161;\r\n --bg: #f8fafc;\r\n --card: #ffffff;\r\n --text: #1e293b;\r\n --border: #e2e8f0;\r\n --danger: #ef4444;\r\n }\r\n\r\n * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\r\n }\r\n\r\n body {\r\n background-color: var(--bg);\r\n color: var(--text);\r\n padding: 20px;\r\n display: flex;\r\n justify-content: center;\r\n }\r\n\r\n .container {\r\n width: 100%;\r\n max-width: 600px;\r\n background: var(--card);\r\n padding: 24px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 6px -1px rgb(0 0 0 \/ 0.1), 0 2px 4px -2px rgb(0 0 0 \/ 0.1);\r\n }\r\n\r\n .header {\r\n margin-bottom: 20px;\r\n text-align: center;\r\n }\r\n\r\n .header h2 {\r\n font-size: 1.5rem;\r\n color: #0f172a;\r\n margin-bottom: 4px;\r\n }\r\n\r\n \/* \u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u043e\u043d\u043d\u0438 \u0431\u0443\u0442\u043e\u043d\u0438 (\u0422\u0430\u0431\u043e\u0432\u0435) *\/\r\n .mode-selector {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 12px;\r\n margin-bottom: 24px;\r\n background: #f1f5f9;\r\n padding: 6px;\r\n border-radius: 10px;\r\n }\r\n\r\n .mode-btn {\r\n background: none;\r\n border: 2px solid transparent;\r\n padding: 12px;\r\n font-size: 0.95rem;\r\n font-weight: 600;\r\n color: #64748b;\r\n cursor: pointer;\r\n border-radius: 8px;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .mode-btn.active {\r\n background: var(--card);\r\n color: var(--primary);\r\n box-shadow: 0 1px 3px 0 rgb(0 0 0 \/ 0.1);\r\n }\r\n\r\n .mode-btn:hover {\r\n background: #e2e8f0 !important;\r\n color: #0f172a !important;\r\n }\r\n\r\n .mode-btn.active:hover {\r\n background: var(--card) !important;\r\n color: var(--primary) !important;\r\n }\r\n\r\n \/* \u0421\u0435\u043a\u0446\u0438\u0438 *\/\r\n .view-section {\r\n display: none;\r\n }\r\n\r\n .view-section.active {\r\n display: block;\r\n }\r\n\r\n .product-card {\r\n background: #f8fafc;\r\n border: 1px solid var(--border);\r\n border-radius: 12px;\r\n padding: 16px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n }\r\n\r\n .product-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-bottom: 14px;\r\n border-bottom: 1px dashed #cbd5e1;\r\n padding-bottom: 8px;\r\n }\r\n\r\n .product-title {\r\n font-size: 1rem;\r\n font-weight: 700;\r\n color: #334155;\r\n }\r\n\r\n .remove-btn {\r\n background: none;\r\n border: none;\r\n color: var(--danger);\r\n font-weight: 600;\r\n cursor: pointer;\r\n font-size: 0.875rem;\r\n }\r\n\r\n .form-group {\r\n margin-bottom: 18px;\r\n }\r\n\r\n label {\r\n display: block;\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n margin-bottom: 6px;\r\n color: #475569;\r\n }\r\n\r\n input[type=\"text\"],\r\n input[type=\"number\"],\r\n textarea {\r\n width: 100%;\r\n padding: 12px;\r\n border: 1px solid var(--border);\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n outline: none;\r\n background: #fff;\r\n transition: border-color 0.2s;\r\n }\r\n\r\n input:focus, textarea:focus {\r\n border-color: var(--primary);\r\n }\r\n\r\n .large-textarea {\r\n min-height: 160px;\r\n resize: vertical;\r\n }\r\n\r\n .row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 12px;\r\n }\r\n\r\n \/* \u041a\u0430\u0447\u0432\u0430\u043d\u0435 \u043d\u0430 \u0444\u0430\u0439\u043b\u043e\u0432\u0435 *\/\r\n .file-upload {\r\n border: 2px dashed #cbd5e1;\r\n padding: 24px;\r\n border-radius: 8px;\r\n text-align: center;\r\n cursor: pointer;\r\n background: #ffffff;\r\n position: relative;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .file-upload:hover {\r\n background: #f1f5f9 !important;\r\n border-color: var(--primary) !important;\r\n }\r\n\r\n .file-upload input[type=\"file\"] {\r\n position: absolute;\r\n top: 0; left: 0; width: 100%; height: 100%;\r\n opacity: 0; cursor: pointer;\r\n }\r\n\r\n .preview-img {\r\n max-width: 100%;\r\n max-height: 120px;\r\n border-radius: 6px;\r\n display: none;\r\n margin: 8px auto 0 auto;\r\n }\r\n\r\n \/* \u2795 \u0411\u0423\u0422\u041e\u041d: \u0414\u043e\u0431\u0430\u0432\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 *\/\r\n .add-product-btn {\r\n width: 100%;\r\n background: var(--primary);\r\n color: white;\r\n border: 2px solid var(--primary);\r\n padding: 14px;\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n margin-bottom: 24px;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .add-product-btn:hover {\r\n background: #ffffff !important;\r\n color: var(--primary) !important;\r\n border: 2px solid var(--primary) !important;\r\n }\r\n\r\n .global-section {\r\n border-top: 1px solid var(--border);\r\n padding-top: 20px;\r\n }\r\n\r\n .vat-container {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n background: #f1f5f9;\r\n padding: 14px;\r\n border-radius: 8px;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .switch {\r\n position: relative;\r\n display: inline-block;\r\n width: 50px;\r\n height: 26px;\r\n }\r\n\r\n .switch input { opacity: 0; width: 0; height: 0; }\r\n\r\n .slider {\r\n position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;\r\n background-color: #cbd5e1; transition: .3s; border-radius: 34px;\r\n }\r\n\r\n .slider:before {\r\n position: absolute; content: \"\"; height: 18px; width: 18px; left: 4px; bottom: 4px;\r\n background-color: white; transition: .3s; border-radius: 50%;\r\n }\r\n\r\n input:checked + .slider { background-color: var(--primary); }\r\n input:checked + .slider:before { transform: translateX(24px); }\r\n\r\n .total-box {\r\n background: #e0f2fe;\r\n border: 1px solid #bae6fd;\r\n padding: 18px;\r\n border-radius: 8px;\r\n text-align: center;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .total-box span { font-size: 0.9rem; color: #0369a1; display: block; }\r\n .total-box strong { font-size: 2rem; color: #0369a1; }\r\n\r\n \/* \u041e\u0421\u041d\u041e\u0412\u041d\u0418 \u0411\u0423\u0422\u041e\u041d\u0418 (\u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0430\u0439 \/ \u041f\u0440\u0435\u0432\u0435\u0434\u0438) *\/\r\n .btn {\r\n width: 100%;\r\n background: var(--primary);\r\n color: white;\r\n border: 2px solid var(--primary);\r\n padding: 15px;\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .btn:hover {\r\n background: #ffffff !important;\r\n color: var(--primary) !important;\r\n border: 2px solid var(--primary) !important;\r\n box-shadow: 0 4px 12px rgb(2 90 135 \/ 0.15) !important;\r\n }\r\n \r\n .btn-success {\r\n background: var(--primary);\r\n border: 2px solid var(--primary);\r\n }\r\n \r\n .btn-success:hover {\r\n background: #ffffff !important;\r\n color: var(--primary) !important;\r\n border: 2px solid var(--primary) !important;\r\n box-shadow: 0 4px 12px rgb(2 90 135 \/ 0.15) !important;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div class=\"container\">\r\n <div class=\"header\">\r\n <h2>\u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438<\/h2>\r\n <\/div>\r\n\r\n <div class=\"mode-selector\">\r\n <button class=\"mode-btn active\" onclick=\"switchMode('translate-view', this)\">\ud83c\udf10 \u041f\u0440\u0435\u0432\u043e\u0434 \u043e\u0442 \u0442\u0443\u0440\u0441\u043a\u0438<\/button>\r\n <button class=\"mode-btn\" onclick=\"switchMode('create-view', this)\">\ud83d\udcc4 \u0421\u044a\u0437\u0434\u0430\u0439 \u043d\u043e\u0432\u0430 \u043e\u0444\u0435\u0440\u0442\u0430<\/button>\r\n <\/div>\r\n\r\n <div id=\"translate-view\" class=\"view-section active\">\r\n <div class=\"form-group\">\r\n <label>\u041f\u0440\u0438\u043a\u0430\u0447\u0438 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u043d\u0430 \u043e\u0444\u0435\u0440\u0442\u0430 (\u043d\u0430 \u0442\u0443\u0440\u0441\u043a\u0438)<\/label>\r\n <div class=\"file-upload\">\r\n <span id=\"doc-upload-text\">\ud83d\udcc4 \u041a\u0430\u0447\u0438 \u0444\u0430\u0439\u043b \u0438\u043b\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u043e\u0442 \u043a\u0430\u0442\u0430\u043b\u043e\u0433<\/span>\r\n <input type=\"file\" id=\"doc-input\" accept=\"image\/*,application\/pdf\" onchange=\"documentUploaded()\">\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0414\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0438 \u043f\u0440\u043e\u043c\u0435\u043d\u0438 \u043f\u043e \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e<\/label>\r\n <textarea id=\"manual-changes\" class=\"large-textarea\" placeholder=\"\u0412\u044a\u0432\u0435\u0434\u0438 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u0438 \u043a\u043e\u0440\u0435\u043a\u0446\u0438\u0438, \u043f\u0440\u043e\u043c\u0435\u043d\u0438 \u0432 \u0446\u0435\u043d\u0438 \u0438\u043b\u0438 \u0431\u0435\u043b\u0435\u0436\u043a\u0438 \u0442\u0443\u043a, \u043a\u043e\u0438\u0442\u043e \u0434\u0430 \u0441\u0435 \u0434\u043e\u0431\u0430\u0432\u044f\u0442 \u043a\u044a\u043c \u043f\u0440\u0435\u0432\u0435\u0434\u0435\u043d\u0430\u0442\u0430 \u043e\u0444\u0435\u0440\u0442\u0430...\"><\/textarea>\r\n <\/div>\r\n\r\n <button class=\"btn btn-success\" onclick=\"alert('\u0414\u0435\u043c\u043e: \u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044a\u0442 \u0441\u0435 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0432\u0430, \u043f\u0440\u0435\u0432\u0435\u0436\u0434\u0430 \u0441\u0435 \u043d\u0430 \u0431\u044a\u043b\u0433\u0430\u0440\u0441\u043a\u0438 \u0438 \u0441\u0435 \u043f\u0440\u0438\u043b\u0430\u0433\u0430\u0442 \u0437\u0430\u0434\u0430\u0434\u0435\u043d\u0438\u0442\u0435 \u043f\u0440\u043e\u043c\u0435\u043d\u0438...')\">\r\n \u041f\u0440\u0435\u0432\u0435\u0434\u0438 \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0438 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430\r\n <\/button>\r\n <\/div>\r\n\r\n <div id=\"create-view\" class=\"view-section\">\r\n <div id=\"products-container\"><\/div>\r\n\r\n <button type=\"button\" class=\"add-product-btn\" onclick=\"addProduct()\">\u2795 \u0414\u043e\u0431\u0430\u0432\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449 \u043f\u0440\u043e\u0434\u0443\u043a\u0442<\/button>\r\n\r\n <div class=\"global-section\">\r\n <div class=\"form-group\">\r\n <label>\u041e\u0431\u0449\u0438 \u0431\u0435\u043b\u0435\u0436\u043a\u0438 \/ \u0421\u043f\u0435\u0446\u0438\u0430\u043b\u043d\u0438 \u0443\u0433\u043e\u0432\u043e\u0440\u043a\u0438<\/label>\r\n <textarea id=\"global-notes\" rows=\"2\" placeholder=\"\u0414\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0430 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0432\u0430\u043b\u0438\u0434\u043d\u0430 \u0437\u0430 \u0446\u044f\u043b\u0430\u0442\u0430 \u043e\u0444\u0435\u0440\u0442\u0430...\"><\/textarea>\r\n <\/div>\r\n\r\n <div class=\"vat-container\">\r\n <label style=\"margin-bottom: 0; font-weight: bold;\">\u0412\u043a\u043b\u044e\u0447\u0438 \u0414\u0414\u0421 (20%) \u0437\u0430 \u0446\u044f\u043b\u0430\u0442\u0430 \u0441\u0443\u043c\u0430<\/label>\r\n <label class=\"switch\">\r\n <input type=\"checkbox\" id=\"vat-toggle\" onchange=\"calculateTotal()\">\r\n <span class=\"slider\"><\/span>\r\n <\/label>\r\n <\/div>\r\n\r\n <div class=\"total-box\">\r\n <span>\u041e\u0431\u0449\u0430 \u0441\u0443\u043c\u0430 \u0437\u0430 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430:<\/span>\r\n <strong id=\"total-price\">0.00 \u20ac<\/strong>\r\n <\/div>\r\n\r\n <button class=\"btn\" onclick=\"alert('\u0414\u0435\u043c\u043e: \u0412\u0441\u0438\u0447\u043a\u0438 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0438 \u0441\u0435 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0432\u0430\u0442 \u0438 \u0441\u0435 \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0430 \u043e\u0431\u0449 PDF...')\">\r\n \u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0430\u0439 PDF \u043e\u0444\u0435\u0440\u0442\u0430\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n let productCount = 0;\r\n\r\n function switchMode(viewId, btn) {\r\n document.querySelectorAll('.view-section').forEach(view => view.classList.remove('active'));\r\n document.querySelectorAll('.mode-btn').forEach(b => b.classList.remove('active'));\r\n \r\n document.getElementById(viewId).classList.add('active');\r\n btn.classList.add('active');\r\n }\r\n\r\n function documentUploaded() {\r\n const input = document.getElementById('doc-input');\r\n const text = document.getElementById('doc-upload-text');\r\n if (input.files.length > 0) {\r\n text.innerText = \"\u2705 \u0424\u0430\u0439\u043b\u044a\u0442 \u0435 \u043f\u0440\u0438\u043a\u0430\u0447\u0435\u043d: \" + input.files[0].name;\r\n }\r\n }\r\n\r\n function addProduct() {\r\n productCount++;\r\n const container = document.getElementById('products-container');\r\n \r\n const productHtml = `\r\n <div class=\"product-card\" id=\"product-${productCount}\">\r\n <div class=\"product-header\">\r\n <span class=\"product-title\">\u041f\u0440\u043e\u0434\u0443\u043a\u0442 #${productCount}<\/span>\r\n ${productCount > 1 ? `<button type=\"button\" class=\"remove-btn\" onclick=\"removeProduct(${productCount})\">\u041f\u0440\u0435\u043c\u0430\u0445\u043d\u0438<\/button>` : ''}\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0421\u043d\u0438\u043c\u043a\u0430 \u043e\u0442 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430<\/label>\r\n <div class=\"file-upload\" style=\"padding: 16px;\">\r\n <span id=\"upload-text-${productCount}\">\ud83d\udcf8 \u0421\u043d\u0438\u043c\u0430\u0439 \u0438\u043b\u0438 \u043f\u0440\u0438\u043a\u0430\u0447\u0438 \u0444\u0430\u0439\u043b<\/span>\r\n <input type=\"file\" accept=\"image\/*\" onchange=\"previewImage(this, ${productCount})\">\r\n <img decoding=\"async\" id=\"preview-${productCount}\" class=\"preview-img\" src=\"#\" alt=\"\u041f\u0440\u0435\u0433\u043b\u0435\u0434\">\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0418\u043c\u0435 \u043d\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430<\/label>\r\n <input type=\"text\" placeholder=\"\u041f\u0440\u0438\u043c. \u041c\u043e\u0434\u0435\u0440\u0435\u043d \u0434\u0438\u0432\u0430\u043d \u043c\u043e\u0434\u0435\u043b X\">\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0420\u0430\u0437\u043c\u0435\u0440<\/label>\r\n <input type=\"text\" placeholder=\"\u041f\u0440\u0438\u043c. 220\u044590 \u0441\u043c\">\r\n <\/div>\r\n\r\n <div class=\"row\">\r\n <div class=\"form-group\">\r\n <label>\u0415\u0434\u0438\u043d\u0438\u0447\u043d\u0430 \u0446\u0435\u043d\u0430 (\u20ac)<\/label>\r\n <input type=\"number\" class=\"prod-price\" value=\"0\" min=\"0\" oninput=\"calculateTotal()\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label>\u0411\u0440\u043e\u0439\u043a\u0438<\/label>\r\n <input type=\"number\" class=\"prod-qty\" value=\"1\" min=\"1\" oninput=\"calculateTotal()\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n `;\r\n \r\n container.insertAdjacentHTML('beforeend', productHtml);\r\n calculateTotal();\r\n }\r\n\r\n function removeProduct(id) {\r\n const productCard = document.getElementById(`product-${id}`);\r\n if (productCard) {\r\n productCard.remove();\r\n calculateTotal();\r\n }\r\n }\r\n\r\n function previewImage(input, id) {\r\n const file = input.files[0];\r\n const previewImg = document.getElementById(`preview-${id}`);\r\n const uploadText = document.getElementById(`upload-text-${id}`);\r\n \r\n if (file) {\r\n const reader = new FileReader();\r\n reader.onload = function(e) {\r\n previewImg.src = e.target.result;\r\n previewImg.style.display = 'block';\r\n uploadText.style.display = 'none';\r\n }\r\n reader.readAsDataURL(file);\r\n }\r\n }\r\n\r\n function calculateTotal() {\r\n const prices = document.querySelectorAll('.prod-price');\r\n const qtys = document.querySelectorAll('.prod-qty');\r\n const vatToggle = document.getElementById('vat-toggle');\r\n const totalPriceEl = document.getElementById('total-price');\r\n\r\n let total = 0;\r\n prices.forEach((priceInput, index) => {\r\n let price = parseFloat(priceInput.value) || 0;\r\n let qty = parseInt(qtys[index].value) || 1;\r\n total += price * qty;\r\n });\r\n\r\n if (vatToggle.checked) {\r\n total = total * 1.20;\r\n }\r\n\r\n totalPriceEl.innerText = total.toFixed(2) + ' \u20ac';\r\n }\r\n\r\n addProduct();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438 \u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438 \ud83c\udf10 \u041f\u0440\u0435\u0432\u043e\u0434 \u043e\u0442 \u0442\u0443\u0440\u0441\u043a\u0438 \ud83d\udcc4 \u0421\u044a\u0437\u0434\u0430\u0439 \u043d\u043e\u0432\u0430 \u043e\u0444\u0435\u0440\u0442\u0430 \u041f\u0440\u0438\u043a\u0430\u0447\u0438 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u043d\u0430 \u043e\u0444\u0435\u0440\u0442\u0430 (\u043d\u0430 \u0442\u0443\u0440\u0441\u043a\u0438) \ud83d\udcc4 \u041a\u0430\u0447\u0438 \u0444\u0430\u0439\u043b \u0438\u043b\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u043e\u0442 \u043a\u0430\u0442\u0430\u043b\u043e\u0433 \u0414\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0438 \u043f\u0440\u043e\u043c\u0435\u043d\u0438 \u043f\u043e \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e \u041f\u0440\u0435\u0432\u0435\u0434\u0438 \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0438 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430 \u2795 \u0414\u043e\u0431\u0430\u0432\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u041e\u0431\u0449\u0438 \u0431\u0435\u043b\u0435\u0436\u043a\u0438 \/ \u0421\u043f\u0435\u0446\u0438\u0430\u043b\u043d\u0438 \u0443\u0433\u043e\u0432\u043e\u0440\u043a\u0438 \u0412\u043a\u043b\u044e\u0447\u0438 \u0414\u0414\u0421 (20%) \u0437\u0430 \u0446\u044f\u043b\u0430\u0442\u0430 \u0441\u0443\u043c\u0430 \u041e\u0431\u0449\u0430 \u0441\u0443\u043c\u0430 \u0437\u0430 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430: 0.00 \u20ac […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"rank_math_title":"","rank_math_description":"","rank_math_focus_keyword":"","footnotes":""},"class_list":["post-25746","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages\/25746","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/comments?post=25746"}],"version-history":[{"count":13,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages\/25746\/revisions"}],"predecessor-version":[{"id":25759,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages\/25746\/revisions\/25759"}],"wp:attachment":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/media?parent=25746"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438<\/title>\r\n <style>\r\n :root {\r\n --primary: #025a87;\r\n --primary-hover: #014161;\r\n --bg: #f8fafc;\r\n --card: #ffffff;\r\n --text: #1e293b;\r\n --border: #e2e8f0;\r\n --danger: #ef4444;\r\n }\r\n\r\n * {\r\n box-sizing: border-box;\r\n margin: 0;\r\n padding: 0;\r\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\r\n }\r\n\r\n body {\r\n background-color: var(--bg);\r\n color: var(--text);\r\n padding: 20px;\r\n display: flex;\r\n justify-content: center;\r\n }\r\n\r\n .container {\r\n width: 100%;\r\n max-width: 600px;\r\n background: var(--card);\r\n padding: 24px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 6px -1px rgb(0 0 0 \/ 0.1), 0 2px 4px -2px rgb(0 0 0 \/ 0.1);\r\n }\r\n\r\n .header {\r\n margin-bottom: 20px;\r\n text-align: center;\r\n }\r\n\r\n .header h2 {\r\n font-size: 1.5rem;\r\n color: #0f172a;\r\n margin-bottom: 4px;\r\n }\r\n\r\n \/* \u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u043e\u043d\u043d\u0438 \u0431\u0443\u0442\u043e\u043d\u0438 (\u0422\u0430\u0431\u043e\u0432\u0435) *\/\r\n .mode-selector {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 12px;\r\n margin-bottom: 24px;\r\n background: #f1f5f9;\r\n padding: 6px;\r\n border-radius: 10px;\r\n }\r\n\r\n .mode-btn {\r\n background: none;\r\n border: 2px solid transparent;\r\n padding: 12px;\r\n font-size: 0.95rem;\r\n font-weight: 600;\r\n color: #64748b;\r\n cursor: pointer;\r\n border-radius: 8px;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .mode-btn.active {\r\n background: var(--card);\r\n color: var(--primary);\r\n box-shadow: 0 1px 3px 0 rgb(0 0 0 \/ 0.1);\r\n }\r\n\r\n .mode-btn:hover {\r\n background: #e2e8f0 !important;\r\n color: #0f172a !important;\r\n }\r\n\r\n .mode-btn.active:hover {\r\n background: var(--card) !important;\r\n color: var(--primary) !important;\r\n }\r\n\r\n \/* \u0421\u0435\u043a\u0446\u0438\u0438 *\/\r\n .view-section {\r\n display: none;\r\n }\r\n\r\n .view-section.active {\r\n display: block;\r\n }\r\n\r\n .product-card {\r\n background: #f8fafc;\r\n border: 1px solid var(--border);\r\n border-radius: 12px;\r\n padding: 16px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n }\r\n\r\n .product-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-bottom: 14px;\r\n border-bottom: 1px dashed #cbd5e1;\r\n padding-bottom: 8px;\r\n }\r\n\r\n .product-title {\r\n font-size: 1rem;\r\n font-weight: 700;\r\n color: #334155;\r\n }\r\n\r\n .remove-btn {\r\n background: none;\r\n border: none;\r\n color: var(--danger);\r\n font-weight: 600;\r\n cursor: pointer;\r\n font-size: 0.875rem;\r\n }\r\n\r\n .form-group {\r\n margin-bottom: 18px;\r\n }\r\n\r\n label {\r\n display: block;\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n margin-bottom: 6px;\r\n color: #475569;\r\n }\r\n\r\n input[type=\"text\"],\r\n input[type=\"number\"],\r\n textarea {\r\n width: 100%;\r\n padding: 12px;\r\n border: 1px solid var(--border);\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n outline: none;\r\n background: #fff;\r\n transition: border-color 0.2s;\r\n }\r\n\r\n input:focus, textarea:focus {\r\n border-color: var(--primary);\r\n }\r\n\r\n .large-textarea {\r\n min-height: 160px;\r\n resize: vertical;\r\n }\r\n\r\n .row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 12px;\r\n }\r\n\r\n \/* \u041a\u0430\u0447\u0432\u0430\u043d\u0435 \u043d\u0430 \u0444\u0430\u0439\u043b\u043e\u0432\u0435 *\/\r\n .file-upload {\r\n border: 2px dashed #cbd5e1;\r\n padding: 24px;\r\n border-radius: 8px;\r\n text-align: center;\r\n cursor: pointer;\r\n background: #ffffff;\r\n position: relative;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .file-upload:hover {\r\n background: #f1f5f9 !important;\r\n border-color: var(--primary) !important;\r\n }\r\n\r\n .file-upload input[type=\"file\"] {\r\n position: absolute;\r\n top: 0; left: 0; width: 100%; height: 100%;\r\n opacity: 0; cursor: pointer;\r\n }\r\n\r\n .preview-img {\r\n max-width: 100%;\r\n max-height: 120px;\r\n border-radius: 6px;\r\n display: none;\r\n margin: 8px auto 0 auto;\r\n }\r\n\r\n \/* \u2795 \u0411\u0423\u0422\u041e\u041d: \u0414\u043e\u0431\u0430\u0432\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 *\/\r\n .add-product-btn {\r\n width: 100%;\r\n background: var(--primary);\r\n color: white;\r\n border: 2px solid var(--primary);\r\n padding: 14px;\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n margin-bottom: 24px;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .add-product-btn:hover {\r\n background: #ffffff !important;\r\n color: var(--primary) !important;\r\n border: 2px solid var(--primary) !important;\r\n }\r\n\r\n .global-section {\r\n border-top: 1px solid var(--border);\r\n padding-top: 20px;\r\n }\r\n\r\n .vat-container {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n background: #f1f5f9;\r\n padding: 14px;\r\n border-radius: 8px;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .switch {\r\n position: relative;\r\n display: inline-block;\r\n width: 50px;\r\n height: 26px;\r\n }\r\n\r\n .switch input { opacity: 0; width: 0; height: 0; }\r\n\r\n .slider {\r\n position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0;\r\n background-color: #cbd5e1; transition: .3s; border-radius: 34px;\r\n }\r\n\r\n .slider:before {\r\n position: absolute; content: \"\"; height: 18px; width: 18px; left: 4px; bottom: 4px;\r\n background-color: white; transition: .3s; border-radius: 50%;\r\n }\r\n\r\n input:checked + .slider { background-color: var(--primary); }\r\n input:checked + .slider:before { transform: translateX(24px); }\r\n\r\n .total-box {\r\n background: #e0f2fe;\r\n border: 1px solid #bae6fd;\r\n padding: 18px;\r\n border-radius: 8px;\r\n text-align: center;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .total-box span { font-size: 0.9rem; color: #0369a1; display: block; }\r\n .total-box strong { font-size: 2rem; color: #0369a1; }\r\n\r\n \/* \u041e\u0421\u041d\u041e\u0412\u041d\u0418 \u0411\u0423\u0422\u041e\u041d\u0418 (\u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0430\u0439 \/ \u041f\u0440\u0435\u0432\u0435\u0434\u0438) *\/\r\n .btn {\r\n width: 100%;\r\n background: var(--primary);\r\n color: white;\r\n border: 2px solid var(--primary);\r\n padding: 15px;\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .btn:hover {\r\n background: #ffffff !important;\r\n color: var(--primary) !important;\r\n border: 2px solid var(--primary) !important;\r\n box-shadow: 0 4px 12px rgb(2 90 135 \/ 0.15) !important;\r\n }\r\n \r\n .btn-success {\r\n background: var(--primary);\r\n border: 2px solid var(--primary);\r\n }\r\n \r\n .btn-success:hover {\r\n background: #ffffff !important;\r\n color: var(--primary) !important;\r\n border: 2px solid var(--primary) !important;\r\n box-shadow: 0 4px 12px rgb(2 90 135 \/ 0.15) !important;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div class=\"container\">\r\n <div class=\"header\">\r\n <h2>\u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438<\/h2>\r\n <\/div>\r\n\r\n <div class=\"mode-selector\">\r\n <button class=\"mode-btn active\" onclick=\"switchMode('translate-view', this)\">\ud83c\udf10 \u041f\u0440\u0435\u0432\u043e\u0434 \u043e\u0442 \u0442\u0443\u0440\u0441\u043a\u0438<\/button>\r\n <button class=\"mode-btn\" onclick=\"switchMode('create-view', this)\">\ud83d\udcc4 \u0421\u044a\u0437\u0434\u0430\u0439 \u043d\u043e\u0432\u0430 \u043e\u0444\u0435\u0440\u0442\u0430<\/button>\r\n <\/div>\r\n\r\n <div id=\"translate-view\" class=\"view-section active\">\r\n <div class=\"form-group\">\r\n <label>\u041f\u0440\u0438\u043a\u0430\u0447\u0438 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u043d\u0430 \u043e\u0444\u0435\u0440\u0442\u0430 (\u043d\u0430 \u0442\u0443\u0440\u0441\u043a\u0438)<\/label>\r\n <div class=\"file-upload\">\r\n <span id=\"doc-upload-text\">\ud83d\udcc4 \u041a\u0430\u0447\u0438 \u0444\u0430\u0439\u043b \u0438\u043b\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u043e\u0442 \u043a\u0430\u0442\u0430\u043b\u043e\u0433<\/span>\r\n <input type=\"file\" id=\"doc-input\" accept=\"image\/*,application\/pdf\" onchange=\"documentUploaded()\">\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0414\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0438 \u043f\u0440\u043e\u043c\u0435\u043d\u0438 \u043f\u043e \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e<\/label>\r\n <textarea id=\"manual-changes\" class=\"large-textarea\" placeholder=\"\u0412\u044a\u0432\u0435\u0434\u0438 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u0447\u043d\u0438 \u043a\u043e\u0440\u0435\u043a\u0446\u0438\u0438, \u043f\u0440\u043e\u043c\u0435\u043d\u0438 \u0432 \u0446\u0435\u043d\u0438 \u0438\u043b\u0438 \u0431\u0435\u043b\u0435\u0436\u043a\u0438 \u0442\u0443\u043a, \u043a\u043e\u0438\u0442\u043e \u0434\u0430 \u0441\u0435 \u0434\u043e\u0431\u0430\u0432\u044f\u0442 \u043a\u044a\u043c \u043f\u0440\u0435\u0432\u0435\u0434\u0435\u043d\u0430\u0442\u0430 \u043e\u0444\u0435\u0440\u0442\u0430...\"><\/textarea>\r\n <\/div>\r\n\r\n <button class=\"btn btn-success\" onclick=\"alert('\u0414\u0435\u043c\u043e: \u0414\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u044a\u0442 \u0441\u0435 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0432\u0430, \u043f\u0440\u0435\u0432\u0435\u0436\u0434\u0430 \u0441\u0435 \u043d\u0430 \u0431\u044a\u043b\u0433\u0430\u0440\u0441\u043a\u0438 \u0438 \u0441\u0435 \u043f\u0440\u0438\u043b\u0430\u0433\u0430\u0442 \u0437\u0430\u0434\u0430\u0434\u0435\u043d\u0438\u0442\u0435 \u043f\u0440\u043e\u043c\u0435\u043d\u0438...')\">\r\n \u041f\u0440\u0435\u0432\u0435\u0434\u0438 \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0438 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430\r\n <\/button>\r\n <\/div>\r\n\r\n <div id=\"create-view\" class=\"view-section\">\r\n <div id=\"products-container\"><\/div>\r\n\r\n <button type=\"button\" class=\"add-product-btn\" onclick=\"addProduct()\">\u2795 \u0414\u043e\u0431\u0430\u0432\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449 \u043f\u0440\u043e\u0434\u0443\u043a\u0442<\/button>\r\n\r\n <div class=\"global-section\">\r\n <div class=\"form-group\">\r\n <label>\u041e\u0431\u0449\u0438 \u0431\u0435\u043b\u0435\u0436\u043a\u0438 \/ \u0421\u043f\u0435\u0446\u0438\u0430\u043b\u043d\u0438 \u0443\u0433\u043e\u0432\u043e\u0440\u043a\u0438<\/label>\r\n <textarea id=\"global-notes\" rows=\"2\" placeholder=\"\u0414\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0430 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0432\u0430\u043b\u0438\u0434\u043d\u0430 \u0437\u0430 \u0446\u044f\u043b\u0430\u0442\u0430 \u043e\u0444\u0435\u0440\u0442\u0430...\"><\/textarea>\r\n <\/div>\r\n\r\n <div class=\"vat-container\">\r\n <label style=\"margin-bottom: 0; font-weight: bold;\">\u0412\u043a\u043b\u044e\u0447\u0438 \u0414\u0414\u0421 (20%) \u0437\u0430 \u0446\u044f\u043b\u0430\u0442\u0430 \u0441\u0443\u043c\u0430<\/label>\r\n <label class=\"switch\">\r\n <input type=\"checkbox\" id=\"vat-toggle\" onchange=\"calculateTotal()\">\r\n <span class=\"slider\"><\/span>\r\n <\/label>\r\n <\/div>\r\n\r\n <div class=\"total-box\">\r\n <span>\u041e\u0431\u0449\u0430 \u0441\u0443\u043c\u0430 \u0437\u0430 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430:<\/span>\r\n <strong id=\"total-price\">0.00 \u20ac<\/strong>\r\n <\/div>\r\n\r\n <button class=\"btn\" onclick=\"alert('\u0414\u0435\u043c\u043e: \u0412\u0441\u0438\u0447\u043a\u0438 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0438 \u0441\u0435 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0432\u0430\u0442 \u0438 \u0441\u0435 \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0430 \u043e\u0431\u0449 PDF...')\">\r\n \u0413\u0435\u043d\u0435\u0440\u0438\u0440\u0430\u0439 PDF \u043e\u0444\u0435\u0440\u0442\u0430\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n let productCount = 0;\r\n\r\n function switchMode(viewId, btn) {\r\n document.querySelectorAll('.view-section').forEach(view => view.classList.remove('active'));\r\n document.querySelectorAll('.mode-btn').forEach(b => b.classList.remove('active'));\r\n \r\n document.getElementById(viewId).classList.add('active');\r\n btn.classList.add('active');\r\n }\r\n\r\n function documentUploaded() {\r\n const input = document.getElementById('doc-input');\r\n const text = document.getElementById('doc-upload-text');\r\n if (input.files.length > 0) {\r\n text.innerText = \"\u2705 \u0424\u0430\u0439\u043b\u044a\u0442 \u0435 \u043f\u0440\u0438\u043a\u0430\u0447\u0435\u043d: \" + input.files[0].name;\r\n }\r\n }\r\n\r\n function addProduct() {\r\n productCount++;\r\n const container = document.getElementById('products-container');\r\n \r\n const productHtml = `\r\n <div class=\"product-card\" id=\"product-${productCount}\">\r\n <div class=\"product-header\">\r\n <span class=\"product-title\">\u041f\u0440\u043e\u0434\u0443\u043a\u0442 #${productCount}<\/span>\r\n ${productCount > 1 ? `<button type=\"button\" class=\"remove-btn\" onclick=\"removeProduct(${productCount})\">\u041f\u0440\u0435\u043c\u0430\u0445\u043d\u0438<\/button>` : ''}\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0421\u043d\u0438\u043c\u043a\u0430 \u043e\u0442 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430<\/label>\r\n <div class=\"file-upload\" style=\"padding: 16px;\">\r\n <span id=\"upload-text-${productCount}\">\ud83d\udcf8 \u0421\u043d\u0438\u043c\u0430\u0439 \u0438\u043b\u0438 \u043f\u0440\u0438\u043a\u0430\u0447\u0438 \u0444\u0430\u0439\u043b<\/span>\r\n <input type=\"file\" accept=\"image\/*\" onchange=\"previewImage(this, ${productCount})\">\r\n <img decoding=\"async\" id=\"preview-${productCount}\" class=\"preview-img\" src=\"#\" alt=\"\u041f\u0440\u0435\u0433\u043b\u0435\u0434\">\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0418\u043c\u0435 \u043d\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430<\/label>\r\n <input type=\"text\" placeholder=\"\u041f\u0440\u0438\u043c. \u041c\u043e\u0434\u0435\u0440\u0435\u043d \u0434\u0438\u0432\u0430\u043d \u043c\u043e\u0434\u0435\u043b X\">\r\n <\/div>\r\n\r\n <div class=\"form-group\">\r\n <label>\u0420\u0430\u0437\u043c\u0435\u0440<\/label>\r\n <input type=\"text\" placeholder=\"\u041f\u0440\u0438\u043c. 220\u044590 \u0441\u043c\">\r\n <\/div>\r\n\r\n <div class=\"row\">\r\n <div class=\"form-group\">\r\n <label>\u0415\u0434\u0438\u043d\u0438\u0447\u043d\u0430 \u0446\u0435\u043d\u0430 (\u20ac)<\/label>\r\n <input type=\"number\" class=\"prod-price\" value=\"0\" min=\"0\" oninput=\"calculateTotal()\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label>\u0411\u0440\u043e\u0439\u043a\u0438<\/label>\r\n <input type=\"number\" class=\"prod-qty\" value=\"1\" min=\"1\" oninput=\"calculateTotal()\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n `;\r\n \r\n container.insertAdjacentHTML('beforeend', productHtml);\r\n calculateTotal();\r\n }\r\n\r\n function removeProduct(id) {\r\n const productCard = document.getElementById(`product-${id}`);\r\n if (productCard) {\r\n productCard.remove();\r\n calculateTotal();\r\n }\r\n }\r\n\r\n function previewImage(input, id) {\r\n const file = input.files[0];\r\n const previewImg = document.getElementById(`preview-${id}`);\r\n const uploadText = document.getElementById(`upload-text-${id}`);\r\n \r\n if (file) {\r\n const reader = new FileReader();\r\n reader.onload = function(e) {\r\n previewImg.src = e.target.result;\r\n previewImg.style.display = 'block';\r\n uploadText.style.display = 'none';\r\n }\r\n reader.readAsDataURL(file);\r\n }\r\n }\r\n\r\n function calculateTotal() {\r\n const prices = document.querySelectorAll('.prod-price');\r\n const qtys = document.querySelectorAll('.prod-qty');\r\n const vatToggle = document.getElementById('vat-toggle');\r\n const totalPriceEl = document.getElementById('total-price');\r\n\r\n let total = 0;\r\n prices.forEach((priceInput, index) => {\r\n let price = parseFloat(priceInput.value) || 0;\r\n let qty = parseInt(qtys[index].value) || 1;\r\n total += price * qty;\r\n });\r\n\r\n if (vatToggle.checked) {\r\n total = total * 1.20;\r\n }\r\n\r\n totalPriceEl.innerText = total.toFixed(2) + ' \u20ac';\r\n }\r\n\r\n addProduct();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438 \u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430 \u041e\u0444\u0435\u0440\u0442\u0438 \ud83c\udf10 \u041f\u0440\u0435\u0432\u043e\u0434 \u043e\u0442 \u0442\u0443\u0440\u0441\u043a\u0438 \ud83d\udcc4 \u0421\u044a\u0437\u0434\u0430\u0439 \u043d\u043e\u0432\u0430 \u043e\u0444\u0435\u0440\u0442\u0430 \u041f\u0440\u0438\u043a\u0430\u0447\u0438 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u043d\u0430 \u043e\u0444\u0435\u0440\u0442\u0430 (\u043d\u0430 \u0442\u0443\u0440\u0441\u043a\u0438) \ud83d\udcc4 \u041a\u0430\u0447\u0438 \u0444\u0430\u0439\u043b \u0438\u043b\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442 \u043e\u0442 \u043a\u0430\u0442\u0430\u043b\u043e\u0433 \u0414\u043e\u043f\u044a\u043b\u043d\u0438\u0442\u0435\u043b\u043d\u0438 \u043f\u0440\u043e\u043c\u0435\u043d\u0438 \u043f\u043e \u0441\u044a\u0434\u044a\u0440\u0436\u0430\u043d\u0438\u0435\u0442\u043e \u041f\u0440\u0435\u0432\u0435\u0434\u0438 \u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0438 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430 \u2795 \u0414\u043e\u0431\u0430\u0432\u0438 \u0441\u043b\u0435\u0434\u0432\u0430\u0449 \u043f\u0440\u043e\u0434\u0443\u043a\u0442 \u041e\u0431\u0449\u0438 \u0431\u0435\u043b\u0435\u0436\u043a\u0438 \/ \u0421\u043f\u0435\u0446\u0438\u0430\u043b\u043d\u0438 \u0443\u0433\u043e\u0432\u043e\u0440\u043a\u0438 \u0412\u043a\u043b\u044e\u0447\u0438 \u0414\u0414\u0421 (20%) \u0437\u0430 \u0446\u044f\u043b\u0430\u0442\u0430 \u0441\u0443\u043c\u0430 \u041e\u0431\u0449\u0430 \u0441\u0443\u043c\u0430 \u0437\u0430 \u043e\u0444\u0435\u0440\u0442\u0430\u0442\u0430: 0.00 \u20ac […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"rank_math_title":"","rank_math_description":"","rank_math_focus_keyword":"","footnotes":""},"class_list":["post-25746","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages\/25746","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/comments?post=25746"}],"version-history":[{"count":13,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages\/25746\/revisions"}],"predecessor-version":[{"id":25759,"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/pages\/25746\/revisions\/25759"}],"wp:attachment":[{"href":"https:\/\/skyagency-group.com\/bg\/wp-json\/wp\/v2\/media?parent=25746"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}