<% var pageTitle = 'Kalendar'; var currentPage = 'calendar'; %>
<%- include('partials/header') %>

<h1>Kalendar — <%= monthName %> <%= year %>.</h1>

<div class="btn-row">
  <a href="/calendar?year=<%= prevYear %>&month=<%= prevMonth %>" class="btn btn-secondary">← Prethodni mjesec</a>
  <a href="/calendar?year=<%= nextYear %>&month=<%= nextMonth %>" class="btn btn-secondary">Sljedeći mjesec →</a>
</div>

<% if (apartments.length === 0) { %>
  <div class="panel"><p class="empty-state">Dodaj apartmane da vidiš kalendar.</p></div>
<% } else { %>
  <div class="panel" style="overflow-x:auto;">
    <table class="cal-table">
      <thead>
        <tr>
          <th class="cal-apt-name">Apartman</th>
          <% days.forEach(d => { %><th><%= d %></th><% }) %>
        </tr>
      </thead>
      <tbody>
        <% apartments.forEach(apt => { %>
          <tr>
            <td class="cal-apt-name"><a href="/apartments/<%= apt.id %>"><%= apt.name %></a></td>
            <% days.forEach(d => {
                const dateStr = year + '-' + String(month).padStart(2,'0') + '-' + String(d).padStart(2,'0');
                const booking = byApartment[apt.id].find(b => dateStr >= b.check_in && dateStr < b.check_out);
            %>
              <% if (booking) { %>
                <td class="booked <%= booking.source %>-src" title="<%= booking.guest_name || '' %> (<%= fmt.sourceLabel(booking.source) %>)">
                  <a href="/bookings/<%= booking.id %>/edit" style="color:inherit;">●</a>
                </td>
              <% } else { %>
                <td></td>
              <% } %>
            <% }) %>
          </tr>
        <% }) %>
      </tbody>
    </table>
  </div>
  <p class="subtitle">
    <span class="badge badge-direktno">●</span> Direktno &nbsp;
    <span class="badge badge-airbnb">●</span> Airbnb &nbsp;
    <span class="badge badge-booking">●</span> Booking.com
  </p>
<% } %>

<%- include('partials/footer') %>
