/* primary-source.css — shared styles for the primary-source document pages.
   Light "option B" look: cream reading surfaces, dark text on light, shared
   tokens only (no hardcoded colours), the --fs-* size scale, colour-as-status.
   Loaded by every primary-sources/<folder>/doc-*.html (after main.css). */

body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--text);
  font-size:var(--fs-body);
  line-height:1.6;
}

/* ── Back bar + hero ─────────────────────────────────────────── */
.doc-back-bar{
  background:var(--cream-panel);
  border-bottom:1px solid var(--grey-200);
  padding:6px 36px;
}
.doc-back-bar a{
  font-family:var(--font-mono);
  font-size:var(--fs-label);
  letter-spacing:0.08em;
  color:var(--navy);
  text-decoration:none;
}
.doc-back-bar a:hover{text-decoration:underline;}

.page-hero{
  background:transparent;
  border-bottom:3px solid var(--gold);
  padding:40px 40px 32px;
}
.main-content{max-width:1200px;margin:0 auto;padding:40px 40px 80px;}
@media(max-width:700px){.main-content{padding:24px 20px 60px;}.page-hero{padding:24px 20px 20px;}}

/* ── Metadata grid ───────────────────────────────────────────── */
.meta-panel{
  background:var(--cream-raised);
  border:1px solid var(--border);
  border-radius:3px;
  padding:18px 24px;
  margin-bottom:28px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px 24px;
}
@media(max-width:640px){.meta-panel{grid-template-columns:1fr 1fr;}}
.meta-label{
  font-family:var(--font-mono);
  font-size:var(--fs-label);
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin-bottom:3px;
}
.meta-value{font-size:var(--fs-fine);color:var(--text);font-weight:500;}

.source-note{
  font-size:var(--fs-fine);
  color:var(--text-muted);
  font-style:italic;
  margin-bottom:24px;
  padding-left:14px;
  border-left:2px solid var(--gold);
  line-height:1.65;
}

/* ── Reading surfaces (summary + translation) ────────────────── */
.summary,
.translation-body{
  font-size:var(--fs-body);
  color:var(--navy);
  line-height:1.8;
  background:var(--cream-raised);
  border:1px solid var(--border);
  border-radius:3px;
  padding:24px 30px;
  max-width:40rem;
}
.summary{margin-bottom:32px;}

.pdf-embed-wrap{margin-bottom:12px;}
.pdf-fallback{font-size:var(--fs-fine);color:var(--text-muted);}
.pdf-fallback a{color:var(--gold);}

/* ── Tab bar ─────────────────────────────────────────────────── */
.doc-tab-bar{display:flex;border-bottom:2px solid var(--border);margin-bottom:28px;}
.doc-tab-btn{
  background:none;border:none;border-bottom:3px solid transparent;
  padding:10px 20px;
  font-family:var(--font-mono);
  font-size:var(--fs-label);
  font-weight:500;
  letter-spacing:0.05em;
  text-transform:uppercase;
  color:var(--text-muted);
  cursor:pointer;white-space:nowrap;transition:color 0.12s;margin-bottom:-2px;
}
.doc-tab-btn:hover{color:var(--navy);}
.doc-tab-btn.active{color:var(--navy);border-bottom-color:var(--gold);font-weight:600;}
.doc-tab-panel{display:none;}
.doc-tab-panel.active{display:block;}

/* ── Translation notice (machine-translation caveat = status/amber) ── */
.translation-notice{
  background:var(--status-partial-bg,#FBE9A8);
  border:1px solid #E8D89A;
  border-left:3px solid var(--gold);
  border-radius:3px;
  padding:12px 16px;
  font-size:var(--fs-fine);
  color:#5C4A00;
  line-height:1.6;
  margin-bottom:24px;
}

/* ── Translation body internals ──────────────────────────────── */
.translation-body h2{
  font-family:var(--font-mono);
  font-size:var(--fs-label);
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--navy);
  margin:20px 0 8px;
}
.translation-body p{margin-bottom:18px;}
.translation-body ol{padding-left:22px;margin-bottom:12px;}
.translation-body ol li{margin-bottom:6px;}
.translation-body table{width:100%;border-collapse:collapse;margin:16px 0;font-size:var(--fs-fine);}
.translation-body th{
  background:var(--navy);color:#fff;padding:8px 12px;text-align:left;
  font-family:var(--font-mono);font-size:var(--fs-label);letter-spacing:0.1em;
  text-transform:uppercase;white-space:nowrap;
}
.translation-body td{padding:8px 12px;border-bottom:1px solid var(--border);vertical-align:top;}
.translation-body tr:nth-child(even) td{background:var(--cream);}

/* ── Research-integrity footer strip ─────────────────────────── */
.doc-integrity{
  max-width:1200px;margin:0 auto;padding:0 40px;
}
.doc-integrity-inner{border-top:1px solid var(--border);padding-top:1.25rem;margin-top:2rem;}
.doc-integrity-label{
  font-family:var(--font-mono);font-size:var(--fs-label);text-transform:uppercase;
  letter-spacing:0.12em;color:var(--text-muted);margin-bottom:0.4rem;
}
.doc-integrity a{font-family:var(--font-mono);font-size:var(--fs-label);color:var(--navy);text-decoration:none;}
.doc-integrity a:hover{text-decoration:underline;}
.doc-integrity p{font-family:var(--font-mono);font-size:var(--fs-label);color:var(--text-muted);margin-top:0.5rem;}

/* ── Extra components used by gallery-style docs (e.g. mobilisation/doc-e2) ── */
.summary p{margin-bottom:12px;}
.summary p:last-child{margin-bottom:0;}

.section-divider{border:none;border-top:1px solid var(--border);margin:28px 0;}
.section-heading{
  font-family:var(--font-mono);font-size:var(--fs-label);letter-spacing:0.16em;
  text-transform:uppercase;color:var(--text-muted);margin-bottom:18px;
}

.photo-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px;}
@media(max-width:900px){.photo-gallery{grid-template-columns:repeat(2,1fr);}}
@media(max-width:500px){.photo-gallery{grid-template-columns:1fr;}}
.gallery-figure{margin:0;display:flex;flex-direction:column;}
.gallery-figure img{
  width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:2px;display:block;
  border:1px solid var(--border);
}
.gallery-caption{
  font-family:var(--font-mono);font-size:var(--fs-label);color:var(--text-muted);
  padding:6px 0 0;font-style:italic;line-height:1.5;
}

.doc-actions{margin-top:32px;padding-top:20px;border-top:1px solid var(--border);display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.doc-file-label{
  font-family:var(--font-mono);font-size:var(--fs-label);color:var(--text-muted);
  background:var(--cream-raised);padding:8px 12px;border-radius:2px;border:1px solid var(--border);
}
.btn-primary{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--gold);color:#fff;
  font-family:var(--font-mono);font-size:var(--fs-fine);font-weight:500;
  padding:9px 18px;border-radius:2px;text-decoration:none;transition:background 0.15s;
}
.btn-primary:hover{background:var(--navy);}