/* Skate Terminal Essentials 5.5.23 — Submit Listing Studio UI stabilization. */
body.ste-listing-wizard-active {
	--ste-studio-footer-clearance: calc(126px + env(safe-area-inset-bottom, 0px));
	scroll-padding-bottom: var(--ste-studio-footer-clearance);
}

body.ste-listing-wizard-active .ste-listing-wizard-form,
body.ste-listing-wizard-active .ste-wizard-main,
body.ste-listing-wizard-active .ste-wizard-stage,
body.ste-listing-wizard-active .ste-wizard-step-panel,
body.ste-listing-wizard-active .ste-wizard-step-panel > .form-section,
body.ste-listing-wizard-active .ste-wizard-step-panel > .form-section > .pf-body,
body.ste-listing-wizard-active .ste-wizard-step-panel .form-group,
body.ste-listing-wizard-active .ste-wizard-step-panel .field {
	min-width: 0 !important;
	max-width: 100% !important;
}

body.ste-listing-wizard-active .ste-listing-wizard-form {
	padding-bottom: var(--ste-studio-footer-clearance) !important;
}

body.ste-listing-wizard-active .ste-wizard-actions {
	z-index: 10020;
}

/* Keep all native and enhanced controls inside the visible Studio column. */
body.ste-listing-wizard-active .ste-listing-wizard-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body.ste-listing-wizard-active .ste-listing-wizard-form textarea,
body.ste-listing-wizard-active .ste-listing-wizard-form select,
body.ste-listing-wizard-active .ste-listing-wizard-form .select2,
body.ste-listing-wizard-active .ste-listing-wizard-form .select2-container,
body.ste-listing-wizard-active .ste-listing-wizard-form .select2-selection {
	max-width: 100% !important;
}

/* Schedule activity card header: number, full-width title, stable remove action. */
body.ste-listing-wizard-active .ste-event-builder__item {
	position: relative;
	min-width: 0;
}

body.ste-listing-wizard-active .ste-event-builder__item-head {
	grid-template-columns: 40px minmax(0, 1fr) auto;
	align-items: end;
	width: 100%;
	min-width: 0;
}

body.ste-listing-wizard-active .ste-event-builder__item-head .ste-event-builder__field--title {
	grid-column: 2;
	width: 100% !important;
	min-width: 0 !important;
}

body.ste-listing-wizard-active .ste-event-builder__item-head .ste-event-builder__field--title input {
	display: block;
	width: 100% !important;
	min-width: 0 !important;
}

body.ste-listing-wizard-active .ste-event-builder__item-head .ste-event-builder__remove {
	grid-column: 3;
	align-self: center;
	justify-self: end;
	min-height: 40px;
	padding: 8px 4px;
	white-space: nowrap;
}

body.ste-listing-wizard-active .ste-event-builder__grid,
body.ste-listing-wizard-active .ste-event-builder__point-row,
body.ste-listing-wizard-active .ste-event-builder__distance,
body.ste-listing-wizard-active .ste-event-builder__difficulty {
	min-width: 0;
	max-width: 100%;
}

/* Media fields: connect the upload target and previews into one responsive system. */
body.ste-listing-wizard-active .ste-media-field .file-upload-field {
	display: grid;
	gap: 14px;
	width: 100%;
}

body.ste-listing-wizard-active .ste-media-field .file-upload-field label.upload-file,
body.ste-listing-wizard-active .ste-media-field .file-upload-field .upload-file {
	width: 100%;
	min-height: 150px;
	margin: 0;
	padding: 22px;
	border: 2px dashed #bdc9da;
	border-radius: 18px;
	background: #f8faff;
	box-shadow: none;
}

body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-files,
body.ste-listing-wizard-active .ste-media-field .uploaded-files {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(142px, 1fr));
	gap: 12px;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
}

body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-file,
body.ste-listing-wizard-active .ste-media-field .uploaded-file {
	position: relative;
	display: block;
	width: 100%;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid #dce4ef;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 8px 22px rgba(24, 35, 59, .07);
	overflow: hidden;
}

body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-file-preview,
body.ste-listing-wizard-active .ste-media-field .uploaded-file-preview,
body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-file > a,
body.ste-listing-wizard-active .ste-media-field .uploaded-file > a {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	margin: 0 !important;
	background: #eef2f7;
	overflow: hidden;
	cursor: zoom-in;
}

body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-file img,
body.ste-listing-wizard-active .ste-media-field .uploaded-file img,
body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-file-preview img,
body.ste-listing-wizard-active .ste-media-field .uploaded-file-preview img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	object-fit: cover;
}

body.ste-listing-wizard-active .ste-media-field--logo .job-manager-uploaded-files,
body.ste-listing-wizard-active .ste-media-field--logo .uploaded-files {
	grid-template-columns: minmax(150px, 190px);
}

body.ste-listing-wizard-active .ste-media-field--logo .job-manager-uploaded-file-preview,
body.ste-listing-wizard-active .ste-media-field--logo .uploaded-file-preview,
body.ste-listing-wizard-active .ste-media-field--logo .job-manager-uploaded-file > a,
body.ste-listing-wizard-active .ste-media-field--logo .uploaded-file > a {
	aspect-ratio: 1 / 1;
	padding: 10px;
	background: #f7f9fc;
}

body.ste-listing-wizard-active .ste-media-field--logo .job-manager-uploaded-file img,
body.ste-listing-wizard-active .ste-media-field--logo .uploaded-file img,
body.ste-listing-wizard-active .ste-media-field--logo .job-manager-uploaded-file-preview img,
body.ste-listing-wizard-active .ste-media-field--logo .uploaded-file-preview img {
	object-fit: contain;
	border-radius: 10px !important;
}

body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-file .delete,
body.ste-listing-wizard-active .ste-media-field .uploaded-file .delete,
body.ste-listing-wizard-active .ste-media-field .job-manager-remove-uploaded-file,
body.ste-listing-wizard-active .ste-media-field [data-delete-file],
body.ste-listing-wizard-active .ste-media-field .remove-uploaded-file {
	position: absolute !important;
	z-index: 4;
	right: 8px !important;
	bottom: 8px !important;
	top: auto !important;
	left: auto !important;
	display: grid !important;
	place-items: center;
	width: 38px !important;
	height: 38px !important;
	min-width: 38px !important;
	min-height: 38px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 2px solid rgba(255,255,255,.92) !important;
	border-radius: 50% !important;
	background: #fff !important;
	box-shadow: 0 6px 16px rgba(15, 23, 42, .24) !important;
	color: #b42318 !important;
}

body.ste-listing-wizard-active .ste-media-field .description,
body.ste-listing-wizard-active .ste-media-field .file-upload-field > small,
body.ste-listing-wizard-active .ste-media-field .file-upload-field > p {
	margin: 0 !important;
	color: #697586;
	font-size: 12px !important;
	line-height: 1.5;
}

/* MyListing/media overlays must escape Studio cards and sit above the fixed footer. */
body.ste-listing-wizard-active.ste-studio-lightbox-open {
	overflow: hidden !important;
}

body.ste-listing-wizard-active .mfp-bg,
body.ste-listing-wizard-active .mfp-wrap,
body.ste-listing-wizard-active .c27-lightbox,
body.ste-listing-wizard-active .lf-lightbox,
body.ste-listing-wizard-active .gallery-lightbox,
body.ste-listing-wizard-active .modal-backdrop.ste-studio-media-overlay,
body.ste-listing-wizard-active .modal.ste-studio-media-overlay,
body.ste-listing-wizard-active [role="dialog"].ste-studio-media-overlay {
	position: fixed !important;
	inset: 0 !important;
	z-index: 2147483000 !important;
}

body.ste-listing-wizard-active .mfp-bg,
body.ste-listing-wizard-active .modal-backdrop.ste-studio-media-overlay {
	background: rgba(10, 18, 32, .82) !important;
	opacity: 1 !important;
}

body.ste-listing-wizard-active .mfp-wrap,
body.ste-listing-wizard-active .c27-lightbox,
body.ste-listing-wizard-active .lf-lightbox,
body.ste-listing-wizard-active .gallery-lightbox,
body.ste-listing-wizard-active .modal.ste-studio-media-overlay,
body.ste-listing-wizard-active [role="dialog"].ste-studio-media-overlay {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100vw !important;
	height: 100dvh !important;
	max-width: none !important;
	max-height: none !important;
	padding: max(18px, env(safe-area-inset-top, 0px)) 18px max(18px, env(safe-area-inset-bottom, 0px));
	overflow: auto !important;
}

body.ste-listing-wizard-active .mfp-content,
body.ste-listing-wizard-active .ste-studio-media-overlay .modal-dialog,
body.ste-listing-wizard-active .ste-studio-media-overlay .modal-content {
	position: relative !important;
	z-index: 2147483001 !important;
	max-width: min(94vw, 1100px) !important;
	max-height: 90dvh !important;
	margin: auto !important;
}

body.ste-listing-wizard-active .mfp-content img,
body.ste-listing-wizard-active .ste-studio-media-overlay img {
	max-width: 100% !important;
	max-height: 86dvh !important;
	object-fit: contain !important;
}

@media (max-width: 767px) {
	body.ste-listing-wizard-active {
		--ste-studio-footer-clearance: calc(154px + env(safe-area-inset-bottom, 0px));
	}

	body.ste-listing-wizard-active .ste-wizard-sticky-actions .ste-wizard-actions {
		bottom: max(8px, env(safe-area-inset-bottom, 0px));
		margin-left: 4px;
		margin-right: 4px;
		padding: 10px;
		border-radius: 18px;
	}

	body.ste-listing-wizard-active .ste-event-builder__item {
		padding: 13px !important;
	}

	body.ste-listing-wizard-active .ste-event-builder__item-head {
		grid-template-columns: 40px minmax(0, 1fr);
		align-items: start;
		gap: 10px 12px;
	}

	body.ste-listing-wizard-active .ste-event-builder__item-head .ste-event-builder__number {
		grid-column: 1;
		grid-row: 1;
	}

	body.ste-listing-wizard-active .ste-event-builder__item-head .ste-event-builder__field--title {
		grid-column: 2;
		grid-row: 1;
	}

	body.ste-listing-wizard-active .ste-event-builder__item-head .ste-event-builder__remove {
		grid-column: 2;
		grid-row: 2;
		justify-self: start;
		min-height: 30px;
		padding: 2px 0;
	}

	body.ste-listing-wizard-active .ste-event-builder__grid {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 14px !important;
	}

	body.ste-listing-wizard-active .ste-event-builder__grid > .ste-event-builder__field,
	body.ste-listing-wizard-active .ste-event-builder__grid > fieldset {
		grid-column: 1 !important;
		width: 100% !important;
	}

	body.ste-listing-wizard-active .ste-event-builder__point-row {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	body.ste-listing-wizard-active .ste-event-builder__find-place {
		justify-self: start;
		min-height: 44px;
	}

	body.ste-listing-wizard-active .ste-event-builder__distance {
		grid-template-columns: minmax(0, 1fr) 92px !important;
	}

	body.ste-listing-wizard-active .ste-event-builder__difficulty {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
	}

	body.ste-listing-wizard-active .ste-event-builder__difficulty label,
	body.ste-listing-wizard-active .ste-event-builder__difficulty-choice {
		width: 100%;
	}

	body.ste-listing-wizard-active .ste-event-builder__difficulty-choice {
		justify-content: center;
	}

	body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-files,
	body.ste-listing-wizard-active .ste-media-field .uploaded-files {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.ste-listing-wizard-active .ste-media-field--logo .job-manager-uploaded-files,
	body.ste-listing-wizard-active .ste-media-field--logo .uploaded-files {
		grid-template-columns: minmax(145px, 180px);
	}

	body.ste-listing-wizard-active .ste-media-field .file-upload-field label.upload-file,
	body.ste-listing-wizard-active .ste-media-field .file-upload-field .upload-file {
		min-height: 128px;
	}
}

@media (max-width: 420px) {
	body.ste-listing-wizard-active .ste-media-field .job-manager-uploaded-files,
	body.ste-listing-wizard-active .ste-media-field .uploaded-files {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 9px;
	}

	body.ste-listing-wizard-active .ste-wizard-actions {
		gap: 7px;
	}

	body.ste-listing-wizard-active .ste-wizard-button {
		min-width: 0;
		padding-left: 12px;
		padding-right: 12px;
	}
}