<?php
require_once('source/session.php');
require_once('source/error.php');
require_once('source/dbconfig.php');
require_once('source/function.php');
require_once('source/restrict_admin.php');
session_start();

// Check if the user is logged in
if (isset($_SESSION['SESS_ID_ADMIN'])) {
    $userId = $_SESSION['SESS_ID_ADMIN'];

    // Fetch user details based on the ID
    $query = "SELECT * FROM tbl_admin WHERE id = :id";
    $stmt = $DBH->prepare($query);
    $stmt->bindParam(':id', $userId, PDO::PARAM_INT);
    $stmt->execute();

    if ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
        $adminName = $row['username'];
    }
}

// School information
$schoolName = "Henzy Royal International School";
$schoolAddress = "No 17 Amadi Street, Amakohia, Uratta Owerri Imo State Nigeria";
$supportPhone = "+234 803 292 9756";
$supportEmail = "support@hris.com.ng";

// Initialize variables
$pin = $_POST['pin'] ?? $_GET['pin'] ?? '';
$searchResults = [];
$noResults = false;
$pinInfo = null;
$userInfo = null;
$usageHistory = [];

// Handle form submission
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['search'])) {
    $pin = trim($_POST['pin']);
    
    if (empty($pin)) {
        $_SESSION['error'] = "Please enter a PIN to search";
        header("Location: pin_user.php");
        exit();
    }
    
    // Get PIN information - using reg_no instead of pin_user
    $pinQuery = "SELECT p.*, 
                        u.name as student_name, 
                        u.class as student_class
                 FROM tbl_pin p 
                 LEFT JOIN tbl_user u ON p.reg_no = u.reg_no 
                 WHERE p.pin = ?";
    
    $pinInfo = sql($DBH, $pinQuery, [$pin], "row");
    
    if ($pinInfo) {
        // If PIN is used (reg_no is not empty), get detailed user information
        if (!empty($pinInfo['reg_no'])) {
            $userQuery = "SELECT * FROM tbl_user WHERE reg_no = ?";
            $userInfo = sql($DBH, $userQuery, [$pinInfo['reg_no']], "row");
            
            // Get usage history for this reg_no if available
            if (!empty($pinInfo['reg_no'])) {
                $historyQuery = "SELECT p.*, u.name as student_name 
                               FROM tbl_pin p 
                               LEFT JOIN tbl_user u ON p.reg_no = u.reg_no 
                               WHERE p.reg_no = ? OR p.pin = ?
                               ORDER BY p.date_time DESC";
                $usageHistory = sql($DBH, $historyQuery, [$pinInfo['reg_no'], $pin], "rows");
            }
        } else {
            $noResults = false;
        }
    } else {
        $noResults = true;
        $_SESSION['warning'] = "No PIN found matching: '$pin'";
    }
}

// Handle messages from session
$error_message = $_SESSION['error'] ?? '';
$success_message = $_SESSION['success'] ?? '';
$warning_message = $_SESSION['warning'] ?? '';

// Clear messages from session
unset($_SESSION['error'], $_SESSION['success'], $_SESSION['warning']);
?>

<!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>PIN Information - Henzy Royal International School</title>
  <link rel="icon" type="image/png" href="coll_logo.png">
  
  <!-- Bootstrap 5 CSS -->
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
  
  <!-- Font Awesome -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
  
  <!-- Google Fonts - Poppins -->
  <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
  
  <!-- Custom CSS -->
  <style>
    :root {
      --primary-blue: #1a4b8c;    /* Royal Blue */
      --secondary-gold: #FFD700;    /* Gold */
      --dark-blue: #0f2b4f;         /* Dark Blue */
      --light-blue: #4a7db5;         /* Medium Blue */
      --light-gold: #FFF1B8;          /* Light Gold */
      --bg-light: #f5f9ff;
    }
    
    body {
      font-family: 'Poppins', sans-serif;
      background-color: var(--bg-light);
      padding-top: 56px;
      color: #333;
      font-size: 0.9rem;
    }
    
    /* Navbar Styles */
    .navbar {
      background: linear-gradient(135deg, var(--primary-blue), var(--dark-blue));
      box-shadow: 0 0.15rem 1.75rem 0 rgba(26, 75, 140, 0.2);
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 1030;
      color: white;
      border-bottom: 2px solid var(--secondary-gold);
    }
    
    .navbar-brand {
      font-weight: 800;
      font-size: 1.2rem;
      color: white;
      display: flex;
      align-items: center;
    }
    
    .navbar-brand img {
      border-radius: 4px;
      margin-right: 10px;
    }
    
    /* Sidebar Styles */
    .sidebar {
      background: linear-gradient(180deg, var(--dark-blue) 0%, var(--primary-blue) 100%);
      position: fixed;
      top: 56px;
      left: 0;
      width: 250px;
      height: calc(100vh - 56px);
      transition: all 0.3s;
      z-index: 1000;
      overflow-y: auto;
      border-right: 3px solid var(--secondary-gold);
    }
    
    .sidebar .nav-link {
      color: rgba(255, 255, 255, 0.9);
      font-weight: 500;
      padding: 0.75rem 1rem;
      margin-bottom: 0.2rem;
      transition: all 0.2s;
      border-left: 3px solid transparent;
    }
    
    .sidebar .nav-link:hover {
      color: white;
      background-color: rgba(255, 215, 0, 0.15);
      border-left-color: var(--secondary-gold);
    }
    
    .sidebar .nav-link.active {
      color: var(--dark-blue);
      background-color: var(--secondary-gold);
      border-left-color: var(--dark-blue);
      font-weight: 600;
    }
    
    .sidebar .nav-link i {
      margin-right: 0.5rem;
      width: 20px;
      text-align: center;
    }
    
    .sidebar-logo {
      text-align: center;
      margin-bottom: 1rem;
      padding: 1rem;
    }
    
    .logo-text {
      font-size: 1.5rem;
      font-weight: 900;
      color: white;
      letter-spacing: 2px;
      line-height: 1.2;
    }
    
    .logo-text span {
      color: var(--secondary-gold);
    }
    
    .logo-tagline {
      font-size: 0.65rem;
      color: var(--secondary-gold);
      letter-spacing: 1px;
    }
    
    /* Main Content Styles */
    .main-content {
      margin-left: 250px;
      width: calc(100% - 250px);
      transition: all 0.3s;
      min-height: calc(100vh - 56px);
      padding-bottom: 60px;
    }
    
    @media (max-width: 991.98px) {
      .sidebar {
        left: -250px;
      }
      .main-content {
        margin-left: 0;
        width: 100%;
      }
      body {
        padding-top: 56px;
      }
    }
    
    /* Welcome banner */
    .welcome-banner {
      background: linear-gradient(135deg, var(--primary-blue), var(--light-blue));
      color: white;
      border-radius: 0.5rem;
      padding: 0.75rem 1rem;
      margin: 1rem;
      box-shadow: 0 4px 6px rgba(0,0,0,0.1);
      border-left: 5px solid var(--secondary-gold);
    }
    
    /* Form Styles */
    .form-container {
      background-color: white;
      border-radius: 0.5rem;
      padding: 1rem;
      margin: 1rem;
      box-shadow: 0 0.15rem 1.75rem 0 rgba(26, 75, 140, 0.1);
      border: 1px solid rgba(255, 215, 0, 0.2);
    }
    
    /* Info Cards */
    .info-card {
      background: linear-gradient(135deg, var(--light-gold) 0%, #ffffff 100%);
      border-left: 4px solid var(--secondary-gold);
      padding: 1rem;
      margin-bottom: 1rem;
      border-radius: 0 0.5rem 0.5rem 0;
      border: 1px solid rgba(255, 215, 0, 0.3);
    }
    
    /* PIN Display */
    .pin-display-large {
      font-family: 'Courier New', monospace;
      font-size: 2rem;
      font-weight: 700;
      letter-spacing: 4px;
      color: var(--dark-blue);
      background: linear-gradient(135deg, #f5f5f5, #ffffff);
      padding: 1rem 1.5rem;
      border-radius: 0.5rem;
      border: 2px solid var(--secondary-gold);
      display: inline-block;
      margin: 0.5rem 0;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }
    
    .pin-display {
      font-family: 'Courier New', monospace;
      font-size: 1.1rem;
      font-weight: 700;
      letter-spacing: 2px;
      color: var(--dark-blue);
      background: linear-gradient(135deg, #f5f5f5, #ffffff);
      padding: 0.5rem 0.75rem;
      border-radius: 0.375rem;
      border: 1px solid var(--secondary-gold);
      display: inline-block;
      margin: 0.25rem 0;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }
    
    /* Status badges */
    .badge-status {
      padding: 0.35rem 0.75rem;
      border-radius: 2rem;
      font-size: 0.75rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      display: inline-block;
    }
    
    .badge-used {
      background: linear-gradient(135deg, #28a745, #218838);
      color: white;
    }
    
    .badge-unused {
      background: linear-gradient(135deg, #6c757d, #5a6268);
      color: white;
    }
    
    /* Admin Info Styles */
    .admin-info {
      display: flex;
      align-items: center;
      background-color: rgba(255, 215, 0, 0.2);
      padding: 8px 12px;
      border-radius: 8px;
      color: white;
    }
    
    .admin-name {
      margin-right: 5px;
      font-weight: 600;
    }
    
    .admin-access {
      font-style: italic;
      opacity: 0.8;
      margin-right: 10px;
      font-size: 0.9rem;
    }
    
    .admin-icon {
      font-size: 1.5rem;
      color: var(--secondary-gold);
    }
    
    /* Footer styles */
    .footer {
      background: linear-gradient(135deg, var(--dark-blue), var(--primary-blue));
      color: white;
      padding: 12px 0;
      position: fixed;
      bottom: 0;
      width: 100%;
      z-index: 100;
      font-size: 0.8rem;
      border-top: 2px solid var(--secondary-gold);
    }
    
    @media (min-width: 992px) {
      .footer {
        margin-left: 250px;
        width: calc(100% - 250px);
      }
    }
    
    @media (max-width: 991.98px) {
      .footer {
        margin-left: 0;
        width: 100%;
      }
    }
    
    .copyright-text {
      font-weight: 600;
    }
    
    .copyright-text i {
      color: var(--secondary-gold);
    }
    
    .powered-by {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      color: white;
    }
    
    .powered-by img {
      height: 18px;
      margin-left: 6px;
      filter: brightness(0) invert(1);
    }
    
    .powered-by-link {
      display: flex;
      align-items: center;
      text-decoration: none;
      color: var(--secondary-gold);
      transition: opacity 0.3s ease;
    }
    
    .powered-by-link:hover {
      opacity: 0.8;
      color: white;
    }
    
    /* Support badge */
    .support-badge {
      background: linear-gradient(135deg, var(--secondary-gold), #e6b800);
      color: var(--dark-blue);
      font-weight: 600;
      padding: 0.5rem 1rem;
      border: 1px solid var(--dark-blue);
    }
    
    /* Breadcrumbs */
    .breadcrumb-custom .breadcrumb {
      background-color: transparent;
      padding: 0;
      margin: 1rem 1rem 0;
    }
    
    .breadcrumb-custom .breadcrumb-item a {
      color: var(--primary-blue);
      text-decoration: none;
      font-weight: 500;
    }
    
    .breadcrumb-custom .breadcrumb-item a:hover {
      color: var(--secondary-gold);
    }
    
    .breadcrumb-custom .breadcrumb-item.active {
      color: var(--dark-blue);
      font-weight: 600;
    }
    
    .breadcrumb-item + .breadcrumb-item::before {
      color: var(--secondary-gold);
    }
    
    /* Info Grid */
    .info-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 1rem;
      margin-bottom: 1rem;
    }
    
    .info-item {
      background: linear-gradient(135deg, #f8f9fa, #ffffff);
      padding: 0.75rem;
      border-radius: 0.5rem;
      border: 1px solid rgba(255, 215, 0, 0.2);
    }
    
    .info-label {
      font-size: 0.8rem;
      color: var(--primary-blue);
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-bottom: 0.25rem;
    }
    
    .info-value {
      font-size: 1.1rem;
      font-weight: 600;
      color: var(--dark-blue);
    }
    
    /* Table Styles */
    .table-container {
      background-color: white;
      border-radius: 0.5rem;
      padding: 1rem;
      margin: 1rem;
      box-shadow: 0 0.15rem 1.75rem 0 rgba(26, 75, 140, 0.1);
      overflow-x: auto;
      border: 1px solid rgba(255, 215, 0, 0.2);
    }
    
    .history-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.85rem;
    }
    
    .history-table th,
    .history-table td {
      padding: 0.75rem;
      border: 1px solid #dee2e6;
      text-align: left;
      vertical-align: middle;
    }
    
    .history-table th {
      background: linear-gradient(135deg, var(--primary-blue), var(--dark-blue));
      color: white;
      font-weight: 600;
      position: sticky;
      top: 0;
      z-index: 10;
    }
    
    .history-table th i {
      color: var(--secondary-gold);
    }
    
    .history-table tr:nth-child(even) {
      background-color: #f9f9f9;
    }
    
    .history-table tr:hover {
      background-color: var(--light-gold);
    }
    
    /* Action buttons */
    .btn-primary {
      background: linear-gradient(135deg, var(--primary-blue), var(--dark-blue));
      border-color: var(--secondary-gold);
      color: white;
    }
    
    .btn-primary:hover {
      background: linear-gradient(135deg, var(--secondary-gold), #e6b800);
      border-color: var(--dark-blue);
      color: var(--dark-blue);
    }
    
    /* Alert styles */
    .alert {
      padding: 0.75rem 1rem;
      border-radius: 0.25rem;
      margin: 1rem;
    }
    
    .alert-success {
      background-color: #d4edda;
      border-color: #c3e6cb;
      color: #155724;
    }
    
    .alert-danger {
      background-color: #f8d7da;
      border-color: #f5c6cb;
      color: #721c24;
    }
    
    .alert-warning {
      background-color: #fff3cd;
      border-color: #ffeaa7;
      color: #856404;
    }
    
    .alert-info {
      background-color: #d1ecf1;
      border-color: #bee5eb;
      color: #0c5460;
    }
    
    /* Form elements */
    .form-control, .form-select {
      font-size: 0.9rem;
    }
    
    .form-control:focus, .form-select:focus {
      border-color: var(--secondary-gold);
      box-shadow: 0 0 0 0.25rem rgba(255, 215, 0, 0.25);
    }
    
    .form-label i {
      color: var(--secondary-gold);
    }
    
    /* Empty state */
    .empty-state {
      text-align: center;
      padding: 3rem;
      color: #6c757d;
    }
    
    .empty-state i {
      font-size: 3rem;
      margin-bottom: 1rem;
      color: var(--primary-blue);
    }
    
    .empty-state h5 {
      color: var(--dark-blue);
    }
    
    /* Responsive */
    @media (max-width: 768px) {
      .row {
        flex-direction: column;
      }
      
      .btn-primary {
        width: 100%;
        margin-top: 0.5rem;
      }
      
      .pin-display-large {
        font-size: 1.5rem;
        letter-spacing: 2px;
        padding: 0.75rem 1rem;
      }
      
      .info-grid {
        grid-template-columns: 1fr;
      }
    }
  </style>
</head>

<body>
  <!-- Top Navigation -->
  <nav class="navbar navbar-expand-lg navbar-dark">
    <div class="container-fluid">
      <button id="sidebarToggle" class="btn btn-link d-lg-none me-2">
        <i class="fas fa-bars" style="color: white;"></i>
      </button>
      <a class="navbar-brand d-none d-lg-block" href="#">
        <img src="coll_logo.png" alt="Henzy Royal International School" height="35" style="border-radius: 4px;">
        HENZY ROYAL INT'L SCHOOL
      </a>
      <div class="ms-auto d-flex align-items-center">
        <div class="admin-info me-3">
          <span class="admin-name"><?php echo htmlspecialchars($adminName ?? 'Admin'); ?></span>
          <span class="admin-access">(Administrator)</span>
          <i class="fas fa-user-circle admin-icon"></i>
        </div>
        <a href="logout.php" class="btn btn-sm btn-outline-light">
          <i class="fas fa-sign-out-alt"></i> Logout
        </a>
      </div>
    </div>
  </nav>

  <!-- Sidebar -->
  <nav id="sidebar" class="sidebar">
    <div class="position-sticky pt-3">
      <div class="sidebar-logo d-none d-lg-block">
        <div class="logo-text">
          H.R.<span>I.S</span>
        </div>
        <div class="logo-tagline">
          THE PRIDE OF EXCELLENCE
        </div>
        <hr style="border-color: var(--secondary-gold); opacity: 0.3;">
        <p class="text-white small px-2">
          <i class="fas fa-map-marker-alt" style="color: var(--secondary-gold);"></i><br>
          <?php echo $schoolAddress; ?>
        </p>
      </div>
      
      <ul class="nav flex-column">
        <li class="nav-item">
          <a class="nav-link" href="main.php">
            <i class="fas fa-fw fa-tachometer-alt"></i>
            Admin Dashboard
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="edit_scores_subject.php">
            <i class="fas fa-fw fa-edit"></i>
            Edit Subject Scores
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="download_broadsheet.php">
            <i class="fas fa-fw fa-file-pdf"></i>
            Result Broadsheet
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="list_uploaded_results.php">
            <i class="fas fa-fw fa-list"></i>
            Uploaded Results
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="edit_comments_attendance.php">
            <i class="fas fa-fw fa-comments"></i>
            Attendance & Comments
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="edit_skills.php">
            <i class="fas fa-fw fa-chart-bar"></i>
            Psychomotor Skills
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="find_student_pin.php">
            <i class="fas fa-fw fa-search"></i>
            Find Student's PIN
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link active" href="pin_user.php">
            <i class="fas fa-fw fa-check-circle"></i>
            Confirm PIN Usage
          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="edit_pin.php">
            <i class="fas fa-fw fa-edit"></i>
            Edit PIN
          </a>
        </li>
      </ul>
    </div>
  </nav>

  <!-- Main Content -->
  <main class="main-content">
    <!-- Welcome Banner -->
    <div class="welcome-banner">
      <div class="d-flex justify-content-between align-items-center">
        <div>
          <h4 class="mb-1"><i class="fas fa-crown me-2" style="color: var(--secondary-gold);"></i>PIN Information & Usage</h4>
          <p class="mb-0 small">Henzy Royal International School - Admin Dashboard</p>
        </div>
        <div class="d-none d-sm-inline-block">
          <span class="badge support-badge p-1">
            <i class="fas fa-key me-1"></i> PIN Management
          </span>
        </div>
      </div>
    </div>

    <!-- Breadcrumbs -->
    <div class="breadcrumb-custom">
      <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="main.php">Admin Dashboard</a></li>
          <li class="breadcrumb-item active">PIN Information</li>
        </ol>
      </nav>
    </div>

    <?php if ($error_message): ?>
      <div class="alert alert-danger">
        <i class="fas fa-exclamation-circle me-2"></i> <?php echo htmlspecialchars($error_message); ?>
      </div>
    <?php endif; ?>
    
    <?php if ($success_message): ?>
      <div class="alert alert-success">
        <i class="fas fa-check-circle me-2"></i> <?php echo htmlspecialchars($success_message); ?>
      </div>
    <?php endif; ?>
    
    <?php if ($warning_message): ?>
      <div class="alert alert-warning">
        <i class="fas fa-exclamation-triangle me-2"></i> <?php echo htmlspecialchars($warning_message); ?>
      </div>
    <?php endif; ?>

    <!-- Search Form -->
    <div class="form-container">
      <form method="POST" action="">
        <div class="row align-items-end">
          <div class="col-md-8">
            <div class="form-group mb-2">
              <label for="pin" class="form-label"><i class="fas fa-key me-1"></i>Enter PIN to Search:</label>
              <input type="text" class="form-control form-control-sm" id="pin" name="pin" 
                     value="<?php echo htmlspecialchars($pin); ?>" 
                     placeholder="Enter PIN code (e.g., ABCD-1234-EFGH-5678)" required>
            </div>
          </div>
          
          <div class="col-md-4">
            <button type="submit" name="search" class="btn btn-primary btn-sm w-100">
              <i class="fas fa-search me-1"></i> Search PIN
            </button>
          </div>
        </div>
        
        <div class="mt-2">
          <div class="alert alert-info py-2">
            <h6 class="mb-1"><i class="fas fa-info-circle me-1" style="color: var(--secondary-gold);"></i> Search Instructions</h6>
            <div class="row small">
              <div class="col-md-6">
                <i class="fas fa-check-circle text-success me-1"></i> Enter a PIN to view its details and status
              </div>
              <div class="col-md-6">
                <i class="fas fa-check-circle text-success me-1"></i> If the PIN is used, you'll see student information
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>

    <?php if ($pinInfo): ?>
      <!-- PIN Information Card -->
      <div class="form-container">
        <div class="info-card">
          <div class="row">
            <div class="col-md-12 text-center">
              <h5 class="mb-3">PIN Information</h5>
              <div class="pin-display-large"><?php echo htmlspecialchars($pinInfo['pin']); ?></div>
            </div>
          </div>
          
          <div class="info-grid mt-3">
            <div class="info-item">
              <div class="info-label">Status</div>
              <div class="info-value">
                <?php if (!empty($pinInfo['reg_no'])): ?>
                  <span class="badge-status badge-used">Used</span>
                <?php else: ?>
                  <span class="badge-status badge-unused">Unused</span>
                <?php endif; ?>
              </div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Serial Number</div>
              <div class="info-value"><?php echo isset($pinInfo['Serial']) ? str_pad($pinInfo['Serial'], 5, "0", STR_PAD_LEFT) : 'N/A'; ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Batch ID</div>
              <div class="info-value"><?php echo htmlspecialchars($pinInfo['batch_id'] ?? 'N/A'); ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Batch</div>
              <div class="info-value"><?php echo htmlspecialchars($pinInfo['batch'] ?? 'N/A'); ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Year</div>
              <div class="info-value"><?php echo htmlspecialchars($pinInfo['year'] ?? 'N/A'); ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Term</div>
              <div class="info-value"><?php echo htmlspecialchars($pinInfo['term'] ?? 'N/A'); ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Class</div>
              <div class="info-value"><?php echo htmlspecialchars($pinInfo['class'] ?? 'N/A'); ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Date Generated</div>
              <div class="info-value"><?php echo $pinInfo['created_date_time'] ? date('M j, Y', strtotime($pinInfo['created_date_time'])) : 'N/A'; ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Valid From</div>
              <div class="info-value"><?php echo $pinInfo['dt_stamp_start'] ? date('M j, Y', strtotime($pinInfo['dt_stamp_start'])) : 'N/A'; ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Valid Until</div>
              <div class="info-value"><?php echo $pinInfo['dt_stamp_end'] ? date('M j, Y', strtotime($pinInfo['dt_stamp_end'])) : 'N/A'; ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Used Count</div>
              <div class="info-value"><?php echo intval($pinInfo['used_count'] ?? 0); ?></div>
            </div>
            
            <div class="info-item">
              <div class="info-label">Last Used</div>
              <div class="info-value"><?php echo $pinInfo['date_time'] ? date('M j, Y h:i A', strtotime($pinInfo['date_time'])) : 'Never'; ?></div>
            </div>
          </div>
        </div>
      </div>

      <?php if (!empty($pinInfo['reg_no']) && $userInfo): ?>
        <!-- User Information Card -->
        <div class="form-container">
          <div class="info-card">
            <h5 class="mb-3"><i class="fas fa-user-graduate me-2" style="color: var(--secondary-gold);"></i>Assigned Student Information</h5>
            
            <div class="info-grid">
              <div class="info-item">
                <div class="info-label">Student Name</div>
                <div class="info-value"><?php echo htmlspecialchars($userInfo['name'] ?? 'N/A'); ?></div>
              </div>
              
              <div class="info-item">
                <div class="info-label">Registration Number</div>
                <div class="info-value"><?php echo htmlspecialchars($userInfo['reg_no'] ?? 'N/A'); ?></div>
              </div>
              
              <div class="info-item">
                <div class="info-label">Class</div>
                <div class="info-value"><?php echo htmlspecialchars($userInfo['class'] ?? 'N/A'); ?></div>
              </div>
              
              <div class="info-item">
                <div class="info-label">Date Used</div>
                <div class="info-value"><?php echo $pinInfo['date_time'] ? date('M j, Y h:i A', strtotime($pinInfo['date_time'])) : 'N/A'; ?></div>
              </div>
              
              <?php if (!empty($userInfo['parent_name'])): ?>
              <div class="info-item">
                <div class="info-label">Parent/Guardian</div>
                <div class="info-value"><?php echo htmlspecialchars($userInfo['parent_name'] ?? 'N/A'); ?></div>
              </div>
              <?php endif; ?>
              
              <?php if (!empty($userInfo['parent_phone'])): ?>
              <div class="info-item">
                <div class="info-label">Parent Phone</div>
                <div class="info-value"><?php echo htmlspecialchars($userInfo['parent_phone'] ?? 'N/A'); ?></div>
              </div>
              <?php endif; ?>
            </div>
            
            <?php if (!empty($userInfo['address'])): ?>
              <div class="mt-2 p-2 bg-light rounded">
                <strong>Address:</strong> <?php echo htmlspecialchars($userInfo['address']); ?>
              </div>
            <?php endif; ?>
          </div>
        </div>
      <?php endif; ?>

      <?php if (!empty($usageHistory) && count($usageHistory) > 1): ?>
        <!-- Usage History -->
        <div class="table-container">
          <h5 class="mb-3"><i class="fas fa-history me-2" style="color: var(--secondary-gold);"></i>PIN Usage History</h5>
          
          <div class="table-responsive">
            <table class="history-table">
              <thead>
                <tr>
                  <th width="5%"><i class="fas fa-hashtag me-1"></i>S/N</th>
                  <th><i class="fas fa-key me-1"></i>PIN</th>
                  <th><i class="fas fa-user me-1"></i>Student</th>
                  <th><i class="fas fa-calendar me-1"></i>Date Used</th>
                  <th><i class="fas fa-barcode me-1"></i>Serial No</th>
                  <th><i class="fas fa-layer-group me-1"></i>Batch</th>
                </tr>
              </thead>
              <tbody>
                <?php foreach ($usageHistory as $index => $record): ?>
                  <tr>
                    <td><?php echo $index + 1; ?></td>
                    <td>
                      <span class="pin-display"><?php echo htmlspecialchars($record['pin']); ?></span>
                    </td>
                    <td><?php echo htmlspecialchars($record['student_name'] ?? 'Unused'); ?></td>
                    <td><?php echo $record['date_time'] ? date('M j, Y h:i A', strtotime($record['date_time'])) : 'Not Used'; ?></td>
                    <td><?php echo isset($record['Serial']) ? str_pad($record['Serial'], 5, "0", STR_PAD_LEFT) : '-'; ?></td>
                    <td><?php echo htmlspecialchars($record['batch'] ?? 'No Batch'); ?></td>
                  </tr>
                <?php endforeach; ?>
              </tbody>
            </table>
          </div>
        </div>
      <?php endif; ?>
      
      <!-- Action Buttons -->
      <div class="form-container">
        <div class="row">
          <div class="col-md-6">
            <a href="edit_pin.php?pin=<?php echo urlencode($pinInfo['pin']); ?>" class="btn btn-primary btn-action w-100">
              <i class="fas fa-edit me-1"></i> Edit This PIN
            </a>
          </div>
          <div class="col-md-6">
            <a href="find_student_pin.php" class="btn btn-secondary btn-action w-100">
              <i class="fas fa-arrow-left me-1"></i> Back to Search
            </a>
          </div>
        </div>
      </div>
      
    <?php elseif ($noResults): ?>
      <div class="form-container empty-state">
        <i class="fas fa-key"></i>
        <h5 class="text-muted">PIN Not Found</h5>
        <p class="mb-0">No PIN found matching "<?php echo htmlspecialchars($pin); ?>"</p>
        <p class="small text-muted mt-2">Please check the PIN and try again.</p>
        <div class="mt-3">
          <button class="btn btn-primary btn-sm" onclick="document.getElementById('pin').focus()">
            <i class="fas fa-redo me-1"></i> Try Again
          </button>
        </div>
      </div>
    <?php else: ?>
      <div class="form-container empty-state">
        <i class="fas fa-search"></i>
        <h5 class="text-muted">Search for a PIN</h5>
        <p class="mb-0">Enter a PIN above to view its information and usage status.</p>
      </div>
    <?php endif; ?>
  </main>

  <!-- Footer -->
  <footer class="footer">
    <div class="container-fluid">
      <div class="row align-items-center">
        <div class="col-md-6">
          <span class="copyright-text">
            <i class="fas fa-copyright me-1"></i> <?php echo date("Y"); ?> Henzy Royal International School
          </span>
        </div>
        <div class="col-md-6">
          <div class="powered-by">
            <a href="https://dataswift.com.ng" target="_blank" rel="noopener noreferrer" class="powered-by-link">
              <span>Powered by DataSwift Coders</span>
              <img src="datalogo.png" alt="DataSwift Logo">
            </a>
          </div>
        </div>
      </div>
    </div>
  </footer>

  <!-- Bootstrap 5 JS Bundle with Popper -->
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
  
  <!-- Custom Scripts -->
  <script>
    // Toggle sidebar on mobile
    document.getElementById('sidebarToggle').addEventListener('click', function() {
      document.getElementById('sidebar').classList.toggle('active');
      document.querySelector('.main-content').classList.toggle('active');
      document.querySelector('.footer').classList.toggle('active');
    });
    
    // Close sidebar when clicking outside on mobile
    document.addEventListener('click', function(event) {
      const sidebar = document.getElementById('sidebar');
      const sidebarToggle = document.getElementById('sidebarToggle');
      
      if (window.innerWidth < 992 && 
          !sidebar.contains(event.target) && 
          !sidebarToggle.contains(event.target) && 
          sidebar.classList.contains('active')) {
        sidebar.classList.remove('active');
        document.querySelector('.main-content').classList.remove('active');
        document.querySelector('.footer').classList.remove('active');
      }
    });
    
    // Auto-hide alerts after 5 seconds
    setTimeout(() => {
      const alerts = document.querySelectorAll('.alert');
      alerts.forEach(alert => {
        alert.style.transition = 'opacity 0.5s';
        alert.style.opacity = '0';
        setTimeout(() => {
          alert.remove();
        }, 500);
      });
    }, 5000);
    
    // Auto-focus on search field
    document.addEventListener('DOMContentLoaded', function() {
      const searchField = document.getElementById('pin');
      if (searchField && !searchField.value) {
        searchField.focus();
      }
    });
    
    // Format PIN input (optional)
    document.getElementById('pin')?.addEventListener('input', function(e) {
      // Remove any spaces and convert to uppercase
      this.value = this.value.replace(/\s/g, '').toUpperCase();
    });
  </script>
</body>
</html>