/*
Block: Form
Last updated: 09/09/2026
*/

.wp-block-acf-form .edit-form {
    aspect-ratio: 1;
    height: 48px;
    border: 1px solid #1e1e1e;
	color: #1e1e1e;
    border-radius: 2px;
    justify-content: center;
    align-items: center;
    background-color: white;
    position: absolute;
    bottom: calc(100% + 8px);
    right: 0;
    pointer-events: auto !important;
	font-size: 15px;
	display: none;
	z-index: 4;
}

.block-editor-block-list__block.is-selected.wp-block-acf-form .edit-form {
	display: flex;
}

.wp-block-acf-form .edit-form:hover {
	color: var(--wp-admin-theme-color);
}
.wp-block-acf-form .edit-form:focus {
	box-shadow: none;
}
.wp-block-acf-form .edit-form .material-symbols {
    width: 30px;
    height: 32px;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wp-block-acf-form .gfield_required {
	position: relative;
	font-size: 0;
}

.wp-block-acf-form .gfield_required::after {
	content: '*';
    font-size: initial;
    margin-left: .1em;
    color: var(--error-message);
}

.wp-block-acf-form .gfield_required > .gfield_required::after {
	content: none;
}

.wp-block-acf-form .edit-form:focus .material-symbols {
	box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
    outline: 2px solid #0000;
}

:root body .wp-block-acf-form {
	background-color: transparent !important;
	border-width: 0 !important;
	border-radius: 0 !important;
	border-style: none !important;
	color: var(--label-text);
	box-shadow: none !important;
}

.wp-block-acf-form ::placeholder {
	color: var(--placeholder);
}

.wp-block-acf-form legend,
.wp-block-acf-form label:not(.gform-field-label--type-inline):not(.gform-field-label--type-sub) {
	display: block;
}

.wp-block-acf-form .validation_message,
.wp-block-acf-form .gform_submission_error {
	color: var(--error-message);
	font-size: inherit;
}


.wp-block-acf-form {
	--form-gap: 20px;
}

.wp-block-acf-form .gform_heading {
	display: none;
}

.wp-block-acf-form select {
	-webkit-appearance: none;
}

.wp-block-acf-form input,
.wp-block-acf-form select,
.wp-block-acf-form textarea {
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
	display: block;
	width: 100%;
	border: 0;
	border-radius: 0;
	padding: 0;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	padding: calc(var(--padding) * .5) var(--padding);
	background-color: var(--input-background);
	color: var(--input-text);
	border-color: var(--input-border);
	border-width: var(--border-width);
	border-radius: var(--border-radius);
	border-style: solid;
	outline-color: transparent;
	outline-offset: 2px;
	outline-style: solid;
	transition: var(--time);
}

.wp-block-acf-form input:focus,
.wp-block-acf-form select:focus,
.wp-block-acf-form textarea:focus {
	outline-color: var(--focus-outline);
}

.wp-block-acf-form input[disabled],
.wp-block-acf-form select[disabled],
.wp-block-acf-form textarea[disabled] {
	opacity: .4;
}

.wp-block-acf-form select option,
.wp-block-acf-form legend,
.wp-block-acf-form fieldset {
	padding: 0;
    border: 0;
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
}

.wp-block-acf-form .gfield.hidden_label > label,
.wp-block-acf-form .gfield.hidden_label > legend {
	display: none;
}

.wp-block-acf-form .ginput_complex.ginput_container_name,
.wp-block-acf-form .gform_fields {
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12 equal columns */
  gap: var(--form-gap);
}

/* Full width item */
.wp-block-acf-form .gfield {
  grid-column: 1 / -1; /* spans all 12 columns */
}

/* Full width item (100%) */
.wp-block-acf-form .ginput_complex.ginput_container_name.gf_name_has_1 > * {
  grid-column: span 12;
}

/* Half width item (50%) */
.wp-block-acf-form .gfield--width-half,
.wp-block-acf-form .ginput_complex.ginput_container_name.gf_name_has_2 > * {
  grid-column: span 6;
}

/* One third width item (~33.33%) */
.wp-block-acf-form .gfield--width-third,
.wp-block-acf-form .ginput_complex.ginput_container_name.gf_name_has_3 > * {
  grid-column: span 4;
}

/* One quarter width item (25%) */
.wp-block-acf-form .gfield--width-quarter,
.wp-block-acf-form .ginput_complex.ginput_container_name.gf_name_has_4 > * {
  grid-column: span 3;
}

/* Address Left and Right */
.wp-block-acf-form .ginput_complex > * {
	width: 100%;
}
.wp-block-acf-form .ginput_complex .ginput_right,
.wp-block-acf-form .ginput_complex .ginput_left {
	width: calc(50% - (var(--form-gap) / 2));
}

/* Select */

.wp-core-ui .wp-block-acf-form .gform_wrapper select,
.wp-block-acf-form .gform_wrapper select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon points='16.2,7.1 15.1,6.6 10,11.7 4.9,6.6 3.8,7.1 10,13.3' fill='%23000000' /%3E%3C/svg%3E");
	background-position: right calc(var(--padding) / 1.5) top 50%;
	background-size: 20px 20px;
	background-repeat: no-repeat;
	max-width: 100%;
	cursor: pointer;
    padding-right: calc(var(--padding) + 12px);
}

.wp-core-ui .wp-block-acf-form .gform_wrapper select[multiple],
.wp-block-acf-form .gform_wrapper select[multiple] {
	background-image: none !important;
	padding: var(--padding) !important;
	background-color: var(--input-background);
}

/* Checkboxes and radios */

.wp-block-acf-form .gfield-image-choice-wrapper-inner,
.wp-block-acf-form .ginput_container_consent,
.wp-block-acf-form .gchoice {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: calc(var(--form-gap) / 2);
}

.wp-block-acf-form .ginput_container_consent input,
.wp-block-acf-form .ginput_container_consent label,
.wp-block-acf-form .gchoice input,
.wp-block-acf-form .gchoice label {
	cursor: pointer;
}

.wp-block-acf-form input[type=checkbox],
.wp-block-acf-form input[type=radio] {
	-webkit-appearance: none;
	appearance: none;
	width: 1em;
	height: 1em;
	border-width: 1px;
	border-style: solid;
	border-color: color-mix(in srgb, var(--radio-checkbox) 50%, transparent);
	border-radius: 4px;
	padding: 0;
	background-size: .7em;
	background-repeat: no-repeat;
	background-position: center;
}

.wp-block-acf-form .ginput_container_consent:hover input,
.wp-block-acf-form .gchoice:hover input[type=checkbox],
.wp-block-acf-form .gchoice:hover input[type=radio] {
	border-color: var(--radio-checkbox);
}


.wp-block-acf-form input[type="radio" i] {
	margin: 0;
}

.wp-block-acf-form input[type=radio] {
	background-size: 59%;
}

.wp-block-acf-form input[type=radio] {
	border-radius: 50%;
}

/* Buttons */

.wp-block-acf-form .gform_wrapper .ginput_container_consent {
	flex-wrap: nowrap;
	align-items: flex-start;
}

.wp-block-acf-form .gform_wrapper .ginput_container_consent > input[type="checkbox"] {
	flex: 0 0 1em;
	margin: .2em 0 0;
}

.wp-block-acf-form .gform_wrapper .ginput_container_consent > .gfield_consent_label {
	flex: 1 1 0%;
	min-width: 0;
	width: auto;
	margin: 0;
}

.wp-block-acf-form .gform_wrapper .ginput_container_consent > input[type="hidden"] {
	display: none;
}

.wp-block-acf-form .gform_wrapper .gfield_consent_description {
	box-sizing: border-box;
	margin-top: .75rem;
	padding: .75rem 1rem;
	border: .0625rem solid var(--input-border);
	border-radius: var(--border-radius);
	margin-top: 1rem !Important;
}

.wp-block-acf-form button.gform_button,
.wp-block-acf-form .gform_wrapper button.gform_button_select_files,
.wp-block-acf-form .gfield--type-submit button {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	height: auto;
	min-height: 0;
	padding: var(--submit-padding, calc(var(--padding) * .5) var(--padding));
	font: inherit;
	white-space: normal;
	text-decoration: none;
	text-shadow: none;
	box-shadow: none;
	color: var(--submit-text);
	background-color: var(--submit-background);
	border-color: var(--submit-border);
	border-style: solid;
	border-width: var(--submit-border-width, var(--border-width));
	border-radius: var(--submit-border-radius, var(--border-radius));
	cursor: pointer;
	margin-top: 30px;
	transition: var(--time);
}

.wp-block-acf-form .gform_wrapper button.gform_button_select_files {
	margin: 0;
	min-height: 2.75rem;
}

.wp-block-acf-form .gform_wrapper button.gform_button_select_files:focus-visible {
	outline: 2px solid var(--focus-outline);
	outline-offset: 2px;
}

.wp-block-acf-form .gform_wrapper .gform_drop_area {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .75rem;
	width: 100%;
	min-height: 10rem;
	padding: 1.5rem;
	text-align: center;
	background-color: var(--input-background);
	border-color: var(--input-border);
	border-width: var(--border-width);
	border-style: dashed;
	border-radius: var(--border-radius);
}

/* List Field */

.wp-block-acf-form .gfield_list_groups {
	display: flex;
    flex-direction: column;
    gap: .5em;
}

.wp-block-acf-form .gfield--type-list .ginput_list .gfield_list_group {
	display: flex;
}

.wp-block-acf-form .gfield--type-list .ginput_list .gfield_list_group .gfield_list_group_item {
	flex: 1;
}

.wp-block-acf-form .delete_list_item[style*="hidden"] {
	display: none;
}

.wp-block-acf-form .gfield_list_icons.gform-grid-col {
	display: flex;
	gap: 0.5em;
    padding-left: .5em;
}

.wp-block-acf-form button.add_list_item {
	order: 2;
}

.wp-block-acf-form button.add_list_item,
.wp-block-acf-form button.delete_list_item {
	color: transparent;
	font-size: 0px;
	border: 0;
	padding: 0;
	cursor: pointer;
	background-color: transparent;
}

.wp-block-acf-form button.add_list_item::after,
.wp-block-acf-form button.delete_list_item::after {
	font-size: 20px;
	width: 20px;
	height: 20px;
	background-color: var(--radio-checkbox);
	border-radius: 50%;
	color: var(--input-background);
	font-family: var(--mi-style);
	font-variation-settings: 'FILL' var(--mi-fill), 'wght' var(--mi-wght), 'GRAD' var(--mi-grad), 'opsz' var(--mi-opsz);
    display: flex;
    align-items: center;
    justify-content: center;
	outline: 3px solid transparent;
	transition: var(--time);
}

.wp-block-acf-form button.add_list_item:hover::after,
.wp-block-acf-form button.delete_list_item:hover::after {
	outline: 3px solid color-mix(in srgb, var(--radio-checkbox) 50%, transparent);
}

.wp-block-acf-form button.add_list_item::after {
	content: '\e145';
}
.wp-block-acf-form button.delete_list_item::after {
	content: '\e15b';
}

/* Time Field */

.wp-block-acf-form fieldset.gfield.gfield--type-time  > .ginput_container {
	display: flex;
	gap: calc(var(--form-gap) / 2);
	align-items: center;
} 

.wp-block-acf-form fieldset.gfield.gfield--type-time  > .ginput_container > * {
	flex: 1;
}

.wp-block-acf-form fieldset.gfield.gfield--type-time  > .ginput_container > .hour_minute_colon {
	flex: 0;
}

.wp-block-acf-form fieldset.gfield.gfield--type-time input,
.wp-block-acf-form fieldset.gfield.gfield--type-time select {
	min-width: calc(var(--padding) + 3.5em);
}

/* Sublabels */

.wp-block-acf-form .gform-field-label--type-sub {
	font-size: 80%;
	display: block;
}

/* Address Fieldset */

.wp-block-acf-form .ginput_complex.ginput_container_address {
    display: flex;
    flex-wrap: wrap;
    row-gap: calc(var(--form-gap) / 1.5);
    column-gap: var(--form-gap);
}

/* Date Picker (Gravity Forms 3.0+) */

/* Single column grid so the toggle can share the input's row no matter how
   tall the container gets when the calendar opens */

.wp-block-acf-form .ginput_container_date {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	align-items: start;
}

.wp-block-acf-form .ginput_container_date > input,
.wp-block-acf-form .ginput_container_date > button.gform-datepicker-toggle {
	grid-row: 1;
	grid-column: 1;
}

.wp-block-acf-form .ginput_container_date input {
	padding-right: calc(var(--padding) + 1.75rem);
}

/* GF 3.0 renders its own toggle button, so no pseudo icon here.
   Kept at 28px square to meet WCAG 2.5.8 target size. */

.wp-block-acf-form .ginput_container_date > button.gform-datepicker-toggle {
	position: static;
	justify-self: end;
	align-self: center;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	height: 1.75rem;
	margin: 0 calc(var(--padding) / 2) 0 0;
	padding: 0;
	border: 0;
	background-color: transparent;
	color: var(--radio-checkbox);
	line-height: 1;
	cursor: pointer;
	transform: none;
	outline: 2px solid transparent;
	outline-offset: 2px;
	transition: var(--time);
}

.wp-block-acf-form .gform-datepicker-toggle:focus-visible {
	outline-color: var(--focus-outline);
}

/* Drop the theme's inherited button arrow */

.wp-block-acf-form .ginput_container_date > button.gform-datepicker-toggle::before,
.wp-block-acf-form .ginput_container_date > button.gform-datepicker-toggle::after {
	content: none;
	display: none;
}

.wp-block-acf-form .gform-datepicker-toggle .gform-calendar-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1em;
	height: 1em;
	font-size: inherit;
}

.wp-block-acf-form .gform-datepicker-toggle .gform-calendar-icon::before {
	font-size: 1.15em;
	line-height: 1;
}

/* Calendar sits inside the container, so float it clear of the layout */

.wp-block-acf-form .ginput_container_date > .gform-datepicker-calendar {
	position: absolute;
	top: calc(100% + .25rem);
	left: 0;
	width: max-content;
	max-width: none;
}

/* Inside the block it can inherit the block's own colours */

.wp-block-acf-form .gform-datepicker-calendar {
	--dp-bg: var(--input-background);
	--dp-text: var(--input-text);
	--dp-border: var(--input-border);
	--dp-accent: var(--radio-checkbox);
	--dp-radius: var(--border-radius);
	--dp-padding: var(--padding);
}

/* Keyboard hint: respect the hidden attribute, then match the form */

:root body .wp-block-acf-form kbd[hidden] {
	display: none;
}

.wp-block-acf-form kbd {
	font: inherit;
	padding: .25em .5em;
	background-color: var(--input-background);
	color: var(--input-text);
	border-width: var(--border-width);
	border-style: solid;
	border-color: var(--input-border);
	border-radius: var(--border-radius);
}

/* Date Picker calendar popup: rendered outside the block, so it needs its own vars */

.gform-datepicker-calendar {
	--dp-bg: #ffffff;
	--dp-text: #1e1e1e;
	--dp-border: #d2d5db;
	--dp-accent: #808080;
	--dp-radius: 2px;
	--dp-border-width: 1px;
	--dp-padding: .75em;
	z-index: 9999;
	box-sizing: border-box;
	min-width: 19em;
	padding: var(--dp-padding);
	font-size: 1rem;
	line-height: 1.4;
	background-color: var(--dp-bg);
	color: var(--dp-text);
	border-width: var(--dp-border-width);
	border-style: solid;
	border-color: var(--dp-border);
	border-radius: var(--dp-radius);
}

.gform-datepicker-calendar *,
.gform-datepicker-calendar *::before,
.gform-datepicker-calendar *::after {
	box-sizing: border-box;
}

/* The table is role="presentation", so grid layout loses nothing semantically */

.gform-datepicker-calendar table.calendar {
	display: block;
	width: 100%;
	margin: 0;
	border: 0;
}

/* WhatSock outputs year and month as two separate rows. Four columns on the
   tbody plus display: contents on those rows lifts their cells up, so month
   and year sit side by side. Day rows span all four columns and keep their
   own seven column grid. */

.gform-datepicker-calendar table.calendar tbody {
	display: grid;
	grid-template-columns: auto minmax(0, 1.2fr) minmax(0, 1fr) auto;
	align-items: center;
	column-gap: .3em;
	row-gap: .15em;
	width: 100%;
}

.gform-datepicker-calendar tr.yearSelector,
.gform-datepicker-calendar tr.monthSelector {
	display: contents;
}

.gform-datepicker-calendar tr.monthSelector > td.prev {
	grid-row: 1;
	grid-column: 1;
}

.gform-datepicker-calendar tr.monthSelector > td[colspan="5"] {
	grid-row: 1;
	grid-column: 2;
}

.gform-datepicker-calendar tr.yearSelector > td[colspan="5"] {
	grid-row: 1;
	grid-column: 3;
}

.gform-datepicker-calendar tr.monthSelector > td.next {
	grid-row: 1;
	grid-column: 4;
}

/* The year select already covers year stepping, so its arrows are redundant */

.gform-datepicker-calendar tr.yearSelector > td.nav.btn {
	display: none;
}

/* Weekday headings and day rows */

.gform-datepicker-calendar table.calendar tr:not(.yearSelector):not(.monthSelector) {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: repeat(7, minmax(0, 1fr));
	gap: .25em;
	align-items: center;
}

/* Breathing room between the controls and the weekday initials */

.gform-datepicker-calendar tr:has(> th.week) {
	margin-block: 1.1em .35em;
}

.gform-datepicker-calendar table.calendar td,
.gform-datepicker-calendar table.calendar th {
	padding: 0;
	border: 0;
	font-size: inherit;
	text-align: center;
	vertical-align: middle;
}

/* Month arrows, sized to match the selects beside them */

.gform-datepicker-calendar td.nav.btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25em;
	height: 2.25em;
	min-width: 24px;
	min-height: 24px;
	color: var(--dp-accent);
	background-color: var(--dp-bg);
	border-width: var(--dp-border-width);
	border-style: solid;
	border-color: var(--dp-border);
	border-radius: var(--dp-radius);
	cursor: pointer;
	user-select: none;
	transition: background-color .2s;
}

.gform-datepicker-calendar td.nav.btn:hover {
	background-color: color-mix(in srgb, var(--dp-accent) 15%, transparent);
}

.gform-datepicker-calendar td.nav.btn:focus-visible {
	outline: 2px solid var(--dp-accent);
	outline-offset: 1px;
}

/* The library's arrow glyphs sit in an aria-hidden span, so swapping them for
   chevrons changes nothing for assistive technology */

.gform-datepicker-calendar td.nav.btn > span {
	display: none;
}

.gform-datepicker-calendar td.nav.btn::before {
	font-size: 1.4em;
	line-height: 1;
}

.gform-datepicker-calendar td.nav.prev::before {
	content: "\2039";
}

.gform-datepicker-calendar td.nav.next::before {
	content: "\203A";
}

.gform-datepicker-calendar select.nav {
	width: 100%;
	max-width: 100%;
	min-height: 2.25em;
	padding: .3em .5em;
	font: inherit;
	font-weight: 600;
	color: inherit;
	background-color: var(--dp-bg);
	border-width: var(--dp-border-width);
	border-style: solid;
	border-color: var(--dp-border);
	border-radius: var(--dp-radius);
	cursor: pointer;
}

.gform-datepicker-calendar span.nav.btn {
	cursor: pointer;
}

/* Weekday headings */

.gform-datepicker-calendar th.week {
	font-size: .75em;
	font-weight: 600;
	opacity: .6;
}

/* Days */

.gform-datepicker-calendar td.day {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color .2s, color .2s;
}

.gform-datepicker-calendar td.day:hover {
	background-color: color-mix(in srgb, var(--dp-text) 10%, transparent);
}

.gform-datepicker-calendar td.day:focus-visible {
	outline: 2px solid var(--dp-accent);
	outline-offset: 1px;
}

.gform-datepicker-calendar td.dayToday {
	box-shadow: inset 0 0 0 1px var(--dp-accent);
}

.gform-datepicker-calendar td.selected,
.gform-datepicker-calendar td[aria-selected="true"] {
	background-color: var(--dp-accent);
	color: var(--dp-bg);
}

.gform-datepicker-calendar td.empty {
	cursor: default;
}

.gform-datepicker-calendar td[aria-disabled="true"] {
	cursor: default;
	opacity: .35;
}

/* Help text */

.gform-datepicker-calendar .monthMessage p {
	margin: .6em 0 0;
	font-size: .75em;
	opacity: .6;
}

/* Underline style */

.wp-block-acf-form.is-style-underline input,
.wp-block-acf-form.is-style-underline select,
.wp-block-acf-form.is-style-underline textarea {
	border-left: unset !important;
	border-top: unset !important;
	border-right: unset !important;
}

/* Image Choice */

.wp-block-acf-form .gfield--type-image_choice .gfield_radio,
.wp-block-acf-form .gfield--type-image_choice .gfield_checkbox {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	gap: var(--form-gap);
}

.wp-block-acf-form .gfield--type-image_choice .gchoice {
	cursor: pointer;
	flex: 1;
}

.wp-block-acf-form .gfield--type-image_choice .gchoice img {
	max-width: 100%;
	height: auto;
	border-radius: var(--border-radius);
	aspect-ratio: 1;
    object-fit: cover;
}

.wp-block-acf-form .gfield--type-image_choice.col2 .gfield_radio,
.wp-block-acf-form .gfield--type-image_choice.col2 .gfield_checkbox {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wp-block-acf-form .gfield--type-image_choice.col3 .gfield_radio,
.wp-block-acf-form .gfield--type-image_choice.col3 .gfield_checkbox {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wp-block-acf-form .gfield--type-image_choice.col4 .gfield_radio,
.wp-block-acf-form .gfield--type-image_choice.col4 .gfield_checkbox {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.wp-block-acf-form .gform_fileupload_rules {
	font-size: 80%;
}

.wp-block-acf-form__preview[inert] .gform_wrapper {
	display: block !important;
}