@import "./timeline.css";

.comment-actions.secondary-text:not(:has(.comment-reply)),
.commentbox-css .item-control,
.commentbox-css .thread-toggle {
	display: none;
}

/**
 * Kelp UI - Custom Theme
 * https://kelpui.com/docs/tools/theme-builder/?color_primary=purple&element_links=primary&element_focus=primary
 */
/* @import "./comments.css";  */

@layer kelp.theme {

	/* Colors */
	:where(:root) {
		--color-gray-50: oklch(98.5% 0.002 247.839);
		--color-gray-100: oklch(96.7% 0.003 264.542);
		--color-gray-200: oklch(92.8% 0.006 264.531);
		--color-gray-300: oklch(87.2% 0.01 258.338);
		--color-gray-400: oklch(70.7% 0.022 261.325);
		--color-gray-500: oklch(55.1% 0.027 264.364);
		--color-gray-600: oklch(44.6% 0.03 256.802);
		--color-gray-700: oklch(37.3% 0.034 259.733);
		--color-gray-800: oklch(27.8% 0.033 256.848);
		--color-gray-900: oklch(21% 0.034 264.665);
		--color-gray-950: oklch(13% 0.028 261.692);
		--color-sky-50: oklch(97.7% 0.013 236.62);
		--color-sky-100: oklch(95.1% 0.026 236.824);
		--color-sky-200: oklch(90.1% 0.058 230.902);
		--color-sky-300: oklch(82.8% 0.111 230.318);
		--color-sky-400: oklch(74.6% 0.16 232.661);
		--color-sky-500: oklch(68.5% 0.169 237.323);
		--color-sky-600: oklch(58.8% 0.158 241.966);
		--color-sky-700: oklch(50% 0.134 242.749);
		--color-sky-800: oklch(44.3% 0.11 240.79);
		--color-sky-900: oklch(39.1% 0.09 240.876);
		--color-sky-950: oklch(29.3% 0.066 243.157);
		--color-slate-600: oklch(44.6% 0.043 257.281);
		--color-slate-700: oklch(37.2% 0.044 257.287);
		--color-slate-800: oklch(27.9% 0.041 260.031);
		--color-violet-50: oklch(0.969 0.016 293.756);
		--color-violet-100: oklch(0.943 0.029 294.588);
		--color-violet-200: oklch(0.894 0.057 293.283);
		--color-violet-300: oklch(0.811 0.111 293.571);
		--color-violet-400: oklch(0.702 0.183 293.541);
		--color-violet-500: oklch(0.606 0.25 292.717);
		--color-violet-600: oklch(0.541 0.281 293.009);
		--color-violet-700: oklch(0.491 0.27 292.581);
		--color-violet-800: oklch(0.432 0.232 292.759);
		--color-violet-900: oklch(0.38 0.189 293.745);
		--color-violet-950: oklch(0.283 0.141 291.089);
		--color-item1: oklch(0.5597 0.1409 295.36);
		--color-item2: oklch(0.507 0.1603 289.41);
		--color-item3: oklch(0.5598 0.1538 307.61);
		--color-item4: oklch(0.5375 0.086 296.78);
		--color-item5: oklch(0.5656 0.1331 283.34);
		--color-offwhite: oklch(0.9437 0.0086 247.92);
		/* daisy */
		--color-base-100: oklch(25.33% .016 252.42);
		--color-base-200: oklch(23.26% .014 253.1);
		--color-base-300: oklch(21.15% .012 254.09);
		--color-surface-a0: oklch(0.2393 0 0);

		/* https://colorffy.com/dark-theme-generator?colors=644AC9-1F1F1F&success=22946E&warning=A87A2A&danger=9C2121&info=21498A&primaryCount=6&surfaceCount=6 */
		/** Base colors */
		--clr-dark-a0: #000000;
		--clr-light-a0: #ffffff;

		/** Theme primary colors */
		--clr-primary-a0: #644ac9;
		--clr-primary-a10: #785dd0;
		--clr-primary-a20: #8a70d6;
		--clr-primary-a30: #9c83dc;
		--clr-primary-a40: #ad97e2;
		--clr-primary-a50: #beabe8;

		/** Theme surface colors */
		--clr-surface-a0: #1f1f1f;
		--clr-surface-a10: #343434;
		--clr-surface-a20: #4a4a4a;
		--clr-surface-a30: #616161;
		--clr-surface-a40: #797979;
		--clr-surface-a50: #939393;

		/** Theme tonal surface colors */
		--clr-surface-tonal-a0: #27232e;
		--clr-surface-tonal-a10: #3b3842;
		--clr-surface-tonal-a20: #514d57;
		--clr-surface-tonal-a30: #68646d;
		--clr-surface-tonal-a40: #7f7c84;
		--clr-surface-tonal-a50: #97959b;

		/** Success colors */
		--clr-success-a0: #22946e;
		--clr-success-a10: #47d5a6;
		--clr-success-a20: #9ae8ce;

		/** Warning colors */
		--clr-warning-a0: #a87a2a;
		--clr-warning-a10: #d7ac61;
		--clr-warning-a20: #ecd7b2;

		/** Danger colors */
		--clr-danger-a0: #9c2121;
		--clr-danger-a10: #d94a4a;
		--clr-danger-a20: #eb9e9e;

		/** Info colors */
		--clr-info-a0: #21498a;
		--clr-info-a10: #4077d1;
		--clr-info-a20: #92b2e5;

		/** Examples */
		/* .bg-primary {
 color: var(--clr-primary-a50);
 background-color: var(--clr-surface-a0); 
} */
	}

	/* Light Theme (default) */

	:where(:root),
	.kelp-theme-light,
	.light {
		/* Fills & Borders */
		--color-primary-fill-muted: var(--color-indigo-95);
		--color-primary-fill-accent: var(--color-indigo-90);
		--color-primary-fill-vivid: var(--color-indigo-50);
		--color-primary-border-muted: var(--color-indigo-90);
		--color-primary-border-accent: var(--color-indigo-80);
		--color-primary-border-vivid: var(--color-indigo-60);
		--color-primary-on-muted: var(--color-indigo-30);
		--color-primary-on-accent: var(--color-indigo-20);
		--color-primary-on-vivid: white;
		--color-primary-outline: var(--color-indigo-50);

		/* Links & Focus */
		--color-text-link: var(--color-indigo-50);
		--color-text-link-hover: var(--color-indigo-40);
		--color-checked: var(--color-indigo-50);
		--focus-ring-color: var(--color-indigo-50);

		/* Custom */
		--color-text-normal: var(--color-slate-600);
		--color-text-header: var(--color-slate-800);
		--color-outline: var(--color-slate-600);
	}

	/* Dark Theme */
	.kelp-theme-dark,
	.dark {
		/* Fills & Borders */
		--color-primary-fill-muted: var(--color-indigo-20);
		--color-primary-fill-accent: var(--color-indigo-30);
		--color-primary-border-muted: var(--color-indigo-30);
		--color-primary-border-accent: var(--color-indigo-40);
		--color-primary-on-muted: var(--color-indigo-95);
		--color-primary-on-accent: var(--color-indigo-95);
		--color-primary-outline: var(--color-indigo-70);

		/* Links & Focus */
		--color-text-link: var(--color-indigo-70);
		--color-text-link-hover: var(--color-indigo-80);
		--color-checked: var(--color-indigo-60);
		--focus-ring-color: var(--color-indigo-60);

		/* Custom */
		--color-text-normal: var(--color-gray-400);
		--color-text-header: white;
		--color-outline: var(--color-offwhite);
	}
}

@layer kelp.extend {
	:where(:root) {
		--breakpoint-3xl: 96em;
		--breakpoint-4xl: 112em;
	}

	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		color: var(--color-text-header);
	}


	.dark body {
		background-color: var(--color-base-100);
	}

	.invisible {
		visibility: hidden;
	}

	.hidden {
		display: none;
	}

	.container-3xl {
		--width: var(--breakpoint-3xl);
		width: 88vw;
	}

	.container-4xl {
		--width: var(--breakpoint-4xl);
		width: 93vw;
	}


	dl > * + * {
		  margin-block-start: var(--size-m, 1em);
		/* --gap: var(--size-m);
		display: flex;
		flex-direction: column;
		gap: var(--gap); */
	}

}

/* === Cards === */
.card {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
	border-radius: 15px 50px;
	width: 360px;
	background-color: var(--background-color);

	.dark & {
		--background-color: var(--color-slate-700);
	}

	img {
		object-fit: cover;
		object-position: top;
		border-radius: 15px 50px 0 0;
		height: 280px;
		width: 100%;
	}

	h2 {
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;

		margin-block-start: 0;
		line-clamp: 3;
		display: -webkit-box;
		overflow: hidden;

		a {
			color: var(--color-text-header);
		}
	}

	p {
		color: var(--color-text-muted);
		font-size: var(--size-xs);
	}

	.content {
		padding: var(--size-m) var(--size-4xl);
		height: 8.5em;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
}

.status-msg-wrap {
	inline-size: fit-content;
	margin-inline: auto;
	padding-inline: var(--size-6xl);

	p {
		margin-block: 0;
	}

	span {
		font-weight: bold;
	}
}

.status-msg-body a {
	display: inline-block;
	text-decoration-line: underline;
	text-decoration-style: dashed;
	text-decoration-color: var(--color-slate-300);
	text-underline-offset: 4px;
	padding-left: 0.5rem;
	padding-right: 0.5rem;

	&:hover {
		text-decoration-color: var(--color-slate-500);
	}

	.dark & {
		text-decoration-color: var(--color-gray-600);

		&:hover {
			text-decoration-color: var(--color-gray-400);
		}
	}
}

.rating {
	display: none;
}

/* === Main styles === */
main {
	max-width: var(--breakpoint-l);
	margin-inline: auto;
	width: 91vw;

	&.search-results {
		max-width: var(--breakpoint-2xl);
	}

	@media (min-width: 1280px) {
		.isHomepage & {
			max-width: var(--breakpoint-xl);
		}
	}
}

main:not(:has(#post-text)) {
	#post-article {
		display: grid;
		gap: 1rem;
		grid-template-areas:
			"header"
			"body"
			"labels";

		#post-body {
			grid-area: body;
			display: block;
			max-width: 65ch;
			margin-inline: auto;
			font-size: var(--size-l);
			line-height: 1.6;
		}

		.separator {
			margin-block-end: var(--size-2xs);
		}
	}
}

.isHomepage .footnote {
	display: none;
}

.footnotes {
	a.reversefootnote {
		text-decoration-line: none;
	}

	hr {
		margin-bottom: 1.25rem;
	}

	ol {
		list-style-type: decimal;
		list-style-position: inside;
		padding-inline: 0;
	}

	ol li:not(:first-child) {
		margin-top: 1.25rem;
	}

	ol p {
		display: inline;
	}
}

agent-build,
#agent-build {
	display: block;
	margin-block-end: var(--space);

	header {
		--color-text-header: white;
		--header-color: var(--color-sky-600);

		background-color: var(--header-color);
		padding: 16px;
		border: 1px solid var(--header-color);

		h1 {
			font-family: var(--font-primary);
			text-align: center;
			font-size: var(--size-s);
			margin-block: 0;
		}
	}

	section {
		--border-color: var(--color-text-normal);

		padding: 24px 16px 24px 8px;
		border-right: 1px solid var(--border-color);
		border-bottom: 1px solid var(--border-color);
		border-left: 1px solid var(--border-color);

		.dark & {
			--border-color: var(--color-gray-400);
		}

		ul {
			display: flex;
			flex-direction: column;
			gap: var(--size-4xs);
			font-size: var(--size-s);
		}
	}

	p {
		text-align: right;
		font-size: var(--size-s);
	}

	a:not(:hover) {
		text-decoration: none;
		color: var(--color-text-normal);
	}
}

#post-header {
	font-size: var(--size-l);
	max-width: 65ch;
	margin-inline: auto;
	width: 100%;

	#post-article:has(.separator) & {
		max-width: inherit;
	}
}

#post-article {
	display: grid;
	margin-block-end: var(--size-6xl);
	gap: 1rem;
	grid-template-areas:
		"header"
		"separator"
		"text"
		"labels";

	.isHomepage & {
		grid-template-areas:
			"header"
			"separator"
			"text"
			"jump";
	}

	:nth-child(1 of .separator) a[style] {
		all: initial !important;
	}

	p:has(+ script):last-of-type,
	p:has(+ div.rating):last-of-type {
		margin-block-end: 0;
	}

	@media (min-width: 1280px) {
		.isHomepage & {
			grid-template-areas:
				"separator header"
				"separator text"
				"separator jump";
			gap: 1.75rem;
		}
	}
}


#headline {

	h1 {
		font-size: var(--size-l);
		font-weight: 600;

		font-family: var(--font-primary);
		margin-block: 0 var(--size-4xs);


		#post-article:not(:has(.separator)) & {
			margin-block: 0;
		}

		a {
			color: var(--color-text-header);
			/* color: var(--color-headline); */
		}

		@media (width >=48rem) {
			font-size: var(--size-5xl);
			font-weight: 700;

			&.headline-long {
				font-size: var(--size-5xl);
			}
		}

		@media (width >=64rem) {
			font-size: 2.66em;
			font-weight: 800;
		}
	}
}

#post-body {
	display: contents;
}

#post-body iframe,
#post-body .rating {
	display: none;
}

.separator {
	grid-area: separator;

	img {
		height: 16rem;
		width: 100%;
		object-fit: cover;
		object-position: top;
		border-radius: var(--border-radius-m);

		@media (width >=40rem) {
			height: 20rem;
		}

		/* CHECK IMAGE HEIGHT */

		@media (min-width: 1280px) {
			.isHomepage & {
				height: 100%;
				max-height: 600px;
			}
		}
	}
}

#post-text {
	grid-area: text;
	max-width: 65ch;
	margin-inline: auto;
	font-size: var(--size-l);
	line-height: 1.6;

	@media (min-width: 1280px) {
		.isHomepage & {
			max-width: 42rem;
		}
	}
}

#jump-link {
	grid-area: jump;
	text-align: center;

	a {
		color: var(--color-text-normal);
	}

	@media (min-width: 1280px) {
		.isHomepage & {
			max-width: 42rem;
		}
	}
}

#post-labels {
	grid-area: labels;
	max-width: 65ch;
	margin-inline: auto;
	width: 100%;
}

#recent {
	h1 {
		font-size: var(--size-xl);

	}

	li {
		font-weight: 500;

		@media (width >=64rem) {
			font-size: var(--size-2xl);
		}
	}

	a {
		color: var(--color-text-normal);
	}

	.divider {
		--divider-color: var(--color-gray-900);
		display: flex;
		margin-top: 3em;
		flex-direction: row;
		align-items: center;
		align-self: stretch;
		white-space: nowrap;

		&:before,
		&:after {
			content: "";
			height: 0.025em;
			width: 100%;
			flex-grow: 1;
			background-color: var(--divider-color);
		}

		.dark & {
			--divider-color: var(--color-gray-400);
		}

		@media print {

			&:before,
			&:after {
				border: 0.5px solid;
			}
		}

		&:not(:empty) {
			gap: 1em;
		}
	}
}

/* === Header nav === */
header#header-nav {
	max-width: var(--breakpoint-2xl);
	width: 91vw;
	margin-inline: auto;
}

header nav ul li a {
	font-weight: 600;
	font-variant-caps: small-caps;
}

.navbar {
	align-items: start;
}

.navbar>div {
	text-align: left;

	#status-update {
		font-style: italic;
		font-size: var(--size-3xs);
		color: var(--color-text-muted);
		height: 8.5px;
	}
}

.navbar ul a,
.navbar summary {
	color: var(--color-text-normal);
}

.action-header,
.action-body {
	padding-left: var(--size-5xs);
}

.action-body {
	padding-top: var(--size-m);

	&:last-child {
		align-items: stretch;
	}

	li a {
		font-size: var(--size-xs);
		color: var(--color-text-normal);

		svg {
			width: var(--size-2xl);
			height: 100%;
		}
	}
}

/* === Footer === */
footer {
	--color-text-normal: white;
	--color-text-header: white;

	color: var(--color-text-normal);
	container: footer / inline-size;
	margin-block-start: var(--size-6xl);
	background-color: var(--background-color);
	padding-block: 2em;
	background-image: linear-gradient(180deg, #ffffff 0%, #dad2ed 100%);

	.dark & {
		background-image: none;
	}

	a,
	a:hover {
		--color: var(--color-text-normal);
		--color-hover: var(--color);
	}

	a:not(:hover) {
		text-decoration: none;
	}

	a {
		text-decoration-line: none;
		text-decoration-color: transparent;
		text-underline-offset: 3px;

		@media (width >=48rem) {
			transition: all 300ms linear;
		}

		:hover {
			text-decoration-line: underline;
			text-decoration-color: var(--color-white);
			text-underline-offset: 3px;
		}
	}

}

footer,
footer h2 {
	font-family: var(--font-monospace);
	font-size: var(--size-s);
}

footer h2 {
	display: block;
}

.the-grid {
	display: grid;
	gap: var(--size-m);
	grid-template-columns: 1fr 2fr 1fr;
	grid-template-areas:
		"item1 item2 item3"
		"item1 item4 item3"
		"item5 item5 item5";

	:has(.item-content ul#new-list li:nth-child(10)) {
		color: green;
		grid-template-areas:
			"item1 item2 item3"
			"item1 item2 item4"
			"item5 item5 item5";
	}

	@container (max-width: 1100px) {
		grid-template-columns: auto;
		grid-template-areas:
			"item1 item2"
			"item1 item4"
			"item3 item3"
			"item5 item5";
	}

	@container (max-width: 875px) {
		grid-template-columns: auto;
		grid-template-areas:
			"item1 item2"
			"item3 item3"
			"item4 item4"
			"item5 item5";
	}

	@container (max-width: 650px) {
		grid-template-columns: auto;
		grid-template-areas:
			"item1"
			"item2"
			"item3"
			"item4"
			"item5";
	}
}

.grid-item {
	border-radius: var(--border-radius-l);
	container: grid-item / inline-size;
	padding: var(--size-4xl);

	h1 {
		font-size: var(--size-m);
		font-weight: 600;
		font-family: var(--font-monospace);
		margin-block: 0;
	}
}

#footer-comm {
	grid-area: item1;
	background-color: var(--color-item1);

	.item-content,
	.feed.section,
	.widget.Feed,
	.widget-content,
	.widget-content>ul {
		display: contents;
	}

	.item-author {
		order: 1;
	}

	.item-author::after {
		content: " on";
	}

	.item-title {
		order: 2;
		font-weight: 600;
		-webkit-line-clamp: 3;
		line-clamp: 3;
		-webkit-box-orient: vertical;
		display: -webkit-box;
		overflow: hidden;
	}

	.item-date {
		order: 3;
		color: oklch(from var(--color-item1) calc(l/2 + .58) c h);
	}

}

#footer-newcoll {
	grid-area: item2;
	background-color: var(--color-item2);

	ul {
		list-style-type: "";
		padding-inline: 0;
	}
}

#footer-nav {
	grid-area: item3;
	container: item3 / inline-size;
	background-color: var(--color-item3);
}

@container item3 (width > 641px) {
	.item-content {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}
}

#footer-masthead {
	grid-area: item4;
	container: item4 / inline-size;
	background-color: var(--color-item4);

	p {
		font-weight: 600;
	}
}

#footer-roll {
	grid-area: item5;
	background-color: var(--color-violet-600);
}

#BlogList1_container {
	box-sizing: border-box;
}

#BlogList1_container ul {
	display: flex;
	padding: var(--size-xs) 0 25px 0;
	list-style: none;
	overflow-x: scroll;
	scroll-snap-type: x mandatory;

	li {
		flex: 0 0 100%;
		scroll-snap-align: start;
		transition: all 0.2s;

		/* max-width: 15rem;
			flex-shrink: 0;
			flex-grow: 1;
			scroll-snap-align: end;
			scroll-margin-right: 0.5rem; */

		&:not(:last-child) {
			margin-right: 10px;
		}

		@media (min-width: 500px) {

			/* background-color: lightgoldenrodyellow; */
			flex-basis: calc(50% - 10px);


			&:not(:last-child) {
				margin-right: 20px;
			}
		}

		@media (min-width: 700px) {

			/* background-color: lightblue; */
			flex-basis: calc(calc(100% / 3) - 20px);


			&:not(:last-child) {
				margin-right: 30px;
			}
		}

		@media (min-width: 1100px) {

			/* background-color: lightgreen; */
			flex-basis: calc(25% - 30px);


			&:not(:last-child) {
				margin-right: 40px;
			}
		}

		@media (min-width: 1680px) {

			/* background-color: lightpink; */
			flex-basis: calc(calc(100% / 5) - 40px);


			&:not(:last-child) {
				margin-right: 50px;
			}
		}

		@media (min-width: 1920px) {
			flex-basis: calc(calc(100% / 6) - 50px);


			&:not(:last-child) {
				margin-right: 60px;
			}
		}

	}

	.blog-title {
		font-weight: 600;
		margin-block-end: var(--size-xs);
	}

	.item-title {
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		line-clamp: 3;
	}

	.item-time {
		color: oklch(from var(--color-item5) calc(l/2 + .58) c h);
	}
}

/* === Comments === */
#header-comments h1 {
	font-size: var(--size-2xl);
	font-family: var(--font-primary);
	color: var(--color-text-normal);
	text-align: center;
	margin-block-end: var(--size-m);
}

#header-comments-start h1 {
	color: var(--color-text-normal);
}

#top-continue.continue {
	display: none;
}

.comment-replybox-single {
	display: none;
}

.comment .comment-replybox-single:has(iframe) {
	display: block;
	grid-column: 1 / -1;
}

.comment-replybox-thread:not(:has(iframe)) {
	display: none;
}

.comment .comment-replies:has(ol li)+.comment-replybox-single:has(iframe) {
	display: block;
	grid-column: 2 / -1;
}

.commentbox-css cite {
	all: unset;
}

#comment-holder {
	--grid-row-gap: var(--space);
	--grid-column-gap: 0.75em;

	ol {
		padding: 0;
		list-style: none;
	}

	#top-ra {
		display: grid;
		grid-template-columns: min-content min-content 1fr;
		row-gap: var(--grid-row-gap);
		column-gap: var(--grid-column-gap);
	}

	.comment-replies ol.thread-chrome.thread-expanded:has(li.comment) {
		display: grid;
		grid-column: 2 / -1;
		grid-template-columns: subgrid;
		row-gap: var(--grid-row-gap);
	}

	li.comment {
		display: grid;
		grid-column: 1 / -1;
		grid-template-columns: subgrid;
		row-gap: var(--grid-row-gap);
	}
}

.commentbox-css #top-ra>.comment>.avatar-image-container {
	grid-column: 1 / 2;
}

.comment-block,
.comment-replies,
.comment-replies .comment-thread.inline-thread,
.comment-replies .comment-thread.inline-thread ol,
.comment-replies .comment-thread.inline-thread ol>div,
.comment-replies .comment-thread ol>div .comment {
	display: contents;
}

.commentbox-css .avatar-image-container {
	width: 1.5rem;
	height: 1.5rem;
}

.commentbox-css .avatar-image-container img {
	/* border-radius: 2em 1.4em; */
	border-radius: var(--border-radius-circle);
}

.commentbox-css .avatar-image-container:has(img[src='//resources.blogblog.com/img/blank.gif']) {
	background-color: var(--color-violet-200);
	/* border-radius: 2em 1.4em; */
	border-radius: var(--border-radius-circle);

	.dark & {
		background-color: var(--color-violet-500);
	}
}

.commentbox-css .comment-block .comment-header {
	display: flex;
	gap: var(--size-m);
	grid-column: 2 / 4;
	align-items: center;
}

.commentbox-css .user {
	font-style: italic;
}

span.icon.user.blog-author,
.icon.user {
	display: none;
}

.commentbox-css .user,
.commentbox-css .datetime {
	font-size: var(--size-xs);

	a:not(:hover) {
		text-decoration: none;
		color: var(--color-text-normal);
	}
}

.commentbox-css .comment-content {
	font-size: var(--size-l);
	line-height: 1.625;
	word-break: break-word;
	clear: both;
	grid-column: 1 / -1;
}

.commentbox-css .comment-actions {
	grid-column: 1 / -1;
}

.commentbox-css .comment-reply {
	font-weight: 600;
	text-decoration-line: none;
}

.commentbox-css .loadmore {
	font-weight: var(--font-weight-bold);
}

.commentbox-css p {
	margin-block-end: 0;
}

.commentbox-css .hidden a {
	display: none;
}

.continue a.comment-reply {
	grid-column: 1 / -1;
}

.comment-form p:last-of-type {
	margin-block-start: var(--space);
}

/* === Pagination === */
#blog-pager {

	p>a.blog-pager-older-link,
	p>a.blog-pager-newer-link {
		--color: white;
	}
}

/* === Solic styles === */
.newcom [style] {
	all: revert;
}

.newcom {
	margin-block-end: var(--space)
}

.newcom table td {
	background-color: #6699cc;
	border: 1px solid rgb(102, 153, 204);
}

.newcom table tbody tr td {
	padding-top: 0.5rem;
	padding-bottom: 1.5rem;
	padding-left: 0.5rem;
	padding-right: 1rem;
}

.newcom table tbody a {
	/* font-weight: var(--font-weight-normal); */
	text-decoration-line: none;
	color: var(--color-text-normal);

	&:hover {
		text-decoration-line: underline;
		text-decoration-color: var(--color-sky-600);
	}
}

.newcom table tbody p a {
	font-size: var(--size-s);
	/* var(--text-sm); */
}

.arrow::after {
	font-size: var(--text-xs);
	vertical-align: text-top;
	padding: 0.25rem;
	color: var(--color-gray-400);
	content: "\2197";
}

@variant group-hover {
	.arrow {
		text-decoration-line: none;
	}
}

#newcom>p {
	--color-text-header: white;
	border-width: 1px;
	border-color: var(--color-sky-600);
	background-color: var(--color-sky-600);
	padding: 1rem;
	text-align: center;
	/* font-size: var(--text-base); */
	font-weight: bold;
	color: var(--color-text-header);
	margin-block: 0;

	@media (width >=64rem) {
		font-size: var(--size-l);
	}
}

#newcom section {
	max-width: none;
	padding-inline: 1rem;
	padding-block: 2rem;
	border-inline-width: 1px;
	border-block-start: 0;
	border-block-end-width: 1px;
	border-color: var(--color-gray-400);
	border-style: solid;
	margin-block-end: var(--space);

			ul {
			display: flex;
			flex-direction: column;
			gap: var(--size-4xs);
			font-size: var(--size-s);
		}
}

#newcom section a {
	font-weight: var(--font-weight-normal);
	text-decoration-line: none;
	color: var(--color-text-normal);

	&:hover {
		text-decoration-line: underline;
		text-decoration-thickness: 2px;
		text-decoration-color: var(--color-sky-500);
	}
}

#newcom section p {
	text-align: right;
	font-size: var(--size-s);
	/* var(--text-sm); */
}

/* === Misc === */
div[style*="clear:right;float:right;width:90px;height:125px;text-align:center;margin-left:25px;"],
div[style*="clear: right; float: right; height: 125px; margin-left: 25px; text-align: center; width: 90px;"],
#post-body div:has(p[style*="background-color: #006dbb"] + p[style*="font-size: 10px"]) {
	display: none;
}

.snippet-title,
.snippet-markup {
	padding: var(--size-xs);
}

.snippet-title,
.snippet-label {
	font-weight: 500;
}

.snippet-data:not(:last-of-type) {
	margin-block-end: var(--size-s);
}

/* === Utilities === */
/* sm */
@media (width >=40rem) {}

/* md */
@media (width >=48rem) {}

/* lg */
@media (width >=64rem) {}

/* xl */
@media (width >=80rem) {}
}