Change the color of native input's icons when switching to dark theme

[MangelMaxime]

There is an icon in the far right of the input but using the dark make it is almost impossible to see:

Compared to light theme:

<div class="field">
    <label class="label">Date de début</label>
    <div class="control">
        <input type="date" class="input" value="2024-09-02">
    </div>
    <p class="help"></p>
</div>

[mohammedsharukhh]

.input[type="date"]::-webkit-calendar-picker-indicator {
filter: invert(0); /* Default for light mode: dark icon */
opacity: 1;
}

@media (prefers-color-scheme: dark) {
.input[type="date"]::-webkit-calendar-picker-indicator {
filter: invert(1); /* Invert to make it white in dark mode */
}
}

this will help you !