/* assets/custom.css */

/* --- Dropdown and Input Fixes for Dark Theme --- */

/* Style the text inside the main dropdown control box */
.Select-control, .select-input-box {
    background-color: #1e293b !important; /* A slightly lighter dark blue */
    border: 1px solid #3b4f76 !important;
}

/* Style the text for a single selected value */
.Select-value-label, .select-value-label {
    color: #e2e8f0 !important; /* A light, off-white for readability */
}

/* Style the placeholder text (e.g., "Select...") */
.Select-placeholder, .select-placeholder {
    color: #94a3b8 !important; /* A muted light blue/gray */
}

/* Style the dropdown menu that opens */
.Select-menu-outer, .select-menu-outer {
    background-color: #1e293b !important;
    border: 1px solid #3b4f76 !important;
}

/* Style individual options in the dropdown */
.Select-option, .select-option {
    background-color: #1e293b;
    color: #e2e8f0;
}

/* Style the focused/hovered option in the dropdown */
.Select-option.is-focused, .select-option-is-focused {
    background-color: #3b4f76 !important; /* A brighter blue for focus */
    color: #ffffff !important;
}

/* Style the input box for when you type to search */
.Select-input > input {
    color: #e2e8f0 !important;
}

/* Style the small 'x' to clear a selection */
.Select-clear, .select-clear {
    color: #94a3b8 !important;
    font-size: 18px;
}
.Select-clear:hover, .select-clear:hover {
    color: #e2e8f0 !important;
}

/* Style for multi-select value pills */
.Select-value, .select-value {
    background-color: #3b4f76 !important;
    color: #ffffff !important;
    border: 1px solid #4e7ac7 !important;
}