{# Premium Trial Banner (Spec 035)
   Included in scheduling pages when store is on trial.
   Uses trialBanner context from SchedulingPageController.

   Variants:
   - standard (>7 days): Info banner, dismissible per session
   - urgent (<=7 days): Warning banner, NOT dismissible, with CTA
   - critical (<=1 day): Danger banner, NOT dismissible, with CTA

   Fix #2 (Codex review): CTA uses button with JS POST instead of <a> GET.
   Fix #6 (Codex review): CTA only shown to owners (isOwner context).
#}
{% if trialBanner is defined and trialBanner is not null %}
<div id="premiumTrialBanner"
     class="alert {{ trialBanner.variant == 'critical' ? 'alert-danger' : (trialBanner.variant == 'urgent' ? 'alert-warning' : 'alert-info') }} d-flex align-items-center justify-content-between mb-3 {{ trialBanner.dismissible ? 'alert-dismissible' : '' }}"
     role="alert">
    <div>
        {% if trialBanner.variant == 'critical' %}
            <i class="fa-solid fa-triangle-exclamation me-2"></i>
        {% elseif trialBanner.variant == 'urgent' %}
            <i class="fa-solid fa-clock me-2"></i>
        {% else %}
            <i class="fa-solid fa-info-circle me-2"></i>
        {% endif %}
        <span>{{ trialBanner.message }}</span>
    </div>

    <div class="d-flex align-items-center gap-2">
        {% if trialBanner.isOwner is defined and trialBanner.isOwner %}
            {% if trialBanner.variant == 'standard' %}
                <button type="button"
                        class="btn btn-sm btn-outline-primary"
                        id="trialBannerSubscribeBtn"
                        onclick="premiumSubscribeFromBanner()">
                    <i class="fa-solid fa-star me-1"></i> Enable Premium
                </button>
            {% else %}
                <button type="button"
                        class="btn btn-sm {{ trialBanner.variant == 'critical' ? 'btn-danger' : 'btn-warning' }}"
                        id="trialBannerSubscribeBtn"
                        onclick="premiumSubscribeFromBanner()">
                    Subscribe Now
                </button>
            {% endif %}
        {% endif %}

        {% if trialBanner.dismissible %}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"
                    onclick="sessionStorage.setItem('premiumTrialBannerDismissed', '1')"></button>
        {% endif %}
    </div>
</div>

{% if trialBanner.isOwner is defined and trialBanner.isOwner %}
<script>
var _bannerCsrfToken = '{{ csrf_token }}';
function premiumSubscribeFromBanner() {
    if (!confirm('Enable Premium Scheduling for $30/month?\n\nKeep all scheduling features active — $30/mo will be added to your BuyerKiosk bill.')) return;
    var btn = document.getElementById('trialBannerSubscribeBtn');
    var originalText = btn.textContent;
    btn.disabled = true;
    btn.innerHTML = '<i class="fa-solid fa-spinner fa-spin"></i>';
    fetch('/api/{{ typeNum }}/premium/activate', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json', 'X-CSRF-Token': _bannerCsrfToken }
    }).then(function(r) { return r.json(); })
      .then(function(data) {
          if (data.csrfToken) _bannerCsrfToken = data.csrfToken;
          if (data.success) { window.location.reload(); }
          else { alert(data.message || 'Could not activate. Please try again.'); btn.disabled = false; btn.textContent = originalText; }
      }).catch(function() { alert('Network error. Please try again.'); btn.disabled = false; btn.textContent = originalText; });
}
</script>
{% endif %}

{% if trialBanner.dismissible %}
<script>
(function() {
    if (sessionStorage.getItem('premiumTrialBannerDismissed') === '1') {
        var banner = document.getElementById('premiumTrialBanner');
        if (banner) banner.remove();
    }
})();
</script>
{% endif %}
{% endif %}