:root{
  --tw-slate-50:#f8fafc;
  --tw-slate-100:#f1f5f9;
  --tw-slate-200:#e2e8f0;
  --tw-slate-300:#cbd5e1;
  --tw-slate-600:#475569;
  --tw-slate-700:#334155;
  --tw-slate-900:#0f172a;

  --tw-white:#ffffff;

  --tw-primary:#16a34a;
  --tw-primary-700:#15803d;
  --tw-ring:rgba(22,163,74,.25);

  --tw-radius:16px;
  --tw-radius-sm:12px;

  --tw-shadow-sm: 0 6px 14px rgba(2,6,23,.08);
}

    .ev-installment{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
    .ev-installment *{box-sizing:border-box}
    .ev-installment h2{margin:0}
    .ev-installment p{margin:0}

    .ev-installment{
      padding:48px 0;
      
    }
    .ev-wrap{max-width:1100px;margin:0 auto;padding:0 16px}
    .ev-head{margin-bottom:18px}
    .ev-head h2{font-size:28px;line-height:1.2;font-weight:800;color:var(--tw-slate-900)}
    .ev-head p{margin-top:8px;color:var(--tw-slate-600)}

    .ev-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px;align-items:start}
    @media (max-width:900px){.ev-grid{grid-template-columns:1fr}}

    .ev-form,.ev-card{
      background:var(--tw-white);
      border:1px solid var(--tw-slate-200);
      border-radius:var(--tw-radius);
      box-shadow: var(--tw-shadow-sm);
    }

    .ev-form{padding:16px}
    .ev-row{margin-bottom:14px}
    label{display:block;font-weight:700;margin:0 0 6px;color:var(--tw-slate-900);font-size:14px}

    .product  input,.product  select{
      border-radius: 12px !important;
      border: 1px solid var(--tw-slate-300) !important;
      background: var(--tw-white) !important;
      color: var(--tw-slate-900) !important;
      outline: none;
      transition: box-shadow .15s, border-color .15s, transform .08s !important;
      min-height: 55px;
    }
    .product  input::placeholder{color:rgba(51,65,85,.55)}
    .product  input:focus,.product  select:focus{
      border-color: rgba(22,163,74,.55);
      box-shadow: 0 0 0 4px var(--tw-ring);
    }
    .ev-hint{display:block;margin-top:6px;color:var(--tw-slate-600);font-size:12px}

    .ev-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    @media (max-width:520px){.ev-2col{grid-template-columns:1fr}}

    .ev-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}

    .ev-btn{
      display:inline-flex;
      justify-content:center;
      padding: 0px 14px;
      border-radius: 10px;
      border:1px solid transparent;
      cursor:pointer;
      font-weight: 500;
      text-decoration:none;
      transition: transform .08s, box-shadow .15s, background .15s, border-color .15s, opacity .15s;
      user-select:none;
      white-space:nowrap;
      min-height: 56px;
      align-items: center;
      min-width: 120px;
      text-transform: capitalize;
    }
    .ev-btn:active{transform: translateY(1px)}
    .ev-btn{
      background:var(--tw-primary);
      color:var(--tw-white);
    }
    .ev-btn:hover{background:var(--tw-primary-700)}
    .ev-btn:focus{outline:none;box-shadow:0 0 0 4px var(--tw-ring)}

    .ev-btn-ghost{
      background:var(--tw-white);
      color:var(--tw-slate-900);
      border-color:var(--tw-slate-300);
    }
    .ev-btn-ghost:hover{background:var(--tw-slate-50)}

    .ev-note{
      margin-top:12px;
      padding:12px;
      border-radius:14px;
      background:var(--tw-slate-50);
      border:1px solid var(--tw-slate-200);
      color:var(--tw-slate-700);
      font-size:13px;
      line-height:1.5;
    }

    .ev-result .ev-card{padding:16px}
    .ev-card-title{font-weight:900;font-size:14px;color:var(--tw-slate-900);margin-bottom:10px}

    .ev-kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .ev-kpi{
      padding:12px;
      border-radius:14px;
      border:1px solid var(--tw-slate-200);
      background:var(--tw-white);
    }
    .ev-kpi-label{font-size:12px;color:var(--tw-slate-600)}
    .ev-kpi-value{font-size:18px;font-weight:900;margin-top:6px;color:var(--tw-slate-900)}
    .ev-kpi:nth-child(2) .ev-kpi-value{color: #dc0000;}

    .ev-divider{height:1px;background:var(--tw-slate-200);margin:14px 0}

    .ev-mini{display:grid;gap:6px;font-size:13px;color:var(--tw-slate-700)}
    .ev-mini span{color:var(--tw-slate-600)}

    .ev-table-wrap{margin-top:8px}
    .ev-table-title{font-weight:900;margin-bottom:8px;color:var(--tw-slate-900)}
    .ev-table{
      width:100%;
      border-collapse:separate;
      border-spacing:0;
      border-radius:14px;
      border:1px solid var(--tw-slate-200);
      overflow:hidden;
    }
    .ev-table thead th{
      background:var(--tw-slate-50);
      font-size:12px;
      letter-spacing:.02em;
      text-transform:uppercase;
      color:var(--tw-slate-600);
    }
    .ev-table th,.ev-table td{
      padding:10px;
      border-bottom:1px solid var(--tw-slate-200);
      text-align:right;
    }
    .ev-table th:first-child,.ev-table td:first-child{text-align:left}
    .ev-table tbody tr:last-child td{border-bottom:0}
    .ev-table tbody tr:hover td{background:rgba(241,245,249,.65)}
    .ev-empty{text-align:center;color:var(--tw-slate-600)}

    .ev-cta{margin-top:14px;display: flex;gap: 10px;}
    .ev-cta .ev-btn{width:100%}
    .ev-cta .ev-btn:hoveR{
      color: #fff;
    }
    @media (max-width:900px){
      .ev-installment{padding:28px 0}
      .ev-head h2{font-size:24px}
    }
div#kpiTotal {
    color: var(--tw-primary);
}

div#kpiInterest {
    color: #ff9510;
}
div#kpiKyQuy {
    color: #dc0000;
}

div#kpiMonthly {
    color: #16a34a;
}
