/*
 * Soft Dark Mode untuk Blocksy - Pohon Ilmu
 * Versi toggle: dark aktif hanya saat body punya class .sf-dark-mode-active
 * Struktur/layout tidak diubah.
 */

body.sf-dark-mode-active,
body.sf-dark-mode-active #main-container,
body.sf-dark-mode-active .site-main,
body.sf-dark-mode-active [data-structure*="default"] {
	background: #202426 !important;
	color: #dbe2e7 !important;
	color-scheme: dark;
}

body.sf-dark-mode-active .site-header,
body.sf-dark-mode-active .ct-header,
body.sf-dark-mode-active .ct-header [data-row],
body.sf-dark-mode-active .ct-sticky-container,
body.sf-dark-mode-active .site-footer,
body.sf-dark-mode-active .ct-footer,
body.sf-dark-mode-active .ct-footer [data-row],
body.sf-dark-mode-active .ct-drawer-canvas,
body.sf-dark-mode-active .ct-panel,
body.sf-dark-mode-active #offcanvas,
body.sf-dark-mode-active .mobile-menu,
body.sf-dark-mode-active [data-footer*="type-1"] {
	background: #1b2023 !important;
	color: #dbe2e7 !important;
}

body.sf-dark-mode-active [data-row*="top"],
body.sf-dark-mode-active [data-row*="middle"],
body.sf-dark-mode-active .ct-container-fluid,
body.sf-dark-mode-active .ct-breadcrumbs,
body.sf-dark-mode-active .hero-section,
body.sf-dark-mode-active .page-description,
body.sf-dark-mode-active .archive-description {
	background-color: #20282d !important;
	color: #cfd7dd !important;
}

body.sf-dark-mode-active article,
body.sf-dark-mode-active .entry-card,
body.sf-dark-mode-active .ct-container > .site-main,
body.sf-dark-mode-active .content-area,
body.sf-dark-mode-active #primary,
body.sf-dark-mode-active #secondary,
body.sf-dark-mode-active .sidebar,
body.sf-dark-mode-active .widget,
body.sf-dark-mode-active .ct-sidebar,
body.sf-dark-mode-active .ct-widget,
body.sf-dark-mode-active .ct-comments-container,
body.sf-dark-mode-active .comment-respond,
body.sf-dark-mode-active .comment-body,
body.sf-dark-mode-active .related-posts,
body.sf-dark-mode-active .ct-related-posts,
body.sf-dark-mode-active .ct-share-box,
body.sf-dark-mode-active .ct-author-box,
body.sf-dark-mode-active .ct-newsletter-subscribe,
body.sf-dark-mode-active .ct-posts-shortcode,
body.sf-dark-mode-active .wp-block-group,
body.sf-dark-mode-active .wp-block-columns,
body.sf-dark-mode-active .wp-block-media-text,
body.sf-dark-mode-active .wp-block-query,
body.sf-dark-mode-active .wp-block-latest-posts,
body.sf-dark-mode-active .wp-block-table,
body.sf-dark-mode-active .wp-block-quote,
body.sf-dark-mode-active .wp-block-pullquote,
body.sf-dark-mode-active .toc,
body.sf-dark-mode-active .toc-container,
body.sf-dark-mode-active .ez-toc-container,
body.sf-dark-mode-active #ez-toc-container,
body.sf-dark-mode-active .rank-math-breadcrumb,
body.sf-dark-mode-active .rank-math-list,
body.sf-dark-mode-active .schema-faq,
body.sf-dark-mode-active .schema-faq-section {
	background-color: #252a2e !important;
	color: #dbe2e7 !important;
	border-color: rgba(255,255,255,.10) !important;
}

body.sf-dark-mode-active.single-post article,
body.sf-dark-mode-active.single-post .entry-content,
body.sf-dark-mode-active.page article,
body.sf-dark-mode-active.page .entry-content,
body.sf-dark-mode-active [data-prefix="single_blog_post"] .entry-content {
	background: #24292d !important;
	color: #dbe2e7 !important;
}

body.sf-dark-mode-active h1,
body.sf-dark-mode-active h2,
body.sf-dark-mode-active h3,
body.sf-dark-mode-active h4,
body.sf-dark-mode-active h5,
body.sf-dark-mode-active h6,
body.sf-dark-mode-active .entry-title,
body.sf-dark-mode-active .page-title,
body.sf-dark-mode-active .widget-title,
body.sf-dark-mode-active .ct-widget-title,
body.sf-dark-mode-active .site-title,
body.sf-dark-mode-active .site-description,
body.sf-dark-mode-active .related-entry-title,
body.sf-dark-mode-active .ct-post-title,
body.sf-dark-mode-active .wp-block-heading {
	color: #f2f5f7 !important;
}

body.sf-dark-mode-active p,
body.sf-dark-mode-active li,
body.sf-dark-mode-active td,
body.sf-dark-mode-active th,
body.sf-dark-mode-active figcaption,
body.sf-dark-mode-active caption,
body.sf-dark-mode-active .entry-content,
body.sf-dark-mode-active .entry-content p,
body.sf-dark-mode-active .entry-content li,
body.sf-dark-mode-active .entry-excerpt,
body.sf-dark-mode-active .ct-meta-element,
body.sf-dark-mode-active .post-meta,
body.sf-dark-mode-active .entry-meta,
body.sf-dark-mode-active .comment-content,
body.sf-dark-mode-active .comment-metadata,
body.sf-dark-mode-active .ct-breadcrumbs,
body.sf-dark-mode-active .ct-breadcrumbs span {
	color: #d5dde3 !important;
}

body.sf-dark-mode-active small,
body.sf-dark-mode-active .meta,
body.sf-dark-mode-active .post-date,
body.sf-dark-mode-active .sfpp-meta,
body.sf-dark-mode-active .wp-caption-text,
body.sf-dark-mode-active .logged-in-as,
body.sf-dark-mode-active .comment-notes {
	color: #aeb9c2 !important;
}

body.sf-dark-mode-active a,
body.sf-dark-mode-active .entry-content a,
body.sf-dark-mode-active .widget a,
body.sf-dark-mode-active .ct-footer a,
body.sf-dark-mode-active .site-header a,
body.sf-dark-mode-active .ct-header a {
	color: #75b9ff !important;
}

body.sf-dark-mode-active a:hover,
body.sf-dark-mode-active .entry-content a:hover,
body.sf-dark-mode-active .widget a:hover {
	color: #9bd0ff !important;
}

body.sf-dark-mode-active .menu a,
body.sf-dark-mode-active .ct-menu-link,
body.sf-dark-mode-active nav a,
body.sf-dark-mode-active [class*="menu"] a {
	color: #e8eef2 !important;
}

body.sf-dark-mode-active .menu a:hover,
body.sf-dark-mode-active .ct-menu-link:hover,
body.sf-dark-mode-active nav a:hover,
body.sf-dark-mode-active [class*="menu"] a:hover,
body.sf-dark-mode-active .current-menu-item > a,
body.sf-dark-mode-active .current_page_item > a {
	color: #75b9ff !important;
}

body.sf-dark-mode-active .widget li,
body.sf-dark-mode-active .ct-widget li,
body.sf-dark-mode-active .wp-block-latest-posts li,
body.sf-dark-mode-active .wp-block-categories li,
body.sf-dark-mode-active .wp-block-archives li {
	border-color: rgba(255,255,255,.10) !important;
}

body.sf-dark-mode-active img,
body.sf-dark-mode-active picture,
body.sf-dark-mode-active video,
body.sf-dark-mode-active iframe,
body.sf-dark-mode-active canvas,
body.sf-dark-mode-active svg:not(.sf-dark-mode-icon) {
	filter: none !important;
}

body.sf-dark-mode-active input,
body.sf-dark-mode-active textarea,
body.sf-dark-mode-active select,
body.sf-dark-mode-active .search-field,
body.sf-dark-mode-active .wp-block-search__input,
body.sf-dark-mode-active .ct-search-form input,
body.sf-dark-mode-active .comment-form input,
body.sf-dark-mode-active .comment-form textarea {
	background: #1f2427 !important;
	color: #eef3f6 !important;
	border-color: rgba(255,255,255,.16) !important;
}

body.sf-dark-mode-active input::placeholder,
body.sf-dark-mode-active textarea::placeholder {
	color: #9ca8b1 !important;
}

body.sf-dark-mode-active button:not(.sf-dark-mode-toggle),
body.sf-dark-mode-active .button,
body.sf-dark-mode-active .ct-button,
body.sf-dark-mode-active .wp-block-button__link,
body.sf-dark-mode-active input[type="submit"],
body.sf-dark-mode-active .ct-search-form button {
	background: #2f7dc1 !important;
	color: #fff !important;
	border-color: #2f7dc1 !important;
}

body.sf-dark-mode-active table,
body.sf-dark-mode-active .wp-block-table table {
	background: #24292d !important;
	border-color: rgba(255,255,255,.12) !important;
}

body.sf-dark-mode-active th,
body.sf-dark-mode-active thead,
body.sf-dark-mode-active .wp-block-table thead {
	background: #1f2529 !important;
	color: #f2f5f7 !important;
}

body.sf-dark-mode-active td,
body.sf-dark-mode-active th,
body.sf-dark-mode-active .wp-block-table td,
body.sf-dark-mode-active .wp-block-table th {
	border-color: rgba(255,255,255,.12) !important;
}

body.sf-dark-mode-active tr:nth-child(even) td {
	background: rgba(255,255,255,.025) !important;
}

body.sf-dark-mode-active pre,
body.sf-dark-mode-active code,
body.sf-dark-mode-active kbd,
body.sf-dark-mode-active samp,
body.sf-dark-mode-active .wp-block-code,
body.sf-dark-mode-active .wp-block-preformatted {
	background: #1b2023 !important;
	color: #e6edf3 !important;
	border-color: rgba(255,255,255,.12) !important;
}

body.sf-dark-mode-active details,
body.sf-dark-mode-active summary,
body.sf-dark-mode-active .wp-block-details,
body.sf-dark-mode-active .rank-math-list-item,
body.sf-dark-mode-active .schema-faq-question,
body.sf-dark-mode-active .ez-toc-title-container,
body.sf-dark-mode-active .ez-toc-list,
body.sf-dark-mode-active #ez-toc-container nav {
	background: #252a2e !important;
	color: #dbe2e7 !important;
	border-color: rgba(255,255,255,.10) !important;
}

body.sf-dark-mode-active .ct-breadcrumbs,
body.sf-dark-mode-active .ct-tags a,
body.sf-dark-mode-active .tagcloud a,
body.sf-dark-mode-active .post-navigation,
body.sf-dark-mode-active .posts-navigation,
body.sf-dark-mode-active .ct-pagination,
body.sf-dark-mode-active .page-numbers,
body.sf-dark-mode-active .nav-links,
body.sf-dark-mode-active [class*="taxonomy"] a {
	background-color: transparent !important;
	color: #cbd5dc !important;
	border-color: rgba(255,255,255,.12) !important;
}

body.sf-dark-mode-active .page-numbers.current,
body.sf-dark-mode-active .ct-pagination .current,
body.sf-dark-mode-active .sfpp-tab-btn.active {
	background: #2f7dc1 !important;
	color: #fff !important;
	border-color: #2f7dc1 !important;
}

body.sf-dark-mode-active .sfpp-tab-nav,
body.sf-dark-mode-active .sfpp-popular-list,
body.sf-dark-mode-active .sfpp-popular-item,
body.sf-dark-mode-active .sfpp-info {
	background: transparent !important;
}

body.sf-dark-mode-active .sfpp-tab-btn {
	background: #20262a !important;
	color: #dbe2e7 !important;
	border-color: rgba(255,255,255,.15) !important;
}

body.sf-dark-mode-active .sfpp-thumb,
body.sf-dark-mode-active .sfpp-no-thumb {
	background: #1b2023 !important;
}

body.sf-dark-mode-active .sfpp-title {
	color: #eaf2f8 !important;
}

body.sf-dark-mode-active .related-posts,
body.sf-dark-mode-active .ct-related-posts,
body.sf-dark-mode-active [class*="related"] {
	background: #22272b !important;
	border-color: rgba(255,255,255,.10) !important;
}

body.sf-dark-mode-active .related-posts .entry-card,
body.sf-dark-mode-active .ct-related-posts .entry-card,
body.sf-dark-mode-active [class*="related"] article {
	background: #252a2e !important;
}

body.sf-dark-mode-active .woocommerce div.product,
body.sf-dark-mode-active .woocommerce-page,
body.sf-dark-mode-active .woocommerce table.shop_table,
body.sf-dark-mode-active .woocommerce-cart-form,
body.sf-dark-mode-active .woocommerce-checkout,
body.sf-dark-mode-active .product,
body.sf-dark-mode-active .price {
	background: #24292d !important;
	color: #dbe2e7 !important;
	border-color: rgba(255,255,255,.12) !important;
}

/* Tombol toggle dark/light mode */
.sf-dark-mode-toggle {
	position: fixed !important;
	right: 22px !important;
	bottom: 22px !important;
	z-index: 999999 !important;
	width: 54px !important;
	height: 54px !important;
	border-radius: 999px !important;
	border: 2px solid rgba(255,255,255,.35) !important;
	background: #202124 !important;
	color: #fff !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 24px !important;
	line-height: 1 !important;
	box-shadow: 0 8px 24px rgba(0,0,0,.25) !important;
	cursor: pointer !important;
	padding: 0 !important;
}

.sf-dark-mode-toggle:hover {
	transform: translateY(-1px);
	background: #2b2d31 !important;
}

.sf-dark-mode-toggle .sf-sun { display: none; }
body.sf-dark-mode-active .sf-dark-mode-toggle .sf-moon { display: none; }
body.sf-dark-mode-active .sf-dark-mode-toggle .sf-sun { display: inline; }

@media (max-width: 768px) {
	.sf-dark-mode-toggle {
		right: 14px !important;
		bottom: 14px !important;
		width: 48px !important;
		height: 48px !important;
		font-size: 21px !important;
	}
}

/* ==========================================================
   POHON ILMU FIX - Featured/Trending block dark mode only
   Light mode tidak disentuh.
   Memperbaiki blok Artikel Unggulan yang sebelumnya tetap abu terang
   sehingga teks jadi putih di atas background terang.
========================================================== */
body.sf-dark-mode-active .ct-trending-block,
body.sf-dark-mode-active .ct-trending-block > div,
body.sf-dark-mode-active .ct-trending-block .ct-container,
body.sf-dark-mode-active .ct-trending-block [class*="container"],
body.sf-dark-mode-active .ct-trending-block [class*="wrapper"],
body.sf-dark-mode-active .ct-trending-block [class*="inner"],
body.sf-dark-mode-active .ct-trending-block [class*="row"],
body.sf-dark-mode-active .ct-trending-block [class*="slider"],
body.sf-dark-mode-active .ct-trending-block [class*="carousel"],
body.sf-dark-mode-active .ct-trending-block [class*="posts"],
body.sf-dark-mode-active .ct-trending-block [class*="item"],
body.sf-dark-mode-active .ct-featured-posts,
body.sf-dark-mode-active .ct-featured-posts > div,
body.sf-dark-mode-active .ct-featured-posts .ct-container,
body.sf-dark-mode-active .ct-featured-posts [class*="container"],
body.sf-dark-mode-active .ct-featured-posts [class*="wrapper"],
body.sf-dark-mode-active .ct-featured-posts [class*="inner"],
body.sf-dark-mode-active .ct-featured-posts [class*="row"],
body.sf-dark-mode-active .ct-featured-posts [class*="slider"],
body.sf-dark-mode-active .ct-featured-posts [class*="carousel"],
body.sf-dark-mode-active .ct-featured-posts [class*="posts"],
body.sf-dark-mode-active .ct-featured-posts [class*="item"],
body.sf-dark-mode-active .ct-featured-section,
body.sf-dark-mode-active .ct-featured-section > div,
body.sf-dark-mode-active .ct-featured-section .ct-container {
    background: #20282d !important;
    background-color: #20282d !important;
    color: #dbe2e7 !important;
    border-color: rgba(255,255,255,.10) !important;
}

body.sf-dark-mode-active .ct-trending-block h1,
body.sf-dark-mode-active .ct-trending-block h2,
body.sf-dark-mode-active .ct-trending-block h3,
body.sf-dark-mode-active .ct-trending-block h4,
body.sf-dark-mode-active .ct-trending-block h5,
body.sf-dark-mode-active .ct-trending-block h6,
body.sf-dark-mode-active .ct-trending-block .ct-block-title,
body.sf-dark-mode-active .ct-trending-block .ct-module-title,
body.sf-dark-mode-active .ct-trending-block .entry-title,
body.sf-dark-mode-active .ct-trending-block .post-title,
body.sf-dark-mode-active .ct-featured-posts h1,
body.sf-dark-mode-active .ct-featured-posts h2,
body.sf-dark-mode-active .ct-featured-posts h3,
body.sf-dark-mode-active .ct-featured-posts h4,
body.sf-dark-mode-active .ct-featured-posts h5,
body.sf-dark-mode-active .ct-featured-posts h6,
body.sf-dark-mode-active .ct-featured-posts .ct-block-title,
body.sf-dark-mode-active .ct-featured-posts .ct-module-title,
body.sf-dark-mode-active .ct-featured-posts .entry-title,
body.sf-dark-mode-active .ct-featured-posts .post-title {
    color: #f2f5f7 !important;
}

body.sf-dark-mode-active .ct-trending-block a,
body.sf-dark-mode-active .ct-trending-block .ct-title,
body.sf-dark-mode-active .ct-trending-block .ct-post-title,
body.sf-dark-mode-active .ct-trending-block .entry-title a,
body.sf-dark-mode-active .ct-trending-block .post-title a,
body.sf-dark-mode-active .ct-featured-posts a,
body.sf-dark-mode-active .ct-featured-posts .ct-title,
body.sf-dark-mode-active .ct-featured-posts .ct-post-title,
body.sf-dark-mode-active .ct-featured-posts .entry-title a,
body.sf-dark-mode-active .ct-featured-posts .post-title a {
    color: #eaf2f8 !important;
}

body.sf-dark-mode-active .ct-trending-block a:hover,
body.sf-dark-mode-active .ct-featured-posts a:hover {
    color: #9bd0ff !important;
}

body.sf-dark-mode-active .ct-trending-block .ct-meta-element,
body.sf-dark-mode-active .ct-trending-block .entry-meta,
body.sf-dark-mode-active .ct-trending-block .post-meta,
body.sf-dark-mode-active .ct-trending-block [class*="meta"],
body.sf-dark-mode-active .ct-trending-block [class*="category"],
body.sf-dark-mode-active .ct-featured-posts .ct-meta-element,
body.sf-dark-mode-active .ct-featured-posts .entry-meta,
body.sf-dark-mode-active .ct-featured-posts .post-meta,
body.sf-dark-mode-active .ct-featured-posts [class*="meta"],
body.sf-dark-mode-active .ct-featured-posts [class*="category"] {
    color: #8cc8ff !important;
}

body.sf-dark-mode-active .ct-trending-block button,
body.sf-dark-mode-active .ct-trending-block .flexy-arrow,
body.sf-dark-mode-active .ct-trending-block [class*="arrow"],
body.sf-dark-mode-active .ct-featured-posts button,
body.sf-dark-mode-active .ct-featured-posts .flexy-arrow,
body.sf-dark-mode-active .ct-featured-posts [class*="arrow"] {
    background: #26323a !important;
    color: #dbe2e7 !important;
    border-color: rgba(255,255,255,.14) !important;
}


/* ==========================================================
   FIX V8 - Baca Juga title + search/menu icon dark mode
   - Light mode tidak disentuh.
   - Dark mode: tulisan "BACA JUGA" putih.
   - Search/hamburger desktop, tablet, mobile tidak jadi kotak biru.
========================================================== */

/* BACA JUGA: hanya dark mode */
body.sf-dark-mode-active .sf-baca-juga-title,
html.sf-dark-mode-active body .sf-baca-juga-title {
    color: #ffffff !important;
}

/* BACA JUGA bullet/list tetap nyaman */
body.sf-dark-mode-active .sf-baca-juga-list,
html.sf-dark-mode-active body .sf-baca-juga-list,
body.sf-dark-mode-active .sf-baca-juga-list li,
html.sf-dark-mode-active body .sf-baca-juga-list li {
    color: #ffffff !important;
}

/* Header icon/search/menu: hapus background biru dari rule button global */
body.sf-dark-mode-active .site-header button:not(.sf-dark-mode-toggle),
body.sf-dark-mode-active .ct-header button:not(.sf-dark-mode-toggle),
body.sf-dark-mode-active header button:not(.sf-dark-mode-toggle),
body.sf-dark-mode-active .site-header .ct-button,
body.sf-dark-mode-active .ct-header .ct-button,
body.sf-dark-mode-active .site-header .ct-header-trigger,
body.sf-dark-mode-active .ct-header .ct-header-trigger,
body.sf-dark-mode-active .site-header .ct-search-trigger,
body.sf-dark-mode-active .ct-header .ct-search-trigger,
body.sf-dark-mode-active .site-header [data-id="search"],
body.sf-dark-mode-active .ct-header [data-id="search"],
body.sf-dark-mode-active .site-header [data-id="trigger"],
body.sf-dark-mode-active .ct-header [data-id="trigger"],
body.sf-dark-mode-active .site-header [data-device],
body.sf-dark-mode-active .ct-header [data-device] {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Warna icon search, social, hamburger di dark mode */
body.sf-dark-mode-active .site-header .ct-icon,
body.sf-dark-mode-active .ct-header .ct-icon,
body.sf-dark-mode-active .site-header svg,
body.sf-dark-mode-active .ct-header svg,
body.sf-dark-mode-active .site-header .ct-icon-container,
body.sf-dark-mode-active .ct-header .ct-icon-container,
body.sf-dark-mode-active .site-header .ct-social-box a,
body.sf-dark-mode-active .ct-header .ct-social-box a {
    color: #9fb6c9 !important;
    fill: currentColor !important;
    stroke: currentColor !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Hover tetap rapi, bukan blok biru */
body.sf-dark-mode-active .site-header button:not(.sf-dark-mode-toggle):hover,
body.sf-dark-mode-active .ct-header button:not(.sf-dark-mode-toggle):hover,
body.sf-dark-mode-active .site-header .ct-search-trigger:hover,
body.sf-dark-mode-active .ct-header .ct-search-trigger:hover,
body.sf-dark-mode-active .site-header .ct-header-trigger:hover,
body.sf-dark-mode-active .ct-header .ct-header-trigger:hover,
body.sf-dark-mode-active .site-header [data-id="search"]:hover,
body.sf-dark-mode-active .ct-header [data-id="search"]:hover,
body.sf-dark-mode-active .site-header [data-id="trigger"]:hover,
body.sf-dark-mode-active .ct-header [data-id="trigger"]:hover {
    background: rgba(255,255,255,.06) !important;
    background-color: rgba(255,255,255,.06) !important;
    border-radius: 8px !important;
    color: #dbeafe !important;
}

/* Mobile/tablet: jarak icon tidak berantakan */
@media (max-width: 999px) {
    body.sf-dark-mode-active .site-header [data-id="search"],
    body.sf-dark-mode-active .ct-header [data-id="search"],
    body.sf-dark-mode-active .site-header [data-id="trigger"],
    body.sf-dark-mode-active .ct-header [data-id="trigger"],
    body.sf-dark-mode-active .site-header .ct-search-trigger,
    body.sf-dark-mode-active .ct-header .ct-search-trigger,
    body.sf-dark-mode-active .site-header .ct-header-trigger,
    body.sf-dark-mode-active .ct-header .ct-header-trigger {
        width: auto !important;
        height: auto !important;
        min-width: 34px !important;
        min-height: 34px !important;
        padding: 6px !important;
        margin: 0 2px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
        box-shadow: none !important;
    }
}