/*
 * Skins the Tasty Recipes card to the Skillet & Spoon design tokens.
 * Class names verified against real rendered output (view-source on a
 * published test post), not guessed from documentation — see
 * docs/SETUP.md "Posts + Tasty Recipes" section for how this was checked.
 *
 * Colors/capitalization are mostly already set via Tasty Recipes' own
 * Design tab (wp-admin → Tasty Recipes → Design), which is the supported
 * way to theme it and survives plugin updates. This stylesheet only
 * covers what that settings screen can't reach: fonts, spacing, radii,
 * borders, and a few layout details to match our card language.
 */

/* ---------- Generic post content around the recipe card ---------- */
.ss-post-content {
	font: var(--type-body);
	font-size: var(--text-lg);
	max-width: 68ch;
}
.ss-post-content > * + * { margin-top: 18px; }
.ss-post-content h2 {
	font: var(--type-section);
	font-size: var(--text-2xl);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
	color: var(--text-strong);
	margin-top: 40px;
}
.ss-post-content h3 {
	font: var(--type-card-title);
	font-size: var(--text-xl);
	color: var(--text-strong);
	margin-top: 32px;
}
.ss-post-content img { border-radius: var(--radius-md); }
.ss-post-content a { color: var(--text-link); }
.ss-post-content ul, .ss-post-content ol { padding-left: 22px; }

/* ---------- Tasty Recipes card ---------- */
.tasty-recipes {
	font-family: var(--font-sans) !important;
	border: 1px solid var(--border-hairline) !important;
	border-radius: var(--radius-lg) !important;
	box-shadow: var(--shadow-card) !important;
	padding: 28px !important;
	background: var(--surface-card) !important;
	margin: 32px 0 !important;
}
.tasty-recipes-title {
	font-family: var(--font-serif-display) !important;
	letter-spacing: var(--tracking-caps) !important;
}
.tasty-recipes-description { font: var(--type-body); }
.tasty-recipes-details {
	border-top: 1px solid var(--border-hairline) !important;
	border-bottom: 1px solid var(--border-hairline) !important;
	padding: 16px 0 !important;
}
.tasty-recipes-label {
	font: var(--type-label) !important;
	letter-spacing: var(--tracking-caps) !important;
	text-transform: uppercase !important;
	color: var(--text-muted) !important;
}
.tasty-recipes-ingredients-header,
.tasty-recipes-instructions-header {
	font-family: var(--font-sans) !important;
	letter-spacing: var(--tracking-caps) !important;
	text-transform: uppercase !important;
	color: var(--text-strong) !important;
}
.tasty-recipes-scale-button,
.tasty-recipes-convert-button {
	border-radius: var(--radius-sm) !important;
	min-height: 36px !important;
}
.tasty-recipes-scale-button-active,
.tasty-recipes-convert-button-active {
	background: var(--action-primary) !important;
	color: var(--text-on-dark) !important;
	border-color: var(--action-primary) !important;
}
.tasty-recipes-print-button,
.tasty-recipes-jump-link,
.tasty-recipes-print-link {
	border-radius: var(--radius-sm) !important;
	min-height: 44px !important;
}
.tasty-recipes-cook-mode__switch-slider {
	background-color: var(--border-default) !important;
}
.tasty-recipes-cook-mode__switch input:checked + .tasty-recipes-cook-mode__switch-slider {
	background-color: var(--action-primary) !important;
}
.tasty-recipes-entry-footer {
	background: var(--surface-sage) !important;
	border-radius: var(--radius-md) !important;
}
