#darkModeToggle {
    border: 2px solid rgb(59 130 246) !important;
    /* Primary blue color */
}

#darkModeToggle:focus,
#darkModeToggle:hover {
    background-color: rgba(var(--primary-rgb), 0.1) !important;
    /* Use the hover background from your original class */
    color: inherit !important;
}

/* Ensure the icons maintain their color */
#darkModeToggle:hover i.pi,
#darkModeToggle:focus i.pi {
    color: #fff !important;
}