/*
 * Polje za iznos ponude u stilu obavijesti i gumba za ponudu: tirkizna podloga
 * s prijelazom u tamnije, tamni tekst, zaobljenje 5px, sjena u boji podloge.
 * Gumbi − i + su tamni krugovi kao ikone u obavijestima.
 */

/* Razmak između teksta pravila (ili roka za ispravak) i polja za iznos. */
body .lzp-ponuda .lzp-pravila,
body .lzp-ponuda .lzp-rok {
	margin-bottom: 20px;
}

body form.lzp-obrazac .quantity.buttons_added {
	--lzp-od: var(--bricks-color-zfurba, #2bc9af);
	--lzp-do: #178f7c;
	--lzp-tekst: var(--bricks-color-bwmlti, #122f3b);

	display: flex;
	align-items: center;
	gap: 8px;
	width: 300px;
	max-width: 100%;
	height: 50px;
	padding: 0 8px;
	border: 0;
	border-radius: 5px;
	background: linear-gradient(135deg, var(--lzp-od) 0%, var(--lzp-do) 100%);
	box-shadow: none;
	transition: box-shadow 0.3s ease;
}

body form.lzp-obrazac .quantity.buttons_added:focus-within {
	box-shadow: 0 0 20px 2px var(--lzp-od);
}

body form.lzp-obrazac .quantity.buttons_added .qty {
	flex: 1 1 auto;
	order: 1;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0 !important;
	border-radius: 0;
	outline: none;
	background: transparent;
	box-shadow: none;
	color: var(--lzp-tekst);
	font-size: 22px;
	font-weight: 700;
	line-height: 50px;
	text-align: center;
}

body form.lzp-obrazac .quantity.buttons_added .qty::placeholder {
	color: var(--lzp-tekst);
	font-weight: 600;
	opacity: 0.55;
}

body form.lzp-obrazac .quantity.buttons_added .minus,
body form.lzp-obrazac .quantity.buttons_added .plus {
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--lzp-tekst);
	color: var(--lzp-od);
	font-size: 22px;
	font-weight: 700;
	line-height: 34px;
	text-align: center;
	opacity: 1;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

body form.lzp-obrazac .quantity.buttons_added .minus {
	order: 0;
}

body form.lzp-obrazac .quantity.buttons_added .plus {
	order: 2;
}

body form.lzp-obrazac .quantity.buttons_added .minus:hover,
body form.lzp-obrazac .quantity.buttons_added .plus:hover {
	transform: scale(1.1);
	box-shadow: 0 0 12px 1px color-mix(in srgb, var(--lzp-tekst) 60%, transparent);
}

body form.lzp-obrazac .bid_button.lzp-salje {
	opacity: 0.6;
	cursor: wait;
}

body form.lzp-obrazac .quantity.buttons_added .minus:active,
body form.lzp-obrazac .quantity.buttons_added .plus:active {
	transform: scale(0.95);
}