.detalhes_modelo {
	box-shadow    : 5px 5px 5px #A4A4A4;
	border-radius : 5px;
}
.tom {
	flex-basis : 100%;
}
.tom select {
	width            : 100%;
	display          : block;
	box-sizing       : border-box;
	padding          : 8px 10px;
	font-size        : 1rem;
	border           : 1px solid #BBB;
	border-radius    : 4px;
	background-color : #FDFDFD;
	color            : #333;
	cursor           : pointer;
	transition       : border-color 0.2s, box-shadow 0.2s, background-color 0.2s;
}

.tom select:hover {
	border-color     : #888;
	background-color : #F7F7F7;
}

.tom select:focus {
	border-color : #007BFF;
	box-shadow   : 0 0 5px rgba(0, 123, 255, 0.4);
	outline      : none;
}

.tom select option {
	color            : #333;
	background-color : #FFF;
}

.slider-container {
	position : relative;
	padding  : 0 50px;
}

.sample-wrapper {
	min-width       : 100%;
	display         : flex;
	gap             : 8px;
	overflow-x      : auto;
	overflow-y      : hidden;
	scroll-behavior : smooth;
	padding         : 10px 5px;
	cursor          : grab;
	scrollbar-width : thin;
}

.sample-wrapper::-webkit-scrollbar {
	height : 8px;
}

.sample-wrapper::-webkit-scrollbar-thumb {
	background-color : #999;
	border-radius    : 4px;
}

.sample-wrapper::-webkit-scrollbar-track {
	background-color : #F1F1F1;
}

.sample-wrapper.grabbing {
	cursor : grabbing;
}

.sample {
	width            : 40px;
	height           : 40px;
	border           : 1px solid #CCC;
	border-radius    : 6px;
	flex-shrink      : 0;
	cursor           : pointer;
	display          : flex;
	align-items      : center;
	justify-content  : center;
	background-color : #FFF;
	position         : relative;
	transition       : transform 0.2s, border-color 0.2s, box-shadow 0.2s;
}

.sample:hover {
	transform    : scale(1.1);
	border-color : #888;
}

.sample.selecionada {
	border     : 2px solid #D86C84;
	box-shadow : 0 0 5px #C49081;
	transform  : scale(1.15);
}

.seta {
	position         : absolute;
	top              : 50%;
	transform        : translateY(-50%);
	background-color : #FFF;
	color            : #333;
	border           : 1px solid #CCC;
	width            : 35px;
	height           : 35px;
	cursor           : pointer;
	font-size        : 1.2rem;
	display          : flex;
	align-items      : center;
	justify-content  : center;
	border-radius    : 50%;
	box-shadow       : 0 2px 5px rgba(0, 0, 0, 0.2);
	transition       : background-color 0.2s, box-shadow 0.2s;
	line-height      : 0; /* Adicionado para evitar deslocamento visual por altura de fonte */
}

.seta:hover {
	background-color : #E0E0E0;
	box-shadow       : 0 4px 10px rgba(0, 0, 0, 0.3);
}

.seta.esquerda {
	left : 5px;
}

.seta.direita {
	right : 5px;
}

.seta.hidden {
	display : none;
}

.semVariacao {
	position : relative;
	overflow : hidden;
}

.semVariacao::after {
	content          : "";
	position         : absolute;
	top              : 50%;
	left             : -20%;
	width            : 140%;
	height           : 2px;
	background-color : #D86C84;
	transform        : rotate(-45deg);
	transform-origin : center;
}