/*
 * Site-wide dark mode.
 *
 * Component styles intentionally keep the publication's red, yellow and
 * paper-coloured art direction. These rules only replace reading surfaces and
 * explicitly restore dark text on light accent/media islands.
 */
.sa-dark-mode {
	--sa-dark-canvas: #151412;
	--sa-dark-surface: #211f1c;
	--sa-dark-surface-raised: #2b2824;
	--sa-dark-text: #f3eee5;
	--sa-dark-muted: #c6beb4;
	--sa-dark-border: #625c54;
	--sa-dark-accent: #ff665d;
	--sa-light-media: #fffdf8;
	--ink: var(--sa-dark-text) !important;
	--paper: var(--sa-dark-surface) !important;
	--white: var(--sa-dark-canvas) !important;
	--line: var(--sa-dark-border) !important;
	--sa-page-background: var(--sa-dark-canvas) !important;
	color-scheme: dark;
}

.sa-dark-mode body,
.sa-dark-mode .site-content,
.sa-dark-mode .sa-reading-page,
.sa-dark-mode .sa-events-page,
.sa-dark-mode .sa-single-event,
.sa-dark-mode .sa-pub-page,
.sa-dark-mode .sa-news-page,
.sa-dark-mode .sa-donate-page,
.sa-dark-mode .sa-editorial-article {
	background: var(--sa-dark-canvas);
	color: var(--sa-dark-text);
}

.sa-dark-mode img {
	opacity: 1;
}

.sa-dark-mode .byline,
.sa-dark-mode .story-card p,
.sa-dark-mode .sa-reading-card p,
.sa-dark-mode figcaption,
.sa-dark-mode .wp-caption-text,
.sa-dark-mode .article-hero figcaption,
.sa-dark-mode .sa-article-content figcaption,
.sa-dark-mode .sa-form-privacy,
.sa-dark-mode .sa-donate-inquiry .sa-form-privacy {
	color: var(--sa-dark-muted);
}

/* Shared reading surfaces and editorial blocks. */
.sa-dark-mode .widget,
.sa-dark-mode .paper-widget,
.sa-dark-mode .campaign-copy,
.sa-dark-mode .campaigns,
.sa-dark-mode .campaign-card,
.sa-dark-mode .home-follow,
.sa-dark-mode .sa-reading-guide,
.sa-dark-mode .sa-related-box,
.sa-dark-mode .sa-paper-placeholder,
.sa-dark-mode .sa-factbox,
.sa-dark-mode .sa-contact-form,
.sa-dark-mode .sa-donate-inquiry {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .campaign-card-copy,
.sa-dark-mode .sa-past-copy,
.sa-dark-mode .sa-pub-feature-copy,
.sa-dark-mode .sa-pub-card > div,
.sa-dark-mode .sa-news-current-copy {
	color: var(--sa-dark-text);
}

.sa-dark-mode .support-widget,
.sa-dark-mode .join-widget,
.sa-dark-mode .dispatch,
.sa-dark-mode .sa-action-box,
.sa-dark-mode .event-details,
.sa-dark-mode .campaign-card-3 .campaign-card-visual,
.sa-dark-mode .campaigns-join .button,
.sa-dark-mode .sa-pub-callout,
.sa-dark-mode .sa-news-callout,
.sa-dark-mode .sa-news-current-copy .sa-news-meta,
.sa-dark-mode .home-publication-price {
	color: #171512;
}

.sa-dark-mode .button.dark,
.sa-dark-mode .sa-news-button.is-dark {
	background: var(--sa-dark-surface-raised);
	color: var(--sa-dark-text) !important;
}

/* Header, search, drawer and footer remain strongly branded. */
.sa-dark-mode .search-panel,
.sa-dark-mode .search-field {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .search-field::placeholder {
	color: var(--sa-dark-muted);
	opacity: 1;
}

.sa-dark-mode .site-footer,
.sa-dark-mode .theory,
.sa-dark-mode .sa-news-archive {
	background: #0f0e0d;
	color: #fffdf8;
}

.sa-dark-mode .site-footer {
	--ink: #0f0e0d !important;
}

/* Homepage: preserve red/yellow feature areas while darkening reading cards. */
.sa-dark-mode .home-pages {
	color: #fff;
}

.sa-dark-mode .home-page-grid article,
.sa-dark-mode .events-panel,
.sa-dark-mode .publications-panel {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .home-follow,
.sa-dark-mode .campaigns {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .campaign-card {
	background: var(--sa-dark-surface-raised);
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-reading-tabs,
.sa-dark-mode .sa-reading-tab,
.sa-dark-mode .home-follow-grid,
.sa-dark-mode .home-follow h2,
.sa-dark-mode .home-follow-link {
	border-color: var(--sa-dark-border);
}

.sa-dark-mode .sa-reading-tab {
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-reading-tab.is-active {
	color: #fff;
}

.sa-dark-mode .home-follow-link {
	--sa-follow-icon-cutout: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .home-follow-link:hover,
.sa-dark-mode .home-follow-link:focus-visible {
	--sa-follow-icon-cutout: #0f0e0d;
	background: #0f0e0d;
	color: #fff;
}

/* Articles and the sticky reading guide. */
.sa-dark-mode .sa-editorial-article {
	--sa-article-cream: var(--sa-dark-surface);
	--sa-related: var(--sa-dark-surface-raised);
}

.sa-dark-mode .sa-editorial-article,
.sa-dark-mode .sa-reading-guide,
.sa-dark-mode .sa-related-box {
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-article-content code,
.sa-dark-mode .sa-article-content pre,
.sa-dark-mode .sa-article-content table {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-article-content th,
.sa-dark-mode .sa-article-content td {
	border-color: var(--sa-dark-border);
}

.sa-dark-mode .sa-article-content figure img,
.sa-dark-mode .sa-article-content .wp-caption img,
.sa-dark-mode .sa-paper-cover img {
	background: var(--sa-light-media);
}

/* Bahan Bacaan, search, tag and other archives. */
.sa-dark-mode .sa-reading-page,
.sa-dark-mode .archive-layout,
.sa-dark-mode .archive-feed {
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-reading-statement {
	background: #4a2523;
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-reading-search input {
	background: transparent;
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-reading-search input::placeholder {
	color: var(--sa-dark-muted);
	opacity: 1;
}

.sa-dark-mode .page-numbers:not(.current) {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
	border-color: var(--sa-dark-border);
}

/* Events and portrait posters. */
.sa-dark-mode .sa-events-page,
.sa-dark-mode .sa-single-event {
	--sa-events-background: var(--sa-dark-canvas);
}

.sa-dark-mode .sa-past-grid .sa-past-card,
.sa-dark-mode .sa-past-grid .sa-past-card:nth-child(n) {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-calendar-day.has-events {
	background: #3b2321;
}

.sa-dark-mode .sa-event-feature-poster img,
.sa-dark-mode .sa-past-image img,
.sa-dark-mode .sa-single-event-poster img {
	background: var(--sa-light-media);
	color: #171512;
}

/* Publications and newspaper covers use intentional light media islands. */
.sa-dark-mode .sa-pub-feature {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-pub-feature-art,
.sa-dark-mode .sa-pub-card-image,
.sa-dark-mode .sa-news-cover,
.sa-dark-mode .sa-news-card-cover,
.sa-dark-mode .home-publication-cover,
.sa-dark-mode .home-publication-cover img,
.sa-dark-mode .home-event-poster img {
	background: var(--sa-light-media);
	color: #171512;
}

.sa-dark-mode .sa-pub-card {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-pub-card span,
.sa-dark-mode .sa-pub-intro > span,
.sa-dark-mode .sa-pub-feature-copy > span,
.sa-dark-mode .sa-pub-catalogue header > span,
.sa-dark-mode .sa-news-hero span,
.sa-dark-mode .sa-news-current-copy > span,
.sa-dark-mode .sa-news-contents header > span {
	color: var(--sa-dark-accent);
}

.sa-dark-mode .sa-news-current {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
}

/* Identity pages: keep transparent black/red artwork readable. */
.sa-dark-mode .sa-identity-page {
	--identity-paper: var(--sa-dark-canvas);
	--identity-ink: var(--sa-dark-text);
	background: var(--sa-dark-canvas);
	color: var(--sa-dark-text);
}

.sa-dark-mode .sa-identity-rail-mark img,
.sa-dark-mode .sa-identity-hero > figure img,
.sa-dark-mode .sa-contact-hero > figure img,
.sa-dark-mode .sa-contact-channel-icon img {
	background: var(--sa-light-media);
	padding: 10px;
}

.sa-dark-mode .sa-contact-channel-icon img {
	border-radius: 50%;
	filter: none;
}

/* Donations, native forms and accessible interaction states. */
.sa-dark-mode .sa-donate-page {
	--donate-bg: var(--sa-dark-canvas);
	--cream: var(--sa-dark-canvas);
}

.sa-dark-mode .sa-donate-payment {
	color: #fff;
}

.sa-dark-mode .sa-donate-payment figure {
	background: var(--sa-light-media);
	color: #171512;
}

.sa-dark-mode input,
.sa-dark-mode textarea,
.sa-dark-mode select,
.sa-dark-mode .sa-field input,
.sa-dark-mode .sa-field textarea,
.sa-dark-mode .sa-field select,
.sa-dark-mode .sidebar-form input,
.sa-dark-mode .sidebar-form textarea,
.sa-dark-mode .sidebar-form select,
.sa-dark-mode .sa-donate-inquiry input,
.sa-dark-mode .sa-donate-inquiry textarea,
.sa-dark-mode .sa-donate-inquiry select {
	background: var(--sa-dark-surface);
	color: var(--sa-dark-text);
	border-color: var(--sa-dark-border);
}

.sa-dark-mode input::placeholder,
.sa-dark-mode textarea::placeholder {
	color: var(--sa-dark-muted);
	opacity: 1;
}

.sa-dark-mode :focus-visible {
	outline-color: var(--yellow);
}

@media (prefers-contrast: more) {
	.sa-dark-mode {
		--sa-dark-muted: #eee7dd;
		--sa-dark-border: #aaa197;
	}
}