/*
 * Whistleblower page (/whistleblower). Loaded by biofuelcircle-whistleblower.php only on pages that
 * carry the `bfc-wb-page` marker. Everything is scoped to `.bfc-wb` so it cannot touch other pages.
 * Brand: green #32a836, navy #001d3e, page background #f7f7f7 (taken from the live site).
 */

/* Title banner: same look as the Privacy Policy banner (that page styles `.privacy-policy h2` inline). */
.bfc-wb-banner {
	padding-top: 50px;
}

.bfc-wb-banner h1 {
	background-color: rgb(50, 168, 54);
	padding-block: 70px;
	margin: 0;
	text-align: center;
	font-size: 40px;
	color: #fff;
	font-family: "Raleway-Bold", "Raleway", sans-serif;
}

.bfc-wb {
	--wb-green: #32a836;
	--wb-green-dark: #23802a;
	--wb-navy: #001d3e;
	--wb-text: #212529;
	--wb-muted: #4b5563;
	--wb-line: #d9dee3;
	--wb-warn-bg: #fff7e0;
	--wb-warn-line: #e0a800;
	color: var(--wb-text);
	max-width: 1100px;
	margin: 0 auto;
	padding: 2.5rem 0 4rem;
	font-size: 1.0625rem;
	line-height: 1.65;
}

.bfc-wb h2 {
	font-family: "Raleway-Bold", "Raleway", sans-serif;
	font-size: clamp(1.5rem, 2.4vw, 1.875rem);
	color: var(--wb-navy);
	margin: 0 0 1rem;
	line-height: 1.25;
}

.bfc-wb h3 {
	font-family: "Raleway-Bold", "Raleway", sans-serif;
	font-size: 1.15rem;
	color: var(--wb-navy);
	margin: 0 0 .5rem;
}

.bfc-wb p {
	margin: 0 0 1rem;
}

.bfc-wb a {
	color: #0b5cad;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.bfc-wb a:focus-visible,
.bfc-wb button:focus-visible,
.bfc-wb input:focus-visible,
.bfc-wb select:focus-visible,
.bfc-wb textarea:focus-visible {
	outline: 3px solid #0b5cad;
	outline-offset: 2px;
}

.bfc-wb-section {
	margin: 0 0 3.5rem;
}

.bfc-wb-section + .bfc-wb-section {
	padding-top: 2.5rem;
	border-top: 1px solid var(--wb-line);
}

.bfc-wb-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Policy block */
.bfc-wb-policy {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 260px;
	gap: 2.5rem;
	align-items: start;
}

.bfc-wb-cover {
	display: block;
	border: 1px solid var(--wb-line);
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 6px 20px rgba(0, 29, 62, .12);
	transition: transform .2s ease, box-shadow .2s ease;
}

.bfc-wb-cover:hover,
.bfc-wb-cover:focus-visible {
	transform: translateY(-3px);
	box-shadow: 0 10px 26px rgba(0, 29, 62, .18);
}

.bfc-wb-cover img {
	display: block;
	width: 100%;
	height: auto;
}

.bfc-wb-meta {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 1.25rem 0;
	padding: 0;
}

.bfc-wb-meta li {
	background: #fff;
	border: 1px solid var(--wb-line);
	border-radius: 999px;
	padding: .2rem .85rem;
	font-size: .9rem;
	color: var(--wb-muted);
}

.bfc-wb-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

.bfc-wb a.bfc-wb-btn,
.bfc-wb .gform_button {
	display: inline-block;
	background: var(--wb-green-dark);
	color: #fff;
	border: 2px solid var(--wb-green-dark);
	border-radius: 40px;
	padding: .8rem 1.6rem;
	font-family: "Raleway-Medium", "Raleway", sans-serif;
	font-size: 1rem;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}

.bfc-wb a.bfc-wb-btn:hover,
.bfc-wb a.bfc-wb-btn:focus-visible,
.bfc-wb .gform_button:hover,
.bfc-wb .gform_button:focus-visible {
	background: var(--wb-navy);
	border-color: var(--wb-navy);
	color: #fff;
}

.bfc-wb a.bfc-wb-btn-ghost {
	background: transparent;
	color: var(--wb-green-dark);
}

/* Reporting channels */
.bfc-wb-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
	gap: 1.25rem;
	margin-bottom: 1.25rem;
}

.bfc-wb-card {
	background: #fff;
	border: 1px solid var(--wb-line);
	border-top: 4px solid var(--wb-green);
	border-radius: 8px;
	padding: 1.25rem 1.25rem .5rem;
}

.bfc-wb-card p {
	font-size: .98rem;
}

.bfc-wb-note {
	font-size: .95rem;
	color: var(--wb-muted);
}

/* "Please read" callout: deliberately hard to miss */
.bfc-wb-callout {
	background: var(--wb-warn-bg);
	border: 2px solid var(--wb-warn-line);
	border-left-width: 8px;
	border-radius: 8px;
	padding: 1.1rem 1.4rem 1rem;
	margin: 0 0 1.5rem;
}

.bfc-wb-callout h3 {
	margin-bottom: .6rem;
}

.bfc-wb-callout ul {
	margin: 0;
	padding-left: 1.2rem;
}

.bfc-wb-callout li {
	margin-bottom: .35rem;
	font-size: 1.1rem;
}

/* Form card */
.bfc-wb-form {
	background: #fff;
	border: 1px solid var(--wb-line);
	border-radius: 10px;
	padding: 2rem;
	margin-top: 1.5rem;
	box-shadow: 0 6px 20px rgba(0, 29, 62, .06);
}

.bfc-wb-form .gform_wrapper {
	margin: 0;
}

/* Gravity Forms colours its controls through variables set on the form wrapper (with an ID in the
   selector), so these need !important to win. This swaps its default blue for the site green. */
.bfc-wb .gform_wrapper.gform-theme {
	--gf-color-primary: #23802a !important;
	--gf-color-primary-rgb: 35, 128, 42 !important;
	--gf-color-primary-darker: #001d3e !important;
	--gf-color-primary-lighter: #32a836 !important;
	--gf-color-in-ctrl-primary: #23802a !important;
	--gf-color-in-ctrl-primary-rgb: 35, 128, 42 !important;
	--gf-color-in-ctrl-primary-darker: #001d3e !important;
	--gf-color-in-ctrl-primary-lighter: #32a836 !important;
	--gf-ctrl-btn-radius: 40px !important;
}

.bfc-wb-form .gfield_label,
.bfc-wb-form legend.gfield_label {
	font-family: "Raleway-Bold", "Raleway", sans-serif;
	color: var(--wb-navy);
}

.bfc-wb-form .gfield_description {
	color: var(--wb-muted);
	font-size: .92rem;
}

.bfc-wb-form input[type="text"],
.bfc-wb-form input[type="email"],
.bfc-wb-form input[type="tel"],
.bfc-wb-form select,
.bfc-wb-form textarea {
	border: 1px solid #8a949e;
	border-radius: 6px;
	background: #fff;
	color: var(--wb-text);
}

.bfc-wb-form .gform_footer,
.bfc-wb-form .gform-footer {
	margin-top: 1rem;
}

/* Confirmation with the case reference */
.bfc-wb-thanks {
	text-align: center;
	padding: 1rem 0;
}

.bfc-wb-ref {
	display: inline-block;
	background: #eef8ef;
	border: 2px dashed var(--wb-green);
	border-radius: 8px;
	padding: .6rem 1.4rem;
	font-family: "Raleway-Bold", "Raleway", sans-serif;
	font-size: clamp(1.5rem, 4vw, 2rem);
	letter-spacing: .04em;
	color: var(--wb-navy);
	user-select: all;
}

/* Form-only view shown inside the new website (embed-template.php). The card, heading and text are
   drawn by the parent page, so here the form sits on a transparent background with no frame. */
body.bfc-wb-embed-body {
	margin: 0 !important;
	padding: 0 !important;
	min-height: 0 !important;
	background: transparent !important;
}

.bfc-wb.bfc-wb-embed {
	max-width: none;
	margin: 0;
	padding: 0;
}

.bfc-wb-embed .bfc-wb-form {
	margin: 0;
	padding: 4px;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

/* Cookie banners belong to the parent page, not to the frame. */
body.bfc-wb-embed-body #moove_gdpr_cookie_info_bar,
body.bfc-wb-embed-body #moove_gdpr_cookie_modal,
body.bfc-wb-embed-body #moove_gdpr_save_popup_settings_button {
	display: none !important;
}

/* Validation messages: keep them readable */
.bfc-wb-form .gform_validation_errors,
.bfc-wb-form .gfield_validation_message {
	font-size: .95rem;
}

@media (max-width: 860px) {
	.bfc-wb-policy {
		grid-template-columns: 1fr;
	}

	.bfc-wb-cover {
		max-width: 260px;
		order: -1;
	}

	.bfc-wb-form {
		padding: 1.25rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bfc-wb-cover,
	.bfc-wb a.bfc-wb-btn,
	.bfc-wb .gform_button {
		transition: none;
	}
}
