/* ==========================================================================
   installment-calculator.css — প্রোডাক্ট পেজের "কিস্তি ক্যালকুলেটর" সেকশন
   --------------------------------------------------------------------------
   ProductSinglePage.php-এর বিদ্যমান CSS ভ্যারিয়েবল (--brand, --ink, --line,
   --paper, --accent-red, --bg ইত্যাদি) ব্যবহার করা হয়েছে, যাতে থিমের সাথে
   পুরোপুরি মিলে যায়। এই ফাইলে নতুন কোনো রং হার্ডকোড করা হয়নি।
   ========================================================================== */

.psp-emi-months{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.psp-emi-btn{
  flex:1 1 auto;
  min-width:64px;
  padding:9px 14px;
  border:1.5px solid var(--line);
  border-radius:8px;
  background:var(--paper);
  font-size:13.5px;
  font-weight:600;
  color:var(--ink);
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}

.psp-emi-btn:hover{
  border-color:var(--brand);
}

.psp-emi-btn.active{
  background:var(--brand);
  border-color:var(--brand);
  color:#fff;
}

.psp-emi-result{
  background:var(--bg);
  border:1px dashed var(--line);
  border-radius:10px;
  padding:14px 16px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.psp-emi-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.psp-emi-label{
  font-size:13px;
  color:var(--ink-soft);
}

.psp-emi-monthly{
  font-size:20px;
  font-weight:700;
  color:var(--accent-red);
}

.psp-emi-total{
  font-size:14px;
  font-weight:600;
  color:var(--ink);
}

.psp-emi-note{
  margin-top:10px;
  font-size:11.5px;
  color:var(--ink-soft);
  line-height:1.5;
}

/* বিদ্যমান মোবাইল ব্রেকপয়েন্টের সাথে সামঞ্জস্যপূর্ণ (দেখুন ProductSinglePage.php-এর
   @media (max-width:600px) এবং @media (max-width:480px) ব্লক) */
@media (max-width:600px){
  .psp-emi-btn{ font-size:13px; padding:8px 12px; }
}

@media (max-width:480px){
  .psp-emi-btn{ min-width:56px; padding:8px 10px; font-size:12.5px; }
  .psp-emi-monthly{ font-size:18px; }
  .psp-emi-result{ padding:12px 14px; }
}
