{% extends "base.html" %} {% block title %}ROSE - Return on Spend Estimated{% endblock
%} {% block content %}
<section class="roas-section">
  <!-- Key Insights Blurb -->
  <div class="roas-card roas-blurb">
    <div class="blurb-title">💡 Key Insights & Recommendations</div>
    <p style="margin-left: 1.5rem; margin-right: 1.5rem; color: #444">

      <ul style="margin-left: 1.5rem; color: #444">
        <li>
          <strong>Best timing:</strong> Launch campaigns within 5 days of TR on tracks with TADAS ≥ 25, strong LF momentum, and rising TikTok activity for optimal results.
        </li>
        <li>
          <strong>Best setup:</strong> Running on both TikTok and Meta, with targeting by gender and age group (broad but not too narrow), delivers the strongest LF conversion. 
            Avoid focusing too narrowly on 45+ age groups, which has historically underperformed given Spotify’s younger audience.
        </li>
        <li>
          <strong>Key drivers:</strong> The combination of pre-campaign LF lift, TikTok creations lift, and LB growth pre-campaign fuels the biggest incremental LF gains — no single factor alone (and not VTR).
        </li>
      </ul>

    </p>
  </div>
  <h1 class="roas-h1">Campaign Dashboard</h1>
  <div class="roas-card">
    <div class="roas-table-wrap">
      <table class="roas-table" id="roas-table" aria-live="polite">
        <thead>
          <tr>
            <th
              class="sortable"
              data-key="pfn_geo"
              data-type="string"
              role="columnheader"
              tabindex="0"
            >
              Campaign ID
              <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="artist_name"
              data-type="string"
              role="columnheader"
              tabindex="0"
            >
              Artist <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="product_name"
              data-type="string"
              role="columnheader"
              tabindex="0"
            >
              Track
              <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="label_name"
              data-type="string"
              role="columnheader"
              tabindex="0"
            >
              Label
              <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="geo_country"
              data-type="string"
              role="columnheader"
              tabindex="0"
            >
              Market <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="spend_start_str"
              data-type="date"
              role="columnheader"
              tabindex="0"
            >
              Start <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="spend_stop_str"
              data-type="date"
              role="columnheader"
              tabindex="0"
            >
              Stop <span class="sort-indicator" aria-hidden="true"></span>
            </th>
            <th
              class="sortable"
              data-key="status"
              data-type="string"
              role="columnheader"
              tabindex="0"
            >
              Status <span class="sort-indicator" aria-hidden="true"></span>
            </th>
          </tr>
        </thead>
        <tbody>
          {% for r in rows %}
          <tr
            data-href="{{ url_for('main.roas_analytics',
                                    pfn_geo=r.pfn_geo,
                                    q=q, market=markets_selected, label=labels_selected, start=start, stop=stop) }}"
          >
            <td class="mono roas-linklike" data-key="pfn_geo">
              {{ r.pfn_geo }}
            </td>
            <td data-key="artist_name">{{ r.artist_name }}</td>
            <td data-key="product_name">{{ r.product_name }}</td>
            <td data-key="label_name">{{ r.label_name }}</td>
            <td data-key="geo_country">{{ r.geo_country }}</td>
            <td data-key="spend_start_str">{{ r.spend_start_str }}</td>
            <td data-key="spend_stop_str">{{ r.spend_stop_str }}</td>
            <td data-key="status">
                  {% if r.status == "Active" %}
                    <span class="status-dot status-active"></span> Active
                  {% elif r.status == "Paused" %}
                    <span class="status-dot status-paused"></span> Paused
                  {% elif r.status == "Completed" %}
                    <span class="status-dot status-completed"></span> Completed
                  {% else %}
                    {{ r.status }}
                  {% endif %}
                </td>          
          </tr>
          {% endfor %} {% if rows|length == 0 %}
          <tr>
            <td colspan="7" class="empty">No campaigns found.</td>
          </tr>
          {% endif %}
        </tbody>
      </table>
    </div>
  </div>
</section>

<!-- Archive Notice Modal -->
<div id="archiveModal" class="archive-modal">
  <div class="archive-content">
    <h1>🌹 The ROAS Project is currently PAUSED</h1>
    <p>
      The Marketing Effectiveness Tool is not currently under construction or actively updated. While SMEDS is still very excited about the math and science within this tool and 
      while we feel confident this can be a powerful tool for our marketing teammates across SME, at the moment, the data displayed here is outdated
      and this page is preserved here for demonstration and archival purposes only.
    </p>
    <p>
      Feel free to explore, but PLEASE don’t rely on this as a live or up-to-date resource.
    </p>
    <button id="closeModal">Got it</button>
  </div>
</div>

{% endblock %}