/* ===== UNIFIED DROPDOWN DESIGN SYSTEM ===== */
/* Single, authoritative dropdown system for ALL dropdown types across the project */

/* ===== BASE DROPDOWN STYLING ===== */
/* Applied to ALL dropdown types - matches text field styling exactly */
/*.form-select,
select.form-select,
select.form-select-sm,
select[data-custom-dropdown],
.custom-dropdown-wrapper .form-select,
.modal .form-select,
.modal select.form-select,
.modal select.form-select-sm,
.modal select[data-custom-dropdown] {*/
    /* Match text field styling exactly */
    /*display: block !important;
    width: 100% !important;
    padding: 0.6rem 2.5rem 0.6rem 1rem !important;
    font-size: 0.9rem !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    color: rgb(33, 37, 41) !important;
    background-color: rgb(255, 255, 255) !important;
    background-clip: padding-box !important;
    border: 2px solid rgb(233, 236, 239) !important;
    border-radius: 22px !important;
    transition: border-color 0.3s ease !important;
    min-height: 38px !important;
    text-align: left !important;
    margin: 0px !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    cursor: pointer !important;*/
    
    /* Arrow positioning - moved to right side */
    /*padding-right: 2.5rem !important;*/
    
    /* Use Bootstrap's arrow icon */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;*/
    
    /* Remove native appearance to use custom arrow */
    /*-webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}*/



/* ===== SMALL DROPDOWN VARIANT ===== */
/* Matches text field styling exactly */
/*.form-select-sm,
select.form-select-sm,
.modal .form-select-sm,
.modal select.form-select-sm {*/
    /* Match text field styling exactly */
    /*display: block !important;
    width: 100% !important;
    padding: 0.6rem 2rem 0.6rem 1rem !important;
    font-size: 0.9rem !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    color: rgb(33, 37, 41) !important;
    background-color: rgb(255, 255, 255) !important;
    background-clip: padding-box !important;
    border: 2px solid rgb(233, 236, 239) !important;
    border-radius: 22px !important;
    transition: border-color 0.3s ease !important;
    min-height: 38px !important;
    text-align: left !important;
    margin: 0px !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    cursor: pointer !important;*/
    
    /* Arrow positioning - moved to right side */
    /*padding-right: 2rem !important;*/
    
    /* Use Bootstrap's arrow icon */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;*/
    
    /* Remove native appearance to use custom arrow */
    /*-webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}*/

/* Small dropdown hover state */
/*.form-select-sm:hover,
select.form-select-sm:hover {
    border-color: var(--primary-hover-color) !important;*/
    
    /* Keep Bootstrap arrow visible on hover */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}*/

/* Small dropdown focus state */
/*.form-select-sm:focus,
select.form-select-sm:focus {
    border-color: var(--primary-hover-color) !important;
    box-shadow: 0 0 0 3px rgba(39, 154, 241, 0.1) !important;
    outline: none !important;*/
    
    /* Rotate arrow upside down on focus/active */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 11l6-6 6 6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}*/

/* ===== CUSTOM DROPDOWN ENHANCEMENTS ===== */
/* Simple hover state for custom dropdowns */
/*.custom-dropdown-wrapper .form-select:hover {
    border-color: var(--primary-hover-color) !important;*/
    
    /* Keep Bootstrap arrow visible on hover */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}

.custom-dropdown-wrapper .form-select:focus {
    border-color: var(--primary-hover-color) !important;
    box-shadow: 0 0 0 3px rgba(39, 154, 241, 0.1) !important;
    outline: none !important;*/
    
    /* Rotate arrow upside down on focus/active */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 11l6-6 6 6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}*/

/* ===== COMPREHENSIVE DOUBLE ARROW ELIMINATION ===== */
/* Remove native browser dropdown arrows project-wide */
/*select.form-select,
select.form-select-sm,
select[data-custom-dropdown] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}*/

/* Hide ALL possible arrow elements that frameworks might add */
/*select.form-select + .dropdown-arrow,
select.form-select + .arrow,
select.form-select + .icon,
select.form-select + .dropdown-icon,
select.form-select + .select-arrow,
select.form-select + .toolkit-arrow,
select.form-select + i,
select.form-select + .fa,
select.form-select + .fas,
select.form-select + .far,
select.form-select + .fal,
select.form-select + .fab,
select.form-select + svg,
select.form-select + .svg,
select.form-select-sm + .dropdown-arrow,
select.form-select-sm + .arrow,
select.form-select-sm + .icon,
select.form-select-sm + .dropdown-icon,
select.form-select-sm + .select-arrow,
select.form-select-sm + .toolkit-arrow,
select.form-select-sm + i,
select.form-select-sm + .fa,
select.form-select-sm + .fas,
select.form-select-sm + .far,
select.form-select-sm + .fal,
select.form-select-sm + .fab,
select.form-select-sm + svg,
select.form-select-sm + .svg,
select[data-custom-dropdown] + .dropdown-arrow,
select[data-custom-dropdown] + .arrow,
select[data-custom-dropdown] + .icon,
select[data-custom-dropdown] + .dropdown-icon,
select[data-custom-dropdown] + .select-arrow,
select[data-custom-dropdown] + .toolkit-arrow,
select[data-custom-dropdown] + i,
select[data-custom-dropdown] + .fa,
select[data-custom-dropdown] + .fas,
select[data-custom-dropdown] + .far,
select[data-custom-dropdown] + .fal,
select[data-custom-dropdown] + .fab,
select[data-custom-dropdown] + svg,
select[data-custom-dropdown] + .svg {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}*/

/* Hide arrow elements within dropdown containers */
/*.custom-dropdown-wrapper .dropdown-arrow,
.custom-dropdown-wrapper .arrow,
.custom-dropdown-wrapper .icon,
.custom-dropdown-wrapper .dropdown-icon,
.custom-dropdown-wrapper .select-arrow,
.custom-dropdown-wrapper .toolkit-arrow,
.custom-dropdown-wrapper i:not(.custom-dropdown-option i),
.custom-dropdown-wrapper .fa,
.custom-dropdown-wrapper .fas,
.custom-dropdown-wrapper .far,
.custom-dropdown-wrapper .fal,
.custom-dropdown-wrapper .fab,
.custom-dropdown-wrapper svg,
.custom-dropdown-wrapper .svg {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}*/

/* Remove any pseudo-elements that might contain arrows */
/*select.form-select::after,
select.form-select::before,
select.form-select-sm::after,
select.form-select-sm::before,
select[data-custom-dropdown]::after,
select[data-custom-dropdown]::before {
    display: none !important;
    content: none !important;
}*/

/* Hide any up-and-down arrow icons specifically */
/*select.form-select + .fa-sort,
select.form-select + .fas.fa-sort,
select.form-select + .fa-arrows-alt-v,
select.form-select + .fas.fa-arrows-alt-v,
select.form-select + .fa-exchange-alt,
select.form-select + .fas.fa-exchange-alt,
select.form-select + .fa-arrows-v,
select.form-select + .fas.fa-arrows-v,
select.form-select + .fa-sort-up,
select.form-select + .fas.fa-sort-up,
select.form-select + .fa-sort-down,
select.form-select + .fas.fa-sort-down,
select.form-select + .fa-chevron-up,
select.form-select + .fas.fa-chevron-up,
select.form-select + .fa-chevron-down,
select.form-select + .fas.fa-chevron-down,
select.form-select-sm + .fa-sort,
select.form-select-sm + .fas.fa-sort,
select.form-select-sm + .fa-arrows-alt-v,
select.form-select-sm + .fas.fa-arrows-alt-v,
select.form-select-sm + .fa-exchange-alt,
select.form-select-sm + .fas.fa-exchange-alt,
select.form-select-sm + .fa-arrows-v,
select.form-select-sm + .fas.fa-arrows-v,
select.form-select-sm + .fa-sort-up,
select.form-select-sm + .fas.fa-sort-up,
select.form-select-sm + .fa-sort-down,
select.form-select-sm + .fas.fa-sort-down,
select.form-select-sm + .fa-chevron-up,
select.form-select-sm + .fas.fa-chevron-up,
select.form-select-sm + .fa-chevron-down,
select.form-select-sm + .fas.fa-chevron-down,
select[data-custom-dropdown] + .fa-sort,
select[data-custom-dropdown] + .fas.fa-sort,
select[data-custom-dropdown] + .fa-arrows-alt-v,
select[data-custom-dropdown] + .fas.fa-arrows-alt-v,
select[data-custom-dropdown] + .fa-exchange-alt,
select[data-custom-dropdown] + .fas.fa-exchange-alt,
select[data-custom-dropdown] + .fa-arrows-v,
select[data-custom-dropdown] + .fas.fa-arrows-v,
select[data-custom-dropdown] + .fa-sort-up,
select[data-custom-dropdown] + .fas.fa-sort-up,
select[data-custom-dropdown] + .fa-sort-down,
select[data-custom-dropdown] + .fas.fa-sort-down,
select[data-custom-dropdown] + .fa-chevron-up,
select[data-custom-dropdown] + .fas.fa-chevron-up,
select[data-custom-dropdown] + .fa-chevron-down,
select[data-custom-dropdown] + .fas.fa-chevron-down {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}*/

/* Hide any Bootstrap or other framework arrow elements */
/*select.form-select + .dropdown-toggle::after,
select.form-select + .dropdown-toggle::before,
select.form-select + .btn::after,
select.form-select + .btn::before,
select.form-select-sm + .dropdown-toggle::after,
select.form-select-sm + .dropdown-toggle::before,
select.form-select-sm + .btn::after,
select.form-select-sm + .btn::before,
select[data-custom-dropdown] + .dropdown-toggle::after,
select[data-custom-dropdown] + .dropdown-toggle::before,
select[data-custom-dropdown] + .btn::after,
select[data-custom-dropdown] + .btn::before {
    display: none !important;
    content: none !important;
}*/

/* ===== UNIFIED PLACEHOLDER STYLING ===== */
/* Style first option (placeholder) to match text field placeholder styling exactly */
/*.form-select option:first-child,
select.form-select option:first-child,
select.form-select-sm option:first-child,
select[data-custom-dropdown] option:first-child,
.custom-dropdown-wrapper .form-select option:first-child,
.modal .form-select option:first-child,
.modal select.form-select option:first-child,
.modal select.form-select-sm option:first-child,
.modal select[data-custom-dropdown] option:first-child {
    color: #9ca3af !important;
    font-weight: 400 !important;
}*/

/* Style the select element itself when placeholder option is selected */
/*.form-select:invalid,
select.form-select:invalid,
select.form-select-sm:invalid,
select[data-custom-dropdown]:invalid,
.custom-dropdown-wrapper .form-select:invalid,
.modal .form-select:invalid,
.modal select.form-select:invalid,
.modal select.form-select-sm:invalid,
.modal select[data-custom-dropdown]:invalid {
    color: #9ca3af !important;
}*/

/* Style custom dropdown display element when showing placeholder text */
/*.custom-dropdown-wrapper .form-select {
    color: #6f7880 !important;*/ /* Default to placeholder color for custom dropdowns */
/*}*/

/* Override with normal color when a real option is selected - removed conflicting rule */

/* ===== MODAL FORM CONTROLS ===== */
/* Ensure modal form controls match dropdown styling */
/*.modal .form-control {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    padding: 0.75rem 1rem !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    background: #ffffff !important;
    border: 1px solid #d1d5db !important;
    border-radius: var(--border-radius) !important;
    color: #374151 !important;
}

.modal .form-control:hover {
    border-color: var(--primary-hover-color) !important;
}

.modal .form-control:focus {
    border-color: var(--primary-hover-color) !important;
    box-shadow: 0 0 0 3px rgba(39, 154, 241, 0.1) !important;
    outline: none !important;
}*/

/* ===== MODAL DROPDOWN BORDER OVERRIDE ===== */
/* Force modal dropdowns to have dark grey border instead of blue */
/*.modal .form-select,
.modal select.form-select,
.modal select.form-select-sm,
.modal select[data-custom-dropdown] {
    border-color: #e9ecef !important;
}

.modal .form-select:hover,
.modal select.form-select:hover,
.modal select.form-select-sm:hover,
.modal select[data-custom-dropdown]:hover {
    border-color: #e9ecef !important;*/
    
    /* Keep Bootstrap arrow visible on hover */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}

.modal .form-select:focus,
.modal select.form-select:focus,
.modal select.form-select-sm:focus,
.modal select[data-custom-dropdown]:focus {
    border-color: #e9ecef !important;
    box-shadow: 0 0 0 0.2rem rgba(233, 236, 239, 0.25) !important;*/
    
    /* Rotate arrow upside down on focus/active */
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 11l6-6 6 6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}*/