{"id":198,"date":"2025-07-24T07:11:08","date_gmt":"2025-07-24T07:11:08","guid":{"rendered":"https:\/\/dtpeduli.com\/donate\/?page_id=198"},"modified":"2026-03-07T10:30:08","modified_gmt":"2026-03-07T10:30:08","slug":"fidyah","status":"publish","type":"page","link":"https:\/\/dtpeduli.com\/donate\/fidyah\/","title":{"rendered":"Fidyah"},"content":{"rendered":"\n\n\n\n \n \n Fidyah Calculator | DT Peduli<\/title>\n \n <!-- Tailwind CSS & Google Fonts -->\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800;900&family=Lora:wght@400;600;700&display=swap\" rel=\"stylesheet\">\n \n <!-- Font Awesome -->\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n \n <!-- AOS Animation -->\n <link href=\"https:\/\/unpkg.com\/aos@2.3.1\/dist\/aos.css\" rel=\"stylesheet\">\n\n <!-- Custom Styles -->\n <style>\n html { scroll-behavior: smooth; }\n body {\n font-family: 'Inter', sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n padding-bottom: 90px; \n overflow-x: hidden;\n }\n @media (min-width: 1024px) {\n body { padding-bottom: 0; }\n }\n\n .font-lora { font-family: 'Lora', serif; }\n .bg-dt-blue { background-color: #00358f; }\n .text-dt-blue { color: #00358f; }\n .bg-dt-yellow { background-color: #ffaf23; }\n .text-dt-yellow { color: #ffaf23; }\n .border-dt-yellow { border-color: #ffaf23; }\n .ring-dt-yellow { --tw-ring-color: #ffaf23; }\n\n \/* Modern Sticky Mobile Styles *\/\n .shadow-soft-up {\n box-shadow: 0 -10px 40px -10px rgba(0, 0, 0, 0.1);\n }\n \n \/* Sticky Header *\/\n #mainHeader {\n transition: background-color 0.4s ease, box-shadow 0.4s ease;\n }\n .header-scrolled {\n background-color: rgba(255, 255, 255, 0.95);\n backdrop-filter: blur(12px);\n -webkit-backdrop-filter: blur(12px);\n box-shadow: 0 4px 20px -5px rgba(0, 0, 0, 0.05);\n }\n\n \/* Hero Animation *\/\n @keyframes kenburns {\n 0% { transform: scale(1); }\n 100% { transform: scale(1.15); }\n }\n .hero-slide.active {\n animation: kenburns 20s ease-out forwards;\n }\n .hero-slide {\n transition: opacity 1.5s ease-in-out;\n }\n\n \/* Zero Gap Dropdown *\/\n .group .mega-menu, .group .simple-dropdown {\n transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out, visibility 0.2s;\n opacity: 0;\n transform: translateY(10px);\n pointer-events: none;\n visibility: hidden;\n top: 100%; \n margin-top: 0;\n }\n .group:hover .mega-menu, .group:hover .simple-dropdown {\n opacity: 1;\n transform: translateY(0);\n pointer-events: auto;\n visibility: visible;\n }\n\n \/* Compact Mega Menu *\/\n .program-link:hover, .program-link.active {\n background-color: white;\n transform: translateX(4px);\n box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.05);\n }\n .program-link.active {\n border-left: 3px solid #00358f;\n }\n .program-link {\n border-left: 3px solid transparent;\n padding: 0.5rem 0.75rem;\n }\n .program-content-panel {\n position: absolute;\n top: 1rem;\n left: 1.5rem;\n right: 1.5rem;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.2s ease-in-out;\n }\n .program-content-panel.active {\n opacity: 1;\n visibility: visible;\n }\n .mega-menu-img {\n height: 160px; \n object-fit: cover;\n }\n\n \/* Mobile Menu Animations *\/\n #mobileMenu.is-open { transform: translateY(0); }\n .mobile-submenu {\n max-height: 0;\n overflow: hidden;\n transition: max-height 0.5s cubic-bezier(0.25, 0.1, 0.25, 1.0);\n }\n \n \/* Custom Loader *\/\n .loader {\n border: 3px solid #f3f3f3;\n border-top: 3px solid #00358f;\n border-radius: 50%;\n width: 24px;\n height: 24px;\n animation: spin 1s linear infinite;\n display: inline-block;\n }\n @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }\n\n \/* Form Inputs *\/\n .input-group { position: relative; }\n .input-group .currency-symbol {\n position: absolute;\n top: 50%;\n left: 0.75rem;\n transform: translateY(-50%);\n pointer-events: none;\n color: #6b7280;\n font-weight: 600;\n font-size: 0.875rem;\n }\n .input-group input { padding-left: 2.5rem; }\n \n \/* Calculator Scrollbar *\/\n .calc-scroll::-webkit-scrollbar { width: 6px; }\n .calc-scroll::-webkit-scrollbar-track { background: #f1f1f1; }\n .calc-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }\n .calc-scroll::-webkit-scrollbar-thumb:hover { background: #94a3b8; }\n\n \/* Modal Transition *\/\n #paymentModal, #wisePaymentModal {\n transition: opacity 0.3s ease-out;\n }\n .modal-content {\n transition: transform 0.3s ease-out, opacity 0.3s ease-out;\n }\n <\/style>\n<\/head>\n<body class=\"bg-gray-50\">\n\n <!-- HEADER -->\n <header id=\"mainHeader\" class=\"sticky top-0 z-50 w-full bg-white\/90 backdrop-blur-md border-b border-gray-100\">\n <div class=\"container mx-auto px-4 lg:px-6\">\n <div class=\"flex items-center justify-between h-16 lg:h-20\">\n <!-- Logo -->\n <a href=\"https:\/\/dtpeduli.com\/\" class=\"flex-shrink-0 flex items-center gap-2\">\n <img decoding=\"async\" src=\"https:\/\/erp.dtpeduli.org\/assets\/2025-06\/250618K5BPVT.png\" alt=\"DT Peduli Logo\" class=\"h-8 lg:h-10 object-contain\" onerror=\"this.onerror=null; this.src='https:\/\/placehold.co\/150x50?text=DT+Peduli';\">\n <\/a>\n \n <!-- Desktop Navigation -->\n <div class=\"hidden lg:flex items-center\">\n <nav class=\"flex items-center space-x-1 h-full\">\n <a href=\"https:\/\/dtpeduli.com\/\" class=\"text-gray-600 hover:text-dt-blue font-medium text-sm uppercase tracking-wide px-3 py-2 rounded-lg hover:bg-gray-50 transition-colors\">Home<\/a>\n \n <!-- About Us -->\n <div class=\"relative group h-full flex items-center\">\n <button class=\"flex items-center text-gray-600 hover:text-dt-blue font-medium text-sm uppercase tracking-wide px-3 py-2 rounded-lg hover:bg-gray-50 transition-all h-10\">\n <span>About Us<\/span>\n <svg class=\"w-3 h-3 ml-1 transform group-hover:rotate-180 transition-transform\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\"><\/path><\/svg>\n <\/button>\n <div class=\"simple-dropdown absolute left-0 w-56 origin-top-left bg-white rounded-lg shadow-xl z-50 border border-gray-100 p-1\">\n <a href=\"https:\/\/dtpeduli.com\/profile\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-50 hover:text-dt-blue\">Profile<\/a>\n <a href=\"https:\/\/dtpeduli.com\/our-management\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-50 hover:text-dt-blue\">Our Management<\/a>\n <a href=\"https:\/\/dtpeduli.com\/history\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-50 hover:text-dt-blue\">History<\/a>\n <a href=\"https:\/\/dtpeduli.com\/official-adress-contact\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-50 hover:text-dt-blue\">Official Address<\/a>\n <\/div>\n <\/div>\n \n <!-- Programs (Compact Mega Menu) -->\n <div class=\"relative group h-full flex items-center\">\n <button class=\"flex items-center text-gray-600 hover:text-dt-blue font-medium text-sm uppercase tracking-wide px-3 py-2 rounded-lg hover:bg-gray-50 transition-all h-10\">\n <span>Programs<\/span>\n <svg class=\"w-3 h-3 ml-1 transform group-hover:rotate-180 transition-transform\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\"><\/path><\/svg>\n <\/button>\n <div class=\"mega-menu absolute -right-24 w-screen max-w-4xl origin-top-right z-50\">\n <div class=\"bg-white rounded-xl shadow-2xl border border-gray-100 grid grid-cols-12 overflow-hidden\">\n <div class=\"col-span-4 bg-gray-50 p-4 border-r border-gray-100\">\n <h3 class=\"text-xs font-bold text-dt-blue uppercase tracking-wider mb-3 ml-2\">Core Pillars<\/h3>\n <div id=\"program-links\" class=\"space-y-1\">\n <a href=\"https:\/\/dtpeduli.com\/dawah\/\" data-program=\"dawah\" class=\"program-link flex items-center rounded-md transition-all duration-200 cursor-pointer\"><div><p class=\"font-semibold text-gray-800 text-sm\">Da’wah<\/p><\/div><\/a>\n <a href=\"https:\/\/dtpeduli.com\/economy\/\" data-program=\"economy\" class=\"program-link flex items-center rounded-md transition-all duration-200 cursor-pointer\"><div><p class=\"font-semibold text-gray-800 text-sm\">Economy<\/p><\/div><\/a>\n <a href=\"https:\/\/dtpeduli.com\/education\/\" data-program=\"education\" class=\"program-link flex items-center rounded-md transition-all duration-200 cursor-pointer\"><div><p class=\"font-semibold text-gray-800 text-sm\">Education<\/p><\/div><\/a>\n <a href=\"https:\/\/dtpeduli.com\/health\/\" data-program=\"health\" class=\"program-link flex items-center rounded-md transition-all duration-200 cursor-pointer\"><div><p class=\"font-semibold text-gray-800 text-sm\">Health<\/p><\/div><\/a>\n <a href=\"https:\/\/dtpeduli.com\/social-humanitarian\/\" data-program=\"social\" class=\"program-link flex items-center rounded-md transition-all duration-200 cursor-pointer\"><div><p class=\"font-semibold text-gray-800 text-sm\">Social Humanitarian<\/p><\/div><\/a>\n <\/div>\n <\/div>\n <div id=\"program-content\" class=\"col-span-8 p-5 relative min-h-[280px]\">\n <div id=\"program-content-dawah\" class=\"program-content-panel active\">\n <img decoding=\"async\" src=\"https:\/\/dtpeduli.com\/wp-content\/uploads\/2025\/05\/Media-2.jpg\" onerror=\"this.src='https:\/\/placehold.co\/600x300?text=Dawah'\" class=\"w-full mega-menu-img rounded-lg mb-3 shadow-sm\">\n <h4 class=\"font-bold text-lg text-dt-blue\">Da’wah Program<\/h4>\n <p class=\"text-gray-600 text-sm mt-1 mb-2 line-clamp-2\">Fostering spiritual growth and spreading peaceful values.<\/p>\n <\/div>\n <div id=\"program-content-economy\" class=\"program-content-panel\">\n <img decoding=\"async\" src=\"https:\/\/dtpeduli.com\/wp-content\/uploads\/2025\/05\/KANDANG-SOREANG-1.png\" onerror=\"this.src='https:\/\/placehold.co\/600x300?text=Economy'\" class=\"w-full mega-menu-img rounded-lg mb-3 shadow-sm\">\n <h4 class=\"font-bold text-lg text-dt-blue\">Economic Empowerment<\/h4>\n <p class=\"text-gray-600 text-sm mt-1 mb-2 line-clamp-2\">Creating sustainable livelihoods via micro-loans.<\/p>\n <\/div>\n <div id=\"program-content-education\" class=\"program-content-panel\">\n <img decoding=\"async\" src=\"https:\/\/dtpeduli.com\/wp-content\/uploads\/2025\/05\/4cc7638b-3eb5-4b00-8309-4ef773ff4a7d-scaled.jpeg\" onerror=\"this.src='https:\/\/placehold.co\/600x300?text=Education'\" class=\"w-full mega-menu-img rounded-lg mb-3 shadow-sm\">\n <h4 class=\"font-bold text-lg text-dt-blue\">Education For All<\/h4>\n <p class=\"text-gray-600 text-sm mt-1 mb-2 line-clamp-2\">Ensuring children have access to quality education.<\/p>\n <\/div>\n <div id=\"program-content-health\" class=\"program-content-panel\">\n <img decoding=\"async\" src=\"https:\/\/dtpeduli.com\/wp-content\/uploads\/2025\/05\/KKOGnoD65U1j95nTiuZlUPrwRfC7YkGQYaK07hfw.jpg\" onerror=\"this.src='https:\/\/placehold.co\/600x300?text=Health'\" class=\"w-full mega-menu-img rounded-lg mb-3 shadow-sm\">\n <h4 class=\"font-bold text-lg text-dt-blue\">Community Health<\/h4>\n <p class=\"text-gray-600 text-sm mt-1 mb-2 line-clamp-2\">Improving well-being by offering free medical services.<\/p>\n <\/div>\n <div id=\"program-content-social\" class=\"program-content-panel\">\n <img decoding=\"async\" src=\"https:\/\/dtpeduli.com\/wp-content\/uploads\/2025\/07\/dapur-umum-gaza.jpg\" onerror=\"this.src='https:\/\/placehold.co\/600x300?text=Social'\" class=\"w-full mega-menu-img rounded-lg mb-3 shadow-sm\">\n <h4 class=\"font-bold text-lg text-dt-blue\">Social & Humanitarian<\/h4>\n <p class=\"text-gray-600 text-sm mt-1 mb-2 line-clamp-2\">Providing rapid response and relief during emergencies.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n <!-- Giving -->\n <div class=\"relative group h-full flex items-center\">\n <button class=\"flex items-center text-dt-blue font-bold text-sm uppercase tracking-wide px-3 py-2 rounded-lg bg-blue-50 transition-all h-10\">\n <span>Giving<\/span>\n <svg class=\"w-3 h-3 ml-1 transform group-hover:rotate-180 transition-transform\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\"><\/path><\/svg>\n <\/button>\n <div class=\"simple-dropdown absolute left-0 w-56 origin-top-left bg-white rounded-lg shadow-xl z-50 border border-gray-100 p-1\">\n <a href=\"https:\/\/dtpeduli.com\/donate\/zakat-maal\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-100 hover:text-dt-blue\">Zakat Maal<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/zakat-al-fitr\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-100 hover:text-dt-blue\">Zakat Fitr<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/sadaqah\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-100 hover:text-dt-blue\">Sadaqah<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/infaq\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-100 hover:text-dt-blue\">Infaq<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/fidyah\/\" class=\"block px-4 py-2 text-sm text-dt-blue font-bold bg-blue-50 rounded-md\">Fidyah<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/palestine-relief\/\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-100 hover:text-dt-blue\">Palestine Relief<\/a>\n <a href=\"http:\/\/dtpeduli.com\/ramadhan\" class=\"block px-4 py-2 text-sm text-gray-600 rounded-md hover:bg-gray-100 hover:text-dt-blue\">Ramadhan<\/a>\n <\/div>\n <\/div>\n \n <!-- Governance -->\n <div class=\"relative group h-full flex items-center\">\n <button class=\"flex items-center text-gray-600 hover:text-dt-blue font-medium text-sm uppercase tracking-wide px-3 py-2 rounded-lg hover:bg-gray-50 transition-all h-10\">\n <span>Governance<\/span>\n <svg class=\"w-3 h-3 ml-1 transform group-hover:rotate-180 transition-transform\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M19 9l-7 7-7-7\"><\/path><\/svg>\n <\/button>\n <div class=\"simple-dropdown absolute right-0 w-56 origin-top-right bg-white rounded-lg shadow-xl z-50 border border-gray-100 p-1\">\n <a href=\"https:\/\/dtpeduli.com\/legal-formal\/\" class=\"block px-4 py-2 text-sm text-gray-600 hover:text-dt-blue\">Legal & Formal<\/a>\n <a href=\"https:\/\/dtpeduli.com\/quality-policy\/\" class=\"block px-4 py-2 text-sm text-gray-600 hover:text-dt-blue\">Quality Policy<\/a>\n <a href=\"https:\/\/dtpeduli.com\/audit-result\/\" class=\"block px-4 py-2 text-sm text-gray-600 hover:text-dt-blue\">Audit Result<\/a>\n <a href=\"https:\/\/dtpeduli.com\/report\/\" class=\"block px-4 py-2 text-sm text-gray-600 hover:text-dt-blue\">Report<\/a>\n <a href=\"https:\/\/dtpeduli.com\/complaint-service\/\" class=\"block px-4 py-2 text-sm text-gray-600 hover:text-dt-blue\">Complaint Service<\/a>\n <a href=\"https:\/\/dtpeduli.com\/terms-and-conditions\/\" class=\"block px-4 py-2 text-sm text-gray-600 hover:text-dt-blue\">Terms and Conditions<\/a>\n <\/div>\n <\/div>\n\n <a href=\"https:\/\/dtpeduli.com\/news-stories\/\" class=\"text-gray-600 hover:text-dt-blue font-medium text-sm uppercase tracking-wide px-3 py-2 rounded-lg hover:bg-gray-50 transition-colors\">News<\/a>\n <\/nav>\n \n <!-- Desktop Donate Button -->\n <div class=\"ml-4\">\n <a href=\"https:\/\/dtpeduli.com\/donate\/\" class=\"bg-dt-yellow text-white font-bold text-sm py-2.5 px-5 rounded-full hover:bg-opacity-90 transition-all transform hover:scale-105 shadow-md hover:shadow-lg\">\n Donate Now\n <\/a>\n <\/div>\n <\/div>\n\n <!-- Mobile Menu Button -->\n <button id=\"mobileMenuButton\" class=\"lg:hidden text-dt-blue focus:outline-none z-50 p-2 rounded-md hover:bg-gray-100\">\n <svg id=\"menu-open-icon\" class=\"w-7 h-7\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16M4 18h16\"><\/path><\/svg>\n <svg id=\"menu-close-icon\" class=\"w-7 h-7 hidden\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"><\/path><\/svg>\n <\/button>\n <\/div>\n <\/div>\n \n <!-- Mobile Menu Overlay -->\n <div id=\"mobileMenu\" class=\"lg:hidden fixed top-0 left-0 w-full h-screen bg-white z-40 transform -translate-y-full transition-transform duration-300 ease-in-out pt-20\">\n <div id=\"mobileMenuContent\" class=\"h-full overflow-y-auto pb-32\">\n <a href=\"https:\/\/dtpeduli.com\/\" class=\"block py-4 px-6 text-gray-700 hover:bg-gray-100 border-b border-gray-100\">Home<\/a>\n \n <div class=\"mobile-menu-item border-b border-gray-100\">\n <button class=\"w-full flex justify-between items-center text-gray-700 hover:text-dt-blue font-medium py-4 px-6 focus:outline-none\"><span>About Us<\/span><i class=\"fas fa-chevron-down text-xs transition-transform text-gray-400\"><\/i><\/button>\n <div class=\"mobile-submenu pl-6 bg-gray-50\/50\">\n <a href=\"https:\/\/dtpeduli.com\/profile\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Profile<\/a>\n <a href=\"https:\/\/dtpeduli.com\/our-management\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Our Management<\/a>\n <a href=\"https:\/\/dtpeduli.com\/history\/\" class=\"block py-3 px-6 text-sm text-gray-600\">History<\/a>\n <a href=\"https:\/\/dtpeduli.com\/official-adress-contact\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Official Address<\/a>\n <\/div>\n <\/div>\n <div class=\"mobile-menu-item border-b border-gray-100\">\n <button class=\"w-full flex justify-between items-center text-gray-700 hover:text-dt-blue font-medium py-4 px-6 focus:outline-none\"><span>Programs<\/span><i class=\"fas fa-chevron-down text-xs transition-transform text-gray-400\"><\/i><\/button>\n <div class=\"mobile-submenu pl-6 bg-gray-50\/50\">\n <a href=\"https:\/\/dtpeduli.com\/dawah\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Da’wah<\/a>\n <a href=\"https:\/\/dtpeduli.com\/economy\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Economy<\/a>\n <a href=\"https:\/\/dtpeduli.com\/education\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Education<\/a>\n <a href=\"https:\/\/dtpeduli.com\/health\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Health<\/a>\n <a href=\"https:\/\/dtpeduli.com\/social-humanitarian\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Social Humanitarian<\/a>\n <\/div>\n <\/div>\n <div class=\"mobile-menu-item border-b border-gray-100\">\n <button class=\"w-full flex justify-between items-center text-dt-blue font-bold py-4 px-6 focus:outline-none bg-blue-50\/50\"><span>Giving<\/span><i class=\"fas fa-chevron-down text-xs transition-transform text-gray-400\"><\/i><\/button>\n <div class=\"mobile-submenu pl-6 bg-gray-50\/50\">\n <a href=\"https:\/\/dtpeduli.com\/donate\/zakat-maal\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Zakat Maal<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/zakat-al-fitr\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Zakat Fitr<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/sadaqah\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Sadaqah<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/infaq\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Infaq<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/fidyah\/\" class=\"block py-3 px-6 text-sm text-dt-blue font-bold bg-white\">Fidyah<\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/palestine-relief\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Palestine Relief<\/a>\n <\/div>\n <\/div>\n <div class=\"mobile-menu-item border-b border-gray-100\">\n <button class=\"w-full flex justify-between items-center text-gray-700 hover:text-dt-blue font-medium py-4 px-6 focus:outline-none\"><span>Governance<\/span><i class=\"fas fa-chevron-down text-xs transition-transform text-gray-400\"><\/i><\/button>\n <div class=\"mobile-submenu pl-6 bg-gray-50\/50\">\n <a href=\"https:\/\/dtpeduli.com\/legal-formal\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Legal & Formal<\/a>\n <a href=\"https:\/\/dtpeduli.com\/quality-policy\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Quality Policy<\/a>\n <a href=\"https:\/\/dtpeduli.com\/audit-result\/\" class=\"block py-3 px-6 text-sm text-gray-600\">Audit Result<\/a>\n <\/div>\n <\/div>\n <a href=\"https:\/\/dtpeduli.com\/news-stories\/\" class=\"block text-gray-700 hover:text-dt-blue font-medium py-4 px-6 border-b border-gray-100\">News & Stories<\/a>\n <div class=\"p-6\">\n <a href=\"https:\/\/dtpeduli.com\/donate\/\" class=\"block w-full text-center py-3 px-6 text-white bg-dt-yellow rounded-lg font-bold shadow-md\">Donate Now<\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/header>\n\n <!-- MAIN CONTENT -->\n <main>\n <!-- HERO SECTION & CALCULATOR -->\n <section id=\"hero-section\" class=\"relative text-white min-h-screen flex items-center justify-center overflow-hidden bg-gray-900\">\n <!-- Slider Container -->\n <div id=\"hero-slider\" class=\"absolute inset-0 w-full h-full z-0\">\n <!-- Slides will be injected dynamically here -->\n <\/div>\n\n <!-- Overlay -->\n <div class=\"absolute inset-0 bg-gradient-to-t from-black\/80 via-black\/40 to-transparent z-10 pointer-events-none\"><\/div>\n \n <div class=\"container mx-auto px-6 relative z-20 pt-24 pb-12 h-full flex flex-col lg:flex-row items-center justify-center lg:justify-between gap-12\">\n \n <!-- Hero Text -->\n <div class=\"text-center lg:text-left max-w-2xl\" data-aos=\"fade-right\">\n <div id=\"hero-text-content\">\n <span class=\"inline-block bg-dt-yellow text-white text-xs font-bold px-3 py-1 rounded-full mb-4 shadow-sm uppercase tracking-wide\">Fidyah<\/span>\n <h1 class=\"text-4xl md:text-6xl font-lora font-bold mb-6 leading-tight tracking-tight drop-shadow-2xl\">\n Fulfill Your Fasting Obligation with Fidyah\n <\/h1>\n <p class=\"text-lg md:text-xl text-gray-200 mb-8 leading-relaxed\">\n Fulfill your obligation for missed fasts during Ramadan with ease and trust. Your Fidyah provides meals for those in need.\n <\/p>\n <div class=\"hidden lg:block\">\n <a href=\"#understanding-fidyah\" class=\"inline-block border-2 border-white text-white font-bold py-3 px-8 rounded-full hover:bg-white hover:text-dt-blue transition-all transform hover:scale-105\">\n Read More\n <\/a>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- CALCULATOR CARD (OVERLAY) -->\n <div class=\"w-full max-w-md bg-white\/95 backdrop-blur-xl rounded-3xl shadow-2xl p-6 md:p-8 border border-white\/20 text-gray-800 calc-scroll overflow-y-auto max-h-[80vh]\" data-aos=\"fade-left\" data-aos-delay=\"200\">\n <div class=\"flex items-center justify-between mb-6 border-b pb-4 border-gray-200\">\n <h2 class=\"text-2xl font-bold text-dt-blue\">Fidyah Calculator<\/h2>\n <i class=\"fas fa-calculator text-dt-yellow text-2xl\"><\/i>\n <\/div>\n \n <div class=\"space-y-5\">\n <div>\n <label class=\"block text-xs font-bold text-gray-500 mb-1 uppercase\">Number of Missed Fasts (Days)<\/label>\n <div class=\"relative\">\n <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n <i class=\"fas fa-calendar-day text-gray-400\"><\/i>\n <\/div>\n <input type=\"number\" id=\"days\" value=\"1\" min=\"1\" class=\"w-full pl-10 p-3 border border-gray-300 rounded-lg bg-white text-sm focus:ring-2 focus:ring-dt-blue text-gray-800\">\n <\/div>\n <\/div>\n\n <div>\n <label class=\"block text-xs font-bold text-gray-500 mb-1 uppercase\">Select Currency<\/label>\n <div class=\"relative\">\n <div class=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3\">\n <i class=\"fas fa-money-bill-wave text-gray-400\"><\/i>\n <\/div>\n <select id=\"currency\" class=\"w-full pl-10 p-3 border border-gray-300 rounded-lg bg-gray-50 text-sm focus:ring-2 focus:ring-dt-blue text-gray-800 appearance-none\">\n <option value=\"loading\">Loading…<\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- Result -->\n <div class=\"bg-gray-900 text-white rounded-xl p-5 text-center mt-6 mb-4\">\n <p class=\"text-xs text-gray-400 uppercase mb-1\">Total Fidyah Amount<\/p>\n <div id=\"total-loader\" class=\"loader mx-auto !border-gray-600 !border-t-dt-yellow my-2\" style=\"display: none;\"><\/div>\n <p id=\"total-amount\" class=\"text-3xl font-bold text-dt-yellow\">—<\/p>\n <p id=\"modal-subtitle\" class=\"hidden text-xs text-gray-400 mt-1\">Enter details to calculate<\/p>\n <\/div>\n\n <button id=\"donateFidyahButton\" class=\"w-full bg-dt-yellow text-dt-blue font-bold py-3 px-6 rounded-lg hover:bg-yellow-500 transition-all shadow-md mt-4\">\n Pay Fidyah Now\n <\/button>\n \n <button id=\"openWiseModalBtn\" class=\"w-full mt-3 border-2 border-gray-200 text-gray-600 font-bold py-3 px-6 rounded-lg hover:border-dt-blue hover:text-dt-blue transition-all flex items-center justify-center\">\n <i class=\"fas fa-globe mr-2\"><\/i> Pay via Wise\n <\/button>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- UNDERSTANDING FIDYAH -->\n <section id=\"understanding-fidyah\" class=\"py-16 lg:py-24 bg-white relative overflow-hidden\">\n <div class=\"absolute top-0 right-0 w-1\/2 h-full bg-gray-50 -z-10 skew-x-12 origin-top\"><\/div>\n <div class=\"container mx-auto px-6 relative z-10\">\n <div class=\"grid grid-cols-1 lg:grid-cols-2 gap-16 items-start\">\n <div data-aos=\"fade-right\">\n <h2 class=\"text-3xl font-bold text-dt-blue mb-6 leading-snug\">Understanding Fidyah<\/h2>\n <div class=\"space-y-6 text-gray-600 leading-relaxed\">\n <p>Fidyah is a religious donation made in Islam to compensate for missed fasts during Ramadan. It is intended for individuals who are unable to fast due to valid long-term reasons, where there is no hope of making up the fasts later.<\/p>\n \n <h3 class=\"text-xl font-bold text-dt-blue mt-8 mb-4\">Who is Obliged?<\/h3>\n <ul class=\"space-y-3\">\n <li class=\"flex items-start\"><i class=\"fas fa-check-circle text-dt-yellow mt-1 mr-3\"><\/i><span><strong>Elderly individuals<\/strong> who find fasting extremely difficult.<\/span><\/li>\n <li class=\"flex items-start\"><i class=\"fas fa-check-circle text-dt-yellow mt-1 mr-3\"><\/i><span>People with <strong>chronic illnesses<\/strong> where fasting could worsen condition.<\/span><\/li>\n <li class=\"flex items-start\"><i class=\"fas fa-check-circle text-dt-yellow mt-1 mr-3\"><\/i><span>Individuals with <strong>permanent disabilities<\/strong>.<\/span><\/li>\n <\/ul>\n <\/div>\n <\/div>\n <div class=\"space-y-6\" data-aos=\"fade-left\" data-aos-delay=\"200\">\n <div class=\"bg-white p-6 rounded-xl shadow-lg border-l-4 border-dt-blue\">\n <div class=\"flex items-center mb-3\">\n <i class=\"fas fa-quote-left text-2xl text-dt-blue mr-4\"><\/i>\n <h3 class=\"font-bold text-xl text-dt-blue\">Majority of Scholars<\/h3>\n <\/div>\n <p class=\"text-gray-700 text-sm leading-relaxed\">\n The majority of scholars (Hanafi, Shafi’i, Hanbali) agree that Fidyah is a required compensation for those permanently unable to fast. The amount is typically equivalent to feeding one needy person for each day of missed fast.\n <\/p>\n <\/div>\n <div class=\"bg-white p-6 rounded-xl shadow-lg border-l-4 border-dt-yellow\">\n <div class=\"flex items-center mb-3\">\n <i class=\"fas fa-quote-left text-2xl text-dt-yellow mr-4\"><\/i>\n <h3 class=\"font-bold text-xl text-dt-blue\">Egyptian Dar al-Ifta<\/h3>\n <\/div>\n <p class=\"text-gray-700 text-sm leading-relaxed\">\n Dar al-Ifta aligns with the majority view, emphasizing that the core purpose is to provide sustenance to the poor. They specify the amount should be sufficient for an average meal for one person.\n <\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n <\/main>\n\n <!-- FOOTER -->\n <footer class=\"bg-dt-blue text-white\" data-aos=\"fade-up\">\n <div class=\"container mx-auto px-6 py-16\">\n <div class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12\">\n <div class=\"md:col-span-2 lg:col-span-1\">\n <img decoding=\"async\" src=\"https:\/\/dtpeduli.com\/wp-content\/uploads\/2025\/12\/DT-PEDULI-PUTIH.png\" alt=\"DT Peduli Logo\" class=\"h-8 lg:h-10 mb-4\">\n <p class=\"text-gray-300 text-sm leading-relaxed mb-4\">A globally trusted charity empowering communities.<\/p>\n <div class=\"text-xs text-gray-400 space-y-1\">\n <p><strong>AUS:<\/strong> ABN 68709571627<\/p>\n <p><strong>ID:<\/strong> SK KEMENAG RI NO 1200 (2022)<\/p>\n <p><strong>TR:<\/strong> K\u00fct\u00fck No: 34-285-124<\/p>\n <\/div>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold mb-4 tracking-wider text-white\">Explore<\/h3>\n <ul class=\"space-y-3 text-sm text-gray-300\">\n <li><a href=\"https:\/\/dtpeduli.com\/profile\/\" class=\"hover:text-dt-yellow transition-colors\">About Us<\/a><\/li>\n <li><a href=\"https:\/\/dtpeduli.com\/news-stories\/\" class=\"hover:text-dt-yellow transition-colors\">News & Stories<\/a><\/li>\n <li><a href=\"https:\/\/dtpeduli.com\/donate\/zakat-maal\/\" class=\"hover:text-dt-yellow transition-colors\">Zakat Calculator<\/a><\/li>\n <li><a href=\"https:\/\/dtpeduli.com\/report\/\" class=\"hover:text-dt-yellow transition-colors\">Our Reports<\/a><\/li>\n <li><a href=\"https:\/\/dtpeduli.com\/official-adress-contact\/\" class=\"hover:text-dt-yellow transition-colors\">Contact Us<\/a><\/li>\n <\/ul>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold mb-4 tracking-wider text-white\">Contact<\/h3>\n <ul class=\"space-y-4 text-gray-300 text-sm\">\n <li class=\"flex items-start\"><i class=\"fas fa-map-marker-alt mr-3 mt-1 text-dt-yellow\"><\/i><span>Jl. Gegerkalong Girang No.32, Bandung<\/span><\/li>\n <li class=\"flex items-center\"><i class=\"fas fa-envelope mr-3 text-dt-yellow\"><\/i><a href=\"mailto:hello@dtpeduli.org\" class=\"hover:text-dt-yellow\">hello@dtpeduli.org<\/a><\/li>\n <li class=\"flex items-center\"><i class=\"fas fa-phone mr-3 text-dt-yellow\"><\/i><span>+62 813-1712-1712<\/span><\/li>\n <\/ul>\n <\/div>\n <div>\n <h3 class=\"text-lg font-semibold mb-4 tracking-wider text-white\">Follow Us<\/h3>\n <div class=\"flex space-x-3 mb-6\">\n <a href=\"https:\/\/www.facebook.com\/dtpeduliaustralia\/\" class=\"w-10 h-10 flex items-center justify-center bg-white\/10 rounded-full hover:bg-dt-yellow hover:text-white transition-all\"><i class=\"fab fa-facebook-f\"><\/i><\/a>\n <a href=\"https:\/\/www.instagram.com\/dtpeduli\/\" class=\"w-10 h-10 flex items-center justify-center bg-white\/10 rounded-full hover:bg-dt-yellow hover:text-white transition-all\"><i class=\"fab fa-instagram\"><\/i><\/a>\n <a href=\"https:\/\/x.com\/dtpeduli\" class=\"w-10 h-10 flex items-center justify-center bg-white\/10 rounded-full hover:bg-dt-yellow hover:text-white transition-all\"><i class=\"fab fa-twitter\"><\/i><\/a>\n <a href=\"https:\/\/www.youtube.com\/dtpeduli\" class=\"w-10 h-10 flex items-center justify-center bg-white\/10 rounded-full hover:bg-dt-yellow hover:text-white transition-all\"><i class=\"fab fa-youtube\"><\/i><\/a>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"bg-black\/20 border-t border-white\/5\"><div class=\"container mx-auto px-6 py-4 text-center text-gray-500 text-xs\">© 2025 DT Peduli. All Rights Reserved.<\/div><\/div>\n <\/footer>\n \n <!-- MOBILE STICKY NAV -->\n <nav class=\"lg:hidden fixed bottom-0 left-0 right-0 bg-white\/90 backdrop-blur-lg shadow-soft-up rounded-t-2xl flex justify-around items-end z-40 pb-2 pt-1 border-t border-white\/50\">\n <a href=\"https:\/\/dtpeduli.com\/\" class=\"flex flex-col items-center w-full py-2 group focus:outline-none tap-highlight-transparent\">\n <img decoding=\"async\" src=\"https:\/\/cdn-icons-png.flaticon.com\/512\/1946\/1946436.png\" alt=\"Home\" class=\"w-6 h-6 mb-1 object-contain opacity-70 group-hover:opacity-100 transition-opacity\"> \n <span class=\"text-[10px] font-semibold text-gray-500 group-hover:text-dt-blue transition-colors\">Home<\/span>\n <\/a>\n <button id=\"servicesButton\" class=\"flex flex-col items-center w-full py-2 group focus:outline-none tap-highlight-transparent\">\n <img decoding=\"async\" src=\"https:\/\/cdn-icons-png.flaticon.com\/512\/3063\/3063822.png\" alt=\"Services\" class=\"w-6 h-6 mb-1 object-contain opacity-70 group-hover:opacity-100 transition-opacity\">\n <span class=\"text-[10px] font-semibold text-gray-500 group-hover:text-dt-blue transition-colors\">Services<\/span>\n <\/button>\n <button id=\"quickDonateButton\" class=\"relative -top-6 group focus:outline-none tap-highlight-transparent\">\n <div class=\"bg-gradient-to-br from-dt-yellow to-orange-400 rounded-full p-4 shadow-xl border-4 border-white\/80 transform transition-transform group-hover:scale-105 group-active:scale-95\">\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"h-7 w-7 text-white\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fill-rule=\"evenodd\" d=\"M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z\" clip-rule=\"evenodd\" \/><\/svg>\n <\/div>\n <span class=\"absolute -bottom-5 left-1\/2 transform -translate-x-1\/2 text-[10px] font-bold text-dt-blue whitespace-nowrap\">Donate<\/span>\n <\/button>\n <a href=\"https:\/\/dtpeduli.com\/profile\/\" class=\"flex flex-col items-center w-full py-2 group focus:outline-none tap-highlight-transparent\">\n <img decoding=\"async\" src=\"https:\/\/cdn-icons-png.flaticon.com\/512\/1077\/1077114.png\" alt=\"Profile\" class=\"w-6 h-6 mb-1 object-contain opacity-70 group-hover:opacity-100 transition-opacity\">\n <span class=\"text-[10px] font-semibold text-gray-500 group-hover:text-dt-blue transition-colors\">Profile<\/span>\n <\/a>\n <button id=\"mobileMenuTriggerBottom\" class=\"flex flex-col items-center w-full py-2 group focus:outline-none tap-highlight-transparent\">\n <img decoding=\"async\" src=\"https:\/\/cdn-icons-png.flaticon.com\/512\/2976\/2976215.png\" alt=\"Menu\" class=\"w-6 h-6 mb-1 object-contain opacity-70 group-hover:opacity-100 transition-opacity\">\n <span class=\"text-[10px] font-semibold text-gray-500 group-hover:text-dt-blue transition-colors\">Menu<\/span>\n <\/button>\n <\/nav>\n \n <!-- MOBILE BOTTOM SHEET -->\n <div id=\"quickDonateSubmenu\" class=\"lg:hidden fixed inset-0 bg-black\/60 backdrop-blur-sm z-[60] flex items-end hidden transition-opacity duration-300\">\n <div class=\"bg-white w-full rounded-t-3xl p-6 shadow-2xl animate-slide-up max-h-[85vh] overflow-y-auto\">\n <div class=\"flex justify-between items-center mb-6 sticky top-0 bg-white pb-2 border-b border-gray-100\">\n <div><h3 class=\"text-xl font-bold text-dt-blue\">Quick Donation<\/h3><p class=\"text-xs text-gray-500\">Select a category to help<\/p><\/div>\n <button id=\"closeQuickDonate\" class=\"w-8 h-8 rounded-full bg-gray-100 flex items-center justify-center text-gray-500 hover:text-gray-800\">×<\/button>\n <\/div>\n <div class=\"grid grid-cols-2 gap-4\">\n <a href=\"https:\/\/dtpeduli.com\/donate\/zakat-maal\/\" class=\"flex flex-col items-center p-4 rounded-2xl bg-gray-50 border border-gray-100 hover:border-dt-yellow hover:bg-yellow-50 transition-all\"><span class=\"text-3xl mb-2\">\ud83d\udcb0<\/span><span class=\"font-semibold text-gray-700 text-sm\">Zakat Maal<\/span><\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/zakat-al-fitr\/\" class=\"flex flex-col items-center p-4 rounded-2xl bg-gray-50 border border-gray-100 hover:border-dt-yellow hover:bg-yellow-50 transition-all\"><span class=\"text-3xl mb-2\">\ud83c\udf5a<\/span><span class=\"font-semibold text-gray-700 text-sm\">Zakat Fitr<\/span><\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/sadaqah\/\" class=\"flex flex-col items-center p-4 rounded-2xl bg-gray-50 border border-gray-100 hover:border-dt-yellow hover:bg-yellow-50 transition-all\"><span class=\"text-3xl mb-2\">\ud83e\udd32<\/span><span class=\"font-semibold text-gray-700 text-sm\">Sadaqah<\/span><\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/infaq\/\" class=\"flex flex-col items-center p-4 rounded-2xl bg-gray-50 border border-gray-100 hover:border-dt-yellow hover:bg-yellow-50 transition-all\"><span class=\"text-3xl mb-2\">\ud83d\udcb8<\/span><span class=\"font-semibold text-gray-700 text-sm\">Infaq<\/span><\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/fidyah\/\" class=\"flex flex-col items-center p-4 rounded-2xl bg-blue-50 border border-blue-100 hover:border-dt-blue hover:bg-blue-100 transition-all\"><span class=\"text-3xl mb-2\">\ud83c\udf72<\/span><span class=\"font-bold text-dt-blue text-sm\">Fidyah<\/span><\/a>\n <a href=\"https:\/\/dtpeduli.com\/donate\/palestine-relief\/\" class=\"flex flex-col items-center p-4 rounded-2xl bg-red-50 border border-red-100 hover:border-red-300 hover:bg-red-100 transition-all\"><span class=\"text-3xl mb-2\">\ud83c\uddf5\ud83c\uddf8<\/span><span class=\"font-semibold text-gray-700 text-sm\">Palestine<\/span><\/a>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- PAYMENT MODAL -->\n <div id=\"paymentModal\" class=\"fixed inset-0 bg-black bg-opacity-70 z-[100] flex justify-center items-center p-4 opacity-0 pointer-events-none transition-all duration-300\">\n <div id=\"paymentModalContent\" class=\"bg-white rounded-xl shadow-2xl w-full max-w-lg relative transform scale-95 transition-all duration-300 flex flex-col max-h-[90vh]\">\n <button id=\"closeModalButton\" class=\"absolute -top-3 -right-3 bg-white rounded-full h-8 w-8 flex items-center justify-center text-gray-600 hover:text-red-500 shadow-lg z-10\"><i class=\"fas fa-times\"><\/i><\/button>\n <div class=\"p-6 border-b border-gray-200 text-center bg-gray-50 rounded-t-xl flex-shrink-0\">\n <h3 class=\"text-xl font-bold text-dt-blue\">Pay Your Fidyah<\/h3>\n <p id=\"modal-subtitle-display\" class=\"text-gray-500 text-sm mt-1\">Complete your payment below.<\/p>\n <\/div>\n <div class=\"p-6 overflow-y-auto\">\n <div class=\"bg-gray-50 p-6 rounded-lg border-2 border-dashed border-gray-300 text-center\">\n <p class=\"text-sm font-semibold text-gray-700 mb-2\">Secure Payment Form<\/p>\n <code class=\"text-lg font-mono text-dt-blue bg-gray-200 px-2 py-1 rounded inline-block\"> <div class=\"wpf_form_wrapper wpf_form_wrapper_353\">\n <form data-wpf_form_id='353' wpf_form_instance='wpf_form_instance_353_1' class='wpf_form wpf_form_instance_353_1 wpf_strip_default_style wpf_form_id_353 wpf_label_top wpf_asterisk_right wpf_submit_button_pos_left wpf_default_form_styles' method='POST' action='https:\/\/dtpeduli.com\/donate' id='wpf_form_id_353' >\n <span style=\"display: none !important;\"><input type=\"checkbox\" name=\"item__353__wppay_checkme_\" value=\"1\"\n style=\"display: none !important;\" tabindex=\"-1\"><\/span>\n <input type=\"hidden\" name=\"__wpf_form_id\" value=\"353\" \/>\n <input type=\"hidden\" name=\"__wpf_current_url\" value=\"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/pages\/198\">\n <input type=\"hidden\" name=\"__wpf_current_page_id\" value=\"198\">\n <div data-element_type=\"customer_name\"\n class=\"wpf_form_group wpf_item_text\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_customer_name\" >Your Name <span class=\"wpf_required_sign wpf_required_sign_left\">*<\/span><\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"yes\" data-type=\"input\" name=\"customer_name\" condition_id=\"customer_name\" placeholder=\"Name\" value=\"\" type=\"text\" class=\"wpf_form_control\" id=\"wpf_input_353_customer_name\" required=\"1\" \/>\n <\/div>\n <\/div>\n <div class=\"wpf-container\">\n <div class=\"wpf-row\" style=\"display: flex; gap: 24px;\">\n <div class=\"wpf-col\" style=\"width: 50%\">\n <div data-element_type=\"customer_email\"\n class=\"wpf_form_group wpf_item_email\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_customer_email\" >Email Address <span class=\"wpf_required_sign wpf_required_sign_left\">*<\/span><\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"yes\" data-type=\"input\" name=\"customer_email\" condition_id=\"customer_email\" placeholder=\"Email Address\" value=\"\" type=\"email\" class=\"wpf_form_control wpf_customer_email\" id=\"wpf_input_353_customer_email\" required=\"1\" \/>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"wpf-col\" style=\"width: 50%\">\n <p id=\"error_phone_code_wpf_input_353_phone_input\" hidden\n name=\"Phone Number\" data-element_type=\"wpf_phone_input_error\">\n <\/p>\n\n <div field_name=\"phone\" style=\"display: block\"\n data-element_type=\"phone\"\n class=\"wpf_form_group wpf_item_tel\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_phone\" >Phone Number<\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input style=\"padding-left: 65px;\" value=\"\" class=\"wpf_form_control\" type=\"tel\" id=\"phone_code_wpf_input_353_phone_input\" condition_id=\"phone\" \/>\n <input name=\"phone\" value=\"\" type=\"hidden\" id=\"phone_code_wpf_input_353_phone_input_hidden\" \/>\n <\/div>\n <\/div>\n \n <\/div>\n <\/div>\n <\/div>\n <div class=\"wpf_address_wrapper\"><label condition_id=address_input class=\"wpf_address_heading\">Address<\/label><div class=\"wpf-t-container\"><div class=\"wpf-t-cell\"> <div data-element_type=\"address_input\"\n class=\"wpf_form_group wpf_item_text\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_address_input_address_line_1_\" >Address Line 1 <span class=\"wpf_required_sign wpf_required_sign_left\">*<\/span><\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"yes\" data-type=\"input\" name=\"address_input[address_line_1]\" condition_id=\"address_line_1\" placeholder=\"Address Line 1\" value=\"\" type=\"text\" class=\"wpf_form_control\" id=\"wpf_input_353_address_input_address_line_1_\" required=\"1\" \/>\n <\/div>\n <\/div>\n <\/div><div class=\"wpf-t-cell\"> <div data-element_type=\"address_input\"\n class=\"wpf_form_group wpf_item_text\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_address_input_address_line_2_\" >Address Line 2<\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"no\" data-type=\"input\" name=\"address_input[address_line_2]\" condition_id=\"address_line_2\" placeholder=\"Address Line 2\" value=\"\" type=\"text\" class=\"wpf_form_control\" id=\"wpf_input_353_address_input_address_line_2_\" \/>\n <\/div>\n <\/div>\n <\/div><\/div><div class=\"wpf-t-container\"><div class=\"wpf-t-cell\"> <div data-element_type=\"address_input\"\n class=\"wpf_form_group wpf_item_text\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_address_input_city_\" >City<\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"no\" data-type=\"input\" name=\"address_input[city]\" condition_id=\"city\" placeholder=\"City\" value=\"\" type=\"text\" class=\"wpf_form_control\" id=\"wpf_input_353_address_input_city_\" \/>\n <\/div>\n <\/div>\n <\/div><div class=\"wpf-t-cell\"> <div data-element_type=\"address_input\"\n class=\"wpf_form_group wpf_item_text\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_address_input_state_\" >State <span class=\"wpf_required_sign wpf_required_sign_left\">*<\/span><\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"yes\" data-type=\"input\" name=\"address_input[state]\" condition_id=\"state\" placeholder=\"State\" value=\"\" type=\"text\" class=\"wpf_form_control\" id=\"wpf_input_353_address_input_state_\" required=\"1\" \/>\n <\/div>\n <\/div>\n <\/div><\/div><div class=\"wpf-t-container\"><div class=\"wpf-t-cell\"> <div data-element_type=\"address_input\"\n class=\"wpf_form_group wpf_item_text\" style=\"display: block\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_address_input_zip_code_\" >ZIP Code<\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <input data-required=\"no\" data-type=\"input\" name=\"address_input[zip_code]\" condition_id=\"zip_code\" placeholder=\"ZIP Code\" value=\"\" type=\"text\" class=\"wpf_form_control\" id=\"wpf_input_353_address_input_zip_code_\" \/>\n <\/div>\n <\/div>\n <\/div><div class=\"wpf-t-cell\"> <div style=\"display : block\" id=\"wpf_address_input\" data-element_type=\"address_input\" class=\"wpf_form_group wpf_item_select\" >\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_address_input_country_\" >Country <span class=\"wpf_required_sign wpf_required_sign_left\">*<\/span><\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <select data-required=\"yes\" name=\"address_input[country]\" class=\"wpf_form_control\" id=\"wpf_input_353_address_input_country_\" condition_id=\"country\" required=\"1\" >\n <option data-type=\"placeholder\" value= >Select Country<\/option>\n <option value=\"AF\" >Afghanistan<\/option>\n <option value=\"AX\" >\u00c5land Islands<\/option>\n <option value=\"AL\" >Albania<\/option>\n <option value=\"DZ\" >Algeria<\/option>\n <option value=\"AS\" >American Samoa<\/option>\n <option value=\"AD\" >Andorra<\/option>\n <option value=\"AO\" >Angola<\/option>\n <option value=\"AI\" >Anguilla<\/option>\n <option value=\"AQ\" >Antarctica<\/option>\n <option value=\"AG\" >Antigua and Barbuda<\/option>\n <option value=\"AR\" >Argentina<\/option>\n <option value=\"AM\" >Armenia<\/option>\n <option value=\"AW\" >Aruba<\/option>\n <option value=\"AU\" >Australia<\/option>\n <option value=\"AT\" >Austria<\/option>\n <option value=\"AZ\" >Azerbaijan<\/option>\n <option value=\"BS\" >Bahamas<\/option>\n <option value=\"BH\" >Bahrain<\/option>\n <option value=\"BD\" >Bangladesh<\/option>\n <option value=\"BB\" >Barbados<\/option>\n <option value=\"BY\" >Belarus<\/option>\n <option value=\"BE\" >Belgium<\/option>\n <option value=\"PW\" >Belau<\/option>\n <option value=\"BZ\" >Belize<\/option>\n <option value=\"BJ\" >Benin<\/option>\n <option value=\"BM\" >Bermuda<\/option>\n <option value=\"BT\" >Bhutan<\/option>\n <option value=\"BO\" >Bolivia<\/option>\n <option value=\"BQ\" >Bonaire, Saint Eustatius and Saba<\/option>\n <option value=\"BA\" >Bosnia and Herzegovina<\/option>\n <option value=\"BW\" >Botswana<\/option>\n <option value=\"BV\" >Bouvet Island<\/option>\n <option value=\"BR\" >Brazil<\/option>\n <option value=\"IO\" >British Indian Ocean Territory<\/option>\n <option value=\"VG\" >British Virgin Islands<\/option>\n <option value=\"BN\" >Brunei<\/option>\n <option value=\"BG\" >Bulgaria<\/option>\n <option value=\"BF\" >Burkina Faso<\/option>\n <option value=\"BI\" >Burundi<\/option>\n <option value=\"KH\" >Cambodia<\/option>\n <option value=\"CM\" >Cameroon<\/option>\n <option value=\"CA\" >Canada<\/option>\n <option value=\"CV\" >Cape Verde<\/option>\n <option value=\"KY\" >Cayman Islands<\/option>\n <option value=\"CF\" >Central African Republic<\/option>\n <option value=\"TD\" >Chad<\/option>\n <option value=\"CL\" >Chile<\/option>\n <option value=\"CN\" >China<\/option>\n <option value=\"CX\" >Christmas Island<\/option>\n <option value=\"CC\" >Cocos (Keeling) Islands<\/option>\n <option value=\"CO\" >Colombia<\/option>\n <option value=\"KM\" >Comoros<\/option>\n <option value=\"CG\" >Congo (Brazzaville)<\/option>\n <option value=\"CD\" >Congo (Kinshasa)<\/option>\n <option value=\"CK\" >Cook Islands<\/option>\n <option value=\"CR\" >Costa Rica<\/option>\n <option value=\"HR\" >Croatia<\/option>\n <option value=\"CU\" >Cuba<\/option>\n <option value=\"CW\" >Curaçao<\/option>\n <option value=\"CY\" >Cyprus<\/option>\n <option value=\"CZ\" >Czech Republic<\/option>\n <option value=\"DK\" >Denmark<\/option>\n <option value=\"DJ\" >Djibouti<\/option>\n <option value=\"DM\" >Dominica<\/option>\n <option value=\"DO\" >Dominican Republic<\/option>\n <option value=\"EC\" >Ecuador<\/option>\n <option value=\"EG\" >Egypt<\/option>\n <option value=\"SV\" >El Salvador<\/option>\n <option value=\"GQ\" >Equatorial Guinea<\/option>\n <option value=\"ER\" >Eritrea<\/option>\n <option value=\"EE\" >Estonia<\/option>\n <option value=\"ET\" >Ethiopia<\/option>\n <option value=\"FK\" >Falkland Islands<\/option>\n <option value=\"FO\" >Faroe Islands<\/option>\n <option value=\"FJ\" >Fiji<\/option>\n <option value=\"FI\" >Finland<\/option>\n <option value=\"FR\" >France<\/option>\n <option value=\"GF\" >French Guiana<\/option>\n <option value=\"PF\" >French Polynesia<\/option>\n <option value=\"TF\" >French Southern Territories<\/option>\n <option value=\"GA\" >Gabon<\/option>\n <option value=\"GM\" >Gambia<\/option>\n <option value=\"GE\" >Georgia<\/option>\n <option value=\"DE\" >Germany<\/option>\n <option value=\"GH\" >Ghana<\/option>\n <option value=\"GI\" >Gibraltar<\/option>\n <option value=\"GR\" >Greece<\/option>\n <option value=\"GL\" >Greenland<\/option>\n <option value=\"GD\" >Grenada<\/option>\n <option value=\"GP\" >Guadeloupe<\/option>\n <option value=\"GU\" >Guam<\/option>\n <option value=\"GT\" >Guatemala<\/option>\n <option value=\"GG\" >Guernsey<\/option>\n <option value=\"GN\" >Guinea<\/option>\n <option value=\"GW\" >Guinea-Bissau<\/option>\n <option value=\"GY\" >Guyana<\/option>\n <option value=\"HT\" >Haiti<\/option>\n <option value=\"HM\" >Heard Island and McDonald Islands<\/option>\n <option value=\"HN\" >Honduras<\/option>\n <option value=\"HK\" >Hong Kong<\/option>\n <option value=\"HU\" >Hungary<\/option>\n <option value=\"IS\" >Iceland<\/option>\n <option value=\"IN\" >India<\/option>\n <option value=\"ID\" >Indonesia<\/option>\n <option value=\"IR\" >Iran<\/option>\n <option value=\"IQ\" >Iraq<\/option>\n <option value=\"IE\" >Ireland<\/option>\n <option value=\"IM\" >Isle of Man<\/option>\n <option value=\"IL\" >Israel<\/option>\n <option value=\"IT\" >Italy<\/option>\n <option value=\"CI\" >Ivory Coast<\/option>\n <option value=\"JM\" >Jamaica<\/option>\n <option value=\"JP\" >Japan<\/option>\n <option value=\"JE\" >Jersey<\/option>\n <option value=\"JO\" >Jordan<\/option>\n <option value=\"KZ\" >Kazakhstan<\/option>\n <option value=\"KE\" >Kenya<\/option>\n <option value=\"KI\" >Kiribati<\/option>\n <option value=\"KW\" >Kuwait<\/option>\n <option value=\"KG\" >Kyrgyzstan<\/option>\n <option value=\"LA\" >Laos<\/option>\n <option value=\"LV\" >Latvia<\/option>\n <option value=\"LB\" >Lebanon<\/option>\n <option value=\"LS\" >Lesotho<\/option>\n <option value=\"LR\" >Liberia<\/option>\n <option value=\"LY\" >Libya<\/option>\n <option value=\"LI\" >Liechtenstein<\/option>\n <option value=\"LT\" >Lithuania<\/option>\n <option value=\"LU\" >Luxembourg<\/option>\n <option value=\"MO\" >Macao S.A.R., China<\/option>\n <option value=\"MK\" >Macedonia<\/option>\n <option value=\"MG\" >Madagascar<\/option>\n <option value=\"MW\" >Malawi<\/option>\n <option value=\"MY\" >Malaysia<\/option>\n <option value=\"MV\" >Maldives<\/option>\n <option value=\"ML\" >Mali<\/option>\n <option value=\"MT\" >Malta<\/option>\n <option value=\"MH\" >Marshall Islands<\/option>\n <option value=\"MQ\" >Martinique<\/option>\n <option value=\"MR\" >Mauritania<\/option>\n <option value=\"MU\" >Mauritius<\/option>\n <option value=\"YT\" >Mayotte<\/option>\n <option value=\"MX\" >Mexico<\/option>\n <option value=\"FM\" >Micronesia<\/option>\n <option value=\"MD\" >Moldova<\/option>\n <option value=\"MC\" >Monaco<\/option>\n <option value=\"MN\" >Mongolia<\/option>\n <option value=\"ME\" >Montenegro<\/option>\n <option value=\"MS\" >Montserrat<\/option>\n <option value=\"MA\" >Morocco<\/option>\n <option value=\"MZ\" >Mozambique<\/option>\n <option value=\"MM\" >Myanmar<\/option>\n <option value=\"NA\" >Namibia<\/option>\n <option value=\"NR\" >Nauru<\/option>\n <option value=\"NP\" >Nepal<\/option>\n <option value=\"NL\" >Netherlands<\/option>\n <option value=\"NC\" >New Caledonia<\/option>\n <option value=\"NZ\" >New Zealand<\/option>\n <option value=\"NI\" >Nicaragua<\/option>\n <option value=\"NE\" >Niger<\/option>\n <option value=\"NG\" >Nigeria<\/option>\n <option value=\"NU\" >Niue<\/option>\n <option value=\"NF\" >Norfolk Island<\/option>\n <option value=\"MP\" >Northern Mariana Islands<\/option>\n <option value=\"KP\" >North Korea<\/option>\n <option value=\"NO\" >Norway<\/option>\n <option value=\"OM\" >Oman<\/option>\n <option value=\"PK\" >Pakistan<\/option>\n <option value=\"PS\" >Palestinian Territory<\/option>\n <option value=\"PA\" >Panama<\/option>\n <option value=\"PG\" >Papua New Guinea<\/option>\n <option value=\"PY\" >Paraguay<\/option>\n <option value=\"PE\" >Peru<\/option>\n <option value=\"PH\" >Philippines<\/option>\n <option value=\"PN\" >Pitcairn<\/option>\n <option value=\"PL\" >Poland<\/option>\n <option value=\"PT\" >Portugal<\/option>\n <option value=\"PR\" >Puerto Rico<\/option>\n <option value=\"QA\" >Qatar<\/option>\n <option value=\"RE\" >Reunion<\/option>\n <option value=\"RO\" >Romania<\/option>\n <option value=\"RU\" >Russia<\/option>\n <option value=\"RW\" >Rwanda<\/option>\n <option value=\"BL\" >Saint Barthélemy<\/option>\n <option value=\"SH\" >Saint Helena<\/option>\n <option value=\"KN\" >Saint Kitts and Nevis<\/option>\n <option value=\"LC\" >Saint Lucia<\/option>\n <option value=\"MF\" >Saint Martin (French part)<\/option>\n <option value=\"SX\" >Saint Martin (Dutch part)<\/option>\n <option value=\"PM\" >Saint Pierre and Miquelon<\/option>\n <option value=\"VC\" >Saint Vincent and the Grenadines<\/option>\n <option value=\"SM\" >San Marino<\/option>\n <option value=\"ST\" >São Tomé and Príncipe<\/option>\n <option value=\"SA\" >Saudi Arabia<\/option>\n <option value=\"SN\" >Senegal<\/option>\n <option value=\"RS\" >Serbia<\/option>\n <option value=\"SC\" >Seychelles<\/option>\n <option value=\"SL\" >Sierra Leone<\/option>\n <option value=\"SG\" >Singapore<\/option>\n <option value=\"SK\" >Slovakia<\/option>\n <option value=\"SI\" >Slovenia<\/option>\n <option value=\"SB\" >Solomon Islands<\/option>\n <option value=\"SO\" >Somalia<\/option>\n <option value=\"ZA\" >South Africa<\/option>\n <option value=\"GS\" >South Georgia\/Sandwich Islands<\/option>\n <option value=\"KR\" >South Korea<\/option>\n <option value=\"SS\" >South Sudan<\/option>\n <option value=\"ES\" >Spain<\/option>\n <option value=\"LK\" >Sri Lanka<\/option>\n <option value=\"SD\" >Sudan<\/option>\n <option value=\"SR\" >Suriname<\/option>\n <option value=\"SJ\" >Svalbard and Jan Mayen<\/option>\n <option value=\"SZ\" >Swaziland<\/option>\n <option value=\"SE\" >Sweden<\/option>\n <option value=\"CH\" >Switzerland<\/option>\n <option value=\"SY\" >Syria<\/option>\n <option value=\"TW\" >Taiwan<\/option>\n <option value=\"TJ\" >Tajikistan<\/option>\n <option value=\"TZ\" >Tanzania<\/option>\n <option value=\"TH\" >Thailand<\/option>\n <option value=\"TL\" >Timor-Leste<\/option>\n <option value=\"TG\" >Togo<\/option>\n <option value=\"TK\" >Tokelau<\/option>\n <option value=\"TO\" >Tonga<\/option>\n <option value=\"TT\" >Trinidad and Tobago<\/option>\n <option value=\"TN\" >Tunisia<\/option>\n <option value=\"TR\" >Turkey<\/option>\n <option value=\"TM\" >Turkmenistan<\/option>\n <option value=\"TC\" >Turks and Caicos Islands<\/option>\n <option value=\"TV\" >Tuvalu<\/option>\n <option value=\"UG\" >Uganda<\/option>\n <option value=\"UA\" >Ukraine<\/option>\n <option value=\"AE\" >United Arab Emirates<\/option>\n <option value=\"GB\" >United Kingdom (UK)<\/option>\n <option value=\"US\" >United States (US)<\/option>\n <option value=\"UM\" >United States (US) Minor Outlying Islands<\/option>\n <option value=\"VI\" >United States (US) Virgin Islands<\/option>\n <option value=\"UY\" >Uruguay<\/option>\n <option value=\"UZ\" >Uzbekistan<\/option>\n <option value=\"VU\" >Vanuatu<\/option>\n <option value=\"VA\" >Vatican<\/option>\n <option value=\"VE\" >Venezuela<\/option>\n <option value=\"VN\" >Vietnam<\/option>\n <option value=\"WF\" >Wallis and Futuna<\/option>\n <option value=\"EH\" >Western Sahara<\/option>\n <option value=\"WS\" >Samoa<\/option>\n <option value=\"YE\" >Yemen<\/option>\n <option value=\"ZM\" >Zambia<\/option>\n <option value=\"ZW\" >Zimbabwe<\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div><\/div><\/div><input data-wpf_payment_method=\"paypal\" type=\"hidden\" name=\"__paypal_payment_gateway\" value=\"paypal\" \/> <div class=\"wpf-container\">\n <div class=\"wpf-row\" style=\"display: flex; gap: 24px;\">\n <div class=\"wpf-col\" style=\"width: 50%\">\n <div style=\"display : block\" data-element_type=\"currency_switcher\" data-required_element=\"select\" data-required=\"no\" data-target_element=\"currency_switcher\" required_id=\"currency_switcher\" class=\"wpf_form_group wpf_item_currency_switcher\" >\n <div class=\"wpf_input_label\">\n <label for=\"wpf_currency_switcher\" >Currency Switcher Options<\/label>\n <\/div>\n <div class=\"wpf_multi_form_controls wpf_input_content wpf_multi_form_controls_select\">\n <select data-required=\"no\" data-type=\"select\" name=\"currency_switcher\" class=\"wpf_form_control wpf_payment_item\" id=\"wpf_input_353_currency_switcher\" >\n <option data-type=\"placeholder\" value=\"\">--Select--<\/option>\n <option value=\"USD\" data-currency=\"USD\" customname=\"United States Dollar\" >United States Dollar (USD)\n <\/option>\n <option value=\"AUD\" data-currency=\"AUD\" customname=\"Australian Dollar\" >Australian Dollar (AUD)\n <\/option>\n <option value=\"GBP\" data-currency=\"GBP\" customname=\"British Pound\" >British Pound (GBP)\n <\/option>\n <option value=\"EGP\" data-currency=\"EGP\" customname=\"Egyptian Pound\" >Egyptian Pound (EGP)\n <\/option>\n <option value=\"EUR\" data-currency=\"EUR\" customname=\"Euro\" >Euro (EUR)\n <\/option>\n <option value=\"JPY\" data-currency=\"JPY\" customname=\"Japanese Yen\" >Japanese Yen (JPY)\n <\/option>\n <option value=\"MYR\" data-currency=\"MYR\" customname=\"Malaysian Ringgit\" >Malaysian Ringgit (MYR)\n <\/option>\n <option value=\"NZD\" data-currency=\"NZD\" customname=\"New Zealand Dollar\" >New Zealand Dollar (NZD)\n <\/option>\n <option value=\"QAR\" data-currency=\"QAR\" customname=\"Qatari Riyal\" >Qatari Riyal (QAR)\n <\/option>\n <option value=\"SAR\" data-currency=\"SAR\" customname=\"Saudi Riyal\" >Saudi Riyal (SAR)\n <\/option>\n <option value=\"SGD\" data-currency=\"SGD\" customname=\"Singapore Dollar\" >Singapore Dollar (SGD)\n <\/option>\n <option value=\"TRY\" data-currency=\"TRY\" customname=\"Turkish Lira\" >Turkish Lira (TRY)\n <\/option>\n <option value=\"AED\" data-currency=\"AED\" customname=\"United Arab Emirates Dirham\" >United Arab Emirates Dirham (AED)\n <\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"wpf-col\" style=\"width: 50%\">\n <div style= \"display : block\" data-element_type=\"custom_payment_input\"\n class=\"wpf_form_group wpf_item_custom_payment_input\">\n <div class=\"wpf_input_label\">\n <label for=\"wpf_input_353_custom_payment_input\" >Custom Payment Amount<\/label>\n <\/div>\n <div class=\"wpf_input_content\">\n <div class=\"wpf_form_item_group\">\n <div class=\"wpf_input-group-prepend\">\n <div class=\"wpf_input-group-text wpf_input-group-text-prepend\">$<\/div>\n <\/div>\n <input data-required=\"no\" data-type=\"input\" name=\"custom_payment_input\" placeholder=\"\" value=\"\" type=\"number\" step=\"any\" data-is_custom_price=\"yes\" min=\"\" data-price=\"0\" id=\"wpf_input_353_custom_payment_input\" customname=\"Custom Payment Amount\" class=\"wpf_form_control wpf_custom_amount wpf_money_amount wpf_payment_item input-prepend\" \/>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n \n \n \n <div class=\"wpf_form_group wpf_form_submissions\" style=\"margin-top: 20px;\">\n <button id='stripe_form_submit_353' disabled='1' class='wpf_submit_button wpf_default_btn' >\n <span class=\"wpf_txt_normal\">Pay Your Fidyah<\/span>\n <span style=\"display: none;\" class=\"wpf_txt_loading\">\n Please Wait\u2026 <\/span>\n <\/button>\n <div class=\"wpf_loading_svg\">\n <svg version=\"1.1\" id=\"loader-1\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" width=\"30px\" height=\"30px\" viewBox=\"0 0 40 40\" enable-background=\"new 0 0 40 40\" xml:space=\"preserve\">\n <path opacity=\"0.2\" fill=\"#000\" d=\"M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634 c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z\" \/>\n <path fill=\"#000\" d=\"M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z\">\n <animateTransform attributeType=\"xml\" attributeName=\"transform\" type=\"rotate\" from=\"0 20 20\" to=\"360 20 20\" dur=\"0.5s\" repeatCount=\"indefinite\" \/>\n <\/path>\n <\/svg>\n <\/div>\n <\/div>\n <\/form>\n <div style=\"display: none\" class=\"wpf_form_notices\"><\/div>\n <\/div>\n\n <\/code>\n <div class=\"animate-pulse flex flex-col items-center mt-4\">\n <div class=\"h-10 w-full bg-gray-200 rounded mb-4\"><\/div>\n <div class=\"h-10 w-full bg-gray-200 rounded mb-4\"><\/div>\n <div class=\"h-12 w-full bg-dt-yellow rounded mt-2 opacity-50\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- WISE PAYMENT MODAL -->\n <div id=\"wisePaymentModal\" class=\"fixed inset-0 bg-black bg-opacity-70 z-[100] flex justify-center items-center p-4 opacity-0 pointer-events-none transition-all duration-300\">\n <div id=\"wiseModalContent\" class=\"bg-white w-full max-w-2xl rounded-2xl shadow-2xl relative flex flex-col h-[80vh] transform scale-95 transition-all\">\n <div class=\"flex-shrink-0 p-4 border-b flex justify-between items-center bg-gray-50 rounded-t-2xl\">\n <div><h2 class=\"text-lg font-bold text-gray-900\">Payment via Wise<\/h2><p id=\"wise-modal-subtitle\" class=\"text-xs text-gray-500\">International Transfer<\/p><\/div>\n <button id=\"closeWiseModal\" class=\"text-gray-400 hover:text-gray-700 text-2xl\">×<\/button>\n <\/div>\n <div class=\"flex-grow relative bg-gray-100\">\n <div class=\"absolute inset-0 flex flex-col items-center justify-center p-8 text-center text-gray-500\">\n <i class=\"fas fa-globe-americas text-4xl mb-4 text-gray-300\"><\/i>\n <p>Wise Payment Gateway loaded.<\/p>\n <iframe id=\"wiseIframe\" class=\"absolute inset-0 w-full h-full opacity-0 pointer-events-none\" src=\"\"><\/iframe>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script src=\"https:\/\/unpkg.com\/aos@2.3.1\/dist\/aos.js\"><\/script>\n <script>\n document.addEventListener('DOMContentLoaded', function () {\n AOS.init({ once: true, duration: 800 });\n\n \/\/ --- Header Logic ---\n const header = document.getElementById('mainHeader');\n window.addEventListener('scroll', () => {\n if (window.scrollY > 50) header.classList.add('header-scrolled');\n else header.classList.remove('header-scrolled');\n });\n\n \/\/ --- Mobile Menu ---\n const mobileMenuBtn = document.getElementById('mobileMenuButton');\n const mobileMenu = document.getElementById('mobileMenu');\n const menuOpenIcon = document.getElementById('menu-open-icon');\n const menuCloseIcon = document.getElementById('menu-close-icon');\n\n function toggleMobileMenu() {\n const isOpen = mobileMenu.classList.contains('is-open');\n mobileMenu.classList.toggle('is-open');\n if (isOpen) {\n document.body.style.overflow = '';\n menuOpenIcon.classList.remove('hidden');\n menuCloseIcon.classList.add('hidden');\n } else {\n document.body.style.overflow = 'hidden';\n menuOpenIcon.classList.add('hidden');\n menuCloseIcon.classList.remove('hidden');\n }\n }\n if(mobileMenuBtn) mobileMenuBtn.addEventListener('click', toggleMobileMenu);\n\n \/\/ Program links hover logic (Desktop Mega Menu)\n const programLinks = document.querySelectorAll('.program-link');\n const panels = document.querySelectorAll('.program-content-panel');\n programLinks.forEach(link => {\n link.addEventListener('mouseenter', () => {\n const id = link.dataset.program;\n programLinks.forEach(l => l.classList.remove('active', 'bg-white', 'shadow-sm'));\n link.classList.add('active', 'bg-white', 'shadow-sm');\n panels.forEach(p => p.classList.remove('active'));\n const target = document.getElementById(`program-content-${id}`);\n if(target) target.classList.add('active');\n });\n });\n\n \/\/ --- Modals ---\n const openModal = (modalId, contentId) => {\n const modal = document.getElementById(modalId);\n const content = document.getElementById(contentId);\n document.body.style.overflow = 'hidden';\n modal.classList.remove('pointer-events-none', 'opacity-0');\n if(content) content.classList.remove('scale-95');\n };\n \n const closeModal = (modalId, contentId) => {\n const modal = document.getElementById(modalId);\n const content = document.getElementById(contentId);\n document.body.style.overflow = '';\n modal.classList.add('opacity-0');\n if(content) content.classList.add('scale-95');\n setTimeout(() => modal.classList.add('pointer-events-none'), 300);\n };\n \n \/\/ Connected to actual shortcode modal\n const openPaymentModal = () => {\n openModal('paymentModal', 'paymentModalContent');\n };\n\n document.getElementById('closeModalButton').addEventListener('click', () => closeModal('paymentModal', 'paymentModalContent'));\n \n \/\/ --- Mobile Bottom Nav Logic ---\n const quickDonateBtn = document.getElementById('quickDonateButton');\n const menuTriggerBtn = document.getElementById('mobileMenuTriggerBottom');\n \n const toggleBottom = (idToShow) => {\n const toShow = document.getElementById(idToShow);\n if(!toShow.classList.contains('hidden')) {\n toShow.classList.remove('is-open');\n setTimeout(() => toShow.classList.add('hidden'), 300);\n } else {\n toShow.classList.remove('hidden');\n setTimeout(() => toShow.classList.add('is-open'), 10);\n }\n };\n \n if(quickDonateBtn) quickDonateBtn.addEventListener('click', () => toggleBottom('quickDonateSubmenu'));\n if(menuTriggerBtn) menuTriggerBtn.addEventListener('click', () => document.getElementById('mobileMenuButton').click());\n document.getElementById('closeQuickDonate').addEventListener('click', () => toggleBottom('quickDonateSubmenu'));\n\n\n \/\/ --- FIDYAH CALCULATOR LOGIC ---\n const currencySelect = document.getElementById('currency');\n const daysInput = document.getElementById('days');\n const totalAmountDisplay = document.getElementById('total-amount');\n const totalLoader = document.getElementById('total-loader');\n const donateFidyahButton = document.getElementById('donateFidyahButton');\n const modalSubtitleDisplay = document.getElementById('modal-subtitle-display');\n const wiseSubtitleDisplay = document.getElementById('wise-modal-subtitle');\n const wiseIframe = document.getElementById('wiseIframe');\n \n const BASE_FIDYAH_USD = 2.70;\n let exchangeRates = {};\n\n async function initializeCalculator() {\n try {\n if(totalLoader) totalLoader.style.display = 'inline-block';\n if(totalAmountDisplay) totalAmountDisplay.style.display = 'none';\n const response = await fetch('https:\/\/api.exchangerate-api.com\/v4\/latest\/USD').catch(e => null);\n const data = response && response.ok ? await response.json() : null;\n if(data) exchangeRates = data.rates;\n } catch (e) {\n console.log(\"Using fallback rates\");\n }\n \n \/\/ Fallback rates if API fails\n if(Object.keys(exchangeRates).length === 0) {\n exchangeRates = { \"USD\": 1, \"EUR\": 0.92, \"GBP\": 0.79, \"AUD\": 1.50, \"IDR\": 16250.00, \"SGD\": 1.35, \"MYR\": 4.70 };\n }\n populateCurrencies();\n updateCalculator();\n addCalculatorListeners();\n \n if (totalLoader) totalLoader.style.display = 'none';\n if (totalAmountDisplay) totalAmountDisplay.style.display = 'block';\n }\n\n function populateCurrencies() {\n const favoriteCurrencies = ['IDR', 'AUD', 'USD', 'SGD', 'MYR', 'EUR', 'GBP'];\n favoriteCurrencies.forEach(currency => {\n const option = document.createElement('option');\n option.value = currency;\n option.textContent = currency;\n currencySelect.appendChild(option);\n });\n \/\/ Default to IDR\n currencySelect.value = 'IDR';\n }\n\n function updateCalculator() {\n if (!daysInput || !currencySelect || !totalAmountDisplay) return;\n \n const days = parseInt(daysInput.value) || 0;\n const selectedCurrency = currencySelect.value;\n const rate = exchangeRates[selectedCurrency] || 1;\n \n let totalValue = 0;\n \n \/\/ --- CUSTOM FIDYAH RATES ---\n if(selectedCurrency === 'AUD') {\n totalValue = days * 20; \/\/ AUD 20 per day\n } else if(selectedCurrency === 'IDR') {\n totalValue = days * 35000; \/\/ IDR 35,000 per day\n } else {\n totalValue = days * BASE_FIDYAH_USD * rate; \/\/ Default converted from USD\n }\n\n if (days <= 0) {\n totalAmountDisplay.textContent = new Intl.NumberFormat('en-US', { style: 'currency', currency: selectedCurrency }).format(0);\n donateFidyahButton.disabled = true;\n return;\n }\n\n const formattedTotal = new Intl.NumberFormat('en-US', { \n style: 'currency', \n currency: selectedCurrency,\n minimumFractionDigits: 0,\n maximumFractionDigits: 2\n }).format(totalValue);\n\n totalAmountDisplay.textContent = formattedTotal;\n donateFidyahButton.disabled = false;\n \n \/\/ Update Modals\n if(modalSubtitleDisplay) {\n modalSubtitleDisplay.textContent = `Total to Pay: ${formattedTotal}`;\n }\n if(wiseSubtitleDisplay) {\n wiseSubtitleDisplay.textContent = `Total to Pay: ${formattedTotal}`;\n }\n if(wiseIframe) {\n wiseIframe.src = `https:\/\/dtpeduli.com\/donate-via-wise\/?amount=${totalValue.toFixed(2)}&currency=${selectedCurrency}`;\n }\n }\n\n function addCalculatorListeners() {\n currencySelect.addEventListener('change', updateCalculator);\n daysInput.addEventListener('input', updateCalculator);\n \n \/\/ Bind Donate Button to Modal\n if(donateFidyahButton) {\n donateFidyahButton.addEventListener('click', openPaymentModal);\n }\n \n const openWiseModalBtn = document.getElementById('openWiseModalBtn');\n const wiseModal = document.getElementById('wisePaymentModal');\n const wiseModalContent = document.getElementById('wiseModalContent');\n const closeWiseBtn = document.getElementById('closeWiseModal');\n\n const openWise = () => {\n document.body.style.overflow = 'hidden';\n wiseModal.classList.remove('hidden');\n setTimeout(() => {\n wiseModal.classList.remove('opacity-0', 'pointer-events-none');\n wiseModalContent.classList.remove('opacity-0', '-translate-y-10');\n }, 10);\n };\n \n const closeWise = () => {\n document.body.style.overflow = '';\n wiseModalContent.classList.add('opacity-0', '-translate-y-10');\n wiseModal.classList.add('opacity-0');\n setTimeout(() => {\n wiseModal.classList.add('hidden', 'pointer-events-none');\n }, 300);\n };\n\n if(openWiseModalBtn) openWiseModalBtn.addEventListener('click', openWise);\n if(closeWiseBtn) closeWiseBtn.addEventListener('click', closeWise);\n }\n\n initializeCalculator();\n \n \/\/ Slider Logic (Dynamic from WP)\n async function initHeroSlider() {\n const sliderContainer = document.getElementById('hero-slider');\n if (!sliderContainer) return;\n\n try {\n \/\/ Fetch recent posts with images from WordPress\n const response = await fetch('https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/posts?_embed=wp:featuredmedia&per_page=5');\n if (!response.ok) throw new Error('Failed to fetch from WP');\n const posts = await response.json();\n \n const slidesData = posts.filter(p => p._embedded && p._embedded['wp:featuredmedia'] && p._embedded['wp:featuredmedia'][0].source_url)\n .map(p => p._embedded['wp:featuredmedia'][0].source_url);\n\n if (slidesData.length === 0) throw new Error('No images found in posts');\n \n renderSlider(slidesData);\n\n } catch (error) {\n console.warn(\"Slider API failed, using fallback image:\", error);\n \/\/ Fallback to static placeholder if API fails\n const fallbackImages = ['https:\/\/images.unsplash.com\/photo-1532629345422-7515f3d16bb6?q=80&w=2070&auto=format&fit=crop'];\n renderSlider(fallbackImages);\n }\n\n function renderSlider(images) {\n sliderContainer.innerHTML = images.map((url, index) => `\n <div class=\"hero-slide absolute inset-0 w-full h-full bg-cover bg-center transition-opacity duration-1000 ease-in-out ${index === 0 ? 'opacity-100 active' : 'opacity-0'}\" \n style=\"background-image: url('${url}');\">\n <\/div>\n `).join('');\n\n const slides = sliderContainer.querySelectorAll('.hero-slide');\n if (slides.length > 1) {\n let currentSlide = 0;\n setInterval(() => {\n slides[currentSlide].classList.remove('opacity-100', 'active');\n slides[currentSlide].classList.add('opacity-0');\n currentSlide = (currentSlide + 1) % slides.length;\n slides[currentSlide].classList.remove('opacity-0');\n slides[currentSlide].classList.add('opacity-100', 'active');\n }, 5000); \n }\n }\n }\n \n initHeroSlider();\n\n });\n <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Fidyah Calculator | DT Peduli Home About Us Profile Our Management History Official Address Programs Core Pillars Da’wah Economy Education […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-198","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/pages\/198","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/comments?post=198"}],"version-history":[{"count":65,"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/pages\/198\/revisions"}],"predecessor-version":[{"id":568,"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/pages\/198\/revisions\/568"}],"wp:attachment":[{"href":"https:\/\/dtpeduli.com\/donate\/wp-json\/wp\/v2\/media?parent=198"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}