/* /frontend/css/modal-indicators.css - 20260812 - 03-00 */
.indicators-list-container {
	width: 100%;
	max-width: 1000px;
	margin-top: 25px;
	padding-top: 25px;
	border-top: 1px solid #333;
	text-align: center;
	flex-shrink: 0;
}
.indicators-list-container h4 {
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 10px;
	color: #fff;
	text-align: center;
}
.indicators-list-subtitle {
	font-size: 15px;
	color: #ccc;
	margin-top: 0;
	margin-bottom: 20px;
	line-height: 1.5;
	text-align: center;
}
/* A-FUCKING-DOCS: BALANCED BADGE LAYOUT FOR INDICATORS LIST.
   Pill-wrapper styling guarantees equalized alignment between info icons and text labels across mobile screens. */
.indicators-list {
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: #ffffff !important;
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px 10px !important;
	justify-content: center !important;
	width: 100% !important;
	box-sizing: border-box !important;
	text-align: center !important;
}
.indicator-item {
	display: inline-flex !important;
	align-items: center !important;
	gap: 5px !important;
	white-space: nowrap !important;
	background: rgba(255, 255, 255, 0.06) !important;
	padding: 4px 8px !important;
	border-radius: 6px !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	box-sizing: border-box !important;
	transition: background-color 0.2s ease, border-color 0.2s ease !important;
}
.indicator-item:hover {
	background: rgba(255, 255, 255, 0.15) !important;
	border-color: rgba(255, 255, 255, 0.3) !important;
}
.indicator-item span {
	color: #ffffff !important;
	font-weight: normal !important;
	font-size: 14px !important;
	transition: color 0.15s ease !important;
}
.indicator-item:hover span {
	color: #FFFF00 !important;
}