/* ============================================================
   Station Select (Basis-Layout)
   - optional: falls du einen Container wie "head-container" nutzt
============================================================ */

.uploadSelect {
	width: 100%;
	max-width: 400px;
	max-height: 400px;
	display: block;
	font-size: 16px;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 12px 8px;
}

.select-container {
  width: 100%;
  display: flex;
  justify-content: center; /* zentriert */
}

#stationSelectUploads {
  width: 100%;
  max-width: 400px;
  font-size: 16px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 12px 8px;
}

/* ============================================================
   TomSelect Look & Feel
   (kommt aus deiner anderen Seite, reduziert auf das Nötigste)
============================================================ */

.ts-wrapper {
  width: auto;
  max-width: 400px;
}

.ts-control,
.ts-dropdown .option,
.ts-dropdown .optgroup-header {
  font-size: 16px;
}

/* "Input" / Control oben (dein schöner cleaner Look) */
.ts-control {
  display: block !important;
  background-color: #fff !important;
  border: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  cursor: pointer !important;
  position: relative; /* wichtig für den Pfeil */
}

/* kein Focus-Glow */
.ts-control:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Text im Control etwas größer */
.ts-control > * {
  font-size: 17px !important;
}

/* Dropdown Optionen */
.ts-dropdown .option {
  padding: 8px 0 8px 18px !important;
  text-align: left;
}

/* Optgroup Header */
.ts-dropdown .optgroup-header {
  font-weight: bold;
  padding: 6px 12px;
  background-color: #f5f5f5;
  color: #333;
  border-bottom: 1px solid #ddd;
  margin-top: 0px;
  text-align: left;
}

/* Dropdown Scrolling */
.ts-dropdown {
  max-height: min(400px, 60vh);
  overflow-y: auto;
}

/* verhindert "doppeltes" Scroll-Verhalten */
.ts-dropdown-content {
  max-height: 1000px !important;
  overflow-y: hidden !important;
}

/* ============================================================
   Pfeil (Font Awesome) – wie bei dir
============================================================ */

/* Standard: Pfeil nach unten */
.ts-control::after {
  content: "\f078";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  transition: transform 0.2s ease;
  pointer-events: none;
  color: #666;
  font-size: 14px;
}

/* Dropdown offen: Pfeil nach oben */
.ts-wrapper.dropdown-active .ts-control::after {
  content: "\f077";
}