/* =============================================================================
   Floating Labels — NDIS Form Custom
   Scoped to Gravity Forms wrappers that contain a form.signup-form.
   ============================================================================= */

/* Shorthand for the scoping context used throughout this file:
   .gform_wrapper.gravity-theme:has(form.signup-form)               */

/* Field wrapper */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield {
	position: relative;
}

/* Reposition the GF label as a floating label */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield .gfield_label {
	position: absolute;
	top: 48%;
	left: 17px;
	transform: translateY(-50%);
	font-size: 21px;
	color: #888;
	pointer-events: none;
	transition: top 0.2s ease, font-size 0.2s ease, color 0.2s ease, transform 0.2s ease;
	background: transparent;
	padding: 0 4px;
	margin: 0;
	line-height: 1;
	font-weight: 400;
	z-index: 1;
	white-space: nowrap;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield_error .gfield_label {
	top: 24%;
}

.pp-gravity-form .gform_wrapper .gfield_validation_message, .pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) .validation_message, 
.pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) .gfield_description {

	color: #533FAB;
}

/* Textarea — start label near the top, not vertically centred */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield:has(textarea) .gfield_label {
	top: 18px;
	transform: none;
}


/* Inputs, textareas, selects — top padding so text doesn't clash with floated label */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield textarea,
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield select {
	padding: 20px 12px 6px 12px;
	border-radius: 8px;
	border: 1px solid #9A9BA4;
	background-color: #fff !important;
	font-size: 21px;
	color: #5E606E;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield select {
	padding: 12px;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield--type-select.gfield--has-value select {
	padding: 20px 12px 6px 12px;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield select {
	-webkit-appearance: none;
    background: url(../images/chevron-down.svg) #fff right center no-repeat;
	background-position-x: calc(100% - 16px);
	margin-bottom: 0;
}



.elementor-element.elementor-widget .pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) {
	background-color: #fff;
	padding: 22px 12px 8px 12px;
	border-color: #9A9BA4 !important;
	margin: 0 !important;
}
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield_error select,
.elementor-element.elementor-widget .pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]) {
	border-color:#533FAB !important;
}

/* ── Floated state ─────────────────────────────────────────────────────────── */

/* Focused — JS class + CSS-native :focus-within */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield--focused .gfield_label,
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield:focus-within .gfield_label {
	top: 5px;
	left: 8px;
	transform: none;
	font-size: 16px;
	color: #222538;
}

/* Has value — JS class */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield--has-value .gfield_label,
.gform_wrapper.gform_validation_error.gravity-theme:has(form.signup-form) .gfield .gfield_label {
	top: 5px;
	transform: none;
	font-size: 16px;
	color: #555;
	left: 8px;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield--type-select.gfield--has-value .gfield_label {
	display: block;
}

/* CSS-native: non-empty text inputs and textareas */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not(:placeholder-shown) ~ .gfield_label,
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield textarea:not(:placeholder-shown) ~ .gfield_label {
	top: 6px;
	transform: none;
	font-size: 0.72rem;
	color: #555;
}

/* Selects always float — dropdown always displays text so label can never sit inside */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield:has(select) .gfield_label {
	top: 5px;
	left: 8px;
	transform: none;
	font-size: 16px;
	color: #555;
	display: none;
}

/* Textarea — floated position alignment */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield--focused:has(textarea) .gfield_label,
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield.gfield--has-value:has(textarea) .gfield_label,
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield:focus-within:has(textarea) .gfield_label {
	top: 4px;
}

/* Required asterisk — inherit floated font size */
.gform_wrapper.gravity-theme:has(form.signup-form) .gfield_label .gfield_required {
	font-size: inherit;
}

/* Submit button — align right */
.gform_wrapper.gravity-theme:has(form.signup-form) .gform_footer,
.gform_wrapper.gravity-theme:has(form.signup-form) .gform_page_footer {
	display: flex;
	justify-content: flex-start;
	margin-top: 20px !important;
}

/* =============================================================================
   Validation error messages
   ============================================================================= */

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield_error .validation_message {
	display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 0;
    border: 0;
    background: none;
    line-height: 1.2em;
	margin-top: 8px;
	font-size: 16px;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .gfield_error .validation_message::before {
	content: '';
	display: inline-block;
	flex-shrink: 0;
	width: 1em;
	height: 1em;
	margin-top: 0.15em;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23533FAB' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}

.gform_wrapper.gravity-theme:has(form.signup-form)  .gform_validation_errors{
	padding-inline-start: 33px;
	width: 100%;
	box-sizing: border-box;
	grid-column: 1 / -1;
}

.gform_wrapper.gravity-theme:has(form.signup-form)  .gform_validation_errors:focus{
	outline: 0;
}

.elementor-widget-gbp-gravity-forms{
	/* width:100%; */
}

.gform_wrapper.gravity-theme:has(form.signup-form) h5{
	font-size: 24px !important;
	margin-bottom: 5px;
	margin-top: 0px;
}

.gform_wrapper.gravity-theme:has(form.signup-form) h6{
	font-size: 21px !important;
}

.gform_wrapper.gravity-theme:has(form.signup-form) .top-spacer{
	margin-top: 24px;
}

.gform_wrapper.gravity-theme:has(form.signup-form) h7{
	font-size: 16px;
	font-weight: 500;
	display: block;
	margin-top: 18px;
	margin-bottom: -8px;
}	

span.required{
	color: #E32625;
}


.pp-gravity-form .gform_wrapper:has(form.signup-form) .gform_footer input.button, .pp-gravity-form .gform_wrapper .gform_footer input[type=submit]{
	text-transform: math-auto;
	font-size: 18px;
	width: 100%;
	padding: 16px 25px 16px 25px;
}

footer#colophon{
	display: none;
}

.pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) .gform_validation_errors{
		background-color: #533FAB;
		border: 0;
	}

	.gform_wrapper.gravity-theme:has(form.signup-form) .gform_validation_errors>h2.hide_summary{
		font-weight: 400;
		font-size: 20px;
		line-height: 1.5rem;
	}

/* =============================================================================
   Breakpoints
   desktop  : > 1200px  (no @media needed — base styles above)
   laptop   : 1025px – 1200px
   tablet   : 768px  – 1024px
   mobile   : < 768px
   ============================================================================= */

/* ── Laptop (1025px – 1200px) ─────────────────────────────────────────────── */
@media screen and (min-width: 1200px)  {

	.elementor-element.elementor-widget .pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
		font-size: 21px;
	}
}

.gform_wrapper.gravity-theme:has(form.signup-form) p{
	margin: .4em 0 0 0;
}

/* ── Tablet (768px – 1024px) ──────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1024px) {

	.elementor-element.elementor-widget .pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
		font-size: 21px;
	}
	
}

/* ── Mobile (< 768px) ─────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	.gform_wrapper.gravity-theme:has(form.signup-form) .gfield select {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		padding-right: 50px;
	}

	.gform_wrapper.gravity-theme:has(form.signup-form) .gform_validation_errors>h2.hide_summary{
		line-height: 1.4em;
	}

	.elementor-element.elementor-widget .pp-gravity-form .gform_wrapper.gravity-theme:has(form.signup-form) input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
		font-size: 21px;
	}
}
