{% extends "base.html" %}
{% import "_macros.html" as m %}

{% block title %}{{ ts_name }}{% if ts_description %} — {{ ts_description }}{% endif %} — {{ cruise }}{% endblock %}
{% block masthead_title %}{{ ts_name }}{% if ts_description %} — {{ ts_description }}{% endif %}{% endblock %}
{% block masthead_type %}Timeseries{% endblock %}

{% block head_extra %}
<style>
/* Timeseries page */
.topbar {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 1.25rem; font-size: 0.85rem;
}
.breadcrumb a { color: var(--ocean); text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }
.breadcrumb .sep { color: var(--muted); margin: 0 0.25rem; }
.cast-pill {
  display: inline-block; background: #4a6fa5; color: #fff;
  padding: 0.2rem 0.6rem; border-radius: 999px;
  font-size: 0.78rem; text-decoration: none; margin: 0.1rem 0.05rem;
}
.cast-pill:hover { opacity: 0.85; }
</style>
{% endblock %}

{% block topbar %}
<div class="topbar">
  <nav class="breadcrumb">
    <a href="{{ nav_prefix }}index.html">Index</a>
    <span class="sep">›</span>
    <a href="{{ nav_prefix }}timeseries.html">Timeseries</a>
    <span class="sep">›</span>
    <span>{{ ts_name }}{% if ts_description %} — {{ ts_description }}{% endif %}</span>
  </nav>
  <div class="nav-btns">
    {% if prev_name %}<a class="btn-nav" href="timeseries_{{ prev_name }}.html">← {{ prev_name }}</a>{% endif %}
    {% if next_name %}<a class="btn-nav" href="timeseries_{{ next_name }}.html">{{ next_name }} →</a>{% endif %}
  </div>
</div>
{% endblock %}

{% block masthead_meta %}
  <dl class="meta-grid">
    <div><dt>Cruise</dt><dd>{{ cruise }}</dd></div>
    <div><dt>Ship</dt><dd>{{ ship }}</dd></div>
    <div><dt>CTD casts</dt><dd>{{ n_casts }}</dd></div>
    <div><dt>Start</dt><dd>{{ time_start_str }}</dd></div>
    <div><dt>End</dt><dd>{{ time_end_str }}</dd></div>
    <div><dt>Duration</dt><dd>{{ duration_str }}</dd></div>
  </dl>
{% endblock %}

{% block content %}
<div style="margin-bottom:1rem;">
  {% for cn in cast_nums %}
  <a class="cast-pill" href="{{ nav_prefix }}casts/cast_{{ cn }}.html">{{ cn }}</a>
  {% endfor %}
</div>

{{ m.report_body(report, center_sections=["map"]) }}

{{ js_top_links | safe }}
{% endblock %}