/**
 * JAK Core - Select2 Custom Styles
 * 
 * Custom styling for Select2 dropdowns used across JAK plugins.
 * 
 * @package JAK_Core
 * @subpackage Components
 */

/* ==========================================================================
   Select2 Container & Selection
   ========================================================================== */

.select2-container .select2-selection--single .select2-selection__rendered {
	text-overflow: inherit;
	display: flex;
}

.select2-container .select2-selection--single {
	margin: 0;
	height: inherit;
}

/* ==========================================================================
   Attendee Display Format (Employee Number + Name)
   ========================================================================== */

.jak-select2-data-attendee-empl_nr {
	display: inline-block;
	width: 50px;
	padding-right: 10px;
	font-weight: 600;
}

.jak-select2-data-attendee-name {
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	flex-grow: 1;
	flex-basis: 0;
}

/* ==========================================================================
   Clear Button Positioning
   ========================================================================== */

.select2-container--default .select2-selection__clear {
	order: 1; /* Change order to place it to the right (default is 0) */
	margin-left: 10px; /* Add space if needed */
}

/* ==========================================================================
   Optional: Commented out alternative styles
   ========================================================================== */

/*
.select2-container .select2-selection--single {
  height: auto!important;
  padding: 8px 0;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: normal!important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  white-space: normal!important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 32px;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    height: auto;
    line-height: 0.9;
    font-size: 1.3em;
    padding-right: 5px;
}
*/