<?php use App\Helpers\Helper; ?>
<section class="page-header">
  <div class="container">
    <h1 class="fw-700 mb-2"><?= Helper::e($property['name']) ?></h1>
    <nav aria-label="breadcrumb"><ol class="breadcrumb mb-0"><li class="breadcrumb-item"><a href="<?= APP_URL ?>/">Home</a></li><li class="breadcrumb-item"><a href="<?= APP_URL ?>/residences">Residences</a></li><li class="breadcrumb-item active"><?= Helper::e($property['name']) ?></li></ol></nav>
  </div>
</section>

<section class="py-5">
  <div class="container">
    <div class="row g-5">
      <div class="col-lg-8">
        <!-- Gallery -->
        <div class="mb-4 rounded-3 overflow-hidden bg-light" style="height:380px">
          <img src="https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=900&q=70" class="w-100 h-100" style="object-fit:cover" alt="<?= Helper::e($property['name']) ?>">
        </div>

        <!-- Description -->
        <div class="mb-4">
          <h3 class="fw-700 mb-3">About This Property</h3>
          <p class="text-muted"><?= nl2br(Helper::e($property['description']??'No description available.')) ?></p>
        </div>

        <!-- Amenities -->
        <?php if (!empty($amenities)): ?>
        <div class="mb-4">
          <h4 class="fw-700 mb-3">Amenities</h4>
          <div class="d-flex flex-wrap gap-2">
            <?php foreach ($amenities as $a): ?>
            <span class="amenity-pill"><i class="bi bi-check-circle-fill text-success me-1"></i><?= Helper::e($a['name']) ?></span>
            <?php endforeach; ?>
          </div>
        </div>
        <?php endif; ?>

        <!-- Available Units -->
        <?php $availableUnits = array_filter($units, fn($u)=>$u['status']==='available'); ?>
        <?php if (!empty($availableUnits)): ?>
        <div id="available-units">
          <h4 class="fw-700 mb-3">Available Units</h4>
          <div class="row g-3">
            <?php foreach ($availableUnits as $unit): ?>
            <div class="col-md-6">
              <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                  <div class="d-flex justify-content-between mb-2">
                    <h6 class="fw-700 mb-0">Unit <?= Helper::e($unit['unit_number']) ?></h6>
                    <span class="badge bg-success">Available</span>
                  </div>
                  <div class="d-flex gap-3 text-muted small mb-3">
                    <span><i class="bi bi-door-closed me-1"></i><?= ucfirst($unit['unit_type']) ?></span>
                    <span><i class="bi bi-moon me-1"></i><?= $unit['bedrooms'] ?> Bed</span>
                    <span><i class="bi bi-droplet me-1"></i><?= $unit['bathrooms'] ?> Bath</span>
                    <?php if ($unit['floor_size']): ?><span><i class="bi bi-aspect-ratio me-1"></i><?= $unit['floor_size'] ?>m²</span><?php endif; ?>
                  </div>
                  <div class="d-flex gap-2 flex-wrap mb-3">
                    <?php if ($unit['is_furnished']): ?><span class="badge bg-light text-dark">Furnished</span><?php endif; ?>
                    <?php if ($unit['has_parking']): ?><span class="badge bg-light text-dark">Parking</span><?php endif; ?>
                    <?php if ($unit['has_wifi']): ?><span class="badge bg-light text-dark">WiFi</span><?php endif; ?>
                    <?php if ($unit['has_ac']): ?><span class="badge bg-light text-dark">A/C</span><?php endif; ?>
                  </div>
                  <!-- Pricing breakdown -->
                  <?php
                    $mo  = $unit['monthly_rent'];
                    $wk  = $mo / 4;
                    $dy  = $mo / 30;
                  ?>
                  <div class="d-flex gap-2 mb-3">
                    <div class="flex-fill text-center rounded-2 py-2" style="background:#f0f9ff;border:1px solid #bae6fd">
                      <div class="fw-700 text-primary" style="font-size:.85rem"><?= Helper::money($dy) ?></div>
                      <div class="text-muted" style="font-size:.7rem">/day</div>
                    </div>
                    <div class="flex-fill text-center rounded-2 py-2" style="background:#f0fdf4;border:1px solid #bbf7d0">
                      <div class="fw-700 text-success" style="font-size:.85rem"><?= Helper::money($wk) ?></div>
                      <div class="text-muted" style="font-size:.7rem">/week</div>
                    </div>
                    <div class="flex-fill text-center rounded-2 py-2" style="background:#faf5ff;border:1px solid #e9d5ff">
                      <div class="fw-700 text-purple" style="font-size:.85rem;color:#7c3aed"><?= Helper::money($mo) ?></div>
                      <div class="text-muted" style="font-size:.7rem">/month</div>
                    </div>
                  </div>
                  <div class="d-flex justify-content-end">
                    <a href="<?= APP_URL ?>/book/<?= $unit['id'] ?>" class="btn btn-primary btn-sm px-4"><i class="bi bi-calendar-check me-1"></i>Book Now</a>
                  </div>
                </div>
              </div>
            </div>
            <?php endforeach; ?>
          </div>
        </div>
        <?php else: ?>
        <div class="alert alert-warning"><i class="bi bi-info-circle me-2"></i>No units currently available. <a href="<?= APP_URL ?>/contact">Contact us</a> to join the waitlist.</div>
        <?php endif; ?>
      </div>

      <!-- Sidebar -->
      <div class="col-lg-4">
        <div class="card border-0 shadow-sm mb-4 sticky-top" style="top:80px">
          <div class="card-body">
            <div class="mb-3">
              <div class="small text-muted">Starting from</div>
              <div class="property-price"><?= $minRent ? Helper::money($minRent) : 'Price on request' ?><span>/month</span></div>
            </div>
            <div class="row g-2 small text-muted mb-3">
              <div class="col-6"><i class="bi bi-buildings me-1"></i><?= $property['total_units']??0 ?> total units</div>
              <div class="col-6 text-success"><i class="bi bi-check-circle me-1"></i><?= count($availableUnits) ?> available</div>
              <div class="col-6"><i class="bi bi-layers me-1"></i><?= $property['total_floors']??1 ?> floors</div>
              <div class="col-6"><i class="bi bi-geo-alt me-1"></i><?= Helper::e($property['region_name']??'') ?></div>
            </div>
            <?php if (!empty($availableUnits)): ?>
            <a href="#available-units" class="btn btn-primary w-100 mb-2"><i class="bi bi-calendar-check me-2"></i>Book a Unit</a>
            <?php endif; ?>
            <a href="<?= APP_URL ?>/contact" class="btn btn-outline-primary w-100"><i class="bi bi-chat me-2"></i>Contact Us</a>
          </div>
        </div>

        <!-- Location -->
        <div class="card border-0 shadow-sm">
          <div class="card-body">
            <h6 class="fw-700 mb-2"><i class="bi bi-geo-alt me-2 text-primary"></i>Location</h6>
            <p class="small text-muted mb-0"><?= Helper::e($property['address']??'') ?></p>
            <?php if ($property['area']): ?><p class="small text-muted"><?= Helper::e($property['area']) ?></p><?php endif; ?>
            <?php if ($property['region_name']): ?><span class="badge bg-primary"><?= Helper::e($property['region_name']) ?></span><?php endif; ?>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
