/* ==========================================================
   InventyHub v6.6.12 — One Sidebar Button: Peminjaman Berjalan
   ========================================================== */

.running-loans-hero{
  margin-bottom:16px;
  padding:23px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border:1px solid var(--line);
  border-radius:21px;
  background:
    radial-gradient(circle at 88% 15%,rgba(153,31,42,.09),transparent 15rem),
    linear-gradient(135deg,#fff,#fbf7f5);
  box-shadow:var(--shadow-sm);
}

.running-loans-hero h3{
  margin:4px 0 6px;
  font-size:clamp(23px,3vw,32px);
}

.running-loans-hero p{
  margin:0;
  max-width:760px;
  color:var(--ink-500);
  line-height:1.6;
}

.running-loans-total{
  min-width:125px;
  padding:14px 18px;
  display:grid;
  justify-items:center;
  gap:3px;
  border:1px solid #ead6d3;
  border-radius:16px;
  background:rgba(255,255,255,.84);
}

.running-loans-total strong{
  color:var(--brand-700);
  font-size:30px;
  line-height:1;
}

.running-loans-total span{
  color:var(--ink-400);
  font-size:8px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.running-category-tabs{
  margin:0 0 14px;
  padding:5px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#f7f3f1;
}

.running-category-tab{
  min-width:0;
  min-height:44px;
  padding:7px 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid transparent;
  border-radius:10px;
  background:transparent;
  color:var(--ink-500);
  cursor:pointer;
}

.running-category-tab span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9px;
  font-weight:800;
}

.running-category-tab b{
  min-width:23px;
  height:23px;
  padding:0 6px;
  display:grid;
  place-content:center;
  border-radius:999px;
  background:#e8dfdc;
  color:var(--ink-600);
  font-size:8px;
}

.running-category-tab.active{
  border-color:#e3cdca;
  background:#fff;
  color:var(--brand-700);
  box-shadow:0 4px 13px rgba(50,25,25,.06);
}

.running-category-tab.active b{
  color:#fff;
  background:var(--brand-700);
}

.running-loans-meta{
  margin-bottom:12px;
  padding:9px 2px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid var(--line);
}

.running-loans-meta>div{
  display:grid;
  gap:2px;
}

.running-loans-meta>div>b{
  font-size:10px;
}

@media(max-width:760px){
  .running-loans-hero{
    align-items:flex-start;
    flex-direction:column;
  }

  .running-loans-total{
    width:100%;
    grid-template-columns:auto auto;
    justify-content:center;
    align-items:center;
    gap:8px;
  }

  .running-category-tabs{
    grid-template-columns:1fr;
  }

  .running-category-tab{
    justify-content:space-between;
  }

  .running-loans-meta{
    align-items:flex-start;
    flex-direction:column;
  }
}