/* =============================================================================
   Recipe Card for Divi

   Colours come from the module's Card Colours settings, falling back to the
   site's Divi global colours. Fonts are Divi's global heading and body fonts;
   the module's font settings override them.

   Selectors are written two classes deep (.rcd-recipe .rcd-recipe__x) so they
   win over theme and builder styles for headings, lists and paragraphs
   without needing !important.
   ========================================================================== */

.rcd-recipe,
.rcd-recipe-jump,
.rcd-recipe-print,
.rcd-rate,
.rcd-comment-rating {
	/* Card Colours. Each can be changed in the module's Design tab, which
	   sets the matching variable on the card. */
	--rcd-ink: var(--gcid-heading-color, #2f2b28);
	--rcd-body: var(--gcid-body-color, #5a544c);
	--rcd-accent: var(--gcid-primary-color, #9a6349);
	--rcd-line: #e2ddd6;
	--rcd-paper: #ffffff;
	--rcd-tint: #f6f4f1;
	--rcd-note: color-mix(in srgb, var(--rcd-accent) 9%, var(--rcd-paper));
	--rcd-star: var(--rcd-accent);

	/* Worked out from the colours above. */
	--rcd-muted: color-mix(in srgb, var(--rcd-body) 78%, var(--rcd-paper));
	--rcd-frame: var(--rcd-line);
	--rcd-star-off: color-mix(in srgb, var(--rcd-line) 65%, var(--rcd-body));

	/* Divi's global heading and body fonts. */
	--rcd-display: var(--et_global_heading_font, Georgia), Georgia, "Times New Roman", serif;
	--rcd-text: var(--et_global_body_font, "Helvetica Neue"), "Helvetica Neue", Arial, sans-serif;
}


/* -----------------------------------------------------------------------------
 * Buttons (card, and Jump to Recipe above the post)
 * -------------------------------------------------------------------------- */

.rcd-recipe-btn,
.rcd-recipe .rcd-recipe-btn,
.rcd-recipe-jump .rcd-recipe-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 13px 24px;
	border: 1px solid var(--rcd-ink);
	border-radius: 0;
	background: transparent;
	color: var(--rcd-ink);
	font-family: var(--rcd-text);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 2.4px;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

.rcd-recipe-btn:hover,
.rcd-recipe .rcd-recipe-btn:hover,
.rcd-recipe-jump .rcd-recipe-btn:hover {
	background: var(--rcd-ink);
	color: var(--rcd-paper);
}

.rcd-recipe-btn--solid,
.rcd-recipe .rcd-recipe-btn--solid,
.rcd-recipe-jump .rcd-recipe-btn--solid {
	background: var(--rcd-ink);
	color: var(--rcd-paper);
}

.rcd-recipe-btn--solid:hover,
.rcd-recipe .rcd-recipe-btn--solid:hover,
.rcd-recipe-jump .rcd-recipe-btn--solid:hover {
	border-color: var(--rcd-accent);
	background: var(--rcd-accent);
	color: var(--rcd-paper);
}

.rcd-recipe-btn:focus-visible {
	outline: 1px solid var(--rcd-accent);
	outline-offset: 3px;
}

.rcd-recipe-jump {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 36px;
}

/*
 * The jump buttons and the card's Print / Pin / Rating buttons are also Divi buttons
 * (et_pb_button), so Divi's button icon works on them when it is switched on
 * under the module's Design tab (Jump / Print / Pin / Rating Button).
 * Divi's own button rules would otherwise resize them and change their colours;
 * these keep the card's look and make room for the icon instead.
 */
.rcd-recipe-jump,
.rcd-recipe .rcd-recipe__actions,
.rcd-recipe .rcd-recipe__cta-action {
	--rcd-btn-x: 24px;
	--rcd-btn-icon: 10px;
}

:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button {
	display: inline-block;
	position: relative;
	padding: 13px var(--rcd-btn-x);
	border-width: 1px;
	font-size: 12px;
	line-height: 1.2 !important;
	text-align: center;
}

.et_pb_button_helper_class :is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button {
	color: var(--rcd-ink);
}

.et_pb_button_helper_class :is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn--solid.et_pb_button,
.et_pb_button_helper_class :is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button:hover {
	color: var(--rcd-paper);
}

:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button::after,
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button::before {
	font-size: 1.6em;
	line-height: 1;
}

/* Hover keeps the card's padding and border (Divi's own hover would change them). */
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button:hover {
	padding: 13px var(--rcd-btn-x);
	border-width: 1px;
	border-color: var(--rcd-ink);
}

:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn--solid.et_pb_button:hover {
	border-color: var(--rcd-accent);
}

/* No icon unless "Show Button Icon" is switched on for that button in the Design tab. */
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button:not(.rcd-btn-icon)::after,
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button:not(.rcd-btn-icon)::before {
	display: none !important;
}

/* With the icon on: room for it on hover, or all the time if it always shows. */
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon:hover,
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon--always,
.et_button_icon_visible :is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon {
	padding-right: calc(var(--rcd-btn-x) + var(--rcd-btn-icon));
	padding-left: calc(var(--rcd-btn-x) - var(--rcd-btn-icon));
}

:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon--left:hover,
:is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon--left.rcd-btn-icon--always,
.et_button_left :is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon:hover,
.et_button_left.et_button_icon_visible :is(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button.rcd-btn-icon {
	padding-right: calc(var(--rcd-btn-x) - var(--rcd-btn-icon));
	padding-left: calc(var(--rcd-btn-x) + var(--rcd-btn-icon));
}

/* Theme set to no button icons: Divi forces its own padding, so put ours back. */
.et_button_no_icon :where(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button,
.et_button_no_icon :where(.rcd-recipe-jump, .rcd-recipe__actions, .rcd-recipe__cta-action) .rcd-recipe-btn.et_pb_button:hover {
	padding: 13px var(--rcd-btn-x) !important;
}


/* -----------------------------------------------------------------------------
 * Card frame: a hairline, a 12px gap, then the paper - the same frame the
 * theme draws round every photo.
 * -------------------------------------------------------------------------- */

.rcd-recipe {
	margin: 64px 0;
	padding: 12px;
	border: 1px solid var(--rcd-frame);
	color: var(--rcd-body);
	font-family: var(--rcd-text);
	scroll-margin-top: 90px;
}

.rcd-recipe .rcd-recipe__inner {
	padding: 52px 56px 44px;
	background: var(--rcd-paper);
}

.rcd-recipe p,
.rcd-recipe h2,
.rcd-recipe h3,
.rcd-recipe h4,
.rcd-recipe ul,
.rcd-recipe ol,
.rcd-recipe dl,
.rcd-recipe dd,
.rcd-recipe figure {
	margin: 0;
	padding: 0;
}


/* -----------------------------------------------------------------------------
 * Header: title, summary and buttons beside the photo
 * -------------------------------------------------------------------------- */

.rcd-recipe .rcd-recipe__header {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 36px;
	align-items: center;
}

.rcd-recipe--has-photo .rcd-recipe__header {
	grid-template-columns: minmax(0, 1fr) 230px;
	gap: 44px;
}

.rcd-recipe .rcd-recipe__kicker {
	margin-bottom: 12px;
	color: var(--rcd-accent);
	font-family: var(--rcd-text);
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: 2.4px;
	text-transform: uppercase;
}

.rcd-recipe .rcd-recipe__title {
	margin-bottom: 16px;
	color: var(--rcd-ink);
	font-family: var(--rcd-display);
	font-size: 44px;
	font-weight: 400;
	line-height: 1.1;
}

.rcd-recipe .rcd-recipe__summary {
	color: var(--rcd-body);
	font-size: 17px;
	line-height: 1.75;
}

.rcd-recipe .rcd-recipe__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.rcd-recipe .rcd-recipe__photo {
	position: relative;
}

.rcd-recipe .rcd-recipe__photo img {
	display: block;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	padding: 10px;
	border: 1px solid var(--rcd-frame);
	border-radius: 0;
	background: transparent;
}


/* -----------------------------------------------------------------------------
 * Facts strip: Prep / Cook / Rest / Total / Serves
 * -------------------------------------------------------------------------- */

.rcd-recipe .rcd-recipe__facts {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 44px;
	padding: 22px 0;
	border-top: 1px solid var(--rcd-line);
	border-bottom: 1px solid var(--rcd-line);
}

.rcd-recipe .rcd-recipe__fact {
	flex: 1 1 0;
	min-width: 96px;
	padding: 2px 12px;
	text-align: center;
}

.rcd-recipe .rcd-recipe__fact + .rcd-recipe__fact {
	border-left: 1px solid var(--rcd-line);
}

.rcd-recipe .rcd-recipe__fact dt {
	margin-bottom: 6px;
	color: var(--rcd-muted);
	font-size: 11px;
	line-height: 1.4;
	letter-spacing: 2.2px;
	text-transform: uppercase;
}

.rcd-recipe .rcd-recipe__fact dd {
	color: var(--rcd-ink);
	font-family: var(--rcd-display);
	font-size: 22px;
	line-height: 1.2;
}

/* Servings: - 4 + in the Serves box. The buttons appear once the script runs. */
.rcd-recipe .rcd-recipe__serves {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.rcd-recipe .rcd-recipe__step {
	display: none;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 26px;
	height: 26px;
	margin: 0;
	padding: 0 0 2px;
	border: 1px solid var(--rcd-frame);
	border-radius: 50%;
	background: transparent;
	color: var(--rcd-ink);
	font-family: var(--rcd-text);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

.rcd-recipe.is-ready .rcd-recipe__step {
	display: inline-flex;
}

.rcd-recipe .rcd-recipe__step:hover:not(:disabled) {
	border-color: var(--rcd-ink);
	background: var(--rcd-ink);
	color: var(--rcd-paper);
}

.rcd-recipe .rcd-recipe__step:disabled {
	opacity: 0.35;
	cursor: default;
}

.rcd-recipe .rcd-recipe__step:focus-visible {
	outline: 1px solid var(--rcd-accent);
	outline-offset: 2px;
}

.rcd-recipe .rcd-recipe__serves-value {
	white-space: nowrap;
}

/* A scaled amount is picked out in the accent colour. */
.rcd-recipe .rcd-recipe__qty.is-scaled {
	color: var(--rcd-accent);
}

.rcd-recipe .rcd-recipe__tags {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 28px;
	margin-top: 18px;
	color: var(--rcd-muted);
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: 2.2px;
	text-transform: uppercase;
}

.rcd-recipe .rcd-recipe__tags strong {
	margin-left: 6px;
	color: var(--rcd-accent);
	font-weight: 400;
}


/* -----------------------------------------------------------------------------
 * Sections
 * -------------------------------------------------------------------------- */

.rcd-recipe .rcd-recipe__section {
	margin-top: 44px;
}

.rcd-recipe .rcd-recipe__heading {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 18px;
	color: var(--rcd-ink);
	font-family: var(--rcd-display);
	font-size: 32px;
	font-weight: 400;
	line-height: 1.2;
}

/* A hairline runs out from each section heading. */
.rcd-recipe .rcd-recipe__heading::after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: var(--rcd-line);
}

.rcd-recipe .rcd-recipe__group {
	margin: 26px 0 8px;
	color: var(--rcd-accent);
	font-family: var(--rcd-text);
	font-size: 12px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 2.4px;
	text-transform: uppercase;
}

.rcd-recipe .rcd-recipe__heading + .rcd-recipe__group {
	margin-top: 4px;
}

/* US / Metric switch beside the Ingredients heading. */
.rcd-recipe .rcd-recipe__section-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 20px;
	margin-bottom: 18px;
}

.rcd-recipe .rcd-recipe__section-head .rcd-recipe__heading {
	flex: 1 1 auto;
	margin-bottom: 0;
}

.rcd-recipe .rcd-recipe__units {
	display: inline-flex;
	flex: 0 0 auto;
	border: 1px solid var(--rcd-ink);
}

.rcd-recipe .rcd-recipe__unit {
	margin: 0;
	padding: 9px 16px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--rcd-ink);
	font-family: var(--rcd-text);
	font-size: 11px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 2.2px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.rcd-recipe .rcd-recipe__unit + .rcd-recipe__unit {
	border-left: 1px solid var(--rcd-ink);
}

.rcd-recipe .rcd-recipe__unit[aria-pressed="true"] {
	background: var(--rcd-ink);
	color: var(--rcd-paper);
}

.rcd-recipe .rcd-recipe__unit:not([aria-pressed="true"]):hover {
	background: var(--rcd-paper);
}

.rcd-recipe .rcd-recipe__unit:focus-visible {
	outline: 1px solid var(--rcd-accent);
	outline-offset: 3px;
}

.rcd-recipe .rcd-recipe__ingredient-set[hidden] {
	display: none;
}

.rcd-recipe .rcd-recipe__ingredient-set > .rcd-recipe__group:first-child {
	margin-top: 4px;
}

/* Ingredients sit on a soft linen panel. */
.rcd-recipe .rcd-recipe__section--ingredients {
	padding: 34px 38px 30px;
	background: var(--rcd-tint);
}

.rcd-recipe ul.rcd-recipe__ingredients,
.rcd-recipe ul.rcd-recipe__notes {
	list-style: none;
	margin: 0;
	padding: 0;
	line-height: 1.6;
}

.rcd-recipe ul.rcd-recipe__ingredients li {
	position: relative;
	margin: 0;
	padding: 11px 0 11px 26px;
	border-bottom: 1px solid var(--rcd-line);
	font-size: 17px;
}

.rcd-recipe ul.rcd-recipe__ingredients li:last-child {
	border-bottom: 0;
}

/* A small open circle in clay instead of a bullet. */
.rcd-recipe ul.rcd-recipe__ingredients li::before {
	content: "";
	position: absolute;
	top: 1.15em;
	left: 2px;
	box-sizing: border-box;
	width: 8px;
	height: 8px;
	border: 1px solid var(--rcd-accent);
	border-radius: 50%;
}

/* Method: big serif numbers in clay, counted across groups. */
.rcd-recipe ol.rcd-recipe__steps {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: rcd-step var(--rcd-step-start, 0);
}

.rcd-recipe ol.rcd-recipe__steps li {
	position: relative;
	margin: 0;
	padding: 4px 0 20px 58px;
	font-size: 17px;
	line-height: 1.8;
	counter-increment: rcd-step;
	scroll-margin-top: 90px;
}

.rcd-recipe ol.rcd-recipe__steps li:last-child {
	padding-bottom: 0;
}

.rcd-recipe ol.rcd-recipe__steps li::before {
	content: counter(rcd-step, decimal-leading-zero);
	position: absolute;
	top: 0;
	left: 0;
	color: var(--rcd-accent);
	font-family: var(--rcd-display);
	font-size: 30px;
	font-style: italic;
	line-height: 1.1;
}

/* Notes: the same blush tip box the theme uses for quotes in a recipe. */
.rcd-recipe .rcd-recipe__section--notes {
	padding: 28px 32px;
	border-left: 2px solid var(--rcd-accent);
	background: var(--rcd-note);
}

.rcd-recipe .rcd-recipe__section--notes .rcd-recipe__heading {
	font-size: 26px;
}

.rcd-recipe .rcd-recipe__section--notes .rcd-recipe__heading::after {
	display: none;
}

.rcd-recipe ul.rcd-recipe__notes li {
	position: relative;
	margin: 0 0 10px;
	padding-left: 22px;
	font-size: 16px;
	line-height: 1.75;
}

.rcd-recipe ul.rcd-recipe__notes li:last-child {
	margin-bottom: 0;
}

.rcd-recipe ul.rcd-recipe__notes li::before {
	content: "";
	position: absolute;
	top: 0.85em;
	left: 0;
	width: 10px;
	height: 1px;
	background: var(--rcd-accent);
}

.rcd-recipe .rcd-recipe__ingredients a,
.rcd-recipe .rcd-recipe__steps a,
.rcd-recipe .rcd-recipe__notes a,
.rcd-recipe .rcd-recipe__footer a {
	color: var(--rcd-accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.rcd-recipe .rcd-recipe__ingredients strong,
.rcd-recipe .rcd-recipe__steps strong,
.rcd-recipe .rcd-recipe__notes strong {
	color: var(--rcd-ink);
	font-weight: 700;
}

.rcd-recipe .rcd-recipe__nutrition {
	margin-top: 36px;
	color: var(--rcd-muted);
	font-size: 13px;
	line-height: 1.6;
	letter-spacing: 1.2px;
	text-align: center;
}

.rcd-recipe .rcd-recipe__footer {
	margin-top: 36px;
	padding-top: 28px;
	border-top: 1px solid var(--rcd-line);
	color: var(--rcd-ink);
	font-family: var(--rcd-display);
	font-size: 22px;
	font-style: italic;
	line-height: 1.4;
	text-align: center;
}

.rcd-recipe .rcd-recipe__nutrition + .rcd-recipe__footer {
	margin-top: 20px;
}


/* -----------------------------------------------------------------------------
 * Tablet and phone
 * -------------------------------------------------------------------------- */

@media (max-width: 980px) {
	.rcd-recipe .rcd-recipe__inner {
		padding: 44px 40px 40px;
	}

	.rcd-recipe--has-photo .rcd-recipe__header {
		grid-template-columns: minmax(0, 1fr) 190px;
		gap: 32px;
	}
}

@media (max-width: 767px) {
	.rcd-recipe {
		margin: 48px 0;
		padding: 8px;
	}

	.rcd-recipe .rcd-recipe__inner {
		padding: 36px 22px 32px;
	}

	.rcd-recipe--has-photo .rcd-recipe__header {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
		text-align: center;
	}

	.rcd-recipe .rcd-recipe__photo {
		order: -1;
		width: 200px;
		margin: 0 auto;
	}

	.rcd-recipe .rcd-recipe__title {
		font-size: 34px;
	}

	.rcd-recipe .rcd-recipe__summary {
		font-size: 16px;
	}

	.rcd-recipe .rcd-recipe__actions {
		justify-content: center;
	}

	.rcd-recipe .rcd-recipe__facts {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 18px 0;
		margin-top: 32px;
	}

	.rcd-recipe .rcd-recipe__fact + .rcd-recipe__fact {
		border-left: 0;
	}

	.rcd-recipe .rcd-recipe__fact:nth-child(2n) {
		border-left: 1px solid var(--rcd-line);
	}

	.rcd-recipe .rcd-recipe__fact:last-child:nth-child(2n + 1) {
		grid-column: 1 / -1;
	}

	.rcd-recipe .rcd-recipe__section {
		margin-top: 36px;
	}

	.rcd-recipe .rcd-recipe__section--ingredients {
		margin-right: -14px;
		margin-left: -14px;
		padding: 28px 22px 24px;
	}

	.rcd-recipe .rcd-recipe__heading {
		font-size: 28px;
	}

	.rcd-recipe ul.rcd-recipe__ingredients li,
	.rcd-recipe ol.rcd-recipe__steps li {
		font-size: 16px;
	}

	.rcd-recipe ol.rcd-recipe__steps li {
		padding-left: 46px;
	}

	.rcd-recipe ol.rcd-recipe__steps li::before {
		font-size: 26px;
	}

	.rcd-recipe .rcd-recipe__section--notes {
		padding: 24px 22px;
	}

	.rcd-recipe-jump .rcd-recipe-btn,
	.rcd-recipe .rcd-recipe__actions .rcd-recipe-btn {
		flex: 1 1 0;
		padding-right: 12px;
		padding-left: 12px;
	}

	.rcd-recipe-jump,
	.rcd-recipe .rcd-recipe__actions {
		--rcd-btn-x: 12px;
	}
}


/* -----------------------------------------------------------------------------
 * Print view (?print-recipe=1) and printing straight from the post
 * -------------------------------------------------------------------------- */

body.rcd-recipe-print {
	max-width: 760px;
	margin: 0 auto;
	padding: 24px 20px 40px;
	background: #fff;
	color: var(--rcd-body);
	font-family: var(--rcd-text);
}

.rcd-recipe-print .rcd-recipe-print__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 20px;
	font-size: 14px;
	letter-spacing: 1px;
}

.rcd-recipe-print .rcd-recipe-print__bar a {
	color: var(--rcd-accent);
	text-decoration: none;
}

.rcd-recipe-print .rcd-recipe {
	margin: 0;
}

.rcd-recipe-print .rcd-recipe-print__source {
	margin-top: 18px;
	color: var(--rcd-muted);
	font-size: 12px;
	text-align: center;
	letter-spacing: 1px;
}

@media print {
	@page {
		margin: 14mm;
	}

	body.rcd-recipe-print {
		max-width: none;
		padding: 0;
	}

	.rcd-recipe-print .rcd-recipe-print__bar,
	.rcd-recipe .rcd-recipe__units,
	.rcd-recipe .rcd-recipe__step,
	.rcd-recipe-jump,
	.rcd-recipe .rcd-recipe__actions,
	.rcd-recipe .rcd-recipe__footer {
		display: none !important;
	}

	.rcd-recipe {
		padding: 0;
		border: 0;
	}

	.rcd-recipe .rcd-recipe__inner {
		padding: 0;
		background: none;
	}

	.rcd-recipe .rcd-recipe__title {
		font-size: 34px;
	}

	.rcd-recipe--has-photo .rcd-recipe__header {
		grid-template-columns: minmax(0, 1fr) 150px;
		text-align: left;
	}

	.rcd-recipe .rcd-recipe__photo {
		order: 0;
		width: auto;
	}

	.rcd-recipe .rcd-recipe__facts {
		display: flex;
		margin-top: 24px;
		padding: 14px 0;
	}

	.rcd-recipe .rcd-recipe__fact + .rcd-recipe__fact {
		border-left: 1px solid var(--rcd-line);
	}

	.rcd-recipe .rcd-recipe__section {
		margin-top: 26px;
	}

	.rcd-recipe .rcd-recipe__section--ingredients,
	.rcd-recipe .rcd-recipe__section--notes {
		margin: 26px 0 0;
		padding: 0;
		border: 0;
		background: none;
	}

	.rcd-recipe ul.rcd-recipe__ingredients li {
		padding-top: 5px;
		padding-bottom: 5px;
		font-size: 13pt;
	}

	.rcd-recipe ol.rcd-recipe__steps li,
	.rcd-recipe ul.rcd-recipe__notes li {
		font-size: 12pt;
		break-inside: avoid;
	}

	.rcd-recipe .rcd-recipe__heading {
		font-size: 24px;
		break-after: avoid;
	}
}

/* Jump to Recipe glides down rather than snapping. */
@media (prefers-reduced-motion: no-preference) {
	html:has(.rcd-recipe) {
		scroll-behavior: smooth;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rcd-recipe-btn,
	.rcd-recipe .rcd-recipe__unit,
	.rcd-recipe .rcd-recipe__step {
		transition: none;
	}
}


/* -----------------------------------------------------------------------------
 * Jump to Recipe module alignment
 * -------------------------------------------------------------------------- */

.rcd-recipe-jump--center {
	justify-content: center;
}

.rcd-recipe-jump--right {
	justify-content: flex-end;
}

.rcd_recipe_jump .rcd-recipe-jump {
	margin-bottom: 0;
}


/* -----------------------------------------------------------------------------
 * Inside the Divi Visual Builder: show the servings buttons, and stop clicks
 * on links and buttons so editing the module never leaves the page.
 * -------------------------------------------------------------------------- */

.rcd-vb .rcd-recipe__step {
	display: inline-flex;
}

.rcd-vb a,
.rcd-vb button {
	pointer-events: none;
}

.rcd-vb-empty {
	padding: 28px;
	border: 1px dashed #c9c2b8;
	color: #6b645c;
	font-size: 14px;
	text-align: center;
}


/* -----------------------------------------------------------------------------
 * Divi's own list styles
 *
 * Divi gives every list in a post bullets, an indent and bottom padding with
 * an ID selector (#left-area ul), which outranks any class. The card draws its
 * own markers and spacing, so those three properties are reset here.
 * -------------------------------------------------------------------------- */

.rcd-recipe ul.rcd-recipe__ingredients,
.rcd-recipe ul.rcd-recipe__notes,
.rcd-recipe ol.rcd-recipe__steps {
	padding: 0 !important;
	list-style: none !important;
	line-height: inherit !important;
}

.rcd-recipe .rcd-recipe__ingredients li,
.rcd-recipe .rcd-recipe__notes li,
.rcd-recipe .rcd-recipe__steps li {
	list-style: none !important;
}

/* Inside the Divi module the module's own Spacing settings place the card. */
.rcd_recipe_card .rcd-recipe {
	margin-top: 0;
	margin-bottom: 0;
}


/* -----------------------------------------------------------------------------
 * Ratings
 * -------------------------------------------------------------------------- */

/* Text only screen readers hear. */
.rcd-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Five stars filled to the average: an empty row with a filled row on top,
   cut to the right width. */
.rcd-stars {
	position: relative;
	display: inline-block;
	color: var(--rcd-star-off);
	font-size: 16px;
	line-height: 1;
	letter-spacing: 2px;
	white-space: nowrap;
	vertical-align: middle;
}

.rcd-stars__full {
	position: absolute;
	width: var(--rcd-fill, 0%);
	top: 0;
	left: 0;
	overflow: hidden;
	color: var(--rcd-star);
}

/* Average under the recipe name. */
.rcd-recipe .rcd-recipe__rating {
	margin-top: 14px;
}

.rcd-recipe .rcd-recipe__rating-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--rcd-muted);
	font-size: 13px;
	letter-spacing: 1px;
	text-decoration: none;
}

.rcd-recipe .rcd-recipe__rating-link:hover .rcd-recipe__rating-text {
	color: var(--rcd-accent);
}

/* Banner at the foot of the card. */
.rcd-recipe .rcd-recipe__cta {
	margin-top: 40px;
	padding: 32px 28px 30px;
	border-top: 1px solid var(--rcd-line);
	border-bottom: 1px solid var(--rcd-line);
	text-align: center;
}

.rcd-recipe .rcd-recipe__cta-heading {
	color: var(--rcd-ink);
	font-family: var(--rcd-display);
	font-size: 26px;
	line-height: 1.25;
}

.rcd-recipe .rcd-recipe__cta-text {
	max-width: 480px;
	margin: 8px auto 0;
	color: var(--rcd-body);
	font-size: 16px;
	line-height: 1.7;
}

.rcd-recipe .rcd-recipe__cta-action {
	margin: 22px 0 0;
	padding: 0;
}

.rcd-recipe .rcd-recipe__cta-button {
	min-width: 220px;
}

/* Where the banner button lands: clear of a fixed header. */
#respond,
#commentform,
#comments {
	scroll-margin-top: 120px;
}

/* Star picker in the comment form. */
.rcd-rate {
	margin: 0 0 18px;
	padding: 0;
	border: 0;
}

.rcd-rate .rcd-rate__legend {
	margin-bottom: 6px;
	padding: 0;
	color: var(--rcd-ink);
	font-size: 14px;
	letter-spacing: 1px;
}

.rcd-rate .rcd-rate__stars {
	display: inline-flex;
	flex-direction: row-reverse;
	gap: 4px;
}

.rcd-rate .rcd-rate__input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.rcd-rate .rcd-rate__star {
	margin: 0;
	color: var(--rcd-star-off);
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease-in-out;
}

.rcd-rate .rcd-rate__input:checked ~ .rcd-rate__star,
.rcd-rate .rcd-rate__star:hover,
.rcd-rate .rcd-rate__star:hover ~ .rcd-rate__star {
	color: var(--rcd-star);
}

.rcd-rate .rcd-rate__input:focus-visible + .rcd-rate__star {
	outline: 1px solid var(--rcd-star);
	outline-offset: 2px;
}

/* Stars on each rated comment. */
.rcd-comment-rating {
	margin: 0 0 8px !important;
	padding: 0 !important;
}

.rcd-comment-rating .rcd-stars {
	font-size: 15px;
}

@media print {
	.rcd-recipe .rcd-recipe__cta {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rcd-rate .rcd-rate__star {
		transition: none;
	}
}
