/* ============================================================
   AsFin custom overrides (NobleUI)
   ============================================================ */

/* Kartu panduan pengisian: kanan di desktop/tablet, atas di mobile */
.asfin-guide-card { border-radius: .75rem; }
.asfin-guide-card .card-header { background: transparent; border-bottom: 1px solid var(--asfin-line, rgba(128,128,128,.15)); }
.asfin-guide-card .card-header h6 { font-size: .9rem; color: var(--asfin-brand, #212C5F); }
.asfin-guide-card .accordion-button { font-size: .84rem; padding: .55rem .25rem; background: transparent; box-shadow: none; }
.asfin-guide-card .accordion-button:not(.collapsed) { color: var(--asfin-brand, #212C5F); background-color: transparent; box-shadow: none; }
.asfin-guide-card .accordion-button:focus { box-shadow: none; }
.asfin-guide-card .accordion-body { font-size: .82rem; color: var(--asfin-text-muted, #6c757d); padding: .5rem .25rem .75rem; }
.asfin-guide-card .accordion-item { border: 0; border-bottom: 1px solid var(--asfin-line, rgba(128,128,128,.15)); }
.asfin-guide-card .accordion-item:last-child { border-bottom: 0; }
.asfin-guide-card [data-guide-chevron] { transition: transform .2s ease; }
.asfin-guide-card .card-header button[aria-expanded="false"] [data-guide-chevron] { transform: rotate(180deg); }

/* Desktop/tablet: kartu menempel di kanan saat konten di-scroll */
@media (min-width: 768px) {
  .asfin-guide-card { position: sticky; top: 1rem; }
  .asfin-guide-card .card-body { max-height: calc(100vh - 11rem); overflow-y: auto; }
}

/* Konsistensi dropdown topbar */
.navbar .navbar-content .navbar-nav .dropdown-menu { min-width: 220px; }
.icon-sm { width: 16px; height: 16px; }

/* KPI card default agar rapi tanpa data */
.kpi-empty { font-style: italic; color: var(--asfin-text-faint, #adb5bd); }

/* Logo AsFin di sidebar */
.sidebar .sidebar-brand .sidebar-logo {
  height: 32px;
  width: auto;
  max-width: 130px;
  object-fit: contain;
}
.sidebar-brand { padding: 1.25rem 1rem 1rem; line-height: 1; }

/* Ikon tema */
[data-theme-toggle] { display: inline-flex; align-items: center; justify-content: center; }
[data-theme-toggle] i { width: 18px; height: 18px; }

/* ============================================================
   App shell — footer selalu menempel di dasar layar
   .page-wrapper : tinggi tepat 1 viewport, tidak ikut scroll
   .page-content : area yang scroll sendiri (konten utama)
   .footer       : flex item terakhir, selalu di dasar layar
   ============================================================ */
.main-wrapper .page-wrapper {
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  overflow: hidden;
}
.main-wrapper .page-wrapper > .page-content {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.main-wrapper .page-wrapper > .footer {
  flex: 0 0 auto;
  padding: .6rem 1.5rem;
  font-size: .82rem;
  line-height: 1.4;
}
@media (max-width: 767px) {
  .main-wrapper .page-wrapper > .footer {
    padding: .55rem 1rem;
    font-size: .78rem;
  }
}

/* ============================================================
   Tabel data responsif (mobile)
   .page-content memakai overflow-x: hidden sehingga tabel yang
   tidak dibungkus .table-responsive sebelumnya terpotong dan
   kolom angka (debet/kredit/saldo) tidak terlihat. Di layar
   kecil tabel dibuat bisa digeser horizontal.
   ============================================================ */
@media (max-width: 767px) {
  .main-wrapper .page-wrapper > .page-content table.table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }
  .main-wrapper .page-wrapper > .page-content table.table > tbody > tr > td,
  .main-wrapper .page-wrapper > .page-content table.table > tbody > tr > th {
    vertical-align: middle;
  }
}