/**
 * FoodMaster theme framework.
 *
 * The page's ground, measure, type, buttons, forms, and layout helpers, all
 * read from the plugin's tokens (css/foodmaster-tokens.css). The theme adds
 * no colour of its own: paper, black, the operator's ink, and the neutral
 * ramp are the whole palette.
 */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body.foodmaster-modern-theme {
	margin: 0;
	background: var(--fm-paper, #fff);
	color: var(--fm-black, #141414);
	font-family: var(--fm-font-body, system-ui, sans-serif);
	font-size: var(--fm-size, 16px);
	line-height: var(--fm-leading, 1.4);
	font-variant-numeric: tabular-nums;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.foodmaster-modern-theme ::selection {
	background: var(--fm-ink);
	color: var(--fm-on-ink);
}

body.foodmaster-modern-theme :focus-visible {
	outline: none;
	box-shadow: var(--fm-focus);
	border-radius: var(--fm-radius);
}

/* Content images scale with their column; plugin surfaces size their own images. */
.modern-page-body img,
.modern-single-body img,
.modern-sidebar img,
.footer-section img {
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color var(--fm-fast) var(--fm-ease);
}

/* Prose links only: underlined, ink on hover. Controls and plugin surfaces keep their own rules. */
.modern-page-body a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="foodmaster-"]):not([class*="wc-block"]):not(.woocommerce-LoopProduct-link):not(.page-numbers):not(.modern-product-title-link):not(.modern-entry-link),
.modern-single-body a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="foodmaster-"]):not([class*="wc-block"]):not(.woocommerce-LoopProduct-link):not(.page-numbers):not(.modern-product-title-link):not(.modern-entry-link),
.modern-main-content p a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="wc-block"]),
.modern-main-content li a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="foodmaster-"]):not([class*="wc-block"]):not(.woocommerce-LoopProduct-link):not(.page-numbers):not(.modern-product-title-link):not(.modern-entry-link) {
	color: var(--fm-black);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.modern-page-body a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="foodmaster-"]):not([class*="wc-block"]):not(.woocommerce-LoopProduct-link):not(.page-numbers):not(.modern-product-title-link):not(.modern-entry-link):hover,
.modern-single-body a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="foodmaster-"]):not([class*="wc-block"]):not(.woocommerce-LoopProduct-link):not(.page-numbers):not(.modern-product-title-link):not(.modern-entry-link):hover,
.modern-main-content p a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="wc-block"]):hover,
.modern-main-content li a:not(.button):not(.modern-btn):not(.wp-block-button__link):not(.wp-element-button):not([class*="foodmaster-"]):not([class*="wc-block"]):not(.woocommerce-LoopProduct-link):not(.page-numbers):not(.modern-product-title-link):not(.modern-entry-link):hover {
	color: var(--fm-ink);
}

/* Type */
.modern-h1, .modern-h2, .modern-h3, .modern-h4,
.modern-heading,
.modern-main-content h1,
.modern-main-content h2,
.modern-main-content h3,
.modern-main-content h4 {
	margin: 0 0 0.4em;
	font-family: var(--fm-font-display);
	font-weight: var(--fm-display-weight);
	line-height: 0.95;
	letter-spacing: calc(0.005em * var(--fm-tracking));
	text-transform: var(--fm-caps);
	color: var(--fm-black);
	text-wrap: balance;
}

.modern-h1, .modern-main-content h1 { font-size: clamp(36px, 5vw, 56px); }
.modern-h2, .modern-main-content h2 { font-size: clamp(28px, 3.6vw, 40px); }
.modern-h3, .modern-main-content h3 { font-size: 26px; }
.modern-h4, .modern-main-content h4 { font-size: 20px; letter-spacing: calc(0.02em * var(--fm-tracking)); }

.modern-main-content h5,
.modern-main-content h6 {
	margin: 0 0 0.4em;
	font-family: var(--fm-font-body);
	font-weight: 700;
	font-size: 16px;
	line-height: 1.3;
}

.modern-main-content p {
	margin: 0 0 1em;
	max-width: 70ch;
}

.modern-main-content ul,
.modern-main-content ol {
	margin: 0 0 1em;
	padding-inline-start: 1.25em;
}

.modern-main-content blockquote {
	margin: 1.5em 0;
	padding: 0 0 0 calc(var(--fm-m) * 2);
	border-inline-start: var(--fm-rule-strong);
	font-size: 1.05em;
}

.modern-text-muted { color: var(--fm-n6); }

/* Measure */
.modern-container,
.container {
	width: 100%;
	max-width: var(--fm-container, 1200px);
	margin: 0 auto;
	padding: 0 calc(var(--fm-m) * 2);
}

.modern-container-fluid {
	width: 100%;
	padding: 0 calc(var(--fm-m) * 2);
}

.modern-content-wrapper {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: calc(var(--fm-m) * 5);
	padding: calc(var(--fm-m) * 4) 0 calc(var(--fm-m) * 8);
}

.modern-content-wrapper:has(.modern-sidebar) {
	grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
}

.modern-content-area { min-width: 0; }
.modern-sidebar { min-width: 0; }

.modern-sidebar .widget {
	margin: 0 0 calc(var(--fm-m) * 3);
	padding: 0;
	background: transparent;
	border: 0;
	box-shadow: none;
}

.modern-sidebar .widget-title {
	margin: 0 0 var(--fm-m);
	padding: 0 0 var(--fm-m);
	border-bottom: var(--fm-rule-strong);
	font-family: var(--fm-font-display);
	font-weight: var(--fm-display-weight);
	font-size: 20px;
	letter-spacing: calc(0.02em * var(--fm-tracking));
	text-transform: var(--fm-caps);
}

/* Grid helpers */
.modern-row {
	display: flex;
	flex-wrap: wrap;
	margin: 0 calc(var(--fm-m) * -1.5);
}

[class*="modern-col-"],
.modern-col {
	flex: 1 0 0;
	min-width: 0;
	padding: 0 calc(var(--fm-m) * 1.5);
}

.modern-col-1 { flex: 0 0 8.3333%; max-width: 8.3333%; }
.modern-col-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
.modern-col-3 { flex: 0 0 25%; max-width: 25%; }
.modern-col-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
.modern-col-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
.modern-col-6 { flex: 0 0 50%; max-width: 50%; }
.modern-col-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.modern-col-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.modern-col-9 { flex: 0 0 75%; max-width: 75%; }
.modern-col-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.modern-col-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.modern-col-12 { flex: 0 0 100%; max-width: 100%; }

.modern-flex { display: flex; }
.modern-flex-column { flex-direction: column; }
.modern-flex-wrap { flex-wrap: wrap; }
.modern-items-start { align-items: flex-start; }
.modern-items-center { align-items: center; }
.modern-items-end { align-items: flex-end; }
.modern-justify-center { justify-content: center; }
.modern-justify-between { justify-content: space-between; }

.modern-mb-4 { margin-bottom: calc(var(--fm-m) * 3); }
.modern-mb-5 { margin-bottom: calc(var(--fm-m) * 5); }
.modern-mt-4 { margin-top: calc(var(--fm-m) * 3); }
.modern-mt-5 { margin-top: calc(var(--fm-m) * 5); }

/* Buttons: ink primary, outlined secondary */
.modern-btn {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--fm-m);
	min-height: calc(var(--fm-m) * 6);
	padding: 0 calc(var(--fm-m) * 2.5);
	background: var(--fm-ink);
	border: 1.5px solid var(--fm-ink);
	border-radius: var(--fm-radius);
	color: var(--fm-on-ink);
	font-family: var(--fm-font-display);
	font-weight: var(--fm-display-weight);
	font-size: 17px;
	line-height: 1;
	letter-spacing: calc(0.03em * var(--fm-tracking));
	text-transform: var(--fm-caps);
	text-decoration: none;
	cursor: pointer;
	transition: background var(--fm-fast) var(--fm-ease), color var(--fm-fast) var(--fm-ease), border-color var(--fm-fast) var(--fm-ease);
}

.modern-btn:hover,
.modern-btn-primary:hover {
	background: var(--fm-ink-hover);
	border-color: var(--fm-ink-hover);
	color: var(--fm-on-ink);
	text-decoration: none;
}

.modern-btn-secondary,
.modern-btn-outline {
	background: var(--fm-paper);
	border-color: var(--fm-black);
	color: var(--fm-black);
}

.modern-btn-secondary:hover,
.modern-btn-outline:hover {
	background: var(--fm-black);
	border-color: var(--fm-black);
	color: var(--fm-paper);
}

.modern-btn-sm { min-height: calc(var(--fm-m) * 4.5); padding: 0 calc(var(--fm-m) * 1.5); font-size: 14px; }
.modern-btn-lg { min-height: calc(var(--fm-m) * 7); padding: 0 calc(var(--fm-m) * 3); font-size: 19px; }

/* Ruled box (the only container) */
.modern-card {
	background: var(--fm-paper);
	border: var(--fm-rule-strong);
	border-radius: var(--fm-radius);
	box-shadow: none;
	transition: none;
}

.modern-card:hover { box-shadow: none; transform: none; }

.modern-card-header {
	padding: var(--fm-m) calc(var(--fm-m) * 2);
	border-bottom: var(--fm-rule-strong);
	font-family: var(--fm-font-display);
	font-weight: var(--fm-display-weight);
	font-size: 20px;
	letter-spacing: calc(0.02em * var(--fm-tracking));
	text-transform: var(--fm-caps);
}

.modern-card-body { padding: calc(var(--fm-m) * 2); }
.modern-card-footer { padding: var(--fm-m) calc(var(--fm-m) * 2); border-top: var(--fm-rule); }

/* Forms */
.modern-form-group { display: grid; gap: 4px; margin: 0 0 calc(var(--fm-m) * 2); }

.modern-form-label {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: calc(0.02em * var(--fm-tracking));
	color: var(--fm-n7);
}

.modern-form-control,
body.foodmaster-modern-theme input[type="text"],
body.foodmaster-modern-theme input[type="email"],
body.foodmaster-modern-theme input[type="tel"],
body.foodmaster-modern-theme input[type="url"],
body.foodmaster-modern-theme input[type="number"],
body.foodmaster-modern-theme input[type="password"],
body.foodmaster-modern-theme input[type="search"],
body.foodmaster-modern-theme input[type="date"],
body.foodmaster-modern-theme textarea,
body.foodmaster-modern-theme select {
	appearance: none;
	-webkit-appearance: none;
	width: 100%;
	min-height: calc(var(--fm-m) * 6);
	margin: 0;
	padding: 0 calc(var(--fm-m) * 1.5);
	background: var(--fm-paper);
	border: 1.5px solid var(--fm-black);
	border-radius: var(--fm-radius);
	box-shadow: none;
	color: var(--fm-black);
	font-family: var(--fm-font-body);
	font-size: 16px;
	line-height: 1.3;
	transition: box-shadow var(--fm-fast) var(--fm-ease);
}

body.foodmaster-modern-theme textarea {
	min-height: calc(var(--fm-m) * 12);
	padding: calc(var(--fm-m) * 1.25) calc(var(--fm-m) * 1.5);
	resize: vertical;
}

body.foodmaster-modern-theme select {
	padding-inline-end: calc(var(--fm-m) * 5);
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%;
	background-size: 6px 6px;
	background-repeat: no-repeat;
	cursor: pointer;
}

.modern-form-control::placeholder,
body.foodmaster-modern-theme input::placeholder,
body.foodmaster-modern-theme textarea::placeholder {
	color: var(--fm-n6);
}

.modern-form-control:focus,
body.foodmaster-modern-theme input:focus,
body.foodmaster-modern-theme textarea:focus,
body.foodmaster-modern-theme select:focus {
	outline: none;
	box-shadow: var(--fm-focus);
}

body.foodmaster-modern-theme input[type="checkbox"],
body.foodmaster-modern-theme input[type="radio"] {
	width: calc(var(--fm-m) * 2.5);
	height: calc(var(--fm-m) * 2.5);
	margin: 0 var(--fm-m) 0 0;
	accent-color: var(--fm-ink);
	vertical-align: middle;
}

body.foodmaster-modern-theme button,
body.foodmaster-modern-theme input[type="submit"],
body.foodmaster-modern-theme .button {
	font-family: var(--fm-font-display);
}

/* Motion: nothing enters animated; the page is already there */
.modern-fade-in {
	animation: none;
	opacity: 1;
}

@media (max-width: 1024px) {
	.modern-content-wrapper:has(.modern-sidebar) {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 768px) {
	.modern-col-md-12 { flex: 0 0 100%; max-width: 100%; }
	.modern-col-md-6 { flex: 0 0 50%; max-width: 50%; }
	.modern-col-md-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
	.modern-col-md-3 { flex: 0 0 25%; max-width: 25%; }
	.modern-col-sm-12 { flex: 0 0 100%; max-width: 100%; }

	.modern-content-wrapper {
		padding: calc(var(--fm-m) * 3) 0 calc(var(--fm-m) * 6);
	}
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	body.foodmaster-modern-theme a,
	.modern-btn,
	.modern-form-control { transition: none; }
}
