@import "tailwindcss";
@import "highlight.js/styles/atom-one-dark.min.css";
@plugin "daisyui" {
	themes:
		light, dark, dracula, night, nord, sunset, cyberpunk, forest, cmyk, coffee, caramellatte,
		garden, luxury;
}

.markdown-body {
	& p {
		margin-block: 0.5em;
		&:first-child {
			margin-block-start: 0;
		}
		&:last-child {
			margin-block-end: 0;
		}
	}
	& h1,
	& h2,
	& h3,
	& h4,
	& h5,
	& h6 {
		font-weight: 600;
		line-height: 1.25;
		margin-block: 0.75em 0.25em;
		&:first-child {
			margin-block-start: 0;
		}
	}
	& h1 {
		font-size: 1.4em;
	}
	& h2 {
		font-size: 1.2em;
	}
	& h3 {
		font-size: 1.1em;
	}
	& ul,
	& ol {
		padding-inline-start: 1.5em;
		margin-block: 0.5em;
	}
	& ul {
		list-style-type: disc;
	}
	& ol {
		list-style-type: decimal;
	}
	& li {
		margin-block: 0.15em;
	}
	& pre {
		overflow-x: auto;
		border-radius: var(--radius-box);
		margin-block: 0.5em;
		background-color: oklch(var(--color-neutral));
		color: oklch(var(--color-neutral-content));
	}
	& pre code {
		display: block;
		padding: 0.75em 1em;
		font-size: 0.8125em;
		line-height: 1.5;
	}
	& :not(pre) > code {
		font-size: 0.875em;
		padding: 0.15em 0.4em;
		border-radius: var(--radius-selector);
		background-color: oklch(var(--color-base-content) / 0.1);
	}
	& blockquote {
		border-inline-start: 3px solid oklch(var(--color-base-content) / 0.2);
		padding-inline-start: 0.75em;
		margin-block: 0.5em;
		opacity: 0.8;
	}
	& a {
		color: oklch(var(--color-primary));
		text-decoration: underline;
		&:hover {
			opacity: 0.8;
		}
	}
	& strong {
		font-weight: 600;
	}
	& table {
		width: 100%;
		border-collapse: collapse;
		margin-block: 0.5em;
		font-size: 0.875em;
	}
	& th,
	& td {
		border: 1px solid oklch(var(--color-base-content) / 0.15);
		padding: 0.4em 0.75em;
		text-align: start;
	}
	& th {
		font-weight: 600;
		background-color: oklch(var(--color-base-200));
	}
	& hr {
		border: none;
		border-top: 1px solid oklch(var(--color-base-content) / 0.2);
		margin-block: 0.75em;
	}
}