<div class="pg-report">
  <?php
  if (!function_exists('indo_fulldate')) {
    function indo_fulldate($ts) {
      if (empty($ts) || $ts === '0000-00-00' || $ts === '0000-00-00 00:00:00' || $ts === '-') return '-';
      $dayMap = ['Sunday'=>'Minggu','Monday'=>'Senin','Tuesday'=>'Selasa','Wednesday'=>'Rabu','Thursday'=>'Kamis','Friday'=>'Jumat','Saturday'=>'Sabtu'];
      $monMap = ['Jan'=>'Januari','Feb'=>'Februari','Mar'=>'Maret','Apr'=>'April','May'=>'Mei','Jun'=>'Juni','Jul'=>'Juli','Aug'=>'Agustus','Sep'=>'September','Oct'=>'Oktober','Nov'=>'November','Dec'=>'Desember'];
      $t = is_numeric($ts) ? (int)$ts : strtotime($ts);
      if (!$t) return '-';
      $d = date('l', $t);
      $j = date('d', $t);
      $M = date('M', $t);
      $Y = date('Y', $t);
      return ($dayMap[$d] ?? $d) . ', ' . (int)$j . ' ' . ($monMap[$M] ?? $M) . ' ' . $Y;
    }
  }


  if (!function_exists('indo_shortdate_lap')) {
    function indo_shortdate_lap($ts) {
      if (empty($ts) || $ts === '0000-00-00' || $ts === '0000-00-00 00:00:00' || $ts === '-') return '-';
      $monMap = ['Jan'=>'Jan','Feb'=>'Feb','Mar'=>'Mar','Apr'=>'Apr','May'=>'Mei','Jun'=>'Jun','Jul'=>'Jul','Aug'=>'Agu','Sep'=>'Sep','Oct'=>'Okt','Nov'=>'Nov','Dec'=>'Des'];
      $t = is_numeric($ts) ? (int)$ts : strtotime($ts);
      if (!$t) return '-';
      $M = date('M', $t);
      return (int)date('d', $t) . ' ' . ($monMap[$M] ?? $M) . ' ' . date('Y', $t);
    }
  }

  if (!function_exists('fmt_no_order_lap')) {
    function fmt_no_order_lap(array $v) {
      if (!empty($v['no_transaksi'])) return (string)$v['no_transaksi'];
      if (!empty($v['id_transaksi'])) {
        $ord = trim((string)$v['id_transaksi']);
        return is_numeric($ord) ? 'TRX-' . str_pad($ord, 5, '0', STR_PAD_LEFT) : $ord;
      }
      if (!empty($v['noid']) && function_exists('get_id_transaksi')) {
        $g = get_id_transaksi($v['noid']);
        if (is_array($g) && !empty($g['nomor_order'])) {
          $ord = trim((string)$g['nomor_order']);
          return is_numeric($ord) ? 'TRX-' . str_pad($ord, 5, '0', STR_PAD_LEFT) : $ord;
        }
      }
      return '-';
    }
  }

  if (!function_exists('is_tunai')) {
    function is_tunai($row, $akunName = '') {
      if (isset($row['id_sub_bayar']) && (int)$row['id_sub_bayar'] === 1) return true;
      $hay = strtolower(trim(
        ($row['nama_bayar'] ?? '') . ' ' .
        ($row['jenis_bayar'] ?? '') . ' ' .
        ($akunName ?? '')
      ));
      return (strpos($hay, 'tunai') !== false);
    }
  }

  if (!function_exists('lap_ket_text')) {
    function lap_ket_text(array $row) {
      foreach (['keterangan','ket','keterangan_kas','uraian','catatan','deskripsi'] as $key) {
        if (isset($row[$key]) && $row[$key] !== '') return (string)$row[$key];
      }
      return '-';
    }
  }

  $total_masuk_tunai = 0;
  $total_masuk_transfer = 0;
  $total_keluar = 0;
  $total_beli = 0;
  $total_keluar_tunai = 0;
  $total_beli_tunai = 0;
  $penjualan_tunai = [];
  $penjualan_transfer = [];

  if (!empty($result['masuk'])) {
    foreach ($result['masuk'] as $val) {
      $bayar = $this->model_app->cara_bayar(['bid.id_invoice' => ($val['noid'] ?? null)]);
      $akunNama = '';
      if (!empty($val['id_sub_bayar'])) {
        $akunNama = (string)(getAkun($val['id_sub_bayar']) ?? '');
      } elseif (!empty($bayar->nama_bayar)) {
        $akunNama = (string)$bayar->nama_bayar;
      }

      $isTunai = is_tunai($val + ['nama_bayar' => $bayar->nama_bayar ?? ''], $akunNama);
      $jml = (float)($val['jml_bayar'] ?? 0);

      if ($isTunai) {
        $total_masuk_tunai += $jml;
        $penjualan_tunai[] = ['val' => $val, 'bayar' => $bayar, 'akunNama' => $akunNama];
      } else {
        $total_masuk_transfer += $jml;
        $penjualan_transfer[] = ['val' => $val, 'bayar' => $bayar, 'akunNama' => $akunNama];
      }
    }
  }

  if (!empty($result['keluar'])) {
    foreach ($result['keluar'] as $val) {
      $j = (float)($val['jml_bayar'] ?? 0);
      $total_keluar += $j;
      $akunNama = isset($val['id_bayar']) ? (string)(getAkun($val['id_bayar']) ?? '') : '';
      if (is_tunai($val, $akunNama)) $total_keluar_tunai += $j;
    }
  }

  if (!empty($result['beli'])) {
    foreach ($result['beli'] as $val) {
      $j = (float)($val['jml_bayar'] ?? 0);
      $total_beli += $j;
      $akunNama = isset($val['id_bayar']) ? (string)(getAkun($val['id_bayar']) ?? '') : '';
      if (is_tunai($val, $akunNama)) $total_beli_tunai += $j;
    }
  }

  $total_masuk = $total_masuk_tunai + $total_masuk_transfer;
  $total_keluar_semua = $total_keluar + $total_beli;
  $saldo_keseluruhan = $total_masuk - $total_keluar_semua;
  $saldo_tunai = $total_masuk_tunai - ($total_keluar_tunai + $total_beli_tunai);
  $saldo_class = $saldo_keseluruhan < 0 ? 'is-danger' : 'is-success';
  ?>

  <style>
    .pg-report{
      color:#1f2937;
      font-size:14px;
    }
    /* =========================================================
       KPI FINAL CLEAN
       Satu-satunya style KPI: tidak ada patch KPI lama/bertumpuk.
    ========================================================= */
    .pg-kpi-grid{
      display:grid;
      grid-template-columns:repeat(6,minmax(0,1fr));
      gap:14px;
      margin:18px 0 16px;
      align-items:stretch;
    }
    .pg-kpi-card{
      position:relative;
      min-height:148px;
      height:100%;
      padding:16px 14px 14px;
      border-radius:12px;
      overflow:hidden;
      color:#fff;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      text-align:center;
      box-shadow:0 8px 18px rgba(15,23,42,.12);
      isolation:isolate;
    }
    .pg-kpi-card:before{
      content:'';
      position:absolute;
      inset:0;
      background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,0));
      pointer-events:none;
      z-index:0;
    }
    .pg-kpi-card > *{
      position:relative;
      z-index:1;
    }
    .pg-kpi-card .pg-kpi-icon{
      position:absolute;
      left:14px;
      top:14px;
      transform:none;
      font-size:26px;
      line-height:1;
      color:rgba(255,255,255,.24);
      pointer-events:none;
    }
    .pg-kpi-card small{
      display:-webkit-box;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:3;
      width:100%;
      max-width:84%;
      min-height:40px;
      margin:0 auto 8px;
      overflow:hidden;
      font-size:11px;
      line-height:1.22;
      font-weight:800;
      letter-spacing:0;
      text-transform:uppercase;
      text-align:center;
      color:rgba(255,255,255,.96);
    }
    .pg-kpi-card .val{
      width:100%;
      margin:0;
      font-size:18.5px;
      line-height:1.08;
      font-weight:800;
      letter-spacing:0;
      white-space:nowrap;
      text-align:center;
      font-variant-numeric:tabular-nums;
    }
    .pg-kpi-card .val:after{
      content:'';
      display:block;
      width:90%;
      margin:8px auto 0;
      border-top:1px dashed rgba(255,255,255,.42);
    }
    .pg-kpi-card .pg-sub{
      display:-webkit-box;
      -webkit-box-orient:vertical;
      -webkit-line-clamp:3;
      width:100%;
      max-width:86%;
      min-height:34px;
      margin:7px auto 0;
      overflow:hidden;
      font-size:10.2px;
      line-height:1.28;
      font-weight:500;
      text-align:center;
      color:rgba(255,255,255,.96);
      white-space:normal;
      word-break:break-word;
      overflow-wrap:anywhere;
    }
    .pg-kpi-purple{ background:linear-gradient(135deg,#7253db,#533fd8); }
    .pg-kpi-indigo{ background:linear-gradient(135deg,#5968e8,#2f5dde); }
    .pg-kpi-blue{ background:linear-gradient(135deg,#2589ef,#0870d8); }
    .pg-kpi-cyan{ background:linear-gradient(135deg,#18b6c5,#0aa1b0); }
    .pg-kpi-green{ background:linear-gradient(135deg,#39c86f,#18a95f); }
    .pg-kpi-red{ background:linear-gradient(135deg,#ff6d70,#ef3f4b); }
    .pg-kpi-orange{ background:linear-gradient(135deg,#ff9d17,#ff8508); }

    .pg-section-tabs{
      display:flex;
      gap:28px;
      border-bottom:1px solid #e5e7eb;
      margin-bottom:12px;
      padding-left:12px;
    }
    .pg-section-tab{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:0 0 12px;
      border:0;
      background:transparent;
      color:#94a3b8;
      font-weight:800;
      white-space:nowrap;
    }
    .pg-section-tab.active{
      color:#1769e8;
      border-bottom:2px solid #1769e8;
      margin-bottom:-1px;
    }
    .pg-section-card{
      background:#fff;
      border:1px solid #e5e7eb;
      border-radius:8px;
      overflow:hidden;
      box-shadow:0 4px 14px rgba(15,23,42,.05);
      margin-bottom:14px;
    }
    .pg-report-grid{
      display:block;
    }
    .pg-section-heading{
      display:inline-flex;
      align-items:center;
      gap:7px;
      height:34px;
      padding:0 14px;
      border-right:1px solid #e5e7eb;
      border-bottom:1px solid #e5e7eb;
      border-radius:0 0 8px 0;
      color:#1769e8;
      background:#fff;
      font-weight:800;
    }
    .pg-section-heading .fa{ font-size:12px; }
    .pg-table-wrap{
      padding:0 10px 10px;
      overflow-x:auto;
    }
    .pg-table{
      width:100%;
      margin:0;
      border-collapse:collapse!important;
      table-layout:fixed;
      color:#334155;
      font-size:13px;
      background:#fff;
    }
    .pg-table th,
    .pg-table td{
      padding:8px 10px!important;
      border:1px solid #e5e7eb!important;
      vertical-align:middle!important;
      line-height:1.25;
      font-variant-numeric:tabular-nums;
    }
    .pg-table thead th{
      background:#f8fafc!important;
      color:#1f2937!important;
      font-size:12px;
      font-weight:800;
      white-space:nowrap;
    }
    .pg-table tbody tr:hover{ background:#f8fafc; }
    .cell-right{ text-align:right; }
    .cell-left{ text-align:left; }
    .cell-center{ text-align:center; }
    .cell-id,
    .nowrap{ white-space:nowrap!important; }
    .pg-table .cell-right,
    .pg-table .cell-center{ white-space:nowrap; }
    .pg-col-no{ width:4%; }
    .pg-col-order{ width:10%; }
    .pg-col-name{ width:10%; }
    .pg-col-date{ width:15%; }
    .pg-col-user{ width:11%; }
    .pg-col-pay{ width:22%; }
    .pg-col-in{ width:8%; }
    .pg-col-out{ width:5%; }
    .pg-col-date-detail{ width:17%; }
    .pg-col-user-detail{ width:12%; }
    .pg-col-pay-detail{ width:24%; }
    .pg-col-note{ width:18%; }
    .pg-col-in-detail{ width:7%; }
    .pg-col-out-detail{ width:8%; }
    .pay-link a{
      color:#2563eb;
      text-decoration:underline;
      text-underline-offset:2px;
    }
    .pg-total-row th,
    .pg-total-row td{
      background:#f8fafc!important;
      color:#334155;
      font-weight:800;
    }
    .pg-summary-card{
      margin-top:0;
    }
    .pg-summary-strip{
      display:grid;
      grid-template-columns:repeat(8,minmax(0,1fr));
      border-top:1px solid #e5e7eb;
      overflow:hidden;
      background:#fff;
      margin-top:0;
    }
    .pg-summary-item{
      min-height:88px;
      padding:17px 14px;
      text-align:center;
      border-right:1px solid #e5e7eb;
      display:flex;
      flex-direction:column;
      justify-content:center;
      gap:8px;
    }
    .pg-summary-item:last-child{ border-right:0; }
    .pg-summary-item small{
      color:#475569;
      font-weight:800;
      line-height:1.25;
    }
    .pg-summary-item strong{
      color:#111827;
      font-size:20px;
      line-height:1.1;
      font-weight:800;
    }
    .pg-summary-item.is-danger{
      background:#fff1f2;
    }
    .pg-summary-item.is-danger small,
    .pg-summary-item.is-danger strong{
      color:#ef4444;
    }
    .pg-summary-item.is-success{
      background:#ecfdf5;
    }
    .pg-summary-item.is-success small,
    .pg-summary-item.is-success strong{
      color:#15803d;
    }
    .pg-empty{
      border:1px dashed #cbd5e1;
      border-radius:8px;
      padding:18px;
      text-align:center;
      color:#64748b;
      background:#f8fafc;
      font-weight:700;
    }
    /* =========================================================
       RESPONSIVE FINAL KPI + MOBILE LIST
       Section di bawah KPI dibuat konsisten, ringkas, dan tidak bertumpuk.
    ========================================================= */
    .pg-mobile-list{ display:none; }

    @media (max-width:1500px){
      .pg-kpi-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
    }

    @media (max-width:1400px){
      .pg-summary-strip{ grid-template-columns:repeat(4,minmax(0,1fr)); }
      .pg-summary-item{ border-bottom:1px solid #e5e7eb; }
    }

    @media (max-width:768px){
      .pg-report{
        font-size:12px;
        color:#172033;
      }

      .pg-kpi-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
        margin:12px 0 14px;
      }
      .pg-kpi-card{
        min-height:126px;
        padding:12px 9px 10px;
        border-radius:12px;
        box-shadow:0 5px 14px rgba(15,23,42,.10);
      }
      .pg-kpi-card .pg-kpi-icon{
        left:10px;
        top:10px;
        font-size:20px;
        color:rgba(255,255,255,.22);
      }
      .pg-kpi-card small{
        max-width:82%;
        min-height:30px;
        margin-bottom:6px;
        font-size:8.9px;
        line-height:1.16;
      }
      .pg-kpi-card .val{
        font-size:13.5px;
        line-height:1.1;
      }
      .pg-kpi-card .val:after{
        width:90%;
        margin-top:7px;
      }
      .pg-kpi-card .pg-sub{
        max-width:84%;
        min-height:28px;
        margin-top:6px;
        font-size:8.3px;
        line-height:1.22;
      }

      .pg-table-wrap,
      .pg-table,
      .table2excel,
      .table-responsive > .pg-table-wrap{
        display:none !important;
      }

      .pg-section-card{
        border:1px solid #e8edf5;
        border-radius:12px;
        margin-bottom:12px;
        overflow:hidden;
        background:#fff;
        box-shadow:0 4px 14px rgba(15,23,42,.06);
      }
      .pg-section-heading{
        width:100%;
        min-height:44px;
        display:flex;
        align-items:center;
        gap:10px;
        padding:10px 12px;
        border:0;
        border-bottom:1px solid #edf2f7;
        border-radius:0;
        background:#fff;
        font-size:14px;
        line-height:1.1;
        font-weight:800;
        letter-spacing:0;
      }
      .pg-section-heading:after{
        content:"\f106";
        font-family:FontAwesome;
        margin-left:auto;
        font-size:13px;
        color:#334155;
      }
      .pg-summary-card .pg-section-heading:after{ content:"\f107"; }
      .pg-section-heading > .fa{
        width:28px;
        height:28px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        flex:0 0 28px;
        border-radius:8px;
        color:#fff !important;
        font-size:13px;
      }
      .pg-section-tunai .pg-section-heading{ color:#6244d6; }
      .pg-section-tunai .pg-section-heading > .fa{ background:#6f45dd; }
      .pg-section-transfer .pg-section-heading{ color:#1769e8; }
      .pg-section-transfer .pg-section-heading > .fa{ background:#2f8eed; }
      .pg-section-keluar .pg-section-heading{ color:#15803d; }
      .pg-section-keluar .pg-section-heading > .fa{ background:#22a35b; }
      .pg-section-beli .pg-section-heading{ color:#f97316; }
      .pg-section-beli .pg-section-heading > .fa{ background:#f97316; }
      .pg-section-summary .pg-section-heading{ color:#1769e8; }
      .pg-section-summary .pg-section-heading > .fa{ background:#1769e8; }

      .pg-mobile-list{
        display:block !important;
        padding:0;
        background:#fff;
      }
      .pg-m-line,
      .pg-m-line-out{
        width:100%;
        max-width:100%;
        box-sizing:border-box;
        display:grid;
        align-items:center;
        column-gap:6px;
        row-gap:2px;
        padding:9px 9px;
        border-bottom:1px solid #edf2f7;
        overflow:hidden;
      }
      .pg-m-line{
        grid-template-columns:24px minmax(60px,1fr) minmax(44px,.68fr) minmax(44px,.68fr) minmax(72px,1.04fr) minmax(52px,.72fr);
      }
      .pg-m-line-out{
        grid-template-columns:24px minmax(48px,.70fr) minmax(50px,.74fr) minmax(76px,1.16fr) minmax(52px,.72fr);
        grid-template-areas:
          "no date user pay amount"
          "no date user note amount";
      }
      .pg-m-line-out .pg-m-no{ grid-area:no; }
      .pg-m-line-out .pg-m-dateblock{ grid-area:date; }
      .pg-m-line-out .pg-m-userblock{ grid-area:user; }
      .pg-m-line-out .pg-m-payblock{ grid-area:pay; }
      .pg-m-line-out .pg-m-noteblock{ grid-area:note; }
      .pg-m-line-out .pg-m-amount{ grid-area:amount; align-self:center; }

      .pg-m-no{
        width:24px;
        height:24px;
        border-radius:8px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        background:#f2edff;
        color:#6244d6;
        font-size:10.5px;
        line-height:1;
        font-weight:800;
      }
      .pg-m-block,
      .pg-m-dateblock,
      .pg-m-userblock,
      .pg-m-payblock,
      .pg-m-noteblock{
        min-width:0;
        overflow:hidden;
      }
      .pg-m-order strong,
      .pg-m-userblock strong{
        display:block;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
        color:#172033;
        font-size:10px;
        line-height:1.15;
        font-weight:800;
      }
      .pg-m-order small,
      .pg-m-userblock small,
      .pg-m-payblock small,
      .pg-m-noteblock small,
      .pg-m-dateblock small{
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:2;
        margin-top:2px;
        overflow:hidden;
        color:#64748b;
        font-size:8.2px;
        line-height:1.12;
        font-weight:700;
      }
      .pg-m-dateblock,
      .pg-m-userblock{
        position:relative;
        padding-left:12px;
      }
      .pg-m-dateblock{
        color:#26334a;
        font-size:8.9px;
        line-height:1.12;
        font-weight:800;
      }
      .pg-m-dateblock .fa,
      .pg-m-userblock .fa{
        position:absolute;
        left:0;
        top:0;
        color:#64748b;
        font-size:8.8px;
      }
      .pg-m-payblock,
      .pg-m-noteblock{
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:2;
        color:#26334a;
        font-size:8.9px;
        line-height:1.14;
        font-weight:700;
      }
      .pg-m-noteblock{
        color:#64748b;
        font-weight:600;
      }
      .pg-m-payblock a,
      .pg-m-userblock a{
        color:#1769e8;
        text-decoration:none;
        font-weight:800;
      }
      .pg-m-amount{
        justify-self:end;
        max-width:58px;
        overflow:hidden;
        text-align:right;
        text-overflow:clip;
        white-space:nowrap;
        font-size:11.1px;
        line-height:1.05;
        font-weight:900;
        letter-spacing:-.15px;
        font-variant-numeric:tabular-nums;
      }
      .pg-income{ color:#15803d; }
      .pg-transfer-income{ color:#1769e8; }
      .pg-outcome{ color:#ea580c; }

      .pg-m-total{
        min-height:40px;
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        padding:9px 12px;
        background:#f8fafc;
        border-top:1px solid #e8edf5;
        font-weight:800;
      }
      .pg-m-total span{
        min-width:0;
        color:#334155;
        font-size:12px;
        line-height:1.15;
      }
      .pg-m-total strong{
        color:#111827;
        font-size:14px;
        line-height:1.1;
        white-space:nowrap;
        font-variant-numeric:tabular-nums;
      }
      .pg-total-tunai strong{ color:#6244d6; }
      .pg-total-transfer strong{ color:#1769e8; }
      .pg-total-keluar strong{ color:#15803d; }
      .pg-total-beli strong{ color:#f97316; }

      .pg-m-empty{
        padding:14px 12px;
        text-align:center;
        color:#64748b;
        font-size:12px;
        font-weight:700;
        background:#f8fafc;
      }

      .pg-summary-strip{
        grid-template-columns:repeat(2,minmax(0,1fr));
        border-top:0;
      }
      .pg-summary-item{
        min-height:76px;
        padding:10px 8px;
        border-right:1px solid #e8edf5;
        border-bottom:1px solid #e8edf5;
      }
      .pg-summary-item small{
        color:#334155;
        font-size:8.8px;
        line-height:1.16;
        font-weight:800;
      }
      .pg-summary-item strong{
        font-size:14px;
        line-height:1.1;
        letter-spacing:0;
        font-variant-numeric:tabular-nums;
      }
    }

    @media (max-width:420px){
      .pg-kpi-grid{
        gap:9px;
      }
      .pg-kpi-card{
        min-height:122px;
        padding:11px 8px 9px;
      }
      .pg-kpi-card small{
        min-height:29px;
        font-size:8.5px;
      }
      .pg-kpi-card .val{
        font-size:13px;
      }
      .pg-kpi-card .pg-sub{
        min-height:27px;
        font-size:8px;
      }

      .pg-m-line{
        grid-template-columns:22px minmax(56px,1fr) minmax(41px,.66fr) minmax(41px,.66fr) minmax(66px,1fr) minmax(50px,.70fr);
      }
      .pg-m-line-out{
        grid-template-columns:22px minmax(44px,.68fr) minmax(46px,.70fr) minmax(70px,1.12fr) minmax(50px,.70fr);
      }
      .pg-m-line,
      .pg-m-line-out{
        column-gap:5px;
        padding:8px 7px;
      }
      .pg-m-no{
        width:22px;
        height:22px;
        font-size:10px;
      }
      .pg-m-order strong,
      .pg-m-userblock strong{
        font-size:9.5px;
      }
      .pg-m-dateblock,
      .pg-m-payblock,
      .pg-m-noteblock{
        font-size:8.4px;
      }
      .pg-m-order small,
      .pg-m-userblock small,
      .pg-m-payblock small,
      .pg-m-noteblock small,
      .pg-m-dateblock small{
        font-size:7.8px;
      }
      .pg-m-amount{
        max-width:50px;
        font-size:10.4px;
      }
      .pg-m-total span{ font-size:11.2px; }
      .pg-m-total strong{ font-size:13px; }
    }

    @media (max-width:340px){
      .pg-kpi-grid{ grid-template-columns:1fr; }
      .pg-kpi-card{
        min-height:112px;
        padding-left:12px;
        padding-right:12px;
      }
      .pg-kpi-card small,
      .pg-kpi-card .pg-sub{ max-width:100%; }

      .pg-m-line,
      .pg-m-line-out{
        grid-template-columns:22px minmax(0,1fr) minmax(52px,.72fr);
        grid-template-areas:
          "no main amount"
          "no meta amount";
      }
      .pg-m-line .pg-m-no,
      .pg-m-line-out .pg-m-no{ grid-area:no; }
      .pg-m-line .pg-m-order{ grid-area:main; }
      .pg-m-line .pg-m-dateblock:first-of-type,
      .pg-m-line-out .pg-m-dateblock{ grid-area:meta; }
      .pg-m-line .pg-m-dateblock:nth-of-type(2),
      .pg-m-line .pg-m-userblock,
      .pg-m-line-out .pg-m-userblock,
      .pg-m-line-out .pg-m-payblock,
      .pg-m-line-out .pg-m-noteblock{
        display:none;
      }
      .pg-m-line .pg-m-amount,
      .pg-m-line-out .pg-m-amount{ grid-area:amount; }
    }
    
  </style>

  <div class="pg-kpi-grid">
    <div class="pg-kpi-card pg-kpi-purple pg-kpi-simple">
      <i class="fa fa-money pg-kpi-icon"></i>
      <small>Total Pendapatan Tunai</small>
      <div class="val"><?= rp($total_masuk_tunai); ?></div>
      <div class="pg-sub">Tunai <?= rp($total_masuk_tunai); ?></div>
    </div>
    <div class="pg-kpi-card pg-kpi-indigo pg-kpi-simple">
      <i class="fa fa-exchange pg-kpi-icon"></i>
      <small>Total Pendapatan Transfer</small>
      <div class="val"><?= rp($total_masuk_transfer); ?></div>
      <div class="pg-sub">Transfer <?= rp($total_masuk_transfer); ?></div>
    </div>
    <div class="pg-kpi-card pg-kpi-blue">
      <i class="fa fa-line-chart pg-kpi-icon"></i>
      <small>Total Pendapatan (Tunai+Transfer)</small>
      <div class="val"><?= rp($total_masuk); ?></div>
      <div class="pg-sub">Tunai <?= rp($total_masuk_tunai); ?> | Transfer <?= rp($total_masuk_transfer); ?></div>
    </div>
    <div class="pg-kpi-card pg-kpi-cyan">
      <i class="fa fa-hand-paper-o pg-kpi-icon"></i>
      <small>Total Uang Keluar (Pengeluaran + Pembelian)</small>
      <div class="val"><?= rp($total_keluar_semua); ?></div>
      <div class="pg-sub">Pengeluaran <?= rp($total_keluar); ?> | Pembelian <?= rp($total_beli); ?></div>
    </div>
    <div class="pg-kpi-card <?= $saldo_keseluruhan < 0 ? 'pg-kpi-red' : 'pg-kpi-green'; ?>">
      <i class="fa fa-balance-scale pg-kpi-icon"></i>
      <small>Total Pendapatan Keseluruhan (Tunai & Transfer)</small>
      <div class="val"><?= rp($saldo_keseluruhan); ?></div>
      <div class="pg-sub">(Uang Masuk - Uang Keluar)</div>
    </div>
    <div class="pg-kpi-card pg-kpi-orange">
      <i class="fa fa-camera pg-kpi-icon"></i>
      <small>Total Saldo Uang Tunai</small>
      <div class="val"><?= rp($saldo_tunai); ?></div>
      <div class="pg-sub">Tunai Masuk - (Pengeluaran Tunai + Pembelian Tunai)</div>
    </div>
  </div>

  <?php if (!empty($result)) { ?>
    <div class="pg-section-card pg-section-tunai">
      <div class="pg-section-heading"><i class="fa fa-folder-o"></i> Pendapatan - Tunai</div>
      <div class="pg-table-wrap">
        <table class="pg-table table2excel">
          <colgroup>
            <col class="pg-col-no">
            <col class="pg-col-order">
            <col class="pg-col-name">
            <col class="pg-col-date">
            <col class="pg-col-date">
            <col class="pg-col-user">
            <col class="pg-col-pay">
            <col class="pg-col-in">
            <col class="pg-col-out">
          </colgroup>
          <thead>
            <tr>
              <th class="cell-center">No</th>
              <th>No. Order</th>
              <th>Pemesan</th>
              <th>Tanggal Order</th>
              <th>Tanggal Bayar</th>
              <th>Kasir</th>
              <th>Jenis Bayar</th>
              <th class="cell-right">Masuk</th>
              <th class="cell-center">Keluar</th>
            </tr>
          </thead>
          <tbody>
            <?php if (!empty($penjualan_tunai)) { $no = 1; ?>
              <?php foreach ($penjualan_tunai as $row) {
                $val = $row['val'];
                $bayar = $row['bayar'];
                $nama = '-';
                if (!empty($val['id_konsumen'])) {
                  $ck = cekKonsumen($val['id_konsumen']);
                  $nama = $ck['nama'] ?? '-';
                }
                $tgl_order = !empty($val['tgl_trx']) ? indo_fulldate($val['tgl_trx']) : (!empty($bayar->tgl_trx) ? indo_fulldate($bayar->tgl_trx) : '-');
                $tgl_bayar = !empty($val['tgl_bayar']) ? indo_fulldate($val['tgl_bayar']) : (!empty($bayar->tgl_bayar) ? indo_fulldate($bayar->tgl_bayar) : '-');
                $nama_bayar = $bayar->nama_bayar ?? 'Tunai';
                $akun = !empty($val['id_sub_bayar']) ? (getAkun($val['id_sub_bayar']) ?? 'Tunai') : 'Tunai';
              ?>
                <tr>
                  <td class="cell-center"><?= $no; ?></td>
                  <td class="cell-id"><?= htmlspecialchars(fmt_no_order_lap($val), ENT_QUOTES); ?></td>
                  <td><?= htmlspecialchars($nama, ENT_QUOTES); ?></td>
                  <td><?= $tgl_order; ?></td>
                  <td><?= $tgl_bayar; ?></td>
                  <td><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></td>
                  <td class="pay-link"><?= htmlspecialchars($nama_bayar, ENT_QUOTES); ?> (<?= htmlspecialchars($akun, ENT_QUOTES); ?>)</td>
                  <td class="cell-right"><?= rp($val['jml_bayar'] ?? 0); ?></td>
                  <td class="cell-center">-</td>
                </tr>
              <?php $no++; } ?>
            <?php } else { ?>
              <tr><td colspan="9" class="cell-center">Belum ada data pendapatan tunai</td></tr>
            <?php } ?>
          </tbody>
          <tfoot>
            <tr class="pg-total-row">
              <th colspan="7" class="cell-left">Total Pendapatan Tunai</th>
              <th class="cell-right"><?= rp($total_masuk_tunai); ?></th>
              <th class="cell-center">-</th>
            </tr>
          </tfoot>
        </table>
      </div>
        <div class="pg-mobile-list">
          <?php if (!empty($penjualan_tunai)) { $no = 1; ?>
            <?php foreach ($penjualan_tunai as $row) {
              $val = $row['val'];
              $bayar = $row['bayar'];
              $nama = '-';
              if (!empty($val['id_konsumen'])) {
                $ck = cekKonsumen($val['id_konsumen']);
                $nama = $ck['nama'] ?? '-';
              }
              $tgl_order_raw = !empty($val['tgl_trx']) ? $val['tgl_trx'] : (!empty($bayar->tgl_trx) ? $bayar->tgl_trx : '');
              $tgl_bayar_raw = !empty($val['tgl_bayar']) ? $val['tgl_bayar'] : (!empty($bayar->tgl_bayar) ? $bayar->tgl_bayar : '');
              $nama_bayar = $bayar->nama_bayar ?? 'Tunai';
              $akun = !empty($val['id_sub_bayar']) ? (getAkun($val['id_sub_bayar']) ?? 'Tunai') : 'Tunai';
            ?>
              <div class="pg-m-line">
                <div class="pg-m-no"><?= $no; ?></div>
                <div class="pg-m-block pg-m-order">
                  <strong><?= htmlspecialchars(fmt_no_order_lap($val), ENT_QUOTES); ?></strong>
                  <small><?= htmlspecialchars($nama, ENT_QUOTES); ?></small>
                </div>
                <div class="pg-m-dateblock"><i class="fa fa-calendar-o"></i><?= indo_shortdate_lap($tgl_order_raw); ?><small>Order</small></div>
                <div class="pg-m-dateblock"><i class="fa fa-calendar-o"></i><?= indo_shortdate_lap($tgl_bayar_raw); ?><small>Bayar</small></div>
                <div class="pg-m-userblock"><i class="fa fa-user-o"></i><strong><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></strong><small><?= htmlspecialchars($nama_bayar, ENT_QUOTES); ?> (<?= htmlspecialchars($akun, ENT_QUOTES); ?>)</small></div>
                <div class="pg-m-amount pg-income"><?= rp($val['jml_bayar'] ?? 0); ?></div>
              </div>
            <?php $no++; } ?>
          <?php } else { ?>
            <div class="pg-m-empty">Belum ada data pendapatan tunai</div>
          <?php } ?>
          <div class="pg-m-total pg-total-tunai"><span>Total Pendapatan Tunai</span><strong><?= rp($total_masuk_tunai); ?></strong></div>
        </div>


    </div>
    <div class="pg-report-grid">
      <div class="pg-section-card pg-section-transfer">
        <div class="pg-section-heading"><i class="fa fa-exchange"></i> Pendapatan - Transfer</div>
        <div class="pg-table-wrap">
          <table class="pg-table table2excel">
            <colgroup>
              <col class="pg-col-no">
              <col class="pg-col-order">
              <col class="pg-col-name">
              <col class="pg-col-date">
              <col class="pg-col-date">
              <col class="pg-col-user">
              <col class="pg-col-pay">
              <col class="pg-col-in">
              <col class="pg-col-out">
            </colgroup>
            <thead>
              <tr>
                <th class="cell-center">No</th>
                <th>No. Order</th>
                <th>Pemesan</th>
                <th>Tanggal Order</th>
                <th>Tanggal Bayar</th>
                <th>Kasir</th>
                <th>Jenis Bayar</th>
                <th class="cell-right">Masuk</th>
                <th class="cell-center">Keluar</th>
              </tr>
            </thead>
            <tbody>
              <?php if (!empty($penjualan_transfer)) { $no = 1; ?>
                <?php foreach ($penjualan_transfer as $row) {
                  $val = $row['val'];
                  $bayar = $row['bayar'];
                  $nama = '-';
                  if (!empty($val['id_konsumen'])) {
                    $ck = cekKonsumen($val['id_konsumen']);
                    $nama = $ck['nama'] ?? '-';
                  }
                  $tgl_order = !empty($val['tgl_trx']) ? indo_fulldate($val['tgl_trx']) : (!empty($bayar->tgl_trx) ? indo_fulldate($bayar->tgl_trx) : '-');
                  $tgl_bayar = !empty($val['tgl_bayar']) ? indo_fulldate($val['tgl_bayar']) : (!empty($bayar->tgl_bayar) ? indo_fulldate($bayar->tgl_bayar) : '-');
                  $nama_bayar = !empty($bayar->nama_bayar) ? $bayar->nama_bayar : 'Transfer';
                  $getAkun = !empty($val['id_sub_bayar']) ? (getAkun($val['id_sub_bayar']) ?? 'Transfer') : 'Transfer';
                  $lampiranUrl = !empty($val['lampiran']) ? base_url('uploads/lampiran/') . $val['lampiran'] : '';
                  $link = $lampiranUrl
                    ? '<a class="lightbox" href="' . $lampiranUrl . '" data-id="' . $no . '" title="' . htmlspecialchars($getAkun, ENT_QUOTES) . ': ' . rprp($val['jml_bayar'] ?? 0) . '">' . htmlspecialchars($getAkun, ENT_QUOTES) . '</a>'
                    : htmlspecialchars($getAkun, ENT_QUOTES);
                ?>
                  <tr>
                    <td class="cell-center"><?= $no; ?></td>
                    <td class="cell-id"><?= htmlspecialchars(fmt_no_order_lap($val), ENT_QUOTES); ?></td>
                    <td><?= htmlspecialchars($nama, ENT_QUOTES); ?></td>
                    <td><?= $tgl_order; ?></td>
                    <td><?= $tgl_bayar; ?></td>
                    <td><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></td>
                    <td class="pay-link"><?= htmlspecialchars($nama_bayar, ENT_QUOTES); ?> (<?= $link; ?>)</td>
                    <td class="cell-right"><?= rp($val['jml_bayar'] ?? 0); ?></td>
                    <td class="cell-center">-</td>
                  </tr>
                <?php $no++; } ?>
              <?php } else { ?>
                <tr><td colspan="9" class="cell-center">Belum ada data pendapatan transfer</td></tr>
              <?php } ?>
            </tbody>
            <tfoot>
              <tr class="pg-total-row">
                <th colspan="7" class="cell-left">Total Pendapatan Transfer</th>
                <th class="cell-right"><?= rp($total_masuk_transfer); ?></th>
                <th class="cell-center">-</th>
              </tr>
            </tfoot>
          </table>
        </div>
          <div class="pg-mobile-list">
            <?php if (!empty($penjualan_transfer)) { $no = 1; ?>
              <?php foreach ($penjualan_transfer as $row) {
                $val = $row['val'];
                $bayar = $row['bayar'];
                $nama = '-';
                if (!empty($val['id_konsumen'])) {
                  $ck = cekKonsumen($val['id_konsumen']);
                  $nama = $ck['nama'] ?? '-';
                }
                $tgl_order_raw = !empty($val['tgl_trx']) ? $val['tgl_trx'] : (!empty($bayar->tgl_trx) ? $bayar->tgl_trx : '');
                $tgl_bayar_raw = !empty($val['tgl_bayar']) ? $val['tgl_bayar'] : (!empty($bayar->tgl_bayar) ? $bayar->tgl_bayar : '');
                $nama_bayar = !empty($bayar->nama_bayar) ? $bayar->nama_bayar : 'Transfer';
                $getAkun = !empty($val['id_sub_bayar']) ? (getAkun($val['id_sub_bayar']) ?? 'Transfer') : 'Transfer';
                $lampiranUrl = !empty($val['lampiran']) ? base_url('uploads/lampiran/') . $val['lampiran'] : '';
                $link = $lampiranUrl
                  ? '<a class="lightbox" href="' . $lampiranUrl . '" data-id="m-transfer-' . $no . '" title="' . htmlspecialchars($getAkun, ENT_QUOTES) . ': ' . rprp($val['jml_bayar'] ?? 0) . '">' . htmlspecialchars($getAkun, ENT_QUOTES) . '</a>'
                  : htmlspecialchars($getAkun, ENT_QUOTES);
              ?>
                <div class="pg-m-line">
                  <div class="pg-m-no"><?= $no; ?></div>
                  <div class="pg-m-block pg-m-order">
                    <strong><?= htmlspecialchars(fmt_no_order_lap($val), ENT_QUOTES); ?></strong>
                    <small><?= htmlspecialchars($nama, ENT_QUOTES); ?></small>
                  </div>
                  <div class="pg-m-dateblock"><i class="fa fa-calendar-o"></i><?= indo_shortdate_lap($tgl_order_raw); ?><small>Order</small></div>
                  <div class="pg-m-dateblock"><i class="fa fa-calendar-o"></i><?= indo_shortdate_lap($tgl_bayar_raw); ?><small>Bayar</small></div>
                  <div class="pg-m-userblock"><i class="fa fa-user-o"></i><strong><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></strong><small><?= htmlspecialchars($nama_bayar, ENT_QUOTES); ?> (<?= $link; ?>)</small></div>
                  <div class="pg-m-amount pg-transfer-income"><?= rp($val['jml_bayar'] ?? 0); ?></div>
                </div>
              <?php $no++; } ?>
            <?php } else { ?>
              <div class="pg-m-empty">Belum ada data pendapatan transfer</div>
            <?php } ?>
            <div class="pg-m-total pg-total-transfer"><span>Total Pendapatan Transfer</span><strong><?= rp($total_masuk_transfer); ?></strong></div>
          </div>


      </div>
      <div class="pg-section-card pg-section-keluar">
        <div class="pg-section-heading"><i class="fa fa-balance-scale"></i> Pengeluaran</div>
        <div class="pg-table-wrap">
          <table class="pg-table table2excel">
            <colgroup>
              <col class="pg-col-no">
              <col class="pg-col-order">
              <col class="pg-col-date-detail">
              <col class="pg-col-user-detail">
              <col class="pg-col-pay-detail">
              <col class="pg-col-note">
              <col class="pg-col-in-detail">
              <col class="pg-col-out-detail">
            </colgroup>
            <thead>
              <tr>
                <th class="cell-center">No</th>
                <th>No. Order</th>
                <th>Tanggal Bayar</th>
                <th>Kasir</th>
                <th>Jenis Bayar</th>
                <th>Keterangan</th>
                <th class="cell-right">Masuk</th>
                <th class="cell-right">Keluar</th>
              </tr>
            </thead>
            <tbody>
              <?php if (!empty($result['keluar'])) { $no = 1; ?>
                <?php foreach ($result['keluar'] as $val) {
                  $id_bayar = $val['id_bayar'] ?? 0;
                  $akun = trim((string)getKodeAkun($id_bayar) . ' - ' . (string)getAkun($id_bayar), ' -');
                ?>
                  <tr>
                    <td class="cell-center"><?= $no; ?></td>
                    <td class="cell-id"><?= htmlspecialchars(fmt_no_order_lap($val), ENT_QUOTES); ?></td>
                    <td><?= !empty($val['tgl_bayar']) ? indo_fulldate($val['tgl_bayar']) : '-'; ?></td>
                    <td><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></td>
                    <td><?= htmlspecialchars($akun, ENT_QUOTES); ?></td>
                    <td><?= htmlspecialchars(lap_ket_text($val), ENT_QUOTES); ?></td>
                    <td class="cell-right">-</td>
                    <td class="cell-right"><?= rp($val['jml_bayar'] ?? 0); ?></td>
                  </tr>
                <?php $no++; } ?>
              <?php } else { ?>
                <tr><td colspan="8" class="cell-center">Belum ada data pengeluaran</td></tr>
              <?php } ?>
            </tbody>
            <tfoot>
              <tr class="pg-total-row">
                <th colspan="6" class="cell-left">Total Pengeluaran</th>
                <th class="cell-right">-</th>
                <th class="cell-right"><?= rp($total_keluar); ?></th>
              </tr>
            </tfoot>
          </table>
        </div>
          <div class="pg-mobile-list">
            <?php if (!empty($result['keluar'])) { $no = 1; ?>
              <?php foreach ($result['keluar'] as $val) {
                $id_bayar = $val['id_bayar'] ?? 0;
                $akun = trim((string)getKodeAkun($id_bayar) . ' - ' . (string)getAkun($id_bayar), ' -');
              ?>
                <div class="pg-m-line-out">
                  <div class="pg-m-no"><?= $no; ?></div>
                  <div class="pg-m-dateblock"><i class="fa fa-calendar-o"></i><?= !empty($val['tgl_bayar']) ? indo_shortdate_lap($val['tgl_bayar']) : '-'; ?><small>Bayar</small></div>
                  <div class="pg-m-userblock"><i class="fa fa-user-o"></i><strong><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></strong></div>
                  <div class="pg-m-payblock"><?= htmlspecialchars($akun, ENT_QUOTES); ?></div>
                  <div class="pg-m-noteblock"><?= htmlspecialchars(lap_ket_text($val), ENT_QUOTES); ?></div>
                  <div class="pg-m-amount pg-outcome"><?= rp($val['jml_bayar'] ?? 0); ?></div>
                </div>
              <?php $no++; } ?>
            <?php } else { ?>
              <div class="pg-m-empty">Belum ada data pengeluaran</div>
            <?php } ?>
            <div class="pg-m-total pg-total-keluar"><span>Total Pengeluaran</span><strong><?= rp($total_keluar); ?></strong></div>
          </div>


      </div>
    </div>

    <?php if (!empty($result['beli'])) { ?>
      <div class="pg-section-card pg-section-beli">
        <div class="pg-section-heading"><i class="fa fa-shopping-cart"></i> Pembelian</div>
        <div class="pg-table-wrap">
          <table class="pg-table table2excel">
            <colgroup>
              <col class="pg-col-no">
              <col class="pg-col-order">
              <col class="pg-col-date-detail">
              <col class="pg-col-user-detail">
              <col class="pg-col-pay-detail">
              <col class="pg-col-note">
              <col class="pg-col-in-detail">
              <col class="pg-col-out-detail">
            </colgroup>
            <thead>
              <tr>
                <th class="cell-center">No</th>
                <th>No. Order</th>
                <th>Tanggal Bayar</th>
                <th>Kasir</th>
                <th>Jenis Bayar</th>
                <th>Keterangan</th>
                <th class="cell-right">Masuk</th>
                <th class="cell-right">Keluar</th>
              </tr>
            </thead>
            <tbody>
              <?php $no = 1; foreach ($result['beli'] as $val) {
                $id_bayar = $val['id_bayar'] ?? 0;
                $akun = trim((string)getKodeAkun($id_bayar) . ' - ' . (string)getAkun($id_bayar), ' -');
              ?>
                <tr>
                  <td class="cell-center"><?= $no; ?></td>
                  <td class="cell-id"><?= htmlspecialchars(fmt_no_order_lap($val), ENT_QUOTES); ?></td>
                  <td><?= !empty($val['tgl_bayar']) ? indo_fulldate($val['tgl_bayar']) : '-'; ?></td>
                  <td><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></td>
                  <td><?= htmlspecialchars($akun, ENT_QUOTES); ?></td>
                  <td><?= htmlspecialchars(lap_ket_text($val), ENT_QUOTES); ?></td>
                  <td class="cell-right">-</td>
                  <td class="cell-right"><?= rp($val['jml_bayar'] ?? 0); ?></td>
                </tr>
              <?php $no++; } ?>
            </tbody>
            <tfoot>
              <tr class="pg-total-row">
                <th colspan="6" class="cell-left">Total Pembelian</th>
                <th class="cell-right">-</th>
                <th class="cell-right"><?= rp($total_beli); ?></th>
              </tr>
            </tfoot>
          </table>
        </div>
          <div class="pg-mobile-list">
            <?php $no = 1; foreach ($result['beli'] as $val) {
              $id_bayar = $val['id_bayar'] ?? 0;
              $akun = trim((string)getKodeAkun($id_bayar) . ' - ' . (string)getAkun($id_bayar), ' -');
            ?>
              <div class="pg-m-line-out">
                <div class="pg-m-no"><?= $no; ?></div>
                <div class="pg-m-dateblock"><i class="fa fa-calendar-o"></i><?= !empty($val['tgl_bayar']) ? indo_shortdate_lap($val['tgl_bayar']) : '-'; ?><small>Bayar</small></div>
                <div class="pg-m-userblock"><i class="fa fa-user-o"></i><strong><?= htmlspecialchars($val['fo'] ?? '-', ENT_QUOTES); ?></strong></div>
                <div class="pg-m-payblock"><?= htmlspecialchars($akun, ENT_QUOTES); ?></div>
                <div class="pg-m-noteblock"><?= htmlspecialchars(lap_ket_text($val), ENT_QUOTES); ?></div>
                <div class="pg-m-amount pg-outcome"><?= rp($val['jml_bayar'] ?? 0); ?></div>
              </div>
            <?php $no++; } ?>
            <div class="pg-m-total pg-total-beli"><span>Total Pembelian</span><strong><?= rp($total_beli); ?></strong></div>
          </div>


      </div>
    <?php } ?>


    <div class="pg-section-card pg-summary-card pg-section-summary">
      <div class="pg-section-heading"><i class="fa fa-bar-chart"></i> Ringkasan</div>
      <div class="pg-summary-strip">
        <div class="pg-summary-item">
          <small>Total Pendapatan (Tunai)</small>
          <strong><?= rp($total_masuk_tunai); ?></strong>
        </div>
        <div class="pg-summary-item">
          <small>Total Pendapatan (Transfer)</small>
          <strong><?= rp($total_masuk_transfer); ?></strong>
        </div>
        <div class="pg-summary-item">
          <small>Total Pendapatan (Tunai + Transfer)</small>
          <strong><?= rp($total_masuk); ?></strong>
        </div>
        <div class="pg-summary-item">
          <small>Total Pengeluaran (Kas Keluar)</small>
          <strong><?= rp($total_keluar); ?></strong>
        </div>
        <div class="pg-summary-item">
          <small>Total Pembelian</small>
          <strong><?= rp($total_beli); ?></strong>
        </div>
        <div class="pg-summary-item">
          <small>Total Uang Keluar (Pengeluaran + Pembelian)</small>
          <strong><?= rp($total_keluar_semua); ?></strong>
        </div>
        <div class="pg-summary-item <?= $saldo_class; ?>">
          <small>Saldo / Total Keseluruhan</small>
          <strong><?= rp($saldo_keseluruhan); ?></strong>
          <small>(Uang Masuk - Uang Keluar)</small>
        </div>
        <div class="pg-summary-item <?= $saldo_tunai < 0 ? 'is-danger' : 'is-success'; ?>">
          <small>Total Saldo Uang Tunai</small>
          <strong><?= rp($saldo_tunai); ?></strong>
          <small>(Tunai Masuk - Pengeluaran Tunai - Pembelian Tunai)</small>
        </div>
      </div>
    </div>
  <?php } else { ?>
    <div class="pg-empty">Belum ada data</div>
  <?php } ?>

  <script>
    var lightboxDescription = GLightbox({ selector: '.lightbox', loop: true });
  </script>
</div>
