@font-face {
	font-family: 'Share Tech Mono';
	/* Point this url to where you put the file on your server */
	src: url('../fonts/ShareTechMono-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
}

:root {
	--bg-primary: #062b38;
	--text-primary: white;
	--text-secondary: lightgrey;
	--link-color: #e0e000;
	--code-bg: #0e5a76;
	--border-color: #0e5a76;
}

body {
	font-family: 'Share Tech Mono', 'Courire New', Courier, monospace;
	background: ;
	color: white;
}



body {
	line-height: 1.6;
	color: var(--text-primary);
	background-color: var(--bg-primary);
	margin: 0;
	padding: 20px;
}

.container {
	max-width: 800px;
	margin: 0 auto;
}

/* Typography */
h1, h2, h3, h4 {
	margin-top: 24px;
	margin-bottom: 16px;
	font-weight: 600;
	line-height: 1.25;
}

h1 { font-size: 2em; padding-bottom: .3em; border-bottom: 1px solid var(--border-color); }
h2 { font-size: 1.5em; padding-bottom: .3em; border-bottom: 1px solid var(--border-color); }
h3 { font-size: 1.25em; }
h4 { font-size: 1em; }

a { color: var(--link-color); text-decoration: none; }
a:hover { text-decoration: underline; }

p, ul, ol, dl, table, pre, blockquote {
	margin-bottom: 16px;
}

/* Metadata Section */
.metadata {
	color: var(--text-secondary);
	font-size: 0.9em;
	margin-bottom: 24px;
	border-left: 4px solid var(--border-color);
	padding-left: 16px;
}
.metadata div { margin-bottom: 4px; }
.tag {
	display: inline-block;
	background: var(--code-bg);
	padding: 2px 6px;
	border-radius: 3px;
	font-size: 0.85em;
	margin-right: 4px;
}

/* Code Blocks */
pre {
	background-color: var(--code-bg);
	border-radius: 6px;
	padding: 16px;
	overflow: auto;
	font-size: 85%;
	line-height: 1.45;
}
code {
	font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
}
p > code, li > code {
	background-color: var(--code-bg);
	padding: 0.2em 0.4em;
	border-radius: 3px;
	font-size: 85%;
}

/* Blockquotes */
blockquote {
	padding: 0 1em;
	color: var(--text-secondary);
	border-left: 0.25em solid var(--border-color);
	margin-left: 0;
}

.anchor-link {
    text-decoration: none;
    margin-right: 10px;           /* Space between chain and text */
    font-size: 0.8em;             /* Slightly smaller than header text */
    opacity: 0.5;                 /* Semi-transparent to be subtle */
    transition: all 0.2s ease;
    border-bottom: none;          /* Override any default link underlines */
}

/* Hover Effects */
h2:hover .anchor-link,
h3:hover .anchor-link {
    opacity: 1;                   /* Fully visible on hover */
    color: var(--link-color);     /* Uses your theme's cyan/blue */
}

/* Optional: Clean float adjustment if you want it to hang to the left */
@media (min-width: 900px) {
    .anchor-link {
        float: left;
        margin-left: -1.5em;
        padding-right: 0.5em;
    }
}

/* Tables */
table {
	border-collapse: collapse;
	width: 100%;
	margin-bottom: 16px;
	display: block;
	overflow-x: auto;
}
th, td {
	padding: 6px 13px;
	border: 1px solid var(--border-color);
}
tr:nth-child(2n) {
	background-color: var(--code-bg);
}
th {
	font-weight: 600;
	background-color: var(--code-bg);
	text-align: left;
}

hr {
	height: 0.25em;
	padding: 0;
	margin: 24px 0;
	background-color: var(--border-color);
	border: 0;
}