/* Shared Styles for Sorina Niculcea's Website */ /* This file can be used for both index.html and blog.html */ html { scroll-behavior: smooth; } body { font-family: 'Inter', sans-serif; background-color: #ffffff; /* White background */ } /* --- Dark Mode Styles --- */ /* This targets the element when it has the .dark class. It sets the base background for the entire page. */ .dark { background-color: #1a202c; color: #e2e8f0; } /* This ensures the body also gets the correct dark background. */ .dark body { background-color: #1a202c; } /* Component-specific dark styles */ .dark .header-shadow { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.12); } .dark header, .dark #quiz-container, .dark #mobile-menu { background-color: #2d3748; } .dark .bg-gray-50 { background-color: #2d3748; } .dark .bg-brandGreen-light { background-color: #2E4032; /* Darker green for light green sections in dark mode */ } .dark .text-gray-900, .dark .text-gray-800, .dark .text-gray-700 { color: #e2e8f0; } .dark .text-gray-600, .dark .text-gray-500 { color: #a0aec0; } .dark a, .dark li { color: #a0aec0; } .dark .border-gray-300 { border-color: #4a5568; } .dark .border-gray-400 { border-color: #4a5568; } .dark .hover\:bg-gray-100:hover { background-color: #4a5568; } .dark .hover\:bg-gray-50:hover { background-color: #4a5568; } .dark .hover\:text-brandGreen:hover { color: #66BB6A; /* Lighter green for hover in dark mode */ } .dark .form-radio { color: #66BB6A; } .dark .text-brandGreen { color: #A5D6A7; /* A lighter, more readable green for dark mode text */ } /* --- General Styles --- */ .header-shadow { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03); } #back-to-top { position: fixed; bottom: 20px; right: 20px; z-index: 100; cursor: pointer; transition: opacity 0.3s ease-in-out; border-radius: 9999px; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }