/* Forms and Inputs */
.gform_wrapper ::placeholder { color: var(--color-text-black);}
.gform_wrapper :focus::placeholder { opacity: 0.2; font-weight: 500;}

body .gform_wrapper.gravity-theme input[type=email],
body .gform_wrapper.gravity-theme input[type=tel],
body .gform_wrapper.gravity-theme input[type=text] {
	font-size: 1rem;
	line-height: 1.5;
	padding: .5em;
    border: none;
    width: 100%;
    background: #fff;
    box-sizing: border-box;
}

body .gform_wrapper.gravity-theme textarea {
	font-size: 1rem;
	padding: .5em;
    border: none;
    max-height: 160px;
}

body .gform_wrapper.gravity-theme select {
	font-size: 1rem;
	padding: .5em;
    padding-left: calc(.5em - 4px);
    color: var(--color-text-black);
    background: #fff;
    border: none;
    box-sizing: border-box;
    /* Chrome sizes a single <select> from font + padding and ignores
       line-height, so it renders ~2px shorter than the text inputs. Pin its
       height to match instead: inputs = line-height 1.5 (24px) + .5em*2 = 40px. */
    min-height: 40px;
}

/* Gravity Forms bumps text inputs to a 48px touch target under 641px
   (basic.min.css sets line-height:2) but skips <select> — match it here so
   the fields stay the same height on mobile too. */
@media (max-width: 641px) {
	body .gform_wrapper.gravity-theme select {
		min-height: 48px;
	}
}

.ginput_container_consent {
    display: flex;
	line-height: 1.2em;
}

.ginput_container_consent input {
    align-self: flex-start;
    margin-right: 10px;
    margin-top: 0.3em;
}

.gform_wrapper.gravity-theme .gform_footer {
    justify-content: center;
}

/* ---------------------------------------------------------------------------
   Gravity Forms datepicker

   GF 3.0 dropped the old calendar <img> for an icon-font glyph hard-coded to
   #686e77, and parks the toggle button *beside* the input (shortening it to
   calc(100% - 48px)). That left a grey icon sitting on the contact block's
   olive background — invisible — and the date field visibly shorter than its
   siblings. Pull the toggle inside the field and colour it with the theme's
   text black, which reads cleanly on the white input on every background
   option the contact block offers.
--------------------------------------------------------------------------- */

body .gform_wrapper.gravity-theme .gfield--datepicker-default-icon .ginput_container_date,
body .gform_wrapper.gravity-theme .gfield--datepicker-custom-icon .ginput_container_date {
	display: block;
	position: relative;
}

body .gform_wrapper.gravity-theme .gfield--datepicker-default-icon .ginput_container_date input.datepicker_with_icon,
body .gform_wrapper.gravity-theme .gfield--datepicker-custom-icon .ginput_container_date input.datepicker_with_icon {
	width: 100%;
	padding-right: 44px;
}

body .gform_wrapper.gravity-theme .gfield--datepicker-default-icon .ginput_container_date button,
body .gform_wrapper.gravity-theme .gfield--datepicker-custom-icon .ginput_container_date button {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	color: var(--color-text-black);
	cursor: pointer;
	transition: color .3s ease;
}

body .gform_wrapper.gravity-theme .gfield--datepicker-default-icon .ginput_container_date .gform-calendar-icon::before,
body .gform_wrapper.gravity-theme .gfield--datepicker-custom-icon .ginput_container_date .gform-calendar-icon::before {
	color: currentColor;
}

body .gform_wrapper.gravity-theme .gfield--datepicker-default-icon .ginput_container_date button:hover,
body .gform_wrapper.gravity-theme .gfield--datepicker-custom-icon .ginput_container_date button:hover {
	color: var(--color-gold);
}

/* reset.min.css predates :focus-visible and drops a webkit ring on every
   button:focus, mouse clicks included — reset it first, then reinstate a ring
   for keyboard users only. */
body .gform_wrapper.gravity-theme .ginput_container_date button:focus {
	outline: none;
}

body .gform_wrapper.gravity-theme .ginput_container_date button:focus-visible {
	outline: 2px solid var(--color-gold);
	outline-offset: -2px;
}

/* --- Calendar popup ------------------------------------------------------ */
/* GF ships a generic white/blue-grey panel; re-skin it to the Lookout palette
   — cream card, gold accents, square corners to match the buttons and inputs. */

body .gform_wrapper.gravity-theme .gform-datepicker-calendar {
	/* Day cell size drives the whole grid; bumped at sm so the panel still
	   fits inside the form column on a phone. */
	--cal-day-size: 36px;
	--cal-cell-gap: 2px;

	background: var(--color-body-cream);
	border: 1px solid var(--color-gold);
	border-radius: 0;
	box-shadow: 0 10px 30px rgba(60, 68, 29, .18);
	color: var(--color-text-black);
	font-family: inherit;
	font-size: .875rem;
	max-width: 100%;
	padding: 12px;
}

@media (min-width: 576px) {
	body .gform_wrapper.gravity-theme .gform-datepicker-calendar {
		--cal-day-size: 40px;
		--cal-cell-gap: 5px;

		padding: 15px;
	}
}

/* Month / year selectors */
body .gform_wrapper.gravity-theme .gform-datepicker-calendar select {
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%233c441d' d='M1.4 0 6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
	background-position: 100% 50%;
	background-repeat: no-repeat;
	background-size: 12px 8px;
	border: none;
	color: var(--color-text-black);
	font-family: inherit;
	font-size: 1rem;
	letter-spacing: .04em;
	min-height: 0;
	padding: .25em 1.25em .25em 0;
	text-transform: uppercase;
}

/* Prev / next arrows */
body .gform_wrapper.gravity-theme .gform-datepicker-calendar .nav.prev,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar .nav.next {
	color: var(--color-gold);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar .nav.prev:hover::before,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar .nav.prev:focus::before,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar .nav.next:hover::before,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar .nav.next:focus::before {
	color: var(--color-text-black);
}

/* Grid */
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar td,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar th {
	height: auto;
	padding: var(--cal-cell-gap);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar th span {
	color: var(--color-hero-grey);
	font-size: .75rem;
	height: var(--cal-day-size);
	letter-spacing: .08em;
	text-transform: uppercase;
	width: var(--cal-day-size);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar td span {
	border-radius: 0;
	color: var(--color-text-black);
	height: var(--cal-day-size);
	transition: background-color .2s ease, border-color .2s ease, color .2s ease;
	width: var(--cal-day-size);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar td span:hover,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar td span:focus,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar td span:active {
	background: var(--color-gold);
	border-color: var(--color-gold);
	color: var(--color-body-cream);
	outline: 0;
}

/* Today: gold outline only — the filled swatch is reserved for the selection */
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .dayToday span,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .dayToday span:hover,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .dayToday span:focus {
	background: transparent;
	border-color: var(--color-gold);
	box-shadow: none;
	color: var(--color-text-black);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .dayToday span:hover,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .dayToday span:focus {
	background: var(--color-gold);
	color: var(--color-body-cream);
}

/* Selected date */
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .selected span,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .selected span:hover,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .selected span:focus {
	background: var(--color-footer-green);
	border-color: var(--color-footer-green);
	color: var(--color-body-cream);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .disabled span {
	background: transparent;
	border-color: transparent;
	box-shadow: none;
	color: rgba(60, 68, 29, .35);
}

body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .empty span {
	background: transparent;
	border-color: transparent;
}

/* The day cells are the focusable elements (role="button"), so arrow-key
   navigation lands a default blue UA ring on them — swap it for gold, pulled
   in over the cell padding so it hugs the day swatch. */
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar td:focus,
body .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar .nav:focus {
	outline: 2px solid var(--color-gold);
	outline-offset: calc(var(--cal-cell-gap) * -1);
}