/* Dark Mode Global Styles */

/* Text Colors */
.dark .text-gray-900 { color: #ffffff; }
.dark .text-gray-800 { color: #f3f4f6; }
.dark .text-gray-700 { color: #e5e7eb; }
.dark .text-gray-600 { color: #d1d5db; }
.dark .text-gray-500 { color: #9ca3af; }

/* Background Colors */
.dark .bg-white { background-color: #374151; }
.dark .bg-gray-50 { background-color: #1f2937; }
.dark .bg-gray-100 { background-color: #374151; }
.dark .bg-gray-200 { background-color: #4b5563; }

/* Cards and Sections */
.dark .bg-white.rounded-2xl,
.dark .bg-white.rounded-3xl,
.dark .bg-white.rounded-xl,
.dark .bg-white.rounded-lg {
    background-color: #374151;
    border: 1px solid #4b5563;
}

/* Form Elements */
.dark input[type="text"],
.dark input[type="email"],
.dark input[type="tel"],
.dark textarea,
.dark select {
    background-color: #374151;
    border-color: #4b5563;
    color: #ffffff;
}

.dark input[type="text"]:focus,
.dark input[type="email"]:focus,
.dark input[type="tel"]:focus,
.dark textarea:focus,
.dark select:focus {
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

/* Buttons */
.dark .bg-white.text-primary {
    background-color: #374151;
    color: #667eea;
    border: 1px solid #4b5563;
}

.dark .bg-white.text-primary:hover {
    background-color: #4b5563;
}

/* Navigation specific */
.dark nav.bg-white\/95 {
    background-color: rgba(31, 41, 55, 0.95);
}

/* Navigation Dark Mode Styles */
.dark nav {
    background-color: rgba(17, 24, 39, 0.95) !important;
}

.dark nav .border-gray-200 {
    border-color: #374151 !important;
}

.dark nav .text-gray-600 {
    color: #d1d5db !important;
}

.dark nav .text-gray-700 {
    color: #e5e7eb !important;
}

/* Navigation contact info - high specificity */
.dark nav .text-gray-600,
.dark nav span.dark\:text-gray-300 {
    color: #d1d5db !important;
}

/* Mobile menu dark mode */
.dark #mobile-menu {
    background-color: #111827 !important;
    border-color: #374151 !important;
}

/* Borders */
.dark .border-gray-200 { border-color: #4b5563; }
.dark .border-gray-300 { border-color: #6b7280; }

/* Shadows - reduce in dark mode */
.dark .shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3), 0 4px 6px -2px rgba(0, 0, 0, 0.15); }
.dark .shadow-xl { box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 10px 10px -5px rgba(0, 0, 0, 0.15); }
.dark .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); }

/* Progress bars and skill elements */
.dark .bg-gray-200 { background-color: #4b5563; }

/* Hover states */
.dark .hover\:bg-gray-100:hover { background-color: #4b5563; }
.dark .hover\:bg-white:hover { background-color: #374151; }

/* Special elements */
.dark .bg-gray-50.rounded-xl { 
    background-color: #374151; 
    border: 1px solid #4b5563;
}

/* Footer */
.dark footer { 
    background-color: #111827; 
    border-color: #374151;
}

/* Blog and content areas */
.dark .prose { color: #e5e7eb; }
.dark .prose h1, 
.dark .prose h2, 
.dark .prose h3, 
.dark .prose h4, 
.dark .prose h5, 
.dark .prose h6 { color: #ffffff; }

/* Tables */
.dark table { 
    background-color: #374151; 
    color: #e5e7eb;
}
.dark th { 
    background-color: #4b5563; 
    color: #ffffff;
}
.dark td { 
    border-color: #4b5563; 
}

/* Modals and overlays */
.dark .bg-white.modal,
.dark .bg-white.popup,
.dark .bg-white.dropdown {
    background-color: #374151;
    border-color: #4b5563;
}

/* Mobile contact info styling */
@media (max-width: 640px) {
    /* Ensure contact info is visible on small screens */
    nav .text-gray-600,
    nav span {
        color: #374151 !important;
        font-weight: 500;
    }
    
    .dark nav .text-gray-600,
    .dark nav span {
        color: #d1d5db !important;
        font-weight: 500;
    }
    
    /* Top bar styling for mobile */
    nav > div > div:first-child {
        min-height: 32px;
    }
}

/* Recent Blogs Section Styles */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Blog card hover effects */
.recent-blog-card {
    transition: all 0.3s ease;
}

.recent-blog-card:hover {
    transform: translateY(-5px);
}

.recent-blog-card img {
    transition: transform 0.5s ease;
}

.recent-blog-card:hover img {
    transform: scale(1.1);
}