/* =========================
   SEARCH SELECT (generic)
========================= */

.search-select {
	position: relative;
	width: 100%;
}

.search-select-input {
	width: 100%;
	padding: 10px;
	border: 1px solid #d1d5db;
	border-radius: 5px;
	font-size: 16px;
	box-sizing: border-box;
	outline: none;

	transition:
		border-color 0.15s ease,
		box-shadow 0.15s ease;
}

.search-select-input:focus {
	border-color: #2563eb;
	box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
}

/* =========================
   RESULTS DROPDOWN
========================= */

.search-select-results {
	position: absolute;

	top: calc(100% + 4px);
	left: 0;

	width: 100%;

	background: white;
	border: 1px solid #d1d5db;
	border-radius: 6px;

	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);

	max-height: 220px;
	overflow-y: auto;

	z-index: 2000;

	display: none;
}

.search-select-results.visible {
	display: block;
}

/* =========================
   OPTION
========================= */

.search-select-option {
	padding: 10px 12px;
	cursor: pointer;
	font-size: 14px;
	color: #111827;

	transition: background 0.12s ease;
}

.search-select-option:hover,
.search-select-option.active {
	background: #f1f5f9;
}

.search-select-empty {
	padding: 10px 12px;
	font-size: 14px;
	color: #9ca3af;
	font-style: italic;
}

/* =========================
   SCROLLBAR
========================= */

.search-select-results::-webkit-scrollbar {
	width: 6px;
}

.search-select-results::-webkit-scrollbar-track {
	background: transparent;
}

.search-select-results::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.15);
	border-radius: 999px;
}