/* Add proper spacing for paragraphs in explanations */
	.quiz-chapter p {
		margin-bottom: 0.5rem;
	}

	.quiz-chapter p:last-child {
		margin-bottom: 0;
	}

	/* Also add spacing for any other markdown elements */
	
		.quiz-chapter h1,
		.quiz-chapter h2,
		.quiz-chapter h3,
		.quiz-chapter h4,
		.quiz-chapter h5,
		.quiz-chapter h6
	 {
		margin-top: 0.75rem;
		margin-bottom: 0.375rem;
		color: var(--color-blue-200);
	}

	
		.quiz-chapter h1:first-child,
		.quiz-chapter h2:first-child,
		.quiz-chapter h3:first-child,
		.quiz-chapter h4:first-child,
		.quiz-chapter h5:first-child,
		.quiz-chapter h6:first-child
	 {
		margin-top: 0;
	}

	.quiz-chapter ul, .quiz-chapter ol {
		margin-bottom: 0.5rem;
	}

	.quiz-chapter li {
		margin-bottom: 0.125rem;
	}

	.quiz-chapter .katex-display {
		margin: 0.75rem 0;
		overflow-x: auto;
		overflow-y: auto;
		max-width: 100%;
		/* Add padding for better mobile experience */
		padding: 0.25rem 0;
	}

	/* Ensure KaTeX display equations are responsive on mobile */
	@media (max-width: 768px) {
		.quiz-chapter .katex-display {
			/* Enable horizontal scrolling on mobile */
			-webkit-overflow-scrolling: touch;
			/* Add subtle scrollbar styling */
			scrollbar-width: thin;
			scrollbar-color: rgba(59, 130, 246, 0.3) transparent;
		}

		.quiz-chapter .katex-display::-webkit-scrollbar {
			height: 4px;
		}

		.quiz-chapter .katex-display::-webkit-scrollbar-track {
			background: transparent;
		}

		.quiz-chapter .katex-display::-webkit-scrollbar-thumb {
			background-color: rgba(59, 130, 246, 0.3);
			border-radius: 2px;
		}

		.quiz-chapter.katex-display::-webkit-scrollbar-thumb:hover {
			background-color: rgba(59, 130, 246, 0.5);
		}
	}

	.quiz-chapter h3 {
		font-size: 1rem;
		line-height: 1.5rem;
		font-weight: 500;
	}

	.quiz-chapter p {
		font-size: 1.1rem;
	}
	.quiz-explanation p {
		font-size: 0.94rem;
	}

	.quiz-chapter p .katex {
		font-size: 1.4rem !important;
	}

	.quiz-chapter label .katex {
		font-size: 1.3rem !important;
	}

	.quiz-chapter .quiz-explanation p .katex {
		font-size: 1.2rem !important;
	}

	.quiz-chapter .quiz-explanation .katex-display .katex {
		font-size: 1.3rem !important;
	}

	/* Ensure KaTeX elements don't break container layout */
	.quiz-chapter .katex {
		max-width: 100%;
	}

	/* Prevent line-break between inline KaTeX expression and trailing punctuation */
	.quiz-chapter .katex-keep {
		white-space: nowrap;
		display: inline;
	}

	/* Handle long inline math expressions */
	.quiz-chapter .katex-html {
		white-space: nowrap;
		overflow-x: visible;
	}

	/* Wrapper for inline equations to handle overflow */
	.quiz-chapter p,
	.quiz-chapter div,
	.quiz-chapter span {
		overflow-wrap: break-word;
		word-wrap: break-word;
	}

	/* For inline KaTeX that might overflow */
	.quiz-chapter .katex:not(.katex-display) {
		display: inline-flex;
		align-items: baseline;
		max-width: 100%;
		overflow-x: auto;
		overflow-y: clip;
		vertical-align: baseline;
		/* Use padding to prevent clipping of superscripts/subscripts */
		padding: 0.15em 4px;
		margin: -0.15em -2px;
		box-sizing: border-box;

		/* Scrollbar styling - matching courseSidebar.svelte (blue-500/60 & blue-400/80 hover) */
		scrollbar-width: thin;
		scrollbar-color: rgba(59, 130, 246, 0.6) transparent;
	}

	.quiz-chapter .katex:not(.katex-display)::-webkit-scrollbar {
		height: 4px;
	}

	.quiz-chapter .katex:not(.katex-display)::-webkit-scrollbar-track {
		background: transparent;
	}

	.quiz-chapter .katex:not(.katex-display)::-webkit-scrollbar-thumb {
		background-color: rgba(59, 130, 246, 0.6);
		border-radius: 2px;
	}

	.quiz-chapter .katex:not(.katex-display)::-webkit-scrollbar-thumb:hover {
		background-color: rgba(96, 165, 250, 0.8);
	}

	/* Mobile-specific: slightly smaller scrollbars */
	@media (max-width: 768px) {
		.quiz-chapter .katex:not(.katex-display) {
			-webkit-overflow-scrolling: touch;
		}

		.quiz-chapter .katex:not(.katex-display)::-webkit-scrollbar {
			height: 3px;
		}
	}

	/* For very long expressions, allow breaking at specific points */
	@media (max-width: 640px) {
		/* display */
		.quiz-chapter .katex-display > .katex > .katex-html {
			font-size: 1.2rem !important;
		}
		/* inline */
		.quiz-chapter .katex > .katex-html {
			font-size: 1.2rem !important;
		}

		.quiz-chapter .quiz-chapter p .katex {
			font-size: 1.2rem !important;
		}

		.quiz-chapter .quiz-chapter label .katex {
			font-size: 1.1rem !important;
		}

		.quiz-chapter .quiz-chapter .quiz-explanation p .katex {
			font-size: 1rem !important;
		}

		.quiz-chapter .quiz-chapter .quiz-explanation .katex-display .katex {
			font-size: 1.1rem !important;
		}
	}