/* =============================================================================
   Agenda — a goal-bearing entity's "scheduled-by" clocks, drawn as a sequence.
   Renders on the campaign + standalone-adventure faction detail pages via
   world-entity-web's props-only `agenda-section`.
   See docs/3_design/architecture/faction-agenda-clocks.md.

   The segment bar itself (.clock-progress / .clock-segment) is NOT redefined
   here — it lives in sessions.css and is globally loaded.
   ============================================================================= */

.agenda-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-inline);
}

.agenda-header h3 {
  margin: 0;
}

/* An agenda is progressive — Cairn 2e's "3-5 progressive goals", Mausritter's
   goals in ascending mark cost. The ordinal is the point, so it stays visible. */
.agenda-goals {
  list-style: decimal;
  margin: var(--gap-stack) 0 0;
  padding-left: var(--gap-section);
  display: flex;
  flex-direction: column;
  gap: var(--gap-group);
}

.agenda-goal::marker {
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}

.agenda-goal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-inline);
  flex-wrap: wrap;
}

.agenda-goal-title {
  font-weight: var(--weight-semibold);
  color: var(--text-primary);
}

a.agenda-goal-title {
  color: var(--accent-red);
  text-decoration: none;
}

a.agenda-goal-title:hover {
  text-decoration: underline;
}

.agenda-goal-detail,
.agenda-goal-consequence {
  margin: var(--gap-hairline) 0 0;
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  line-height: var(--leading-snug);
}

/* A clock whose fill has no stated consequence is a deadline with no teeth —
   when one IS stated, it is the sharpest thing on the row. */
.agenda-goal-consequence {
  color: var(--text-muted);
}

/* Per-goal rival target (Mausritter SRD:1505). Sits under the goal it qualifies,
   quieter than the goal itself — it is a modifier on the roll, not the goal. */
.agenda-goal-target {
  display: flex;
  align-items: center;
  gap: var(--gap-inline);
  margin-top: var(--gap-hairline);
  font-size: var(--fs-sm);
  color: var(--text-secondary);
}

.agenda-goal-target-name { color: var(--text-primary); }

.agenda-goal-target select {
  font-size: var(--fs-sm);
  padding: 0.15rem 0.35rem;
}

/* Per-goal relevance (SRD:1505). Reads as a quiet statement of fact by default
   ("All 3 resources count") because that IS the default — a GM who never opens
   it is not behind on anything. */
.agenda-goal-relevance { margin-top: var(--gap-hairline); }

.agenda-relevance-toggle {
  background: none;
  border: none;
  padding: 0;
  font-size: var(--fs-sm);
  color: var(--text-secondary);
  cursor: pointer;
  text-decoration: underline dotted;
}

.agenda-relevance-picker {
  display: flex;
  flex-direction: column;
  gap: var(--gap-hairline);
  margin-top: var(--gap-tight);
  padding-left: var(--gap-inline);
}

.agenda-relevance-option {
  display: flex;
  align-items: center;
  gap: var(--gap-inline);
  font-size: var(--fs-sm);
  color: var(--text-secondary);
}

/* The between-sessions roll, shown as arithmetic. A table on purpose: the GM is
   checking a sum, and columns are how a sum is checked. */
.goal-roll-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--gap-inline);
}

.goal-roll-header h3 { margin: 0; }

.goal-roll-table { margin-top: var(--gap-stack); }

.goal-roll-table td,
.goal-roll-table th { text-align: left; }

.agenda-header-actions {
  display: flex;
  align-items: center;
  gap: var(--gap-inline);
}

/* Completion effects (SRD:1510-1512). Reads as an invitation, not an alarm —
   both effects are the GM's call in RAW, so this offers rather than warns. */
.agenda-goal-completion {
  margin-top: var(--gap-tight);
  padding: var(--gap-tight);
  border: 1px solid var(--border-primary);
  border-radius: var(--card-corner);
  background: var(--bg-secondary);
  display: flex;
  flex-direction: column;
  gap: var(--gap-tight);
}

.agenda-completion-head {
  display: flex;
  align-items: center;
  gap: var(--gap-inline);
}

.agenda-completion-gain,
.agenda-completion-loss {
  display: flex;
  align-items: center;
  gap: var(--gap-inline);
  flex-wrap: wrap;
  font-size: var(--fs-sm);
}

.agenda-completion-dismiss {
  align-self: flex-start;
  background: none;
  border: none;
  padding: 0;
  font-size: var(--fs-sm);
  color: var(--text-muted);
  cursor: pointer;
  text-decoration: underline dotted;
}