:root {
    --primary-color: #007bff;
    /* Define your primary color */
    --background-color: #d2d7dc;
    /* Define your background color */
}

/* Light Mode Styles */
body {
    background-color: var(--background-color);
    color: #000;
    /* Text color for light mode */
}

.btn-primary {
    background-color: var(--primary-color);
    color: #fff;
}

/* Dark Mode Styles */
body.dark-mode {
    background-color: #2b2b2b;
    /* Dark background color */
    color: #fff;
    /* Text color for dark mode */
}

body.dark-mode .btn-primary {
    background-color: var(--primary-color);
    color: #fff;
}

.navbar {
    font-family: 'Kanit', sans-serif;
}

h1 {
    font-family: 'Kanit', sans-serif;
}

label {
    font-family: 'Kanit', sans-serif;
}

button {
    font-family: 'Kanit', sans-serif;
}

.kanit-style{
    font-family: 'Kanit', sans-serif;
}

body.dark-mode #tableResponden td {
    /* border-color: #555; */
    background-color: #2b3035;
    color: #fff;
}

body.dark-mode #tableKustomisasi td {
    /* border-color: #555; */
    background-color: #2b3035;
    color: #fff;
}

.toast-container {
    color: black;
}