/* Import the JetBrains Mono font family */
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap");

/* -----------------------------------------
   COLOR TOKENS
   ----------------------------------------- */
:root 
{
  /* Core text */
  --lc-body-text: #d4d4d4;
  --lc-heading1-text: #f6f6f6;
  --lc-heading2-text: #e5e5e5;
  --lc-listing-title-text: #f6f6f6;

  /* Links & accents */
  --lc-link: #88B2E2;
  --lc-link-hover: #99c9ff;

  /* Code theme */
  --lc-inline-code-bg: #232527;
  --lc-inline-code-text: #ce9178;
  --lc-code-block-bg: #1f1f1f;
  --lc-code-block-border: #1f1f1f;
  --lc-code-copy-color: #434343;

  /* Navbar */
  --lc-navbar-bg: #304060;
  --lc-body-bg: #202226;

  /* TOC / sidebar */
  --lc-toc-link: #d4d4d4;
  --lc-toc-link-hover: #99c9ff;
  --lc-toc-link-hover-bg: #1b2836;
  --lc-toc-active-bg: #111827;
  --lc-border: #434343;
  --lc-border-hover: #d4d4d4;
}

/* logo styling for normal size (body) text */
.logotypefacesmall 
{
    font-family: "JetBrains Mono", monospace !important;
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: -0.0px;
}

/* logo styling for large size (hero) text */
.logotypefacelarge 
{
    font-family: "JetBrains Mono", monospace !important;
    font-size: 2.0rem;
    font-weight: 600;
    letter-spacing: 0px;
    line-height: 1.0;
    color: var(--lc-body-text);
    display: inline-block;
    line-height: 1.05;
}

/* body text styles */
body
{
    color: var(--lc-body-text);      /* Light text color for readability */
    font-size: 0.90rem !important;   /* smaller than the Bootstrap 1rem default */
    font-weight: 300;
    background-color: var(--lc-body-bg) !important;  /* dark background */
}

/* Make main content more readable by narrowing line width
  this makes narrower bodies of text more centered in the page. see index.qmd */
quarto-document-content 
{
  margin: 0 auto;
}

#quarto-content > * 
{
    padding-top: 14px !important;
    margin-top: 1.5em !important;
}

/* -----------------------------------------
   GLOBAL LINK + HIGHLIGHT COLOR SYSTEM
   ----------------------------------------- */

/* links for body, does not affect navbar */
main a, main a:visited 
{
  color: var(--lc-link) !important;
}

/* both top navbar and body */
a:hover, a:focus 
{
  color: var(--lc-link-hover) !important;
}

/* -----------------------------------------
   HEADINGS, TEXT, LISTINGS STYLES
   ----------------------------------------- */
h1, h2, h3
{
    color: var(--lc-heading1-text) !important;
    font-weight: 600;
}

h4, h5, h6
{
    color: var(--lc-heading2-text) !important;
    font-weight: 600;
}

/* ??? Add spacing between paragraphs and lists */
p, ul, ol 
{
    margin-bottom: 1rem;
}

/* -----------------------------------------
   RECENT POSTS LISTING STYLES
   ----------------------------------------- */

/* Recent Posts, title */
.listing-title a
{
  color: var(--lc-listing-title-text) !important;
  font-weight: 600;
}

/* Recent Posts, description */
.listing-description a
{
  color: var(--lc-body-text) !important;
  opacity: 1.0;
}

.listing-title a:hover,
.listing-description a:hover
{
  color: var(--lc-link-hover) !important;
}

/* -----------------------------------------
   CODE BLOCK + INLINE CODE STYLES
   ----------------------------------------- */

/* Apply to code blocks + inline code */
code, pre, .sourceCode 
{
  font-family: "JetBrains Mono", monospace !important;
}

/* Block-level code (fenced ``` blocks in Quarto) */
pre.sourceCode 
{
  font-size: 0.75rem;          /* slightly smaller for blocks */
  background-color: var(--lc-code-block-bg);        /* editor background */
  padding: 0.5rem 0.5rem;
  overflow-x: auto;
  tab-size: 4;                      /* default VS Code tab size */
}

/* Override the copy button icon with a new inline SVG */
.code-copy-button {
/*
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%234FC3F7' viewBox='0 0 16 16'%3E%3Cpath d='M10 1H3a2 2 0 0 0-2 2v9h1V3a1 1 0 0 1 1-1h7V1z'/%3E%3Cpath d='M13 3H6a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2zM6 4h7a1 1 0 0 1 1 1v1H5V5a1 1 0 0 1 1-1zm8 3v7a1 1 0 0 1-1 1H6a1 1 0 0 1-1-1V7h9z'/%3E%3C/svg%3E") !important;
*/
  background-size: 1em 1em;
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="rgb(43, 43, 43)" viewBox="0 0 16 16"><path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/><path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/></svg>') !important;
}

/* Inline code (inside paragraphs, lists, etc.) */
code
{
  font-size: 0.90em; 
  font-weight: 500;
  color: var(--lc-inline-code-text);      
  background-color: transparent !important;
  padding: 0rem rem !important;
  border-radius: 0px !important;
}

/* -----------------------------------------
   NAVBAR AND SIDEBAR TOC STYLES
   ----------------------------------------- */

/** top navbar styles **/
.navbar,
.navbar-brand,
.navbar-nav .nav-link,
.navbar-text 
{
  background-color: var(--lc-navbar-bg) !important;  /* slightly darker, more professional */
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

/** styling for brand/logo in navbar **/
.navbar-brand 
{
  font-family: "JetBrains Mono", monospace !important;
  letter-spacing: -0.0px;   
  font-size: 0.95rem;  
  line-height: 1.1;
  font-weight: 600;
  margin-left: 0rem;
  margin-right: 2.0rem;
}

/** top navbar link styles **/
.navbar-nav .nav-link 
{
  font-size: 0.9rem; 
  font-weight: 400;
  margin-left: 0.rem;
  margin-right: 0.rem;
}

/* ===== SIDEBAR TOC: BASE LINK STYLE ===== */
.sidebar.margin-sidebar nav#TOC a.nav-link 
{
  font-size: 0.8rem; 
  color: var(--lc-toc-link) !important;              /* base blue */
  border-color: var(--lc-border) !important;  /* subtle border */
}

/* ===== SIDEBAR TOC: HOVER STATE ===== */
.sidebar.margin-sidebar nav#TOC a.nav-link:hover 
{
  color: var(--lc-toc-link-hover) !important;              /* lighter blue */
  border-color: var(--lc-border-hover) !important;  
}

/* ===== SIDEBAR TOC: ACTIVE/CURRENT ITEM ===== */
.sidebar.margin-sidebar nav#TOC a.nav-link.active 
{
  color: var(--lc-link) !important;              /* bright accent blue */
  border-color: var(--lc-border-hover) !important;  /* subtle border */
}

/* ===== SIDEBAR TOC: LEFT ACTIVE INDICATOR BAR ===== */

/* Make sure the pseudo-element exists */
.sidebar.margin-sidebar nav#TOC a.nav-link::before 
{
  content: "";
}

/* Color the active indicator bar */
.sidebar.margin-sidebar nav#TOC a.nav-link.active::before,
.sidebar.margin-sidebar nav#TOC a.nav-link[aria-current="page"]::before,
.sidebar.margin-sidebar nav#TOC a.nav-link[aria-current="true"]::before 
{
  background-color: var(--lc-link) !important;
}