/*
 * ============================================================================
 * Kibaran - Perbaikan geser horizontal (horizontal scroll) akibat iklan
 * ============================================================================
 *
 * MASALAH ASLI:
 *   Di mode mobile, saat kode iklan (AdSense atau jaringan lain) dipasang,
 *   halaman jadi bisa "digeser ke kanan" karena elemen iklan yang disuntik
 *   (<ins class="adsbygoogle">, <iframe>, atau unit ukuran tetap) lebih lebar
 *   dari layar HP sehingga mendorong lebar dokumen melebihi viewport.
 *
 * PENTING (perbaikan regresi):
 *   Versi sebelumnya menerapkan pembatas lebar iklan (max-width:100%, dsb.) di
 *   SEMUA ukuran layar. Efek sampingnya, di DESKTOP banner (mis. banner di bawah
 *   breaking news / headline) ikut "melebar" mengikuti lebar kontainer, karena
 *   lebar alami dari tema ter-override. Padahal masalah geser hanya terjadi di
 *   mobile. Karena itu:
 *     - Di SEMUA layar hanya dipasang "pengaman halaman" (overflow-x pada
 *       html/body). Ini TIDAK mengubah lebar elemen apa pun, hanya mencegah
 *       dokumen bisa digeser mendatar.
 *     - Semua penyempitan lebar elemen iklan HANYA di MOBILE (<= 750px), tempat
 *       masalah sesungguhnya berada. Di desktop, lebar banner kembali mengikuti
 *       pengaturan asli tema (tidak lagi melebar).
 *
 * File ini dimuat SETELAH style.css (lihat inc/core.php -> fungsi_ad_overflow_fix).
 * ============================================================================ */

/* 1) PENGAMAN HALAMAN (semua layar) -----------------------------------------
   Hanya mencegah geser mendatar; TIDAK mengubah lebar elemen apa pun.
   `clip` dipakai agar sidebar `position: sticky` tetap berfungsi di desktop
   (berbeda dgn `hidden` yang menjadikan body sebagai scroll-container). */
html,
body {
	max-width: 100%;
	overflow-x: clip;
}

/* 2) MOBILE (<= 750px): pengaman kuat + rapatkan elemen iklan ----------------
   Di sinilah semua penyempitan lebar diterapkan, sehingga desktop tidak
   terpengaruh sama sekali. */
@media screen and (max-width: 750px) {

	/* `hidden` sebagai pengaman utama sekaligus cadangan untuk browser lama
	   yang belum mengenal `clip`. Di mobile, sidebar sudah menumpuk sehingga
	   sticky tidak terpengaruh. */
	html,
	body {
		overflow-x: hidden;
	}

	/* Wadah iklan: jangan melebihi lebar layar; kelebihan dipotong di dalam
	   wadahnya (bukan mendorong halaman). */
	.sidebar-header-wrap,
	#sidebar-header,
	.sidebar-banner-bawah-headline-wrap,
	.sidebar-banner-bawah-block1-wrap,
	.sidebar-banner-bawah-tombol-share-post-wrap,
	.sidebar-banner-160x600-kiri-wrap,
	.sidebar-banner-160x600-kanan-wrap,
	.post-banner-wrap,
	.header-banner-wrap,
	.infeed-banner {
		max-width: 100%;
		overflow-x: hidden;
		box-sizing: border-box;
	}

	/* Elemen iklan yang disuntik jaringan iklan (AdSense & lainnya). */
	ins.adsbygoogle,
	.adsbygoogle {
		display: block;
		max-width: 100% !important;
		margin-left: auto;
		margin-right: auto;
		overflow: hidden;
	}

	/* iframe iklan (AdSense aswift/google_ads maupun jaringan lain). */
	ins.adsbygoogle iframe,
	.adsbygoogle iframe,
	iframe[id^="aswift_"],
	iframe[id^="google_ads_"],
	iframe[name^="aswift_"],
	iframe[name^="google_ads_"] {
		max-width: 100% !important;
	}

	/* Media di dalam wadah iklan tidak boleh mendorong halaman. */
	.sidebar-header-wrap img,
	.sidebar-header-wrap iframe,
	.sidebar-header-wrap embed,
	.sidebar-header-wrap object,
	.post-banner-wrap img,
	.post-banner-wrap iframe,
	.post-banner-wrap embed,
	.post-banner-wrap object,
	.header-banner-wrap img,
	.header-banner-wrap iframe,
	.infeed-banner img,
	.infeed-banner iframe {
		max-width: 100%;
		height: auto;
	}

	/* Pengaman tambahan: konten & media artikel yang lebar (iklan in-article,
	   embed pihak ketiga, tabel lebar, dsb.) dibatasi agar tidak melebar. */
	.pjs-container,
	#main,
	#content,
	.single-content,
	.entry-content,
	.post-content,
	article {
		max-width: 100%;
		overflow-x: hidden;
		box-sizing: border-box;
	}

	.entry-content img,
	.entry-content iframe,
	.entry-content embed,
	.entry-content object,
	.entry-content video,
	.single-content img,
	.single-content iframe,
	.single-content embed,
	.single-content object,
	.single-content video,
	.post-content img,
	.post-content iframe {
		max-width: 100%;
		height: auto;
	}
}
