/* ==========================================================================
   Cyara 2026 — Marketo forms ([cy26_marketo], inc/cy26/event.php)
   marketo.js disables Marketo's stylesheets and inline widths; this restyles the
   form for a dark card (event register section). Two columns from 640px:
   paired fields side by side, long blocks (legal text, checkbox, button) full width.
   The theme sets html { font-size: 10px }: px only.
   ========================================================================== */

.cy26-mkto {
	--cy26-mkto-fg: color-mix(in oklab, var(--cy26-white) 85%, transparent);
	--cy26-mkto-muted: color-mix(in oklab, var(--cy26-white) 60%, transparent);
	--cy26-mkto-border: oklch(0.72 0.02 260);
	font-family: var(--cy26-font);
	color: var(--cy26-white);
}
.cy26-mkto *,
.cy26-mkto *::before,
.cy26-mkto *::after { box-sizing: border-box; }

.cy26-mkto .cy26-mkto__status {
	margin: 0;
	padding: 24px 0;
	color: var(--cy26-mkto-muted);
	font-size: 14px;
	line-height: 20px;
	text-align: center;
}
.cy26-mkto .cy26-mkto__status[hidden] { display: none; }

/* Hidden until marketo.js has removed Marketo's own styling (no flash of the default theme). */
.cy26-mkto .mktoForm:not(.is-ready) { visibility: hidden; height: 0; overflow: hidden; }

/* The theme's style.css styles every .mktoForm with !important (Roboto, 50px inputs, rounded 20px button,
   padding 0 on everything): the rules below win with higher specificity and !important where it does. */
.cy26-mkto .mktoForm {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	/* No row gap: Marketo adds empty items (placeholders for conditional fields, reCAPTCHA wrappers)
	   that would each add one. Fields carry their own bottom margin instead. */
	column-gap: 20px;
	width: auto !important;
	margin: 0;
	padding: 0 !important;
	font-size: 14px;
	line-height: 20px;
	color: inherit;
}
.cy26-mkto .mktoForm * { font-family: var(--cy26-font) !important; }
@media (min-width: 640px) {
	.cy26-mkto .mktoForm { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.cy26-mkto .mktoForm .mktoFormRow { display: contents; }
.cy26-mkto .mktoForm :is(.mktoOffset, .mktoGutter, .mktoClear, .mktoInstruction:empty) { display: none !important; }
.cy26-mkto .mktoForm .mktoFormRow .mktoFormCol {
	width: auto !important;
	min-width: 0;
	margin: 0 0 20px !important;
	padding: 0 !important;
	float: none;
}
/* Full-width rows: legal text, checkbox, submit. */
.cy26-mkto .mktoForm .mktoFormRow .mktoFormCol:has(.mktoHtmlText),
.cy26-mkto .mktoForm .mktoFormRow .mktoFormCol:has(input[type="checkbox"]),
.cy26-mkto .mktoForm .mktoButtonRow { grid-column: 1 / -1; }

.cy26-mkto .mktoForm .mktoFieldWrap {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	float: none;
	width: 100% !important;
}

/* Labels: "First Name *" */
.cy26-mkto .mktoForm .mktoLabel {
	display: flex !important;
	align-items: baseline;
	gap: 4px;
	width: auto !important;
	margin: 0;
	float: none;
	color: var(--cy26-mkto-fg) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 14px;
}
.cy26-mkto .mktoForm .mktoAsterix { display: none; order: 2; float: none; color: inherit; }
.cy26-mkto .mktoForm .mktoRequiredField .mktoAsterix { display: inline; }

/* Inputs */
.cy26-mkto .mktoForm :is(input.mktoField:not([type="checkbox"]):not([type="radio"]), select.mktoField, textarea.mktoField) {
	width: 100% !important;
	height: 36px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 4px 12px !important;
	float: none;
	border: 1px solid var(--cy26-mkto-border) !important;
	border-radius: var(--cy26-radius) !important;
	background-color: transparent !important;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important;
	color: var(--cy26-white) !important;
	font-size: 14px !important;
	line-height: 20px !important;
	outline: none;
	transition: border-color 0.15s, box-shadow 0.15s;
	-webkit-appearance: none;
	appearance: none;
}
/* 16px on phones: iOS Safari zooms into fields under 16px (design input: text-base md:text-sm). */
@media (max-width: 767px) {
	.cy26-mkto .mktoForm :is(input.mktoField:not([type="checkbox"]):not([type="radio"]), select.mktoField, textarea.mktoField) { font-size: 16px !important; }
}
.cy26-mkto .mktoForm textarea.mktoField { height: auto !important; min-height: 96px !important; }
.cy26-mkto .mktoForm select.mktoField {
	padding-right: 36px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' opacity='.7'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-position: right 12px center;
	background-size: 16px;
	background-repeat: no-repeat;
}
.cy26-mkto .mktoForm select.mktoField option { background: var(--cy26-navy); color: var(--cy26-white); }
.cy26-mkto .mktoForm .mktoField::placeholder { color: var(--cy26-mkto-muted) !important; }
.cy26-mkto .mktoForm .mktoField:focus-visible {
	border-color: var(--cy26-ring) !important;
	box-shadow: 0 0 0 3px color-mix(in oklab, var(--cy26-ring) 50%, transparent) !important;
}
.cy26-mkto .mktoForm .mktoField.mktoInvalid { border-color: var(--cy26-coral) !important; }

/* Legal text (Marketo rich text block) */
.cy26-mkto .mktoForm .mktoHtmlText {
	width: auto !important;
	color: var(--cy26-mkto-muted);
	font-size: 12px;
	line-height: 18px;
}
.cy26-mkto .mktoForm .mktoHtmlText :is(p, div) { margin: 0; font-size: inherit; line-height: inherit; color: inherit; }
.cy26-mkto .mktoForm .mktoHtmlText p + p { margin-top: 8px; }
.cy26-mkto .mktoForm .mktoHtmlText a { color: var(--cy26-white); text-decoration: underline; text-underline-offset: 2px; }

/* Single checkbox (opt-in): the field label holds the text; the box sits before it. */
.cy26-mkto .mktoForm .mktoFieldWrap:has(.mktoCheckboxList) {
	flex-direction: row-reverse;
	justify-content: flex-end;
	align-items: flex-start;
	gap: 12px;
}
.cy26-mkto .mktoForm .mktoFieldWrap:has(.mktoCheckboxList) > .mktoLabel {
	display: block !important;
	color: color-mix(in oklab, var(--cy26-white) 75%, transparent) !important;
	font-weight: 400 !important;
	line-height: 20px;
	cursor: pointer;
}
.cy26-mkto .mktoForm .mktoCheckboxList {
	display: flex;
	flex: none;
	width: auto !important;
	float: none;
}
.cy26-mkto .mktoForm .mktoCheckboxList > label:empty { display: none; }
.cy26-mkto .mktoForm .mktoCheckboxList > input[type="checkbox"] {
	flex: none;
	width: 16px !important;
	height: 16px !important;
	min-height: 0 !important;
	margin: 2px 0 0 !important;
	padding: 0 !important;
	border-radius: 4px !important;
	accent-color: var(--cy26-cta);
	cursor: pointer;
}

/* Errors: under the field instead of Marketo's floating tooltip */
.cy26-mkto .mktoForm .mktoError {
	position: static !important;
	inset: auto !important;
	margin: 0;
	padding: 0;
}
.cy26-mkto .mktoForm .mktoErrorArrowWrap { display: none; }
.cy26-mkto .mktoForm .mktoErrorMsg {
	max-width: none;
	margin: 0;
	border: 0;
	background: none;
	box-shadow: none;
	color: var(--cy26-coral);
	font-size: 12px;
	font-weight: 600;
	line-height: 16px;
	text-shadow: none;
}
.cy26-mkto .mktoForm .mktoErrorMsg .mktoErrorDetail { display: inline; }

/* Submit, then Marketo's reCAPTCHA notice under it */
.cy26-mkto .mktoForm .mktoButtonRow { order: 1; margin-top: 8px; text-align: left !important; }
.cy26-mkto .mktoForm .mktoPlaceholder:empty { display: none; }
.cy26-mkto .mktoForm .mktoCaptchaDisclaimer {
	order: 2;
	grid-column: 1 / -1;
	margin-top: 16px;
	color: color-mix(in oklab, var(--cy26-white) 55%, transparent);
	font-size: 12px;
	line-height: 16px;
	text-align: center;
}
.cy26-mkto .mktoForm .mktoButtonWrap { display: block; margin: 0 !important; }
.cy26-mkto .mktoForm button.mktoButton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100% !important;
	min-height: 44px;
	padding: 12px 20px !important;
	border: 0 !important;
	border-radius: var(--cy26-radius) !important;
	background: var(--cy26-cta) !important;
	box-shadow: 0 10px 28px color-mix(in oklab, var(--cy26-primary) 25%, transparent) !important;
	color: var(--cy26-on-cta) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 20px;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-decoration: none !important;
	cursor: pointer;
	transition: background-color 0.2s;
}
.cy26-mkto .mktoForm button.mktoButton::after {
	content: "";
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
.cy26-mkto .mktoForm button.mktoButton:hover { background: var(--cy26-cta-strong) !important; }
.cy26-mkto .mktoForm button.mktoButton:focus-visible { outline: 2px solid var(--cy26-ring); outline-offset: 2px; }
.cy26-mkto .mktoForm button.mktoButton[disabled] { opacity: 0.7; cursor: progress; }

/* Inline thank-you: .cy26-mkto-scope gets .is-registered after a successful submission. */
.cy26-mkto-done { display: none !important; }
.cy26-mkto-scope.is-registered .cy26-mkto-done { display: block !important; }
.cy26-mkto-scope.is-registered .cy26-mkto-hide-on-done { display: none !important; }
