html {
    scroll-behavior: smooth;
}
@font-face {
    font-family: 'Brush Script MT', cursive;
    src: local('Brush Script MT'), local('BrushScriptMT'), url('https://fonts.googleapis.com/css2?family=Brush+Script+MT&display=swap') format('woff2');
}
.navbar-brand {
    font-family: 'Brush Script MT', cursive;
    font-size: 24px;
}
/* Styling Scrollbar untuk Chrome, Edge, dan Safari */
::-webkit-scrollbar {
    width: 6px; /* Lebar scrollbar */
}

::-webkit-scrollbar-track {
    background: #f1f1f1; /* Warna latar scrollbar */
}

::-webkit-scrollbar-thumb {
    background: #7f8c8d; /* Warna thumb scrollbar */
    border-radius: 3px; /* Bentuk thumb */
}

::-webkit-scrollbar-thumb:hover {
    background: #7f8c8d; /* Warna thumb saat dihover */
}

/* Styling Scrollbar untuk Firefox */
* {
    scrollbar-width: thin; /* Lebar scrollbar */
    scrollbar-color: #7f8c8d #f1f1f1; /* Warna thumb dan latar scrollbar */
}
/* Styling untuk tombol instalasi PWA */
#install-button {
    position: fixed;
    bottom: 20px;
    margin-bottom:40px;
    right: 20px;
    padding: 10px 20px;
    background-color: #2ecc71;
    color: white;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    display: none; /* Sembunyikan tombol secara default */
    z-index: 9999;
}

#install-button:hover {
    background-color: #7f8c8d;
    color: #ffffff;
}
/*Dark Mode*/
/* Add this to your CSS file or within a <style> tag */
/* Add this to your CSS file or within a <style> tag */
body.dark {
    background-color: #1a1a1a; /* Dark background */
    color: #ffffff; /* Light text color */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a; /* Darker border color */
}

body.dark .border-red-600 {
    border-color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-white-800 {
    background-color: #1a1a1a; /* Dark background */
}

body.dark .text-gray-600 {
    color: #b0b0b0; /* Lighter gray for text */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-200 {
    background-color: #4a4a4a; /* Darker background for gray elements */
}

body.dark .text-gray-800 {
    color: #ffffff; /* Lighter gray for text */
}

body.dark .text-red-600 {
    color: #ff6b6b; /* Adjust red for dark mode */
}

body.dark .bg-gray-50 {
    background-color: #3a3a3a; /* Darker background for gray elements */
}

body.dark .bg-white {
    background-color: #2a2a2a; /* Darker background for white elements */
}

body.dark .bg-white-100 {
    background-color: #3a3a3a; /* Darker background for white elements */
}

body.dark .border-2 {
    border-color: #4a4a4a;
}