/* File: scroll-bar.css */
/* from reset */
::-webkit-scrollbar-track {
	background: 0 0;
}

::-webkit-scrollbar-thumb {
	background: var(--tertiary);
	border: 5px solid var(--theme);
	border-radius: var(--radius);
}

[data-theme="light"] .list::-webkit-scrollbar-thumb {
	border: 5px solid var(--code-bg);
}

::-webkit-scrollbar-thumb:hover {
	background: var(--secondary);
}

::-webkit-scrollbar:not(.highlighttable, .highlight table, .gist .highlight) {
	background: var(--theme);
}

/* from post-single */
.post-content .highlighttable td .highlight pre code::-webkit-scrollbar {
	display: none;
}

.post-content :not(table) ::-webkit-scrollbar-thumb {
	border: 2px solid var(--code-block-bg);
	background: rgb(113, 113, 117);
}

.post-content :not(table) ::-webkit-scrollbar-thumb:hover {
	background: rgb(163, 163, 165);
}

.gist table::-webkit-scrollbar-thumb {
	border: 2px solid rgb(255, 255, 255);
	background: rgb(173, 173, 173);
}

.gist table::-webkit-scrollbar-thumb:hover {
	background: rgb(112, 112, 112);
}

.post-content table::-webkit-scrollbar-thumb {
	border-width: 2px;
}

/* from zmedia */
@media screen and (min-width: 768px) {

	/* reset */
	::-webkit-scrollbar {
		width: 19px;
		height: 11px;
	}
}

/* File: chroma-styles.css */
/* Background */ .bg { color: #cad3f5; background-color: #24273a; }
/* PreWrapper */ .chroma { color: #cad3f5; background-color: #24273a; }
/* Other */ .chroma .x {  }
/* Error */ .chroma .err { color: #ed8796 }
/* CodeLine */ .chroma .cl {  }
/* LineLink */ .chroma .lnlinks { outline: none; text-decoration: none; color: inherit }
/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; }
/* LineHighlight */ .chroma .hl { background-color: #474733 }
/* LineNumbersTable */ .chroma .lnt { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #8087a2 }
/* LineNumbers */ .chroma .ln { white-space: pre; -webkit-user-select: none; user-select: none; margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #8087a2 }
/* Line */ .chroma .line { display: flex; }
/* Keyword */ .chroma .k { color: #c6a0f6 }
/* KeywordConstant */ .chroma .kc { color: #f5a97f }
/* KeywordDeclaration */ .chroma .kd { color: #ed8796 }
/* KeywordNamespace */ .chroma .kn { color: #8bd5ca }
/* KeywordPseudo */ .chroma .kp { color: #c6a0f6 }
/* KeywordReserved */ .chroma .kr { color: #c6a0f6 }
/* KeywordType */ .chroma .kt { color: #ed8796 }
/* Name */ .chroma .n {  }
/* NameAttribute */ .chroma .na { color: #8aadf4 }
/* NameBuiltin */ .chroma .nb { color: #91d7e3 }
/* NameBuiltinPseudo */ .chroma .bp { color: #91d7e3 }
/* NameClass */ .chroma .nc { color: #eed49f }
/* NameConstant */ .chroma .no { color: #eed49f }
/* NameDecorator */ .chroma .nd { color: #8aadf4; font-weight: bold }
/* NameEntity */ .chroma .ni { color: #8bd5ca }
/* NameException */ .chroma .ne { color: #f5a97f }
/* NameFunction */ .chroma .nf { color: #8aadf4 }
/* NameFunctionMagic */ .chroma .fm { color: #8aadf4 }
/* NameLabel */ .chroma .nl { color: #91d7e3 }
/* NameNamespace */ .chroma .nn { color: #f5a97f }
/* NameOther */ .chroma .nx {  }
/* NameProperty */ .chroma .py { color: #f5a97f }
/* NameTag */ .chroma .nt { color: #c6a0f6 }
/* NameVariable */ .chroma .nv { color: #f4dbd6 }
/* NameVariableClass */ .chroma .vc { color: #f4dbd6 }
/* NameVariableGlobal */ .chroma .vg { color: #f4dbd6 }
/* NameVariableInstance */ .chroma .vi { color: #f4dbd6 }
/* NameVariableMagic */ .chroma .vm { color: #f4dbd6 }
/* Literal */ .chroma .l {  }
/* LiteralDate */ .chroma .ld {  }
/* LiteralString */ .chroma .s { color: #a6da95 }
/* LiteralStringAffix */ .chroma .sa { color: #ed8796 }
/* LiteralStringBacktick */ .chroma .sb { color: #a6da95 }
/* LiteralStringChar */ .chroma .sc { color: #a6da95 }
/* LiteralStringDelimiter */ .chroma .dl { color: #8aadf4 }
/* LiteralStringDoc */ .chroma .sd { color: #6e738d }
/* LiteralStringDouble */ .chroma .s2 { color: #a6da95 }
/* LiteralStringEscape */ .chroma .se { color: #8aadf4 }
/* LiteralStringHeredoc */ .chroma .sh { color: #6e738d }
/* LiteralStringInterpol */ .chroma .si { color: #a6da95 }
/* LiteralStringOther */ .chroma .sx { color: #a6da95 }
/* LiteralStringRegex */ .chroma .sr { color: #8bd5ca }
/* LiteralStringSingle */ .chroma .s1 { color: #a6da95 }
/* LiteralStringSymbol */ .chroma .ss { color: #a6da95 }
/* LiteralNumber */ .chroma .m { color: #f5a97f }
/* LiteralNumberBin */ .chroma .mb { color: #f5a97f }
/* LiteralNumberFloat */ .chroma .mf { color: #f5a97f }
/* LiteralNumberHex */ .chroma .mh { color: #f5a97f }
/* LiteralNumberInteger */ .chroma .mi { color: #f5a97f }
/* LiteralNumberIntegerLong */ .chroma .il { color: #f5a97f }
/* LiteralNumberOct */ .chroma .mo { color: #f5a97f }
/* Operator */ .chroma .o { color: #91d7e3; font-weight: bold }
/* OperatorWord */ .chroma .ow { color: #91d7e3; font-weight: bold }
/* Punctuation */ .chroma .p {  }
/* Comment */ .chroma .c { color: #6e738d; font-style: italic }
/* CommentHashbang */ .chroma .ch { color: #6e738d; font-style: italic }
/* CommentMultiline */ .chroma .cm { color: #6e738d; font-style: italic }
/* CommentSingle */ .chroma .c1 { color: #6e738d; font-style: italic }
/* CommentSpecial */ .chroma .cs { color: #6e738d; font-style: italic }
/* CommentPreproc */ .chroma .cp { color: #6e738d; font-style: italic }
/* CommentPreprocFile */ .chroma .cpf { color: #6e738d; font-weight: bold; font-style: italic }
/* Generic */ .chroma .g {  }
/* GenericDeleted */ .chroma .gd { color: #ed8796; background-color: #363a4f }
/* GenericEmph */ .chroma .ge { font-style: italic }
/* GenericError */ .chroma .gr { color: #ed8796 }
/* GenericHeading */ .chroma .gh { color: #f5a97f; font-weight: bold }
/* GenericInserted */ .chroma .gi { color: #a6da95; background-color: #363a4f }
/* GenericOutput */ .chroma .go {  }
/* GenericPrompt */ .chroma .gp {  }
/* GenericStrong */ .chroma .gs { font-weight: bold }
/* GenericSubheading */ .chroma .gu { color: #f5a97f; font-weight: bold }
/* GenericTraceback */ .chroma .gt { color: #ed8796 }
/* GenericUnderline */ .chroma .gl { text-decoration: underline }
/* TextWhitespace */ .chroma .w {  }

/* File: chroma-mod.css */
.chroma {
	background-color: unset !important;
}

.chroma .hl {
	display: flex;
}

.chroma .lnt {
	padding: 0 0 0 12px;
}

.highlight pre.chroma code {
	padding: 8px 0;
}

.highlight pre.chroma .line .cl,
.chroma .ln {
	padding: 0 10px;
}

.chroma .lntd:last-of-type {
	width: 100%;
}

/* File: blank.css */
/*
This is just a placeholder blank stylesheet so as to support adding custom styles budled with theme's default styles

Read https://github.com/adityatelange/hugo-PaperMod/wiki/FAQs#bundling-custom-css-with-themes-assets for more info
 */

/* File: zmedia.css */
@media screen and (max-width: 768px) {
	/* theme-vars */
	:root {
		--gap: 14px;
	}

	/* profile-mode */
	.profile img {
		transform: scale(0.85);
	}

	/* post-entry */
	.first-entry {
		min-height: 260px;
	}

	/* archive */
	.archive-month {
		flex-direction: column;
	}

	.archive-year {
		margin-top: 20px;
	}

	/* footer */
	.footer {
		padding: calc((var(--footer-height) - var(--gap) - 10px) / 2) var(--gap);
	}
}

/* footer */
@media screen and (max-width: 900px) {
	.list .top-link {
		transform: translateY(-5rem);
	}
}

@media screen and (max-width: 340px) {
	.share-buttons {
		justify-content: unset;
	}
}

@media (prefers-reduced-motion) {
	/* terms; profile-mode; post-single; post-entry; post-entry; search; search */
	.terms-tags a:active,
	.button:active,
	.post-entry:active,
	.top-link,
	#searchResults .focus,
	#searchResults li:active {
		transform: none;
	}
}

/* File: theme-vars.css */
:root {
	--gap: 24px;
	--content-gap: 20px;
	--nav-width: 1024px;
	--main-width: 720px;
	--header-height: 60px;
	--footer-height: 60px;
	--radius: 8px;
	--theme: rgb(255, 255, 255);
	--entry: rgb(255, 255, 255);
	--primary: rgb(30, 30, 30);
	--secondary: rgb(108, 108, 108);
	--tertiary: rgb(214, 214, 214);
	--content: rgb(31, 31, 31);
	--code-block-bg: rgb(28, 29, 33);
	--code-bg: rgb(245, 245, 245);
	--border: rgb(238, 238, 238);
	color-scheme: light;
}

:root[data-theme="dark"] {
	--theme: rgb(29, 30, 32);
	--entry: rgb(46, 46, 51);
	--primary: rgb(218, 218, 219);
	--secondary: rgb(155, 156, 157);
	--tertiary: rgb(65, 66, 68);
	--content: rgb(196, 196, 197);
	--code-block-bg: rgb(46, 46, 51);
	--code-bg: rgb(55, 56, 62);
	--border: rgb(51, 51, 51);
	color-scheme: dark;
}

.list {
	background: var(--code-bg);
}

[data-theme="dark"] .list {
	background: var(--theme);
}

/* File: reset.css */
*,
::after,
::before {
	box-sizing: border-box;
}

html {
	-webkit-tap-highlight-color: transparent;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

a,
button,
body,
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--primary);
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
	font-size: 18px;
	line-height: 1.6;
	word-break: break-word;
	background: var(--theme);
}

article,
aside,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
table {
	display: block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: 1.2;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
	margin-top: 0;
	margin-bottom: 0;
}

ul {
	padding: 0;
}

a {
	text-decoration: none;
}

body,
figure,
ul {
	margin: 0;
}

table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	overflow-x: auto;
	word-break: keep-all;
}

button,
input,
textarea {
	padding: 0;
	font: inherit;
	background: 0 0;
	border: 0;
}

input,
textarea {
	outline: 0;
}

button,
input[type=button],
input[type=submit] {
	cursor: pointer;
}

input:-webkit-autofill,
textarea:-webkit-autofill {
	box-shadow: 0 0 0 50px var(--theme) inset;
}

img {
	display: block;
	max-width: 100%;
}

/* File: license.css */
/*
PaperMod v8+
License: MIT https://github.com/adityatelange/hugo-PaperMod/blob/master/LICENSE
Copyright (c) 2020 nanxiaobei and adityatelange
Copyright (c) 2021-2026 adityatelange
 */

/* File: terms.css */
.terms-tags li {
	display: inline-block;
	margin: 10px;
	font-weight: 500;
}

.terms-tags a {
	display: block;
	padding: 3px 10px;
	background: var(--tertiary);
	border-radius: 6px;
	transition: transform 0.1s;
}

.terms-tags a:active {
	background: var(--tertiary);
	transform: scale(0.96);
}

/* File: search.css */
#searchbox input {
	padding: 4px 10px;
	width: 100%;
	color: var(--primary);
	font-weight: bold;
	border: 2px solid var(--tertiary);
	border-radius: var(--radius);
}

#searchbox input:focus {
	border-color: var(--secondary);
}

#searchResults li {
	list-style: none;
	border-radius: var(--radius);
	padding: 10px;
	margin: 10px 0;
	position: relative;
	font-weight: 500;
}

#searchResults {
	margin: 10px 0;
	width: 100%;
}

#searchResults li:active {
	transition: transform 0.1s;
	transform: scale(0.98);
}

#searchResults a {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	outline: none;
}

#searchResults .focus {
	transform: scale(0.98);
	border: 2px solid var(--tertiary);
}

/* File: profile-mode.css */
.buttons,
.main .profile {
	display: flex;
	justify-content: center;
}

.main .profile {
	align-items: center;
	min-height: calc(100vh - var(--header-height) - var(--footer-height) - (var(--gap) * 2));
	text-align: center;
}

.profile .profile_inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.profile img {
	border-radius: 50%;
}

.buttons {
	flex-wrap: wrap;
	max-width: 400px;
}

.button {
	background: var(--tertiary);
	border-radius: var(--radius);
	margin: 8px;
	padding: 6px;
	transition: transform 0.1s;
}

.button-inner {
	padding: 0 8px;
}

.button:active {
	transform: scale(0.96);
}

/* File: post-single.css */
.page-header,
.post-header {
	margin: 24px auto var(--content-gap) auto;
}

.post-title {
	margin-bottom: 2px;
	font-size: 40px;
}

.post-description {
	margin-top: 10px;
	margin-bottom: 5px;
}

.post-meta,
.breadcrumbs {
	color: var(--secondary);
	font-size: 14px;
}

.breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.i18n_list {
	display: inline-flex;
}

.post-meta .i18n_list li {
	list-style: none;
	margin: auto 3px;
}

.breadcrumbs a {
	max-width: 20ch;
	font-size: 16px;
	overflow:hidden;
	white-space:nowrap;
	text-overflow: ellipsis;
}

.post-content {
	color: var(--content);
	margin: 30px 0;
}

.post-content h3,
.post-content h4,
.post-content h5,
.post-content h6 {
	margin: 24px 0 16px;
}

.post-content h1 {
	margin: 40px auto 32px;
	font-size: 40px;
}

.post-content h2 {
	margin: 32px auto 24px;
	font-size: 32px;
}

.post-content h3 {
	font-size: 24px;
}

.post-content h4 {
	font-size: 16px;
}

.post-content h5 {
	font-size: 14px;
}

.post-content h6 {
	font-size: 12px;
}

.post-content a,
.post-meta .i18n_list li a,
.toc a:hover {
	box-shadow: 0 1px 0;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.post-content a code {
	margin: auto 0;
	border-radius: 0;
	box-shadow: 0 -1px 0 var(--primary) inset;
}

.post-content del {
	text-decoration: line-through;
}

.post-content dl,
.post-content ol,
.post-content p,
.post-content figure,
.post-content ul {
	margin-bottom: var(--content-gap);
}

.post-content ol,
.post-content ul {
	padding-inline-start: 20px;
}

.post-content li {
	margin-top: 5px;
}

.post-content li p {
	margin-bottom: 0;
}

.post-content dl {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
}

.post-content dt {
	width: 25%;
	font-weight: 700;
}

.post-content dd {
	width: 75%;
	margin-inline-start: 0;
	padding-inline-start: 10px;
}

.post-content dd~dd,
.post-content dt~dt {
	margin-top: 10px;
}

.post-content table {
	margin-bottom: var(--content-gap);
}

.post-content table th,
.post-content table:not(.highlighttable, .highlight table, .gist .highlight) td {
	min-width: 80px;
	padding: 8px 5px;
	line-height: 1.5;
	border-bottom: 1px solid var(--border);
}

.post-content table th {
	text-align: start;
}

.post-content table:not(.highlighttable) td code:only-child {
	margin: auto 0;
}

.post-content .highlight table {
	border-radius: var(--radius);
}

.post-content .highlight:not(table) {
	margin: 10px auto;
	background: var(--code-block-bg) !important;
	border-radius: var(--radius);
	direction: ltr;
}

.post-content li>.highlight {
	margin-inline-end: 0;
}

.post-content ul pre {
	margin-inline-start: calc(var(--gap) * -2);
}

.post-content .highlight pre {
	margin: 0;
}

.post-content .highlighttable {
	table-layout: fixed;
}

.post-content .highlighttable td:first-child {
	width: 40px;
}

.post-content .highlighttable td .linenodiv {
	padding-inline-end: 0 !important;
}

.post-content .highlighttable td .highlight,
.post-content .highlighttable td .linenodiv pre {
	margin-bottom: 0;
}

.post-content code {
	margin: auto 4px;
	padding: 4px 6px;
	font-size: 0.78em;
	line-height: 1.5;
	background: var(--code-bg);
	border-radius: 2px;
}

.post-content pre code {
	display: grid;
	margin: auto 0;
	padding: 10px;
	color: rgb(213, 213, 214);
	background: var(--code-block-bg) !important;
	border-radius: var(--radius);
	overflow-x: auto;
	word-break: break-all;
}

.post-content blockquote {
	margin: 20px 0;
	padding: 0 14px;
	border-inline-start: 3px solid var(--primary);
}

.post-content hr {
	margin: 30px 0;
	height: 2px;
	background: var(--tertiary);
	border: 0;
}

.post-content iframe {
	max-width: 100%;
}

.post-content img {
	border-radius: 4px;
	margin: 1rem 0;
}

.post-content img[src*="#center"] {
	margin: 1rem auto;
}

.post-content figure.align-center {
	text-align: center;
}

.post-content figure>figcaption {
	color: var(--primary);
	font-size: 16px;
	font-weight: bold;
	margin: 8px 0 16px;
}

.post-content figure>figcaption>p {
	color: var(--secondary);
	font-size: 14px;
	font-weight: normal;
}

.toc {
	margin-bottom: var(--content-gap);
	border: 1px solid var(--border);
	background: var(--code-bg);
	border-radius: var(--radius);
	padding: 0.4em;
}

[data-theme="dark"] .toc {
	background: var(--entry);
}

.toc details summary {
	cursor: zoom-in;
	margin-inline-start: 10px;
	user-select: none;
}

.toc details[open] summary {
	cursor: zoom-out;
}

.toc .details {
	display: inline;
	font-weight: 500;
}

.toc .inner {
	margin: 5px 20px;
	padding: 0 10px;
	opacity: 0.9;
}

.toc li ul {
	margin-inline-start: var(--gap);
}

.toc summary:focus {
	outline: 0;
}

.post-footer {
	margin-top: var(--content-gap);
}

.post-footer>* {
	margin-bottom: 10px;
}

.post-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.post-tags li {
	display: inline-block;
}

.post-tags a,
.share-buttons,
.paginav {
	border-radius: var(--radius);
	background: var(--code-bg);
	border: 1px solid var(--border);
}

.post-tags a {
	display: block;
	padding: 0 14px;
	color: var(--secondary);
	font-size: 14px;
	line-height: 34px;
	background: var(--code-bg);
}

.post-tags a:hover,
.paginav a:hover {
	background: var(--border);
}

.share-buttons {
	padding: 10px;
	display: flex;
	justify-content: center;
	overflow-x: auto;
	gap: 10px;
}

.share-buttons li,
.share-buttons a {
	display: inline-flex;
}

.share-buttons a:not(:last-of-type) {
	margin-inline-end: 12px;
}

h1:hover .anchor,
h2:hover .anchor,
h3:hover .anchor,
h4:hover .anchor,
h5:hover .anchor,
h6:hover .anchor {
	display: inline-flex;
	color: var(--secondary);
	margin-inline-start: 8px;
	font-weight: 500;
	user-select: none;
}

.paginav {
	display: flex;
	line-height: 30px;
}

.paginav a {
	padding-inline-start: 14px;
	padding-inline-end: 14px;
	border-radius: var(--radius);
}

.paginav .title {
	letter-spacing: 1px;
	text-transform: uppercase;
	font-size: small;
	color: var(--secondary);
}

.paginav .prev,
.paginav .next {
	width: 50%;
}

.paginav span:hover:not(.title) {
	box-shadow: 0 1px 0;
}

.paginav .next {
	margin-inline-start: auto;
	text-align: right;
}

[dir="rtl"] .paginav .next {
	text-align: left;
}

h1>a>svg {
	display: inline;
}

img.in-text {
	display: inline;
	margin: auto;
}

/* File: post-entry.css */
.first-entry {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 320px;
	margin: var(--gap) 0 calc(var(--gap) * 2) 0;
}

.first-entry .entry-header {
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
}

.first-entry .entry-header h1 {
	font-size: 34px;
	line-height: 1.3;
}

.first-entry .entry-content {
	margin: 14px 0;
	font-size: 16px;
	-webkit-line-clamp: 3;
}

.first-entry .entry-footer {
	font-size: 14px;
}

.home-info .entry-content {
	-webkit-line-clamp: unset;
}

.post-entry {
	position: relative;
	margin-bottom: var(--gap);
	padding: var(--gap);
	background: var(--entry);
	border-radius: var(--radius);
	transition: transform 0.1s;
	border: 1px solid var(--border);
}

.post-entry:active {
	transform: scale(0.96);
}

.tag-entry .entry-cover {
	display: none;
}

.entry-header h2 {
	font-size: 24px;
	line-height: 1.3;
}

.entry-content {
	margin: 8px 0;
	color: var(--secondary);
	font-size: 14px;
	line-height: 1.6;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.entry-footer {
	color: var(--secondary);
	font-size: 13px;
}

.entry-link {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.entry-hint {
	color: var(--secondary);
}

.entry-hint-parent {
	display: flex;
	justify-content: space-between;
}

.entry-cover {
	font-size: 14px;
	margin-bottom: var(--gap);
	text-align: center;
}

.entry-cover img {
	border-radius: var(--radius);
	width: 100%;
	height: auto;
}

.entry-cover a {
	box-shadow: 0 1px 0 var(--primary);
}

/* File: main.css */
.main {
	position: relative;
	min-height: calc(100vh - var(--header-height) - var(--footer-height));
	max-width: calc(var(--main-width) + var(--gap) * 2);
	margin: auto;
	padding: var(--gap);
}

.page-header h1 {
	font-size: 40px;
}

.pagination {
	display: flex;
}

.pagination a {
	color: var(--theme);
	font-size: 13px;
	line-height: 36px;
	background: var(--primary);
	border-radius: calc(36px / 2);
	padding: 0 16px;
}

.pagination .next {
	margin-inline-start: auto;
}


.social-icons a {
	display: inline-flex;
	padding: 10px;
}

.social-icons a svg {
	height: 26px;
	width: 26px;
}

code {
	direction: ltr;
}

div.highlight,
pre {
	position: relative;
}

.copy-code {
	display: none;
	position: absolute;
	top: 4px;
	right: 4px;
	color: rgba(255, 255, 255, 0.8);
	background: rgba(78, 78, 78, 0.8);
	border-radius: var(--radius);
	padding: 0 5px;
	font-size: 14px;
	user-select: none;
}

div.highlight:hover .copy-code,
pre:hover .copy-code {
	display: block;
}

/* File: header.css */
.nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: calc(var(--nav-width) + var(--gap) * 2);
	margin-inline-start: auto;
	margin-inline-end: auto;
	line-height: var(--header-height);
}

.nav a {
	display: block;
}

.logo,
#menu {
	display: flex;
	margin: auto var(--gap);
}

.logo {
	flex-wrap: inherit;
}

.logo a {
	font-size: 24px;
	font-weight: 700;
}

.logo a img, .logo a svg {
	display: inline;
	vertical-align: middle;
	pointer-events: none;
	transform: translate(0, -10%);
	border-radius: 6px;
	margin-inline-end: 8px;
}

button#theme-toggle {
	font-size: 26px;
	margin: auto 4px;
}

[data-theme="dark"] #moon {
	display: none;
}

[data-theme="light"] #sun {
	display: none;
}

#menu {
	list-style: none;
	word-break: keep-all;
	overflow-x: auto;
	white-space: nowrap;
}

#menu li + li {
	margin-inline-start: var(--gap);
}

#menu a {
	font-size: 16px;
}

#menu .active {
	font-weight: 500;
	border-bottom: 2px solid currentColor;
}

.lang-switch li,
.lang-switch ul,
.logo-switches {
	display: inline-flex;
	margin: auto 4px;
}

.lang-switch {
	display: flex;
	flex-wrap: inherit;
}

.lang-switch a {
	margin: auto 3px;
	font-size: 16px;
	font-weight: 500;
}

.logo-switches {
	flex-wrap: inherit;
}

/* File: footer.css */
.footer,
.top-link {
	font-size: 12px;
	color: var(--secondary);
}

.footer {
	margin: 0;
	padding: calc((var(--footer-height) - var(--gap)) / 2) var(--gap);
	text-align: center;
	line-height: 24px;
	background-color: #000;
}

.footer-logo {
	justify-content: center;
	align-items: center;
	display: flex;
	margin: 30px 0;
}

.footer span {
	margin-inline-start: 1px;
	margin-inline-end: 1px;
}

.footer span:last-child {
	white-space: nowrap;
}

.footer a {
	color: inherit;
	border-bottom: 1px solid var(--secondary);
}

.footer a:hover {
	border-bottom: 1px solid var(--primary);
}

.top-link {
	visibility: hidden;
	position: fixed;
	bottom: 60px;
	right: 30px;
	z-index: 99;
	background: var(--tertiary);
	width: 42px;
	height: 42px;
	padding: 12px;
	border-radius: 64px;
	transition: visibility 0.5s, opacity 0.8s linear;
}

.top-link,
.top-link svg {
	filter: drop-shadow(0px 0px 0px var(--theme));
}

.footer a:hover,
.top-link:hover {
	color: var(--primary);
}

.top-link:focus,
#theme-toggle:focus {
	outline: 0;
}

/* File: archive.css */
.archive-posts {
	width: 100%;
	font-size: 16px;
}

.archive-year {
	margin-top: 40px;
}

.archive-year:not(:last-of-type) {
	border-bottom: 2px solid var(--border);
}

.archive-month {
	display: flex;
	align-items: flex-start;
	padding: 10px 0;
}

.archive-month-header {
	margin: 25px 0;
	width: 200px;
}

.archive-month:not(:last-of-type) {
	border-bottom: 1px solid var(--border);
}

.archive-entry {
	position: relative;
	padding: 5px;
	margin: 10px 0;
}

.archive-entry-title {
	margin: 5px 0;
	font-weight: 400;
}

.archive-count,
.archive-meta {
	color: var(--secondary);
	font-size: 14px;
}

/* File: 404.css */
.not-found {
	position: absolute;
	left: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 80%;
	font-size: 160px;
	font-weight: 700;
}

/* --- Listmonk Subscription Form --- */

.listmonk-form {
    /* Centering and Sizing */
    margin: 40px auto;
    max-width: 450px; /* Compact width for better aesthetics */
    width: 100%;
    text-align: center;
    
    /* Theme Matching */
    padding: var(--gap);
    background: var(--entry);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-sizing: border-box;
}

.listmonk-form h3 {
    margin-bottom: 20px;
    font-size: 24px;
    color: var(--primary);
}

.listmonk-form p {
    margin-bottom: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Input Styling */
.listmonk-form input[type="email"],
.listmonk-form input[type="text"] {
    width: 100%;
    padding: 10px 15px;
    border: 2px solid var(--tertiary);
    border-radius: var(--radius);
    background: var(--theme);
    color: var(--primary);
    font-size: 16px;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
}

.listmonk-form input[type="email"]:focus,
.listmonk-form input[type="text"]:focus {
    border-color: var(--secondary);
    outline: none;
}

/* Checkbox and Label Styling */
.listmonk-form input[type="checkbox"] {
    cursor: pointer;
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--primary);
}

.listmonk-form label {
    font-size: 14px;
    color: var(--secondary);
    cursor: pointer;
    margin-left: 8px;
    user-select: none;
}

/* Submit Button - Styled as a Pill/Paginav button */
.listmonk-form input[type="submit"] {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 30px;
    background: var(--primary);
    color: var(--theme);
    border: none;
    border-radius: 25px; /* Pill shape */
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.1s ease, opacity 0.2s ease;
}

.listmonk-form input[type="submit"]:hover {
    opacity: 0.9;
}

.listmonk-form input[type="submit"]:active {
    transform: scale(0.96); /* PaperMod signature click effect */
}

/* Placeholder Color */
.listmonk-form ::placeholder {
    color: var(--secondary);
    opacity: 0.6;
}

/* Responsive Tweak for Mobile */
@media screen and (max-width: 768px) {
    .listmonk-form {
        margin: 20px auto;
        padding: 20px;
        border-left: none;
        border-right: none;
        border-radius: 0; /* Optional: flush look on small screens */
    }
}
