/**
 * EventKoi frontend submission form.
 *
 * Theme-native: no card wrapper, no plugin border. Just stacked fields
 * that flow with the surrounding theme content. Inherits theme typography
 * + tries to honour `--wp--preset--color--primary` for the CTA, falling
 * back to currentColor.
 */
.eventkoi-submission {
	--ek-fg: currentColor;
	--ek-accent: var(--wp--preset--color--primary, currentColor);
	--ek-radius: 6px;
	--ek-gap: 1.1rem;

	margin: 0 0 1.5em;
	font: inherit;
	color: inherit;
}

.eventkoi-submission *,
.eventkoi-submission *::before,
.eventkoi-submission *::after {
	box-sizing: border-box;
}

/* Reset our own form fields only — never touch TinyMCE/WP Component chrome */
.eventkoi-submission__field input,
.eventkoi-submission__field select,
.eventkoi-submission__field textarea,
.eventkoi-submission__rec__num,
.eventkoi-submission__rec__select {
	font: inherit;
	font-size: 0.95rem;
	line-height: 1.4;
	color: inherit;
	margin: 0;
}

.eventkoi-submission__submit,
.eventkoi-submission__picker__trigger,
.eventkoi-submission__cal__nav,
.eventkoi-submission__cal__day,
.eventkoi-submission__image__dropzone,
.eventkoi-submission__image__clear {
	font: inherit;
	font-size: 0.95rem;
	line-height: 1.4;
	margin: 0;
}

.eventkoi-submission__field select {
	min-height: 40px;
	padding: 0.5rem 2rem 0.5rem 0.75rem;
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: var(--ek-radius);
	background: transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'><path d='M4 6l4 4 4-4'/></svg>") no-repeat right 0.6rem center;
	background-size: 14px;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	max-width: 100%;
}

.eventkoi-submission--form .eventkoi-submission__form {
	display: grid;
	gap: var(--ek-gap);
}

.eventkoi-submission__field {
	display: grid;
	gap: 0.4rem;
	margin: 0;
	min-width: 0;
}

.eventkoi-submission__field > * {
	min-width: 0;
	max-width: 100%;
}

.eventkoi-submission__field > label {
	font-size: 0.92rem;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	color: inherit;
}

.eventkoi-submission__hint {
	margin: 0;
	font-size: 0.82rem;
	opacity: 0.65;
}

.eventkoi-submission__required {
	color: #d63638;
	font-weight: 500;
}

.eventkoi-submission__field input[type="text"],
.eventkoi-submission__field input[type="email"],
.eventkoi-submission__field input[type="url"],
.eventkoi-submission__field input[type="date"],
.eventkoi-submission__field input[type="time"],
.eventkoi-submission__field input[type="number"],
.eventkoi-submission__field textarea,
.eventkoi-submission__picker__trigger,
.eventkoi-submission__rec__num,
.eventkoi-submission__rec__select,
.eventkoi-submission__select {
	width: 100%;
	min-height: 40px;
	max-width: 100%;
	padding: 0.5rem 0.75rem;
	font: inherit;
	font-size: 0.95rem;
	line-height: 1.4;
	color: inherit;
	background: transparent;
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: var(--ek-radius);
	outline: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	transition: border-color 120ms ease, box-shadow 120ms ease;
}

.eventkoi-submission__select {
	background: transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='currentColor'><path d='M4 6l4 4 4-4'/></svg>") no-repeat right 0.6rem center;
	background-size: 14px;
	padding-right: 2rem;
	cursor: pointer;
}

.eventkoi-submission__field input::placeholder,
.eventkoi-submission__field textarea::placeholder {
	opacity: 0.5;
	color: inherit;
}

.eventkoi-submission__field input:hover,
.eventkoi-submission__field textarea:hover,
.eventkoi-submission__picker__trigger:hover {
	border-color: rgba(0, 0, 0, 0.35);
}

.eventkoi-submission__field input:focus,
.eventkoi-submission__field textarea:focus,
.eventkoi-submission__picker__trigger:focus {
	border-color: var(--ek-accent);
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
}

/* Per-field error state */
.eventkoi-submission__field--invalid input,
.eventkoi-submission__field--invalid textarea,
.eventkoi-submission__field--invalid .eventkoi-submission__picker__trigger,
.eventkoi-submission__field--invalid .eventkoi-submission__image__dropzone {
	border-color: #d63638 !important;
	box-shadow: 0 0 0 3px rgba(214, 54, 56, 0.15);
}

.eventkoi-submission__field--invalid > label {
	color: #b32d2e;
}

.eventkoi-submission__field--disabled {
	opacity: 0.45;
	pointer-events: none;
}
.eventkoi-submission__field--disabled .eventkoi-submission__picker__trigger,
.eventkoi-submission__field--disabled input,
.eventkoi-submission__field--disabled button {
	cursor: not-allowed !important;
}

.eventkoi-submission__field__error {
	margin: 0;
	font-size: 0.82rem;
	color: #b32d2e;
	display: none;
}

.eventkoi-submission__field--invalid .eventkoi-submission__field__error {
	display: block;
}

.eventkoi-submission__field textarea {
	min-height: 88px;
	resize: vertical;
}

.eventkoi-submission__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ek-gap);
	align-items: start;
}
.eventkoi-submission__row > .eventkoi-submission__field {
	grid-auto-rows: min-content;
	align-content: start;
}

@media (max-width: 540px) {
	.eventkoi-submission__row { grid-template-columns: 1fr; }
}

/* Date/time popover button (no native pickers) */
.eventkoi-submission__picker {
	position: relative;
}

.eventkoi-submission__picker__trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	text-align: left;
	cursor: pointer;
}

.eventkoi-submission__picker__trigger > svg {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	opacity: 0.7;
}

.eventkoi-submission__picker__trigger > span {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.eventkoi-submission__picker__trigger[data-empty="1"] > span {
	opacity: 0.55;
}

.eventkoi-submission__picker__pop {
	position: absolute;
	z-index: 50;
	top: calc(100% + 6px);
	left: 0;
	min-width: 288px;
	padding: 0.75rem;
	background: #fff;
	color: #1a1a1a;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 8px;
	box-shadow: 0 16px 40px -16px rgba(0, 0, 0, 0.25), 0 4px 12px rgba(0, 0, 0, 0.06);
	display: none;
}

.eventkoi-submission__picker.is-open .eventkoi-submission__picker__pop {
	display: block;
}

.eventkoi-submission__cal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.25rem;
	margin-bottom: 0.5rem;
}

.eventkoi-submission__cal__title {
	flex: 1 1 auto;
	text-align: center;
	font-size: 0.95rem;
	font-weight: 600;
}

.eventkoi-submission__cal__nav {
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	color: inherit;
	cursor: pointer;
	font: inherit;
	font-size: 1.1rem;
	line-height: 1;
}

.eventkoi-submission__cal__nav:hover {
	background: rgba(0, 0, 0, 0.05);
}

.eventkoi-submission__cal__grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
}

.eventkoi-submission__cal__dow {
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	opacity: 0.6;
	text-align: center;
	padding: 0.35rem 0;
	text-transform: uppercase;
}

.eventkoi-submission__cal__day {
	height: 34px;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font: inherit;
	font-size: 0.88rem;
	color: inherit;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	cursor: pointer;
}

.eventkoi-submission__cal__day:hover {
	background: rgba(0, 0, 0, 0.06);
}

.eventkoi-submission__cal__day[data-other-month="1"] {
	opacity: 0.35;
}

.eventkoi-submission__cal__day[data-today="1"] {
	font-weight: 700;
}

.eventkoi-submission__cal__day[aria-pressed="true"] {
	background: #111 !important;
	color: #fff !important;
	border-color: #111 !important;
}
.eventkoi-submission[data-has-accent="1"] .eventkoi-submission__cal__day[aria-pressed="true"] {
	background: var(--ek-accent) !important;
	border-color: var(--ek-accent) !important;
	color: #fff !important;
}

.eventkoi-submission__time {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 0.6rem;
	padding-top: 0.6rem;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.eventkoi-submission__time select {
	flex: 1 1 auto;
	min-height: 36px;
	padding: 0.35rem 0.5rem;
	font: inherit;
	font-size: 0.9rem;
	color: inherit;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
}

.eventkoi-submission__time__sep {
	opacity: 0.6;
	font-weight: 600;
}

/* All-day toggle */
.eventkoi-submission__field--inline > label {
	display: inline-flex;
	align-items: center;
	gap: 0.55em;
	font-weight: 500;
	cursor: pointer;
}

.eventkoi-submission__field--inline input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--ek-accent);
}

/* Featured image upload */
.eventkoi-submission__image {
	display: grid;
	gap: 0.6rem;
}

.eventkoi-submission__image__dropzone {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 80px;
	padding: 0.85rem 1rem;
	text-align: center;
	border: 1.5px dashed rgba(0, 0, 0, 0.18);
	border-radius: var(--ek-radius);
	cursor: pointer;
	font: inherit;
	font-size: 0.88rem;
	color: inherit;
	background: transparent;
	opacity: 0.8;
	transition: border-color 120ms ease, background 120ms ease, opacity 120ms ease;
}

.eventkoi-submission__image__dropzone:hover {
	border-color: rgba(0, 0, 0, 0.4);
	opacity: 1;
	background: rgba(0, 0, 0, 0.02);
}

.eventkoi-submission__image__dropzone::before {
	content: "";
	width: 18px;
	height: 18px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='5' width='18' height='14' rx='2'/><circle cx='8.5' cy='10.5' r='1.5'/><path d='M21 17l-5-5L5 21'/></svg>") center/contain no-repeat;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='5' width='18' height='14' rx='2'/><circle cx='8.5' cy='10.5' r='1.5'/><path d='M21 17l-5-5L5 21'/></svg>") center/contain no-repeat;
	opacity: 0.7;
}

.eventkoi-submission__image__dropzone--dragging {
	border-color: var(--ek-accent);
	background: rgba(0, 0, 0, 0.03);
	opacity: 1;
}

.eventkoi-submission__image__preview {
	position: relative;
	display: inline-block;
	max-width: 100%;
}

.eventkoi-submission [hidden] {
	display: none !important;
}

.eventkoi-submission__image__preview img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: var(--ek-radius);
}

.eventkoi-submission__image__clear {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 28px;
	height: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.65);
	color: #fff;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	font: inherit;
	font-size: 1rem;
	line-height: 1;
}

/* Submit CTA — bold, theme-aware, never default-greyed */
.eventkoi-submission__actions {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0.25rem 0 0;
}

.eventkoi-submission__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	min-height: 46px;
	padding: 0.65rem 1.5rem;
	font: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	color: #fff;
	background: #111;
	border: 1px solid #111;
	border-radius: var(--ek-radius);
	cursor: pointer;
	transition: background 120ms ease, transform 120ms ease, box-shadow 120ms ease;
	-webkit-appearance: none;
	appearance: none;
}

/* Honor theme primary if it's actually a color (not currentColor fallback). */
.eventkoi-submission[data-has-accent="1"] .eventkoi-submission__submit {
	background: var(--ek-accent);
	border-color: var(--ek-accent);
}

.eventkoi-submission__submit:hover { filter: brightness(1.1); }
.eventkoi-submission__submit:active { transform: translateY(1px); }
.eventkoi-submission__submit:focus-visible {
	outline: 2px solid var(--ek-accent);
	outline-offset: 2px;
}

.eventkoi-submission__form[aria-busy="true"] .eventkoi-submission__submit {
	opacity: 0.7;
	cursor: progress;
}

/* Notice / response area */
.eventkoi-submission__notice {
	margin: 0;
	padding: 0;
	font-size: 0.9rem;
}

.eventkoi-submission__notice:empty { display: none; }

.eventkoi-submission__notice--error,
.eventkoi-submission__notice--success {
	padding: 0.65rem 0.85rem;
	border-radius: var(--ek-radius);
	border: 1px solid currentColor;
}

.eventkoi-submission__notice--error {
	color: #b32d2e;
	border-color: rgba(179, 45, 46, 0.3);
	background: rgba(179, 45, 46, 0.06);
}

.eventkoi-submission__notice--success {
	color: #1f7a32;
	border-color: rgba(31, 122, 50, 0.3);
	background: rgba(31, 122, 50, 0.06);
}

/* ---------- Recurring section ---------- */
.eventkoi-submission__rec__panel {
	display: grid;
	gap: 0.95rem;
	padding: 1rem;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: var(--ek-radius);
	background: rgba(0, 0, 0, 0.012);
}

.eventkoi-submission__rec__group {
	display: grid;
	gap: 0.45rem;
}

.eventkoi-submission__rec__group__label {
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	opacity: 0.7;
}

.eventkoi-submission__rec__row,
.eventkoi-submission__rec__ends {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.eventkoi-submission__rec__inline-label {
	font-size: 0.9rem;
	opacity: 0.75;
}

.eventkoi-submission__rec__num {
	width: 76px;
	min-height: 38px;
	padding: 0.4rem 0.55rem;
	font: inherit;
	font-variant-numeric: tabular-nums;
	color: inherit;
	background: var(--ek-bg, transparent);
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: var(--ek-radius);
	-webkit-appearance: none;
	appearance: none;
}

.eventkoi-submission__rec__num:focus {
	border-color: var(--ek-accent);
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
	outline: none;
}

.eventkoi-submission__rec__select {
	min-height: 38px;
	width: auto;
	padding-right: 2rem;
}

.eventkoi-submission__rec__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}

.eventkoi-submission__rec__chip {
	cursor: pointer;
	margin: 0;
}

.eventkoi-submission__rec__chip input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.eventkoi-submission__rec__chip span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 34px;
	padding: 0 0.75rem;
	font-size: 0.82rem;
	font-weight: 600;
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: 999px;
	background: transparent;
	color: inherit;
	transition: background 120ms ease, border-color 120ms ease, color 120ms ease, transform 80ms ease;
}

.eventkoi-submission__rec__chip:hover span {
	border-color: rgba(0, 0, 0, 0.35);
}

.eventkoi-submission__rec__chip input:checked + span {
	background: #111 !important;
	color: #fff !important;
	border-color: #111 !important;
}

.eventkoi-submission[data-has-accent="1"] .eventkoi-submission__rec__chip input:checked + span {
	background: var(--ek-accent) !important;
	border-color: var(--ek-accent) !important;
	color: #fff !important;
}

.eventkoi-submission__rec__chip input:focus-visible + span {
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12);
}

.eventkoi-submission__rec__ends__opt {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.eventkoi-submission__rec__picker {
	min-width: 200px;
}

.eventkoi-submission__rec__summary {
	margin: 0;
	padding: 0.5rem 0.7rem;
	font-size: 0.85rem;
	background: rgba(0, 0, 0, 0.03);
	border-radius: var(--ek-radius);
	color: inherit;
	opacity: 0.85;
}

.eventkoi-submission__rec__summary:empty {
	display: none;
}

/* TinyMCE toolbar polish — keep buttons uniform height, single-row, aligned */
.eventkoi-submission .mce-tinymce {
	border: 1px solid rgba(0, 0, 0, 0.18) !important;
	border-radius: var(--ek-radius) !important;
	overflow: hidden;
	box-shadow: none !important;
}
/* Toolbar group becomes a single horizontally-scrolling row */
.eventkoi-submission .mce-toolbar-grp {
	background: rgba(0, 0, 0, 0.025) !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
	padding: 4px 6px !important;
	overflow-x: auto !important;
	overflow-y: hidden !important;
	scrollbar-width: thin; /* Firefox: visible but thin */
}
.eventkoi-submission .mce-toolbar-grp::-webkit-scrollbar {
	height: 6px;
}
.eventkoi-submission .mce-toolbar-grp::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.25);
	border-radius: 3px;
}
.eventkoi-submission .mce-toolbar-grp::-webkit-scrollbar-track {
	background: transparent;
}
.eventkoi-submission .mce-toolbar-grp .mce-container-body,
.eventkoi-submission .mce-toolbar-grp .mce-toolbar,
.eventkoi-submission .mce-toolbar-grp .mce-stack-layout,
.eventkoi-submission .mce-toolbar-grp .mce-stack-layout-item {
	display: flex !important;
	flex-wrap: nowrap !important;
	white-space: nowrap !important;
	min-width: max-content !important;
}
.eventkoi-submission .mce-toolbar .mce-btn-group {
	padding: 0 6px !important;
	border: 0 !important;
	display: inline-flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	position: relative;
}
/* Vertical separator between toolbar groups */
.eventkoi-submission .mce-toolbar .mce-btn-group + .mce-btn-group {
	margin-left: 6px !important;
	border-left: 1px solid rgba(0, 0, 0, 0.28) !important;
	padding-left: 10px !important;
}
.eventkoi-submission .mce-toolbar .mce-btn-group .mce-btn {
	margin: 0 2px !important;
	height: 28px !important;
	box-sizing: border-box;
	border-radius: 4px !important;
	border: 0 !important;
	background: transparent !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.eventkoi-submission .mce-btn button {
	height: 28px !important;
	padding: 0 8px !important;
	font-size: 13px !important;
	font-family: inherit !important;
	color: inherit !important;
	background: transparent !important;
	border: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 4px;
}
.eventkoi-submission .mce-btn:hover,
.eventkoi-submission .mce-btn.mce-active {
	background: rgba(0, 0, 0, 0.08) !important;
	color: inherit !important;
}
.eventkoi-submission .mce-btn.mce-active button,
.eventkoi-submission .mce-btn.mce-active .mce-txt,
.eventkoi-submission .mce-btn.mce-active .mce-ico {
	color: #111 !important;
	background: transparent !important;
}
.eventkoi-submission .mce-btn .mce-ico {
	font-size: 16px !important;
	line-height: 1 !important;
	width: 16px !important;
	height: 16px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.eventkoi-submission .mce-btn-has-text .mce-txt {
	font-size: 13px !important;
	line-height: 1 !important;
	font-weight: 600 !important;
	margin: 0 !important;
	display: inline-block;
}
.eventkoi-submission .mce-edit-area {
	border: 0 !important;
}
.eventkoi-submission .mce-statusbar {
	display: none !important;
}

/* The RichTextEditor's video embed Modal renders with native
 * @wordpress/components styles (Gutenberg-default look). Most things are
 * fine as-is; these two bits use raw HTML (not wp-components) and pick
 * up theme typography on the frontend — bring them back to Gutenberg
 * proportions. */
.eventkoi-video-embed-modal form > .mt-6,
.eventkoi-video-embed-modal form > [class*="HStack"] {
	margin-top: 20px;
}
/* "Width" <strong> heading + "px" <span> are raw inline elements — pull
 * them down to Gutenberg label size on the frontend. */
.eventkoi-video-embed-modal form > div > strong {
	font-size: 11px !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.05em !important;
	color: rgba(0, 0, 0, 0.7) !important;
	margin: 0 0 8px !important;
	display: block !important;
}
.eventkoi-video-embed-modal form > div > div > span {
	font-size: 13px !important;
	color: rgba(0, 0, 0, 0.75) !important;
	line-height: 1.4 !important;
}
/* "Custom" / "Full width" radio labels (raw <label> + <input type="radio">) */
.eventkoi-video-embed-modal form > div > label {
	font-size: 13px !important;
	line-height: 1.4 !important;
}
.eventkoi-video-embed-modal form > div > label input[type="radio"] {
	width: 16px;
	height: 16px;
	margin: 0;
}
/* The width-in-pixels <input type="number"> */
.eventkoi-video-embed-modal form input[type="number"] {
	min-height: 30px !important;
	padding: 0 8px !important;
	font-size: 13px !important;
	border: 1px solid #949494 !important;
	border-radius: 2px !important;
	background: #fff !important;
	box-shadow: none !important;
}
.eventkoi-video-embed-modal form input[type="number"]:focus {
	border-color: var(--wp-admin-theme-color, #2271b1) !important;
	box-shadow: 0 0 0 1px var(--wp-admin-theme-color, #2271b1) !important;
	outline: none !important;
}

/* Editor preview shown inside Gutenberg block edit view */
.eventkoi-submission__editor-preview {
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: var(--ek-radius);
	overflow: hidden;
	background: var(--ek-bg);
}
.eventkoi-submission__editor-preview__bar {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.4rem 0.6rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	background: rgba(0, 0, 0, 0.025);
	font-size: 0.85rem;
}
.eventkoi-submission__editor-preview__bar span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	padding: 0 0.25rem;
	opacity: 0.65;
}
.eventkoi-submission__editor-preview__body {
	min-height: 120px;
	padding: 0.7rem 0.85rem;
	color: rgba(0, 0, 0, 0.45);
	font-size: 0.95rem;
}

/* Honeypot (hidden from real users, visible to dumb bots) */
.eventkoi-submission__honeypot {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.eventkoi-submission__select:focus {
	border-color: var(--ek-accent);
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
	outline: none;
}

/* Success state — friendly confirmation card. */
.eventkoi-submission__success {
	display: grid;
	gap: 0.5rem;
	justify-items: center;
	text-align: center;
	padding: 2.25rem 1.75rem;
	border: 1px solid rgba(31, 122, 50, 0.2);
	background: linear-gradient(180deg, rgba(31, 122, 50, 0.05) 0%, rgba(31, 122, 50, 0.02) 100%);
	border-radius: var(--ek-radius);
	color: inherit;
}

.eventkoi-submission__success::before {
	content: "";
	display: block;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: #1f7a32 url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='4 12 10 18 20 6'/></svg>") center / 24px 24px no-repeat;
	margin-bottom: 0.25rem;
}

.eventkoi-submission__success__heading {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 600;
	color: inherit;
	line-height: 1.3;
}

.eventkoi-submission__success__message {
	margin: 0;
	color: rgba(0, 0, 0, 0.6);
	max-width: 28rem;
	line-height: 1.5;
}

/* Gated states */
.eventkoi-submission--gated {
	padding: 1rem 0;
}

.eventkoi-submission--gated p { margin: 0; color: inherit; }
.eventkoi-submission--gated a { color: var(--ek-accent); }