/* ============================================================
   bio-y11-m3-sa.css — HSC Biology Y11 Module 3 · Biological Diversity
   Per-module overrides for lessonNN.sa.html files.
   Loaded AFTER senior-adventure.css + senior-adventure-microtasks.css
   + senior-adventure-patterns.css.
   ============================================================ */

/* ── Module 3 · Biological Diversity — forest green ─────── */
body.sa.bio-m3-bg {
  --sa-accent:        #16a34a;  /* green-600 */
  --sa-accent-soft:   #bbf7d0;
  --sa-accent-ink:    #14532d;
  --sa-hero-glow:     radial-gradient(620px 320px at 8% 92%, rgba(22,163,74,0.25) 0%, transparent 62%);
  background:
    radial-gradient(ellipse 1100px 600px at 92% 6%, rgba(22,163,74,0.14) 0%, transparent 65%),
    radial-gradient(ellipse 850px 500px at 4% 90%, rgba(20,83,45,0.10) 0%, transparent 65%),
    linear-gradient(160deg, #f0fdf4 0%, #ecfdf5 40%, #f0fdfa 100%);
  min-height: 100vh;
}

body.sa.bio-m3-bg .sa-card,
body.sa.bio-m3-bg .sa-worked {
  border-top: 3px solid var(--sa-accent);
  box-shadow: 0 10px 30px -18px rgba(20,40,30,0.35);
}
body.sa.bio-m3-bg .sa-card.tint-rose { background: linear-gradient(180deg, rgba(245,220,225,0.92) 0%, rgba(255,255,255,0.92) 80%); }
body.sa.bio-m3-bg .sa-card.tint-teal { background: linear-gradient(180deg, rgba(204,251,241,0.92) 0%, rgba(255,255,255,0.92) 80%); }
body.sa.bio-m3-bg .sa-card.tint-gold { background: linear-gradient(180deg, rgba(254,243,199,0.92) 0%, rgba(255,255,255,0.92) 80%); }
body.sa.bio-m3-bg .sa-card.tint-green { background: linear-gradient(180deg, rgba(187,247,208,0.80) 0%, rgba(255,255,255,0.92) 80%); }

/* ── Book-notes accordion ────────────────────────────────── */
.sa-book-notes {
  margin: 10px 0 0; padding: 14px 18px;
  background: var(--sa-bg-warm); border: 1.5px dashed var(--sa-rule);
  border-radius: var(--sa-r-sm); font-size: 13px;
}
.sa-book-notes summary {
  font-weight: 700; cursor: pointer; color: var(--sa-ink);
  font-family: var(--sa-display); font-size: 13px; list-style: none;
}
.sa-book-notes summary::-webkit-details-marker { display: none; }
.sa-book-notes summary::before { content: "📝 "; }
.sa-book-notes[open] summary { margin-bottom: 8px; }
.sa-book-notes ul { margin: 0 0 0 18px; padding: 0; color: var(--sa-ink-soft); line-height: 1.6; }
.sa-book-notes li { margin-bottom: 4px; }

/* ── Mode-button polish ──────────────────────────────────── */
.sa-mode-btn.active {
  background: var(--sa-ink) !important;
  color: var(--sa-bg-warm) !important;
  border-color: var(--sa-ink) !important;
}

/* ── SAQ taxonomy labels ─────────────────────────────────── */
.sa-bloom, .sa-band {
  display: inline-block; padding: 2px 8px; border-radius: 6px;
  font-size: 10.5px; font-weight: 700; font-family: var(--sa-display);
  text-transform: uppercase; letter-spacing: 0.08em;
}
.sa-bloom.understand { background: #dbeafe; color: #1e40af; }
.sa-bloom.apply      { background: #dcfce7; color: #166534; }
.sa-bloom.analyse    { background: #fef3c7; color: #92400e; }
.sa-bloom.evaluate   { background: #fce7f3; color: #9d174d; }
.sa-bloom.create     { background: #ede9fe; color: #5b21b6; }
.sa-band.band-3      { background: #e0e7ff; color: #3730a3; }
.sa-band.band-4      { background: #d1fae5; color: #065f46; }
.sa-band.band-5      { background: #fef3c7; color: #92400e; }
.sa-band.band-6      { background: #fce7f3; color: #9d174d; }
.sa-marks            { font-size: 11px; color: var(--sa-muted); margin-left: 4px; font-weight: 600; }

/* ── Textarea (sa-saq-input) ─────────────────────────────── */
.sa-saq-input {
  width: 100%; min-height: 80px; padding: 14px 16px;
  background: linear-gradient(180deg, rgba(255,250,228,0.96) 0%, rgba(252,242,210,0.92) 100%);
  border: 1.5px solid var(--sa-rule); border-radius: var(--sa-r);
  font-family: var(--sa-body); font-size: 14px; color: var(--sa-ink);
  resize: vertical; outline: none; box-sizing: border-box;
  box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset, 0 1px 2px rgba(120,80,30,0.06) inset;
  transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.sa-saq-input::placeholder { color: rgba(120,90,40,0.45); font-style: italic; }
.sa-saq-input:focus {
  border-color: var(--sa-gold-deep, #b08a3a);
  box-shadow: 0 0 0 3px rgba(217,166,74,0.18), 0 1px 0 rgba(255,255,255,0.6) inset;
}

/* ── MC score banner ─────────────────────────────────────── */
.mc-score-banner {
  margin: 12px 0; padding: 10px 14px;
  background: var(--sa-bg-warm); border: 1.5px solid var(--sa-rule);
  border-radius: var(--sa-r-sm); font-family: var(--sa-display);
  font-weight: 600; color: var(--sa-ink); display: none;
}
.mc-score-banner.show { display: block; }
