/* SUMMARY */

.summary-card{
  border:none;
  border-radius:24px;
  background:white;
  padding:30px;
  box-shadow:0 5px 20px rgba(0,0,0,.05);
  height:100%;
  transition:.3s;
}

.summary-card:hover{
  transform:translateY(-5px);
}

.summary-icon{
  width:70px;
  height:70px;
  border-radius:20px;
  background:rgba(253,128,46,.15);
  color:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:30px;
  margin-bottom:20px;
}

.summary-value{
  font-size:2rem;
  font-weight:800;
  color:var(--secondary);
}

.summary-label{
  color:#6c757d;
  margin-top:8px;
}

/* TABLE */

.budget-card{
  border:none;
  border-radius:24px;
  background:white;
  padding:30px;
  box-shadow:0 5px 20px rgba(0,0,0,.05);
}

.table thead{
  background:var(--secondary);
  color:white;
}

.table td{
  vertical-align:middle;
}

.table tfoot{
  background:#f8fafc;
}

.table tbody tr:hover{
  background:#fffaf5;
}

.badge-status{
  background:rgba(40,167,69,.15);
  color:#28a745;
  padding:8px 14px;
  border-radius:50px;
  font-size:.8rem;
  font-weight:600;
}

/* CHART */

.chart-card{
  border:none;
  border-radius:24px;
  background:white;
  padding:30px;
  box-shadow:0 5px 20px rgba(0,0,0,.05);
  height:100%;
}

.chart-title{
  font-weight:700;
  color:var(--secondary);
  margin-bottom:25px;
}

/* INFO */

.info-box{
  border:none;
  border-radius:24px;
  background:white;
  padding:30px;
  box-shadow:0 5px 20px rgba(0,0,0,.05);
  height:100%;
}

.info-icon{
  width:65px;
  height:65px;
  border-radius:18px;
  background:rgba(253,128,46,.15);
  color:var(--primary);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  margin-bottom:20px;
}

/* REALISASI */

.progress{
  border-radius:50px;
  background:#edf2f7;
}

.progress-bar{
  border-radius:50px;
}

/* MOBILE */

@media(max-width:768px){

  .summary-value{
    font-size:1.6rem;
  }

}