/* =========================================================
   BEROVIO — ADD LISTING
   ========================================================= */

.berovio-listing-page {
	width: 100%;
	padding: 72px 0 90px;
	background: #ffffff;
}

/* Structured tyres, rims and complete-wheel fields reuse the existing Berovio controls. */
.berovio-wheel-parameters{display:grid;gap:18px;margin:0 0 24px}
.berovio-wheel-parameters[hidden],.berovio-wheel-group[hidden],[data-wheel-origin-fields][hidden],[data-wheel-custom][hidden]{display:none!important}
.berovio-wheel-group{min-width:0;padding:18px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}
.berovio-wheel-group h3{margin:0 0 14px;color:#18212b;font-size:16px}
.berovio-wheel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.berovio-wheel-grid .berovio-listing-field,.berovio-wheel-grid .berovio-custom-select{min-width:0}
.berovio-wheel-origin-toggle{display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid #d8e1eb;border-radius:12px;background:#f8fafc;cursor:pointer}
.berovio-wheel-origin-toggle input{width:20px;height:20px;margin:2px 0 0;flex:0 0 auto}
.berovio-wheel-origin-toggle span{display:grid;gap:3px;min-width:0}
.berovio-wheel-origin-toggle strong{color:#18212b;font-size:14px}
.berovio-wheel-origin-toggle small{color:#637083;font-size:12px;line-height:1.45}

@media (max-width:800px){
    .berovio-wheel-grid{grid-template-columns:1fr}
    .berovio-wheel-group{padding:15px}
    .berovio-wheel-origin-toggle{padding:14px}
    .berovio-wheel-grid .berovio-custom-select-trigger{max-width:100%}
    .berovio-wheel-grid .berovio-custom-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}


.berovio-listing-container {
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding-inline: 20px;
	box-sizing: border-box;
}


/* =========================================================
   HEADING
   ========================================================= */

.berovio-listing-heading {
	max-width: 720px;
	margin: 0 auto 48px;
	text-align: center;
}


.berovio-listing-heading h1 {
	margin: 0 0 12px;

	color: #111111;

	font-size: 40px;
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -1px;
}


.berovio-listing-heading p {
	margin: 0;

	color: #686868;

	font-size: 16px;
	line-height: 1.6;
}


/* =========================================================
   STEP
   ========================================================= */

.berovio-listing-step {
	width: 100%;
	scroll-margin-top: 105px;
}


.berovio-listing-step[hidden] {
	display: none !important;
}


.berovio-listing-step-label {
	margin-bottom: 10px;

	color: #0064f8;

	font-size: 11px;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: 0.9px;
	text-transform: uppercase;
}


.berovio-listing-step h2 {
	margin: 0 0 22px;

	color: #111111;

	font-size: 24px;
	line-height: 1.3;
	font-weight: 700;
}


/* =========================================================
   STEP 1 — OPTIONS
   ========================================================= */

.berovio-listing-options {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}


.berovio-listing-option {
	position: relative;

	display: flex;
	align-items: center;

	width: 100%;
	min-height: 126px;

	padding: 24px;

	box-sizing: border-box;

	border: 1px solid #e1e4e8;
	border-radius: 14px;

	background: #ffffff;
	color: #111111;

	text-align: left;

	cursor: pointer;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease,
		background-color 0.2s ease;
}


.berovio-listing-option:hover {
	border-color: #0064f8;

	box-shadow:
		0 10px 28px rgba(0, 0, 0, 0.07);

	transform: translateY(-2px);
}


.berovio-listing-option:focus-visible {
	outline: none;

	border-color: #0064f8;

	box-shadow:
		0 0 0 3px rgba(0, 100, 248, 0.12);
}


/* =========================================================
   OPTION ICON
   ========================================================= */

.berovio-listing-option-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 auto;

	width: 52px;
	height: 52px;

	margin-right: 18px;

	border-radius: 12px;

	background: #f3f7ff;
	color: #0064f8;
}


.berovio-listing-option-icon svg {
	display: block;

	width: 28px;
	height: 28px;
}


/* =========================================================
   OPTION CONTENT
   ========================================================= */

.berovio-listing-option-content {
	display: flex;
	flex-direction: column;

	min-width: 0;
	padding-right: 30px;
}


.berovio-listing-option-content strong {
	margin-bottom: 5px;

	color: #111111;

	font-size: 17px;
	line-height: 1.3;
	font-weight: 700;
}


.berovio-listing-option-content span {
	color: #737373;

	font-size: 14px;
	line-height: 1.5;
}


/* =========================================================
   ARROW
   ========================================================= */

.berovio-listing-option-arrow {
	position: absolute;

	right: 20px;
	top: 50%;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 24px;
	height: 24px;

	color: #a0a0a0;

	transform: translateY(-50%);

	transition:
		color 0.2s ease,
		transform 0.2s ease;
}


.berovio-listing-option-arrow svg {
	display: block;

	width: 18px;
	height: 18px;
}


.berovio-listing-option:hover .berovio-listing-option-arrow {
	color: #0064f8;

	transform: translate(3px, -50%);
}


/* =========================================================
   STEP 2 — FORM
   ========================================================= */

.berovio-listing-form {
	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap: 16px;

	margin-top: 4px;
}


/* =========================================================
   FORM FIELD
   ========================================================= */

.berovio-listing-field {
	min-width: 0;
}


.berovio-listing-field label {
	display: block;

	margin: 0 0 8px;

	color: #222222;

	font-size: 13px;
	line-height: 1.3;
	font-weight: 600;
}


.berovio-listing-field label span {
	color: #0064f8;
}


/* =========================================================
   SELECT
   ========================================================= */

.berovio-listing-field input,
.berovio-listing-field select,
.berovio-listing-field textarea {
	display: block;

	width: 100%;
	min-height: 52px;

	padding: 0 42px 0 15px;

	box-sizing: border-box;

	border: 1px solid #dddddd;
	border-radius: 9px;

	background-color: #ffffff;
	color: #222222;

	font-family: inherit;
	font-size: 14px;

	outline: none;

	cursor: pointer;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		background-color 0.2s ease;
}


.berovio-listing-field textarea {
	min-height: 132px;
	padding: 14px 15px;
	resize: vertical;
	line-height: 1.55;
}


.berovio-listing-field input[type="file"] {
	padding: 13px 15px;
}


.berovio-listing-field input:hover,
.berovio-listing-field select:hover,
.berovio-listing-field textarea:hover {
	border-color: #c9c9c9;
}


.berovio-listing-field input:focus,
.berovio-listing-field select:focus,
.berovio-listing-field textarea:focus {
	border-color: #0064f8;

	box-shadow:
		0 0 0 3px rgba(0, 100, 248, 0.09);
}


.berovio-listing-field input:disabled,
.berovio-listing-field select:disabled,
.berovio-listing-field textarea:disabled {
	background-color: #f7f7f7;

	color: #a1a1a1;

	cursor: not-allowed;
}


/* =========================================================
   FIELD HELP
   ========================================================= */

.berovio-listing-field-help {
	margin: 8px 0 0;

	color: #777777;

	font-size: 12px;
	line-height: 1.45;
}


/* =========================================================
   INFORMATION BOX
   ========================================================= */

.berovio-listing-info {
	margin-top: 30px;

	padding: 20px 22px;

	border: 1px solid #e6eaf0;
	border-radius: 10px;

	background: #f8fafc;
}


.berovio-listing-info strong {
	display: block;

	margin: 0 0 7px;

	color: #111111;

	font-size: 14px;
	line-height: 1.4;
	font-weight: 700;
}


.berovio-listing-info p {
	margin: 0;

	color: #666666;

	font-size: 13px;
	line-height: 1.65;
}


.berovio-listing-info p strong {
	display: inline;

	margin: 0;

	font-size: inherit;
}


/* =========================================================
   STEP 2 — NAVIGATION
   ========================================================= */

.berovio-listing-navigation {
	display: flex;
	gap: 12px;
	align-items: center;
	justify-content: space-between;

	margin-top: 28px;
}


.berovio-listing-back,
.berovio-listing-next {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	height: 48px;

	box-sizing: border-box;

	border-radius: 9px;

	font-family: inherit;
	font-size: 13px;
	font-weight: 700;

	cursor: pointer;

	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease;
}


/* BACK */

.berovio-listing-back {
	padding: 0 18px;

	border: 1px solid #dddddd;

	background: #ffffff;
	color: #444444;
}


.berovio-listing-back:hover {
	border-color: #c9c9c9;

	background: #fafafa;

	color: #111111;
}


/* NEXT */

.berovio-listing-next {
	min-width: 140px;

	padding: 0 24px;

	border: 1px solid #0064f8;

	background: #0064f8;
	color: #ffffff;
}


.berovio-listing-next:hover:not(:disabled) {
	background: #0058dc;

	border-color: #0058dc;

	box-shadow:
		0 6px 16px rgba(0, 100, 248, 0.18);

	transform: translateY(-1px);
}


.berovio-listing-next:active:not(:disabled) {
	transform: translateY(0);
}


.berovio-listing-next:disabled {
	opacity: 0.45;

	cursor: not-allowed;

	box-shadow: none;
}


.berovio-listing-field-wide {
	grid-column: 1 / -1;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

	.berovio-listing-page {
		padding: 60px 0 75px;
	}


	.berovio-listing-heading {
		margin-bottom: 40px;
	}


	.berovio-listing-heading h1 {
		font-size: 36px;
	}


	.berovio-listing-options {
		grid-template-columns: 1fr;
	}


	.berovio-listing-form {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.berovio-listing-page {
		padding: 48px 0 60px;
	}


	.berovio-listing-container {
		padding-inline: 16px;
	}


	.berovio-listing-heading {
		margin-bottom: 34px;
	}


	.berovio-listing-heading h1 {
		font-size: 30px;
		letter-spacing: -0.6px;
	}


	.berovio-listing-heading p {
		font-size: 15px;
	}


	.berovio-listing-step-label {
		font-size: 10px;
	}


	.berovio-listing-step h2 {
		font-size: 21px;
		margin-bottom: 18px;
	}


	/* -----------------------------------------
	   STEP 1
	   ----------------------------------------- */

	.berovio-listing-options {
		gap: 12px;
	}


	.berovio-listing-option {
		min-height: 108px;

		padding: 18px;

		border-radius: 12px;
	}


	.berovio-listing-option-icon {
		width: 46px;
		height: 46px;

		margin-right: 14px;

		border-radius: 10px;
	}


	.berovio-listing-option-icon svg {
		width: 25px;
		height: 25px;
	}


	.berovio-listing-option-content strong {
		font-size: 16px;
	}


	.berovio-listing-option-content span {
		font-size: 13px;
	}


	.berovio-listing-option-arrow {
		right: 14px;
	}


	/* -----------------------------------------
	   STEP 2
	   ----------------------------------------- */

	.berovio-listing-form {
		grid-template-columns: 1fr;

		gap: 16px;
	}


	.berovio-listing-field input,
	.berovio-listing-field select,
	.berovio-listing-field textarea {
		height: 52px;

		font-size: 14px;
	}


	.berovio-listing-field textarea {
		height: auto;
	}


	.berovio-listing-field-help {
		font-size: 11.5px;
	}


	.berovio-listing-info {
		margin-top: 24px;

		padding: 17px 18px;
	}


	.berovio-listing-info strong {
		font-size: 13px;
	}


	.berovio-listing-info p {
		font-size: 12px;
		line-height: 1.6;
	}


	/* -----------------------------------------
	   NAVIGATION
	   ----------------------------------------- */

	.berovio-listing-navigation {
		gap: 12px;

		margin-top: 24px;
	}


	.berovio-listing-back,
	.berovio-listing-next {
		height: 46px;

		font-size: 13px;
	}


	.berovio-listing-back {
		padding: 0 15px;
	}


	.berovio-listing-next {
		flex: 1;

		min-width: 0;

		padding: 0 18px;
	}

}

/* =========================================================
   CUSTOM DROPDOWNS
   ========================================================= */

.berovio-custom-select {
	position: relative;
	width: 100%;
}


/* =========================================================
   TRIGGER
   ========================================================= */

.berovio-custom-select-trigger {
	position: relative;

	display: flex;
	align-items: center;
	justify-content: space-between;

	width: 100%;
	height: 52px;

	padding: 0 15px;

	box-sizing: border-box;

	border: 1px solid #dddddd;
	border-radius: 9px;

	background: #ffffff;
	color: #222222;

	font-family: inherit;
	font-size: 14px;
	font-weight: 400;

	text-align: left;

	cursor: pointer;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		background-color 0.2s ease;
}


.berovio-custom-select-trigger:hover {
	border-color: #c9c9c9;
}


.berovio-custom-select.is-open
.berovio-custom-select-trigger {

	border-color: #0064f8;

	box-shadow:
		0 0 0 3px rgba(0, 100, 248, 0.09);
}


.berovio-custom-select-trigger:focus-visible {
	outline: none;

	border-color: #0064f8;

	box-shadow:
		0 0 0 3px rgba(0, 100, 248, 0.09);
}


/* =========================================================
   VALUE
   ========================================================= */

.berovio-custom-select-value {
	min-width: 0;

	overflow: hidden;

	white-space: nowrap;
	text-overflow: ellipsis;
}


/* =========================================================
   ARROW
   ========================================================= */

.berovio-custom-select-arrow {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 auto;

	margin-left: 12px;

	color: #777777;

	transition:
		transform 0.2s ease,
		color 0.2s ease;
}


.berovio-custom-select.is-open
.berovio-custom-select-arrow {

	color: #0064f8;

	transform: rotate(180deg);
}


/* =========================================================
   DISABLED
   ========================================================= */

.berovio-custom-select.is-disabled
.berovio-custom-select-trigger {

	background: #f7f7f7;

	color: #a1a1a1;

	cursor: not-allowed;

	border-color: #e3e3e3;

	box-shadow: none;
}


.berovio-custom-select.is-disabled
.berovio-custom-select-arrow {

	color: #b0b0b0;
}


/* =========================================================
   DROPDOWN MENU
   ========================================================= */

.berovio-custom-select-menu {
	position: absolute;

	left: 0;
	right: 0;
	top: calc(100% + 6px);

	z-index: 50;

	max-height: 280px;

	padding: 6px;

	box-sizing: border-box;

	overflow-y: auto;

	border: 1px solid #e1e4e8;
	border-radius: 10px;

	background: #ffffff;

	box-shadow:
		0 12px 30px rgba(0, 0, 0, 0.10);

	opacity: 0;
	visibility: hidden;

	transform:
		translateY(-5px);

	transition:
		opacity 0.15s ease,
		visibility 0.15s ease,
		transform 0.15s ease;
}


.berovio-custom-select.is-open
.berovio-custom-select-menu {

	opacity: 1;
	visibility: visible;

	transform:
		translateY(0);
}


/* =========================================================
   OPTIONS
   ========================================================= */

/* Skryté možnosti custom selectu musia zostať skryté aj napriek display:flex. */
.berovio-custom-select-option[hidden] {
	display: none !important;
}


.berovio-custom-select-option {
	display: flex;
	align-items: center;
	justify-content: space-between;

	width: 100%;

	min-height: 42px;

	padding: 9px 11px;

	box-sizing: border-box;

	border: 0;
	border-radius: 7px;

	background: transparent;
	color: #333333;

	font-family: inherit;
	font-size: 14px;

	text-align: left;

	cursor: pointer;

	transition:
		background-color 0.15s ease,
		color 0.15s ease;
}


.berovio-custom-select-option:hover {
	background: #f3f7ff;

	color: #0064f8;
}


.berovio-custom-select-option.is-selected {
	background: #f3f7ff;

	color: #0064f8;

	font-weight: 600;
}


/* =========================================================
   CHECK
   ========================================================= */

.berovio-custom-select-check {
	flex: 0 0 auto;

	margin-left: 12px;

	color: #0064f8;

	font-size: 14px;

	opacity: 0;
}


.berovio-custom-select-option.is-selected
.berovio-custom-select-check {

	opacity: 1;
}


/* =========================================================
   SCROLLBAR
   ========================================================= */

.berovio-custom-select-menu::-webkit-scrollbar {
	width: 6px;
}


.berovio-custom-select-menu::-webkit-scrollbar-track {
	background: transparent;
}


.berovio-custom-select-menu::-webkit-scrollbar-thumb {
	background: #d5d5d5;

	border-radius: 10px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.berovio-custom-select-trigger {
		height: 52px;

		font-size: 14px;
	}


	.berovio-custom-select-menu {
		max-height: 240px;
	}

}

/* =========================================================
   STEP 3 — CATEGORIES
   ========================================================= */

.berovio-category-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}


/* =========================================================
   CATEGORY CARD
   ========================================================= */

.berovio-category-card {
	position: relative;

	display: flex;
	align-items: center;

	width: 100%;
	min-height: 92px;

	padding: 18px 52px 18px 18px;

	box-sizing: border-box;

	border: 1px solid #e1e4e8;
	border-radius: 14px;

	background: #ffffff;
	color: #111111;

	text-align: left;

	cursor: pointer;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease,
		transform 0.2s ease,
		background-color 0.2s ease;
}


.berovio-category-card:hover {
	border-color: #0064f8;

	box-shadow:
		0 10px 28px rgba(0, 0, 0, 0.07);

	transform: translateY(-2px);
}


.berovio-category-card:focus-visible {
	outline: none;

	border-color: #0064f8;

	box-shadow:
		0 0 0 3px rgba(0, 100, 248, 0.12);
}


.berovio-category-card.is-selected {
	border-color: #0064f8;

	background: #f8fbff;

	box-shadow:
		0 0 0 3px rgba(0, 100, 248, 0.09);
}


/* =========================================================
   CATEGORY ICON
   ========================================================= */

.berovio-category-card-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 auto;

	width: 46px;
	height: 46px;

	margin-right: 16px;

	border-radius: 11px;

	background: #f3f7ff;
	color: #0064f8;

	font-size: 21px;
	line-height: 1;
}


/* =========================================================
   CATEGORY CONTENT
   ========================================================= */

.berovio-category-card-content {
	display: flex;
	flex-direction: column;

	min-width: 0;
}


.berovio-category-card-content strong {
	color: #111111;

	font-size: 16px;
	line-height: 1.35;
	font-weight: 700;
}


.berovio-listing-step-accessory .berovio-category-card-content {
	overflow-wrap: anywhere;
}

.berovio-accessory-category-examples {
	margin-top: 4px;
	color: #626b77;
	font-size: 13px;
	line-height: 1.45;
	font-weight: 400;
}


/* =========================================================
   CATEGORY ARROW
   ========================================================= */

.berovio-category-card-arrow {
	position: absolute;

	right: 18px;
	top: 50%;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 24px;
	height: 24px;

	color: #a0a0a0;

	transform: translateY(-50%);

	transition:
		color 0.2s ease,
		transform 0.2s ease;
}


.berovio-category-card-arrow svg {
	display: block;

	width: 18px;
	height: 18px;
}


.berovio-category-card:hover
.berovio-category-card-arrow {
	color: #0064f8;

	transform: translate(3px, -50%);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 800px) {

	.berovio-category-grid {
		grid-template-columns: 1fr;
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

	.berovio-category-grid {
		gap: 12px;
	}


	.berovio-category-card {
		min-height: 76px;

		padding: 14px 48px 14px 14px;

		border-radius: 12px;
	}


	.berovio-category-card-icon {
		width: 42px;
		height: 42px;

		margin-right: 13px;

		border-radius: 10px;

		font-size: 19px;
	}


	.berovio-category-card-content strong {
		font-size: 15px;
	}


	.berovio-category-card-arrow {
		right: 13px;
	}

}


@media (max-width: 900px) {

	.berovio-listing-details-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}


@media (max-width: 600px) {

	.berovio-category-subcategories-header {
		flex-direction: column-reverse;
		gap: 12px;
	}


	.berovio-category-back {
		width: 100%;
	}


	.berovio-listing-summary {
		margin-bottom: 20px;
	}


	.berovio-listing-details-grid {
		grid-template-columns: 1fr;
	}

}



/* =========================================================
   INLINE SUBCATEGORIES
   ========================================================= */

.berovio-category-item {
	min-width: 0;
}


.berovio-category-subcategories-inline {
	width: 100%;
	margin-top: 10px;
	padding: 8px;

	box-sizing: border-box;

	border: 1px solid #e1e4e8;
	border-radius: 10px;

	background: #f8fafc;
}


.berovio-category-subcategories-inline[hidden] {
	display: none !important;
}


.berovio-subcategory-options {
	display: grid;
	grid-template-columns: 1fr;
	gap: 5px;
}


.berovio-subcategory-option {
	display: flex;
	align-items: center;
	justify-content: flex-start;

	width: 100%;
	min-height: 42px;

	padding: 9px 12px;

	box-sizing: border-box;

	border: 1px solid transparent;
	border-radius: 8px;

	background: #ffffff;
	color: #333333;

	font-family: inherit;
	font-size: 13px;
	font-weight: 500;

	text-align: left;

	cursor: pointer;

	transition:
		background-color 0.15s ease,
		border-color 0.15s ease,
		color 0.15s ease,
		box-shadow 0.15s ease;
}


.berovio-subcategory-option:hover {
	border-color: #d7e5fb;
	background: #f3f7ff;
	color: #0064f8;
}


.berovio-subcategory-option:focus-visible {
	outline: none;
	border-color: #0064f8;
	box-shadow: 0 0 0 3px rgba(0, 100, 248, 0.09);
}


.berovio-subcategory-option.is-selected {
	border-color: #0064f8;
	background: #f3f7ff;
	color: #0064f8;
	font-weight: 700;
}


@media (max-width: 800px) {

	.berovio-category-subcategories-inline {
		margin-top: 8px;
		padding: 7px;
	}

}


/* =========================================================
   FINAL FORM
   ========================================================= */

.berovio-listing-summary {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;

	margin: -8px 0 24px;
}


.berovio-listing-summary span {
	display: inline-flex;
	align-items: center;

	min-height: 34px;
	padding: 7px 11px;

	box-sizing: border-box;

	border: 1px solid #e1e4e8;
	border-radius: 999px;

	background: #f8fafc;
	color: #555555;

	font-size: 13px;
	line-height: 1.3;
}


.berovio-listing-summary strong {
	color: #111111;
}


.berovio-listing-details-form {
	margin: 0;
}


.berovio-listing-details-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}


/* =========================================================
   LISTING DETAILS — ENHANCED FIELDS
   ========================================================= */

.berovio-character-counter {
	margin-top: 6px;
	text-align: right;
	color: #8a8a8a;
	font-size: 11px;
	line-height: 1.3;
}

.berovio-character-counter.is-limit {
	color: #d63638;
	font-weight: 700;
}

 .berovio-price-input-wrap {
	position: relative;
}

.berovio-price-input-wrap input {
	padding-right: 42px;
}

.berovio-price-suffix {
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	color: #777777;
	font-size: 14px;
	pointer-events: none;
}

.berovio-price-input-wrap.is-disabled {
	opacity: 0.65;
}

.berovio-price-agreement-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 42px;
	margin-top: 9px;
	padding: 0 15px;
	box-sizing: border-box;
	border: 1px solid #dddddd;
	border-radius: 8px;
	background: #ffffff;
	color: #444444;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition:
		background-color 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease,
		box-shadow 0.2s ease;
}

.berovio-price-agreement-button:hover {
	border-color: #0064f8;
	background: #f3f7ff;
	color: #0064f8;
}

.berovio-price-agreement-button.is-active {
	border-color: #0064f8;
	background: #f3f7ff;
	color: #0064f8;
	box-shadow: 0 0 0 3px rgba(0, 100, 248, 0.09);
}

.berovio-price-input-wrap {
	position: relative;
}

.berovio-price-input-wrap input {
	padding-right: 42px;
}

.berovio-price-suffix {
	position: absolute;
	right: 15px;
	top: 50%;
	transform: translateY(-50%);
	color: #777777;
	font-size: 14px;
	pointer-events: none;
}

.berovio-price-input-wrap.is-disabled {
	opacity: 0.65;
}

.berovio-photo-upload input[type="file"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.berovio-photo-upload-box {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 145px;
	padding: 20px;
	box-sizing: border-box;
	border: 1.5px dashed #cfd5dc;
	border-radius: 12px;
	background: #fafbfc;
	color: #555555 !important;
	text-align: center;
	cursor: pointer;
	transition:
		border-color 0.2s ease,
		background-color 0.2s ease,
		color 0.2s ease;
}

.berovio-photo-upload-box:hover {
	border-color: #0064f8;
	background: #f8fbff;
	color: #0064f8 !important;
}

.berovio-photo-upload-box.is-dragover {
    border-color: #0064f8;
    background: #f3f7ff;
    box-shadow: 0 0 0 3px rgba(0, 100, 248, 0.09);
}


.berovio-photo-upload-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 10px;
	background: #f3f7ff;
	color: #0064f8;
	font-size: 24px;
	line-height: 1;
}

.berovio-photo-upload-box strong {
	color: #222222;
	font-size: 14px;
}

.berovio-photo-upload-box > span:last-child {
	color: #888888;
	font-size: 11px;
	line-height: 1.4;
}

.berovio-photo-preview {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	margin-top: 14px;
}

.berovio-photo-preview-item {
	min-width: 0;
	overflow: hidden;
	border: 1px solid #e1e4e8;
	border-radius: 10px;
	background: #ffffff;
}

.berovio-photo-preview-item img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: #f4f4f4;
}

.berovio-photo-preview-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 8px;
}

.berovio-photo-preview-meta > span {
	min-width: 0;
	overflow: hidden;
	color: #555555;
	font-size: 10px;
	font-weight: 600;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.berovio-photo-preview-actions {
	display: flex;
	align-items: center;
	gap: 4px;
	flex: 0 0 auto;
}

.berovio-photo-move,
.berovio-photo-remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 26px;
	height: 26px;
	padding: 0 6px;
	border: 1px solid #dddddd;
	border-radius: 6px;
	background: #ffffff;
	color: #555555;
	font-family: inherit;
	font-size: 11px;
	font-weight: 600;
	cursor: pointer;
}

.berovio-photo-move:hover,
.berovio-photo-remove:hover {
	border-color: #0064f8;
	color: #0064f8;
	background: #f8fbff;
}

.berovio-checkbox-option {
	display: flex !important;
	align-items: flex-start;
	gap: 10px;
	margin: 0 !important;
	padding: 14px 16px;
	border: 1px solid #e1e4e8;
	border-radius: 10px;
	background: #f8fafc;
	cursor: pointer;
	color: #444444 !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	font-weight: 400 !important;
}

.berovio-checkbox-option a {
	color: #0064f8;
	font-weight: 650;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.berovio-checkbox-option a:hover {
	color: #0046b8;
}

.berovio-checkbox-option input {
	flex: 0 0 auto;
	width: 18px !important;
	height: 18px !important;
	min-height: 0 !important;
	margin: 1px 0 0;
	padding: 0 !important;
	cursor: pointer;
}

.berovio-checkbox-option:has(input:checked) {
	border-color: #0064f8;
	background: #f8fbff;
}

.berovio-listing-privacy-note {
	margin: 7px 2px 0;
	color: #667085;
	font-size: 12px;
	line-height: 1.5;
}

.berovio-listing-privacy-note a {
	color: #0064f8;
	font-weight: 650;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.berovio-listing-privacy-note a:hover {
	color: #0046b8;
}

@media (max-width: 800px) {
	.berovio-photo-preview {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.berovio-photo-preview {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.berovio-photo-upload-box {
		min-height: 125px;
	}

	.berovio-photo-preview-meta {
		flex-direction: column;
		align-items: stretch;
	}

	.berovio-photo-preview-actions {
		justify-content: flex-end;
	}
}


/* =========================================================
   FINAL FORM SAFETY / MODERN SELECTS
   ========================================================= */

.berovio-listing-step-1 .berovio-listing-navigation {
	display: none !important;
}

.berovio-listing-step-1 .berovio-listing-next,
.berovio-listing-step-1 button[type="submit"] {
	display: none !important;
}

.berovio-price-type {
	margin-bottom: 8px;
}

.berovio-price-type .berovio-radio-option {
	cursor: pointer;
}

.berovio-price-input-wrap input::-webkit-outer-spin-button,
.berovio-price-input-wrap input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.berovio-price-input-wrap input[type="number"] {
	-moz-appearance: textfield;
	appearance: textfield;
}

.berovio-price-input-wrap.is-disabled input {
	background: #f7f7f7;
	color: #a1a1a1;
	cursor: not-allowed;
}

.berovio-custom-select[data-select="condition"],
.berovio-custom-select[data-select="location"] {
	position: relative;
}

.berovio-custom-select[data-select="condition"] .berovio-custom-select-menu,
.berovio-custom-select[data-select="location"] .berovio-custom-select-menu {
	max-height: 280px;
}



/* =========================================================
   INLINE FIELD VALIDATION
   ========================================================= */

.berovio-field-error {
	margin: 7px 0 0;
	color: #d32f2f;
	font-size: 12px;
	line-height: 1.4;
	font-weight: 500;
}

.berovio-field-error[hidden] {
	display: none;
}

.berovio-listing-field.has-error > input,
.berovio-listing-field.has-error > textarea,
.berovio-listing-field.has-error .berovio-password-field input {
	border-color: #d32f2f;
	box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.08);
}

.berovio-listing-field.has-error > input:focus,
.berovio-listing-field.has-error > textarea:focus,
.berovio-listing-field.has-error .berovio-password-field input:focus {
	border-color: #d32f2f;
	box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.10);
}

.berovio-listing-field.has-error
.berovio-custom-select-trigger {
	border-color: #d32f2f;
	box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.08);
}

.berovio-listing-field.has-error
.berovio-custom-select.is-open
.berovio-custom-select-trigger {
	border-color: #d32f2f;
	box-shadow: 0 0 0 3px rgba(211, 47, 47, 0.08);
}

.berovio-listing-field.has-error
.berovio-checkbox-option {
	color: #d32f2f;
}



/* Anonymous listing management / verification */
.berovio-password-field{position:relative;display:flex;align-items:center}
.berovio-password-field input{width:100%;padding-right:90px}
.berovio-password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;padding:6px 8px;cursor:pointer;font-size:13px;font-weight:600}
.berovio-listing-notice{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:10px;background:#f5f8fc}
.berovio-listing-notice strong{font-size:14px}
.berovio-listing-notice span{font-size:13px;line-height:1.5}
.berovio-listing-pending{margin:0 0 22px;padding:18px;border-radius:12px;background:#f5f8fc}
.berovio-listing-pending h3{margin:0 0 6px}
.berovio-listing-pending p{margin:0;line-height:1.55}


.berovio-existing-photo-preview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 16px}.berovio-existing-photo{position:relative;border:1px solid #e1e6ed;border-radius:10px;overflow:hidden;background:#f7f9fb}.berovio-existing-photo img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}.berovio-existing-photo .berovio-photo-remove{width:100%;border:0;border-top:1px solid #e1e6ed;background:#fff;padding:7px 6px;cursor:pointer;font:inherit;font-size:12px;color:#b42318}.berovio-existing-photo-preview + .berovio-photo-upload{margin-top:4px}@media(max-width:640px){.berovio-existing-photo-preview{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Listing activation / management messages */
.berovio-listing-pending .berovio-listing-next{
    margin-top:18px;
    text-decoration:none;
}
.berovio-listing-pending .berovio-listing-next:hover,
.berovio-listing-pending .berovio-listing-next:focus,
.berovio-listing-pending .berovio-listing-next:visited{
    color:#fff;
}
.berovio-listing-back{
    text-decoration:none;
}

/* Existing edit sections use the same wizard components and hidden state. */
.berovio-listing-edit-mode .berovio-listing-step-1{display:none!important}
.berovio-listing-edit-mode [data-step][hidden]{display:none!important}
.berovio-edit-sections{margin-bottom:24px;gap:12px}
/* Edit mode: the creation wizard step labels are not shown. */
.berovio-listing-page.berovio-listing-edit-mode .berovio-listing-step-label{display:none!important}
.berovio-listing-page.berovio-listing-edit-mode .berovio-password-toggle{z-index:5}

.berovio-listing-draft{min-height:44px;padding:0 18px;border:1px solid #dfe3e8;border-radius:9px;background:#fff;color:#333;font:inherit;font-size:13px;font-weight:800;cursor:pointer;white-space:nowrap}
.berovio-listing-draft:hover{border-color:#bfc8d2;background:#f7f8fa;color:#111}
@media (max-width:620px){.berovio-listing-draft{width:100%}}

.berovio-listing-navigation .berovio-listing-draft{min-height:48px}
.berovio-listing-navigation{flex-wrap:wrap}
.berovio-listing-navigation .berovio-listing-draft + .berovio-listing-next{margin-left:auto}

.berovio-listing-page.berovio-listing-edit-mode .berovio-listing-navigation.berovio-draft-navigation {
    gap: 14px;
}

/* =========================================================
   SEARCHABLE VEHICLE DROPDOWNS
   ========================================================= */
.berovio-custom-select[data-searchable="1"] .berovio-custom-select-menu {
    padding: 0;
    overflow: hidden;
}

.berovio-custom-select-search {
    position: sticky;
    top: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px;
    border-bottom: 1px solid #edf0f3;
    background: #fff;
}

.berovio-custom-select-search > span {
    flex: 0 0 auto;
    color: #68717d;
    font-size: 17px;
    line-height: 1;
}

.berovio-custom-select-search input {
    width: 100%;
    height: 38px;
    min-width: 0;
    padding: 0 11px;
    box-sizing: border-box;
    border: 1px solid #dfe3e8;
    border-radius: 8px;
    outline: 0;
    background: #f8fafc;
    color: #20242a;
    font: inherit;
    font-size: 13px;
}

.berovio-custom-select-search input:focus {
    border-color: #0064f8;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(0, 100, 248, 0.08);
}

.berovio-custom-select-search input::-webkit-search-cancel-button {
    cursor: pointer;
}

.berovio-custom-select-options {
    max-height: 224px;
    padding: 6px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.berovio-custom-select-options::-webkit-scrollbar {
    width: 6px;
}

.berovio-custom-select-options::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #d5d5d5;
}

.berovio-listing-field[hidden] {
    display: none !important;
}

/* Optional helper inside field labels. */
.berovio-listing-field label .berovio-listing-optional {
    margin-left: 6px;
    color: #8a8f96;
    font-size: 11px;
    font-weight: 500;
}


/* =========================================================
   COMPATIBLE VEHICLES — AUTODIEL
   ========================================================= */

.berovio-compatible-vehicles {
    margin-top: 26px;
    padding-top: 24px;
    border-top: 1px solid #e7ebef;
}

.berovio-compatible-vehicles[hidden],
.berovio-compatible-row[hidden],
.berovio-compatible-limit[hidden] {
    display: none !important;
}

.berovio-compatible-vehicles-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.berovio-compatible-vehicles-head h3 {
    margin: 0 0 6px;
    color: #17191c;
    font-size: 16px;
    line-height: 1.35;
    font-weight: 750;
}

.berovio-compatible-vehicles-head p {
    max-width: 660px;
    margin: 0;
    color: #707781;
    font-size: 13px;
    line-height: 1.55;
}

.berovio-compatible-add-wrap {
    max-width: 290px;
    margin: 14px 0 0 auto;
}

.berovio-compatible-add {
    width: 100%;
    flex: 0 0 auto;
    min-height: 42px;
    padding: 0 15px;
    border: 1px solid #0064f8;
    border-radius: 9px;
    background: #fff;
    color: #0064f8;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.berovio-compatible-add:hover:not(:disabled) {
    background: #f2f7ff;
}

.berovio-compatible-add:disabled {
    border-color: #d9dee5;
    color: #a3a9b1;
    background: #f7f8fa;
    cursor: not-allowed;
}

.berovio-compatible-add-help {
    margin: 7px 0 0;
    color: #777f88;
    font-size: 12px;
    line-height: 1.45;
}

.berovio-compatible-add-help[hidden] {
    display: none !important;
}

.berovio-compatible-list {
    display: grid;
    gap: 14px;
    margin-top: 18px;
}

.berovio-compatible-row {
    padding: 17px;
    border: 1px solid #e4e9ef;
    border-radius: 11px;
    background: #f8fafc;
}

.berovio-compatible-row-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.berovio-compatible-row-head strong {
    color: #222;
    font-size: 13px;
    font-weight: 750;
}

.berovio-compatible-remove {
    padding: 0;
    border: 0;
    background: transparent;
    color: #777f88;
    font-family: inherit;
    font-size: 12px;
    font-weight: 650;
    cursor: pointer;
}

.berovio-compatible-remove:hover {
    color: #d52d2d;
}

.berovio-compatible-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
}

.berovio-compatible-grid .berovio-custom-select-menu {
    z-index: 30;
}

.berovio-compatible-limit {
    margin: 12px 0 0;
    color: #777f88;
    font-size: 12px;
}

@media (max-width: 760px) {
    .berovio-compatible-vehicles-head {
        display: block;
    }

    .berovio-compatible-add-wrap {
        max-width: none;
        margin: 14px 0 0;
    }

    .berovio-compatible-add {
        width: 100%;
        margin-top: 0;
    }

    .berovio-compatible-grid {
        grid-template-columns: 1fr;
    }
}

.berovio-listing-option-price {
    display: block;
    margin-top: 7px;
    color: #0064f8;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 700;
}

.berovio-vehicle-payment-info[hidden] {
    display: none;
}

@media (max-width: 480px) {
    .berovio-listing-option-content {
        padding-right: 24px;
    }

    .berovio-listing-option-price,
    .berovio-vehicle-payment-info {
        overflow-wrap: anywhere;
    }

    [data-paid-publication-submit] {
        min-height: 48px;
        white-space: normal;
        text-align: center;
    }
}

/* Compatible vehicle model multi-select. */
.berovio-compatible-help {
    display: block;
    margin-top: 6px;
    color: #777f88;
    font-size: 12px;
    line-height: 1.4;
}

.berovio-custom-select[data-multiple="1"] .berovio-custom-select-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    margin-left: 12px;
    border: 1px solid #c7ced8;
    border-radius: 4px;
    color: transparent;
    font-size: 12px;
    line-height: 1;
    opacity: 1;
    box-sizing: border-box;
}

.berovio-custom-select[data-multiple="1"] .berovio-custom-select-option.is-selected .berovio-custom-select-check {
    border-color: #0064f8;
    background: #0064f8;
    color: #fff;
    opacity: 1;
}

/* =========================================================
   MOBILE DETAILS UX — 0.6.86
   Final overrides live at the end of the file intentionally,
   so later desktop detail-grid rules cannot override mobile.
   ========================================================= */
.berovio-listing-mobile-section-title {
	display: none;
}

@media (max-width: 600px) {
	/* Two-column micro grid is used only for Price + Condition. */
	.berovio-listing-details-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 12px;
		row-gap: 16px;
		align-items: start;
	}

	.berovio-listing-details-grid > .berovio-listing-field-wide,
	.berovio-listing-details-grid > .berovio-part-oem-field,
	.berovio-listing-details-grid > .berovio-listing-location-field,
	.berovio-listing-details-grid > .berovio-listing-contact-field,
	.berovio-listing-details-grid > .berovio-listing-mobile-section-title {
		grid-column: 1 / -1;
	}

	.berovio-listing-mobile-section-title {
		display: block;
		margin: 10px 0 -3px;
		padding-top: 16px;
		border-top: 1px solid #edf0f3;
		color: #1f2937;
		font-size: 12px;
		line-height: 1.25;
		font-weight: 800;
		letter-spacing: .045em;
		text-transform: uppercase;
	}

	.berovio-listing-mobile-section-title:first-child {
		margin-top: 0;
		padding-top: 0;
		border-top: 0;
	}

	/* Keep the two primary transactional fields balanced. */
	.berovio-listing-price-field,
	.berovio-listing-condition-field {
		min-width: 0;
	}

	.berovio-listing-price-field .berovio-price-input-wrap input,
	.berovio-listing-condition-field .berovio-custom-select-trigger {
		height: 52px;
		min-height: 52px;
	}

	/* OEM and location need room for help text / long district names. */
	.berovio-part-oem-field,
	.berovio-listing-location-field {
		width: 100%;
	}

	.berovio-listing-location-field .berovio-custom-select-trigger {
		width: 100%;
	}

	/* Contact entry is intentionally one field per row on phones. */
	.berovio-listing-contact-field input {
		min-height: 52px;
		font-size: 16px;
	}

	/* Comfortable text entry on iOS; 16px also avoids Safari zoom. */
	#berovio-listing-title,
	#berovio-listing-oem,
	#berovio-listing-description,
	#berovio-listing-contact-name,
	#berovio-listing-contact-phone,
	#berovio-listing-contact-email {
		font-size: 16px;
	}

	#berovio-listing-description {
		min-height: 180px;
		line-height: 1.55;
	}

	.berovio-photo-upload-box {
		min-height: 136px;
		padding: 20px 16px;
	}

	.berovio-photo-upload-box strong {
		font-size: 14px;
	}

	.berovio-photo-upload-hint {
		max-width: 250px;
		line-height: 1.45;
	}

	/* Legal confirmation: larger touch target and more breathing room. */
	.berovio-listing-terms-field .berovio-checkbox-option {
		gap: 12px;
		padding: 16px;
		border-radius: 12px;
		font-size: 13px !important;
		line-height: 1.62 !important;
	}

	.berovio-listing-terms-field .berovio-checkbox-option input {
		width: 22px !important;
		height: 22px !important;
		margin-top: 1px;
	}

	.berovio-listing-privacy-note {
		margin-top: 9px;
		font-size: 12px;
		line-height: 1.55;
	}

	/* Navigation: secondary Back, then strong full-width actions. */
	.berovio-listing-step-details .berovio-listing-navigation {
		display: grid;
		grid-template-columns: 1fr;
		gap: 10px;
		align-items: stretch;
		margin-top: 26px;
	}

	.berovio-listing-step-details .berovio-listing-back {
		justify-self: start;
		width: auto;
		min-height: 44px;
	}

	.berovio-listing-step-details .berovio-listing-draft,
	.berovio-listing-step-details .berovio-listing-next {
		width: 100%;
		min-width: 0;
		min-height: 50px;
		margin-left: 0 !important;
	}

	/* Primary action first on phones; secondary actions follow below. */
	.berovio-listing-step-details .berovio-listing-next {
		order: 1;
		margin-bottom: 8px;
		border-color: #0064f8 !important;
		background: #0064f8 !important;
		color: #fff !important;
	}

	.berovio-listing-step-details .berovio-listing-next:hover:not(:disabled),
	.berovio-listing-step-details .berovio-listing-next:focus-visible:not(:disabled) {
		border-color: #0058dc !important;
		background: #0058dc !important;
		color: #fff !important;
	}

	.berovio-listing-step-details .berovio-listing-draft {
		order: 2;
	}

	.berovio-listing-step-details .berovio-listing-back {
		order: 3;
		justify-self: stretch;
		width: 100%;
	}
}

@media (max-width: 370px) {
	/* Very narrow phones: avoid squeezing Price / Condition too far. */
	.berovio-listing-details-grid {
		grid-template-columns: 1fr;
	}

	.berovio-listing-price-field,
	.berovio-listing-condition-field {
		grid-column: 1 / -1;
	}
}

@media (max-width: 600px) {
	.berovio-listing-step-details .berovio-listing-summary {
		gap: 6px;
		margin: -4px 0 22px;
	}

	.berovio-listing-step-details .berovio-listing-summary span {
		min-height: 30px;
		padding: 5px 9px;
		font-size: 12px;
		line-height: 1.25;
	}
}


/* Branded submission state for an e-mail that already belongs to an account. */
.berovio-listing-submit-error-page{padding:34px 0 60px}
.berovio-listing-submit-error{display:flex;align-items:flex-start;gap:18px;max-width:760px;margin:0 auto;padding:28px;border:1px solid #dfe6ee;border-radius:18px;background:#fff;box-shadow:0 14px 38px rgba(22,37,55,.07)}
.berovio-listing-submit-error-icon{display:flex;align-items:center;justify-content:center;flex:0 0 42px;width:42px;height:42px;border-radius:50%;background:#f4f7ff;color:var(--berovio-blue,#0064f8);font-size:22px;font-weight:800}
.berovio-listing-submit-error-kicker{margin:0 0 7px;color:var(--berovio-blue,#0064f8);font-size:12px;font-weight:800;letter-spacing:.08em}
.berovio-listing-submit-error h1{margin:0 0 10px;font-size:28px;line-height:1.2;letter-spacing:-.4px;color:#202831}
.berovio-listing-submit-error p{margin:0;color:#68737e;font-size:15px;line-height:1.6}
.berovio-listing-submit-error-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.berovio-listing-submit-error-primary,.berovio-listing-submit-error-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:10px;font:inherit;font-size:14px;font-weight:750;cursor:pointer;text-decoration:none}
.berovio-listing-submit-error-primary{border:1px solid var(--berovio-blue,#0064f8);background:var(--berovio-blue,#0064f8);color:#fff}
.berovio-listing-submit-error-primary:hover{background:var(--berovio-blue-dark,#004fc7);border-color:var(--berovio-blue-dark,#004fc7);color:#fff}
.berovio-listing-submit-error-primary:focus-visible{outline:0;border-color:var(--berovio-blue-dark,#004fc7);background:var(--berovio-blue-dark,#004fc7);color:#fff;box-shadow:0 0 0 3px rgba(0,100,248,.22)}
.berovio-listing-submit-error-secondary{border:1px solid #d7dee7;background:#fff;color:#2f3943}
.berovio-listing-submit-error-secondary:hover{border-color:#b9c4d0;background:#f8fafc}
@media(max-width:640px){.berovio-listing-submit-error-page{padding:18px 0 40px}.berovio-listing-submit-error{gap:13px;padding:19px;border-radius:14px}.berovio-listing-submit-error-icon{flex-basis:36px;width:36px;height:36px;font-size:18px}.berovio-listing-submit-error h1{font-size:22px}.berovio-listing-submit-error-actions{flex-direction:column}.berovio-listing-submit-error-primary,.berovio-listing-submit-error-secondary{width:100%}}

/* Upload feedback stays within the field on narrow phones. */
.berovio-photo-feedback{box-sizing:border-box;max-width:100%;min-width:0;margin:12px 0;padding:12px;border:1px solid #e4c783;border-radius:9px;background:#fff8e8;color:#463715;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.berovio-photo-feedback[hidden]{display:none}

[data-wheel-field][hidden]{display:none!important}

/* Seller category helper stays in document flow, including above the mobile keyboard. */
.berovio-part-search{min-width:0;margin:0 0 16px}
.berovio-part-search p{font-size:14px;line-height:1.5;margin:0 0 10px;color:#596579}
.berovio-part-search input[type=search]{box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:48px;padding:12px 14px;border:1px solid #dce3ec;border-radius:10px;background:#fff;font:inherit;font-size:16px;color:#263348}
.berovio-part-search input:focus-visible{outline:2px solid #0064f8;outline-offset:2px}
#berovio-part-results{margin-top:8px;border:1px solid #dce3ec;border-radius:10px;background:#fff;max-height:min(360px,45vh);max-height:min(360px,45dvh);overflow-y:auto;overscroll-behavior:contain;scroll-padding:5px}
#berovio-part-results[hidden]{display:none}
.berovio-part-result{box-sizing:border-box;min-height:52px;padding:12px 14px;cursor:pointer;overflow-wrap:anywhere;line-height:1.45;border-bottom:1px solid #edf0f4}
.berovio-part-result:last-child{border-bottom:0}
.berovio-part-result strong,.berovio-part-result small{display:block}
.berovio-part-result strong{font-size:15px;color:#263348}
.berovio-part-result small{font-size:12px;color:#596579;margin-top:3px}
.berovio-part-result:hover,.berovio-part-result[aria-selected=true]{background:#f3f7ff;box-shadow:inset 3px 0 #0064f8}
.berovio-part-search .berovio-part-status{margin:10px 0 0;overflow-wrap:anywhere}
.berovio-part-status:empty{display:none}
.berovio-part-manual{font-size:14px;font-weight:600;margin:20px 0 12px}
.berovio-part-examples{display:block;font-size:12px;font-weight:400;line-height:1.5;color:#596579;margin-top:4px;overflow-wrap:anywhere}
.berovio-main-category-grid .berovio-subcategory-option{min-height:44px}
.berovio-main-category-grid .berovio-subcategory-option>span{min-width:0;overflow-wrap:anywhere}
@media(max-width:600px){.berovio-part-result{padding:12px}.berovio-part-examples{font-size:12px}}

/* Subcategory names remain subtly stronger than the central part examples. */
.berovio-main-category-grid .berovio-subcategory-option>span{font-size:14px;font-weight:600}
.berovio-main-category-grid .berovio-subcategory-option.is-selected>span{font-weight:700}
.berovio-main-category-grid .berovio-subcategory-option .berovio-part-examples{font-size:12px;font-weight:400}

.berovio-part-search .berovio-part-clear{margin-top:8px;padding:4px 0;border:0;background:transparent;color:#0064f8;font:inherit;font-size:13px;cursor:pointer;text-decoration:underline}
.berovio-part-search .berovio-part-clear[hidden]{display:none}

/* Existing editor only: hide intermediate wizard steps until hydration completes. */
.berovio-edit-loading [data-step],.berovio-edit-failed [data-step]{display:none!important}
.berovio-edit-status{display:flex;align-items:center;gap:10px;color:#637083;font-size:14px;line-height:1.5}
.berovio-edit-status[hidden],.berovio-edit-error[hidden],.berovio-edit-error button[hidden]{display:none!important}
.berovio-edit-spinner{flex:0 0 18px;width:18px;height:18px;box-sizing:border-box;border:2px solid #e1e6ed;border-top-color:var(--berovio-blue,#0064f8);border-radius:50%;animation:berovio-edit-spin .8s linear infinite}
.berovio-edit-error{font-size:14px;line-height:1.5;color:#637083}
.berovio-edit-error p{margin:0 0 8px}
.berovio-edit-error button{border:0;background:transparent;padding:0;font:inherit;cursor:pointer;display:inline-flex;align-items:center;min-height:44px;color:var(--berovio-blue,#0064f8)}
@keyframes berovio-edit-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.berovio-edit-spinner{animation:none}}