body {
  padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
  padding-bottom: 50px;
}

h1 {
  padding-top: 1em;
  padding-bottom: 0.25em;
}

#page-title {
  font-size: 300%;
  text-align: center;
}

#post-last-modified {
  text-align: center;
}

.anchor { padding-top: 60px; }

blockquote {
  background-color: beige;
  margin: 1.625em 0 1.75em 0;
  border: 1px solid #ccc;
  font-size: 0.95em;
  padding: 1em 1.25em;
  font-weight: 400;
  font-family: "Source Serif Pro", Baskerville, "Libre Baskerville", serif;
}

div > .highlight {
  background-color: whitesmoke;
  margin: 1.625em 0 1.75em 0;
  border: 1px solid #ccc;
  padding: 1em 1.25em;
}

li:target {
  background-color: #eaf3ff;
}

blockquote p {
  margin: 0;
}

table {
  margin: 1.625em 0 1.75em 0;
  padding: 0;
  border-collapse: collapse;
  width: 100%;
  /* font-size: 0.65em; */
  border-style: solid;
  border-color: #000;
  border-width: 2px 0;
  font-variant-numeric: tabular-nums;
}

table th {
  font-weight: bold;
  border-bottom: 1px solid #000;
  text-align: left;
}

pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
}

pre.error {
  background-color: rgb(217, 149, 149);
}

div.card.left-border {
  border: none;
  border-left: 2px dotted rgb(196, 144, 144);
}

div.card.left-border.depth-1 {
  border: none;
  border-left: 2px dotted rgb(196, 144, 144);
}

div.card.left-border.depth-2 {
  border: none;
  border-left: 2px dotted rgb(196, 187, 144);
}

div.card.left-border.depth-3 {
  border: none;
  border-left: 2px dotted rgb(146, 196, 144);
}

div.card.left-border.depth-4 {
  border: none;
  border-left: 2px dotted rgb(144, 168, 196);
}

div.card.left-border.depth-5 {
  border: none;
  border-left: 2px dotted rgb(196, 144, 196);
}

div.card.left-border.depth-6 {
  border: none;
  border-left: 2px dotted rgb(196, 144, 150);
}

ul.list-checklist {
  list-style-type: none;
  padding-left: 1em;
}

.poem
{
  /* Configure your background, layout, etcetera here */
}

.poem ul, .poem ol
{
  list-style-type: none;
}

.poem li
{
  font-family:Times New Roman;
  font-style:italic;
  padding-bottom: 0.1em;
}

.poem p
{
  /* Configure your poem paragraph here */
}

.poem li:first-child::first-letter
{
  font-size:26px;
  font-style:italic;
  padding-right:3px;
}

.poem li:not(:first-child)
{
  margin-left: 26px;
}


/* default-dark.css – Rev 2 – GitHub-inspired dark theme with teal, gold & red accents to match banner */

:root {
  /* Palette */
  --color-bg: #0e1116;         /* slightly lighter than pure black */
  --color-bg-alt: #161b22;     /* cards / blocks */
  --color-fg: #c9d1d9;         /* primary foreground */
  --color-fg-muted: #8b949e;   /* subdued text */

  /* Accent hues picked from banner */
  --color-teal: #1db8c8;   /* circuitry teal */
  --color-gold: #f0b232;   /* outline gold */
  --color-red: #ff4a4a;    /* "blood" red */

  /* Functional roles */
  --color-accent: var(--color-teal);
  --color-highlight: #26c3ff;  /* hover / selection – brighter teal */
  --color-border: #30363d;
  --color-danger: var(--color-red);
}

/* ---------- Global ---------- */
body {
  background-color: var(--color-bg);
  color: var(--color-fg);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  color: var(--color-fg);
}

/* Links */
a {
  color: var(--color-accent);
  text-decoration: none;
}

a:hover,
a:focus {
  color: var(--color-highlight);
  text-decoration: underline;
}

/* Selection */
::selection {
  background: var(--color-highlight);
  color: var(--color-bg);
}

/* ---------- Layout Elements ---------- */

/* Navbar */
.navbar-dark.bg-dark {
  background-color: var(--color-bg-alt) !important;
}

.navbar-dark .navbar-brand,
.navbar-dark .navbar-nav .nav-link {
  color: var(--color-fg) !important;
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: var(--color-highlight) !important;
}

/* Main headings inside content */
#page-title {
  color: var(--color-fg);
}

/* ---------- Components ---------- */

/* Blockquote */
blockquote {
  background-color: var(--color-bg-alt);
  border: 1px solid var(--color-border);
  color: var(--color-fg);
}

/* Code blocks */
pre,
div > .highlight {
  background-color: var(--color-bg-alt);
  border: 1px solid var(--color-border);
  color: var(--color-fg);
}

pre.error {
  background-color: #512c2c;
  color: #ffd7d7;
}

/* Tables */
table {
  border-collapse: collapse;
  width: 100%;
  margin: 1.625em 0 1.75em 0;
  border: 2px solid var(--color-border);
  font-variant-numeric: tabular-nums;
}

table th {
  font-weight: bold;
  border-bottom: 1px solid var(--color-border);
  text-align: left;
  background-color: var(--color-bg-alt);
  color: var(--color-fg);
}

table td {
  border-bottom: 1px solid var(--color-border);
}

tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.035);
}

/* Anchor target highlight */
li:target {
  background-color: rgba(29, 184, 200, 0.16); /* translucent teal */
}

/* ---------- Bootstrap Cards & custom .section-body ---------- */
.card,
.card-body,
.section-body {
  background-color: var(--color-bg-alt) !important;
  color: var(--color-fg) !important;
  border: 1px solid var(--color-border);
}

/* Override utility bg-light (used by some bootstrap components) */
.bg-light {
  background-color: var(--color-bg-alt) !important;
}

/* Left-border narrative cards */

/* Base */
div.card.left-border {
  border: none;
  border-left: 2px dotted var(--color-border);
}

/* Depth-graded borders using accent palette */
/* depth-1 → gold, depth-2 → teal, depth-3 → red, depth-4 → blue-teal blend, depth-5 → purple, depth-6 → pink-red */

div.card.left-border.depth-1 { border-left-color: var(--color-gold); }

div.card.left-border.depth-2 { border-left-color: var(--color-teal); }

div.card.left-border.depth-3 { border-left-color: var(--color-red); }

div.card.left-border.depth-4 { border-left-color: #1f6feb; }

div.card.left-border.depth-5 { border-left-color: #8957e5; }

div.card.left-border.depth-6 { border-left-color: #da3633; }

/* Lists (poetry) */
.poem li {
  color: var(--color-fg);
}

/* Bootstrap buttons */
.btn-primary {
  background-color: var(--color-accent);
  border-color: var(--color-accent);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--color-highlight);
  border-color: var(--color-highlight);
}

/* Scrollbar for code blocks (WebKit) */
pre::-webkit-scrollbar {
  height: 8px;
}

pre::-webkit-scrollbar-track {
  background: transparent;
}

pre::-webkit-scrollbar-thumb {
  background-color: var(--color-border);
  border-radius: 4px;
}

/* ---------- Navbar brand logo ---------- */
/* Ensure logo sits flush with text and scales nicely */
.navbar-brand {
  display: flex;
  align-items: center;
}

.navbar-brand img {
  height: 28px; /* tweak to taste */
  width: 28px;
  margin-right: 0.45rem;
}