/*
 * Shared editorial rule system.
 * Structural dividers follow the 2px red language of the identity pages;
 * form controls use their matching 1px red outline.
 */
:root {
	--sa-rule-red: #ef3b43;
	--sa-rule-thick: 2px;
	--sa-rule-thin: 1px;
}

.sa-dark-mode {
	--sa-rule-red: #ff665d;
}

/* Homepage and generic editorial templates. */
.lead,
.section-head,
.campaigns-head,
.archive-hero,
.page-header,
.article-header,
.post-navigation,
.home-follow-grid,
.campaign-card-grid,
.sa-reading-tabs,
.sa-factbox,
.sa-action-box,
.theory-list li,
.issue,
.read,
.sa-reading-more,
.sa-reading-all,
.event-details,
.widget {
	border-color: var(--sa-rule-red) !important;
}

.lead,
.section-head,
.campaigns-head,
.archive-hero,
.page-header,
.article-header,
.sa-factbox,
.sa-action-box,
.widget {
	border-width: var(--sa-rule-thick) !important;
}

.top-grid article,
.briefs,
.briefs article,
.story-card,
.campaign-copy ul,
.post-navigation,
.event-details,
.home-follow-grid,
.home-follow h2,
.home-follow-link,
.campaign-card-grid,
.campaign-card + .campaign-card,
.sa-reading-tabs,
.sa-reading-tab,
.sa-reading-card,
.legal {
	border-color: var(--sa-rule-red) !important;
}

.section-label {
	border-bottom: var(--sa-rule-thick) solid var(--sa-rule-red) !important;
}

.home-follow-grid,
.campaign-card-grid,
.sa-reading-tabs {
	border-width: var(--sa-rule-thick) !important;
}

/* Article template and reading aids. */
.sa-meta-cell,
.sa-article-heading,
.sa-article-author,
.sa-reading-guide,
.sa-reading-guide details,
.sa-reading-guide li,
.sa-related-box,
.sa-related-box h2,
.sa-related-box li,
.sa-article-footer,
.sa-paper-placeholder,
.sa-paper-link,
.sa-article-content blockquote {
	border-color: var(--sa-rule-red) !important;
}

.sa-meta-cell,
.sa-article-heading,
.sa-article-author,
.sa-reading-guide,
.sa-related-box,
.sa-article-footer,
.sa-article-content blockquote {
	border-width: var(--sa-rule-thick) !important;
}

/* Bahan Bacaan, search and archives. */
.sa-reading-head,
.sa-reading-pagination,
.sa-reading-item,
.sa-reading-topics,
.sa-reading-filter,
.sa-reading-panel > a,
.sa-world-region,
.sa-world-region > a,
.sa-reading-search,
.sa-reading-search button,
.page-numbers {
	border-color: var(--sa-rule-red) !important;
}

.sa-reading-head,
.sa-reading-pagination,
.sa-reading-item,
.sa-reading-filter,
.sa-reading-search {
	border-width: var(--sa-rule-thick) !important;
}

/* Events, publications and newspaper pages. */
.sa-events-sidebar section,
.sa-events-title,
.sa-event-row,
.sa-calendar-weekdays span,
.sa-calendar-day,
.sa-calendar-grid > .is-empty,
.sa-past-grid .sa-past-card,
.sa-single-event > header,
.sa-single-event-layout aside,
.sa-pub-intro,
.sa-pub-feature,
.sa-pub-feature-copy,
.sa-pub-catalogue > header,
.sa-pub-grid,
.sa-pub-card,
.sa-news-hero,
.sa-news-current,
.sa-news-current-copy,
.sa-news-contents header,
.sa-news-contents-copy,
.sa-news-contents-copy ul,
.sa-news-contents-copy li,
.sa-news-archive header,
.sa-news-grid,
.sa-news-card {
	border-color: var(--sa-rule-red) !important;
}

.sa-events-title,
.sa-past-grid .sa-past-card,
.sa-single-event > header,
.sa-pub-intro,
.sa-pub-feature,
.sa-pub-catalogue > header,
.sa-news-hero,
.sa-news-current,
.sa-news-contents header,
.sa-news-archive header {
	border-width: var(--sa-rule-thick) !important;
}

/* Identity pages already use this system; expose the same token globally. */
.sa-identity-page {
	--identity-red: var(--sa-rule-red);
}

.sa-contact-channels,
.sa-contact-channel + .sa-contact-channel,
.sa-contact-channel-icon {
	border-color: var(--sa-rule-red) !important;
}

/* Native, sidebar, search, donation and comment forms. */
.search-field,
.comments-area input,
.comments-area textarea,
.sidebar-form input,
.sidebar-form textarea,
.sidebar-form select,
.sa-field input,
.sa-field textarea,
.sa-field select,
.sa-contact-form,
.sa-donate-inquiry input,
.sa-donate-inquiry textarea,
.sa-donate-inquiry select,
.sa-form-notice {
	border: var(--sa-rule-thin) solid var(--sa-rule-red) !important;
}

.search-field:focus,
.comments-area input:focus,
.comments-area textarea:focus,
.sidebar-form input:focus,
.sidebar-form textarea:focus,
.sidebar-form select:focus,
.sa-field input:focus,
.sa-field textarea:focus,
.sa-field select:focus,
.sa-donate-inquiry input:focus,
.sa-donate-inquiry textarea:focus,
.sa-donate-inquiry select:focus {
	outline: 3px solid color-mix(in srgb, var(--sa-rule-red) 28%, transparent);
	outline-offset: 1px;
}

@media (max-width: 900px) {
	.campaign-card + .campaign-card {
		border-color: var(--sa-rule-red) !important;
	}
}