{% extends "base.html" %}

{% block title %}Embeddable Calendar Widget{% endblock %}

{% block content %}
<section class="embed-section">
  <div class="container-fluid px-md-4 px-lg-5">
    <div class="embed-shell-card">
      <div class="embed-header d-flex flex-column flex-md-row justify-content-between gap-3 align-items-md-center">
        <div>
          <span class="eyebrow-pill">Embeddable widget</span>
          <h1 class="section-title mb-2">Where to find us</h1>
          <p class="section-copy mb-0">Tap a date to see the event name, time window, and event link.</p>
        </div>
        <a class="btn btn-ghost" href="{% url 'calendar_page' %}" target="_blank" rel="noopener">Open full page</a>
      </div>
      {% include "core/includes/calendar_widget.html" with calendar_variant="embed" %}
    </div>
  </div>
</section>
{% endblock %}