/* Poprawka dla ikon w formularzach */
.input-with-icon i {
    opacity: 0;
    transition: opacity 0.3s ease, color 0.3s ease;
}

/* Pokaż ikonę, gdy pole jest aktywne */
.input-with-icon:focus-within i {
    opacity: 1;
    color: var(--primary);
}

/* Pokaż ikonę, gdy pole ma wartość */
.input-with-icon.has-value i {
    opacity: 1;
}

/* Dla przeglądarek, które nie obsługują JavaScript */
.input-with-icon input:-webkit-autofill ~ i {
    opacity: 1;
}

/* Tymczasowe rozwiązanie - zawsze pokazuj ikony do momentu wdrożenia JavaScript */
.input-with-icon i {
    opacity: 1;
}