/*
 * Darkify dark mode: keep the theme's brand touches on the dark page.
 * Artwork sections (.ylb-hero, .ylb-header and so on) are skipped by Darkify
 * through the darkify_ignore class added in inc/compat/darkify.php.
 */

/* Purple pill and gold buttons keep their colors instead of turning gray. */
html.darkify_dark_mode_enabled .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-gold-background-color) {
	background-color: var(--wp--preset--color--royal-purple) !important;
	color: var(--wp--preset--color--lilac-white) !important;
}

html.darkify_dark_mode_enabled .wp-block-button__link.has-gold-background-color {
	background-color: var(--wp--preset--color--gold) !important;
	color: var(--wp--preset--color--plum) !important;
}

/* The gold ring around round portraits. */
html.darkify_dark_mode_enabled .wp-block-image.is-style-ylb-ring img {
	border-color: #e0a63a !important;
}

/*
 * Darkify's floating switch sits at the bottom right and used to cover the
 * footer's books-and-mug artwork. assets/js/compat-darkify.js sets
 * --ylb-footer-lift to the visible footer height, so the switch rides just
 * above the footer and stays reachable on every screen size.
 */
html .darkify_switch.darkify_bottom_right,
html .darkify_switch.darkify_bottom_right_in_mobile {
	bottom: calc(var(--ylb-footer-lift, 0px) + 16px);
	right: 16px;
	transition: bottom 0.15s ease-out;
}