/* ===============================
   custom_ei.css — Expeditionary Innovation THEME.

   All structure and components live in base.css, which is the canonical
   shared stylesheet. This file holds the seven brand variables plus the
   handful of components that exist only in this book.

   Load order in _quarto.yml: base.css FIRST, then this file (so these
   values override the fallbacks declared in base.css).

   PALETTE (decided 2026-07-30): azure cerulean, hue 203. This warms the old
   #3774B7 cool blue toward cerulean while staying seven degrees bluer than
   Make the Call's #007BA7 — distinct on sight, unmistakably the same family.
   Contrast 6.23 on white, which passes AA for body text and not merely for
   large text. Gold and the ink/muted grays are shared family anchors.

   The figure fill in Choose_People_part.qmd's R chunk hardcodes the primary;
   it must be changed with these values, and its freeze re-rendered.
   =============================== */

:root {
  --brand-primary:      #0A659E;  /* Azure cerulean */
  --brand-primary-dark: #085381;  /* Darker azure (hover/active) */
  --brand-secondary:    #0B5E86;  /* Deeper azure — the banner gradient's far end */
  --brand-accent:       #E3A008;  /* Gold (shared across the family) */
  --brand-muted:        #6B7280;  /* Muted gray text (shared) */
  --brand-bg-tint:      #E7F2F8;  /* Soft azure tint */
  --brand-text:         #1F2937;  /* Rich gray body text (shared) */
}

/* ===============================
   EI-only components

   These are not in base.css because no sibling book uses them yet. Both are
   candidates for promotion into the canonical file: worksheet fields in
   particular are a toolkit pattern that Is This Worth Doing? will want.
   =============================== */

/* ---------- Worksheet fill-in fields ----------
   Used throughout the Experimentation Toolkit so a reader can complete a
   guide on the page. Deliberately color-free: a rule the reader writes on. */
.blank {
  display: inline-block;
  border-bottom: 1.5px solid #444;
  min-width: 8ch;
  line-height: 1.2;
  padding-bottom: 0.15em;
  background-color: transparent;
  vertical-align: baseline;
}

.blank-short  { min-width: 6ch;  }
.blank-medium { min-width: 12ch; }
.blank-long   { min-width: 20ch; }
.blank-fill   { background-color: #f5f5f5; }

/* ---------- Method header tick ----------
   The accent bar marking each exploratory method in Explore the Community
   (Conversation, Observation, Role Playing, Surveys). */
h2.method-header,
h3.method-header {
  position: relative;
  padding-left: 0.85rem;
}

h2.method-header::before,
h3.method-header::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.3em;
  width: 6px;
  height: 1.2em;
  background: var(--brand-primary);
  border-radius: 3px;
}

@media (max-width: 768px) {
  h2.method-header::before,
  h3.method-header::before { width: 5px; }
}
