/*
 * The printout (recipe_v4/_print.html, filled by recipe_print.js): when a recipe page with the
 * sheet prints, the sheet is all that prints. Hidden by exclusion rather than a list, as ads,
 * the video player and other scripts add their own elements to the page: everything that isn't
 * the sheet, inside it or around it goes, and the elements around it make no box of their own
 * (display: contents), so their margins, padding, backgrounds and heights go too (the page's top
 * margin is set inline by the hero's script). A premium recipe that isn't open yet has no sheet
 * and prints as before. recipe_styles.css already undoes Bootstrap's A3 page and 992px minimum.
 */
@media print {
	@page {
		size: auto;
		margin: 14mm 15mm 16mm;
	}

	html:has([data-rp-print-sheet]) body {
		margin: 0 !important;
		padding: 0 !important;
		min-width: 0 !important;
		background: #fff !important;
	}
	html:has([data-rp-print-sheet]) body *:not(:has([data-rp-print-sheet])):not([data-rp-print-sheet]):not([data-rp-print-sheet] *) {
		display: none !important;
	}
	html:has([data-rp-print-sheet]) body *:has([data-rp-print-sheet]) {
		display: contents !important;
	}
	html:has([data-rp-print-sheet]) body::before,
	html:has([data-rp-print-sheet]) body::after,
	html:has([data-rp-print-sheet]) body *:has([data-rp-print-sheet])::before,
	html:has([data-rp-print-sheet]) body *:has([data-rp-print-sheet])::after {
		content: none !important;
		display: none !important;
	}

	/* The sheet: black on white, the site's fonts */
	.rp-print[hidden] {
		display: block !important;
	}
	.rp-print {
		color: #1a1a1a;
		font-family: 'Hind Vadodara', sans-serif;
		font-size: 10.5pt;
		font-weight: 400;
		line-height: 1.45;
		text-align: left;
	}
	.rp-print * {
		color: inherit !important;
		background: none !important;
		letter-spacing: normal;
	}

	.rp-print__top {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 6mm;
		padding-bottom: 3mm;
		margin-bottom: 6mm;
		border-bottom: 0.5pt solid #b5b5b5;
	}
	.rp-print__logo {
		display: block;
		width: auto;
		height: 6.5mm;
	}
	.rp-print__url {
		font-size: 8.5pt;
		color: #5a5a5a !important;
	}
	.rp-print__title {
		margin: 0 0 1.5mm;
		font-family: 'Cotoris Bold', 'Hind Vadodara', sans-serif;
		font-size: 24pt;
		line-height: 1.1;
	}
	.rp-print__meta {
		margin: 0 0 6mm;
		font-size: 10pt;
		color: #4a4a4a !important;
	}
	.rp-print__part {
		margin-bottom: 6mm;
	}
	.rp-print__h,
	.rp-print__extras > div > h3 {
		margin: 0 0 2.5mm;
		padding-bottom: 1mm;
		border-bottom: 0.5pt solid #d0d0d0;
		font-family: 'Cotoris Bold', 'Hind Vadodara', sans-serif;
		font-size: 13pt;
		font-weight: 400;
		line-height: 1.2;
		break-after: avoid;
	}

	/* Ingredients: two columns, list titles kept with their first lines */
	.rp-print__ingredients {
		column-count: 2;
		column-gap: 9mm;
	}
	.rp-print__ingredients h3 {
		margin: 0 0 1mm;
		padding-top: 1.5mm;
		font-family: inherit;
		font-size: 10.5pt;
		font-weight: 600;
		line-height: 1.3;
		break-after: avoid;
	}
	/* With more than one group, each stays whole in a column, so none starts without its title */
	.rp-print__ingredients:has(> div + div) > div {
		break-inside: avoid;
	}
	.rp-print__ingredients ul,
	.rp-print__extras ul {
		margin: 0 0 3mm;
		padding: 0;
		list-style: none;
	}
	.rp-print__extras ul {
		margin-bottom: 0;
	}
	.rp-print__ingredients li {
		margin: 0 0 1.2mm;
		break-inside: avoid;
	}
	/* One line: the amount (bold), the metric amount, the name and its note */
	.rp-print__ingredients li > div:first-child,
	.rp-print__ingredients li > div:first-child div {
		display: inline;
	}
	.rp-print__ingredients li > div:first-child > span:first-child {
		font-weight: 600;
	}
	/* The swaps the reader opened, under the line */
	.rp-print__ingredients li > div + div {
		padding-left: 4mm;
		font-size: 9pt;
		font-style: italic;
		color: #555 !important;
	}
	.rp-print sup {
		font-size: 0.7em;
		line-height: 0;
	}

	.rp-print__steps {
		margin: 0;
		padding-left: 6mm;
	}
	.rp-print__steps > li {
		margin: 0 0 2.5mm;
		padding-left: 1mm;
		break-inside: avoid;
	}
	.rp-print__steps > li::marker {
		font-weight: 600;
	}

	/* Notes and storage */
	.rp-print__extras > div {
		margin-bottom: 4mm;
		break-inside: avoid;
	}
	.rp-print__extras li {
		margin: 0 0 1.5mm;
	}
}