/* Berita Berkaitan - Struktur asas kotak */
.bb-box {
	margin: 24px 0;
	padding: 16px 20px;
	border-radius: 6px;
	box-sizing: border-box;
	max-width: 100%;
	width: 100%;
	overflow-wrap: break-word;
	word-break: break-word;
}

.bb-title {
	margin: 0 0 8px 0;
	line-height: 1.4;
}

.bb-list {
	margin: 0;
	padding-left: 22px;
}

.bb-list li {
	margin: 4px 0;
	line-height: 1.5;
}

.bb-list a {
	text-decoration: none;
}
.bb-list a:hover,
.bb-list a:focus {
	text-decoration: underline;
}

/* Gaya senarai */
.bb-list-dash {
	list-style: none;
	padding-left: 4px;
}
.bb-list-dash li:before {
	content: "\2013\0020"; /* – */
	margin-right: 2px;
}
.bb-list-disc {
	list-style: disc;
}
.bb-list-decimal {
	list-style: decimal;
}
.bb-list-none {
	list-style: none;
	padding-left: 4px;
}

/* THEME 1: Classic Outline - kotak bergaris seperti portal berita popular */
.bb-theme-classic {
	border: 2px solid;
	background-clip: padding-box;
}

/* THEME 2: Minimal Card - kad ringkas dengan jalur aksen di kiri */
.bb-theme-minimal {
	border: none;
	border-left: 4px solid;
	box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

/* THEME 3: Modern Highlight - bayang lembut, sudut lebih bulat */
.bb-theme-modern {
	border: none;
	border-radius: 12px;
	box-shadow: 0 4px 14px rgba(0,0,0,0.10);
}
.bb-theme-modern .bb-title:before {
	content: "\1F4CC\0020"; /* pin emoji sebagai ikon ringkas */
}

/* ============ RESPONSIVE ============ */

/* Tablet / desktop kecil */
@media (max-width: 782px) {
	.bb-box {
		padding: 14px 18px;
		margin: 20px 0;
	}
}

/* Mobile */
@media (max-width: 600px) {
	.bb-box {
		padding: 12px 14px;
		margin: 16px 0;
		border-radius: 8px;
	}
	.bb-title {
		font-size: 15px !important;
		margin-bottom: 6px;
	}
	.bb-list {
		padding-left: 18px;
		font-size: 14px !important;
	}
	.bb-list-dash,
	.bb-list-none {
		padding-left: 2px;
	}
	.bb-list li {
		margin: 6px 0;
	}
}

/* Mobile kecil */
@media (max-width: 360px) {
	.bb-box {
		padding: 10px 12px;
	}
	.bb-title {
		font-size: 14px !important;
	}
	.bb-list {
		font-size: 13px !important;
		padding-left: 16px;
	}
}