Anvasta HRA Exemption Calculator FY 2026-27<\/title>\n \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;600;700&display=swap\" rel=\"stylesheet\">\n \n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n <style>\n :root {\n --anvasta-blue: #0055A4;\n --anvasta-green: #00A600;\n --anvasta-bg: #F8FAFC;\n --text-main: #1E293B;\n --text-sub: #64748B;\n --white: #FFFFFF;\n }\n\n * {\n box-sizing: border-box;\n font-family: 'Inter', sans-serif;\n }\n\n body {\n background-color: var(--anvasta-bg);\n color: var(--text-main);\n margin: 0;\n padding: 20px;\n display: flex;\n justify-content: center;\n }\n\n .calc-wrapper {\n width: 100%;\n max-width: 900px;\n background: var(--white);\n border-radius: 16px;\n box-shadow: 0 10px 25px rgba(0, 85, 164, 0.08);\n overflow: hidden;\n border: 1px solid #E2E8F0;\n }\n\n .header {\n background: linear-gradient(135deg, var(--anvasta-blue) 0%, #003d7a 100%);\n padding: 30px;\n color: white;\n text-align: center;\n }\n\n .header h1 {\n margin: 0;\n font-weight: 700;\n color: #FFFFFF !important; \/* Forced white color to override parent styles *\/\n opacity: 1 !important; \/* Ensure full visibility *\/\n font-size: 24px;\n letter-spacing: -0.5px;\n }\n\n .header p {\n margin: 8px 0 0;\n color: #FFFFFF !important;\n opacity: 0.9;\n font-size: 14px;\n }\n\n .content-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 30px;\n padding: 40px;\n }\n\n @media (max-width: 768px) {\n .content-grid {\n grid-template-columns: 1fr;\n }\n }\n\n \/* Inputs Section *\/\n .input-group {\n margin-bottom: 20px;\n }\n\n .input-label {\n display: block;\n font-weight: 600;\n font-size: 14px;\n margin-bottom: 8px;\n color: var(--anvasta-blue);\n }\n\n .input-field {\n width: 100%;\n padding: 12px 16px;\n border: 2px solid #F1F5F9;\n border-radius: 8px;\n font-size: 16px;\n transition: all 0.2s;\n outline: none;\n }\n\n .input-field:focus {\n border-color: var(--anvasta-blue);\n background-color: #f0f7ff;\n }\n\n .select-field {\n appearance: none;\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230055A4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'\/%3E%3C\/svg%3E\");\n background-repeat: no-repeat;\n background-position: right 12px center;\n background-size: 16px;\n }\n\n \/* Results Section *\/\n .results-panel {\n background: #F1F5F9;\n padding: 30px;\n border-radius: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n .result-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 15px 0;\n border-bottom: 1px solid #E2E8F0;\n }\n\n .result-item:last-child {\n border-bottom: none;\n }\n\n .result-label {\n font-size: 14px;\n color: var(--text-sub);\n font-weight: 400;\n }\n\n .result-value {\n font-weight: 700;\n font-size: 18px;\n color: var(--anvasta-blue);\n }\n\n .highlight-box {\n background: var(--white);\n border-left: 5px solid var(--anvasta-green);\n padding: 20px;\n border-radius: 8px;\n margin-top: 20px;\n }\n\n .highlight-label {\n font-size: 12px;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--anvasta-green);\n font-weight: 700;\n margin-bottom: 5px;\n }\n\n .highlight-value {\n font-size: 32px;\n font-weight: 700;\n color: var(--text-main);\n }\n\n .disclaimer {\n padding: 20px 40px;\n background: #f8fafc;\n font-size: 12px;\n color: var(--text-sub);\n border-top: 1px solid #E2E8F0;\n line-height: 1.6;\n }\n\n .info-icon {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n color: var(--anvasta-blue);\n margin-top: 10px;\n font-size: 13px;\n font-weight: 600;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"calc-wrapper\">\n <div class=\"header\">\n <h1>HRA Exemption Calculator<\/h1>\n <p>As per the New Income Tax Act 2025 | Tax Year 2026-27<\/p>\n <\/div>\n\n <div class=\"content-grid\">\n \n <div class=\"inputs-side\">\n <div class=\"input-group\">\n <label class=\"input-label\">Basic Salary + DA (Annual)<\/label>\n <input type=\"number\" id=\"basicSalary\" class=\"input-field\" placeholder=\"e.g. 1200000\" oninput=\"calculateHRA()\">\n <\/div>\n \n <div class=\"input-group\">\n <label class=\"input-label\">Actual HRA Received (Annual)<\/label>\n <input type=\"number\" id=\"actualHRA\" class=\"input-field\" placeholder=\"e.g. 500000\" oninput=\"calculateHRA()\">\n <\/div>\n\n <div class=\"input-group\">\n <label class=\"input-label\">Total Rent Paid (Annual)<\/label>\n <input type=\"number\" id=\"rentPaid\" class=\"input-field\" placeholder=\"e.g. 400000\" oninput=\"calculateHRA()\">\n <\/div>\n\n <div class=\"input-group\">\n <label class=\"input-label\">City of Residence<\/label>\n <select id=\"cityType\" class=\"input-field select-field\" onchange=\"calculateHRA()\">\n <option value=\"metro\">Tier 1 \/ Metro City (50% Limit)<\/option>\n <option value=\"non-metro\">Tier 2 \/ Non-Metro (40% Limit)<\/option>\n <\/select>\n <div class=\"info-icon\">\n <i data-lucide=\"info\" size=\"14\"><\/i>\n <span>Metro Cities are Mumbai, Delhi, Chennai, Kolkata, Bengaluru, Hyderabad, Pune & Ahmedabad as per 2025 Act<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"results-side\">\n <div class=\"results-panel\">\n <div class=\"highlight-box\">\n <div class=\"highlight-label\">Exempt HRA Amount<\/div>\n <div class=\"highlight-value\" id=\"exemptAmount\">\u20b9 0<\/div>\n <\/div>\n\n <div class=\"result-item\">\n <span class=\"result-label\">Taxable HRA<\/span>\n <span class=\"result-value\" id=\"taxableAmount\" style=\"color: #ef4444;\">\u20b9 0<\/span>\n <\/div>\n\n <div class=\"result-item\">\n <span class=\"result-label\">Rent paid minus 10% of (Basic Salary + DA)<\/span>\n <span class=\"result-value\" id=\"rentLessTen\">\u20b9 0<\/span>\n <\/div>\n\n <div class=\"result-item\">\n <span class=\"result-label\">City-based Limit (40\/50%)<\/span>\n <span class=\"result-value\" id=\"cityLimit\">\u20b9 0<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"disclaimer\">\n <strong>Notes on Income Tax Act 2025 (Tax Year 2026-27):<\/strong><br>\n 1. HRA Exemption is available only under the <strong>Old Tax Regime<\/strong>. Under the default New Regime, HRA is fully taxable.<br>\n 2. <strong>City Status Update:<\/strong> Bengaluru, Hyderabad, Pune, and Ahmedabad are now eligible for the 50% limit (previously 40%).<br>\n 3. Mandatory PAN of landlord is required if annual rent exceeds \u20b91,00,000.\n <\/div>\n<\/div>\n\n<script>\n \/\/ Initialize Icons\n lucide.createIcons();\n\n function formatCurrency(num) {\n return \"\u20b9 \" + new Intl.NumberFormat('en-IN').format(Math.max(0, Math.round(num)));\n }\n\n function calculateHRA() {\n \/\/ Get Inputs\n const basic = parseFloat(document.getElementById('basicSalary').value) || 0;\n const actualHRA = parseFloat(document.getElementById('actualHRA').value) || 0;\n const rent = parseFloat(document.getElementById('rentPaid').value) || 0;\n const isMetro = document.getElementById('cityType').value === 'metro';\n\n \/\/ Calculation Logic\n \/\/ 1. Actual HRA\n const condition1 = actualHRA;\n\n \/\/ 2. 50% or 40% of Basic\n const pct = isMetro ? 0.5 : 0.4;\n const condition2 = basic * pct;\n\n \/\/ 3. Rent paid minus 10% of Basic\n const condition3 = Math.max(0, rent - (basic * 0.1));\n\n \/\/ Least of the three\n const exemptHRA = Math.min(condition1, condition2, condition3);\n const taxableHRA = Math.max(0, actualHRA - exemptHRA);\n\n \/\/ Update UI\n document.getElementById('exemptAmount').innerText = formatCurrency(exemptHRA);\n document.getElementById('taxableAmount').innerText = formatCurrency(taxableHRA);\n document.getElementById('rentLessTen').innerText = formatCurrency(condition3);\n document.getElementById('cityLimit').innerText = formatCurrency(condition2);\n }\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\n\n\n\n<div class=\"wp-block-uagb-tabs-child uagb-tabs__body-container uagb-inner-tab-1\" aria-labelledby=\"uagb-tabs__tab1\">\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n \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;600;700&display=swap\" rel=\"stylesheet\">\n \n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n <style>\n :root {\n --anvasta-blue: #0056b3; \/* Primary Blue from Logo *\/\n --anvasta-green: #00b300; \/* Primary Green from Logo *\/\n --anvasta-light-bg: #f8fafc;\n --anvasta-border: #e2e8f0;\n --text-dark: #1e293b;\n --text-muted: #64748b;\n }\n\n #anvasta-emi-container {\n font-family: 'Inter', sans-serif;\n max-width: 900px;\n margin: 20px auto;\n background: #ffffff;\n border-radius: 16px;\n box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);\n padding: 0; \/* Changed to 0 to allow header to span full width *\/\n color: var(--text-dark);\n line-height: 1.5;\n border: 1px solid var(--anvasta-border);\n overflow: hidden; \/* Ensures header corners stay rounded *\/\n }\n\n .anvasta-header {\n text-align: center;\n background-color: var(--anvasta-blue);\n padding: 35px 30px;\n margin-bottom: 0;\n }\n\n .anvasta-header h2 {\n font-weight: 700;\n color: #ffffff;\n font-size: 28px;\n margin-bottom: 8px;\n margin-top: 0;\n }\n\n .anvasta-header p {\n color: #ffffff;\n font-size: 16px;\n margin: 0;\n opacity: 0.95;\n }\n\n .anvasta-header p strong {\n color: #ffffff;\n font-weight: 700;\n }\n\n .content-padding {\n padding: 30px;\n }\n\n .anvasta-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 40px;\n }\n\n @media (max-width: 768px) {\n .anvasta-grid {\n grid-template-columns: 1fr;\n }\n }\n\n .input-section {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n\n .form-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n .label-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .label-row label {\n font-weight: 600;\n font-size: 14px;\n color: var(--text-dark);\n }\n\n .input-wrapper {\n position: relative;\n display: flex;\n align-items: center;\n }\n\n .input-wrapper input[type=\"number\"] {\n width: 100%;\n padding: 12px 16px;\n border: 2px solid var(--anvasta-border);\n border-radius: 8px;\n font-family: 'Inter', sans-serif;\n font-size: 16px;\n font-weight: 600;\n outline: none;\n transition: border-color 0.2s;\n }\n\n .input-wrapper input[type=\"number\"]:focus {\n border-color: var(--anvasta-blue);\n }\n\n .unit-label {\n position: absolute;\n right: 16px;\n color: var(--text-muted);\n font-weight: 600;\n pointer-events: none;\n }\n\n \/* Slider Styling *\/\n input[type=\"range\"] {\n -webkit-appearance: none;\n width: 100%;\n height: 6px;\n background: #cbd5e1;\n border-radius: 5px;\n margin-top: 10px;\n }\n\n input[type=\"range\"]::-webkit-slider-thumb {\n -webkit-appearance: none;\n height: 20px;\n width: 20px;\n border-radius: 50%;\n background: var(--anvasta-blue);\n cursor: pointer;\n box-shadow: 0 0 10px rgba(0, 86, 179, 0.3);\n border: 3px solid #fff;\n }\n\n \/* Results Display *\/\n .results-section {\n background: var(--anvasta-light-bg);\n padding: 24px;\n border-radius: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n }\n\n .emi-display {\n text-align: center;\n margin-bottom: 24px;\n }\n\n .emi-label {\n font-size: 14px;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--text-muted);\n font-weight: 600;\n }\n\n .emi-value {\n font-size: 36px;\n font-weight: 700;\n color: var(--anvasta-blue);\n margin: 5px 0;\n }\n\n .breakdown-grid {\n width: 100%;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n margin-top: 20px;\n }\n\n .breakdown-item {\n background: #fff;\n padding: 12px;\n border-radius: 8px;\n border: 1px solid var(--anvasta-border);\n text-align: center;\n }\n\n .breakdown-item span {\n display: block;\n font-size: 12px;\n color: var(--text-muted);\n font-weight: 600;\n }\n\n .breakdown-item strong {\n display: block;\n font-size: 16px;\n color: var(--text-dark);\n margin-top: 4px;\n }\n\n .chart-container {\n width: 100%;\n max-width: 200px;\n margin: 0 auto;\n }\n\n .anvasta-footer {\n margin-top: 30px;\n padding: 20px 30px;\n border-top: 1px solid var(--anvasta-border);\n text-align: center;\n font-size: 13px;\n color: var(--text-muted);\n }\n\n .anvasta-footer strong {\n color: var(--anvasta-green);\n }\n <\/style>\n<\/head>\n<body>\n\n<div id=\"anvasta-emi-container\">\n <div class=\"anvasta-header\">\n <h2>EMI Calculator<\/h2>\n <p>Providing the <strong>Right<\/strong> financial planning for you<\/p>\n <\/div>\n\n <div class=\"content-padding\">\n <div class=\"anvasta-grid\">\n \n <div class=\"input-section\">\n \n \n <div class=\"form-group\">\n <div class=\"label-row\">\n <label>Loan Amount<\/label>\n <\/div>\n <div class=\"input-wrapper\">\n <input type=\"number\" id=\"loanAmount\" value=\"5000000\" step=\"50000\">\n <span class=\"unit-label\">\u20b9<\/span>\n <\/div>\n <input type=\"range\" id=\"loanAmountSlider\" min=\"100000\" max=\"10000000\" step=\"50000\" value=\"5000000\">\n <\/div>\n\n \n <div class=\"form-group\">\n <div class=\"label-row\">\n <label>Interest Rate (P.A.)<\/label>\n <\/div>\n <div class=\"input-wrapper\">\n <input type=\"number\" id=\"interestRate\" value=\"7.5\" step=\"0.1\">\n <span class=\"unit-label\">%<\/span>\n <\/div>\n <input type=\"range\" id=\"interestRateSlider\" min=\"1\" max=\"25\" step=\"0.1\" value=\"7.5\">\n <\/div>\n\n \n <div class=\"form-group\">\n <div class=\"label-row\">\n <label>Loan Tenure<\/label>\n <\/div>\n <div class=\"input-wrapper\">\n <input type=\"number\" id=\"loanTenure\" value=\"15\">\n <span class=\"unit-label\">Years<\/span>\n <\/div>\n <input type=\"range\" id=\"loanTenureSlider\" min=\"1\" max=\"30\" step=\"1\" value=\"15\">\n <\/div>\n\n <\/div>\n\n \n <div class=\"results-section\">\n <div class=\"emi-display\">\n <div class=\"emi-label\">Monthly EMI<\/div>\n <div class=\"emi-value\" id=\"monthlyEmi\">\u20b9 0<\/div>\n <\/div>\n\n <div class=\"chart-container\">\n <canvas id=\"emiChart\"><\/canvas>\n <\/div>\n\n <div class=\"breakdown-grid\">\n <div class=\"breakdown-item\">\n <span>Principal Amount<\/span>\n <strong id=\"displayPrincipal\">\u20b9 0<\/strong>\n <\/div>\n <div class=\"breakdown-item\">\n <span>Total Interest<\/span>\n <strong id=\"displayTotalInterest\">\u20b9 0<\/strong>\n <\/div>\n <div class=\"breakdown-item\" style=\"grid-column: span 2; border-color: var(--anvasta-blue); background: #eef6ff;\">\n <span>Total Amount Payable<\/span>\n <strong id=\"displayTotalPayable\">\u20b9 0<\/strong>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"anvasta-footer\">\n \u00a9 Anvasta Consultants Private Limited \u2014 Offering <strong>Right<\/strong> Solutions.\n <\/div>\n<\/div>\n\n<script>\n const loanAmountInput = document.getElementById('loanAmount');\n const loanAmountSlider = document.getElementById('loanAmountSlider');\n const interestRateInput = document.getElementById('interestRate');\n const interestRateSlider = document.getElementById('interestRateSlider');\n const loanTenureInput = document.getElementById('loanTenure');\n const loanTenureSlider = document.getElementById('loanTenureSlider');\n\n const monthlyEmiText = document.getElementById('monthlyEmi');\n const displayPrincipal = document.getElementById('displayPrincipal');\n const displayTotalInterest = document.getElementById('displayTotalInterest');\n const displayTotalPayable = document.getElementById('displayTotalPayable');\n\n let emiChart;\n\n function formatCurrency(num) {\n return '\u20b9 ' + Number(num).toLocaleString('en-IN');\n }\n\n function calculateEMI() {\n const principal = parseFloat(loanAmountInput.value);\n const annualRate = parseFloat(interestRateInput.value);\n const years = parseFloat(loanTenureInput.value);\n\n if (isNaN(principal) || isNaN(annualRate) || isNaN(years) || principal <= 0 || annualRate <= 0 || years <= 0) {\n return;\n }\n\n const monthlyRate = annualRate \/ (12 * 100);\n const months = years * 12;\n\n const emi = (principal * monthlyRate * Math.pow(1 + monthlyRate, months)) \/ (Math.pow(1 + monthlyRate, months) - 1);\n const totalPayable = emi * months;\n const totalInterest = totalPayable - principal;\n\n \/\/ Update Text\n monthlyEmiText.innerText = formatCurrency(Math.round(emi));\n displayPrincipal.innerText = formatCurrency(Math.round(principal));\n displayTotalInterest.innerText = formatCurrency(Math.round(totalInterest));\n displayTotalPayable.innerText = formatCurrency(Math.round(totalPayable));\n\n updateChart(principal, totalInterest);\n }\n\n function updateChart(principal, interest) {\n const data = {\n labels: ['Principal', 'Interest'],\n datasets: [{\n data: [principal, interest],\n backgroundColor: ['#0056b3', '#00b300'], \/\/ Anvasta Blue and Green\n hoverOffset: 4,\n borderWidth: 0\n }]\n };\n\n if (emiChart) {\n emiChart.data = data;\n emiChart.update();\n } else {\n const ctx = document.getElementById('emiChart').getContext('2d');\n emiChart = new Chart(ctx, {\n type: 'doughnut',\n data: data,\n options: {\n cutout: '70%',\n plugins: {\n legend: { display: false },\n tooltip: { enabled: true }\n }\n }\n });\n }\n }\n\n \/\/ Event Listeners for Syncing Slider and Input\n function sync(slider, input) {\n slider.addEventListener('input', () => {\n input.value = slider.value;\n calculateEMI();\n });\n input.addEventListener('input', () => {\n slider.value = input.value;\n calculateEMI();\n });\n }\n\n sync(loanAmountSlider, loanAmountInput);\n sync(interestRateSlider, interestRateInput);\n sync(loanTenureSlider, loanTenureInput);\n\n \/\/ Initial Calculation\n window.onload = calculateEMI;\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\n\n\n\n<div class=\"wp-block-uagb-tabs-child uagb-tabs__body-container uagb-inner-tab-2\" aria-labelledby=\"uagb-tabs__tab2\">\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Anvasta HRA Exemption Calculator FY 2026-27<\/title>\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;600;700&display=swap\" rel=\"stylesheet\">\n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2pdf.js\/0.10.1\/html2pdf.bundle.min.js\"><\/script>\n <style>\n :root {\n --anvasta-blue: #0055A4;\n --anvasta-green: #00A600;\n --anvasta-bg: #F8FAFC;\n --text-main: #1E293B;\n --text-sub: #64748B;\n --white: #FFFFFF;\n }\n\n * { box-sizing: border-box; font-family: 'Inter', sans-serif; }\n body { background-color: var(--anvasta-bg); margin: 0; padding: 10px; display: flex; justify-content: center; }\n\n .calc-wrapper {\n width: 100%;\n max-width: 900px;\n background: var(--white);\n border-radius: 16px;\n box-shadow: 0 10px 25px rgba(0, 85, 164, 0.08);\n overflow: hidden;\n border: 1px solid #E2E8F0;\n }\n\n .header {\n background: linear-gradient(135deg, var(--anvasta-blue) 0%, #003d7a 100%);\n padding: 30px;\n color: white;\n text-align: center;\n }\n\n .header h1 {\n margin: 0;\n font-weight: 700;\n color: #FFFFFF !important;\n font-size: 24px;\n letter-spacing: -0.5px;\n }\n\n .header p { margin: 8px 0 0; color: #FFFFFF !important; opacity: 0.9; font-size: 14px; }\n\n .content-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: 40px; }\n @media (max-width: 768px) { .content-grid { grid-template-columns: 1fr; padding: 20px; } }\n\n .input-group { margin-bottom: 20px; }\n .input-label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 8px; color: var(--anvasta-blue); }\n .input-field {\n width: 100%;\n padding: 12px 16px;\n border: 2px solid #F1F5F9;\n border-radius: 8px;\n font-size: 16px;\n outline: none;\n color: var(--text-main);\n }\n .input-field:focus { border-color: var(--anvasta-blue); background-color: #f0f7ff; }\n\n .results-panel { background: #F1F5F9; padding: 30px; border-radius: 12px; }\n .result-item { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #E2E8F0; }\n .result-label { font-size: 14px; color: var(--text-sub); }\n .result-value { font-weight: 700; color: var(--anvasta-blue); }\n\n .highlight-box { background: var(--white); border-left: 5px solid var(--anvasta-green); padding: 20px; border-radius: 8px; margin-top: 10px; }\n .highlight-label { font-size: 12px; color: var(--anvasta-green); font-weight: 700; text-transform: uppercase; }\n .highlight-value { font-size: 32px; font-weight: 700; color: var(--text-main); }\n\n .btn-container { padding: 0 40px 40px; display: flex; justify-content: flex-end; gap: 15px; }\n .primary-btn, .download-btn {\n border: none; padding: 12px 24px; border-radius: 8px; font-weight: 600; cursor: pointer;\n display: flex; align-items: center; gap: 8px; color: white !important;\n }\n .primary-btn { background-color: var(--anvasta-blue); }\n .download-btn { background-color: var(--anvasta-green); }\n\n .disclaimer { padding: 20px 40px; background: #f8fafc; font-size: 12px; color: var(--text-sub); border-top: 1px solid #E2E8F0; line-height: 1.6; }\n\n \/* PDF HIDDEN TEMPLATE - This is what gets printed *\/\n #pdf-template {\n display: none;\n width: 700px;\n padding: 40px;\n color: #333;\n background: white;\n }\n .pdf-header { border-bottom: 3px solid var(--anvasta-blue); padding-bottom: 20px; margin-bottom: 30px; }\n .pdf-title { color: var(--anvasta-blue); font-size: 28px; font-weight: 700; margin: 0; }\n .pdf-subtitle { color: var(--text-sub); font-size: 14px; margin-top: 5px; }\n .pdf-section { margin-bottom: 30px; }\n .pdf-section-title { font-weight: 700; font-size: 18px; color: var(--anvasta-blue); border-bottom: 1px solid #eee; padding-bottom: 5px; margin-bottom: 15px; }\n .pdf-table { width: 100%; border-collapse: collapse; }\n .pdf-table td { padding: 12px 0; border-bottom: 1px solid #f0f0f0; }\n .pdf-table td:last-child { text-align: right; font-weight: 700; color: var(--text-main); }\n .pdf-exempt-box { background: #f0f9f0; padding: 25px; border-radius: 10px; border: 2px solid var(--anvasta-green); text-align: center; }\n .pdf-footer { margin-top: 50px; font-size: 11px; color: #999; border-top: 1px solid #eee; padding-top: 20px; }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"calc-wrapper\">\n <div class=\"header\">\n <h1>HRA Exemption Calculator<\/h1>\n <p>FY 2026-27 | Income Tax Act 2025<\/p>\n <\/div>\n\n <div class=\"content-grid\">\n <div class=\"inputs\">\n <div class=\"input-group\">\n <label class=\"input-label\">Basic Salary + DA (Annual)<\/label>\n <input type=\"number\" id=\"ui-basic\" class=\"input-field\" placeholder=\"0\" oninput=\"doCalc()\">\n <\/div>\n <div class=\"input-group\">\n <label class=\"input-label\">Actual HRA Received (Annual)<\/label>\n <input type=\"number\" id=\"ui-hra\" class=\"input-field\" placeholder=\"0\" oninput=\"doCalc()\">\n <\/div>\n <div class=\"input-group\">\n <label class=\"input-label\">Total Rent Paid (Annual)<\/label>\n <input type=\"number\" id=\"ui-rent\" class=\"input-field\" placeholder=\"0\" oninput=\"doCalc()\">\n <\/div>\n <div class=\"input-group\">\n <label class=\"input-label\">City of Residence<\/label>\n <select id=\"ui-city\" class=\"input-field\" onchange=\"doCalc()\">\n <option value=\"metro\">Metro \/ Tier 1 (50% Limit)<\/option>\n <option value=\"non-metro\">Non-Metro (40% Limit)<\/option>\n <\/select>\n <\/div>\n <\/div>\n\n <div class=\"results\">\n <div class=\"results-panel\">\n <div class=\"highlight-box\">\n <div class=\"highlight-label\">Exempt HRA Amount<\/div>\n <div class=\"highlight-value\" id=\"res-exempt\">\u20b9 0<\/div>\n <\/div>\n <div class=\"result-item\">\n <span class=\"result-label\">Taxable HRA<\/span>\n <span class=\"result-value\" id=\"res-taxable\" style=\"color:#ef4444\">\u20b9 0<\/span>\n <\/div>\n <div class=\"result-item\">\n <span class=\"result-label\">Rent – 10% Basic<\/span>\n <span class=\"result-value\" id=\"res-c3\">\u20b9 0<\/span>\n <\/div>\n <div class=\"result-item\">\n <span class=\"result-label\">City Limit (40\/50%)<\/span>\n <span class=\"result-value\" id=\"res-c2\">\u20b9 0<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"btn-container\">\n <button class=\"download-btn\" onclick=\"generateReport()\">\n <i data-lucide=\"file-text\"><\/i> Download Report\n <\/button>\n <\/div>\n\n <div class=\"disclaimer\">\n Exemption applies to Old Tax Regime. Bengaluru, Hyderabad, Pune, and Ahmedabad qualify for 50% limit under Act 2025.\n <\/div>\n<\/div>\n\n\n<div id=\"pdf-template\">\n <div class=\"pdf-header\">\n <p class=\"pdf-title\">Anvasta Consultants Private Limited<\/p>\n <p class=\"pdf-subtitle\">HRA Exemption Report | Financial Year 2026-27<\/p>\n <\/div>\n\n <div class=\"pdf-section\">\n <p class=\"pdf-section-title\">Input Details<\/p>\n <table class=\"pdf-table\">\n <tr><td>Annual Basic Salary + DA<\/td><td id=\"p-basic\">\u20b9 0<\/td><\/tr>\n <tr><td>Annual HRA Received<\/td><td id=\"p-hra\">\u20b9 0<\/td><\/tr>\n <tr><td>Total Rent Paid<\/td><td id=\"p-rent\">\u20b9 0<\/td><\/tr>\n <tr><td>City Type<\/td><td id=\"p-city\">Metro<\/td><\/tr>\n <\/table>\n <\/div>\n\n <div class=\"pdf-section\">\n <p class=\"pdf-section-title\">Calculation Summary<\/p>\n <table class=\"pdf-table\">\n <tr><td>Actual HRA Received<\/td><td id=\"p-c1\">\u20b9 0<\/td><\/tr>\n <tr><td>City Based Limit (40%\/50%)<\/td><td id=\"p-c2\">\u20b9 0<\/td><\/tr>\n <tr><td>Rent Paid minus 10% of Basic<\/td><td id=\"p-c3\">\u20b9 0<\/td><\/tr>\n <\/table>\n <\/div>\n\n <div class=\"pdf-exempt-box\">\n <p style=\"margin:0; font-size:14px; font-weight:600; color:var(--anvasta-green)\">FINAL EXEMPT HRA AMOUNT<\/p>\n <p id=\"p-final\" style=\"margin:10px 0 0; font-size:36px; font-weight:700;\">\u20b9 0<\/p>\n <\/div>\n\n <p style=\"text-align:right; margin-top:20px; font-weight:700; color:#ef4444\">\n Taxable HRA Amount: <span id=\"p-taxable\">\u20b9 0<\/span>\n <\/p>\n\n <div class=\"pdf-footer\">\n <p><strong>Note:<\/strong> This report is generated based on the Income Tax Act 2025. HRA exemption is only applicable under the Old Tax Regime. Bengaluru, Hyderabad, Pune, and Ahmedabad are considered Metro cities as per the new rules.<\/p>\n <p>\u00a9 2026 Anvasta Consultants Private Limited. All Rights Reserved.<\/p>\n <\/div>\n<\/div>\n\n<script>\n const fmt = (v) => \"\u20b9 \" + new Intl.NumberFormat('en-IN').format(Math.max(0, Math.round(v)));\n\n function doCalc() {\n const basic = parseFloat(document.getElementById('ui-basic').value) || 0;\n const hra = parseFloat(document.getElementById('ui-hra').value) || 0;\n const rent = parseFloat(document.getElementById('ui-rent').value) || 0;\n const city = document.getElementById('ui-city').value;\n \n const c1 = hra;\n const c2 = basic * (city === 'metro' ? 0.5 : 0.4);\n const c3 = Math.max(0, rent - (basic * 0.1));\n \n const exempt = Math.min(c1, c2, c3);\n const taxable = Math.max(0, hra - exempt);\n\n document.getElementById('res-exempt').innerText = fmt(exempt);\n document.getElementById('res-taxable').innerText = fmt(taxable);\n document.getElementById('res-c2').innerText = fmt(c2);\n document.getElementById('res-c3').innerText = fmt(c3);\n }\n\n function generateReport() {\n \/\/ Populate PDF template\n document.getElementById('p-basic').innerText = fmt(document.getElementById('ui-basic').value || 0);\n document.getElementById('p-hra').innerText = fmt(document.getElementById('ui-hra').value || 0);\n document.getElementById('p-rent').innerText = fmt(document.getElementById('ui-rent').value || 0);\n document.getElementById('p-city').innerText = document.getElementById('ui-city').options[document.getElementById('ui-city').selectedIndex].text;\n \n const basic = parseFloat(document.getElementById('ui-basic').value) || 0;\n const hra = parseFloat(document.getElementById('ui-hra').value) || 0;\n const rent = parseFloat(document.getElementById('ui-rent').value) || 0;\n const isMetro = document.getElementById('ui-city').value === 'metro';\n \n const c1 = hra;\n const c2 = basic * (isMetro ? 0.5 : 0.4);\n const c3 = Math.max(0, rent - (basic * 0.1));\n const exempt = Math.min(c1, c2, c3);\n const taxable = Math.max(0, hra - exempt);\n\n document.getElementById('p-c1').innerText = fmt(c1);\n document.getElementById('p-c2').innerText = fmt(c2);\n document.getElementById('p-c3').innerText = fmt(c3);\n document.getElementById('p-final').innerText = fmt(exempt);\n document.getElementById('p-taxable').innerText = fmt(taxable);\n\n const element = document.getElementById('pdf-template');\n element.style.display = 'block'; \/\/ Temporarily show for capture\n\n const opt = {\n margin: 0.5,\n filename: 'Anvasta_HRA_Exemption_Report.pdf',\n image: { type: 'jpeg', quality: 0.98 },\n html2canvas: { scale: 2, useCORS: true, letterRendering: true },\n jsPDF: { unit: 'in', format: 'a4', orientation: 'portrait' }\n };\n\n html2pdf().set(opt).from(element).save().then(() => {\n element.style.display = 'none'; \/\/ Hide again\n });\n }\n\n window.onload = () => {\n lucide.createIcons();\n doCalc();\n };\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\n<\/div><\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"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":"","ast-disable-related-posts":"","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":"set","ast-page-background-enabled":"default","ast-page-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":"","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-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":"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":""},"mobile":{"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":""}},"_joinchat":[],"footnotes":""},"class_list":["post-366","page","type-page","status-publish","hentry"],"aioseo_notices":[],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"saurabh@anvasta.com","author_link":"https:\/\/anvasta.com\/index.php\/author\/saurabhanvasta-com\/"},"uagb_comment_info":0,"uagb_excerpt":null,"_links":{"self":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages\/366","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/comments?post=366"}],"version-history":[{"count":24,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages\/366\/revisions"}],"predecessor-version":[{"id":507,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages\/366\/revisions\/507"}],"wp:attachment":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/media?parent=366"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

Tab 3<\/div><\/a><\/li><\/ul>

\n\n\n\n \n \n Anvasta HRA Exemption Calculator FY 2026-27<\/title>\n \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;600;700&display=swap\" rel=\"stylesheet\">\n \n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n <style>\n :root {\n --anvasta-blue: #0055A4;\n --anvasta-green: #00A600;\n --anvasta-bg: #F8FAFC;\n --text-main: #1E293B;\n --text-sub: #64748B;\n --white: #FFFFFF;\n }\n\n * {\n box-sizing: border-box;\n font-family: 'Inter', sans-serif;\n }\n\n body {\n background-color: var(--anvasta-bg);\n color: var(--text-main);\n margin: 0;\n padding: 20px;\n display: flex;\n justify-content: center;\n }\n\n .calc-wrapper {\n width: 100%;\n max-width: 900px;\n background: var(--white);\n border-radius: 16px;\n box-shadow: 0 10px 25px rgba(0, 85, 164, 0.08);\n overflow: hidden;\n border: 1px solid #E2E8F0;\n }\n\n .header {\n background: linear-gradient(135deg, var(--anvasta-blue) 0%, #003d7a 100%);\n padding: 30px;\n color: white;\n text-align: center;\n }\n\n .header h1 {\n margin: 0;\n font-weight: 700;\n color: #FFFFFF !important; \/* Forced white color to override parent styles *\/\n opacity: 1 !important; \/* Ensure full visibility *\/\n font-size: 24px;\n letter-spacing: -0.5px;\n }\n\n .header p {\n margin: 8px 0 0;\n color: #FFFFFF !important;\n opacity: 0.9;\n font-size: 14px;\n }\n\n .content-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 30px;\n padding: 40px;\n }\n\n @media (max-width: 768px) {\n .content-grid {\n grid-template-columns: 1fr;\n }\n }\n\n \/* Inputs Section *\/\n .input-group {\n margin-bottom: 20px;\n }\n\n .input-label {\n display: block;\n font-weight: 600;\n font-size: 14px;\n margin-bottom: 8px;\n color: var(--anvasta-blue);\n }\n\n .input-field {\n width: 100%;\n padding: 12px 16px;\n border: 2px solid #F1F5F9;\n border-radius: 8px;\n font-size: 16px;\n transition: all 0.2s;\n outline: none;\n }\n\n .input-field:focus {\n border-color: var(--anvasta-blue);\n background-color: #f0f7ff;\n }\n\n .select-field {\n appearance: none;\n background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230055A4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'\/%3E%3C\/svg%3E\");\n background-repeat: no-repeat;\n background-position: right 12px center;\n background-size: 16px;\n }\n\n \/* Results Section *\/\n .results-panel {\n background: #F1F5F9;\n padding: 30px;\n border-radius: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n\n .result-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 15px 0;\n border-bottom: 1px solid #E2E8F0;\n }\n\n .result-item:last-child {\n border-bottom: none;\n }\n\n .result-label {\n font-size: 14px;\n color: var(--text-sub);\n font-weight: 400;\n }\n\n .result-value {\n font-weight: 700;\n font-size: 18px;\n color: var(--anvasta-blue);\n }\n\n .highlight-box {\n background: var(--white);\n border-left: 5px solid var(--anvasta-green);\n padding: 20px;\n border-radius: 8px;\n margin-top: 20px;\n }\n\n .highlight-label {\n font-size: 12px;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--anvasta-green);\n font-weight: 700;\n margin-bottom: 5px;\n }\n\n .highlight-value {\n font-size: 32px;\n font-weight: 700;\n color: var(--text-main);\n }\n\n .disclaimer {\n padding: 20px 40px;\n background: #f8fafc;\n font-size: 12px;\n color: var(--text-sub);\n border-top: 1px solid #E2E8F0;\n line-height: 1.6;\n }\n\n .info-icon {\n display: inline-flex;\n align-items: center;\n gap: 5px;\n color: var(--anvasta-blue);\n margin-top: 10px;\n font-size: 13px;\n font-weight: 600;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"calc-wrapper\">\n <div class=\"header\">\n <h1>HRA Exemption Calculator<\/h1>\n <p>As per the New Income Tax Act 2025 | Tax Year 2026-27<\/p>\n <\/div>\n\n <div class=\"content-grid\">\n \n <div class=\"inputs-side\">\n <div class=\"input-group\">\n <label class=\"input-label\">Basic Salary + DA (Annual)<\/label>\n <input type=\"number\" id=\"basicSalary\" class=\"input-field\" placeholder=\"e.g. 1200000\" oninput=\"calculateHRA()\">\n <\/div>\n \n <div class=\"input-group\">\n <label class=\"input-label\">Actual HRA Received (Annual)<\/label>\n <input type=\"number\" id=\"actualHRA\" class=\"input-field\" placeholder=\"e.g. 500000\" oninput=\"calculateHRA()\">\n <\/div>\n\n <div class=\"input-group\">\n <label class=\"input-label\">Total Rent Paid (Annual)<\/label>\n <input type=\"number\" id=\"rentPaid\" class=\"input-field\" placeholder=\"e.g. 400000\" oninput=\"calculateHRA()\">\n <\/div>\n\n <div class=\"input-group\">\n <label class=\"input-label\">City of Residence<\/label>\n <select id=\"cityType\" class=\"input-field select-field\" onchange=\"calculateHRA()\">\n <option value=\"metro\">Tier 1 \/ Metro City (50% Limit)<\/option>\n <option value=\"non-metro\">Tier 2 \/ Non-Metro (40% Limit)<\/option>\n <\/select>\n <div class=\"info-icon\">\n <i data-lucide=\"info\" size=\"14\"><\/i>\n <span>Metro Cities are Mumbai, Delhi, Chennai, Kolkata, Bengaluru, Hyderabad, Pune & Ahmedabad as per 2025 Act<\/span>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"results-side\">\n <div class=\"results-panel\">\n <div class=\"highlight-box\">\n <div class=\"highlight-label\">Exempt HRA Amount<\/div>\n <div class=\"highlight-value\" id=\"exemptAmount\">\u20b9 0<\/div>\n <\/div>\n\n <div class=\"result-item\">\n <span class=\"result-label\">Taxable HRA<\/span>\n <span class=\"result-value\" id=\"taxableAmount\" style=\"color: #ef4444;\">\u20b9 0<\/span>\n <\/div>\n\n <div class=\"result-item\">\n <span class=\"result-label\">Rent paid minus 10% of (Basic Salary + DA)<\/span>\n <span class=\"result-value\" id=\"rentLessTen\">\u20b9 0<\/span>\n <\/div>\n\n <div class=\"result-item\">\n <span class=\"result-label\">City-based Limit (40\/50%)<\/span>\n <span class=\"result-value\" id=\"cityLimit\">\u20b9 0<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"disclaimer\">\n <strong>Notes on Income Tax Act 2025 (Tax Year 2026-27):<\/strong><br>\n 1. HRA Exemption is available only under the <strong>Old Tax Regime<\/strong>. Under the default New Regime, HRA is fully taxable.<br>\n 2. <strong>City Status Update:<\/strong> Bengaluru, Hyderabad, Pune, and Ahmedabad are now eligible for the 50% limit (previously 40%).<br>\n 3. Mandatory PAN of landlord is required if annual rent exceeds \u20b91,00,000.\n <\/div>\n<\/div>\n\n<script>\n \/\/ Initialize Icons\n lucide.createIcons();\n\n function formatCurrency(num) {\n return \"\u20b9 \" + new Intl.NumberFormat('en-IN').format(Math.max(0, Math.round(num)));\n }\n\n function calculateHRA() {\n \/\/ Get Inputs\n const basic = parseFloat(document.getElementById('basicSalary').value) || 0;\n const actualHRA = parseFloat(document.getElementById('actualHRA').value) || 0;\n const rent = parseFloat(document.getElementById('rentPaid').value) || 0;\n const isMetro = document.getElementById('cityType').value === 'metro';\n\n \/\/ Calculation Logic\n \/\/ 1. Actual HRA\n const condition1 = actualHRA;\n\n \/\/ 2. 50% or 40% of Basic\n const pct = isMetro ? 0.5 : 0.4;\n const condition2 = basic * pct;\n\n \/\/ 3. Rent paid minus 10% of Basic\n const condition3 = Math.max(0, rent - (basic * 0.1));\n\n \/\/ Least of the three\n const exemptHRA = Math.min(condition1, condition2, condition3);\n const taxableHRA = Math.max(0, actualHRA - exemptHRA);\n\n \/\/ Update UI\n document.getElementById('exemptAmount').innerText = formatCurrency(exemptHRA);\n document.getElementById('taxableAmount').innerText = formatCurrency(taxableHRA);\n document.getElementById('rentLessTen').innerText = formatCurrency(condition3);\n document.getElementById('cityLimit').innerText = formatCurrency(condition2);\n }\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\n\n\n\n<div class=\"wp-block-uagb-tabs-child uagb-tabs__body-container uagb-inner-tab-1\" aria-labelledby=\"uagb-tabs__tab1\">\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n \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;600;700&display=swap\" rel=\"stylesheet\">\n \n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/chart.js\"><\/script>\n <style>\n :root {\n --anvasta-blue: #0056b3; \/* Primary Blue from Logo *\/\n --anvasta-green: #00b300; \/* Primary Green from Logo *\/\n --anvasta-light-bg: #f8fafc;\n --anvasta-border: #e2e8f0;\n --text-dark: #1e293b;\n --text-muted: #64748b;\n }\n\n #anvasta-emi-container {\n font-family: 'Inter', sans-serif;\n max-width: 900px;\n margin: 20px auto;\n background: #ffffff;\n border-radius: 16px;\n box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);\n padding: 0; \/* Changed to 0 to allow header to span full width *\/\n color: var(--text-dark);\n line-height: 1.5;\n border: 1px solid var(--anvasta-border);\n overflow: hidden; \/* Ensures header corners stay rounded *\/\n }\n\n .anvasta-header {\n text-align: center;\n background-color: var(--anvasta-blue);\n padding: 35px 30px;\n margin-bottom: 0;\n }\n\n .anvasta-header h2 {\n font-weight: 700;\n color: #ffffff;\n font-size: 28px;\n margin-bottom: 8px;\n margin-top: 0;\n }\n\n .anvasta-header p {\n color: #ffffff;\n font-size: 16px;\n margin: 0;\n opacity: 0.95;\n }\n\n .anvasta-header p strong {\n color: #ffffff;\n font-weight: 700;\n }\n\n .content-padding {\n padding: 30px;\n }\n\n .anvasta-grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 40px;\n }\n\n @media (max-width: 768px) {\n .anvasta-grid {\n grid-template-columns: 1fr;\n }\n }\n\n .input-section {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n\n .form-group {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n .label-row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n }\n\n .label-row label {\n font-weight: 600;\n font-size: 14px;\n color: var(--text-dark);\n }\n\n .input-wrapper {\n position: relative;\n display: flex;\n align-items: center;\n }\n\n .input-wrapper input[type=\"number\"] {\n width: 100%;\n padding: 12px 16px;\n border: 2px solid var(--anvasta-border);\n border-radius: 8px;\n font-family: 'Inter', sans-serif;\n font-size: 16px;\n font-weight: 600;\n outline: none;\n transition: border-color 0.2s;\n }\n\n .input-wrapper input[type=\"number\"]:focus {\n border-color: var(--anvasta-blue);\n }\n\n .unit-label {\n position: absolute;\n right: 16px;\n color: var(--text-muted);\n font-weight: 600;\n pointer-events: none;\n }\n\n \/* Slider Styling *\/\n input[type=\"range\"] {\n -webkit-appearance: none;\n width: 100%;\n height: 6px;\n background: #cbd5e1;\n border-radius: 5px;\n margin-top: 10px;\n }\n\n input[type=\"range\"]::-webkit-slider-thumb {\n -webkit-appearance: none;\n height: 20px;\n width: 20px;\n border-radius: 50%;\n background: var(--anvasta-blue);\n cursor: pointer;\n box-shadow: 0 0 10px rgba(0, 86, 179, 0.3);\n border: 3px solid #fff;\n }\n\n \/* Results Display *\/\n .results-section {\n background: var(--anvasta-light-bg);\n padding: 24px;\n border-radius: 12px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n }\n\n .emi-display {\n text-align: center;\n margin-bottom: 24px;\n }\n\n .emi-label {\n font-size: 14px;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--text-muted);\n font-weight: 600;\n }\n\n .emi-value {\n font-size: 36px;\n font-weight: 700;\n color: var(--anvasta-blue);\n margin: 5px 0;\n }\n\n .breakdown-grid {\n width: 100%;\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 12px;\n margin-top: 20px;\n }\n\n .breakdown-item {\n background: #fff;\n padding: 12px;\n border-radius: 8px;\n border: 1px solid var(--anvasta-border);\n text-align: center;\n }\n\n .breakdown-item span {\n display: block;\n font-size: 12px;\n color: var(--text-muted);\n font-weight: 600;\n }\n\n .breakdown-item strong {\n display: block;\n font-size: 16px;\n color: var(--text-dark);\n margin-top: 4px;\n }\n\n .chart-container {\n width: 100%;\n max-width: 200px;\n margin: 0 auto;\n }\n\n .anvasta-footer {\n margin-top: 30px;\n padding: 20px 30px;\n border-top: 1px solid var(--anvasta-border);\n text-align: center;\n font-size: 13px;\n color: var(--text-muted);\n }\n\n .anvasta-footer strong {\n color: var(--anvasta-green);\n }\n <\/style>\n<\/head>\n<body>\n\n<div id=\"anvasta-emi-container\">\n <div class=\"anvasta-header\">\n <h2>EMI Calculator<\/h2>\n <p>Providing the <strong>Right<\/strong> financial planning for you<\/p>\n <\/div>\n\n <div class=\"content-padding\">\n <div class=\"anvasta-grid\">\n \n <div class=\"input-section\">\n \n \n <div class=\"form-group\">\n <div class=\"label-row\">\n <label>Loan Amount<\/label>\n <\/div>\n <div class=\"input-wrapper\">\n <input type=\"number\" id=\"loanAmount\" value=\"5000000\" step=\"50000\">\n <span class=\"unit-label\">\u20b9<\/span>\n <\/div>\n <input type=\"range\" id=\"loanAmountSlider\" min=\"100000\" max=\"10000000\" step=\"50000\" value=\"5000000\">\n <\/div>\n\n \n <div class=\"form-group\">\n <div class=\"label-row\">\n <label>Interest Rate (P.A.)<\/label>\n <\/div>\n <div class=\"input-wrapper\">\n <input type=\"number\" id=\"interestRate\" value=\"7.5\" step=\"0.1\">\n <span class=\"unit-label\">%<\/span>\n <\/div>\n <input type=\"range\" id=\"interestRateSlider\" min=\"1\" max=\"25\" step=\"0.1\" value=\"7.5\">\n <\/div>\n\n \n <div class=\"form-group\">\n <div class=\"label-row\">\n <label>Loan Tenure<\/label>\n <\/div>\n <div class=\"input-wrapper\">\n <input type=\"number\" id=\"loanTenure\" value=\"15\">\n <span class=\"unit-label\">Years<\/span>\n <\/div>\n <input type=\"range\" id=\"loanTenureSlider\" min=\"1\" max=\"30\" step=\"1\" value=\"15\">\n <\/div>\n\n <\/div>\n\n \n <div class=\"results-section\">\n <div class=\"emi-display\">\n <div class=\"emi-label\">Monthly EMI<\/div>\n <div class=\"emi-value\" id=\"monthlyEmi\">\u20b9 0<\/div>\n <\/div>\n\n <div class=\"chart-container\">\n <canvas id=\"emiChart\"><\/canvas>\n <\/div>\n\n <div class=\"breakdown-grid\">\n <div class=\"breakdown-item\">\n <span>Principal Amount<\/span>\n <strong id=\"displayPrincipal\">\u20b9 0<\/strong>\n <\/div>\n <div class=\"breakdown-item\">\n <span>Total Interest<\/span>\n <strong id=\"displayTotalInterest\">\u20b9 0<\/strong>\n <\/div>\n <div class=\"breakdown-item\" style=\"grid-column: span 2; border-color: var(--anvasta-blue); background: #eef6ff;\">\n <span>Total Amount Payable<\/span>\n <strong id=\"displayTotalPayable\">\u20b9 0<\/strong>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"anvasta-footer\">\n \u00a9 Anvasta Consultants Private Limited \u2014 Offering <strong>Right<\/strong> Solutions.\n <\/div>\n<\/div>\n\n<script>\n const loanAmountInput = document.getElementById('loanAmount');\n const loanAmountSlider = document.getElementById('loanAmountSlider');\n const interestRateInput = document.getElementById('interestRate');\n const interestRateSlider = document.getElementById('interestRateSlider');\n const loanTenureInput = document.getElementById('loanTenure');\n const loanTenureSlider = document.getElementById('loanTenureSlider');\n\n const monthlyEmiText = document.getElementById('monthlyEmi');\n const displayPrincipal = document.getElementById('displayPrincipal');\n const displayTotalInterest = document.getElementById('displayTotalInterest');\n const displayTotalPayable = document.getElementById('displayTotalPayable');\n\n let emiChart;\n\n function formatCurrency(num) {\n return '\u20b9 ' + Number(num).toLocaleString('en-IN');\n }\n\n function calculateEMI() {\n const principal = parseFloat(loanAmountInput.value);\n const annualRate = parseFloat(interestRateInput.value);\n const years = parseFloat(loanTenureInput.value);\n\n if (isNaN(principal) || isNaN(annualRate) || isNaN(years) || principal <= 0 || annualRate <= 0 || years <= 0) {\n return;\n }\n\n const monthlyRate = annualRate \/ (12 * 100);\n const months = years * 12;\n\n const emi = (principal * monthlyRate * Math.pow(1 + monthlyRate, months)) \/ (Math.pow(1 + monthlyRate, months) - 1);\n const totalPayable = emi * months;\n const totalInterest = totalPayable - principal;\n\n \/\/ Update Text\n monthlyEmiText.innerText = formatCurrency(Math.round(emi));\n displayPrincipal.innerText = formatCurrency(Math.round(principal));\n displayTotalInterest.innerText = formatCurrency(Math.round(totalInterest));\n displayTotalPayable.innerText = formatCurrency(Math.round(totalPayable));\n\n updateChart(principal, totalInterest);\n }\n\n function updateChart(principal, interest) {\n const data = {\n labels: ['Principal', 'Interest'],\n datasets: [{\n data: [principal, interest],\n backgroundColor: ['#0056b3', '#00b300'], \/\/ Anvasta Blue and Green\n hoverOffset: 4,\n borderWidth: 0\n }]\n };\n\n if (emiChart) {\n emiChart.data = data;\n emiChart.update();\n } else {\n const ctx = document.getElementById('emiChart').getContext('2d');\n emiChart = new Chart(ctx, {\n type: 'doughnut',\n data: data,\n options: {\n cutout: '70%',\n plugins: {\n legend: { display: false },\n tooltip: { enabled: true }\n }\n }\n });\n }\n }\n\n \/\/ Event Listeners for Syncing Slider and Input\n function sync(slider, input) {\n slider.addEventListener('input', () => {\n input.value = slider.value;\n calculateEMI();\n });\n input.addEventListener('input', () => {\n slider.value = input.value;\n calculateEMI();\n });\n }\n\n sync(loanAmountSlider, loanAmountInput);\n sync(interestRateSlider, interestRateInput);\n sync(loanTenureSlider, loanTenureInput);\n\n \/\/ Initial Calculation\n window.onload = calculateEMI;\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\n\n\n\n<div class=\"wp-block-uagb-tabs-child uagb-tabs__body-container uagb-inner-tab-2\" aria-labelledby=\"uagb-tabs__tab2\">\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Anvasta HRA Exemption Calculator FY 2026-27<\/title>\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;600;700&display=swap\" rel=\"stylesheet\">\n <script src=\"https:\/\/unpkg.com\/lucide@latest\"><\/script>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2pdf.js\/0.10.1\/html2pdf.bundle.min.js\"><\/script>\n <style>\n :root {\n --anvasta-blue: #0055A4;\n --anvasta-green: #00A600;\n --anvasta-bg: #F8FAFC;\n --text-main: #1E293B;\n --text-sub: #64748B;\n --white: #FFFFFF;\n }\n\n * { box-sizing: border-box; font-family: 'Inter', sans-serif; }\n body { background-color: var(--anvasta-bg); margin: 0; padding: 10px; display: flex; justify-content: center; }\n\n .calc-wrapper {\n width: 100%;\n max-width: 900px;\n background: var(--white);\n border-radius: 16px;\n box-shadow: 0 10px 25px rgba(0, 85, 164, 0.08);\n overflow: hidden;\n border: 1px solid #E2E8F0;\n }\n\n .header {\n background: linear-gradient(135deg, var(--anvasta-blue) 0%, #003d7a 100%);\n padding: 30px;\n color: white;\n text-align: center;\n }\n\n .header h1 {\n margin: 0;\n font-weight: 700;\n color: #FFFFFF !important;\n font-size: 24px;\n letter-spacing: -0.5px;\n }\n\n .header p { margin: 8px 0 0; color: #FFFFFF !important; opacity: 0.9; font-size: 14px; }\n\n .content-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: 40px; }\n @media (max-width: 768px) { .content-grid { grid-template-columns: 1fr; padding: 20px; } }\n\n .input-group { margin-bottom: 20px; }\n .input-label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 8px; color: var(--anvasta-blue); }\n .input-field {\n width: 100%;\n padding: 12px 16px;\n border: 2px solid #F1F5F9;\n border-radius: 8px;\n font-size: 16px;\n outline: none;\n color: var(--text-main);\n }\n .input-field:focus { border-color: var(--anvasta-blue); background-color: #f0f7ff; }\n\n .results-panel { background: #F1F5F9; padding: 30px; border-radius: 12px; }\n .result-item { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #E2E8F0; }\n .result-label { font-size: 14px; color: var(--text-sub); }\n .result-value { font-weight: 700; color: var(--anvasta-blue); }\n\n .highlight-box { background: var(--white); border-left: 5px solid var(--anvasta-green); padding: 20px; border-radius: 8px; margin-top: 10px; }\n .highlight-label { font-size: 12px; color: var(--anvasta-green); font-weight: 700; text-transform: uppercase; }\n .highlight-value { font-size: 32px; font-weight: 700; color: var(--text-main); }\n\n .btn-container { padding: 0 40px 40px; display: flex; justify-content: flex-end; gap: 15px; }\n .primary-btn, .download-btn {\n border: none; padding: 12px 24px; border-radius: 8px; font-weight: 600; cursor: pointer;\n display: flex; align-items: center; gap: 8px; color: white !important;\n }\n .primary-btn { background-color: var(--anvasta-blue); }\n .download-btn { background-color: var(--anvasta-green); }\n\n .disclaimer { padding: 20px 40px; background: #f8fafc; font-size: 12px; color: var(--text-sub); border-top: 1px solid #E2E8F0; line-height: 1.6; }\n\n \/* PDF HIDDEN TEMPLATE - This is what gets printed *\/\n #pdf-template {\n display: none;\n width: 700px;\n padding: 40px;\n color: #333;\n background: white;\n }\n .pdf-header { border-bottom: 3px solid var(--anvasta-blue); padding-bottom: 20px; margin-bottom: 30px; }\n .pdf-title { color: var(--anvasta-blue); font-size: 28px; font-weight: 700; margin: 0; }\n .pdf-subtitle { color: var(--text-sub); font-size: 14px; margin-top: 5px; }\n .pdf-section { margin-bottom: 30px; }\n .pdf-section-title { font-weight: 700; font-size: 18px; color: var(--anvasta-blue); border-bottom: 1px solid #eee; padding-bottom: 5px; margin-bottom: 15px; }\n .pdf-table { width: 100%; border-collapse: collapse; }\n .pdf-table td { padding: 12px 0; border-bottom: 1px solid #f0f0f0; }\n .pdf-table td:last-child { text-align: right; font-weight: 700; color: var(--text-main); }\n .pdf-exempt-box { background: #f0f9f0; padding: 25px; border-radius: 10px; border: 2px solid var(--anvasta-green); text-align: center; }\n .pdf-footer { margin-top: 50px; font-size: 11px; color: #999; border-top: 1px solid #eee; padding-top: 20px; }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"calc-wrapper\">\n <div class=\"header\">\n <h1>HRA Exemption Calculator<\/h1>\n <p>FY 2026-27 | Income Tax Act 2025<\/p>\n <\/div>\n\n <div class=\"content-grid\">\n <div class=\"inputs\">\n <div class=\"input-group\">\n <label class=\"input-label\">Basic Salary + DA (Annual)<\/label>\n <input type=\"number\" id=\"ui-basic\" class=\"input-field\" placeholder=\"0\" oninput=\"doCalc()\">\n <\/div>\n <div class=\"input-group\">\n <label class=\"input-label\">Actual HRA Received (Annual)<\/label>\n <input type=\"number\" id=\"ui-hra\" class=\"input-field\" placeholder=\"0\" oninput=\"doCalc()\">\n <\/div>\n <div class=\"input-group\">\n <label class=\"input-label\">Total Rent Paid (Annual)<\/label>\n <input type=\"number\" id=\"ui-rent\" class=\"input-field\" placeholder=\"0\" oninput=\"doCalc()\">\n <\/div>\n <div class=\"input-group\">\n <label class=\"input-label\">City of Residence<\/label>\n <select id=\"ui-city\" class=\"input-field\" onchange=\"doCalc()\">\n <option value=\"metro\">Metro \/ Tier 1 (50% Limit)<\/option>\n <option value=\"non-metro\">Non-Metro (40% Limit)<\/option>\n <\/select>\n <\/div>\n <\/div>\n\n <div class=\"results\">\n <div class=\"results-panel\">\n <div class=\"highlight-box\">\n <div class=\"highlight-label\">Exempt HRA Amount<\/div>\n <div class=\"highlight-value\" id=\"res-exempt\">\u20b9 0<\/div>\n <\/div>\n <div class=\"result-item\">\n <span class=\"result-label\">Taxable HRA<\/span>\n <span class=\"result-value\" id=\"res-taxable\" style=\"color:#ef4444\">\u20b9 0<\/span>\n <\/div>\n <div class=\"result-item\">\n <span class=\"result-label\">Rent – 10% Basic<\/span>\n <span class=\"result-value\" id=\"res-c3\">\u20b9 0<\/span>\n <\/div>\n <div class=\"result-item\">\n <span class=\"result-label\">City Limit (40\/50%)<\/span>\n <span class=\"result-value\" id=\"res-c2\">\u20b9 0<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"btn-container\">\n <button class=\"download-btn\" onclick=\"generateReport()\">\n <i data-lucide=\"file-text\"><\/i> Download Report\n <\/button>\n <\/div>\n\n <div class=\"disclaimer\">\n Exemption applies to Old Tax Regime. Bengaluru, Hyderabad, Pune, and Ahmedabad qualify for 50% limit under Act 2025.\n <\/div>\n<\/div>\n\n\n<div id=\"pdf-template\">\n <div class=\"pdf-header\">\n <p class=\"pdf-title\">Anvasta Consultants Private Limited<\/p>\n <p class=\"pdf-subtitle\">HRA Exemption Report | Financial Year 2026-27<\/p>\n <\/div>\n\n <div class=\"pdf-section\">\n <p class=\"pdf-section-title\">Input Details<\/p>\n <table class=\"pdf-table\">\n <tr><td>Annual Basic Salary + DA<\/td><td id=\"p-basic\">\u20b9 0<\/td><\/tr>\n <tr><td>Annual HRA Received<\/td><td id=\"p-hra\">\u20b9 0<\/td><\/tr>\n <tr><td>Total Rent Paid<\/td><td id=\"p-rent\">\u20b9 0<\/td><\/tr>\n <tr><td>City Type<\/td><td id=\"p-city\">Metro<\/td><\/tr>\n <\/table>\n <\/div>\n\n <div class=\"pdf-section\">\n <p class=\"pdf-section-title\">Calculation Summary<\/p>\n <table class=\"pdf-table\">\n <tr><td>Actual HRA Received<\/td><td id=\"p-c1\">\u20b9 0<\/td><\/tr>\n <tr><td>City Based Limit (40%\/50%)<\/td><td id=\"p-c2\">\u20b9 0<\/td><\/tr>\n <tr><td>Rent Paid minus 10% of Basic<\/td><td id=\"p-c3\">\u20b9 0<\/td><\/tr>\n <\/table>\n <\/div>\n\n <div class=\"pdf-exempt-box\">\n <p style=\"margin:0; font-size:14px; font-weight:600; color:var(--anvasta-green)\">FINAL EXEMPT HRA AMOUNT<\/p>\n <p id=\"p-final\" style=\"margin:10px 0 0; font-size:36px; font-weight:700;\">\u20b9 0<\/p>\n <\/div>\n\n <p style=\"text-align:right; margin-top:20px; font-weight:700; color:#ef4444\">\n Taxable HRA Amount: <span id=\"p-taxable\">\u20b9 0<\/span>\n <\/p>\n\n <div class=\"pdf-footer\">\n <p><strong>Note:<\/strong> This report is generated based on the Income Tax Act 2025. HRA exemption is only applicable under the Old Tax Regime. Bengaluru, Hyderabad, Pune, and Ahmedabad are considered Metro cities as per the new rules.<\/p>\n <p>\u00a9 2026 Anvasta Consultants Private Limited. All Rights Reserved.<\/p>\n <\/div>\n<\/div>\n\n<script>\n const fmt = (v) => \"\u20b9 \" + new Intl.NumberFormat('en-IN').format(Math.max(0, Math.round(v)));\n\n function doCalc() {\n const basic = parseFloat(document.getElementById('ui-basic').value) || 0;\n const hra = parseFloat(document.getElementById('ui-hra').value) || 0;\n const rent = parseFloat(document.getElementById('ui-rent').value) || 0;\n const city = document.getElementById('ui-city').value;\n \n const c1 = hra;\n const c2 = basic * (city === 'metro' ? 0.5 : 0.4);\n const c3 = Math.max(0, rent - (basic * 0.1));\n \n const exempt = Math.min(c1, c2, c3);\n const taxable = Math.max(0, hra - exempt);\n\n document.getElementById('res-exempt').innerText = fmt(exempt);\n document.getElementById('res-taxable').innerText = fmt(taxable);\n document.getElementById('res-c2').innerText = fmt(c2);\n document.getElementById('res-c3').innerText = fmt(c3);\n }\n\n function generateReport() {\n \/\/ Populate PDF template\n document.getElementById('p-basic').innerText = fmt(document.getElementById('ui-basic').value || 0);\n document.getElementById('p-hra').innerText = fmt(document.getElementById('ui-hra').value || 0);\n document.getElementById('p-rent').innerText = fmt(document.getElementById('ui-rent').value || 0);\n document.getElementById('p-city').innerText = document.getElementById('ui-city').options[document.getElementById('ui-city').selectedIndex].text;\n \n const basic = parseFloat(document.getElementById('ui-basic').value) || 0;\n const hra = parseFloat(document.getElementById('ui-hra').value) || 0;\n const rent = parseFloat(document.getElementById('ui-rent').value) || 0;\n const isMetro = document.getElementById('ui-city').value === 'metro';\n \n const c1 = hra;\n const c2 = basic * (isMetro ? 0.5 : 0.4);\n const c3 = Math.max(0, rent - (basic * 0.1));\n const exempt = Math.min(c1, c2, c3);\n const taxable = Math.max(0, hra - exempt);\n\n document.getElementById('p-c1').innerText = fmt(c1);\n document.getElementById('p-c2').innerText = fmt(c2);\n document.getElementById('p-c3').innerText = fmt(c3);\n document.getElementById('p-final').innerText = fmt(exempt);\n document.getElementById('p-taxable').innerText = fmt(taxable);\n\n const element = document.getElementById('pdf-template');\n element.style.display = 'block'; \/\/ Temporarily show for capture\n\n const opt = {\n margin: 0.5,\n filename: 'Anvasta_HRA_Exemption_Report.pdf',\n image: { type: 'jpeg', quality: 0.98 },\n html2canvas: { scale: 2, useCORS: true, letterRendering: true },\n jsPDF: { unit: 'in', format: 'a4', orientation: 'portrait' }\n };\n\n html2pdf().set(opt).from(element).save().then(() => {\n element.style.display = 'none'; \/\/ Hide again\n });\n }\n\n window.onload = () => {\n lucide.createIcons();\n doCalc();\n };\n<\/script>\n\n<\/body>\n<\/html>\n<\/div>\n<\/div><\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"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":"","ast-disable-related-posts":"","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":"set","ast-page-background-enabled":"default","ast-page-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":"","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-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":"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":""},"mobile":{"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":""}},"_joinchat":[],"footnotes":""},"class_list":["post-366","page","type-page","status-publish","hentry"],"aioseo_notices":[],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"saurabh@anvasta.com","author_link":"https:\/\/anvasta.com\/index.php\/author\/saurabhanvasta-com\/"},"uagb_comment_info":0,"uagb_excerpt":null,"_links":{"self":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages\/366","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/comments?post=366"}],"version-history":[{"count":24,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages\/366\/revisions"}],"predecessor-version":[{"id":507,"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/pages\/366\/revisions\/507"}],"wp:attachment":[{"href":"https:\/\/anvasta.com\/index.php\/wp-json\/wp\/v2\/media?parent=366"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}