/**
 * Estimate Revenue Calculator – shortcode styles.
 *
 * @package GrowProp\Marketplace
 */

.er-fade-in { animation: erFadeIn 0.8s ease-out; }
@keyframes erFadeIn {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}
.er-glass {
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(226, 232, 240, 0.8);
}

#er-calc .iti { display: block; }
#er-calc .iti__tel-input {
	width: 100%;
	border-radius: 0.5rem;
	border: 1px solid #e2e8f0;
	padding: 0.75rem 1rem 0.75rem 52px;
	font-size: 0.875rem;
}
#er-calc .iti__tel-input:focus {
	border-color: #C5A059;
	box-shadow: 0 0 0 3px rgba(197, 160, 89, 0.2);
	outline: none;
}
#er-calc input[type="range"] {
	accent-color: #C5A059;
	height: 6px;
}
#er-calc input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #C5A059;
	cursor: pointer;
	border: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
#er-calc input[type="range"]::-moz-range-thumb {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #C5A059;
	cursor: pointer;
	border: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
#er-calc select {
	font-size: 0.875rem;
	height: auto;
	min-height: 48px;
	line-height: 1.5;
	padding: 0.75rem 1rem;
	box-sizing: border-box;
	overflow: visible;
	text-overflow: ellipsis;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8.825L.35 3.175 1.175 2.35 6 7.175 10.825 2.35l.825.825z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 12px;
	padding-right: 2.5rem;
}
#er-calc input[type="email"] {
	font-size: 0.875rem;
	height: auto;
	min-height: 48px;
	line-height: 1.5;
	padding: 0.75rem 1rem;
	box-sizing: border-box;
	overflow: visible;
	text-overflow: ellipsis;
}
