:root {
    --bg-color: #f3f3f3;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg-color: #242424;


    }
}

.post h1,
.post h2,
.post h3 {
    letter-spacing: -0.01em;
    line-height: 1.2;
    font-weight: 600;
    margin-bottom: 0;
}

.post h1 {
    font-size: 2.5rem;
    margin-top: 1.5rem;
    margin-bottom: .6rem;
}

.post h2 {
    font-size: 1.5rem;
    margin-top: 1.5rem;
    margin-bottom: .6rem;
}

.post h3 {
    font-size: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: .6rem;
}

.post p {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.post .katex-display>.katex {
    white-space: normal;
    overflow-wrap: break-word;
    overflow-x: auto;
    overflow-y: hidden;
    word-break: break-all;
}

/* .post figure {
	margin: 1.25em 0;
	page-break-inside: avoid;
}

.post hr {
	background: transparent;
	display: block;
	width: 100%;
	height: 1px;
	visibility: visible;
	border: none;
	border-bottom: 1px solid rgba(55, 53, 47, 0.09);
}

.post img {
	max-width: 100%;
}

.post table,
.post th,
.post td {
	border: 1px solid rgba(55, 53, 47, 0.09);
	border-collapse: collapse;
}

.post table {
	border-left: none;
	border-right: none;
}

.post th,
.post td {
	font-weight: normal;
	padding: 0.25em 0.5em;
	line-height: 1.5;
	min-height: 1.5em;
	text-align: left;
}

.post th {
	color: rgba(55, 53, 47, 0.6);
} */

.post ol,
.post ul {
    margin: 0;
    margin-block-start: 0.3em;
    margin-block-end: 0.3em;
}

.post ul>li,
.post ol>li {
    margin-bottom: 0.3em;
}

.post ul {
    padding-inline-start: 1.7em;
}

.post ul>li {
    list-style: disc;
    padding-left: 0.1em;
}

.post ol {
    padding-inline-start: 1.6em;
}

.post ol>li {
    padding-left: 0.2em;
}

/* .post .highlight {
    background-color: var(--bg-color);
    border-radius: 20px;
    padding: 1.3em;
    padding-bottom: 0.5em;
    padding-top: 0.5em;
    margin-top: 0.7em;
    margin-bottom: 0.7em;
} */

.post .highlight {
    background-color: var(--bg-color);
    border-radius: 20px;
    padding: 1em;
    padding-bottom: 1.5em;
    margin-top: 0.7em;
    margin-bottom: 0.7em;
}


.post .highlight i {
    width: 30px;
    font-size: 1.6rem;
    margin-right: 0.2em;
    margin-left: 0.2em;
    margin-top: 0em;
}

/* @media (min-width: 768px) { 
    .post .highlight i {
      display: flex;
    }

    .post .highlight {
        padding: 1em;
        padding-bottom: 1.5em;
    }

    .post .highlight .side {
        flex: 1;
        margin-top: 0.3em;
    }
} */

.post .highlight .side {
    flex: 1;
}
