/* Typography and Content Styles */

/* Theme and UI Styles */
.ui.header, 
.ui.header h1, 
.ui.header h2, 
.ui.header h3, 
.ui.header h4, 
.ui.header h5, 
.ui.header h6,
h1, h2, h3, h4, h5, h6 { 
	color: var(--text-primary); 
	font-family: 'Poppins', sans-serif !important;
	background: transparent !important;
	margin: 1rem 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
	backdrop-filter: none !important;
	border: none !important;
	cursor: default !important;
	transition: none !important;
	opacity: 1 !important;
	position: static !important;
}

/* Semantic UI standard header sizes with proper contrast */
h1 {
	font-size: 2rem !important;
	font-weight: 700 !important;
	line-height: 1.28571429em !important;
	margin: 2rem 0 1rem !important;
}

h2 {
	font-size: 1.71428571rem !important;
	font-weight: 700 !important;
	line-height: 1.25em !important;
	margin: 1.5rem 0 1rem !important;
}

h3 {
	font-size: 1.28571429rem !important;
	font-weight: 700 !important;
	line-height: 1.18181818em !important;
	margin: 1.2rem 0 0.8rem !important;
}

h4 {
	font-size: 1.07142857rem !important;
	font-weight: 600 !important;
	line-height: 1.2em !important;
	margin: 1rem 0 0.6rem !important;
}

h5 {
	font-size: 1rem !important;
	font-weight: 600 !important;
	line-height: 1.2em !important;
	margin: 0.8rem 0 0.5rem !important;
}

h6 {
	font-size: 0.85714286rem !important;
	font-weight: 600 !important;
	line-height: 1.2em !important;
	margin: 0.6rem 0 0.4rem !important;
}

/* Ensure proper contrast in both themes */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6,
[data-theme="light"] .ui.header {
	color: var(--text-primary) !important;
}

/* Override any specific styling for headers in message content */
.message.assistant span h1,
.message.assistant span h2,
.message.assistant span h3,
.message.assistant span h4,
.message.assistant span h5,
.message.assistant span h6 {
	font-family: 'Poppins', sans-serif !important;
	color: var(--text-primary) !important;
	background: transparent !important;
	margin: 1rem 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
	backdrop-filter: none !important;
	border: none !important;
	cursor: default !important;
	transition: none !important;
	opacity: 1 !important;
	position: static !important;
}

/* Override h2 styling for header elements to match page background */
.top-header .header-brand .ui.header h2,
.header-brand .ui.header h2,
.top-header h2.ui.header {
	background: transparent !important;
	color: var(--text-primary) !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
	backdrop-filter: none !important;
	border-left: none !important;
	border: none !important;
}

/* Remove any hover effects */
h1:hover,
h2:hover,
h3:hover,
h4:hover,
h5:hover,
h6:hover {
	background: transparent !important;
	opacity: 1 !important;
}

/* Remove any caret icons */
h4 .caret-icon,
h5 .caret-icon {
	display: none !important;
}

/* Remove collapsible content styling */
.collapsible-content {
	display: block !important;
	padding: 0 !important;
	max-height: none !important;
	overflow: visible !important;
	transition: none !important;
	background: transparent !important;
	color: var(--text-primary) !important;
	border-radius: 0 !important;
	margin-bottom: 0 !important;
}

.h5-container {
	margin-bottom: 0 !important;
}

/* Make text before colons bold in bullet lists */
.message.assistant span li {
	font-weight: normal;
}

.message.assistant span li::before {
	content: "";
}

.message.assistant span p:has(+ ul) {
	margin-bottom: 0.5rem;
}

/* Target bullet points that contain colons and make the part before the colon bold */
.message.assistant span ul li {
	position: relative;
}

/* Reduce list indentation for better mobile spacing */
.message.assistant span ul {
	padding-left: 1.2em; /* Reduced from default ~2em */
}

.message.assistant span ul ul {
	padding-left: 1em; /* Even less for nested lists */
}

/* Semantic UI Divider Theme Support */
.ui.horizontal.divider {
	color: var(--text-secondary) !important;
	background-color: var(--bg-primary) !important;
}

.ui.horizontal.divider:before,
.ui.horizontal.divider:after {
	border-top-color: var(--border-color) !important;
}

/* Light theme specific adjustments for divider */
[data-theme="light"] .ui.horizontal.divider {
	color: var(--text-secondary) !important;
}

[data-theme="light"] .ui.horizontal.divider:before,
[data-theme="light"] .ui.horizontal.divider:after {
	border-top-color: var(--border-color) !important;
}