/* ==========================================================================
   Chế độ "Lấy dữ liệu thật" — chỉ nạp khi trang có ít nhất một section chạy
   chế độ này (xem tbtc_auto_assets() trong inc/elements/_auto.php).

   Vì sao cần: chữ trong thiết kế được chọn cho vừa khung, còn dữ liệu thật thì
   dài ngắn tuỳ bài. Thẻ của các section này cao cố định và các khối bên trong
   xếp bằng `position: absolute`, nên một tiêu đề dài 3 dòng sẽ ĐÈ lên dòng
   "Xem chi tiết" phía dưới — đúng loại lỗi đã gặp ở thẻ trang danh mục sản phẩm
   (CLAUDE.md mục 8.7 ②, 9.4). Ở đây cắt bằng "…" thay vì để tràn.

   KHÔNG sửa các file trong assets/css/sections/ — chúng TỰ SINH từ prototype.
   ========================================================================== */

.tbtc-page .card-product__title,
.tbtc-page .card-product__desc,
.tbtc-page .card-featured__title,
.tbtc-page .card-project__title,
.tbtc-page .card-project__desc,
.tbtc-page .card-news__title,
.tbtc-page .card-news__desc,
.tbtc-page .card-news-lead__title,
.tbtc-page .card-news-lead__desc {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Tiêu đề: 1 dòng ở thẻ danh mục (khung thấp), 2 dòng ở các thẻ còn lại. */
.tbtc-page .card-product__title,
.tbtc-page .card-featured__title {
	-webkit-line-clamp: 1;
}

.tbtc-page .card-project__title,
.tbtc-page .card-news__title,
.tbtc-page .card-news-lead__title {
	-webkit-line-clamp: 2;
}

/* Mô tả: 2 dòng. */
.tbtc-page .card-product__desc,
.tbtc-page .card-project__desc,
.tbtc-page .card-news__desc,
.tbtc-page .card-news-lead__desc {
	-webkit-line-clamp: 2;
}

/* Đang tải dữ liệu của tab khác: làm mờ chứ không xoá trắng, để trang không
   giật chiều cao giữa hai lượt. */
[data-tab-cards].is-loading {
	opacity: 0.45;
	transition: opacity 150ms ease;
	pointer-events: none;
}

/* Tab trỏ vào chuyên mục chưa có bài nào — xem tbtc_auto_render_cards(). */
.tbtc-page .tbtc-auto-empty {
	flex: 1 1 100%;
	width: 100%;
	margin: 0;
	padding: var(--sp-10) 0;
	text-align: center;
	color: var(--c-desc);
	font-size: var(--fs-body-lg);
	line-height: var(--lh-body-lg);
}