/* style.css */

/* 1. Import or define fonts */

/* Option A: Use a hosted Google Font via @import */
@import url('https://fonts.googleapis.com/css2?family=Cascadia+Code:wght@200..700&family=Fira+Code:wght@300..700&family=Inter:ital,wght@0,100..900;1,100..900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Jost:ital,wght@0,100..900;1,100..900&family=Libre+Franklin:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
/* Option B: Self‑hosted fonts (if you've added font files into 'assets/fonts') */
/*
@font-face {
  font-family: 'MyCustomFont';
  font-style: normal;
  font-weight: 400;
  src:
    url('assets/fonts/MyCustomFont-Regular.woff2') format('woff2'),
    url('assets/fonts/MyCustomFont-Regular.woff') format('woff');
}
@font-face {
  font-family: 'MyCustomFont';
  font-style: normal;
  font-weight: 700;
  src:
    url('assets/fonts/MyCustomFont-Bold.woff2') format('woff2'),
    url('assets/fonts/MyCustomFont-Bold.woff') format('woff');
}
*/

/* 2. Apply font settings */
/* Body text and paragraphs only */
/* body, .quarto-body, p, .quarto-body p {
  font-family: "Libre Franklin", sans-serif;
} */
body, .quarto-body, p, .quarto-body p {
  font-family: "Libre Franklin", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  letter-spacing: 0.01em;
}

/* Enhanced text rendering */
body, .quarto-body {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Headings specifically */
h1, h2, h3, h4, h5, h6 {
  font-family: "Libre Franklin", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  line-height: 1.2;
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  font-weight: 250;
}

/* Individual heading styles for better hierarchy */
h1 {
  font-size: 2.2rem;
  margin-top: 0;
}

h2 {
  font-size: 1.8rem;
}

h3 {
  font-size: 1.4rem;
}

h4 {
  font-size: 1.2rem;
}

h5 {
  font-size: 1.1rem;
}

h6 {
  font-size: 1rem;
  font-style: italic;
}
/* Code blocks - slightly tighter */
code, pre {
  font-family: 'Fira Code', sans-serif;
  font-size: 0.875rem !important;
  line-height: 1.4;
}
/* Navigation and sidebar elements */
.navbar, .sidebar, .quarto-sidebar, .quarto-navbar, nav {
  font-family: "Jost", sans-serif;
  /* font-family: "Montserrat", system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; */
}

/* Force CodeMirror and all webr code blocks elements to use custom font */
.qwebr-editor, .qwebr-output-code-area, .qwebr-output-code-stdout, .qwebr-output-code-stderr,
.cm-content, .cm-editor, .cm-focused, .cm-line, .cm-activeLine,
[class*="cm-"], [class*="qwebr-"], 
div[class*="cm-"] *, div[class*="qwebr-"] *,
div.sourceCode, div.sourceCode.r, .sourceCode div.tabset-1-1 {
  font-family: 'Fira Code', 'JetBrains Mono', 'Cascadia Code',  'Source Code Pro', Menlo, Monaco, monospace !important;
  font-size: 0.875rem !important;
}

/* Button labels and UI elements */
button, .qwebr-button-run {
  font-family: 'Inter', sans-serif;
}

/* Status area */
#qwebr-status-message-area {
  font-family: 'Inter', sans-serif;
}


.tab-content p {
  font-family: 'Fira Code', monospace;
}

.code-annotation-container-grid span {
  font-family: 'Fira Code', monospace;
  

}