/* NC Recipe Builder — recipe card + jump box.
 * Themes often restyle headings, links, buttons and spacing inside post content.
 * Layout-critical declarations here use !important so the card looks the same
 * on any theme; colors come from settings via CSS variables.
 */

/* Base colors: zero-specificity defaults; the settings inline style (on :root)
   or the settings preview host override them by inheritance. */
:where(:root) {
	--ncrb-accent: #2e7d32;
	--ncrb-bg: #ffffff;
	--ncrb-text: #1f2933;
	--ncrb-radius: 14px;
}

.ncrb-card,
.ncrb-jump {
	--ncrb-line: color-mix(in srgb, var(--ncrb-text) 14%, transparent);
	--ncrb-soft: color-mix(in srgb, var(--ncrb-accent) 8%, var(--ncrb-bg));
	--ncrb-on-accent: #ffffff;
	box-sizing: border-box !important;
	font-size: 16px;
	line-height: 1.55;
	text-align: left;
}
.ncrb-card *,
.ncrb-card *::before,
.ncrb-card *::after,
.ncrb-jump *,
.ncrb-jump *::before,
.ncrb-jump *::after { box-sizing: border-box !important; }
.ncrb-card::before, .ncrb-card::after,
.ncrb-jump::before, .ncrb-jump::after { content: none !important; display: none !important; }

/* Stray paragraphs/line breaks a theme may inject. */
.ncrb-card > p:empty, .ncrb-jump > p:empty,
.ncrb-card > br, .ncrb-jump > br,
.ncrb-card-head > br, .ncrb-card-head > p:empty { display: none !important; }

/* Neutralise theme heading decoration (underlines, borders, caps, padding). */
.ncrb-card h2, .ncrb-card h3, .ncrb-card h4,
.ncrb-jump p {
	border: 0 !important;
	padding: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: var(--ncrb-text) !important;
}
.ncrb-card h2::before, .ncrb-card h2::after,
.ncrb-card h3::before, .ncrb-card h3::after,
.ncrb-card h4::before, .ncrb-card h4::after { content: none !important; display: none !important; }
.ncrb-card ul, .ncrb-card ol { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.ncrb-card li { margin: 0 !important; padding: 0; background: none !important; }
.ncrb-card li::marker { content: none; }

/* Theme image borders, shadows and margins don't belong inside the card. */
.ncrb-card img { border: 0 !important; box-shadow: none !important; padding: 0 !important; background: none !important; }

/* ---------- Buttons ---------- */
.ncrb-card .ncrb-btn,
.ncrb-jump .ncrb-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px;
	width: auto !important;
	height: auto !important;
	min-height: 44px !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 10px 20px !important;
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	color: var(--ncrb-accent) !important;
	background: transparent !important;
	border: 2px solid var(--ncrb-accent) !important;
	border-radius: 999px !important;
	box-shadow: none !important;
	cursor: pointer;
	transition: background .15s, color .15s, filter .15s;
}
.ncrb-card .ncrb-btn:hover,
.ncrb-card .ncrb-btn:focus-visible,
.ncrb-jump .ncrb-btn:hover,
.ncrb-jump .ncrb-btn:focus-visible {
	background: var(--ncrb-accent) !important;
	color: var(--ncrb-on-accent) !important;
}
.ncrb-card .ncrb-btn-solid,
.ncrb-jump .ncrb-btn-solid {
	background: var(--ncrb-accent) !important;
	color: var(--ncrb-on-accent) !important;
}
.ncrb-card .ncrb-btn-solid:hover,
.ncrb-jump .ncrb-btn-solid:hover { filter: brightness(.9); }
.ncrb-card .ncrb-btn *, .ncrb-jump .ncrb-btn * { color: inherit !important; }
.ncrb-card .ncrb-btn:focus-visible,
.ncrb-jump .ncrb-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--ncrb-accent) 40%, transparent) !important; outline-offset: 2px; }

/* ---------- Jump box ---------- */
.ncrb-jump {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 20px !important;
	margin: 1.75em 0 !important;
	padding: 18px 20px 18px 22px !important;
	background: var(--ncrb-soft) !important;
	color: var(--ncrb-text) !important;
	border: 1px solid var(--ncrb-line) !important;
	border-left: 5px solid var(--ncrb-accent) !important;
	border-radius: var(--ncrb-radius) !important;
	box-shadow: none !important;
}
.ncrb-jump-text { min-width: 0; }
.ncrb-jump p { margin: 0 !important; }
.ncrb-jump .ncrb-jump-eyebrow {
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	color: var(--ncrb-accent) !important;
}
.ncrb-jump .ncrb-jump-name { margin: 4px 0 4px !important; font-size: 1.15em !important; font-weight: 700 !important; line-height: 1.3 !important; }
.ncrb-jump .ncrb-jump-meta { font-size: .92em !important; opacity: .8; }
.ncrb-jump .ncrb-jump-btn { flex: none; }

/* ---------- Card ---------- */
.ncrb-card {
	display: block !important;
	margin: 2.5em 0 !important;
	padding: 0 !important;
	background: var(--ncrb-bg) !important;
	color: var(--ncrb-text) !important;
	border: 1px solid var(--ncrb-line) !important;
	border-top: 6px solid var(--ncrb-accent) !important;
	border-radius: var(--ncrb-radius) !important;
	overflow: hidden !important;
	box-shadow: 0 8px 28px rgba(0, 0, 0, .06) !important;
	scroll-margin-top: 24px;
}
.ncrb-card .ncrb-card-head {
	display: grid !important;
	grid-template-columns: 220px minmax(0, 1fr) !important;
	align-items: start !important;
	gap: 24px !important;
	margin: 0 !important;
	padding: 24px !important;
	border-bottom: 1px solid var(--ncrb-line) !important;
}
.ncrb-card .ncrb-card-head.ncrb-no-img { grid-template-columns: minmax(0, 1fr) !important; }
.ncrb-card .ncrb-card-img {
	display: block !important;
	width: 100% !important;
	height: 220px !important;
	max-width: none !important;
	margin: 0 !important;
	object-fit: cover !important;
	border-radius: calc(var(--ncrb-radius) * .7) !important;
}
.ncrb-card .ncrb-card-title { margin: 0 0 8px !important; font-size: 1.55em !important; line-height: 1.2 !important; font-weight: 700 !important; }
.ncrb-card .ncrb-card-desc { margin: 0 0 16px !important; opacity: .85; }
.ncrb-card .ncrb-meta {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 10px 28px !important;
	margin: 0 0 18px !important;
}
.ncrb-card .ncrb-meta li { display: flex !important; flex-direction: column !important; }
.ncrb-card .ncrb-meta-k { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ncrb-accent); }
.ncrb-card .ncrb-meta-v { font-size: 1.08em; font-weight: 700; }
.ncrb-card .ncrb-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; margin: 0 !important; }

.ncrb-card .ncrb-card-body {
	display: grid !important;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) !important;
	gap: 32px !important;
	margin: 0 !important;
	padding: 24px !important;
}
.ncrb-card h3 { margin: 0 0 14px !important; font-size: 1.25em !important; line-height: 1.3 !important; font-weight: 700 !important; }
.ncrb-card .ncrb-section-head {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	margin: 0 0 10px !important;
}
.ncrb-card .ncrb-section-head h3 { margin: 0 !important; }
.ncrb-card .ncrb-group { margin: 16px 0 4px !important; font-size: .95em !important; font-weight: 700 !important; color: var(--ncrb-accent) !important; }
.ncrb-card .ncrb-col-steps h3 + .ncrb-steps { margin-top: 0 !important; }
.ncrb-card .ncrb-notes-title { margin-top: 22px !important; }

/* Servings scaler */
.ncrb-card .ncrb-scale {
	display: inline-flex !important;
	align-items: center !important;
	flex: none;
	margin: 0 !important;
	padding: 0 !important;
	border: 2px solid var(--ncrb-accent) !important;
	border-radius: 999px !important;
	overflow: hidden !important;
}
.ncrb-card .ncrb-scale-btn {
	display: grid !important;
	place-items: center !important;
	width: 40px !important;
	height: 36px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--ncrb-accent) !important;
	font-size: 22px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	box-shadow: none !important;
	cursor: pointer;
}
.ncrb-card .ncrb-scale-btn:hover { background: var(--ncrb-soft) !important; }
.ncrb-card .ncrb-scale-out { min-width: 28px; text-align: center; font-weight: 700; }
.ncrb-card.ncrb-scaled .ncrb-qty { color: var(--ncrb-accent); }

/* Ingredients */
.ncrb-card .ncrb-ings li { border-bottom: 1px dashed var(--ncrb-line) !important; }
.ncrb-card .ncrb-ings li:last-child { border-bottom: 0 !important; }
.ncrb-card .ncrb-ings label {
	display: flex !important;
	gap: 12px !important;
	align-items: flex-start !important;
	margin: 0 !important;
	padding: 10px 0 !important;
	font-weight: 400 !important;
	cursor: pointer;
}
.ncrb-card .ncrb-check {
	flex: none !important;
	width: 20px !important;
	height: 20px !important;
	margin: 3px 0 0 !important;
	padding: 0 !important;
	accent-color: var(--ncrb-accent);
	cursor: pointer;
}
.ncrb-card .ncrb-qty { font-weight: 700; }
.ncrb-card .ncrb-note { opacity: .75; }
.ncrb-card .ncrb-done .ncrb-ing-text { text-decoration: line-through; opacity: .5; }

/* Instructions */
.ncrb-card .ncrb-steps { counter-reset: ncrb-step; }
.ncrb-card .ncrb-steps li {
	position: relative !important;
	margin: 0 0 16px !important;
	padding: 0 0 0 46px !important;
	counter-increment: ncrb-step;
	line-height: 1.6 !important;
}
.ncrb-card .ncrb-steps li::before {
	content: counter(ncrb-step) !important;
	display: grid !important;
	position: absolute !important;
	left: 0;
	top: 0;
	width: 32px;
	height: 32px;
	place-items: center;
	border-radius: 50%;
	background: var(--ncrb-accent);
	color: var(--ncrb-on-accent);
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
}
.ncrb-card .ncrb-notes li { position: relative !important; margin: 0 0 8px !important; padding: 0 0 0 18px !important; }
.ncrb-card .ncrb-notes li::before {
	content: '' !important;
	position: absolute;
	left: 2px;
	top: .62em;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--ncrb-accent);
}

/* Nutrition */
.ncrb-card .ncrb-nutrition { margin: 0 !important; padding: 22px 24px !important; background: var(--ncrb-soft) !important; border-top: 1px solid var(--ncrb-line) !important; }
.ncrb-card .ncrb-nut-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important;
	gap: 10px !important;
	margin: 0 !important;
	padding: 0 !important;
}
.ncrb-card .ncrb-nut-grid div {
	margin: 0 !important;
	padding: 10px 12px !important;
	background: var(--ncrb-bg) !important;
	border: 1px solid var(--ncrb-line) !important;
	border-radius: calc(var(--ncrb-radius) * .6) !important;
}
.ncrb-card .ncrb-nut-grid dt { margin: 0 !important; font-size: 12px; font-weight: 400; opacity: .75; }
.ncrb-card .ncrb-nut-grid dd { margin: 2px 0 0 !important; padding: 0 !important; font-size: 1.1em; font-weight: 700; }
.ncrb-card .ncrb-nut-src { margin: 12px 0 0 !important; font-size: 12px; opacity: .75; }
.ncrb-card .ncrb-nut-src a { color: inherit !important; text-decoration: underline; }

/* Pin */
.ncrb-card .ncrb-pin {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: 14px !important;
	margin: 0 !important;
	padding: 24px !important;
	border-top: 1px solid var(--ncrb-line) !important;
}
.ncrb-card .ncrb-pin-img {
	display: block !important;
	width: 100% !important;
	max-width: 320px !important;
	height: auto !important;
	margin: 0 !important;
	border-radius: calc(var(--ncrb-radius) * .6) !important;
}

/* ---------- Mobile ---------- */
@media (max-width: 720px) {
	.ncrb-jump { flex-direction: column !important; align-items: stretch !important; padding: 16px !important; }
	.ncrb-jump .ncrb-jump-btn { width: 100% !important; }
	.ncrb-card .ncrb-card-head { grid-template-columns: minmax(0, 1fr) !important; padding: 18px !important; gap: 16px !important; }
	.ncrb-card .ncrb-card-img { height: 200px !important; }
	.ncrb-card .ncrb-card-body { grid-template-columns: minmax(0, 1fr) !important; padding: 18px !important; gap: 24px !important; }
	.ncrb-card .ncrb-actions .ncrb-btn { flex: 1 1 calc(50% - 10px); }
	.ncrb-card .ncrb-nutrition, .ncrb-card .ncrb-pin { padding: 18px !important; }
}

/* ---------- Print: only the card ---------- */
@media print {
	body.ncrb-printing * { visibility: hidden !important; }
	body.ncrb-printing .ncrb-print-target,
	body.ncrb-printing .ncrb-print-target * { visibility: visible !important; }
	body.ncrb-printing .ncrb-print-target {
		position: absolute !important;
		left: 0;
		top: 0;
		width: 100% !important;
		margin: 0 !important;
		border: 0 !important;
		box-shadow: none !important;
	}
	body.ncrb-printing .ncrb-actions,
	body.ncrb-printing .ncrb-scale,
	body.ncrb-printing .ncrb-pin,
	body.ncrb-printing .ncrb-check { display: none !important; }
	body.ncrb-printing .ncrb-card-head { grid-template-columns: 140px minmax(0, 1fr) !important; }
	body.ncrb-printing .ncrb-card-img { height: 140px !important; }
	body.ncrb-printing .ncrb-card-body { grid-template-columns: 2fr 3fr !important; }
	body.ncrb-printing .ncrb-steps li::before { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
	body.ncrb-printing .ncrb-done .ncrb-ing-text { text-decoration: none; opacity: 1; }
}