/* Research Viewer custom styles */

/* Source reference links */
a.source-ref {
  font-family: var(--pico-font-family-monospace);
  font-size: 0.85em;
  text-decoration: none;
  border-bottom: 1px dashed currentColor;
}

a.source-ref:hover {
  border-bottom-style: solid;
}

/* Tables: readable sizing */
article table {
  font-size: 0.9em;
}

article table th,
article table td {
  padding: 0.5rem 0.75rem;
}

/* Topic nav — horizontal tabs */
main > nav > ul {
  display: flex;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0 0 2rem 0;
  border-bottom: 2px solid var(--pico-muted-border-color);
  padding-bottom: 0.5rem;
}

main > nav > ul li {
  margin: 0;
  padding: 0;
}

/* Question slug links in the questions index */
section ul a {
  text-transform: capitalize;
}

/* Source entries on the sources page */
.source-entry {
  margin-bottom: 1.25rem;
}

.source-detail {
  margin: 0.25rem 0 0 1.5rem;
}

/* Topic description (problem definition) above the report */
.topic-description {
  border-bottom: 1px solid var(--pico-muted-border-color);
  margin-bottom: 2rem;
  padding-bottom: 1rem;
}

/* Evidence citation links */
a.evidence-cite {
  font-weight: 600;
  font-size: 0.85em;
  text-decoration: none;
  cursor: pointer;
  border-bottom: 1px dashed currentColor;
}

a.evidence-cite:hover {
  border-bottom-style: solid;
}

/* Evidence tags (hidden but kept as data attributes) */
.evidence-tag {
  display: none;
}

/* Evidence popover */
.evidence-popover {
  position: fixed;
  z-index: 1000;
  max-width: 36rem;
  max-height: 50vh;
  overflow-y: auto;
  padding: 1rem 1.25rem;
  background: var(--pico-card-background-color, #fff);
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 0.5rem;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
  font-size: 0.9em;
  line-height: 1.5;
}

.evidence-popover .popover-close {
  float: right;
  background: none;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
  padding: 0 0.25rem;
  line-height: 1;
  color: var(--pico-muted-color);
}

.evidence-popover .popover-close:hover {
  color: var(--pico-color);
}

/* Model table */
.model-table {
  margin-bottom: 2.5rem;
  border-bottom: 1px solid var(--pico-muted-border-color);
  padding-bottom: 2rem;
}

.model-table h2 {
  margin-bottom: 0.75rem;
}

.model-table table {
  font-size: 0.9em;
  width: 100%;
}

.model-table table th,
.model-table table td {
  text-align: right;
  padding: 0.5rem 0.75rem;
}

.model-table table th:first-child,
.model-table table td:first-child {
  text-align: left;
}

.model-row-unit {
  display: block;
  color: var(--pico-muted-color);
  font-size: 0.85em;
}

.model-row-input {
  /* Default styling — no extra emphasis */
}

.model-row-intermediate {
  opacity: 0.75;
  font-size: 0.95em;
}

.model-row-output {
  font-weight: bold;
}

.model-row-output td {
  border-top: 2px solid var(--pico-muted-border-color);
}

/* Scenario toggle button group */
.scenario-toggle {
  display: flex;
  gap: 0.25rem;
  margin-bottom: 1rem;
}

.scenario-toggle button {
  padding: 0.35rem 0.75rem;
  font-size: 0.85em;
  border: 1px solid var(--pico-muted-border-color);
  background-color: var(--pico-card-background-color, #fff);
  color: var(--pico-color, #333);
  cursor: pointer;
  border-radius: 0.25rem;
  margin-bottom: 0;
  /* Override Pico's default button styling */
  --pico-background-color: var(--pico-card-background-color, #fff);
  --pico-color: var(--pico-contrast, #333);
}

.scenario-toggle button.active {
  background-color: var(--pico-primary-background);
  color: var(--pico-primary-inverse, #fff);
  border-color: var(--pico-primary-background);
  --pico-background-color: var(--pico-primary-background);
  --pico-color: var(--pico-primary-inverse, #fff);
}

.scenario-toggle button:hover:not(.active) {
  background-color: var(--pico-muted-border-color);
  --pico-background-color: var(--pico-muted-border-color);
}

/* Clickable row labels */
.model-row-label.clickable {
  cursor: pointer;
  border-bottom: 1px dashed var(--pico-muted-color);
  display: inline;
}

.model-row-label.clickable:hover {
  border-bottom-style: solid;
  color: var(--pico-primary);
}

/* Row label popover */
.model-row-popover {
  position: absolute;
  z-index: 1000;
  max-width: 28rem;
  padding: 1rem 1.25rem;
  background: var(--pico-card-background-color, #fff);
  border: 1px solid var(--pico-muted-border-color);
  border-radius: 0.5rem;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
  font-size: 0.9em;
  line-height: 1.5;
}

.model-row-popover .popover-close {
  float: right;
  background: none;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
  padding: 0 0.25rem;
  line-height: 1;
  color: var(--pico-muted-color);
}

.model-row-popover .popover-close:hover {
  color: var(--pico-color);
}

.model-row-popover p {
  margin: 0.5rem 0;
}

.model-row-popover .popover-formula {
  margin: 0.25rem 0;
  font-size: 0.9em;
  color: var(--pico-muted-color);
}

.model-row-popover a {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 0.9em;
}

/* Question page value table */
.question-value-table {
  margin-bottom: 2rem;
  border-bottom: 1px solid var(--pico-muted-border-color);
  padding-bottom: 1.5rem;
}

.question-value-table table {
  font-size: 0.9em;
  width: 100%;
}

.question-value-table table th,
.question-value-table table td {
  text-align: right;
  padding: 0.5rem 0.75rem;
}

.question-value-table table th:first-child,
.question-value-table table td:first-child {
  text-align: left;
}

.question-value-table .scenario-central {
  font-weight: 600;
}

/* Markdown content spacing */
article h2 {
  margin-top: 2rem;
}

article h3 {
  margin-top: 1.5rem;
}
