:root{
  --primary:#0d6efd;
  --glow:#4dd0ff;
}
body{ font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.brand-logo{ width:44px; height:44px; object-fit:contain; border-radius:12px; background:#fff; padding:4px; }
.placeholder-logo{ width:44px; height:44px; border-radius:12px; background:linear-gradient(135deg, rgba(255,255,255,.25), rgba(255,255,255,.05)); border:1px solid rgba(255,255,255,.2); }
.brand-title{ line-height:1.1; }
.brand-subtitle{ line-height:1.1; }

.btn-glow{
  color:#fff;
  border:1px solid rgba(255,255,255,.25);
  background:linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.06));
  box-shadow: 0 0 0 rgba(0,0,0,0);
  position:relative;
  overflow:hidden;
  border-radius:14px;
  padding:.45rem .9rem;
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.btn-glow:hover{
  transform: translateY(-1px);
  box-shadow: 0 0 18px rgba(77,208,255,.35), 0 0 36px rgba(13,110,253,.18);
  filter:brightness(1.15);
}
.btn-glow:active{
  transform: translateY(0);
  box-shadow: 0 0 22px rgba(77,208,255,.5), 0 0 44px rgba(13,110,253,.25);
}
.btn-glow-outline{
  color:var(--primary);
  border:1px solid rgba(77,208,255,.55);
  background:transparent;
  border-radius:14px;
  padding:.45rem .9rem;
  box-shadow: 0 0 18px rgba(77,208,255,.18);
}
.btn-glow-outline:hover{filter:brightness(1.15); box-shadow: 0 0 22px rgba(77,208,255,.3); background:rgba(13,110,253,.08); }

.card{
  border:1px solid rgba(0,0,0,.06);
  border-radius:20px;
  overflow:hidden;
}
.card .card-header{
  background:linear-gradient(90deg, rgba(13,110,253,.08), rgba(77,208,255,.08));
  border-bottom:1px solid rgba(0,0,0,.06);
}
.post-cover{
  width:100%;
  max-height:360px;
  object-fit:cover;
  border-radius:18px;
}
.badge-soft{
  background:rgba(13,110,253,.12);
  color:#0d6efd;
  border:1px solid rgba(13,110,253,.2);
}
.ad-box{
  border-radius:18px;
  border:1px dashed rgba(0,0,0,.15);
  background:#fff;
  overflow:hidden;
}
.ad-box img{ width:100%; height:auto; display:block; }
.table thead th{ white-space:nowrap; }


/* Sticky footer layout */
html, body { height: 100%; }
body{
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main{ flex: 1 0 auto; }
footer{ margin-top: auto; }

/* Active menu glow + blink (public) */
.btn-glow-active{
  position: relative;
  box-shadow: 0 0 18px rgba(77,208,255,.35), 0 0 34px rgba(13,110,253,.18);
  animation: pdiGlowBlink 1.2s infinite alternate;
}
@keyframes pdiGlowBlink{
  from{ filter: brightness(1.00); box-shadow: 0 0 10px rgba(77,208,255,.28), 0 0 22px rgba(13,110,253,.12); }
  to{ filter: brightness(1.18); box-shadow: 0 0 22px rgba(77,208,255,.55), 0 0 44px rgba(13,110,253,.22); }
}

/* Active state for mobile dropdown links */
.mobile-menu-link.active{
  background: rgba(77,208,255,.14);
  border-left: 4px solid rgba(77,208,255,.8);
}


/* --- Layout: footer selalu di bawah --- */
html, body { height: 100%; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
main { flex: 1 0 auto; }
footer { margin-top: auto; }

/* --- Finance public: warna baris transaksi lebih terlihat --- */
.table tbody tr.trx-row.trx-in > td{
  background: rgba(25,135,84,.14) !important; /* hijau muda */
}
.table tbody tr.trx-row.trx-out > td{
  background: rgba(220,53,69,.14) !important; /* merah muda */
}
.table tbody tr.trx-row.trx-in td:first-child{
  border-left: 4px solid rgba(25,135,84,.75) !important;
}
.table tbody tr.trx-row.trx-out td:first-child{
  border-left: 4px solid rgba(220,53,69,.75) !important;
}


/* SUMMARY COLORS */
.summary-box:nth-child(1){background:#2ecc71 !important;color:#fff;}
.summary-box:nth-child(2){background:#e74c3c !important;color:#fff;}
.summary-box:nth-child(3){background:#3498db !important;color:#fff;}

/* ROW COLORS */
tr.row-in{background:#e8f8f0 !important;}
tr.row-out{background:#fdecea !important;}


/* ===== Finance Dashboard (Public) - bank style ===== */
.finance-dashboard .kpi-card{
  position: relative;
  display:flex;
  gap:14px;
  align-items:center;
  padding:16px 16px;
  border-radius: 18px;
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
  border: 1px solid rgba(255,255,255,.18);
  overflow:hidden;
  min-height: 92px;
}
.finance-dashboard .kpi-card:before{
  content:"";
  position:absolute;
  inset:-40px -60px auto auto;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
  filter: blur(0px);
  transform: rotate(18deg);
}
.finance-dashboard .kpi-icon{
  width:44px;
  height:44px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.18);
  color: #fff;
  flex: 0 0 auto;
}
.finance-dashboard .kpi-meta{ position: relative; z-index: 1; }
.finance-dashboard .kpi-label{
  font-size: 12px;
  letter-spacing: .3px;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  margin-bottom: 2px;
}
.finance-dashboard .kpi-value{
  font-size: 22px;
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  text-shadow: 0 1px 0 rgba(0,0,0,.18);
}
.finance-dashboard .kpi-sub{
  font-size: 12px;
  color: rgba(255,255,255,.75);
  margin-top: 4px;
}

/* gradients */
.finance-dashboard .kpi-in{ background: linear-gradient(135deg, #148a4a, #2ecc71); }
.finance-dashboard .kpi-out{ background: linear-gradient(135deg, #b81d2c, #ff5c6b); }
.finance-dashboard .kpi-balance{ background: linear-gradient(135deg, #0d47a1, #42a5f5); }

/* table styling */
.finance-table thead th{
  font-weight: 700;
  color: #0b1b2b;
  border-bottom: 1px solid rgba(0,0,0,.08) !important;
}
.finance-table tbody tr{
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.finance-table tbody tr:hover{
  filter: brightness(0.99);
}
.badge.badge-in{
  background: rgba(20,138,74,.12) !important;
  color: #0f6b3a !important;
  border: 1px solid rgba(20,138,74,.25) !important;
}
.badge.badge-out{
  background: rgba(184,29,44,.12) !important;
  color: #9b1a28 !important;
  border: 1px solid rgba(184,29,44,.25) !important;
}
.badge .badge-ico{
  display:inline-block;
  font-weight:900;
  margin-right:6px;
}

/* row highlight full width (keep from earlier patch, but stronger) */
.table .trx-row.trx-in{ background: rgba(20,138,74,.10) !important; }
.table .trx-row.trx-out{ background: rgba(184,29,44,.10) !important; }
.table .trx-row.trx-in td:first-child{ border-left: 4px solid rgba(20,138,74,.55); }
.table .trx-row.trx-out td:first-child{ border-left: 4px solid rgba(184,29,44,.55); }


/* === FORCE KPI COLORS (Total Masuk/Keluar/Kas) === */
.finance-dashboard .kpi-card.kpi-solid{
  color:#fff !important;
}
.finance-dashboard .kpi-card.kpi-solid *{
  color: inherit !important;
}
.finance-dashboard .kpi-card.kpi-in.kpi-solid{
  background: linear-gradient(135deg, #148a4a, #2ecc71) !important;
}
.finance-dashboard .kpi-card.kpi-out.kpi-solid{
  background: linear-gradient(135deg, #b81d2c, #ff5c6b) !important;
}
.finance-dashboard .kpi-card.kpi-balance.kpi-solid{
  background: linear-gradient(135deg, #0d47a1, #42a5f5) !important;
}

/* ===== FINANCE PUBLIC RESTYLE ===== */
.finance-public-card .card-header{
  background: linear-gradient(180deg,#eef7ff,#edf5fb);
}
.finance-kpi{
  position:relative;
  border-radius:22px;
  padding:22px 22px 18px;
  color:#fff;
  overflow:hidden;
  min-height:170px;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}
.finance-kpi:before{
  content:'';
  position:absolute;
  inset:auto -30px -40px auto;
  width:120px;
  height:120px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
}
.finance-kpi-in{
  background:linear-gradient(135deg,#13824a,#2ecc71);
}
.finance-kpi-out{
  background:linear-gradient(135deg,#c62828,#ff5f6d);
}
.finance-kpi-balance{
  background:linear-gradient(135deg,#0d47a1,#42a5f5);
}
.finance-kpi-icon{
  font-size:1.45rem;
  font-weight:800;
  margin-bottom:.5rem;
  opacity:.95;
}
.finance-kpi-label{
  font-size:1.05rem;
  opacity:.95;
}
.finance-kpi-value{
  font-size:2rem;
  font-weight:800;
  line-height:1.15;
  margin:.25rem 0 .35rem;
}
.finance-kpi-sub{
  color:rgba(255,255,255,.88);
}
.finance-table{
  border-collapse:separate;
  border-spacing:0 10px;
}
.finance-table thead th{
  border:0;
  color:#12263a;
  background:transparent;
}
.finance-table tbody td{
  border-top:0;
  border-bottom:0;
  vertical-align:middle;
  background:#fff;
}
.finance-table tbody tr td:first-child{
  border-top-left-radius:14px;
  border-bottom-left-radius:14px;
}
.finance-table tbody tr td:last-child{
  border-top-right-radius:14px;
  border-bottom-right-radius:14px;
}
.finance-table tbody tr.trx-in td{
  background:#eaf8ef;
}
.finance-table tbody tr.trx-out td{
  background:#fdeeee;
}
.finance-table tbody tr.trx-in td:first-child{
  box-shadow: inset 4px 0 0 #198754;
}
.finance-table tbody tr.trx-out td:first-child{
  box-shadow: inset 4px 0 0 #dc3545;
}

@media (max-width: 767.98px){
  .finance-kpi{
    min-height:unset;
    padding:18px;
  }
  .finance-kpi-value{
    font-size:1.55rem;
  }
}