<?php
// dashboard.php — First Heritage Bank Dashboard (Bootstrap 5 + PHP)

// Path to data file
$dataFile = __DIR__ . '/data.json';

// Load or initialize data
if (!file_exists($dataFile)) die("data.json not found.");
$data = json_decode(file_get_contents($dataFile), true);
if (!$data) die("Invalid data.json");

// Extract variables for convenience
$acct = $data['account'];
$txns = $data['transactions'];

// Simple monthly totals for chart
$now = new DateTime();
$credits = 0; $debits = 0;
foreach ($txns as $t) {
    $tDate = new DateTime($t['date']);
    if ($now->diff($tDate)->days <= 30) {
        if ($t['type']==='credit') $credits += $t['amount'];
        else $debits += $t['amount'];
    }
}
?>

    <!-- Sidebar -->
<?php
// Read data.json to get live balance and percentages
$dataFile = __DIR__ . '/data.json';
$data = json_decode(file_get_contents($dataFile), true);

function getUserIP() {
    if (!empty($_SERVER['HTTP_CLIENT_IP'])) {
        return $_SERVER['HTTP_CLIENT_IP'];
    } elseif (!empty($_SERVER['HTTP_X_FORWARDED_FOR'])) {
        // Handles cases behind proxies or load balancers
        return explode(',', $_SERVER['HTTP_X_FORWARDED_FOR'])[0];
    } else {
        return $_SERVER['REMOTE_ADDR'];
    }
}

// graceful fallback
$totalBalance = $data['account']['balance'] ?? 0;
$incomePercent = $data['account']['income_percentage'] ?? 65;
$debitPercent = $data['account']['debit_percentage'] ?? 35;
?>

<?php
// business_loan.php — Imperial Premium Bank Business Support Loan Page

$dataFile = __DIR__ . '/data.json';
if (!file_exists($dataFile)) die("data.json not found.");
$data = json_decode(file_get_contents($dataFile), true);
if (!$data) die("Invalid data.json");

$acct = $data['account'];
$loan = $data['business_support_loan'] ?? [
  'loan_amount' => 0,
  'interest_rate' => 0,
  'status' => 'None',
  'next_due_date' => null
];

// Handle loan request submission
$message = '';
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  $requested_amount = floatval($_POST['requested_amount']);
  $purpose = trim($_POST['purpose']);
  if ($requested_amount > 0) {
    $loan = [
      'loan_amount' => $requested_amount,
      'interest_rate' => 6.5,
      'status' => 'Pending Approval',
      'next_due_date' => date('Y-m-d', strtotime('+30 days')),
      'purpose' => $purpose
    ];
    $data['business_support_loan'] = $loan;
    file_put_contents($dataFile, json_encode($data, JSON_PRETTY_PRINT));
    $message = "✅ Loan request for $" . number_format($requested_amount, 2) . " has been submitted successfully.";
  } else {
    $message = "❌ Please enter a valid loan amount.";
  }
}
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Business Support Loan — First Heritage Bank</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">


<style>
:root {
  --primary: #0b5ed7;
  --danger: #dc3545;
  --light: #f8f9fa;
}

body {
  background: #f4f6fa;
  font-family: "Segoe UI", Roboto, Arial, sans-serif;
}

/* ===== Sidebar ===== */
.sidebar {
  padding: 0rem !important;
  width: 250px;
  min-height: 100vh;
  background: var(--primary);
  color: #fff;
  position: fixed;
  left: 0;
  top: 0;
  transition: all 0.3s ease;
  z-index: 1050;
}

.sidebar .nav-link {
  color: #fff;
  opacity: 0.9;
}

.sidebar .nav-link.active,
.sidebar .nav-link:hover {
  opacity: 1;
  background: rgba(255, 255, 255, 0.15);
}

/* ===== Topbar ===== */
.topbar {
  height: 60px;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  padding: 0 1rem;
  margin-left: 250px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* ===== Main Content ===== */
.content {
  margin-left: 250px;
  padding: 2rem;
}

.card {
  border: none;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);
}

.txn-row:hover {
  background: #f8f9fa;
}

.badge-credit {
  color: green;
}

.badge-debit {
  color: #dc3545;
}

/* ===== Responsive Adjustments ===== */
@media (max-width: 991.98px) {
  .sidebar {
    position: fixed;
    left: -250px;
    top: 0;
    height: 100%;
    z-index: 1050;
  }

  .sidebar.show {
    left: 0;
  }

  .topbar {
    margin-left: 0;
    padding-left: 3.5rem; /* space for toggle button */
  }

  .content {
    margin-left: 0;
    padding: 1rem;
  }

  .sidebar-toggle {
    display: inline-block;
    cursor: pointer;
    color: var(--primary);
    font-size: 1.5rem;
  }

  /* Adjust text and table layout */
  .table-responsive {
    overflow-x: auto;
  }

  .card h4 {
    font-size: 1.1rem;
  }

  .topbar img {
    width: 35px;
    height: 35px;
  }

  body.sidebar-open {
    overflow: hidden;
  }
}

/* ===== Small Devices ===== */
@media (max-width: 575.98px) {
  .topbar {
    flex-wrap: wrap;
    height: auto;
    gap: 0.5rem;
  }

  .topbar .fw-semibold {
    font-size: 0.95rem;
  }

  .topbar span.text-muted {
    font-size: 0.8rem;
  }

  .content {
    padding: 1rem 0.5rem;
  }

  .card {
    padding: 1rem;
  }
}
</style>

</head>
<body>

<div class="sidebar d-flex flex-column p-3">
  <div style="border-bottom: solid #fe473a;">
  <img style="margin-top:0.5rem;" src="whitelogo.png"/>
      <p style="text-align: center;font-size: 11px;margin-bottom: 0.5rem;">  Smart Banking for the Good Heritage.</p>
</div>
  <!-- Account Summary Box -->
  <div class="card text-center mb-3 shadow-sm" style="border:none;padding: 10px;">
    <div class="card-body p-2">
      <div class="fw-semibold text-muted small">Available Balance</div>
      <div class="fs-5 fw-bold mb-2">$<?php echo number_format($totalBalance, 2); ?></div>

      <div class="d-flex justify-content-between small">
        <span class="text-success">Income <?php echo $incomePercent; ?>%</span>
        <span class="text-danger">Debit <?php echo $debitPercent; ?>%</span>
      </div>

      <!-- Progress bar -->
      <div class="progress mt-1" style="height:6px;">
        <div class="progress-bar bg-success" role="progressbar" style="width: <?php echo $incomePercent; ?>%"></div>
        <div class="progress-bar bg-danger" role="progressbar" style="width: <?php echo $debitPercent; ?>%"></div>
      </div>

      <!-- Quick Action Buttons -->
      <div class="d-grid gap-2 mt-2">
        <a href="transfer.php" class="btn btn-sm btn-primary">Transfer</a>
        <a href="pay_bills.php" class="btn btn-sm btn-outline-primary">Pay Bills</a>
      </div>
    </div>
  </div>

  <!-- Navigation -->
<ul class="nav nav-pills flex-column mb-auto">
  <li class="nav-item">
    <a href="dashboard.php" class="nav-link">
      <i class="bi bi-speedometer2 me-2"></i> Dashboard
    </a>
  </li>
  <li class="nav-item">
    <a href="myaccount.php" class="nav-link">
      <i class="bi bi-person-circle me-2"></i> My Account
    </a>
  </li>
  <li class="nav-item">
    <a href="account_summary.php" class="nav-link">
      <i class="bi bi-bar-chart-line me-2"></i> Account Summary
    </a>
  </li>
  <li class="nav-item">
    <a href="transfer.php" class="nav-link">
      <i class="bi bi-arrow-left-right me-2"></i> Transfer
    </a>
  </li>
  <li class="nav-item">
    <a href="deposit_check.php" class="nav-link">
      <i class="bi bi-cash-stack me-2"></i> Deposit Check
    </a>
  </li>
  
   <li class="nav-item">
    <a href="pay_bills.php" class="nav-link">
      <i class="bi bi-cash-stack me-2"></i> Pay Bills
    </a>
  </li>
  
  <li class="nav-item">
    <a href="kyc_status.php" class="nav-link">
      <i class="bi bi-shield-check me-2"></i> KYC Status
    </a>
  </li>
  <li class="nav-item">
    <a href="link_card.php" class="nav-link">
      <i class="bi bi-credit-card-2-front me-2"></i> Link Card
    </a>
  </li>
  <li class="nav-item">
    <a href="business_loan.php" class="nav-link active">
      <i class="bi bi-briefcase me-2"></i> Business Support Loan
    </a>
  </li>
  <li class="nav-item">
    <a href="support.php" class="nav-link">
      <i class="bi bi-life-preserver me-2"></i> Support
    </a>
  </li>
  <li class="nav-item">
    <a href="account_settings.php" class="nav-link">
      <i class="bi bi-gear me-2"></i> Settings
    </a>
  </li>
</ul>


  <div class="mt-auto text-center small opacity-75 text-white">&copy; 2025 First Heritage Bank</div>
</div>


<!-- Topbar -->
<div  style="padding: 20px;" class="topbar">
    <div class="sidebar-toggle d-lg-none me-2" onclick="toggleSidebar()">
  <i class="bi bi-list"></i>
</div>

  <div class="fw-semibold">Welcome, <?=htmlspecialchars($acct['owner'])?></div>
 <! -- HERE IS THE PROFILE PICTURE SIDE -->
  
 <style>
/* Custom styling for the popup menu */
.account-dropdown {
  width: 280px;
  border-radius: 1rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  border: none;
}
.account-dropdown .dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
}
.account-dropdown .dropdown-item i {
  color: #0b5ed7;
}
.account-balance {
  text-align: center;
  padding: 12px;
  border-bottom: 1px solid #e9ecef;
}
.account-balance small {
  color: #6c757d;
}
</style>


<div class="d-flex align-items-center gap-3">
  <span class="text-muted small">IP: <?= htmlspecialchars(getUserIP()) ?></span>

  <!-- Profile dropdown trigger -->
  <div class="dropdown">
    <img 
      src="<?= htmlspecialchars($acct['profile_pic']) ?>" 
      alt="Profile" 
      class="rounded-circle dropdown-toggle" 
      width="40" 
      height="40" 
      role="button" 
      data-bs-toggle="dropdown" 
      aria-expanded="false"
      style="cursor: pointer;"
    >

    <!-- Dropdown Menu -->
    <div class="dropdown-menu dropdown-menu-end account-dropdown p-0">

      <div class="account-balance">
        <small>CHECKING ACCOUNT</small>
        <div class="fs-5 fw-bold mb-2">$<?php echo number_format($totalBalance, 2); ?></div>
        <small>$<?php echo number_format($totalBalance, 2); ?></small>
      </div>

      <a class="dropdown-item" href="transfer.php">
        <i class="bi bi-arrow-left-right"></i> Transfer Funds
      </a>
      <hr class="my-1">

      <a class="dropdown-item" href="myaccount.php">
        <i class="bi bi-person"></i> View Profile
      </a>
      <a class="dropdown-item" href="ccount_settings.php">
        <i class="bi bi-gear"></i> Account Setting
      </a>
      <a class="dropdown-item" href="support.php">
        <i class="bi bi-lock"></i> Open Support
      </a>
      <a class="dropdown-item" href="login-activity.php">
        <i class="bi bi-activity"></i> Login Activity
      </a>

      

      <hr class="my-2">

      <form method="post" action="logout.php" class="px-3 pb-2">
        <button type="submit" class="btn btn-outline-primary w-100">
          <i class="bi bi-box-arrow-right me-2"></i> Sign out
        </button>
      </form>

    </div>
  </div>
</div>
  
   <! -- HERE IS THE END PROFILE PICTURE SIDE -->
</div>

<!-- Content -->
<div class="content">
  <?php if($message): ?>
  <div class="alert alert-info"><?=$message?></div>
  <?php endif; ?>

  <div class="row g-4">
    <div class="col-lg-6">
      <div class="card p-4">
        <h6 class="fw-bold mb-3">Current Loan Details</h6>
        <?php if($loan['status'] !== 'None'): ?>
        <ul class="list-group list-group-flush">
          <li class="list-group-item d-flex justify-content-between"><span>Loan Amount</span><span>$<?=number_format($loan['loan_amount'],2)?></span></li>
          <li class="list-group-item d-flex justify-content-between"><span>Interest Rate</span><span><?=$loan['interest_rate']?>%</span></li>
          <li class="list-group-item d-flex justify-content-between"><span>Status</span><span class="badge bg-info"><?=$loan['status']?></span></li>
          <li class="list-group-item d-flex justify-content-between"><span>Next Due Date</span><span><?=date('M d, Y', strtotime($loan['next_due_date']))?></span></li>
          <?php if(!empty($loan['purpose'])): ?>
          <li class="list-group-item"><strong>Purpose:</strong> <?=htmlspecialchars($loan['purpose'])?></li>
          <?php endif; ?>
        </ul>
        <?php else: ?>
        <p class="text-muted">You currently do not have an active business loan.</p>
        <?php endif; ?>
      </div>
    </div>

    <div class="col-lg-6">
      <div class="card p-4">
        <h6 class="fw-bold mb-3">Request a New Loan</h6>
        <form method="post">
          <div class="mb-3">
            <label class="form-label small text-muted">Requested Amount (USD)</label>
            <input type="number" name="requested_amount" class="form-control" min="500" step="100" required>
          </div>
          <div class="mb-3">
            <label class="form-label small text-muted">Purpose / Business Use</label>
            <textarea name="purpose" class="form-control" rows="2" placeholder="e.g., business expansion, equipment purchase" required></textarea>
          </div>
          <div class="text-end">
            <button type="submit" class="btn btn-primary">Submit Loan Request</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>

<script>
function toggleSidebar() {
  const sidebar = document.querySelector('.sidebar');
  sidebar.classList.toggle('show');
  document.body.classList.toggle('sidebar-open');
}
</script>




<script>
// ✅ Keep your existing toggleSidebar() exactly as is
function toggleSidebar() {
  const sidebar = document.querySelector('.sidebar');
  sidebar.classList.toggle('show');
  document.body.classList.toggle('sidebar-open');

  // Handle overlay when sidebar is shown
  let overlay = document.querySelector('.sidebar-overlay');
  if (!overlay) {
    overlay = document.createElement('div');
    overlay.className = 'sidebar-overlay';
    document.body.appendChild(overlay);
    overlay.addEventListener('click', () => toggleSidebar());
  }

  // Show or hide overlay
  overlay.style.display = sidebar.classList.contains('show') ? 'block' : 'none';
}
</script>

<style>
/* ✅ Sidebar overlay for mobile close */
.sidebar-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  z-index: 1040;
  display: none;
}
</style>
</body>

</html>
