:root {
    --primary-color: #8e8e8e !important;
    --secondary-color: #808a93 !important;
    --background-color: #ffffff !important;
    --text-color: #323232 !important;
}

@media (prefers-color-scheme: dark) {
    :root {
        --primary-color: #606060 !important;
        --secondary-color: #a5a5a5 !important;
        --background-color: #5a5a5a !important;
        --text-color: #ffffff !important;
    }
}

#payment div.payment_box {
    background-color: #5a5a5a; !important;
    color: #323232;
}


body.dark_theme input[type="text"],
body.dark_theme input[type="email"],
body.dark_theme input[type="tel"],
body.dark_theme select,
body.dark_theme textarea {
    border: 1px solid var(--secondary-color) !important;
    background-color: var(--background-color) !important;
    color: var(--text-color) !important;
    padding: 10px;
    border-radius: 5px;
}

body.dark_theme input[type="text"]:focus,
body.dark_theme input[type="email"]:focus,
body.dark_theme input[type="tel"]:focus,
body.dark_theme select:focus,
body.dark_theme textarea:focus {
    border-color: var(--primary-color) !important;
    outline: none;
}

button:hover {
    background-color: var(--secondary-color) !important;
}

/* Stripe payment method styles */
.payment_method_stripe.dark-theme {
    background-color: var(--background-color) !important;
    color: black !important;
    border: 1px solid var(--secondary-color) !important;
    padding: 10px;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s;
}

/* Stripe payment method styles */
.payment_method_stripe.dark-theme {
    background-color: var(--background-color) !important;
    color: var(--text-color) !important;
    border: 1px solid var(--secondary-color) !important;
    padding: 10px;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s;
}