/* Dark theme */
body.theme-dark {
    background-color: #333333; /* Dark gray */
    color: #FFFFFF; /* White */
}

.theme-dark .button {
    background-color: #007BFF; /* Blue */
    color: #FFFFFF; /* White */
}

.theme-dark .button:hover {
    background-color: #0062cc; /* Darker blue */
}

.theme-dark .card {
    border-color: #666666; /* Medium gray */
    background-color: #444444; /* Darker gray */
}

.theme-dark .form__field {
    background-color: #444444; /* Darker gray */
    border-color: #666666; /* Medium gray */
    color: #FFFFFF; /* White */
}

.theme-dark .form__field:focus {
    border-color: #007BFF; /* Blue */
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); /* Light blue shadow */
}

.theme-dark .form__field:invalid {
    border-color: #dc3545; /* Red */
    box-shadow: 0 0 5px rgba(220, 53, 69, 0.5); /* Light red shadow */
}