/* Commission detail page (/commissions/<id>/) */
#commission-options label {
	font-size: 0.95em;
}

#commission-options .addon-note {
	opacity: 0.7;
	font-size: 0.85em;
}

/* Quantity stepper - a cute rounded pill with Berry −/+ buttons */
#commission-options .stepper {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	background: #fff;
	border: solid 1.5px #f3e2ec;
	border-radius: 999px;
	padding: 0.3em;
	box-shadow: 0 6px 24px rgba(194, 72, 126, 0.1);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#commission-options .stepper:focus-within {
	border-color: #c2487e;
	box-shadow: 0 0 0 3px rgba(194, 72, 126, 0.18);
}

#commission-options .stepper-btn {
	-webkit-appearance: none;
	appearance: none;
	flex: 0 0 auto;
	width: 2.1em;
	height: 2.1em;
	min-width: 0;
	padding: 0;
	border: solid 2px #c2487e;
	border-radius: 999px;
	background: #fff;
	color: #c2487e;
	font-family: 'Fredoka', 'Nunito', sans-serif;
	font-size: 1.15em;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

#commission-options .stepper-btn:hover {
	background: #c2487e;
	color: #fff;
	transform: translateY(-1px);
}

#commission-options .stepper-btn:active {
	transform: translateY(0);
}

/* Borderless centered number - the pill is the visible frame */
#commission-options .stepper input[type="number"] {
	-webkit-appearance: none;
	-moz-appearance: textfield;
	appearance: none;
	width: 2.4em;
	border: none;
	outline: 0;
	background: transparent;
	box-shadow: none;
	text-align: center;
	color: #4a3330;
	font-family: 'Fredoka', 'Nunito', sans-serif;
	font-size: 1.15em;
	font-weight: 600;
	padding: 0;
}

#commission-options .stepper input[type="number"]::-webkit-outer-spin-button,
#commission-options .stepper input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

#commission-options h2 small,
#main h2 small {
	font-size: 0.5em;
	opacity: 0.6;
	font-weight: inherit;
}

.commission-total-line {
	margin-top: 1em;
}