/* Front-page fixes (moved from mu-plugin sf-core-fixes.php 2026-11-02). Loaded by header-front.php. */

/* front-page.css gives .top_right-parent a fixed ~1.7:1 box with the image pinned to the top, so
   HQ's 3:2 (800x533) video thumbnails lost their bottom title banner and wide 700x359 images left a
   white gap. Fill the box with a centered crop. */
.top_right-child img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* 精彩視頻 row: 3:2 box so video thumbnails show whole. */
.culture_shows .top_right-parent {
	padding-bottom: 66.667%;
}

/* On tablet/phone the row wraps to 3/2 columns with no row gap; add spacing and clear each row so
   uneven title lengths can't snag the floats. */
.culture_shows .video_list > li {
	margin-bottom: 14px;
}
@media (min-width: 601px) and (max-width: 800px) {
	.culture_shows .video_list > li:nth-child(3n+1) { clear: left; }
}
@media (max-width: 600px) {
	.culture_shows .video_list > li:nth-child(2n+1) { clear: left; }
}

/* Sidebar 站長推薦 / 視頻頻道 banners: front-page.css only sets max-width:100%, so below 1000px each
   banner kept its own pixel width (300-621px) in a ~620px column. Make every banner fill the column. */
.pickup_prog .one_list img,
.youtube_channels .one_list img {
	display: block;
	width: 100%;
	height: auto;
}
/* The car-donation ad is a 300x250 box ad; don't blow it up past its real size on tablets. */
.pickup_prog .one_list img[src$="/sf-car.jpg"] {
	max-width: 300px;
	margin: 0 auto;
}

/* Box ads (720x600 田七 / 透視進化論 / 陳闖創 etc.) come out in three sizes on phones: the middle-column slot
   (#front_A5) is full width, but the right-column slot (#front_A4) and the lower sidebar (.ads-side) sit in
   #nine_co, which front-page.css fixes at 56% below 800px (meant for the tablet two-column layout). On
   phones give all three the same size: full width, capped at 400px, centred. */
@media (max-width: 600px) {
	.news_list .right_col #nine_co,
	.life_food_sports .right_sections #nine_co { width: 100% !important; float: none; }
	#front_A4 #front_A4_inner,
	.life_food_sports .right_sections #nine_co .ads-side,
	#front_A5 #front_short_middle1 { width: 100% !important; max-width: 400px !important; margin-left: auto !important; margin-right: auto !important; }
	#front_A4 img, .ads-side img, #front_A5 img { width: 100%; height: auto; }
	/* 站長推薦 car-donation box ad: same size as the box ads above */
	.pickup_prog .one_list img[src$="/sf-car.jpg"] { max-width: 400px !important; }
}

/* ---------- 2026-11-03: no half-cut lines on the homepage ----------
   These boxes have fixed heights that are not a whole number of lines, so the last line was sliced in half.
   Keep each box's height (no layout shift) but show only whole lines, ending with "…". */
.one_title > .title,
.one_post > .text,
.culture_topics > .one_post.title,
.bottom_middle > .one_post.title,
.bottom_right > .one_post.title,
.bottom_left > .one_post.title,
.three_col_popular > .one_post.title,
.health_recm > .one_post.title {
	display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;
}
.ns-list .height1 > li { display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.video_news .random-item > .title { display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
@media (max-width: 799px) {
	.one_post > .title { display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
}