<?php include __DIR__ . '/../../layouts/header.php'; ?>
<?php include __DIR__ . '/../../layouts/sidebar.php'; ?>

<div class="d-flex justify-content-between align-items-center mb-4">
    <div class="d-flex align-items-center gap-3">
        <a href="?page=maids" class="btn btn-light rounded-circle shadow-sm" style="width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;">
            <i class="fas <?= isRTL() ? 'fa-arrow-right' : 'fa-arrow-left' ?>"></i>
        </a>
        <div>
            <h2 class="mb-0"><?= htmlspecialchars($maid['full_name'] ?? '') ?></h2>
            <span class="text-muted small">Agency: <strong><?= htmlspecialchars($maid['agency_name'] ?? 'Direct Registry') ?></strong></span>
        </div>
    </div>
    
    <div class="d-flex gap-2">
        <?php if ($maid['verification_status'] !== 'approved'): ?>
            <a href="?page=maids&action=approve&id=<?= $maid['id'] ?>" class="btn btn-success fw-bold px-4" style="border-radius: 10px;">
                <i class="fas fa-check me-2"></i> Approve & Activate
            </a>
        <?php endif; ?>
        <?php if ($maid['verification_status'] !== 'rejected'): ?>
            <a href="?page=maids&action=reject&id=<?= $maid['id'] ?>" class="btn btn-danger fw-bold px-4" style="border-radius: 10px;">
                <i class="fas fa-ban me-2"></i> Deactivate
            </a>
        <?php endif; ?>
    </div>
</div>

<div class="row g-4">
    <!-- Left Column: Photo & Key Status -->
    <div class="col-lg-4">
        <div class="card border-0 shadow-sm mb-4" style="border-radius: 16px;">
            <div class="card-body text-center p-4">
                <div class="position-relative d-inline-block mb-3">
                    <?php if (!empty($maid['profile_image'])): ?>
                        <img src="<?= htmlspecialchars($maid['profile_image']) ?>" class="rounded-circle shadow-sm border border-4 border-white" width="150" height="150" style="object-fit: cover;">
                    <?php else: ?>
                        <div class="rounded-circle shadow-sm border border-4 border-white bg-light d-flex align-items-center justify-content-center text-muted" style="width: 150px; height: 150px; font-size: 4rem;">
                            <i class="fas fa-user"></i>
                        </div>
                    <?php endif; ?>
                </div>
                
                <h4 class="mb-1 text-dark"><?= htmlspecialchars($maid['full_name'] ?? '') ?></h4>
                <p class="text-muted small mb-3">Maid ID: #<?= htmlspecialchars($maid['id']) ?></p>
                
                <div class="d-flex flex-column gap-2 px-3">
                    <div class="d-flex justify-content-between align-items-center py-2 border-bottom">
                        <span class="text-secondary small">Verification Status</span>
                        <?php if ($maid['verification_status'] === 'approved'): ?>
                            <span class="badge bg-success text-white px-3 py-1">Approved</span>
                        <?php elseif ($maid['verification_status'] === 'rejected'): ?>
                            <span class="badge bg-danger text-white px-3 py-1">Rejected</span>
                        <?php else: ?>
                            <span class="badge bg-warning text-dark px-3 py-1">Pending</span>
                        <?php endif; ?>
                    </div>
                    <div class="d-flex justify-content-between align-items-center py-2 border-bottom">
                        <span class="text-secondary small">Listing Status</span>
                        <?php if ($maid['status'] === 'published'): ?>
                            <span class="badge bg-success text-white px-3 py-1">Active</span>
                        <?php elseif ($maid['status'] === 'suspended'): ?>
                            <span class="badge bg-danger text-white px-3 py-1">Suspended</span>
                        <?php else: ?>
                            <span class="badge bg-warning text-dark px-3 py-1"><?= htmlspecialchars(ucfirst($maid['status'] ?? '')) ?></span>
                        <?php endif; ?>
                    </div>
                    <div class="d-flex justify-content-between align-items-center py-2 border-bottom">
                        <span class="text-secondary small">Availability</span>
                        <span class="badge bg-light text-dark border px-3 py-1"><?= htmlspecialchars(ucfirst($maid['availability_status'] ?? 'unknown')) ?></span>
                    </div>
                    <div class="d-flex justify-content-between align-items-center py-2">
                        <span class="text-secondary small">Available From</span>
                        <span class="fw-semibold text-dark"><?= htmlspecialchars($maid['available_from'] ?? 'N/A') ?></span>
                    </div>
                </div>
            </div>
        </div>

        <!-- Personal Info Details Card -->
        <div class="card border-0 shadow-sm" style="border-radius: 16px;">
            <div class="card-header bg-transparent border-0 pt-4 px-4 pb-0">
                <h5 class="card-title fw-bold text-dark mb-0">Personal Profile</h5>
            </div>
            <div class="card-body p-4">
                <div class="d-flex flex-column gap-3">
                    <div>
                        <span class="text-muted d-block small">Gender</span>
                        <span class="fw-semibold text-dark"><?= htmlspecialchars(ucfirst($maid['gender'] ?? 'N/A')) ?></span>
                    </div>
                    <div>
                        <span class="text-muted d-block small">Age</span>
                        <span class="fw-semibold text-dark"><?= $age ? $age . ' years' : 'N/A' ?> <?= !empty($maid['date_of_birth']) ? '<span class="text-secondary fw-normal small">(' . htmlspecialchars($maid['date_of_birth']) . ')</span>' : '' ?></span>
                    </div>
                    <div>
                        <span class="text-muted d-block small">Marital Status</span>
                        <span class="fw-semibold text-dark"><?= htmlspecialchars(ucfirst($maid['marital_status'] ?? 'N/A')) ?></span>
                    </div>
                    <div>
                        <span class="text-muted d-block small">Nationality</span>
                        <span class="fw-semibold text-dark"><?= htmlspecialchars((isRTL() ? ($maid['nationality_name_ar'] ?? $maid['nationality_name'] ?? '') : ($maid['nationality_name'] ?? '')) ?: 'N/A') ?></span>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Right Column: Bio & Professional Specifications -->
    <div class="col-lg-8">
        <!-- Biography & Details Card -->
        <?php if (!empty($maid['bio'])): ?>
            <div class="card border-0 shadow-sm mb-4" style="border-radius: 16px;">
                <div class="card-body p-4">
                    <h5 class="fw-bold text-dark mb-3">Biography</h5>
                    <p class="text-secondary mb-0" style="line-height: 1.6; font-style: italic;">
                        "<?= htmlspecialchars($maid['bio']) ?>"
                    </p>
                </div>
            </div>
        <?php endif; ?>

        <!-- Professional Information -->
        <div class="card border-0 shadow-sm mb-4" style="border-radius: 16px;">
            <div class="card-header bg-transparent border-0 pt-4 px-4 pb-0">
                <h5 class="card-title fw-bold text-dark mb-0">Professional Info</h5>
            </div>
            <div class="card-body p-4">
                <div class="row g-4">
                    <div class="col-md-6 col-lg-4">
                        <span class="text-muted d-block small">Monthly Salary</span>
                        <span class="fs-5 fw-bold text-primary"><?= htmlspecialchars($maid['monthly_salary'] ?? '0') ?> AED</span>
                    </div>
                    <div class="col-md-6 col-lg-4">
                        <span class="text-muted d-block small">Years of Experience</span>
                        <span class="fs-5 fw-bold text-dark"><?= htmlspecialchars($maid['years_experience'] ?? '0') ?> years</span>
                    </div>
                    <div class="col-md-6 col-lg-4">
                        <span class="text-muted d-block small">Working Model</span>
                        <span class="fs-5 fw-bold text-dark"><?= htmlspecialchars((isRTL() ? ($maid['service_model_name_ar'] ?? $maid['service_model_name'] ?? '') : ($maid['service_model_name'] ?? '')) ?: 'N/A') ?></span>
                    </div>
                    <div class="col-md-6 col-lg-4">
                        <span class="text-muted d-block small">Accommodation Preferred</span>
                        <span class="fs-5 fw-semibold text-dark"><?= htmlspecialchars((isRTL() ? ($maid['accommodation_type_name_ar'] ?? $maid['accommodation_type_name'] ?? '') : ($maid['accommodation_type_name'] ?? '')) ?: 'N/A') ?></span>
                    </div>
                    <div class="col-md-6 col-lg-4">
                        <span class="text-muted d-block small">Experience Location</span>
                        <span class="fs-5 fw-semibold text-dark"><?= htmlspecialchars($maid['experience_location'] ?? 'N/A') ?></span>
                    </div>
                    <?php if (!empty($maid['custom_speciality'])): ?>
                        <div class="col-md-6 col-lg-4">
                            <span class="text-muted d-block small">Custom Specialty</span>
                            <span class="fs-5 fw-semibold text-dark"><?= htmlspecialchars($maid['custom_speciality']) ?></span>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </div>

        <!-- Languages & Skills & Specialties Tabs/Sections -->
        <div class="card border-0 shadow-sm mb-4" style="border-radius: 16px;">
            <div class="card-body p-4">
                <div class="row g-4">
                    <!-- Languages -->
                    <div class="col-12 col-md-6 border-end border-light">
                        <h6 class="fw-bold text-dark mb-3"><i class="fas fa-language text-secondary me-2"></i> Languages</h6>
                        <div class="d-flex flex-wrap gap-2">
                            <?php if (empty($languages)): ?>
                                <span class="text-muted small">No languages listed</span>
                            <?php else: ?>
                                <?php foreach ($languages as $lang): ?>
                                    <span class="badge bg-light text-dark border px-3 py-2" style="font-size: 0.9rem;">
                                        <?= htmlspecialchars(isRTL() ? ($lang['name_ar'] ?? $lang['name_en']) : $lang['name_en']) ?>
                                    </span>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </div>
                    </div>

                    <!-- Skills -->
                    <div class="col-12 col-md-6">
                        <h6 class="fw-bold text-dark mb-3"><i class="fas fa-star text-secondary me-2"></i> Skills</h6>
                        <div class="d-flex flex-wrap gap-2">
                            <?php if (empty($skills)): ?>
                                <span class="text-muted small">No skills listed</span>
                            <?php else: ?>
                                <?php foreach ($skills as $skill): ?>
                                    <span class="badge bg-light text-dark border px-3 py-2" style="font-size: 0.9rem;">
                                        <?= htmlspecialchars(isRTL() ? ($skill['name_ar'] ?? $skill['name_en']) : $skill['name_en']) ?>
                                    </span>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </div>
                    </div>

                    <!-- Specialties -->
                    <div class="col-12 mt-4 pt-3 border-top border-light">
                        <h6 class="fw-bold text-dark mb-3"><i class="fas fa-th-large text-secondary me-2"></i> Specialties</h6>
                        <div class="d-flex flex-wrap gap-2">
                            <?php if (empty($specialties)): ?>
                                <span class="text-muted small">No specialties listed</span>
                            <?php else: ?>
                                <?php foreach ($specialties as $spec): ?>
                                    <span class="badge bg-light text-primary border px-3 py-2" style="font-size: 0.9rem;">
                                        <?= htmlspecialchars(isRTL() ? ($spec['name_ar'] ?? $spec['name_en']) : $spec['name_en']) ?>
                                    </span>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Verification Documents -->
        <div class="card border-0 shadow-sm" style="border-radius: 16px;">
            <div class="card-header bg-transparent border-0 pt-4 px-4 pb-0">
                <h5 class="card-title fw-bold text-dark mb-0">Uploaded Verification Documents</h5>
            </div>
            <div class="card-body p-4">
                <div class="table-responsive">
                    <table class="table align-middle">
                        <thead>
                            <tr>
                                <th>Document Type</th>
                                <th>Expiry Date</th>
                                <th>Status</th>
                                <th class="text-end">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php if (empty($documents)): ?>
                                <tr>
                                    <td colspan="4" class="text-center py-4 text-muted">No documents uploaded</td>
                                </tr>
                            <?php else: ?>
                                <?php foreach ($documents as $doc): ?>
                                    <tr>
                                        <td class="fw-bold text-dark"><?= htmlspecialchars($doc['document_type_name'] ?? 'Document') ?></td>
                                        <td><?= htmlspecialchars($doc['expiry_date'] ?? 'N/A') ?></td>
                                        <td>
                                            <?php if ($doc['status'] === 'approved'): ?>
                                                <span class="badge bg-success text-white">Approved</span>
                                            <?php elseif ($doc['status'] === 'rejected'): ?>
                                                <span class="badge bg-danger text-white">Rejected</span>
                                            <?php elseif ($doc['status'] === 'expired'): ?>
                                                <span class="badge bg-dark text-white">Expired</span>
                                            <?php else: ?>
                                                <span class="badge bg-warning text-dark">Pending</span>
                                            <?php endif; ?>
                                        </td>
                                        <td class="text-end">
                                            <a href="<?= htmlspecialchars($doc['file_path']) ?>" target="_blank" class="btn btn-light btn-sm text-primary">
                                                <i class="fas fa-external-link-alt"></i> View File
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<?php include __DIR__ . '/../../layouts/footer.php'; ?>
