 .select2-container--bootstrap-5 .select2-selection--single {
     height: auto !important;
     padding: 10px 16px !important;
     font-size: 12px !important;
     border-radius: 8px !important;
     border: 1px solid #d1d5db !important;
 }

 .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
     padding: 0 !important;
     color: #374151 !important;
 }

 .select2-container--bootstrap-5 .select2-selection--single .select2-selection__placeholder {
     color: #9ca3af !important;
 }

 .select2-container--bootstrap-5.select2-container--focus .select2-selection--single {
     border-color: #3b82f6 !important;
     box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
 }

 .select2-dropdown {
     border-radius: 8px !important;
     border: 1px solid #d1d5db !important;
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
 }

 .select2-results__option {
     padding: 4px 16px !important;
     font-size: 12px !important;
 }

 .select2-results__option--highlighted {
     background-color: #f9fafb !important;
     color: #374151 !important;
 }

 .select2-results__option[aria-selected="true"] {
     background-color: #eff6ff !important;
     color: #2563eb !important;
 }

 /* Style untuk create option */
 .select2-results__option.select2-results__option--create {
     background-color: #f8fafc !important;
     color: #2563eb !important;
     font-weight: 500 !important;
     border-top: 1px solid #e5e7eb !important;
 }

 .select2-results__option.select2-results__option--create:before {
     content: "+ ";
     font-weight: bold;
 }


 /* Fix untuk clear button (X) */
 .select2-container--bootstrap-5 .select2-selection--single .select2-selection__clear {
     float: right;
     margin-right: 10px;
     margin-top: 8px;
     cursor: pointer;
     font-size: 12px;
     color: #6c757d;
     line-height: 1;
 }

 .select2-container--bootstrap-5 .select2-selection--single .select2-selection__clear:hover {
     color: #dc3545;
 }

 /* Adjust arrow position ketika ada clear button */
 .select2-container--bootstrap-5 .select2-selection--single .select2-selection__arrow {
     right: 35px;
     /* Give space for clear button */
 }

 /* Fix selection styling */
 .select2-container--bootstrap-5 .select2-selection--single {
     height: auto !important;
     padding: 10px 16px !important;
     font-size: 12px !important;
     border-radius: 8px !important;
     border: 1px solid #d1d5db !important;
 }

 .select2-container--bootstrap-5.select2-container--focus .select2-selection--single {
     border-color: #3b82f6 !important;
     box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
 }

 .select2-dropdown {
     border-radius: 8px !important;
     border: 1px solid #d1d5db !important;
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important;
 }

 /* Fix untuk create option styling */
 .select2-results__option--create {
     background-color: #f0f9ff !important;
     color: #0369a1 !important;
     font-weight: 500 !important;
     border-top: 1px solid #e0f2fe !important;
 }

 .select2-results__option--create:hover {
     background-color: #e0f2fe !important;
 }

 .select2-results__option--create::before {
     content: "+ ";
     font-weight: bold;
     margin-right: 5px;
 }

 .select2-results__option--create::after {
     content: " (CREATE)";
     font-size: 10px;
     background: #0369a1;
     color: white;
     padding: 2px 6px;
     border-radius: 4px;
     margin-left: 8px;
     text-transform: uppercase;
 }

 .bootstrap-table .detail-view {
     transition: all 0.3s ease;
 }