title: Unable to change selected option background color | React Select
body: <p>i am using React select component for my dropdown selections. All functionality is working fine but i am unable to style the selected option background color when the option is selected from the dropdown. Tried few options but that too not working.</p>
  <p>Below is the code for the same :-</p>
  <pre><code>import React, { useContext, useState } from &quot;react&quot;;
  import moment from &quot;moment&quot;;
  import Select from &quot;react-select&quot;;
  import DataProvider from &quot;context/DataContext&quot;;
  
  export default function Compare() {
    const [selectedValue, setSelectedValue] = useState([]);
    const {
      fromDate,
      toDate,    
    } = useContext(DataProvider);
  
    const customStyles = {           
      option: (base, state) =&gt; ({
        ...base,      
        color: &quot;#1e2022&quot;,
        backgroundColor: state.isSelected ? &quot;rgba(189,197,209,.3)&quot; : &quot;white&quot;,
        padding: &quot;.5rem 3rem .5rem .5rem&quot;,
        cursor: &quot;pointer&quot;,
      }),       
      singleValue: (provided, state) =&gt; {
        const opacity = state.isDisabled ? 0.5 : 1;
        const transition = &quot;opacity 300ms&quot;;
  
        return { ...provided, opacity, transition };
      },
    };
  
    const options = [
      {
        value: [
          moment(fromDate).subtract(1, &quot;days&quot;),
          moment(toDate).subtract(1, &quot;days&quot;),
        ],
        label: &quot;Previous Day&quot;,
      },
      {
        value: [
          moment(fromDate).subtract(7, &quot;days&quot;),
          moment(toDate).subtract(7, &quot;days&quot;),
        ],
        label: &quot;Previous Week&quot;,
      },
    ];
  
    const handleApply = (event) =&gt; {
      setSelectedValue(event);
    };
  
    return (
      &lt;Select
        onChange={handleApply}
        options={options}
        styles={customStyles}
        placeholder=&quot;Compare to Past&quot;
      /&gt;
    );
  }
  
  
  
  </code></pre>