.bg-custom-green {
    background-color: #34d399; /* Tailwind's green-400 */
}
.text-custom-green {
    color: #34d399; /* Tailwind's green-400 */
}
.dark-mode {
    background-color: #1a202c; /* Tailwind's gray-900 */
    color: #a0aec0; /* Tailwind's gray-400 */
}
.dark-mode .bg-white {
    background-color: #2d3748; /* Tailwind's gray-800 */
}
.dark-mode .text-gray-900 {
    color: #a0aec0; /* Tailwind's gray-400 */
}
.dark-mode .text-gray-700 {
    color: #cbd5e0; /* Tailwind's gray-300 */
}
.dark-mode .text-gray-600 {
    color: #a0aec0; /* Tailwind's gray-400 */
}
.dark-mode .text-gray-500 {
    /*color: #718096; /* Tailwind's gray-600 */
    color: #a0aec0; /* Tailwind's gray-400 */
}
.dark-mode .text-green-600 {
    color: #70ce9b; /* Tailwind's green-400 */
}
.dark-mode .text-green-700 {
    color: #70ce9b; /* Tailwind's green-400 */
}
.dark-mode .border-gray-300 {
    border-color: #4a5568; /* Tailwind's gray-700 */
}
.dark-mode .bg-gray-50 {
    /*background-color: #2d3748; /* Tailwind's gray-800 */
    background-color: #4a5568; /* Tailwind's gray-700 */
}
.dark-mode .bg-gray-100 {
    /*background-color: #2d3748; /* Tailwind's gray-800 */
    background-color: #4a5568; /* Tailwind's gray-700 */
}



.dark-mode .bg-gray-300 {
    background-color: #4a5568; /* Tailwind's gray-700 */
}
.dark-mode .bg-gray-800 {
    background-color: #1a202c; /* Tailwind's gray-1000 */
}
.dark-mode .bg-green-100 {
    background-color: #22543d; /* Tailwind's green-800 */
    color: #e6fffa; /* Optional: Text color for contrast */
}
.dark-mode .text-gray-300 {
    color: #cbd5e0; /* Tailwind's gray-400 */
}
.dark-mode .text-red-600 {
    color: #f87171; /* Tailwind's text-red-400 */
}
.dark-mode .text-gray-400 {
    color: #a0aec0; /* Tailwind's gray-500 */
}
.dark-mode .hover\:bg-gray-700:hover {
    background-color:  #4a5568; /* Tailwind's gray-700 */
}
.dark-mode .hover\:bg-gray-100:hover {
    background-color:  #4a5568; /* Tailwind's gray-700 */
}
.dark-mode input {
    background-color: #4a5568; /* Tailwind's gray-700 */
    color: #a0aec0; /* Tailwind's gray-400 */
}
.dark-mode input::placeholder {
    color: #718096; /* Tailwind's gray-600 */
}
.dark-mode .sub-menu-item {
    color: #a0aec0; /* Tailwind's gray-400 */
}
.dark-mode select {
    background-color: #4a5568; /* Tailwind's gray-700 */
    color: #e2e8f0; /* Tailwind's gray-200 */
    border-color: #4a5568; /* Tailwind's gray-700 */
}

.dark-mode pre {
    background-color: #4a5568; /* Tailwind's gray-700 */
    color: #a0aec0; /* Tailwind's gray-400 */
}
html, body {
    height: 100%;
}

/*body {
  display: flex;
  flex-direction: column;
}*/

/*main {
  flex-grow: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 100%;
}*/

.bg-subtle-green {
    background-color: #edf7f2; /* A very light green */
    color: #065f46; /* Darker green for contrast */
}

.dark-mode .bg-subtle-green {
    background-color: #1e3a34; /* A dark but subtle green */
    color: #9ae6b4; /* Light green text for contrast */
}
.bg-subtle-red {
    background-color: #fbe4e6; /* A very light red */
    color: #7f1d1d; /* Darker red for contrast */
}

.dark-mode .bg-subtle-red {
    background-color: #3b0d0d; /* A dark but subtle red */
    color: #fecaca; /* Light red text for contrast */
}

/* Ensure dropdowns are above all other content */
#tools-dropdown-menu,
#api-dropdown-menu,
#research-dropdown-menu,
#data-dropdown-menu {
    z-index: 1000; /* Higher z-index */
}

/* Spinner animation */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.animate-spin {
    animation: spin 1s linear infinite;
}

.spinner {
    display: none; /* Hidden initially */
}

.spinner.visible {
    display: inline-block; /* Show when visible class is added */
}