/* Shared styles for the custom-coded pages (body.jfs-new-page). */

/* Let sections run full width inside Astra's content wrapper. */
body.jfs-new-page .site-content > .ast-container,
body.jfs-new-page #content > .ast-container {
	max-width: none;
	padding: 0;
	display: block;
}
body.jfs-new-page #primary,
body.jfs-new-page .site-main {
	margin: 0;
	padding: 0;
	width: 100%;
}

.jfs-p {
	background: #ffffff;
	color: #1b2430;
	font-family: Roboto, system-ui, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}
.jfs-p *,
.jfs-p *::before,
.jfs-p *::after { box-sizing: border-box; }
.jfs-p a { color: #14324f; }
.jfs-p a:hover { color: #0b1f33; }
.jfs-p h1, .jfs-p h2, .jfs-p h3, .jfs-p h4 {
	font-family: Poppins, system-ui, sans-serif;
	letter-spacing: normal;
	text-transform: none;
}
/* Astra sets a heading colour and resets heading weight; headings here inherit their section colour. */
body .jfs-p h1, body .jfs-p h2, body .jfs-p h3, body .jfs-p h4, body .jfs-p h5, body .jfs-p h6 {
	color: inherit;
	font-weight: 700;
}
.jfs-p p { margin-bottom: 0; }
/* Astra caps every number field at 58px (meant for WooCommerce quantity boxes); guest counts need room. */
body.jfs-new-page .jfs-p input[type="number"] { max-width: none; }
/* Tabs and filters hide things with the hidden attribute; inline display styles must not override it. */
.jfs-p [hidden] { display: none !important; }
/* Astra styles every blockquote (grey text, left border, italic, padding); quotes here follow their section. */
body .jfs-p blockquote, body .jfs-p q {
	color: inherit;
	border: 0;
	padding: 0;
	margin: 0;
	font-size: inherit;
	font-style: normal;
	quotes: none;
}
.jfs-p img { max-width: 100%; height: auto; }
.jfs-p img[style*="aspect-ratio"] { height: auto; }
.jfs-p .wrap { max-width: 1240px; margin: 0 auto; padding: 0 24px; box-sizing: border-box; }
.jfs-p button { text-transform: none; letter-spacing: normal; line-height: 1.2; }
.jfs-p :focus-visible { outline: 3px solid #b3261e; outline-offset: 2px; }

/* Form controls (Astra styles inputs globally). */
.jfs-p input:not([type=checkbox]):not([type=radio]),
.jfs-p select,
.jfs-p textarea {
	font: inherit;
	font-size: 15px;
	border: 1px solid #c9d2dc;
	border-radius: 10px;
	padding: 11px 12px;
	min-height: 46px;
	width: 100%;
	background: #fff;
	color: #1b2430;
	box-shadow: none;
}
.jfs-p textarea { min-height: 96px; }
.jfs-p label.f { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; color: #36404c; }
.jfs-p .jfs-sent {
	padding: 24px 8px;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: center;
}
.jfs-p .jfs-sent strong { font-family: Poppins, sans-serif; font-size: 22px; color: #14324f; }
.jfs-p .jfs-sent span { font-size: 15px; color: #56606c; }

/* Catering sub-navigation. */
.jfs-p .sub { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }

@media (max-width: 900px) {
	.jfs-p h1 { font-size: 38px !important; }
	.jfs-p h2 { font-size: 28px !important; }
	.jfs-p .wrap { padding: 0 16px; }
}

/* Toggle chips (checkbox styled as a pill button). */
.jfs-p .jfs-chip { position: relative; display: inline-flex; cursor: pointer; }
.jfs-p .jfs-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.jfs-p .jfs-chip span {
	display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 16px;
	border-radius: 12px; border: 1px solid #c9d2dc; background: #fff; color: #1b2430; font-size: 15px; font-weight: 600;
}
.jfs-p .jfs-chip span::before { content: "+"; }
.jfs-p .jfs-chip input:checked + span { background: #14324f; color: #fff; border: 2px solid #14324f; }
.jfs-p .jfs-chip input:checked + span::before { content: "\2713"; }
.jfs-p .jfs-chip input:focus-visible + span { outline: 3px solid #b3261e; outline-offset: 2px; }

/* Pill buttons used for tabs and filters. */
.jfs-p .jfs-pill {
	font: inherit; font-size: 15px; font-weight: 700; min-height: 46px; padding: 0 18px; border-radius: 999px; cursor: pointer;
	background: #ffffff; color: #1b2430; border: 1px solid #c9d2dc;
}
.jfs-p .jfs-pill[aria-selected="true"],
.jfs-p .jfs-pill[aria-pressed="true"] { background: #14324f; color: #ffffff; border-color: #14324f; }
.jfs-p .jfs-pill:hover { border-color: #14324f; }
/* Screen-reader-only text (don't rely on the parent theme for it). */
.jfs-p .screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
