robutt-plugin / index.html
Boobs00's picture
Add 3 files
d2bf541 verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hermit Dev Tools Pro - Plugin System</title>
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
'hermit-blue': '#2563eb',
'hermit-purple': '#7c3aed',
'hermit-pink': '#ec4899',
'hermit-dark': '#1e293b',
'hermit-light': '#f8fafc',
},
fontFamily: {
'sans': ['Inter', 'ui-sans-serif', 'system-ui'],
'mono': ['Fira Code', 'ui-monospace', 'SFMono-Regular'],
},
}
}
}
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Fira+Code:wght@400;500&display=swap">
<style>
:root {
--hermit-accent: #2563eb;
--hermit-secondary: #7c3aed;
}
body {
font-family: 'Inter', sans-serif;
background-color: #f8fafc;
color: #1e293b;
}
.code-font {
font-family: 'Fira Code', monospace;
}
.plugin-card {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
border: 1px solid #e2e8f0;
position: relative;
overflow: hidden;
}
.plugin-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
border-color: var(--hermit-accent);
}
.plugin-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 4px;
height: 0;
background-color: var(--hermit-accent);
transition: height 0.3s ease;
}
.plugin-card:hover::before {
height: 100%;
}
.star-rating {
color: #fbbf24;
}
.tab-active {
border-bottom: 3px solid var(--hermit-accent);
color: var(--hermit-accent);
font-weight: 600;
}
.plugin-badge {
position: absolute;
top: -8px;
right: -8px;
width: 24px;
height: 24px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.dropdown-content {
display: none;
position: absolute;
right: 0;
min-width: 200px;
z-index: 50;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
border-radius: 0.5rem;
background-color: white;
}
.dropdown:hover .dropdown-content {
display: block;
animation: fadeIn 0.2s ease-out;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}
.progress-bar {
height: 6px;
border-radius: 3px;
background-color: #e5e7eb;
}
.progress-fill {
height: 100%;
border-radius: 3px;
background-color: var(--hermit-accent);
transition: width 0.3s ease;
}
.skeleton {
animation: pulse 2s infinite;
background-color: #e5e7eb;
}
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
.tag {
transition: all 0.2s ease;
}
.tag:hover {
transform: scale(1.05);
}
.modal-overlay {
background-color: rgba(0, 0, 0, 0.5);
backdrop-filter: blur(5px);
}
.modal-content {
animation: modalFadeIn 0.3s ease-out;
}
@keyframes modalFadeIn {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
.plugin-icon {
transition: transform 0.3s ease;
}
.plugin-card:hover .plugin-icon {
transform: rotate(10deg);
}
.search-input:focus {
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
}
.install-btn {
position: relative;
overflow: hidden;
}
.install-btn::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 5px;
height: 5px;
background: rgba(255, 255, 255, 0.5);
opacity: 0;
border-radius: 100%;
transform: scale(1, 1) translate(-50%, -50%);
transform-origin: 50% 50%;
}
.install-btn:focus:not(:active)::after {
animation: ripple 1s ease-out;
}
@keyframes ripple {
0% {
transform: scale(0, 0);
opacity: 0.5;
}
100% {
transform: scale(20, 20);
opacity: 0;
}
}
.notification-badge {
animation: ping 2s cubic-bezier(0, 0, 0.2, 1) infinite;
}
@keyframes ping {
75%, 100% {
transform: scale(1.2);
opacity: 0;
}
}
.sidebar {
transition: all 0.3s ease;
}
.sidebar-item:hover {
background-color: rgba(37, 99, 235, 0.1);
}
.sidebar-item.active {
background-color: rgba(37, 99, 235, 0.1);
border-left: 3px solid var(--hermit-accent);
}
.dark-mode {
background-color: #0f172a;
color: #f8fafc;
}
.dark-mode .plugin-card {
background-color: #1e293b;
border-color: #334155;
}
.dark-mode .dropdown-content {
background-color: #1e293b;
border: 1px solid #334155;
}
.dark-mode a, .dark-mode .text-gray-700 {
color: #e2e8f0;
}
.dark-mode .text-gray-600 {
color: #94a3b8;
}
.dark-mode .bg-gray-50 {
background-color: #1e293b;
}
.dark-mode .border-gray-200 {
border-color: #334155;
}
.dark-mode .search-input {
background-color: #1e293b;
border-color: #334155;
color: #f8fafc;
}
.dark-mode .search-input:focus {
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.3);
}
.dark-mode .skeleton {
background-color: #334155;
}
.dark-mode .plugin-card:hover {
border-color: var(--hermit-accent);
}
.dark-mode .plugin-card::before {
background-color: var(--hermit-accent);
}
.dark-mode .dropdown-content a {
color: #e2e8f0;
}
.dark-mode .dropdown-content a:hover {
background-color: #334155;
}
.dark-mode .modal-content {
background-color: #1e293b;
color: #f8fafc;
}
.dark-mode .modal-content .text-gray-800 {
color: #f8fafc;
}
.dark-mode .modal-content .text-gray-600 {
color: #94a3b8;
}
.dark-mode .modal-content .bg-gray-50 {
background-color: #1e293b;
}
.dark-mode .modal-content .border-gray-200 {
border-color: #334155;
}
.dark-mode .modal-content .bg-gray-100 {
background-color: #334155;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-100:hover {
background-color: #475569;
}
.dark-mode .modal-content .bg-blue-600 {
background-color: var(--hermit-accent);
}
.dark-mode .modal-content .bg-blue-600:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-red-100 {
background-color: #7f1d1d;
color: #fecaca;
}
.dark-mode .modal-content .bg-red-100:hover {
background-color: #991b1b;
}
.dark-mode .modal-content .bg-yellow-100 {
background-color: #713f12;
color: #fde68a;
}
.dark-mode .modal-content .bg-yellow-100:hover {
background-color: #854d0e;
}
.dark-mode .modal-content .bg-green-100 {
background-color: #14532d;
color: #bbf7d0;
}
.dark-mode .modal-content .bg-green-100:hover {
background-color: #166534;
}
.dark-mode .modal-content .bg-purple-100 {
background-color: #4c1d95;
color: #ddd6fe;
}
.dark-mode .modal-content .bg-purple-100:hover {
background-color: #5b21b6;
}
.dark-mode .modal-content .bg-indigo-100 {
background-color: #3730a3;
color: #c7d2fe;
}
.dark-mode .modal-content .bg-indigo-100:hover {
background-color: #4338ca;
}
.dark-mode .modal-content .bg-pink-100 {
background-color: #831843;
color: #fbcfe8;
}
.dark-mode .modal-content .bg-pink-100:hover {
background-color: #9d174d;
}
.dark-mode .modal-content .bg-teal-100 {
background-color: #134e4a;
color: #99f6e4;
}
.dark-mode .modal-content .bg-teal-100:hover {
background-color: #115e59;
}
.dark-mode .modal-content .bg-orange-100 {
background-color: #7c2d12;
color: #fed7aa;
}
.dark-mode .modal-content .bg-orange-100:hover {
background-color: #9a3412;
}
.dark-mode .modal-content .bg-gray-100 {
background-color: #334155;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-100:hover {
background-color: #475569;
}
.dark-mode .modal-content .bg-blue-50 {
background-color: #1e3a8a;
color: #bfdbfe;
}
.dark-mode .modal-content .bg-blue-50:hover {
background-color: #1e40af;
}
.dark-mode .modal-content .bg-green-50 {
background-color: #14532d;
color: #bbf7d0;
}
.dark-mode .modal-content .bg-green-50:hover {
background-color: #166534;
}
.dark-mode .modal-content .bg-purple-50 {
background-color: #4c1d95;
color: #ddd6fe;
}
.dark-mode .modal-content .bg-purple-50:hover {
background-color: #5b21b6;
}
.dark-mode .modal-content .bg-yellow-50 {
background-color: #713f12;
color: #fde68a;
}
.dark-mode .modal-content .bg-yellow-50:hover {
background-color: #854d0e;
}
.dark-mode .modal-content .bg-red-50 {
background-color: #7f1d1d;
color: #fecaca;
}
.dark-mode .modal-content .bg-red-50:hover {
background-color: #991b1b;
}
.dark-mode .modal-content .bg-indigo-50 {
background-color: #3730a3;
color: #c7d2fe;
}
.dark-mode .modal-content .bg-indigo-50:hover {
background-color: #4338ca;
}
.dark-mode .modal-content .bg-pink-50 {
background-color: #831843;
color: #fbcfe8;
}
.dark-mode .modal-content .bg-pink-50:hover {
background-color: #9d174d;
}
.dark-mode .modal-content .bg-teal-50 {
background-color: #134e4a;
color: #99f6e4;
}
.dark-mode .modal-content .bg-teal-50:hover {
background-color: #115e59;
}
.dark-mode .modal-content .bg-orange-50 {
background-color: #7c2d12;
color: #fed7aa;
}
.dark-mode .modal-content .bg-orange-50:hover {
background-color: #9a3412;
}
.dark-mode .modal-content .bg-gray-50 {
background-color: #1e293b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-50:hover {
background-color: #334155;
}
.dark-mode .modal-content .bg-white {
background-color: #1e293b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-white:hover {
background-color: #334155;
}
.dark-mode .modal-content .bg-black {
background-color: #f8fafc;
color: #1e293b;
}
.dark-mode .modal-content .bg-black:hover {
background-color: #e2e8f0;
}
.dark-mode .modal-content .bg-gray-200 {
background-color: #334155;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-200:hover {
background-color: #475569;
}
.dark-mode .modal-content .bg-gray-300 {
background-color: #475569;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-300:hover {
background-color: #64748b;
}
.dark-mode .modal-content .bg-gray-400 {
background-color: #64748b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-400:hover {
background-color: #94a3b8;
}
.dark-mode .modal-content .bg-gray-500 {
background-color: #94a3b8;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-500:hover {
background-color: #cbd5e1;
}
.dark-mode .modal-content .bg-gray-600 {
background-color: #cbd5e1;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-600:hover {
background-color: #e2e8f0;
}
.dark-mode .modal-content .bg-gray-700 {
background-color: #e2e8f0;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-700:hover {
background-color: #f1f5f9;
}
.dark-mode .modal-content .bg-gray-800 {
background-color: #f1f5f9;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-800:hover {
background-color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-900 {
background-color: #f8fafc;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-900:hover {
background-color: #ffffff;
}
.dark-mode .modal-content .bg-blue-100 {
background-color: #1e3a8a;
color: #bfdbfe;
}
.dark-mode .modal-content .bg-blue-100:hover {
background-color: #1e40af;
}
.dark-mode .modal-content .bg-blue-200 {
background-color: #1e40af;
color: #93c5fd;
}
.dark-mode .modal-content .bg-blue-200:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-300 {
background-color: #1d4ed8;
color: #60a5fa;
}
.dark-mode .modal-content .bg-blue-300:hover {
background-color: #2563eb;
}
.dark-mode .modal-content .bg-blue-400 {
background-color: #2563eb;
color: #3b82f6;
}
.dark-mode .modal-content .bg-blue-400:hover {
background-color: #3b82f6;
}
.dark-mode .modal-content .bg-blue-500 {
background-color: #3b82f6;
color: #2563eb;
}
.dark-mode .modal-content .bg-blue-500:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-600 {
background-color: #1d4ed8;
color: #1e40af;
}
.dark-mode .modal-content .bg-blue-600:hover {
background-color: #1e3a8a;
}
.dark-mode .modal-content .bg-blue-700 {
background-color: #1e3a8a;
color: #1e40af;
}
.dark-mode .modal-content .bg-blue-700:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-800 {
background-color: #1e40af;
color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-800:hover {
background-color: #2563eb;
}
.dark-mode .modal-content .bg-blue-900 {
background-color: #1d4ed8;
color: #2563eb;
}
.dark-mode .modal-content .bg-blue-900:hover {
background-color: #3b82f6;
}
.dark-mode .modal-content .bg-indigo-100 {
background-color: #3730a3;
color: #c7d2fe;
}
.dark-mode .modal-content .bg-indigo-100:hover {
background-color: #4338ca;
}
.dark-mode .modal-content .bg-indigo-200 {
background-color: #4338ca;
color: #a5b4fc;
}
.dark-mode .modal-content .bg-indigo-200:hover {
background-color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-300 {
background-color: #4f46e5;
color: #818cf8;
}
.dark-mode .modal-content .bg-indigo-300:hover {
background-color: #6366f1;
}
.dark-mode .modal-content .bg-indigo-400 {
background-color: #6366f1;
color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-400:hover {
background-color: #4338ca;
}
.dark-mode .modal-content .bg-indigo-500 {
background-color: #4338ca;
color: #3730a3;
}
.dark-mode .modal-content .bg-indigo-500:hover {
background-color: #312e81;
}
.dark-mode .modal-content .bg-indigo-600 {
background-color: #3730a3;
color: #4338ca;
}
.dark-mode .modal-content .bg-indigo-600:hover {
background-color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-700 {
background-color: #4338ca;
color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-700:hover {
background-color: #6366f1;
}
.dark-mode .modal-content .bg-indigo-800 {
background-color: #4f46e5;
color: #6366f1;
}
.dark-mode .modal-content .bg-indigo-800:hover {
background-color: #818cf8;
}
.dark-mode .modal-content .bg-indigo-900 {
background-color: #6366f1;
color: #818cf8;
}
.dark-mode .modal-content .bg-indigo-900:hover {
background-color: #a5b4fc;
}
.dark-mode .modal-content .bg-purple-100 {
background-color: #4c1d95;
color: #ddd6fe;
}
.dark-mode .modal-content .bg-purple-100:hover {
background-color: #5b21b6;
}
.dark-mode .modal-content .bg-purple-200 {
background-color: #5b21b6;
color: #c4b5fd;
}
.dark-mode .modal-content .bg-purple-200:hover {
background-color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-300 {
background-color: #6d28d9;
color: #a78bfa;
}
.dark-mode .modal-content .bg-purple-300:hover {
background-color: #7c3aed;
}
.dark-mode .modal-content .bg-purple-400 {
background-color: #7c3aed;
color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-400:hover {
background-color: #5b21b6;
}
.dark-mode .modal-content .bg-purple-500 {
background-color: #5b21b6;
color: #4c1d95;
}
.dark-mode .modal-content .bg-purple-500:hover {
background-color: #3b0764;
}
.dark-mode .modal-content .bg-purple-600 {
background-color: #4c1d95;
color: #5b21b6;
}
.dark-mode .modal-content .bg-purple-600:hover {
background-color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-700 {
background-color: #5b21b6;
color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-700:hover {
background-color: #7c3aed;
}
.dark-mode .modal-content .bg-purple-800 {
background-color: #6d28d9;
color: #7c3aed;
}
.dark-mode .modal-content .bg-purple-800:hover {
background-color: #a78bfa;
}
.dark-mode .modal-content .bg-purple-900 {
background-color: #7c3aed;
color: #a78bfa;
}
.dark-mode .modal-content .bg-purple-900:hover {
background-color: #c4b5fd;
}
.dark-mode .modal-content .bg-pink-100 {
background-color: #831843;
color: #fbcfe8;
}
.dark-mode .modal-content .bg-pink-100:hover {
background-color: #9d174d;
}
.dark-mode .modal-content .bg-pink-200 {
background-color: #9d174d;
color: #f9a8d4;
}
.dark-mode .modal-content .bg-pink-200:hover {
background-color: #be185d;
}
.dark-mode .modal-content .bg-pink-300 {
background-color: #be185d;
color: #f472b6;
}
.dark-mode .modal-content .bg-pink-300:hover {
background-color: #ec4899;
}
.dark-mode .modal-content .bg-pink-400 {
background-color: #ec4899;
color: #be185d;
}
.dark-mode .modal-content .bg-pink-400:hover {
background-color: #9d174d;
}
.dark-mode .modal-content .bg-pink-500 {
background-color: #9d174d;
color: #831843;
}
.dark-mode .modal-content .bg-pink-500:hover {
background-color: #500724;
}
.dark-mode .modal-content .bg-pink-600 {
background-color: #831843;
color: #9d174d;
}
.dark-mode .modal-content .bg-pink-600:hover {
background-color: #be185d;
}
.dark-mode .modal-content .bg-pink-700 {
background-color: #9d174d;
color: #be185d;
}
.dark-mode .modal-content .bg-pink-700:hover {
background-color: #ec4899;
}
.dark-mode .modal-content .bg-pink-800 {
background-color: #be185d;
color: #ec4899;
}
.dark-mode .modal-content .bg-pink-800:hover {
background-color: #f472b6;
}
.dark-mode .modal-content .bg-pink-900 {
background-color: #ec4899;
color: #f472b6;
}
.dark-mode .modal-content .bg-pink-900:hover {
background-color: #f9a8d4;
}
.dark-mode .modal-content .bg-red-100 {
background-color: #7f1d1d;
color: #fecaca;
}
.dark-mode .modal-content .bg-red-100:hover {
background-color: #991b1b;
}
.dark-mode .modal-content .bg-red-200 {
background-color: #991b1b;
color: #fca5a5;
}
.dark-mode .modal-content .bg-red-200:hover {
background-color: #b91c1c;
}
.dark-mode .modal-content .bg-red-300 {
background-color: #b91c1c;
color: #f87171;
}
.dark-mode .modal-content .bg-red-300:hover {
background-color: #dc2626;
}
.dark-mode .modal-content .bg-red-400 {
background-color: #dc2626;
color: #b91c1c;
}
.dark-mode .modal-content .bg-red-400:hover {
background-color: #991b1b;
}
.dark-mode .modal-content .bg-red-500 {
background-color: #991b1b;
color: #7f1d1d;
}
.dark-mode .modal-content .bg-red-500:hover {
background-color: #450a0a;
}
.dark-mode .modal-content .bg-red-600 {
background-color: #7f1d1d;
color: #991b1b;
}
.dark-mode .modal-content .bg-red-600:hover {
background-color: #b91c1c;
}
.dark-mode .modal-content .bg-red-700 {
background-color: #991b1b;
color: #b91c1c;
}
.dark-mode .modal-content .bg-red-700:hover {
background-color: #dc2626;
}
.dark-mode .modal-content .bg-red-800 {
background-color: #b91c1c;
color: #dc2626;
}
.dark-mode .modal-content .bg-red-800:hover {
background-color: #f87171;
}
.dark-mode .modal-content .bg-red-900 {
background-color: #dc2626;
color: #f87171;
}
.dark-mode .modal-content .bg-red-900:hover {
background-color: #fca5a5;
}
.dark-mode .modal-content .bg-yellow-100 {
background-color: #713f12;
color: #fde68a;
}
.dark-mode .modal-content .bg-yellow-100:hover {
background-color: #854d0e;
}
.dark-mode .modal-content .bg-yellow-200 {
background-color: #854d0e;
color: #fcd34d;
}
.dark-mode .modal-content .bg-yellow-200:hover {
background-color: #a16207;
}
.dark-mode .modal-content .bg-yellow-300 {
background-color: #a16207;
color: #fbbf24;
}
.dark-mode .modal-content .bg-yellow-300:hover {
background-color: #d97706;
}
.dark-mode .modal-content .bg-yellow-400 {
background-color: #d97706;
color: #a16207;
}
.dark-mode .modal-content .bg-yellow-400:hover {
background-color: #854d0e;
}
.dark-mode .modal-content .bg-yellow-500 {
background-color: #854d0e;
color: #713f12;
}
.dark-mode .modal-content .bg-yellow-500:hover {
background-color: #422006;
}
.dark-mode .modal-content .bg-yellow-600 {
background-color: #713f12;
color: #854d0e;
}
.dark-mode .modal-content .bg-yellow-600:hover {
background-color: #a16207;
}
.dark-mode .modal-content .bg-yellow-700 {
background-color: #854d0e;
color: #a16207;
}
.dark-mode .modal-content .bg-yellow-700:hover {
background-color: #d97706;
}
.dark-mode .modal-content .bg-yellow-800 {
background-color: #a16207;
color: #d97706;
}
.dark-mode .modal-content .bg-yellow-800:hover {
background-color: #fbbf24;
}
.dark-mode .modal-content .bg-yellow-900 {
background-color: #d97706;
color: #fbbf24;
}
.dark-mode .modal-content .bg-yellow-900:hover {
background-color: #fcd34d;
}
.dark-mode .modal-content .bg-green-100 {
background-color: #14532d;
color: #bbf7d0;
}
.dark-mode .modal-content .bg-green-100:hover {
background-color: #166534;
}
.dark-mode .modal-content .bg-green-200 {
background-color: #166534;
color: #86efac;
}
.dark-mode .modal-content .bg-green-200:hover {
background-color: #15803d;
}
.dark-mode .modal-content .bg-green-300 {
background-color: #15803d;
color: #4ade80;
}
.dark-mode .modal-content .bg-green-300:hover {
background-color: #16a34a;
}
.dark-mode .modal-content .bg-green-400 {
background-color: #16a34a;
color: #15803d;
}
.dark-mode .modal-content .bg-green-400:hover {
background-color: #166534;
}
.dark-mode .modal-content .bg-green-500 {
background-color: #166534;
color: #14532d;
}
.dark-mode .modal-content .bg-green-500:hover {
background-color: #052e16;
}
.dark-mode .modal-content .bg-green-600 {
background-color: #14532d;
color: #166534;
}
.dark-mode .modal-content .bg-green-600:hover {
background-color: #15803d;
}
.dark-mode .modal-content .bg-green-700 {
background-color: #166534;
color: #15803d;
}
.dark-mode .modal-content .bg-green-700:hover {
background-color: #16a34a;
}
.dark-mode .modal-content .bg-green-800 {
background-color: #15803d;
color: #16a34a;
}
.dark-mode .modal-content .bg-green-800:hover {
background-color: #4ade80;
}
.dark-mode .modal-content .bg-green-900 {
background-color: #16a34a;
color: #4ade80;
}
.dark-mode .modal-content .bg-green-900:hover {
background-color: #86efac;
}
.dark-mode .modal-content .bg-teal-100 {
background-color: #134e4a;
color: #99f6e4;
}
.dark-mode .modal-content .bg-teal-100:hover {
background-color: #115e59;
}
.dark-mode .modal-content .bg-teal-200 {
background-color: #115e59;
color: #5eead4;
}
.dark-mode .modal-content .bg-teal-200:hover {
background-color: #0f766e;
}
.dark-mode .modal-content .bg-teal-300 {
background-color: #0f766e;
color: #2dd4bf;
}
.dark-mode .modal-content .bg-teal-300:hover {
background-color: #0d9488;
}
.dark-mode .modal-content .bg-teal-400 {
background-color: #0d9488;
color: #0f766e;
}
.dark-mode .modal-content .bg-teal-400:hover {
background-color: #115e59;
}
.dark-mode .modal-content .bg-teal-500 {
background-color: #115e59;
color: #134e4a;
}
.dark-mode .modal-content .bg-teal-500:hover {
background-color: #042f2e;
}
.dark-mode .modal-content .bg-teal-600 {
background-color: #134e4a;
color: #115e59;
}
.dark-mode .modal-content .bg-teal-600:hover {
background-color: #0f766e;
}
.dark-mode .modal-content .bg-teal-700 {
background-color: #115e59;
color: #0f766e;
}
.dark-mode .modal-content .bg-teal-700:hover {
background-color: #0d9488;
}
.dark-mode .modal-content .bg-teal-800 {
background-color: #0f766e;
color: #0d9488;
}
.dark-mode .modal-content .bg-teal-800:hover {
background-color: #2dd4bf;
}
.dark-mode .modal-content .bg-teal-900 {
background-color: #0d9488;
color: #2dd4bf;
}
.dark-mode .modal-content .bg-teal-900:hover {
background-color: #5eead4;
}
.dark-mode .modal-content .bg-orange-100 {
background-color: #7c2d12;
color: #fed7aa;
}
.dark-mode .modal-content .bg-orange-100:hover {
background-color: #9a3412;
}
.dark-mode .modal-content .bg-orange-200 {
background-color: #9a3412;
color: #fdba74;
}
.dark-mode .modal-content .bg-orange-200:hover {
background-color: #c2410c;
}
.dark-mode .modal-content .bg-orange-300 {
background-color: #c2410c;
color: #fb923c;
}
.dark-mode .modal-content .bg-orange-300:hover {
background-color: #ea580c;
}
.dark-mode .modal-content .bg-orange-400 {
background-color: #ea580c;
color: #c2410c;
}
.dark-mode .modal-content .bg-orange-400:hover {
background-color: #9a3412;
}
.dark-mode .modal-content .bg-orange-500 {
background-color: #9a3412;
color: #7c2d12;
}
.dark-mode .modal-content .bg-orange-500:hover {
background-color: #431407;
}
.dark-mode .modal-content .bg-orange-600 {
background-color: #7c2d12;
color: #9a3412;
}
.dark-mode .modal-content .bg-orange-600:hover {
background-color: #c2410c;
}
.dark-mode .modal-content .bg-orange-700 {
background-color: #9a3412;
color: #c2410c;
}
.dark-mode .modal-content .bg-orange-700:hover {
background-color: #ea580c;
}
.dark-mode .modal-content .bg-orange-800 {
background-color: #c2410c;
color: #ea580c;
}
.dark-mode .modal-content .bg-orange-800:hover {
background-color: #fb923c;
}
.dark-mode .modal-content .bg-orange-900 {
background-color: #ea580c;
color: #fb923c;
}
.dark-mode .modal-content .bg-orange-900:hover {
background-color: #fdba74;
}
.dark-mode .modal-content .bg-gray-100 {
background-color: #1e293b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-100:hover {
background-color: #334155;
}
.dark-mode .modal-content .bg-gray-200 {
background-color: #334155;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-200:hover {
background-color: #475569;
}
.dark-mode .modal-content .bg-gray-300 {
background-color: #475569;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-300:hover {
background-color: #64748b;
}
.dark-mode .modal-content .bg-gray-400 {
background-color: #64748b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-400:hover {
background-color: #94a3b8;
}
.dark-mode .modal-content .bg-gray-500 {
background-color: #94a3b8;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-500:hover {
background-color: #cbd5e1;
}
.dark-mode .modal-content .bg-gray-600 {
background-color: #cbd5e1;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-600:hover {
background-color: #e2e8f0;
}
.dark-mode .modal-content .bg-gray-700 {
background-color: #e2e8f0;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-700:hover {
background-color: #f1f5f9;
}
.dark-mode .modal-content .bg-gray-800 {
background-color: #f1f5f9;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-800:hover {
background-color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-900 {
background-color: #f8fafc;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-900:hover {
background-color: #ffffff;
}
.dark-mode .modal-content .bg-blue-100 {
background-color: #1e3a8a;
color: #bfdbfe;
}
.dark-mode .modal-content .bg-blue-100:hover {
background-color: #1e40af;
}
.dark-mode .modal-content .bg-blue-200 {
background-color: #1e40af;
color: #93c5fd;
}
.dark-mode .modal-content .bg-blue-200:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-300 {
background-color: #1d4ed8;
color: #60a5fa;
}
.dark-mode .modal-content .bg-blue-300:hover {
background-color: #2563eb;
}
.dark-mode .modal-content .bg-blue-400 {
background-color: #2563eb;
color: #3b82f6;
}
.dark-mode .modal-content .bg-blue-400:hover {
background-color: #3b82f6;
}
.dark-mode .modal-content .bg-blue-500 {
background-color: #3b82f6;
color: #2563eb;
}
.dark-mode .modal-content .bg-blue-500:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-600 {
background-color: #1d4ed8;
color: #1e40af;
}
.dark-mode .modal-content .bg-blue-600:hover {
background-color: #1e3a8a;
}
.dark-mode .modal-content .bg-blue-700 {
background-color: #1e3a8a;
color: #1e40af;
}
.dark-mode .modal-content .bg-blue-700:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-800 {
background-color: #1e40af;
color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-800:hover {
background-color: #2563eb;
}
.dark-mode .modal-content .bg-blue-900 {
background-color: #1d4ed8;
color: #2563eb;
}
.dark-mode .modal-content .bg-blue-900:hover {
background-color: #3b82f6;
}
.dark-mode .modal-content .bg-indigo-100 {
background-color: #3730a3;
color: #c7d2fe;
}
.dark-mode .modal-content .bg-indigo-100:hover {
background-color: #4338ca;
}
.dark-mode .modal-content .bg-indigo-200 {
background-color: #4338ca;
color: #a5b4fc;
}
.dark-mode .modal-content .bg-indigo-200:hover {
background-color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-300 {
background-color: #4f46e5;
color: #818cf8;
}
.dark-mode .modal-content .bg-indigo-300:hover {
background-color: #6366f1;
}
.dark-mode .modal-content .bg-indigo-400 {
background-color: #6366f1;
color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-400:hover {
background-color: #4338ca;
}
.dark-mode .modal-content .bg-indigo-500 {
background-color: #4338ca;
color: #3730a3;
}
.dark-mode .modal-content .bg-indigo-500:hover {
background-color: #312e81;
}
.dark-mode .modal-content .bg-indigo-600 {
background-color: #3730a3;
color: #4338ca;
}
.dark-mode .modal-content .bg-indigo-600:hover {
background-color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-700 {
background-color: #4338ca;
color: #4f46e5;
}
.dark-mode .modal-content .bg-indigo-700:hover {
background-color: #6366f1;
}
.dark-mode .modal-content .bg-indigo-800 {
background-color: #4f46e5;
color: #6366f1;
}
.dark-mode .modal-content .bg-indigo-800:hover {
background-color: #818cf8;
}
.dark-mode .modal-content .bg-indigo-900 {
background-color: #6366f1;
color: #818cf8;
}
.dark-mode .modal-content .bg-indigo-900:hover {
background-color: #a5b4fc;
}
.dark-mode .modal-content .bg-purple-100 {
background-color: #4c1d95;
color: #ddd6fe;
}
.dark-mode .modal-content .bg-purple-100:hover {
background-color: #5b21b6;
}
.dark-mode .modal-content .bg-purple-200 {
background-color: #5b21b6;
color: #c4b5fd;
}
.dark-mode .modal-content .bg-purple-200:hover {
background-color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-300 {
background-color: #6d28d9;
color: #a78bfa;
}
.dark-mode .modal-content .bg-purple-300:hover {
background-color: #7c3aed;
}
.dark-mode .modal-content .bg-purple-400 {
background-color: #7c3aed;
color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-400:hover {
background-color: #5b21b6;
}
.dark-mode .modal-content .bg-purple-500 {
background-color: #5b21b6;
color: #4c1d95;
}
.dark-mode .modal-content .bg-purple-500:hover {
background-color: #3b0764;
}
.dark-mode .modal-content .bg-purple-600 {
background-color: #4c1d95;
color: #5b21b6;
}
.dark-mode .modal-content .bg-purple-600:hover {
background-color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-700 {
background-color: #5b21b6;
color: #6d28d9;
}
.dark-mode .modal-content .bg-purple-700:hover {
background-color: #7c3aed;
}
.dark-mode .modal-content .bg-purple-800 {
background-color: #6d28d9;
color: #7c3aed;
}
.dark-mode .modal-content .bg-purple-800:hover {
background-color: #a78bfa;
}
.dark-mode .modal-content .bg-purple-900 {
background-color: #7c3aed;
color: #a78bfa;
}
.dark-mode .modal-content .bg-purple-900:hover {
background-color: #c4b5fd;
}
.dark-mode .modal-content .bg-pink-100 {
background-color: #831843;
color: #fbcfe8;
}
.dark-mode .modal-content .bg-pink-100:hover {
background-color: #9d174d;
}
.dark-mode .modal-content .bg-pink-200 {
background-color: #9d174d;
color: #f9a8d4;
}
.dark-mode .modal-content .bg-pink-200:hover {
background-color: #be185d;
}
.dark-mode .modal-content .bg-pink-300 {
background-color: #be185d;
color: #f472b6;
}
.dark-mode .modal-content .bg-pink-300:hover {
background-color: #ec4899;
}
.dark-mode .modal-content .bg-pink-400 {
background-color: #ec4899;
color: #be185d;
}
.dark-mode .modal-content .bg-pink-400:hover {
background-color: #9d174d;
}
.dark-mode .modal-content .bg-pink-500 {
background-color: #9d174d;
color: #831843;
}
.dark-mode .modal-content .bg-pink-500:hover {
background-color: #500724;
}
.dark-mode .modal-content .bg-pink-600 {
background-color: #831843;
color: #9d174d;
}
.dark-mode .modal-content .bg-pink-600:hover {
background-color: #be185d;
}
.dark-mode .modal-content .bg-pink-700 {
background-color: #9d174d;
color: #be185d;
}
.dark-mode .modal-content .bg-pink-700:hover {
background-color: #ec4899;
}
.dark-mode .modal-content .bg-pink-800 {
background-color: #be185d;
color: #ec4899;
}
.dark-mode .modal-content .bg-pink-800:hover {
background-color: #f472b6;
}
.dark-mode .modal-content .bg-pink-900 {
background-color: #ec4899;
color: #f472b6;
}
.dark-mode .modal-content .bg-pink-900:hover {
background-color: #f9a8d4;
}
.dark-mode .modal-content .bg-red-100 {
background-color: #7f1d1d;
color: #fecaca;
}
.dark-mode .modal-content .bg-red-100:hover {
background-color: #991b1b;
}
.dark-mode .modal-content .bg-red-200 {
background-color: #991b1b;
color: #fca5a5;
}
.dark-mode .modal-content .bg-red-200:hover {
background-color: #b91c1c;
}
.dark-mode .modal-content .bg-red-300 {
background-color: #b91c1c;
color: #f87171;
}
.dark-mode .modal-content .bg-red-300:hover {
background-color: #dc2626;
}
.dark-mode .modal-content .bg-red-400 {
background-color: #dc2626;
color: #b91c1c;
}
.dark-mode .modal-content .bg-red-400:hover {
background-color: #991b1b;
}
.dark-mode .modal-content .bg-red-500 {
background-color: #991b1b;
color: #7f1d1d;
}
.dark-mode .modal-content .bg-red-500:hover {
background-color: #450a0a;
}
.dark-mode .modal-content .bg-red-600 {
background-color: #7f1d1d;
color: #991b1b;
}
.dark-mode .modal-content .bg-red-600:hover {
background-color: #b91c1c;
}
.dark-mode .modal-content .bg-red-700 {
background-color: #991b1b;
color: #b91c1c;
}
.dark-mode .modal-content .bg-red-700:hover {
background-color: #dc2626;
}
.dark-mode .modal-content .bg-red-800 {
background-color: #b91c1c;
color: #dc2626;
}
.dark-mode .modal-content .bg-red-800:hover {
background-color: #f87171;
}
.dark-mode .modal-content .bg-red-900 {
background-color: #dc2626;
color: #f87171;
}
.dark-mode .modal-content .bg-red-900:hover {
background-color: #fca5a5;
}
.dark-mode .modal-content .bg-yellow-100 {
background-color: #713f12;
color: #fde68a;
}
.dark-mode .modal-content .bg-yellow-100:hover {
background-color: #854d0e;
}
.dark-mode .modal-content .bg-yellow-200 {
background-color: #854d0e;
color: #fcd34d;
}
.dark-mode .modal-content .bg-yellow-200:hover {
background-color: #a16207;
}
.dark-mode .modal-content .bg-yellow-300 {
background-color: #a16207;
color: #fbbf24;
}
.dark-mode .modal-content .bg-yellow-300:hover {
background-color: #d97706;
}
.dark-mode .modal-content .bg-yellow-400 {
background-color: #d97706;
color: #a16207;
}
.dark-mode .modal-content .bg-yellow-400:hover {
background-color: #854d0e;
}
.dark-mode .modal-content .bg-yellow-500 {
background-color: #854d0e;
color: #713f12;
}
.dark-mode .modal-content .bg-yellow-500:hover {
background-color: #422006;
}
.dark-mode .modal-content .bg-yellow-600 {
background-color: #713f12;
color: #854d0e;
}
.dark-mode .modal-content .bg-yellow-600:hover {
background-color: #a16207;
}
.dark-mode .modal-content .bg-yellow-700 {
background-color: #854d0e;
color: #a16207;
}
.dark-mode .modal-content .bg-yellow-700:hover {
background-color: #d97706;
}
.dark-mode .modal-content .bg-yellow-800 {
background-color: #a16207;
color: #d97706;
}
.dark-mode .modal-content .bg-yellow-800:hover {
background-color: #fbbf24;
}
.dark-mode .modal-content .bg-yellow-900 {
background-color: #d97706;
color: #fbbf24;
}
.dark-mode .modal-content .bg-yellow-900:hover {
background-color: #fcd34d;
}
.dark-mode .modal-content .bg-green-100 {
background-color: #14532d;
color: #bbf7d0;
}
.dark-mode .modal-content .bg-green-100:hover {
background-color: #166534;
}
.dark-mode .modal-content .bg-green-200 {
background-color: #166534;
color: #86efac;
}
.dark-mode .modal-content .bg-green-200:hover {
background-color: #15803d;
}
.dark-mode .modal-content .bg-green-300 {
background-color: #15803d;
color: #4ade80;
}
.dark-mode .modal-content .bg-green-300:hover {
background-color: #16a34a;
}
.dark-mode .modal-content .bg-green-400 {
background-color: #16a34a;
color: #15803d;
}
.dark-mode .modal-content .bg-green-400:hover {
background-color: #166534;
}
.dark-mode .modal-content .bg-green-500 {
background-color: #166534;
color: #14532d;
}
.dark-mode .modal-content .bg-green-500:hover {
background-color: #052e16;
}
.dark-mode .modal-content .bg-green-600 {
background-color: #14532d;
color: #166534;
}
.dark-mode .modal-content .bg-green-600:hover {
background-color: #15803d;
}
.dark-mode .modal-content .bg-green-700 {
background-color: #166534;
color: #15803d;
}
.dark-mode .modal-content .bg-green-700:hover {
background-color: #16a34a;
}
.dark-mode .modal-content .bg-green-800 {
background-color: #15803d;
color: #16a34a;
}
.dark-mode .modal-content .bg-green-800:hover {
background-color: #4ade80;
}
.dark-mode .modal-content .bg-green-900 {
background-color: #16a34a;
color: #4ade80;
}
.dark-mode .modal-content .bg-green-900:hover {
background-color: #86efac;
}
.dark-mode .modal-content .bg-teal-100 {
background-color: #134e4a;
color: #99f6e4;
}
.dark-mode .modal-content .bg-teal-100:hover {
background-color: #115e59;
}
.dark-mode .modal-content .bg-teal-200 {
background-color: #115e59;
color: #5eead4;
}
.dark-mode .modal-content .bg-teal-200:hover {
background-color: #0f766e;
}
.dark-mode .modal-content .bg-teal-300 {
background-color: #0f766e;
color: #2dd4bf;
}
.dark-mode .modal-content .bg-teal-300:hover {
background-color: #0d9488;
}
.dark-mode .modal-content .bg-teal-400 {
background-color: #0d9488;
color: #0f766e;
}
.dark-mode .modal-content .bg-teal-400:hover {
background-color: #115e59;
}
.dark-mode .modal-content .bg-teal-500 {
background-color: #115e59;
color: #134e4a;
}
.dark-mode .modal-content .bg-teal-500:hover {
background-color: #042f2e;
}
.dark-mode .modal-content .bg-teal-600 {
background-color: #134e4a;
color: #115e59;
}
.dark-mode .modal-content .bg-teal-600:hover {
background-color: #0f766e;
}
.dark-mode .modal-content .bg-teal-700 {
background-color: #115e59;
color: #0f766e;
}
.dark-mode .modal-content .bg-teal-700:hover {
background-color: #0d9488;
}
.dark-mode .modal-content .bg-teal-800 {
background-color: #0f766e;
color: #0d9488;
}
.dark-mode .modal-content .bg-teal-800:hover {
background-color: #2dd4bf;
}
.dark-mode .modal-content .bg-teal-900 {
background-color: #0d9488;
color: #2dd4bf;
}
.dark-mode .modal-content .bg-teal-900:hover {
background-color: #5eead4;
}
.dark-mode .modal-content .bg-orange-100 {
background-color: #7c2d12;
color: #fed7aa;
}
.dark-mode .modal-content .bg-orange-100:hover {
background-color: #9a3412;
}
.dark-mode .modal-content .bg-orange-200 {
background-color: #9a3412;
color: #fdba74;
}
.dark-mode .modal-content .bg-orange-200:hover {
background-color: #c2410c;
}
.dark-mode .modal-content .bg-orange-300 {
background-color: #c2410c;
color: #fb923c;
}
.dark-mode .modal-content .bg-orange-300:hover {
background-color: #ea580c;
}
.dark-mode .modal-content .bg-orange-400 {
background-color: #ea580c;
color: #c2410c;
}
.dark-mode .modal-content .bg-orange-400:hover {
background-color: #9a3412;
}
.dark-mode .modal-content .bg-orange-500 {
background-color: #9a3412;
color: #7c2d12;
}
.dark-mode .modal-content .bg-orange-500:hover {
background-color: #431407;
}
.dark-mode .modal-content .bg-orange-600 {
background-color: #7c2d12;
color: #9a3412;
}
.dark-mode .modal-content .bg-orange-600:hover {
background-color: #c2410c;
}
.dark-mode .modal-content .bg-orange-700 {
background-color: #9a3412;
color: #c2410c;
}
.dark-mode .modal-content .bg-orange-700:hover {
background-color: #ea580c;
}
.dark-mode .modal-content .bg-orange-800 {
background-color: #c2410c;
color: #ea580c;
}
.dark-mode .modal-content .bg-orange-800:hover {
background-color: #fb923c;
}
.dark-mode .modal-content .bg-orange-900 {
background-color: #ea580c;
color: #fb923c;
}
.dark-mode .modal-content .bg-orange-900:hover {
background-color: #fdba74;
}
.dark-mode .modal-content .bg-gray-100 {
background-color: #1e293b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-100:hover {
background-color: #334155;
}
.dark-mode .modal-content .bg-gray-200 {
background-color: #334155;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-200:hover {
background-color: #475569;
}
.dark-mode .modal-content .bg-gray-300 {
background-color: #475569;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-300:hover {
background-color: #64748b;
}
.dark-mode .modal-content .bg-gray-400 {
background-color: #64748b;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-400:hover {
background-color: #94a3b8;
}
.dark-mode .modal-content .bg-gray-500 {
background-color: #94a3b8;
color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-500:hover {
background-color: #cbd5e1;
}
.dark-mode .modal-content .bg-gray-600 {
background-color: #cbd5e1;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-600:hover {
background-color: #e2e8f0;
}
.dark-mode .modal-content .bg-gray-700 {
background-color: #e2e8f0;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-700:hover {
background-color: #f1f5f9;
}
.dark-mode .modal-content .bg-gray-800 {
background-color: #f1f5f9;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-800:hover {
background-color: #f8fafc;
}
.dark-mode .modal-content .bg-gray-900 {
background-color: #f8fafc;
color: #1e293b;
}
.dark-mode .modal-content .bg-gray-900:hover {
background-color: #ffffff;
}
.dark-mode .modal-content .bg-blue-100 {
background-color: #1e3a8a;
color: #bfdbfe;
}
.dark-mode .modal-content .bg-blue-100:hover {
background-color: #1e40af;
}
.dark-mode .modal-content .bg-blue-200 {
background-color: #1e40af;
color: #93c5fd;
}
.dark-mode .modal-content .bg-blue-200:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-300 {
background-color: #1d4ed8;
color: #60a5fa;
}
.dark-mode .modal-content .bg-blue-300:hover {
background-color: #2563eb;
}
.dark-mode .modal-content .bg-blue-400 {
background-color: #2563eb;
color: #3b82f6;
}
.dark-mode .modal-content .bg-blue-400:hover {
background-color: #3b82f6;
}
.dark-mode .modal-content .bg-blue-500 {
background-color: #3b82f6;
color: #2563eb;
}
.dark-mode .modal-content .bg-blue-500:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-600 {
background-color: #1d4ed8;
color: #1e40af;
}
.dark-mode .modal-content .bg-blue-600:hover {
background-color: #1e3a8a;
}
.dark-mode .modal-content .bg-blue-700 {
background-color: #1e3a8a;
color: #1e40af;
}
.dark-mode .modal-content .bg-blue-700:hover {
background-color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-800 {
background-color: #1e40af;
color: #1d4ed8;
}
.dark-mode .modal-content .bg-blue-800:hover {
background-color: #2563eb;
}
.dark-mode .modal-content .bg-blue-900 {
background-color: #1d4ed8;
color: #2563eb;
}
.dark-mode .modal-content .bg-blue-900:hover {
background-color: #3b82f
</html>