/* Obsidian Publish — Flexoki, warm literary
   Light = Flexoki paper & ink (warm cream bg, near-black text)
   Dark  = Flexoki dark (warm near-black, off-white text)
   Type  = serif body, sans UI chrome
   Links = animated underline, Flexoki blue; burnt orange signature accent

   Rewritten 11 July 2026 — moved from Solarized to Flexoki palette,
   serif body type. Kept 6 July structural work: hierarchy, nav polish,
   callouts, code blocks, tables, blockquotes, hover motion.
   Palette: https://stephango.com/flexoki
*/

.published-container {
  --page-width: 760px;
  --page-side-padding: 32px;
  --line-width: 760px;
  --line-width-adaptive: 760px;
  --file-line-width: 760px;

  --link-decoration: none;
  --link-decoration-hover: underline;
  --link-external-decoration: none;
  --link-external-decoration-hover: underline;

  font-feature-settings: "kern" 1, "liga" 1;

  /* Serif body, sans stays for nav/UI chrome */
  --font-text: "Iowan Old Style", "Source Serif 4", Georgia, "Times New Roman", serif;
}

/* ---------------------------------------------------------- */
/* LIGHT THEME — warmer, higher-contrast, more eye-catching    */
/* ---------------------------------------------------------- */
.theme-light {
  --background-primary: #FFFCF0;
  --background-secondary: #F2F0E5;
  --background-secondary-alt: #E6E4D9;

  --text-normal: #100F0F;
  --text-muted: #6F6E69;
  --text-faint: #878580;

  --titlebar-text-color: #100F0F;
  --text-accent: #205EA6;
  --text-accent-hover: #24837B;

  --interactive-accent: #205EA6;
  --interactive-accent-hover: #24837B;
  --interactive-accent-rgb: 32, 94, 166;

  /* Signature accent — burnt orange */
  --garden-accent: #BC5215;

  --h1-color: #100F0F;
  --h2-color: #100F0F;
  --h3-color: #100F0F;
  --h4-color: #100F0F;
  --h5-color: #100F0F;
  --h6-color: #100F0F;

  --blockquote-border-color: #BC5215;
  --blockquote-background-color: rgba(188, 82, 21, 0.06);
  --hr-color: #DAD8CE;

  --tag-color: #A02F6F;
  --tag-background: rgba(160, 47, 111, 0.10);
  --tag-background-hover: rgba(160, 47, 111, 0.18);

  --code-normal: #24837B;
  --code-background: rgba(36, 131, 123, 0.08);

  --table-border-color: #DAD8CE;
  --table-header-background: rgba(32, 94, 166, 0.06);
  --table-row-alt-background: rgba(32, 94, 166, 0.03);

  --nav-item-color: #403E3C;
  --nav-item-color-hover: #BC5215;
  --nav-item-color-active: #BC5215;
  --nav-item-background-active: rgba(188, 82, 21, 0.08);
  --search-result-background: transparent;
}

/* ---------------------------------------------------------- */
/* Type scale — more contrast between levels                  */
/* ---------------------------------------------------------- */
body {
  --inline-title-size: 2.1em;
  --inline-title-weight: 800;
  --inline-title-line-height: 1.15;

  --h1-size: 1.7em;
  --h2-size: 1.5em;
  --h3-size: 1.25em;
  --h4-size: 1.05em;
  --h5-size: 1em;
  --h6-size: 0.9em;

  --h1-weight: 800;
  --h2-weight: 700;
  --h3-weight: 650;
  --h4-weight: 600;
  --h5-weight: 600;
  --h6-weight: 600;

  --h1-line-height: 1.2;
  --h2-line-height: 1.3;

  --font-text-size: 17px;
  --line-height-normal: 1.65;
}

/* Headings: add a little rhythm & separation so pages scan easily */
.markdown-rendered h1 {
  margin-top: 0.4em;
  padding-bottom: 0.25em;
  border-bottom: 3px solid var(--garden-accent);
  display: inline-block;
}

.markdown-rendered h2 {
  margin-top: 1.8em;
  padding-left: 0.55em;
  border-left: 4px solid var(--h2-color);
}

.markdown-rendered h3 {
  margin-top: 1.4em;
}

.markdown-rendered h3::before {
  content: "§ ";
  color: var(--text-faint);
  font-weight: 400;
}

/* ---------------------------------------------------------- */
/* Links — colorful, animated underline instead of static line */
/* ---------------------------------------------------------- */
.markdown-rendered a,
.markdown-rendered .internal-link,
.markdown-rendered .external-link {
  color: var(--text-accent);
  text-decoration: none !important;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0% 100%;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  transition: background-size 0.2s ease, color 0.15s ease;
}

.markdown-rendered a:hover,
.markdown-rendered .internal-link:hover,
.markdown-rendered .external-link:hover {
  color: var(--text-accent-hover);
  background-size: 100% 1px;
}

/* ---------------------------------------------------------- */
/* Blockquotes — pull-quote feel                               */
/* ---------------------------------------------------------- */
.markdown-rendered blockquote {
  border-left: 4px solid var(--blockquote-border-color);
  background: var(--blockquote-background-color);
  border-radius: 0 8px 8px 0;
  padding: 0.6em 1em;
  font-style: italic;
}

.theme-dark .markdown-rendered blockquote {
  background: rgba(181, 137, 0, 0.06);
}

/* ---------------------------------------------------------- */
/* Callouts — a bit more pop                                   */
/* ---------------------------------------------------------- */
.markdown-rendered .callout {
  border-radius: 10px;
  border: 1px solid var(--callout-border, rgba(0, 0, 0, 0.08));
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* ---------------------------------------------------------- */
/* Code                                                         */
/* ---------------------------------------------------------- */
pre, code {
  border-radius: 6px;
}

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

/* ---------------------------------------------------------- */
/* Tables — clearer structure                                  */
/* ---------------------------------------------------------- */
.markdown-rendered table {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--table-border-color);
}

.markdown-rendered th {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.82em;
  letter-spacing: 0.03em;
}

/* ---------------------------------------------------------- */
/* Horizontal rules — decorative divider instead of plain line */
/* ---------------------------------------------------------- */
.markdown-rendered hr {
  border: none;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--hr-color), transparent);
  margin: 2.5em 0;
}

/* ---------------------------------------------------------- */
/* Navigation / sidebar — easier to scan and navigate           */
/* ---------------------------------------------------------- */
.side-dock-ribbon-action,
.nav-file-title,
.nav-folder-title,
.tree-item-self {
  border-radius: 6px;
  transition: background-color 0.15s ease, color 0.15s ease, padding-left 0.15s ease;
}

.nav-file-title:hover,
.nav-folder-title:hover {
  background-color: var(--nav-item-background-active);
  color: var(--nav-item-color-hover);
  padding-left: 4px;
}

.nav-file-title.is-active,
.tree-item-self.is-active {
  background-color: var(--nav-item-background-active);
  color: var(--nav-item-color-active);
  font-weight: 600;
  border-left: 3px solid var(--garden-accent);
}

.nav-folder-title {
  font-weight: 600;
}

/* Bold + box the "Home" entry in the sidebar to highlight it */
.nav-file-title[data-path="Home.md"] .nav-file-title-content,
.nav-file-title[data-path="Home"] .nav-file-title-content,
a.nav-file-title[href*="Home"],
a.nav-file-title[href*="Home"] .nav-file-title-content,
.nav-file-title[aria-label="Home"] .nav-file-title-content {
  font-weight: 700;
}

.nav-file-title[data-path="Home.md"],
.nav-file-title[data-path="Home"],
a.nav-file-title[href*="Home"],
.nav-file-title[aria-label="Home"] {
  display: block;
  border: 1.5px solid var(--text-accent);
  border-radius: 8px;
  background-color: var(--nav-item-background-active);
  margin: 4px 0 10px 0;
  padding: 6px 8px !important;
}

/* Search box: a touch of focus affordance */
.search-input-container input {
  border-radius: 8px;
  transition: box-shadow 0.15s ease;
}

.search-input-container input:focus {
  box-shadow: 0 0 0 3px rgba(var(--interactive-accent-rgb), 0.25);
}

/* Graph view accent (if shown) */
.theme-light .graph-view.color-fill { color: var(--text-accent); }
.theme-light .graph-view.color-line { color: var(--hr-color); }

/* ---------------------------------------------------------- */
/* Tags — pill styling for quick scanning                       */
/* ---------------------------------------------------------- */
.markdown-rendered .tag,
a.tag {
  border-radius: 999px;
  padding: 0.1em 0.6em;
  font-weight: 600;
  font-size: 0.85em;
  transition: background-color 0.15s ease;
}

.markdown-rendered .tag:hover,
a.tag:hover {
  background-color: var(--tag-background-hover);
}

/* Backlinks panel ("Links to this page") — add breathing room between items */
.backlinks .tree-item,
.backlinks .search-result-file-match,
.backlinks-pane .tree-item,
.backlink-list .tree-item,
.mod-backlinks .tree-item {
  margin-bottom: 12px;
}

.backlinks .search-result-file-matches .search-result-file-match {
  margin-bottom: 8px;
}

/* ---------------------------------------------------------- */
/* Mobile — tighter spacing so About fits on one screen         */
/* ---------------------------------------------------------- */
@media (max-width: 480px) {
  body {
    --font-text-size: 18px;
    --line-height-normal: 1.34;
    --inline-title-size: 1.5em;
    --inline-title-line-height: 1.05;

    --h1-size: 1.3em;
    --h2-size: 1.1em;
    --h3-size: 1.0em;
    --h1-line-height: 1.1;
    --h2-line-height: 1.15;
  }

  .published-container {
    --page-side-padding: 16px;
  }

  .markdown-rendered {
    line-height: 1.34;
  }

  .markdown-rendered p {
    margin-top: 0.7em;
    margin-bottom: 0.7em;
  }

  .markdown-rendered h1 {
    margin-top: 0.15em;
    margin-bottom: 0.15em;
    padding-bottom: 0.1em;
  }

  .markdown-rendered h2 {
    margin-top: 0.5em;
    margin-bottom: 0.25em;
  }

  .markdown-rendered h3 {
    margin-top: 0.4em;
    margin-bottom: 0.2em;
  }

  .markdown-rendered ul,
  .markdown-rendered ol {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
  }

  .markdown-rendered li {
    margin-top: 0.1em;
    margin-bottom: 0.1em;
  }

  .markdown-rendered blockquote {
    padding: 0.35em 0.7em;
    margin: 0.4em 0;
  }

  .markdown-rendered hr {
    margin: 1em 0;
  }
}

/* ---------------------------------------------------------- */
/* DARK THEME — Solarized Dark                                  */
/* ---------------------------------------------------------- */
.theme-dark {
  --background-primary: #002b36;
  --background-secondary: #073642;
  --background-secondary-alt: #0a3a46;

  --text-normal: #839496;
  --text-muted: #93a1a1;
  --text-faint: #586e75;

  --titlebar-text-color: #93a1a1;
  --text-accent: #268bd2;
  --text-accent-hover: #2aa198;

  --interactive-accent: #268bd2;
  --interactive-accent-hover: #2aa198;
  --interactive-accent-rgb: 38, 139, 210;

  /* Signature accent — Solarized orange */
  --garden-accent: #cb4b16;

  --h1-color: #b58900;
  --h2-color: #b58900;
  --h3-color: #2aa198;
  --h4-color: #268bd2;
  --h5-color: #6c71c4;
  --h6-color: #859900;

  --blockquote-border-color: #586e75;
  --blockquote-background-color: rgba(147, 161, 161, 0.06);
  --hr-color: #586e75;

  --tag-color: #d33682;
  --tag-background: rgba(211, 54, 130, 0.14);
  --tag-background-hover: rgba(211, 54, 130, 0.22);

  --code-normal: #93a1a1;
  --code-background: rgba(147, 161, 161, 0.10);

  --table-border-color: #586e75;
  --table-header-background: rgba(147, 161, 161, 0.10);
  --table-row-alt-background: rgba(147, 161, 161, 0.05);

  --nav-item-color: #839496;
  --nav-item-color-hover: #2aa198;
  --nav-item-color-active: #268bd2;
  --nav-item-background-active: rgba(38, 139, 210, 0.12);
}

/* ---------------------------------------------------------- */
/* PDF Viewer — larger, more prominent                        */
/* ---------------------------------------------------------- */
.pdf-viewer,
.pdf-container,
.markdown-rendered .pdf-viewer,
.markdown-rendered iframe[src*=".pdf"],
.markdown-rendered embed[src*=".pdf"] {
  max-width: 100% !important;
  width: 100% !important;
  height: 800px !important;
  margin: 1.5em 0 !important;
}

.markdown-rendered .pdf-viewer {
  max-width: none;
}