/* Common CSS */

.pt-1 {
	padding-top: 4px;
}

.pt-2 {
	padding-top: 8px;
}

.pt-3 {
	padding-top: 12px;
}

.pb-1 {
	padding-bottom: 4px;
}

.pb-2 {
	padding-bottom: 8px;
}

.pb-3 {
	padding-bottom: 12px;
}

.px-3 {
	padding-left: 12px;
	padding-right: 12px;
}

.py-3 {
	padding-top: 12px;
	padding-bottom: 12px;
}

.highcharts-title {
	left: 0 !important;
	transform: translateX(0) !important;
}

.portlet.box.blue>.portlet-title {
	background-color: #fff !important;
}

.portlet>.portlet-title>.nav-tabs>li>a {
	color: #333;
}

#tblRecommendationsPortfolio.table>tbody>tr {
	margin-bottom: 4px !important;
	overflow: hidden !important;
}

#tblRecommendationsPortfolio.table>tbody>tr>td {
	border-radius: 8px !important;
	padding: 8px 12px !important;
}

#tblRecommendationsPortfolio.table>tbody>tr>td p {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	color: #000 !important;
}

#tblRecommendationsPortfolio.table {
	border-collapse: separate !important;
	border-spacing: 0 4px !important;
}

.portlet.box.blue>.portlet-title>.caption {
	color: #333;
}

/* Force border radius for layout sections */
div#first {
	border-top-right-radius: 4px !important;
	border-bottom-right-radius: 4px !important;
	overflow: hidden !important;
}

div#second {
	border-radius: 4px !important;
	overflow: hidden !important;
}

div#third {
	border-top-left-radius: 4px !important;
	border-bottom-left-radius: 4px !important;
	overflow: hidden !important;
}

.portlet.box>.portlet-title>.tools>a.fullscreen {
	color: #ACACAC;
}

.portlet>.portlet-title>.caption {
	font-size: 14px;
	line-height: 15px;
}

.portlet>.portlet-title>.tools {
	padding: 10px 0 5px 0 !important;
}

.portlet>.portlet-title {
	min-height: 35px !important;
}

.chart-wrapper {
	overflow: clip;
}

.portlet>.portlet-title>.nav-tabs>li>a {
	margin: 1px 0 0 1px !important;
	padding: 4px 10px 3px 10px !important;
}

.table>tbody>tr>td {
	border-top: 0px solid #ddd !important;
}

#tblStockTradingIndex.table>tbody>tr>td {
	border-right: 2px solid #fff !important;
	padding: 2px !important;
}

#chart_DailyActiveReport .highcharts-xaxis-labels span {
	/* white-space: break-spaces !important; */
}

.dropdown-checkboxes label {
	font-weight: 500 !important;
}

#portlet_tab_biendong .nav>li>a {
	padding: 7px 5px 3px 5px !important;
	font-weight: 600 !important;
}

#portlet_tab_biendong .nav-tabs>li>a,
#portlet_tab_biendong .nav-pills>li>a {
	font-size: 12px !important;
}

#portlet_tab_biendong .nav-pills>li>a:hover {
	background-color: transparent !important;
}

#portlet_tab_biendong .nav-pills>li.active>a,
#portlet_tab_biendong .nav-pills>li.active>a:focus,
#portlet_tab_biendong .nav-pills>li.active>a:hover {
	color: #333 !important;
	background-color: #2980B9 !important;
}

#portlet_tab_biendong .nav-pills>li>a {
	border-radius: 4px !important;
	padding: 4px 8px !important;
	background-color: #F0F0F0;
	/* nền xám nhạt khi chưa chọn */
	color: #000;
	/* chữ đen */
}

#chart_CPTheoVonHoa .highcharts-title,
#chart_BienDongThanhKhoan .highcharts-title,
#chart_BienDongChiSoTheoNganh .highcharts-title,
#chart_CoPhieuAnhHuong .highcharts-title {
	font-size: 1.0em !important;
}

/*
 * Nhãn trục (category): hover xanh primary + đậm — giống "Biến động chỉ số theo ngành".
 * Dùng .highcharts-axis-labels (bao cả bar chart / trục đối xứng); bổ sung x/y + tspans.
 */
#chart_BienDongChiSoTheoNganh .highcharts-axis-labels text:hover,
#chart_BienDongChiSoTheoNganh .highcharts-axis-labels text:hover tspan,
#chart_BienDongChiSoTheoNganh .highcharts-axis-labels text tspan:hover,
#chart_BienDongChiSoTheoNganh .highcharts-xaxis-labels text:hover,
#chart_BienDongChiSoTheoNganh .highcharts-xaxis-labels text:hover tspan,
#chart_BienDongChiSoTheoNganh .highcharts-xaxis-labels text tspan:hover,
#chart_CoPhieuAnhHuong .highcharts-axis-labels text:hover,
#chart_CoPhieuAnhHuong .highcharts-axis-labels text:hover tspan,
#chart_CoPhieuAnhHuong .highcharts-axis-labels text tspan:hover,
#chart_CoPhieuAnhHuong .highcharts-xaxis-labels text:hover,
#chart_CoPhieuAnhHuong .highcharts-xaxis-labels text:hover tspan,
#chart_CoPhieuAnhHuong .highcharts-xaxis-labels text tspan:hover,
#chart_CoPhieuAnhHuong .highcharts-yaxis-labels text:hover,
#chart_CoPhieuAnhHuong .highcharts-yaxis-labels text:hover tspan,
#chart_CoPhieuAnhHuong .highcharts-yaxis-labels text tspan:hover,
#chart_BanDo_CoPhieuAnhHuong .highcharts-axis-labels text:hover,
#chart_BanDo_CoPhieuAnhHuong .highcharts-axis-labels text:hover tspan,
#chart_BanDo_CoPhieuAnhHuong .highcharts-axis-labels text tspan:hover,
#chart_BanDo_CoPhieuAnhHuong .highcharts-xaxis-labels text:hover,
#chart_BanDo_CoPhieuAnhHuong .highcharts-xaxis-labels text:hover tspan,
#chart_BanDo_CoPhieuAnhHuong .highcharts-xaxis-labels text tspan:hover,
#chart_BanDo_CoPhieuAnhHuong .highcharts-yaxis-labels text:hover,
#chart_BanDo_CoPhieuAnhHuong .highcharts-yaxis-labels text:hover tspan,
#chart_BanDo_CoPhieuAnhHuong .highcharts-yaxis-labels text tspan:hover {
	fill: #2980B9 !important;
	font-weight: 700 !important;
}

#chart_BienDongThanhKhoan .highcharts-title {
	width: 100% !important;
	text-align: center !important;
	left: 0px !important;
}

.chart,
.pie,
.bars {
	height: 220px !important;
}

.btn.default:active,
.btn.default.active {
	background-image: none;
	background-color: #c6c6c6 !important;
}

/* Filter pill styles - matching center-tab-button active state */
.filter-pill-active {
	background: #E5EFF7 !important;
	outline: 0.5px solid #CADFEE !important;
}

.filter-pill-default {
	background: #FFF !important;
	outline: 0.5px solid #D9D9D9 !important;
}

.filter-pill-text-active {
	color: #2980B9 !important;
}

.filter-pill-text-default {
	color: #000 !important;
}

/* CP tác động chỉ số: thêm độ ưu tiên trong tab (tránh bị theme/Metronic ghi đè fill) */
#tab_tongquan #chart_CoPhieuAnhHuong g.highcharts-axis-labels text:hover,
#tab_tongquan #chart_CoPhieuAnhHuong g.highcharts-axis-labels text:hover tspan,
#tab_tongquan #chart_CoPhieuAnhHuong g.highcharts-axis-labels text tspan:hover,
#tab_bando #chart_BanDo_CoPhieuAnhHuong g.highcharts-axis-labels text:hover,
#tab_bando #chart_BanDo_CoPhieuAnhHuong g.highcharts-axis-labels text:hover tspan,
#tab_bando #chart_BanDo_CoPhieuAnhHuong g.highcharts-axis-labels text tspan:hover {
	fill: #2980B9 !important;
	font-weight: 700 !important;
}

/* Cung cầu — "Giá trị mua bán chủ động theo ngành": nhãn trục dùng useHTML (<a>), hover xanh + đậm */
#chart_DailyActiveReport .highcharts-axis-labels a,
#tab_cungcau #chart_DailyActiveReport .highcharts-axis-labels a {
	cursor: pointer;
	text-decoration: none !important;
}

#chart_DailyActiveReport .highcharts-axis-labels a:hover,
#tab_cungcau #chart_DailyActiveReport .highcharts-axis-labels a:hover {
	color: #2980B9 !important;
	font-weight: 700 !important;
}

/* Bản đồ cung cầu (bubble): con trỏ bàn tay trên điểm/bong bóng */
#chart_Fluctuation .highcharts-series .highcharts-point,
#chart_Fluctuation .highcharts-series .highcharts-point *,
#tab_cungcau #chart_Fluctuation .highcharts-series .highcharts-point,
#tab_cungcau #chart_Fluctuation .highcharts-series .highcharts-point * {
	cursor: pointer !important;
}

/* Tab Xu hướng — nhãn trục SVG + legend (line / RRG / pie) hover xanh primary + đậm */
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-axis-labels text:hover,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-axis-labels text:hover tspan,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-axis-labels text tspan:hover,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-xaxis-labels text:hover,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-xaxis-labels text:hover tspan,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-xaxis-labels text tspan:hover,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-yaxis-labels text:hover,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-yaxis-labels text:hover tspan,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-yaxis-labels text tspan:hover,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-axis-labels text:hover,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-axis-labels text:hover tspan,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-axis-labels text tspan:hover,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-xaxis-labels text:hover,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-xaxis-labels text:hover tspan,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-xaxis-labels text tspan:hover,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-yaxis-labels text:hover,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-yaxis-labels text:hover tspan,
#portlet_tab_xuhuong #chart_RelativeRotationGraph .highcharts-yaxis-labels text tspan:hover,
#portlet_tab_xuhuong #PieChart_Stocks_xuhuong .highcharts-legend-item text:hover,
#portlet_tab_xuhuong #PieChart_Stocks_xuhuong .highcharts-legend-item text:hover tspan,
#portlet_tab_xuhuong #PieChart_Stocks_xuhuong .highcharts-legend-item text tspan:hover {
	fill: #2980B9 !important;
	font-weight: 700 !important;
}

#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-legend-item span:hover,
#portlet_tab_xuhuong #chart_XuHuong_TangTruong .highcharts-legend-item:hover span {
	color: #2980B9 !important;
	font-weight: 700 !important;
}

/* Định giá — "Định giá theo ngành" (stacked column): nhãn trục HTML + chữ; pie "Định giá tổng quan": legend */
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-axis-labels text:hover,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-axis-labels text:hover tspan,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-axis-labels text tspan:hover,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-xaxis-labels text:hover,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-xaxis-labels text:hover tspan,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-xaxis-labels text tspan:hover,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-axis-labels span:hover,
#portlet_tab_dinhgia #chart_FairvalueByIndustry .highcharts-xaxis-labels span:hover,
#chart_FairvalueByIndustry .highcharts-axis-labels span:hover,
#chart_FairvalueByIndustry .highcharts-xaxis-labels span:hover {
	color: #2980B9 !important;
	fill: #2980B9 !important;
	font-weight: 700 !important;
}

#portlet_tab_dinhgia #PieChart_Fairvalue .highcharts-legend-item text:hover,
#portlet_tab_dinhgia #PieChart_Fairvalue .highcharts-legend-item text:hover tspan,
#portlet_tab_dinhgia #PieChart_Fairvalue .highcharts-legend-item text tspan:hover,
#portlet_tab_dinhgia #PieChart_Fairvalue .highcharts-legend-item span:hover,
#portlet_tab_dinhgia #PieChart_Fairvalue .highcharts-legend-item:hover span {
	color: #2980B9 !important;
	fill: #2980B9 !important;
	font-weight: 700 !important;
}