/*----------------------------------------------------------------------
  _theme.scss -- one theme, shared by all seven day documents.

  Referenced from each day's YAML as:

      format:
        html:
          theme: [cosmo, ../_theme.scss]

  It is the exemplar's teaching.css (tuned for projecting in a room and
  reading alone on a laptop afterwards) plus the runtime/timing badge and
  break-banner conventions the ERGM and SAOM sessions established, plus
  dark-mode fallbacks so nothing goes invisible on a student's laptop.
  Everything the four new days and the adopted three days need lives here.
----------------------------------------------------------------------*/

/*-- scss:defaults --*/

// Body big enough to read from the back row without ctrl-+, and on a
// laptop wedged beside a Zoom window. Bumped above the Quarto default.
$font-size-root:       17px;
$code-block-font-size: 0.92em;
$body-color:           #000000;
$link-color:           #18453B;


/*-- scss:rules --*/

body { line-height: 1.6; }
a:hover { color: #008208; }
h1, h2, h3 { color: #18453B; }

/* Readable measure. Wide content scrolls inside its own box (below);
   the page body itself must never scroll sideways. */
main { max-width: 48rem; }
body { overflow-x: hidden; }

/* Code is the thing students actually stare at. Give it room. */
pre > code.sourceCode { line-height: 1.5; }
div.sourceCode { margin: 1.1em 0; }

/* A 40-line summary() dump should not push the next section off the
   bottom of the screen. Cap it and let it scroll. */
.cell-output pre {
  max-height: 22em;
  overflow-y: auto;
  font-size: 0.88rem;
}

/* Section starts are the landmarks you navigate by when scrolling live. */
h2 {
  border-top: 3px solid #7BBD00;
  padding-top: .7em;
  margin-top: 2.2em;
}

/* Exercises must be unmissable when you scroll past them. */
.callout.callout-style-default.callout-tip {
  border-left: 6px solid #008934;
}

/* Tables: model output is read across rows, so stripe them. */
table { font-size: 0.95rem; }
thead { border-bottom-color: #18453B; }
tbody tr:nth-child(odd) { background: rgba(24,69,59,0.045); }

/* ---- Timing annotation: a right-floated clock badge on a heading, e.g.
        ## The social relations model [~35 min]{.tm}
        marks how long a block should take, for pacing a live 3-hour room. */
.tm {
  float: right;
  font-family: var(--bs-font-monospace, monospace);
  font-size: 0.62em;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #18453B;
  background: rgba(123,189,0,0.14);
  border: 1px solid #7BBD00;
  border-radius: 999px;
  padding: 0.15em 0.7em;
  margin-top: 0.55em;
  white-space: nowrap;
}

/* ---- Runtime badge: inline in prose, so nobody thinks a 3-minute fit
        has hung. Written as, e.g.  [precomputed]{.rt .rt-precmp}. ---- */
.rt {
  display: inline-block;
  font-family: var(--bs-font-monospace, monospace);
  font-size: 0.78em;
  font-weight: 600;
  border-radius: 4px;
  padding: 0.08em 0.5em;
  margin-left: 0.35em;
  border: 1px solid transparent;
}
.rt-live   { background: rgba(123,189,0,0.16); color: #18453B; border-color: #7BBD00; }
.rt-slow   { background: rgba(11,154,109,0.14); color: #18453B; border-color: #0B9A6D; }
.rt-precmp { background: rgba(24,69,59,0.10); color: #18453B; border-color: #18453B; }

/* ---- Break banner: ::: {.brk} ... :::  marks the halfway breather in a
        3-hour session. ---- */
.brk {
  margin: 2.2rem 0;
  padding: 0.85rem 1.1rem;
  border-left: 5px solid #18453B;
  background: rgba(24,69,59,0.07);
  border-radius: 0 6px 6px 0;
  font-weight: 600;
}
.brk .sub { display: block; font-weight: 400; font-size: 0.9em; color: #18453B; margin-top: 0.2rem; }

/* ---- Figures: 70% of the room is on a laptop beside a Zoom window. ---- */
.cell-output-display img { max-width: 100%; height: auto; }

/* ---- Wide printed output (coefficient tables, gof tables) scrolls inside
        its own box; the page never scrolls sideways. ---- */
div.sourceCode,
pre.sourceCode,
.cell-output pre,
.cell-output-stdout pre { overflow-x: auto; max-width: 100%; }

.cell-output table,
.table-responsive { display: block; overflow-x: auto; max-width: 100%; }

/* Big monitor / projector: scale up rather than getting a wide
   line-length that nobody can track. */
@media (min-width: 1600px) { body { font-size: 1.06rem; } }

/* ---- Dark mode: keep badges, banners, landmarks, and stripes legible
        for a student reading on a dark-themed laptop. ---- */
@media (prefers-color-scheme: dark) {
  h2   { border-top-color: #7BBD00; }
  tbody tr:nth-child(odd) { background: rgba(255,255,255,0.035); }
  .tm  { background: #18453B; color: #FFFFFF; border-color: #7BBD00; }
  .brk { background: #18453B; color: #FFFFFF; }
  .brk .sub { color: #FFFFFF; }
  .rt-live   { background: #18453B; color: #FFFFFF; border-color: #7BBD00; }
  .rt-slow   { background: #18453B; color: #FFFFFF; border-color: #0B9A6D; }
  .rt-precmp { background: #18453B; color: #FFFFFF; border-color: #008934; }
}
