#no-combination { display: block; }
.inative { opacity: 1;} 
/* .product-combination-option {margin-bottom: 30px;} */
.buttons { display: flex; flex-wrap: wrap; gap: 5px; width: 100%;}

#product-combination .form-group > label {display: flex; align-items: center; gap: 4px;}

.product-combination-observation {display: flex; color: #514B48; margin: 0 0 16px; font-size: 12px; }
.product-combination-observation span:last-child::after {display: none;}
.product-combination-observation span::after {content: '|'; margin: 0 16px;}


/* opção de cor */
.border-button-color {border: 1px solid #000; width: 26px; height: 26px; border-radius: 100px; display: flex; align-items: center; justify-content: center;}
.button-color { border-radius: 100px; width: 20px; height: 20px; border: 1px solid #c4c4c4; cursor: pointer;}
.checkbox-color {width: 26px;}
.border-button-color .selected {border: none;}
/* opção de cor */

/* opcao normal */
.button-combination {border: 1px solid #ddd !important; border-radius: 4px !important; width: 100%; padding: 5px 12px !important; white-space: nowrap;}
.button-combination:hover {border-color: #888 !important;}
.checkbox-button .selected {border-color: #000 !important;}
#product-combination .form-group {display: flex; gap: 6px; flex-direction: column; margin-bottom: 12px;}
/* opcao normal */

@media (max-width: 991px) {
	#product-combination .form-group {flex-direction: column; align-items: start; gap: 12px; }
	.product-combination-observation {flex-direction: column; gap: 16px; }
	.product-combination-observation span::after {display: none;}
}

.product-combination-colors { 
	position: absolute; bottom: 0; left: 0; width: 100%; z-index: 2;
}
.product-combination-colors ul { 
	padding: 0; 
	list-style: none; 
	display: flex; 
	flex-wrap: wrap; 
	gap: 4px;
	justify-content: center;
	margin: 0;
}

.type-color {
	display: inline-block;
	width: 1.125rem;
	height: 1.125rem;
	cursor: pointer;
	background-size: contain;
	border-radius: 50%;
	border: 1px solid #ddd;
}

.type-button {
	cursor: pointer;
	border: 1px solid #ddd;
	min-width: 40px;
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
}