.smaller-font {
  font-size: 0.9em;
}

.smallerx-font {
  font-size: 0.35em;
}

.long-title1 {
  font-size: 0.8em;
}

.long-title2 {
  font-size: 0.7em;
}


#title-slide .quarto-title-author-name {
  text-align: left !important;
  font-size: 0.89em;
}

#title-slide .quarto-title-affiliation {
  text-align: left !important;
  font-size: 0.6em;
}

#title-slide .date {
  text-align: left;
  padding-left: 20px;
}

/* .reveal h1.title {
  text-align: left !important;
  font-size: 1.8em !important;
} */



.reveal .subtitle {
  text-align: left !important;
}
.reveal {
    background-color: #FAF9F5; /* Claude cream background */
}



/* Change callout background and sidebar color */
div.callout {
  border-left: 8px solid #D97757 !important; /* Sidebar color */
}

div.callout .callout-title {
  background-color: #F2DFD3 !important;
  /* color: #fff !important;
  /* border-radius: 0.5em 0.5em 0 0 */
}


.reveal .slide-menu-button .fa-bars::before {
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23D97757" class="bi bi-list" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M2.5 12a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5z"/></svg>') !important;
}

/* Change the color of the progress bar itself */
.reveal .progress span {
  background: #D97757 !important; /* Your chosen color */
  height: 100% !important;
}
.reveal .progress {
  height: 4px !important;
}

/* Set background color for all images */
img {
    background-color: #FAF9F5; /* Claude cream background */
}

/* Custom class for left border only */

.left-border {
  border-left: 2px solid rgba(0,0,0,0.12);  /* Only the left */
  border-radius: 0;                         /* Remove any edge rounding */
  border-top: none;
  border-right: none;
  border-bottom: none;
  padding-left: 14px;                       /* Optional, or reduce/increase */
  background: none;                         /* Ensure background hasn't changed */
}

/* Footer color overrides */
.reveal .footer {
  color: #D97757 !important;
}

.reveal .footer a {
  color: #D97757 !important;
  text-decoration: none;
}

.reveal .footer a:hover,
.reveal .footer a:focus {
  color: #C2613F !important; /* slightly darker on hover */
}



/* List styles for positive and negative lists */

/* POSITIVE */
.reveal .positive ul,
.reveal ul.positive {
  list-style: none;
  padding-left: 0;
  margin-left: 0;
}

.reveal .positive li,
.reveal ul.positive li {
  margin-left: 0;
}

.reveal .positive li::before,
.reveal ul.positive li::before {
  content: "✓";
  color: #D97757;
  font-weight: 700;
  display: inline-block;
  width: 1em;
}

/* NEGATIVE */
.reveal .negative ul,
.reveal ul.negative {
  list-style: none;
  padding-left: 0;
  margin-left: 0;
}

.reveal .negative li,
.reveal ul.negative li {
  margin-left: 0;
}

.reveal .negative li::before,
.reveal ul.negative li::before {
  content: "✗";
  color: #A93226;
  font-weight: 700;
  display: inline-block;
  width: 1em;
}

/* Spaced lists - for both positive and negative */
.spaced li {
  margin-bottom: 1.5em !important;
}


.border-box {
  padding: 15px;
  border-radius: 5px;
  background-color: #FBFAF4;
}

.cust_title {
  font-size: 1em;
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 0.5em;
  margin-top: 0;
  color: inherit;
  display: block;
}

.reveal .slide-number {
  color: #D97757;
}

.reveal h1 {
  color: #141413;
  font-size: 2em !important;
  /* padding-left: 20px; */
}
.reveal h2 {
  color: #141413;
  /* font-size: 1.3em !important; */
}
.reveal h3 {
  color: #141413;
  /* font-size: 1.1em !important; */
}
/* Custom class to mimic Revealjs H2 styling */
.mimic-h2 {
  display: block;                  /* Makes it sit on its own line like a header */
  font-family: var(--heading-font);
  font-weight: 600;               /* Match Revealjs H2 weight */
  color: #141413;
  text-transform: var(--heading-text-transform);
  letter-spacing: var(--heading-letter-spacing);
  font-size: 1.6em;                /* This is the standard Revealjs H2 size */
  line-height: var(--heading-line-height);
  margin-bottom: var(--heading-margin-bottom);
}


/* 1. Global Link Color (Standard Hyperlinks) */
.reveal a {
  color: #A04B2F; /* Replace with your color */
  text-decoration: none;
}

/* 2. Citations (e.g., @knuth1984) */
.reveal a.citation {
  color: #A04B2F; /* Same color as standard links, or choose a different one */
}

/* 3. Quarto Cross-References (e.g., @fig-1, @tbl-1) */
.reveal a.quarto-xref {
  color: #A04B2F; /* A distinct color for internal refs */
}

/* 4. Equation References (e.g., (1)) */
/* Quarto often tags equation links with .no-external */
.reveal a.no-external {
  color: #A04B2F;
}

/* 5. Hover Effects for all the above */
.reveal a:hover, 
.reveal a.quarto-xref:hover,
.reveal a.no-external:hover {
  color: #E0A488; 
  text-decoration: underline;
}


/* Table styling for full-slide tables
*/

.reveal .slides section.tables-full-slide .columns {
  gap: 1rem;
  align-items: flex-start;
}

.reveal .slides section.tables-full-slide .column {
  min-width: 0; /* prevents overflow squeeze issues */
}

.reveal .slides section.tables-full-slide .gt_table {
  width: 100% !important;
  margin: 0 auto;
}

.reveal .slides section.tables-full-slide .gt_col_heading {
  white-space: nowrap;
}


/* ===== FSP (vaccine forecasting) slides ===== */
.reveal .fsp-lead { color: #5F5E5A; font-size: 0.82em; margin-bottom: 0.5em; }
.reveal .fsp-box { border-radius: 12px; padding: 0.35em 0.7em; margin-bottom: 0.35em; font-size: 0.66em; }
.reveal .fsp-box p { margin: 0.1em 0; }

/* blue = demographic (kept) · orange = consumption/forecast (was green, now Claude orange) */
/* amber = session (kept) · gray = muted (kept) */
.reveal .fsp-dem    { background: #E6F1FB; color: #042C53; }
.reveal .fsp-orange { background: #F2DFD3; color: #7A3A1E; border-left: 6px solid #D97757; border-radius: 12px; }
.reveal .fsp-sess   { background: #FAEEDA; color: #412402; }
.reveal .fsp-muted  { background: #F1EFE8; color: #444441; }

.reveal .fsp-combine { border: 2px solid #185FA5; border-radius: 12px; padding: 0.35em 0.7em; font-size: 0.66em; margin-bottom: 0.35em; }
.reveal .fsp-info    { border: 2px solid #185FA5; border-radius: 12px; padding: 0.45em 0.8em; font-size: 0.8em; margin-top: 0.4em; }

.reveal .fsp-sub  { color: #5F5E5A; font-size: 0.8em; }
.reveal .fsp-foot { color: #888780; font-size: 0.62em; margin-top: 0.45em; }
.reveal .fsp-eq-sm { font-size: 0.82em; }

.reveal .fsp-pill-gray { background: #D3D1C7; color: #2C2C2A; border-radius: 6px; padding: 0.04em 0.45em; font-size: 0.62em; vertical-align: 0.12em; }
.reveal .fsp-pill-blue { background: #B5D4F4; color: #042C53; border-radius: 6px; padding: 0.04em 0.45em; font-size: 0.62em; vertical-align: 0.12em; }

.reveal .fsp-rq { border: 2px solid #185FA5; border-left: 12px solid #185FA5; background: #E6F1FB; color: #042C53; border-radius: 8px; padding: 0.7em 1.1em; font-size: 0.98em; font-weight: 500; margin-top: 0.5em; box-shadow: 0 8px 28px rgba(24,95,165,0.22); }
.reveal .fsp-rq .fsp-rq-label { color: #185FA5; font-size: 0.78em; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; display: block; margin-bottom: 0.25em; }

.reveal .fsp-step-orange { background: #F2DFD3; color: #7A3A1E; border-radius: 12px; padding: 0.5em 0.85em; height: 100%; font-size: 0.72em; border-top: 6px solid #D97757; }
.reveal .fsp-step-blue   { background: #E6F1FB; color: #042C53; border-radius: 12px; padding: 0.5em 0.85em; height: 100%; font-size: 0.72em; border-top: 6px solid #185FA5; }
.reveal .fsp-step-orange .fsp-eq, .reveal .fsp-step-blue .fsp-eq { font-size: 1.05em; }

.reveal .fsp-notation { background: #FBFAF4; border: 1px solid rgba(0,0,0,0.08); border-radius: 10px; padding: 0.5em 0.7em; font-size: 0.6em; color: #444441; line-height: 1.6; }
.reveal .fsp-notation .fsp-note-title { display: block; color: #141413; font-weight: 600; font-size: 1.15em; margin-bottom: 0.35em; }
.reveal .fsp-notation p { margin: 0; }
.reveal .fsp-fill { height: 100%; box-sizing: border-box; }

/* --- FSP: fill the slide, equal-size boxes, bulleted --- */
.reveal .fsp-main { display: flex; gap: 20px; align-items: stretch; height: 740px; margin-top: 0.3em; }
.reveal .fsp-main > .fsp-notation { flex: 1; align-self: stretch; }
.reveal .fsp-stack { display: flex; flex-direction: column; gap: 14px; height: 740px; }
.reveal .fsp-main > .fsp-stack { flex: 3; min-height: 0; }
.reveal .fsp-stack > .fsp-box,
.reveal .fsp-stack > .fsp-combine { flex: 1 1 0; margin: 0 !important; display: flex; flex-direction: column; justify-content: center; }

.reveal .fsp-row3 { display: flex; gap: 18px; align-items: stretch; height: 430px; margin: 0.3em 0 18px 0; }
.reveal .fsp-row3 > .fsp-box { flex: 1 1 0; margin: 0 !important; display: flex; flex-direction: column; justify-content: center; }
.reveal .fsp-missed { min-height: 330px; display: flex; flex-direction: column; justify-content: center; }

.reveal .fsp-two { display: flex; gap: 22px; align-items: stretch; height: 300px; margin: 0.3em 0; }
.reveal .fsp-two > .fsp-step-orange,
.reveal .fsp-two > .fsp-step-blue { flex: 1 1 0; margin: 0 !important; display: flex; flex-direction: column; justify-content: center; }

.reveal .fsp-box ul, .reveal .fsp-combine ul,
.reveal .fsp-step-orange ul, .reveal .fsp-step-blue ul { margin: 0.35em 0 0 0; padding-left: 1.05em; list-style: disc; }
.reveal .fsp-box li, .reveal .fsp-combine li,
.reveal .fsp-step-orange li, .reveal .fsp-step-blue li { margin: 0.16em 0; line-height: 1.3; }
.reveal .fsp-box > p:first-child, .reveal .fsp-combine > p:first-child,
.reveal .fsp-step-orange > p:first-child, .reveal .fsp-step-blue > p:first-child { font-size: 1.08em; margin: 0 0 0.1em 0; }

/* equation-heavy methodology slides */
.reveal section.eqn-slide { font-size: 0.92em; }
.reveal section.eqn-slide .fsp-lead { font-size: 0.85em; margin: 0.35em 0; }
.reveal section.eqn-slide mjx-container[display="true"] { margin: 0.55em 0 !important; }

/* --- forecasting framework flow diagram --- */
.reveal .fw-wrap { font-size: 0.6em; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.reveal .fw-row { display: flex; gap: 16px; justify-content: center; align-items: stretch; width: 100%; }
.reveal .fw-box { border-radius: 12px; padding: 12px 16px; flex: 1; text-align: center; }
.reveal .fw-box .fw-t { display: block; font-weight: 600; margin-bottom: 4px; }
.reveal .fw-box .fw-s { display: block; font-size: 0.78em; opacity: 0.9; line-height: 1.3; }
.reveal .fw-arrow { text-align: center; color: #D97757; font-size: 1.5em; line-height: 0.7; margin: 0; }
.reveal .fw-data { background: #F1EFE8; color: #2C2C2A; }
.reveal .fw-fsp  { background: #F2DFD3; color: #7A3A1E; }
.reveal .fw-stat { background: #E6F1FB; color: #042C53; }
.reveal .fw-ml   { background: #EEEDFE; color: #26215C; }
.reveal .fw-dl   { background: #E1F5EE; color: #04342C; }
.reveal .fw-bar  { background: #FBFAF4; border: 1px solid rgba(0,0,0,0.12); border-radius: 10px; padding: 8px 16px; text-align: center; font-style: italic; color: #5F5E5A; width: 70%; }
.reveal .fw-final { background: #D97757; color: #FFFFFF; border-radius: 12px; padding: 14px 22px; text-align: center; font-weight: 500; width: 82%; }

/* --- data setup stat cards --- */
.reveal .stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 0.7em; }
.reveal .stat-card { background: #FBFAF4; border: 1px solid rgba(0,0,0,0.08); border-radius: 14px; padding: 24px 20px; text-align: center; }
.reveal .stat-card .si { display: block; color: #D97757; font-size: 2em; margin-bottom: 10px; }
.reveal .stat-card .st { display: block; font-size: 1.35em; font-weight: 600; color: #141413; line-height: 1.15; }
.reveal .stat-card .ss { display: block; font-size: 0.82em; color: #5F5E5A; margin-top: 8px; line-height: 1.3; }

/* --- vaccines slide: column-filling, equal, centered images --- */
.reveal section.vaccines .columns { display: flex; align-items: stretch; justify-content: center; gap: 24px; margin-top: 0.4em; }
.reveal section.vaccines .column { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.reveal section.vaccines .column img { width: 100%; height: 720px; object-fit: contain; margin: 0 0 0.25em 0; display: block; background: transparent; }

/* --- highlighted metric note (evaluation slide) --- */
.reveal .metric-hl { display: block; background: #F2DFD3; color: #7A3A1E; border-left: 6px solid #D97757; border-radius: 6px; padding: 0.35em 0.7em; margin-top: 0.5em; font-size: 0.9em; text-align: center; }

/* --- website QR in last-slide corner --- */
.reveal .qr-corner { position: absolute; right: 40px; bottom: 70px; text-align: center; margin: 0; }
.reveal .qr-corner img { background: #fff; padding: 6px; border-radius: 8px; box-shadow: 0 4px 16px rgba(0,0,0,0.12); margin: 0; }
.reveal .qr-corner .qr-cap { display: block; margin-top: 6px; font-size: 0.5em; color: #5F5E5A; }

/* --- section-divider agenda (recap before each section) --- */
.reveal .agenda { list-style: none; margin-left: 0; padding-left: 0; }
.reveal .agenda ul { list-style: none; margin-left: 0; padding-left: 0; }
.reveal .agenda li { font-size: 1.4em; margin: 0.6em 0; line-height: 1.3; }
.reveal .ol-on  { font-weight: 700; color: #A04B2F; }
.reveal .ol-on::before  { content: "\25B8  "; color: #D97757; }
.reveal .ol-off { color: #C2BDB2; }
.reveal .ol-off::before { content: "\25B8  "; color: transparent; }

/* --- methodology pipeline flow --- */
.reveal .flow-label { display: block; width: 100%; font-weight: 600; color: #A04B2F; text-align: left; margin: 6px 0 2px; }
.reveal .flow-steps { display: flex; align-items: stretch; justify-content: center; gap: 10px; width: 100%; }
.reveal .flow-steps > .fw-box { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.reveal .flow-hstep-arrow { display: flex; align-items: center; color: #D97757; font-size: 1.5em; }