/* One action palette for navigation controls, linked actions, forms and dialogs.
   The explicit reading-contrast and operating-system palettes take precedence. */
:root {
	--action-fill: #0b2033;
	--action-ink: #daae0f;
	--action-border: #daae0f;
	--action-hover-fill: #17324d;
	--action-hover-ink: #f4d34f;
	--action-active-fill: #06121c;
}

:root[data-theme="dark"] {
	--action-fill: #daae0f;
	--action-ink: #0b2033;
	--action-hover-fill: #f4d34f;
	--action-hover-ink: #0b2033;
	--action-active-fill: #d4aa11;
}

/* Existing section styles must not create their own competing button colours. */
@media (forced-colors: none) {
:root:not([data-contrast="light"]):not([data-contrast="dark"]) :is(button, .button, .action-control, input[type="submit"], input[type="button"]) {
	background: var(--action-fill) !important;
	color: var(--action-ink) !important;
	border-color: var(--action-border) !important;
}

:root:not([data-contrast="light"]):not([data-contrast="dark"]) :is(button, .button, .action-control, input[type="submit"], input[type="button"]):hover:not(:disabled):not([aria-disabled="true"]) {
	background: var(--action-hover-fill) !important;
	color: var(--action-hover-ink) !important;
}

:root:not([data-contrast="light"]):not([data-contrast="dark"]) :is(button, .button, .action-control, input[type="submit"], input[type="button"]):active:not(:disabled):not([aria-disabled="true"]) {
	background: var(--action-active-fill) !important;
	color: var(--action-ink) !important;
}
}

:is(button, .button, .action-control, input[type="submit"], input[type="button"]) {
	border-width: 1px;
	border-style: solid;
	font-family: var(--sans);
	font-weight: 600;
	min-height: 48px;
	/* Change the paired colours together; crossfading an inverted pair loses contrast. */
	transition: outline-offset 160ms ease;
}

:is(button, .button, .action-control, input[type="submit"], input[type="button"]):is(:disabled, [aria-disabled="true"]) {
	opacity: 1;
	border-style: dashed;
	cursor: not-allowed;
}

.motion-control { display: inline-flex; min-width: 48px; justify-content: center; padding: .55rem .75rem; }
.header-tools { align-items: center; gap: .75rem; }
.header-tools .theme-control { display: block; margin: 0; }
.header-tools :is(.action-control, button, .header-donate) {
	box-sizing: border-box;
	height: 3rem;
	min-height: 48px;
	max-width: none;
	margin: 0;
	border-radius: 0;
	padding: .65rem .85rem;
	font-size: .8125rem;
	line-height: 1.25;
}
.header-tools .motion-control span { display: inline; }
.header-tools .motion-control { min-width: 8rem; }
.header-tools .menu-trigger { gap: .75rem; }
.header-tools .header-donate { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
@media (max-width: 35rem) {
	.header-tools { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: .5rem; }
	.header-tools :is(.action-control, button, .header-donate) { width: 100%; min-width: 0; justify-content: center; }
}
:root[data-theme="dark"] :is(.sacrament-interlude, .ministry-story) h2 em { color: #e4c578; }

@media (forced-colors: none) {
:root:is([data-contrast="light"], [data-contrast="dark"]) :is(button, .button, .action-control, input[type="submit"], input[type="button"]) {
	background: var(--contrast-bg) !important;
	color: var(--contrast-ink) !important;
	border-color: var(--contrast-ink) !important;
}
}

@media (forced-colors: active) {
	:root :is(button, .button, .action-control, input[type="submit"], input[type="button"]),
	:root :is(button, .button, .action-control, input[type="submit"], input[type="button"]):is(:hover, :active) {
		background: ButtonFace !important;
		color: ButtonText !important;
		border-color: ButtonText !important;
		forced-color-adjust: auto;
	}
}