/* css styles */

/* Prefer CMU Serif (Computer Modern Unicode) as the site serif font.
	 CMU Serif is not hosted on Google Fonts by default; you can self-host
	 the font files (e.g. .woff2) and uncomment the @font-face block below.
*/

/* Example self-hosting (place font files under /assets/fonts/ and adjust paths):
@font-face {
	font-family: 'CMU Serif';
	src: url('assets/fonts/cmunrm-regular.woff2') format('woff2'),
			 url('assets/fonts/cmunrm-regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'CMU Serif';
	src: url('assets/fonts/cmunbx-regular.woff2') format('woff2');
	font-weight: 700;
	font-style: bold;
	font-display: swap;
}
*/

body {
		/* Use CMU Serif when available, fall back to common system serif fonts */
		font-family: 'CMU Serif', Georgia, "Times New Roman", serif;
}

/* Badges: keep base sizing/styling but don't hardcode colors so theme/default
   Bootstrap/Quarto badge background colors (e.g. .bg-primary) can apply.
   Removing the earlier hardcoded .badge.bg-* rules prevents forced colors.
*/
.badge {
	font-weight: 600;
	letter-spacing: 0.02em;
	border-radius: 999px;
	padding: 0.45em 0.9em;
	transition: transform 0.18s ease, box-shadow 0.18s ease;
	/* do NOT set background-color or color here — let theme classes control them */
}

/* Unified hover effect for all badges; uses a subtle neutral shadow so color
   choices from the theme remain visible. */
.badge:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
}

/* Center all figures and their contents */
figure,
.figure,
.quarto-figure,
main.content figure,
#quarto-document-content figure {
	display: table; /* use table display to make figure shrink-wrap to image width */
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* Center figure captions and constrain width to figure width */
figcaption,
.figure-caption,
.quarto-float-caption {
	display: table-caption;
	caption-side: bottom;
	text-align: left !important;
	/* caption will automatically match the figure's width */
}

/* Alfolio-like image styling: rounded corners + light shadow */
img,
.figure img,
.card img {
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06), 0 2px 6px rgba(15, 23, 42, 0.04);
	transition: box-shadow 180ms ease, transform 180ms ease;
	/* ensure images remain responsive */
	max-width: 100%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Slight lift on hover for interactive feel */
img:hover,
.figure img:hover,
.card img:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08), 0 6px 14px rgba(15, 23, 42, 0.06);
}

/* --- Badge color palette (user-provided) ---
   Mapping:
   primary  -> #1A374D (rgb(26,55,77))
   success  -> #406882 (rgb(64,104,130))
   info     -> #6998AB (rgb(105,152,171))
   warning  -> #B1D0E0 (rgb(177,208,224))
*/
.badge.bg-primary {
	background-color: #1A374D !important;
	color: #ffffff !important;
	box-shadow: 0 4px 12px rgba(26,55,77,0.12);
}

.badge.bg-success {
	background-color: #406882 !important;
	color: #ffffff !important;
	box-shadow: 0 4px 12px rgba(64,104,130,0.10);
}

.badge.bg-info {
	background-color: #6998AB !important;
	/* use the darkest palette color for text for contrast */
	color: #1A374D !important;
	box-shadow: 0 4px 12px rgba(105,152,171,0.08);
}

.badge.bg-warning {
	background-color: #B1D0E0 !important;
	color: #1A374D !important;
	border: 1px solid rgba(105,152,171,0.25) !important;
	box-shadow: 0 2px 8px rgba(177,208,224,0.06);
}

/* Utility class if you want to apply selectively */
.rounded-shadow {
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06), 0 2px 6px rgba(15, 23, 42, 0.04);
}

/* Unified link color: light blue for all links (nav, content, footer) */
a,
.nav-link,
.navbar .nav-link,
main.content a,
.site-footer a,
.toc a,
#TOC a,
.sidebar-navigation a {
	color: #5b9bd5 !important; /* light blue */
	text-decoration: none;
}

a:hover,
a:focus,
.nav-link:hover,
.navbar .nav-link:hover,
.nav-link:focus,
.navbar .nav-link:focus,
main.content a:hover,
main.content a:focus,
.site-footer a:hover,
.site-footer a:focus,
.toc a:hover,
.toc a:focus,
#TOC a:hover,
#TOC a:focus,
.sidebar-navigation a:hover,
.sidebar-navigation a:focus {
	color: rgb(70, 130, 180) !important; /* steel blue on hover */
	text-decoration: underline;
}

/* Justify main document text and enable automatic hyphenation to avoid
   large gaps in fully-justified lines. Applied to the Quarto main content
   container so UI elements (nav, footer, code blocks) are unaffected. 
   We target paragraph and text-heavy elements, NOT headings. */
main.content p,
main.content li,
main.content dd,
#quarto-document-content p,
#quarto-document-content li,
#quarto-document-content dd {
	text-align: justify;
	/* enable hyphenation where supported */
	-webkit-hyphens: auto;
	   -ms-hyphens: auto;
		   hyphens: auto;
}

/* Left-align title blocks / section headers so the page sections start
   from the left rather than centered. Targets Quarto title block and
   common page-title containers, plus all headings. */
#title-block-header,
.quarto-title,
.quarto-title .title,
.quarto-title .description,
.quarto-title-meta,
.quarto-title-meta .quarto-title-meta-contents,
.quarto-title-banner,
.quarto-banner-title-block,
main.content h1,
main.content h2,
main.content h3,
main.content h4,
main.content h5,
main.content h6,
#quarto-document-content h1,
#quarto-document-content h2,
#quarto-document-content h3,
#quarto-document-content h4,
#quarto-document-content h5,
#quarto-document-content h6 {
	text-align: left !important;
}

/* Prevent justification/hyphenation inside code blocks, pre, tables, and
   other elements where it breaks layout. Use .no-justify on elements to
   opt-out if necessary. */
pre,
code,
table,
blockquote,
.no-justify {
	text-align: left !important;
	-webkit-hyphens: none !important;
	   -ms-hyphens: none !important;
		   hyphens: none !important;
}

/* Inline code styling: texttt font (monospace), no background, black text */
code {
	font-family: 'JetBrains Mono', Courier, monospace !important;
	background-color: transparent !important;
	color: #000000 !important;
	padding: 0 !important;
	border: none !important;
	font-size: 0.9em;
	font-weight: 500;
}

/* Code block styling: larger font for code snippets */
pre code {
	font-size: 1.1em !important;
}

/* Site footer */
.site-footer {
	position: static; /* appear in normal document flow at page end */
	background: none; /* no background */
	box-shadow: none;
}
.site-footer-inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0.2rem 0; 
	text-align: center;
}
.footer-quote {
	font-style: italic;
	font-weight: 400;
	margin: 0;
	font-size: 0.7rem; /* smaller text */
	color: #4b5563; /* darker grey for primary text */
}

/* Footer is in normal flow; no extra bottom padding required */
/* (If you want fixed footer in future, re-add body padding.) */

@media (max-width: 640px) {
	.site-footer-inner {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}
	.footer-quote {
		font-size: 0.7rem;
	}
}