/* General Reset for Consistency */
body {
  margin: 0;
  font-family: 'Arial', sans-serif;
  line-height: 1.6;
  color: #333333;
}

/* Report title block only — NOT `.header` alone: Pandoc uses `tr.header` on table
   rows; a bare `.header { display:flex }` stacks every <th> vertically. */
div.header {
  display: flex;
  flex-direction: column;
  margin-top: 20px; /* Added gap above the title */
  margin-bottom: 20px;
}

/* Date: Smaller and Lighter */
.date-title {
  font-size: 12px;       /* reduced from 14px */
  color: #999999;        /* lighter color */
  margin-bottom: 5px;
}

.date-title strong {
  font-size: 12px;       /* keep consistent with parent */
  font-weight: 700;
  color: #2c3e50;
}

/* Author: Even Smaller and Lighter */
.author {
  font-size: 10px;       /* reduced from 12px */
  color: #999999;        /* lighter color */
  font-style: italic;
}

/* Heading Styles */
h1 {
  font-size: 28px;
  color: #2c3e50;
  font-weight: 700;
  margin-top: 30px;
  margin-bottom: 15px;
  border-bottom: 2px solid #3498db;
  padding-bottom: 5px;
}

h2 {
  font-size: 24px;
  color: #34495e;
  font-weight: 600;
  margin-top: 25px;
  margin-bottom: 12px;
}

h3 {
  font-size: 20px;
  color: #4a6782;
  font-weight: 500;
  margin-top: 20px;
  margin-bottom: 10px;
}

h4 {
  font-size: 16px;
  color: #5d829e;
  font-weight: 500;
  margin-top: 15px;
  margin-bottom: 8px;
}

h5 {
  font-size: 14px;
  color: #7f8c8d;
  font-weight: 400;
  font-style: italic;
  margin-top: 12px;
  margin-bottom: 6px;
}

/* Paragraph Styling */
p {
  font-size: 14px;
  color: #333333;
  margin-bottom: 15px;
  text-align: justify;
}

/* Optional: Style for Links */
a {
  color: #3498db;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
  color: #2980b9;
}

/* Table Styling: professional, headers above columns */
/* Bootstrap-classed tables (e.g. knitr chunks) */
.table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5em;
  font-size: 14px;
}

.table th,
.table td {
  padding: 10px 14px;
  border: 1px solid #dee2e6;
  vertical-align: top;
  text-align: left;
}

.table th {
  background-color: #2c3e50;
  color: #fff;
  font-weight: 600;
}

.table-bordered th,
.table-bordered td {
  border: 1px solid #dee2e6;
}

.table-condensed th,
.table-condensed td {
  padding: 8px 12px;
}

.table tbody tr:nth-child(even) {
  background-color: #f8f9fa;
}

.table tbody tr:hover {
  background-color: #e9ecef;
}

/* Pandoc / R Markdown body tables: plain <table> with no .table class */
.toc-content table,
.main-container table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5em;
  font-size: 14px;
  border: 1px solid #dee2e6;
  table-layout: auto;
}

.toc-content table th,
.toc-content table td,
.main-container table th,
.main-container table td {
  padding: 10px 14px;
  border: 1px solid #dee2e6;
  vertical-align: top;
  text-align: left;
}

.toc-content table thead th,
.main-container table thead th {
  background-color: #2c3e50;
  color: #fff;
  font-weight: 600;
}

/* thead row sometimes has no <thead> in older pandoc; header row uses tr.header */
.toc-content table tr.header th,
.main-container table tr.header th {
  background-color: #2c3e50;
  color: #fff;
  font-weight: 600;
}

.toc-content table tbody tr:nth-child(even),
.main-container table tbody tr:nth-child(even),
.toc-content table tbody tr.even,
.main-container table tbody tr.even {
  background-color: #f8f9fa;
}

.toc-content table tbody tr:hover,
.main-container table tbody tr:hover {
  background-color: #e9ecef;
}

.toc-content table code,
.main-container table code {
  font-size: 0.9em;
  word-break: break-word;
}

/* Report Title: Larger and Bolder */
.report-title {
  font-size: 24px;       /* increased from 16px */
  color: #2c3e50;
  font-weight: 700;      /* made bold */
  margin-bottom: 5px;
}

.report-title strong {
  font-weight: 700;
}

/* New Subtitle Class */
.subtitle {
  font-size: 12px;
  color: #666666;
  font-weight: 400;
  margin-bottom: 15px;   /* spacing below subtitle */
}

/* Floating TOC: one line per item, no wrap, ellipsis if needed */
#TOC {
  max-width: 260px;
}
#TOC .list-group-item,
#TOC a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
#TOC .tocify-subheader .list-group-item {
  max-width: 100%;
}

/* —— journal_sol_web_rationale.html: shell + floated section menu —— */
.page-shell {
  box-sizing: border-box;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding: 16px 24px 56px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.page-main {
  flex: 1;
  min-width: 0;
}

.main-container.toc-content {
  max-width: 940px;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
}

@media (min-width: 900px) {
  .page-shell {
    flex-direction: row;
    align-items: flex-start;
    gap: 28px;
  }

  .page-toc {
    flex: 0 0 216px;
    position: sticky;
    top: 16px;
    align-self: flex-start;
    max-height: calc(100vh - 32px);
    overflow-x: visible;
    overflow-y: auto;
    padding-right: 4px;
  }
}

.page-toc__label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #7f8c8d;
  margin-bottom: 10px;
  white-space: nowrap;
}

.page-toc ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.page-toc li + li {
  margin-top: 0;
}

.page-toc a {
  display: block;
  padding: 7px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-bottom: 1px solid #eef2f5;
  font-size: 13px;
  font-weight: 500;
  color: #34495e;
}

.page-toc a:hover {
  color: #2980b9;
}

.page-toc a.page-toc__toplink {
  color: #7f8c8d;
  font-size: 12px;
  border-bottom-width: 0;
  padding-bottom: 4px;
  margin-bottom: 4px;
}

@media (max-width: 899px) {
  .page-shell {
    padding-left: 16px;
    padding-right: 16px;
  }

  .page-toc {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(6px);
    border-bottom: 1px solid #dee2e6;
    margin-left: -16px;
    margin-right: -16px;
    padding: 12px 16px 10px;
  }

  .page-toc__label {
    margin-bottom: 8px;
  }

  .page-toc ul {
    display: flex;
    flex-flow: row nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }

  .page-toc li {
    flex: 0 0 auto;
    max-width: 100%;
  }

  .page-toc a {
    padding: 8px 12px;
    border: 1px solid #e9ecef;
    border-radius: 4px;
    background-color: #f8f9fa;
    margin: 0;
    max-width: min(208px, 85vw);
  }

  .page-toc a.page-toc__toplink {
    max-width: 64px;
  }
}

/* Section headings on this note: compact, forced single-line */
.main-container.toc-content h2.journal-section {
  font-size: 20px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  scroll-margin-top: 14px;
}

#header .title {
  margin-top: 0;
}

.meta-note p {
  font-size: 13px;
  margin-bottom: 8px;
  text-align: left;
}

.meta-note strong:first-child {
  color: #34495e;
}

.note-code {
  font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas,
    monospace;
  font-size: 0.92em;
  background-color: #f4f6f8;
  padding: 0.12em 0.35em;
  border-radius: 3px;
}

hr.rule {
  border: none;
  border-top: 1px solid #dee2e6;
  margin: 2.25rem 0;
}

.page-toc a:focus-visible {
  outline: 2px solid #3498db;
  outline-offset: 2px;
}

@media print {
  .page-toc {
    display: none;
  }

  .main-container.toc-content h2.journal-section {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}