#installment-calculator {
--navy: #071a36;
--gold: #f5c96a;
font-family: Tahoma, Arial, sans-serif;
max-width: 760px;
margin: 30px auto;
color: #fff;
}
#installment-calculator * {
box-sizing: border-box;
}
#installment-calculator .calc-card {
background: linear-gradient(145deg, #10294d, #061329);
border: 2px solid #c89b43;
border-radius: 24px;
padding: 28px;
box-shadow: 0 12px 0 #030b17,
0 18px 30px #0005,
inset 0 1px 2px #ffffff35;
}
#installment-calculator .calc-title {
text-align: center;
font-size: 28px;
font-weight: bold;
color: var(--gold);
text-shadow: 0 3px 0 #7c541b;
margin: 0 0 12px;
}
#installment-calculator .calc-subtitle {
text-align: center;
color: #d4deee;
font-size: 14px;
line-height: 2;
margin-bottom: 30px;
}
#installment-calculator .field-label {
display: block;
font-size: 15px;
font-weight: bold;
margin: 22px 0 12px;
color: #fff;
}
#installment-calculator .money-input {
width: 100%;
padding: 16px;
border: 2px solid #d8ad54;
border-radius: 12px;
background: #06142a;
color: #fff;
font-family: inherit;
font-size: 18px;
outline: none;
box-shadow: inset 0 4px 8px #0005;
}
#installment-calculator .money-input:focus {
border-color: #ffe5a0;
box-shadow: 0 0 0 3px #f5c96a25;
}
#installment-calculator .hint {
color: #c5d1e3;
font-size: 12px;
margin-top: 9px;
line-height: 1.9;
}
#installment-calculator .error {
display: none;
color: #ff8585;
background: #7e17252e;
border: 1px solid #ff65655c;
padding: 10px 12px;
border-radius: 9px;
font-size: 13px;
margin-top: 10px;
}
#installment-calculator .prepayment-box {
margin-top: 25px;
padding: 18px;
background: linear-gradient(145deg, #152f52, #08172e);
border: 1px solid #b58b43;
border-radius: 15px;
box-shadow: inset 0 2px 5px #ffffff12,
0 5px 0 #030b17;
}
#installment-calculator .prepayment-title {
display: block;
color: var(--gold);
font-size: 16px;
font-weight: bold;
margin-bottom: 12px;
}
#installment-calculator .prepayment-result {
width: 100%;
padding: 15px 12px;
border: 2px solid #d6ad59;
border-radius: 10px;
background: #061329;
color: #ffe19a;
text-align: center;
font-family: inherit;
font-size: 19px;
font-weight: bold;
outline: none;
box-shadow: inset 0 4px 8px #0006;
}
#installment-calculator .prepayment-buttons {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 12px;
margin-top: 14px;
}
#installment-calculator .ratio-btn {
padding: 13px 8px;
border: 1px solid #718bb0;
border-radius: 10px;
background: linear-gradient(160deg, #244775, #0b1b34);
color: #fff;
font-family: inherit;
font-size: 14px;
font-weight: bold;
cursor: pointer;
box-shadow: 0 5px 0 #030a14,
inset 0 1px 2px #ffffff35;
transition: transform .12s, box-shadow .12s;
}
#installment-calculator .ratio-btn:active {
transform: translateY(3px);
box-shadow: 0 2px 0 #030a14;
}
#installment-calculator .ratio-btn.active {
background: linear-gradient(160deg, #ffe5a0, #c48a2e);
color: #17213a;
border-color: #fff0bd;
box-shadow: 0 5px 0 #80551c,
0 0 12px #f5c96a35;
}
#installment-calculator .installment-options {
display: grid;
grid-template-columns: repeat(9, minmax(0, 1fr));
gap: 8px;
margin: 15px 0 28px;
}
#installment-calculator .term-btn {
border: 1px solid #6d8bb5;
border-radius: 10px;
padding: 13px 2px;
background: linear-gradient(160deg, #244775, #0b1b34);
color: white;
font-family: inherit;
font-weight: bold;
font-size: 15px;
cursor: pointer;
box-shadow: 0 5px 0 #030a14,
inset 0 1px 2px #ffffff35;
transition: transform .12s, box-shadow .12s;
}
#installment-calculator .term-btn:active {
transform: translateY(3px);
box-shadow: 0 2px 0 #030a14;
}
#installment-calculator .term-btn.active {
background: linear-gradient(160deg, #ffe5a0, #c48a2e);
color: #17213a;
border-color: #fff0bd;
box-shadow: 0 5px 0 #80551c,
0 0 12px #f5c96a50;
}
#installment-calculator .result-box {
background: linear-gradient(145deg, #18365e, #07162c);
border: 2px solid var(--gold);
border-radius: 16px;
padding: 20px;
margin-top: 24px;
box-shadow: 0 6px 0 #030b17,
inset 0 1px 3px #ffffff30;
}
#installment-calculator .result-label {
display: block;
color: var(--gold);
font-size: 17px;
font-weight: bold;
margin-bottom: 12px;
}
#installment-calculator .result-input {
width: 100%;
border: 1px solid #b58b43;
border-radius: 10px;
background: #061329;
color: #ffe19a;
font-family: inherit;
font-size: 23px;
font-weight: bold;
text-align: center;
padding: 16px 8px;
outline: none;
box-shadow: inset 0 4px 10px #0006;
}
#installment-calculator .calc-button {
width: 100%;
margin-top: 24px;
padding: 17px;
border: 1px solid #fff0bb;
border-radius: 13px;
background: linear-gradient(180deg, #ffe7a0, #d29a3d 65%, #b77c25);
color: #17233b;
font-family: inherit;
font-size: 17px;
font-weight: bold;
cursor: pointer;
box-shadow: 0 7px 0 #704819,
0 12px 20px #0005,
inset 0 2px 2px #fff9;
transition: transform .12s, box-shadow .12s;
}
#installment-calculator .calc-button:active {
transform: translateY(4px);
box-shadow: 0 3px 0 #704819;
}
#installment-calculator .formula-note {
text-align: center;
font-size: 11px;
color: #aebed4;
line-height: 2;
margin-top: 23px;
}
@media (max-width: 520px) {
#installment-calculator .calc-card {
padding: 18px 13px;
}
#installment-calculator .calc-title {
font-size: 23px;
}
#installment-calculator .installment-options {
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 9px;
}
#installment-calculator .term-btn {
padding: 13px 2px;
}
#installment-calculator .result-input {
font-size: 19px;
}
#installment-calculator .prepayment-result {
font-size: 16px;
}
}
(function () {
const root = document.getElementById('installment-calculator');
if (!root || root.dataset.initialized === 'true') return;
root.dataset.initialized = 'true';
const priceInput = root.querySelector('#ic-price');
const prepaymentInput = root.querySelector('#ic-prepayment');
const errorBox = root.querySelector('#ic-price-error');
const resultInput = root.querySelector('#ic-result');
const calculateBtn = root.querySelector('#ic-calculate');
const termButtons = root.querySelectorAll('.term-btn');
const ratioButtons = root.querySelectorAll('.ratio-btn');
let selectedTerm = 6;
let selectedRatio = 3;
const persianDigits = '۰۱۲۳۴۵۶۷۸۹';
function toEnglishDigits(value) {
return String(value)
.replace(/[۰-۹]/g, d =>
String(persianDigits.indexOf(d))
)
.replace(/[٠-٩]/g, d =>
String('٠١٢٣٤٥٦٧٨٩'.indexOf(d))
)
.replace(/[٬,،\s]/g, '')
.replace(/[٫]/g, '.');
}
function toPersianDigits(value) {
return String(value).replace(
/\d/g,
d => persianDigits[Number(d)]
);
}
function formatNumber(value) {
return toPersianDigits(
Math.round(value).toLocaleString('en-US')
);
}
function getPriceInMillions() {
const raw = toEnglishDigits(priceInput.value);
if (!raw || !/^\d+$/.test(raw)) {
return NaN;
}
return Number(raw);
}
function validatePrice() {
const price = getPriceInMillions();
const hasValue = priceInput.value.trim() !== '';
const valid = Number.isFinite(price) && price >= 80;
errorBox.style.display =
hasValue && !valid ? 'block' : 'none';
priceInput.setAttribute(
'aria-invalid',
String(hasValue && !valid)
);
return valid ? price : NaN;
}
function calculate() {
const priceMillions = validatePrice();
if (!Number.isFinite(priceMillions)) {
prepaymentInput.value = '—';
resultInput.value = '— تومان';
return;
}
// تبدیل قیمت خط به تومان
const totalPrice = priceMillions * 1000000;
// محاسبه پیش‌پرداخت: یک‌سوم یا یک‌دوم
const downPayment = totalPrice / selectedRatio;
// نمایش پیش‌پرداخت بر حسب میلیون تومان
prepaymentInput.value =
formatNumber(priceMillions / selectedRatio) +
' میلیون تومان';
// کسر پیش‌پرداخت از قیمت کل
const remaining = totalPrice - downPayment;
// افزودن ۱۰ درصد کارمزد
const initialNumber = remaining * 1.10;
// محاسبه مبلغ اضافه بر اساس ۴ درصد و تعداد اقساط
const extra = initialNumber * 0.04 * selectedTerm;
// مبلغ هر قسط پیش از گرد کردن
const monthly = (initialNumber + extra) / selectedTerm;
// گرد کردن رو به بالا به مضرب ۵۰٬۰۰۰ تومان
const roundedMonthly = Math.ceil(monthly / 50000) * 50000;
// نمایش مبلغ نهایی
resultInput.value =
formatNumber(roundedMonthly) + ' تومان';
}
termButtons.forEach(button => {
button.addEventListener('click', function () {
selectedTerm = Number(this.dataset.term);
termButtons.forEach(btn => {
const active = btn === this;
btn.classList.toggle('active', active);
btn.setAttribute('aria-pressed', String(active));
});
calculate();
});
});
ratioButtons.forEach(button => {
button.addEventListener('click', function () {
selectedRatio = Number(this.dataset.ratio);
ratioButtons.forEach(btn => {
const active = btn === this;
btn.classList.toggle('active', active);
btn.setAttribute('aria-pressed', String(active));
});
calculate();
});
});
priceInput.addEventListener('input', calculate);
calculateBtn.addEventListener('click', calculate);
calculate();
})();
محاسبه اقساط
مبلغ خط را وارد کنید، پیش‌پرداخت را انتخاب کنید
و مبلغ اقساط ماهیانه خود را ببینید.
مبلغ را به میلیون تومان وارد کنید.
حداقل مبلغ قابل قبول ۸۰ میلیون تومان است.
قیمت از ۸۰ میلیون تومان به بالا وارد شود.
با انتخاب هر دکمه، مبلغ پیش‌پرداخت و اقساط
به‌صورت خودکار به‌روزرسانی می‌شوند.
محاسبه بر اساس پیش‌پرداخت انتخابی، ۱۰٪ کارمزد
و ۴٪ به ازای هر قسط انجام می‌شود.
مبلغ قسط به بالا و با گام‌های ۵۰ هزار تومان گرد می‌شود.
