<?php
	session_start();
	if($_SESSION['unohs'] == null){
		header("location:index.php?msg=unauthorized");
	}
?>
<?php
	include ("conn.php");
?>
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>Manage Withdraw · Dashboard</title>
  <link rel="stylesheet" href="vendors/mdi/css/materialdesignicons.min.css">
  <link rel="stylesheet" href="vendors/feather/feather.css">
  <link rel="stylesheet" href="vendors/base/vendor.bundle.base.css">
  <link rel="stylesheet" href="vendors/flag-icon-css/css/flag-icon.min.css"/>
  <link rel="stylesheet" href="vendors/font-awesome/css/font-awesome.min.css">
  <link rel="stylesheet" href="vendors/jquery-bar-rating/fontawesome-stars-o.css">
  <link rel="stylesheet" href="vendors/jquery-bar-rating/fontawesome-stars.css">
  <link rel="stylesheet" href="css/style.css">
  <link rel="stylesheet" href="plugins/datatables/dataTables.bootstrap.css">
  <link rel="stylesheet" href="https://cdn.datatables.net/1.12.1/css/jquery.dataTables.min.css">
  <link rel="stylesheet" href="https://cdn.datatables.net/fixedheader/3.2.3/css/fixedHeader.dataTables.min.css">
  <link rel="shortcut icon" href="images/favicon.png" />
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&family=IBM+Plex+Mono:wght@500;600&display=swap" rel="stylesheet">

  <style>
	/* ===== Theme v4 — blue background, solid dark text ===== */
	:root{
		--navy:       #4F46E5;
		--navy-2:     #3730A3;
		--ink:        #111827;
		--ink-soft:   #374151;
		--ink-faint:  #5B6472;
		--paper:      #CFE0F7;
		--paper-card: #E6F0FC;
		--gold:       #A5B4FC;
		--gold-light: #EEF2FF;
		--gold-deep:  #4338CA;
		--brick:      #DC2626;
		--line:       #A9C3E8;
		--shadow:     0 1px 2px rgba(17,24,39,0.08), 0 8px 20px rgba(17,24,39,0.10);
		--radius:     12px;
	}

	html, body{
		background: #CFE0F7 !important;
		font-family: 'Inter', -apple-system, sans-serif;
		color: #000000 !important;
	}
	.page-body-wrapper,
	.main-panel,
	.content-wrapper{
		background: #CFE0F7 !important;
	}

	/* ---- Header banner ---- */
	.ledger-banner{
		background: linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 100%) !important;
		border-radius: var(--radius);
		padding: 1.6rem 1.75rem;
		box-shadow: var(--shadow);
		border-bottom: 3px solid var(--gold);
		margin-bottom: 1.5rem;
	}
	.ledger-eyebrow{
		font-family: 'Space Grotesk', sans-serif;
		font-size: 0.72rem;
		font-weight: 600;
		letter-spacing: 0.16em;
		text-transform: uppercase;
		color: var(--gold-light) !important;
		margin-bottom: 0.35rem;
	}
	.ledger-title{
		font-family: 'Space Grotesk', sans-serif;
		font-weight: 700;
		font-size: 1.85rem;
		color: #FFFFFF !important;
		letter-spacing: -0.01em;
		margin: 0;
	}
	.ledger-sub{
		color: rgba(255,255,255,0.85) !important;
		font-size: 0.9rem;
		margin-top: 0.25rem;
	}

	/* ---- Summary stubs (ticket / receipt styling) ---- */
	.stub-row{
		display: flex;
		gap: 1rem;
		flex-wrap: wrap;
		margin: 1.5rem 0 1.75rem;
	}
	.stub{
		position: relative;
		background: #FFFFFF !important;
		border: 1px solid var(--line);
		border-top: 3px solid var(--gold);
		border-radius: var(--radius);
		box-shadow: var(--shadow);
		padding: 1.1rem 1.4rem;
		min-width: 210px;
		flex: 1 1 210px;
	}
	.stub-label{
		font-family: 'Space Grotesk', sans-serif;
		font-size: 0.68rem;
		font-weight: 600;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: #5B6472 !important;
	}
	.stub-value{
		font-family: 'IBM Plex Mono', monospace;
		font-weight: 700;
		font-size: 1.55rem;
		color: #000000 !important;
		margin-top: 0.3rem;
		font-variant-numeric: tabular-nums;
	}
	.stub-value.brick{ color: var(--brick) !important; }

	/* ---- Ledger table ---- */
	.ledger-panel{
		background: #FFFFFF !important;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		box-shadow: var(--shadow);
		overflow: hidden;
	}
	table.ledger{
		width: 100% !important;
		border-collapse: collapse;
		margin: 0 !important;
		background: #FFFFFF !important;
	}
	table.ledger thead th{
		background: linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 100%) !important;
		color: #FFFFFF !important;
		font-family: 'Space Grotesk', sans-serif;
		font-weight: 600;
		font-size: 0.72rem;
		letter-spacing: 0.08em;
		text-transform: uppercase;
		padding: 0.85rem 1rem;
		border: none !important;
		border-bottom: 2px solid var(--gold) !important;
		white-space: nowrap;
	}
	table.ledger tbody tr{
		background: #FFFFFF !important;
	}
	table.ledger tbody td{
		background: #FFFFFF !important;
		padding: 0.85rem 1rem;
		border-top: 1px dashed var(--line) !important;
		border-bottom: none !important;
		border-left: none !important;
		border-right: none !important;
		vertical-align: middle;
		font-size: 0.9rem;
		color: #000000 !important;
	}
	table.ledger tbody tr:hover td{
		background: #EEF2FF !important;
	}
	.col-num{
		font-family: 'IBM Plex Mono', monospace;
		color: #000000 !important;
		font-size: 0.85rem;
		font-weight: 600;
	}
	.col-amount{
		font-family: 'IBM Plex Mono', monospace;
		font-weight: 700;
		font-variant-numeric: tabular-nums;
		color: #3730A3 !important;
	}
	.col-account{
		font-family: 'IBM Plex Mono', monospace;
		font-size: 0.85rem;
		font-weight: 600;
		color: #000000 !important;
	}
	.type-badge{
		display: inline-block;
		font-family: 'Space Grotesk', sans-serif;
		font-size: 0.68rem;
		font-weight: 700;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		padding: 0.28rem 0.6rem;
		border-radius: 999px;
		background: #EEF2FF !important;
		color: #3730A3 !important;
		border: 1px solid #A5B4FC;
	}

	/* ---- Review action button (signature element) ---- */
	.review-btn{
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
		padding: 0.5rem 1rem;
		border-radius: 999px;
		font-family: 'Space Grotesk', sans-serif;
		font-size: 0.78rem;
		font-weight: 700;
		letter-spacing: 0.02em;
		border: 1.5px solid var(--navy);
		color: #FFFFFF !important;
		background: var(--navy) !important;
		transition: transform 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
		white-space: nowrap;
	}
	.review-btn i{ font-size: 13px; }
	.review-btn:hover{
		background: var(--navy-2) !important;
		border-color: var(--navy-2);
		color: #FFFFFF !important;
		transform: translateY(-1px);
		box-shadow: 0 6px 16px rgba(79,70,229,0.3);
		text-decoration: none;
	}

	.ledger-empty{
		text-align: center;
		padding: 3rem 1rem;
		color: #5B6472 !important;
		font-family: 'Space Grotesk', sans-serif;
	}

	/* ---- Mobile: table rows become stacked cards ---- */
	@media (max-width: 768px){
		.ledger-banner{ padding: 1.25rem 1.35rem; }
		.ledger-title{ font-size: 1.5rem; }
		.stub-row{ margin: 1.25rem 0; }
		.stub{ min-width: 0; flex: 1 1 45%; padding: 0.9rem 1rem; }
		.stub-value{ font-size: 1.25rem; }

		table.ledger thead{ display: none; }
		table.ledger, table.ledger tbody, table.ledger tr, table.ledger td{
			display: block;
			width: 100% !important;
		}
		table.ledger tbody tr{
			background: #FFFFFF !important;
			border: 1px solid var(--line);
			border-left: 3px solid var(--gold);
			border-radius: 10px;
			margin: 0.75rem;
			box-shadow: var(--shadow);
			overflow: hidden;
		}
		table.ledger tbody td{
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 1rem;
			padding: 0.6rem 0.9rem;
			border-top: 1px dashed var(--line) !important;
			text-align: right;
			background: #FFFFFF !important;
			color: #000000 !important;
		}
		table.ledger tbody td:first-child{ border-top: none !important; }
		table.ledger tbody td::before{
			content: attr(data-label);
			font-family: 'Space Grotesk', sans-serif;
			font-size: 0.65rem;
			font-weight: 700;
			letter-spacing: 0.08em;
			text-transform: uppercase;
			color: #5B6472 !important;
			text-align: left;
		}
		table.ledger tbody td.action-cell{
			justify-content: flex-end;
			background: #EEF2FF !important;
		}
		table.ledger tbody td.action-cell::before{ display: none; }
		.review-btn{ width: 100%; justify-content: center; padding: 0.6rem 0.9rem; }
	}

	/* DataTables chrome, restyled to match */
	.dataTables_wrapper .dataTables_filter input,
	.dataTables_wrapper .dataTables_length select{
		border: 1px solid var(--line);
		border-radius: 6px;
		padding: 0.3rem 0.6rem;
		background: #FFFFFF !important;
		color: #000000 !important;
	}
	.dataTables_wrapper .dataTables_paginate .paginate_button.current{
		background: var(--navy) !important;
		border-color: var(--navy) !important;
		color: #fff !important;
	}
	.dataTables_wrapper .dataTables_info,
	.dataTables_wrapper .dataTables_paginate .paginate_button{
		color: #000000 !important;
	}
	.ledger-panel .col-sm-6, .ledger-panel .col-sm-5, .ledger-panel .col-sm-7{
		padding: 1rem 1.25rem;
	}
  </style>
</head>
<body>
  <div class="container-scroller">
    <nav class="navbar col-lg-12 col-12 p-0 fixed-top d-flex flex-row">
      <div class="text-center navbar-brand-wrapper d-flex align-items-center justify-content-center">
        <a class="navbar-brand brand-logo" href="dashboard.php"><img src="images/logo.png" alt="logo"/></a>
        <a class="navbar-brand brand-logo-mini" href="dashboard.php"><img src="images/logo-mini.png" alt="logo"/></a>
      </div>
      <div class="navbar-menu-wrapper d-flex align-items-center justify-content-end">
        <button class="navbar-toggler navbar-toggler align-self-center" type="button" data-toggle="minimize">
          <span class="icon-menu"></span>
        </button>       
        <ul class="navbar-nav navbar-nav-right">           
          <li class="nav-item dropdown d-flex mr-4 ">
            <a class="nav-link count-indicator dropdown-toggle d-flex align-items-center justify-content-center" id="notificationDropdown" href="#" data-toggle="dropdown">
              <i class="icon-cog"></i>
            </a>
            <div class="dropdown-menu dropdown-menu-right navbar-dropdown preview-list" aria-labelledby="notificationDropdown">
              <p class="mb-0 font-weight-normal float-left dropdown-header">Settings</p>              
              <a class="dropdown-item preview-item" href="logout.php">
                  <i class="icon-inbox"></i> Logout
              </a>
            </div>
          </li>
        </ul>
        <button class="navbar-toggler navbar-toggler-right d-lg-none align-self-center" type="button" data-toggle="offcanvas">
          <span class="icon-menu"></span>
        </button>
      </div>
    </nav>
    <div class="container-fluid page-body-wrapper">
      <nav class="sidebar sidebar-offcanvas" id="sidebar">
        <div class="user-profile">
          <div class="user-image">
            <img src="images/faces/face28.png">
          </div>
          <div class="user-name">
              bigdelhi
          </div>
          <div class="user-designation">
              Admin
          </div>
        </div>
        <?php include 'compass.php';?>
      </nav>
      <div class="main-panel">
        <div class="content-wrapper">

          <div class="row">
            <div class="col-sm-12">
              <div class="ledger-banner">
                <div class="ledger-eyebrow">Payouts &middot; Pending Queue</div>
                <h4 class="ledger-title">Manage Withdraw</h4>
                <div class="ledger-sub">Every request below is awaiting review before funds are released.</div>
              </div>
            </div>
          </div>

		  <?php
			/* ✅ FIX — আগে Payout Type Column সবসময় Hardcoded
			   "bank" দেখাতো (bKash/Nagad হলেও)। এখন khate ও
			   bankcard দুটোর সাথেই LEFT JOIN করে আসল Type ও
			   Account/Number দেখানো হচ্ছে। */
			$walletTypeNames = [175 => 'BKASH', 176 => 'ROCKET', 177 => 'UPAY', 178 => 'NAGAD'];

			$Query=mysqli_query($conn,"select hintegedukolli.*,
				(select `mobile` from `shonu_subjects` where `id`=`hintegedukolli`.`balakedara`) as user,
				khate.khatehesaru, khate.khatesankhye,
				bankcard.type as wallet_type, bankcard.account as wallet_account
				from `hintegedukolli`
				LEFT JOIN khate ON khate.shonu = hintegedukolli.khateshonu
				LEFT JOIN bankcard ON bankcard.id = hintegedukolli.khateshonu AND khate.shonu IS NULL
				where `hintegedukolli`.`sthiti`='0' order by hintegedukolli.shonu desc");

			// Buffer all rows first so the summary stubs (totals/count) can render above the table.
			$rows = [];
			$total = 0;
			while($row = mysqli_fetch_array($Query)){
				$rows[] = $row;
				$total += $row['motta'];
			}
			$count = count($rows);
		  ?>

		  <div class="stub-row">
			<div class="stub">
				<div class="stub-label">Requests Pending</div>
				<div class="stub-value <?php echo $count > 0 ? 'brick' : ''; ?>"><?php echo $count; ?></div>
			</div>
			<div class="stub">
				<div class="stub-label">Total Amount</div>
				<div class="stub-value">৳<?php echo number_format($total, 2); ?></div>
			</div>
		  </div>

		  <div class="row">
            <div class="col-sm-12">
				<form id="formID" name="formID" method="post" action="#" enctype="multipart/form-data">
				  <div class="ledger-panel">
					<table id="example1" class="ledger table">
						<thead>
							<tr>
								<th>Sr.No</th>
								<th>User Mobile</th>
								<th>Amount</th>
								<th>Payout Type</th>
								<th>Account/Number</th>
                              	<th>Order ID</th>
								<th>Req. Date</th>
								<th>Action</th>
							</tr>
						</thead>
						<tbody>
						<?php
							if($count === 0){
						?>
							<tr>
								<td colspan="8">
									<div class="ledger-empty">No withdrawal requests are waiting right now.</div>
								</td>
							</tr>
						<?php
							} else {
								$i=0;
								foreach($rows as $row){
									$i++;

									if (!empty($row['khatehesaru'])) {
										$payoutType = $row['khatehesaru'];
										$accountDisplay = $row['khatesankhye'];
									} elseif (!empty($row['wallet_account'])) {
										$payoutType = $walletTypeNames[$row['wallet_type']] ?? ('Wallet #'.$row['wallet_type']);
										$accountDisplay = $row['wallet_account'];
									} else {
										$payoutType = 'N/A';
										$accountDisplay = 'N/A';
									}
						?>
								<tr style="background:#FFFFFF !important;">
									<td class="col-num" data-label="Sr.No" style="color:#000000 !important; background:#FFFFFF !important;"><?php echo str_pad($i, 2, '0', STR_PAD_LEFT); ?></td>
									<td data-label="User Mobile" style="color:#000000 !important; background:#FFFFFF !important;"><span style="color:#000000 !important; font-weight:600;"><?php echo $row["user"] ?: 'N/A'; ?></span></td>
									<td class="col-amount" data-label="Amount" style="color:#3730A3 !important; font-weight:700; background:#FFFFFF !important;">৳<?php echo number_format($row['motta'],2);?></td>
									<td data-label="Payout Type" style="background:#FFFFFF !important;"><span class="type-badge" style="color:#3730A3 !important; background:#EEF2FF !important;"><?php echo htmlspecialchars($payoutType); ?></span></td>
									<td class="col-account" data-label="Account/Number" style="color:#000000 !important; background:#FFFFFF !important;"><?php echo htmlspecialchars($accountDisplay); ?></td>
                                  	<td class="col-num" data-label="Order ID" style="color:#000000 !important; background:#FFFFFF !important;"><?php echo $row["dharavahi"]; ?></td>
									<td class="col-num" data-label="Req. Date" style="color:#000000 !important; background:#FFFFFF !important;"><?php echo date('d M Y', strtotime($row['dinankavannuracisi']));?></td>
									<td class="action-cell" data-label="Action">
										<a class="review-btn" href="withdrawal-accept-reject.php?id=<?php echo encryptor('encrypt', $row['shonu']); ?>" data-toggle="tooltip" title="Accept/Reject">
											<i class="fa fa-eye"></i> Review
										</a>
									</td>
								</tr>
						<?php 
								}
							}
						?>
						</tbody>
					</table>
				  </div>
				</form>			  			  
            </div>			
          </div>		  
		</div>
		<footer class="footer">
			<div class="d-sm-flex justify-content-center justify-content-sm-between">
				<span class="text-muted d-block text-center text-sm-left d-sm-inline-block">Copyright © cv111.site 2024</span>
			</div>
		</footer>
      </div>     
    </div>
  </div>  
  <script src="vendors/base/vendor.bundle.base.js"></script>
  <script src="js/off-canvas.js"></script>
  <script src="js/hoverable-collapse.js"></script>
  <script src="js/template.js"></script>
  <script src="vendors/chart.js/Chart.min.js"></script>
  <script src="vendors/jquery-bar-rating/jquery.barrating.min.js"></script>
  <script src="js/dashboard.js"></script>
  <script src="https://cdn.datatables.net/1.12.1/js/jquery.dataTables.min.js"></script>
  <script>
	$(function () {
		$('#example1').DataTable({
		  "paging": true,
		  "lengthChange": false,
		  "searching": true,
		  "ordering": false,
		  "info": true,
		  "autoWidth": true,
		  "pageLength": 100
		});
	});
  </script>
</body>

</html>
