/**
 * Shongshoy Premium dark-mode reading system.
 *
 * This is deliberately loaded after the legacy skin and the generated native
 * palette. It gives posts, widgets, custom HTML, Knowledge Base and Virtual
 * Library pages one stable, accessible dark surface without changing light mode.
 */

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) {
	--ss-dark-canvas: var(--ss-surface-soft, #0f172a);
	--ss-dark-panel: var(--ss-surface, #182230);
	--ss-dark-panel-raised: #1d2b3a;
	--ss-dark-panel-muted: #142131;
	--ss-dark-text: var(--ss-text, #e5edf6);
	--ss-dark-heading: #f7fbff;
	--ss-dark-muted: var(--ss-muted, #a8b3c2);
	--ss-dark-border: var(--ss-border, #334155);
	--ss-dark-link: var(--ss-accent-dark, #7dd3fc);
	--ss-dark-link-hover: #d0f1ff;
	--ss-dark-accent: var(--ss-accent, #38bdf8);
	--ss-dark-quote: #182c3d;
	--ss-dark-code: #101b28;
	--ss-dark-highlight: #f4cd56;
	--ss-dark-highlight-text: #161d26;
	--ss-dark-danger: #ffb0af;
	color-scheme: dark;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) body,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) #page,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .site,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .hfeed,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .cm-site-content,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .site-content,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .content-area {
	background: var(--ss-dark-canvas) !important;
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-content, .cm-main, .cm-primary, #cm-content, .inner-wrap) {
	background-color: var(--ss-dark-canvas) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-header, .site-header, #masthead, .cm-header-builder, .cm-site-branding) {
	background-color: var(--ss-dark-canvas) !important;
	border-color: var(--ss-dark-border) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(#cm-primary-nav, .cm-primary-nav, .cm-header-builder .cm-header-bottom-row) {
	background-color: #17212d !important;
	border-color: var(--ss-dark-border) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(a, .entry-meta a, .cm-entry-meta a) {
	color: var(--ss-dark-link);
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(a:hover, a:focus-visible, .entry-meta a:hover, .cm-entry-meta a:hover) {
	color: var(--ss-dark-link-hover);
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-header a, .cm-primary-nav a, .cm-site-title a, .cm-site-description) {
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-post, article.post, article.page, .widget, .cm-secondary .widget, #secondary .widget, #cm-tertiary .widget, .comment-respond, .comment-body, .comments-area) {
	background-color: var(--ss-dark-panel) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-text) !important;
	box-shadow: none;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-footer, .cm-footer-bar, .site-footer, .cm-footer-cols, .cm-footer-widgets, .site-info, .cm-post-navigation, .post-navigation, .navigation.pagination, .page-numbers) {
	background-color: var(--ss-dark-panel-muted) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-footer, .site-footer, .cm-post-navigation, .post-navigation, .navigation.pagination) :where(a, p, span, li, small, strong) {
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-footer, .site-footer, .cm-post-navigation, .post-navigation, .navigation.pagination) a:hover {
	color: var(--ss-dark-link-hover) !important;
}

/* Every editorial heading stays bright; Gutenberg heading accents remain visible. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-entry-header .cm-entry-title, .entry-title, .cm-entry-title, .entry-content, .cm-post-content) :where(h1, h2, h3, h4, h5, h6),
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.cm-entry-header .cm-entry-title, .entry-title, .cm-entry-title) {
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content) :where(h2.wp-block-heading, h3.wp-block-heading, h4.wp-block-heading, h5.wp-block-heading, h6.wp-block-heading) {
	color: var(--ss-dark-heading) !important;
	background: linear-gradient(90deg, rgba(56, 189, 248, 0.16), transparent 76%) !important;
	border-left-color: var(--ss-dark-accent) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .entry-summary, .cm-entry-summary, .comment-content) :where(p, li, dd, dt, figcaption, figcaption *, small) {
	color: var(--ss-dark-text);
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content) :where(.wp-block-group.has-background, .wp-block-cover, .wp-block-media-text.has-background, .wp-block-columns.has-background) {
	background-color: var(--ss-dark-panel-raised) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content) :where(.wp-block-group.has-background, .wp-block-media-text.has-background, .wp-block-columns.has-background) :where(p, span, strong, em, i, li, h1, h2, h3, h4, h5, h6) {
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-meta, .cm-entry-meta, .entry-meta *, .cm-entry-meta *, .wp-block-post-date, .wp-block-post-author, .comment-metadata, .widget li, .wp-caption-text, figcaption) {
	color: var(--ss-dark-muted) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(input, textarea, select) {
	background-color: var(--ss-dark-code) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.wp-block-button__link, .button, button, input[type="button"], input[type="submit"]) {
	background-color: #1d4157;
	border-color: #4c82a0;
	color: #f4fbff;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.wp-block-button__link, .button, button, input[type="button"], input[type="submit"]):hover,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.wp-block-button__link, .button, button, input[type="button"], input[type="submit"]):focus-visible {
	background-color: #255876;
	border-color: var(--ss-dark-accent);
	color: #ffffff;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(input::placeholder, textarea::placeholder) {
	color: var(--ss-dark-muted) !important;
	opacity: 1;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(button, input[type="button"], input[type="submit"], .wp-element-button) {
	border-color: var(--ss-dark-border);
}

/* Editorial quotes retain their hierarchy without the low-contrast black-on-dark failure. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(blockquote, .wp-block-quote, .wp-block-pullquote) {
	background: var(--ss-dark-quote) !important;
	border-color: var(--ss-dark-accent) !important;
	color: var(--ss-dark-text) !important;
	box-shadow: inset 0 0 0 1px rgba(125, 211, 252, 0.1) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(blockquote, .wp-block-quote, .wp-block-pullquote) :where(p, span, strong, em, i, cite, small, li, a) {
	color: var(--ss-dark-text) !important;
	opacity: 1 !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(blockquote, .wp-block-quote, .wp-block-pullquote) a {
	color: var(--ss-dark-link-hover) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) mark {
	background-color: var(--ss-dark-highlight) !important;
	color: var(--ss-dark-highlight-text) !important;
	border-radius: 0.2em;
	padding-inline: 0.14em;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) mark.has-vivid-red-color,
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) mark[style*="rgba(0, 0, 0, 0)"],
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) mark[style*="transparent"] {
	background-color: transparent !important;
	color: var(--ss-dark-danger) !important;
	padding: 0;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) mark[style*="#a8fc00"] {
	background-color: #a8fc00 !important;
	color: #152000 !important;
}

/* Tables and code keep their own reading surface instead of inheriting arbitrary post colors. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(.wp-block-table, table, pre, .wp-block-code, .wp-block-preformatted, code) {
	color: var(--ss-dark-text) !important;
	border-color: var(--ss-dark-border) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(table, pre, .wp-block-code, .wp-block-preformatted) {
	background-color: var(--ss-dark-code) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(th, thead td) {
	background-color: var(--ss-dark-panel-raised) !important;
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(td, th) {
	border-color: var(--ss-dark-border) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .ss-books-content) :where(tbody tr:nth-child(odd)) {
	background-color: rgba(255, 255, 255, 0.025) !important;
}

/* Third-party/custom HTML often arrives with inline light backgrounds and black text. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .widget_custom_html, .textwidget, .custom-html-widget) :where(.has-background, [style*="background-color"], [style*="background:"], [bgcolor]):not(mark) {
	background-color: var(--ss-dark-panel-raised) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .widget_custom_html, .textwidget, .custom-html-widget) :where(.has-background, [style*="background-color"], [style*="background:"], [bgcolor]):not(mark) :where(h1, h2, h3, h4, h5, h6, p, span, strong, em, i, small, li, dt, dd, label, a) {
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content, .bpress-wrap, .widget_custom_html, .textwidget, .custom-html-widget) :where(.has-background, [style*="background-color"], [style*="background:"], [bgcolor]):not(mark) a {
	color: var(--ss-dark-link) !important;
}

/* Knowledge Base featured images always retain their natural ratio and full width. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-kb-featured, .ss-kb-featured *, .ss-kb-featured img, .ss-kb-featured .wp-post-image) {
	aspect-ratio: auto !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .ss-kb-featured {
	max-height: none !important;
	height: auto !important;
	background: transparent !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-kb-featured img, .ss-kb-featured .wp-post-image) {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	object-fit: contain !important;
}

/* Virtual Library / Books: same dark language as the rest of the site. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-shell, .ss-books-book, .ss-books-content, .ss-books-chapters, .ss-books-suggestions, .ss-books-reading-nav) {
	background-color: var(--ss-dark-panel) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-toc, .ss-books-toc-head) {
	background: var(--ss-dark-panel-muted) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-toc h2, .ss-books-chapters > h2, .ss-books-suggestions > h2, .ss-books-content h1, .ss-books-content h2, .ss-books-content h3, .ss-books-content h4) {
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-toc li, .ss-books-toc a) {
	color: var(--ss-dark-link) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .ss-books-toc button {
	background: var(--ss-dark-panel-raised) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-chapter-card, .ss-books-suggestion, .ss-books-reading-nav a) {
	background: var(--ss-dark-panel-raised) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-heading) !important;
	box-shadow: none !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-chapter-card:hover, .ss-books-chapter-card:focus-visible, .ss-books-suggestion:hover, .ss-books-suggestion:focus-visible, .ss-books-reading-nav a:hover, .ss-books-reading-nav a:focus-visible) {
	background: #243a4d !important;
	border-color: var(--ss-dark-accent) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .ss-books-chapter-card strong {
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) .ss-books-chapter-card span {
	background: rgba(56, 189, 248, 0.16) !important;
	color: #bceeff !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-content p, .ss-books-content li, .ss-books-content dd, .ss-books-content dt) {
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-books-cover, .ss-books-cover img) {
	background: transparent !important;
}

/* Core / Knowledge Base / Islamic Library cards which carry their own light surface. */
html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-kb-wrap, .ss-kb-card, .ss-kb-sidebar, .ss-kb-search, .sshp-page, .sshp-section, .sshp-card, .ss-islam-shell, .ss-islam-card, .ss-islam-section) {
	background-color: var(--ss-dark-panel) !important;
	border-color: var(--ss-dark-border) !important;
	color: var(--ss-dark-text) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-kb-wrap, .ss-kb-card, .ss-kb-sidebar, .sshp-page, .ss-islam-shell) :where(h1, h2, h3, h4, h5, h6, strong) {
	color: var(--ss-dark-heading) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-kb-wrap, .ss-kb-card, .ss-kb-sidebar, .sshp-page, .ss-islam-shell) :where(p, li, small, time, .meta, [class*="meta"], [class*="excerpt"], [class*="description"]) {
	color: var(--ss-dark-muted) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.ss-kb-wrap, .ss-kb-card, .ss-kb-sidebar, .sshp-page, .ss-islam-shell) a {
	color: var(--ss-dark-link) !important;
}

html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(hr, .wp-block-separator) {
	border-color: var(--ss-dark-border) !important;
	background-color: var(--ss-dark-border) !important;
}

@media (max-width: 768px) {
	html:is(.ss-dark-mode, [data-wp-dark-mode-active]) :where(.entry-content, .cm-post-content) :where(h2.wp-block-heading, h3.wp-block-heading, h4.wp-block-heading, h5.wp-block-heading, h6.wp-block-heading) {
		background: rgba(56, 189, 248, 0.13) !important;
	}
}