/* Dark Mode Additional Fixes - Enhanced Pro Version */

/* Critical loading state fixes */
.theme-loading * {
    transition: none !important;
}

.theme-loaded {
    transition: var(--transition-theme, all 0.3s ease) !important;
}

/* Fix for any inline styles that override dark mode */
[data-theme="dark"] .about-section {
    background: var(--section-bg) !important;
}

[data-theme="dark"] .workflow-section {
    background: var(--bg-secondary) !important;
}

/* Enhanced fixes for specific inline styles in about.html */
[data-theme="dark"] .about-card {
    background-color: var(--card-bg) !important;
    box-shadow: 0 4px 12px var(--shadow-sm) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .about-card:hover {
    box-shadow: 0 12px 30px var(--shadow-md) !important;
    transform: translateY(-4px) !important;
}

[data-theme="dark"] .card-icon {
    background-color: var(--bg-tertiary) !important;
    color: var(--accent-blue) !important;
    box-shadow: 0 2px 8px var(--shadow-xs) !important;
}

[data-theme="dark"] .about-card:hover .card-icon {
    background: var(--accent-gradient) !important;
    color: white !important;
    transform: scale(1.1) rotate(5deg) !important;
    box-shadow: 0 4px 12px var(--shadow-md) !important;
}

/* Enhanced fixes for projects page */
[data-theme="dark"] .projects-grid {
    background-color: var(--section-bg) !important;
}

[data-theme="dark"] .project-item {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .project-item:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 30px var(--shadow-md) !important;
    border-color: var(--accent-blue) !important;
}

/* Enhanced fixes for any gradient backgrounds */
[data-theme="dark"] .gradient-bg-1,
[data-theme="dark"] .gradient-bg-2,
[data-theme="dark"] .gradient-bg-3 {
    background: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
}

/* Enhanced fixes for hero section backgrounds */
[data-theme="dark"] .hero-section-new {
    background: var(--hero-bg) !important;
}

[data-theme="dark"] .hero-bg-overlay {
    background: var(--overlay-light) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

/* Enhanced fixes for any section backgrounds */
[data-theme="dark"] section {
    background-color: var(--section-bg) !important;
}

[data-theme="dark"] .section {
    background-color: var(--section-bg) !important;
}

/* Enhanced fixes for portfolio images container */
[data-theme="dark"] .portfolio-image-new {
    background: var(--bg-tertiary) !important;
    border-radius: 12px !important;
}

/* Enhanced fixes for any remaining white text on white background */
[data-theme="dark"] .text-white {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .text-black {
    color: var(--text-primary) !important;
}

/* Enhanced fixes for any cards with specific background colors */
[data-theme="dark"] .card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .feature-card {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .card:hover,
[data-theme="dark"] .info-card:hover,
[data-theme="dark"] .feature-card:hover {
    box-shadow: 0 12px 30px var(--shadow-md) !important;
    transform: translateY(-2px) !important;
}

/* Enhanced fixes for any buttons with specific colors */
[data-theme="dark"] .btn-outline {
    border-color: var(--accent-blue) !important;
    color: var(--accent-blue) !important;
    background: transparent !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .btn-outline:hover {
    background-color: var(--accent-blue) !important;
    color: white !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px var(--shadow-md) !important;
}

/* Enhanced fixes for any modal or popup backgrounds */
[data-theme="dark"] .modal,
[data-theme="dark"] .popup,
[data-theme="dark"] .dropdown {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 20px 40px var(--shadow-lg) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

/* Enhanced fixes for any table elements */
[data-theme="dark"] table {
    background-color: var(--card-bg) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] th,
[data-theme="dark"] td {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    background-color: var(--card-bg) !important;
}

[data-theme="dark"] thead th {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] tbody tr:nth-child(even) {
    background-color: var(--bg-secondary) !important;
}

[data-theme="dark"] tbody tr:hover {
    background-color: var(--bg-tertiary) !important;
}

/* Enhanced fixes for any code blocks */
[data-theme="dark"] code,
[data-theme="dark"] pre {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 6px !important;
}

[data-theme="dark"] .highlight,
[data-theme="dark"] .code-highlight {
    background-color: var(--bg-secondary) !important;
    color: var(--accent-blue) !important;
}

/* Enhanced fixes for any blockquotes */
[data-theme="dark"] blockquote {
    background-color: var(--bg-secondary) !important;
    border-left: 4px solid var(--accent-blue) !important;
    color: var(--text-secondary) !important;
    border-radius: 0 8px 8px 0 !important;
}

/* Enhanced fixes for any badges or tags */
[data-theme="dark"] .badge,
[data-theme="dark"] .tag {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 20px !important;
}

[data-theme="dark"] .badge-primary,
[data-theme="dark"] .tag-primary {
    background: var(--accent-gradient) !important;
    color: white !important;
    border: none !important;
}

/* Enhanced fixes for any alert or notification components */
[data-theme="dark"] .alert,
[data-theme="dark"] .notification {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    border-radius: 8px !important;
}

[data-theme="dark"] .alert-success {
    background-color: rgba(52, 211, 153, 0.1) !important;
    border-color: var(--success) !important;
    color: var(--success) !important;
}

[data-theme="dark"] .alert-warning {
    background-color: rgba(251, 191, 36, 0.1) !important;
    border-color: var(--warning) !important;
    color: var(--warning) !important;
}

[data-theme="dark"] .alert-error {
    background-color: rgba(248, 113, 113, 0.1) !important;
    border-color: var(--error) !important;
    color: var(--error) !important;
}

[data-theme="dark"] .alert-info {
    background-color: rgba(34, 211, 238, 0.1) !important;
    border-color: var(--info) !important;
    color: var(--info) !important;
}

/* Enhanced fixes for any progress bars */
[data-theme="dark"] .progress {
    background-color: var(--bg-tertiary) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

[data-theme="dark"] .progress-bar {
    background: var(--accent-gradient) !important;
    transition: var(--transition-normal) !important;
}

/* Enhanced fixes for any tooltips */
[data-theme="dark"] .tooltip {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 12px var(--shadow-md) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

[data-theme="dark"] .tooltip-arrow {
    border-color: var(--border-color) !important;
}

/* Enhanced fixes for any accordion or collapsible elements */
[data-theme="dark"] .accordion-header {
    background-color: var(--card-bg) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .accordion-header:hover {
    background-color: var(--bg-secondary) !important;
}

[data-theme="dark"] .accordion-body {
    background-color: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border: 1px solid var(--border-color) !important;
    border-top: none !important;
}

/* Enhanced fixes for any tab components */
[data-theme="dark"] .tab-header {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .tab-item {
    color: var(--text-secondary) !important;
    border-bottom: 2px solid transparent !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .tab-item:hover {
    color: var(--text-primary) !important;
    background-color: var(--button-hover) !important;
}

[data-theme="dark"] .tab-item.active {
    color: var(--accent-blue) !important;
    border-bottom-color: var(--accent-blue) !important;
}

[data-theme="dark"] .tab-content {
    background-color: var(--card-bg) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-top: none !important;
}

/* Enhanced fixes for form components */
[data-theme="dark"] .form-group {
    margin-bottom: 1rem !important;
}

[data-theme="dark"] label {
    color: var(--text-primary) !important;
    font-weight: 500 !important;
}

[data-theme="dark"] .form-control {
    background-color: var(--input-bg) !important;
    border: 2px solid var(--input-border) !important;
    color: var(--text-primary) !important;
    border-radius: 8px !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .form-control:focus {
    border-color: var(--input-focus) !important;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1) !important;
    outline: none !important;
}

[data-theme="dark"] .form-control::placeholder {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .form-text {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .invalid-feedback {
    color: var(--error) !important;
}

[data-theme="dark"] .valid-feedback {
    color: var(--success) !important;
}

/* Enhanced fixes for navigation components */
[data-theme="dark"] .navbar {
    background-color: var(--nav-bg) !important;
    border-bottom: 1px solid var(--border-color) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
}

[data-theme="dark"] .navbar-brand {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .navbar-nav .nav-link {
    color: var(--text-secondary) !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .navbar-nav .nav-link:hover,
[data-theme="dark"] .navbar-nav .nav-link.active {
    color: var(--accent-blue) !important;
}

[data-theme="dark"] .navbar-toggler {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .navbar-toggler-icon {
    background-color: var(--text-primary) !important;
}

/* Enhanced fixes for breadcrumb components */
[data-theme="dark"] .breadcrumb {
    background-color: var(--bg-secondary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
}

[data-theme="dark"] .breadcrumb-item {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .breadcrumb-item.active {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-muted) !important;
}

/* Enhanced fixes for pagination components */
[data-theme="dark"] .pagination {
    gap: 0.25rem !important;
}

[data-theme="dark"] .page-link {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    border-radius: 6px !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .page-link:hover {
    background-color: var(--accent-blue) !important;
    color: white !important;
    transform: translateY(-1px) !important;
}

[data-theme="dark"] .page-item.active .page-link {
    background: var(--accent-gradient) !important;
    border-color: transparent !important;
    color: white !important;
}

[data-theme="dark"] .page-item.disabled .page-link {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-muted) !important;
    opacity: 0.6 !important;
}

/* Ensure all SVG icons use current color and proper sizing */
[data-theme="dark"] svg {
    color: inherit !important;
    fill: currentColor !important;
}

[data-theme="dark"] .icon {
    color: var(--text-secondary) !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .icon-primary {
    color: var(--accent-blue) !important;
}

[data-theme="dark"] .icon-success {
    color: var(--success) !important;
}

[data-theme="dark"] .icon-warning {
    color: var(--warning) !important;
}

[data-theme="dark"] .icon-error {
    color: var(--error) !important;
}

/* Enhanced fixes for any remaining elements with hardcoded colors */
[data-theme="dark"] *[style*="background-color: white"],
[data-theme="dark"] *[style*="background-color: #fff"],
[data-theme="dark"] *[style*="background-color: #ffffff"],
[data-theme="dark"] *[style*="background: white"],
[data-theme="dark"] *[style*="background: #fff"],
[data-theme="dark"] *[style*="background: #ffffff"] {
    background-color: var(--card-bg) !important;
}

[data-theme="dark"] *[style*="color: black"],
[data-theme="dark"] *[style*="color: #000"],
[data-theme="dark"] *[style*="color: #000000"] {
    color: var(--text-primary) !important;
}

[data-theme="dark"] *[style*="border-color: black"],
[data-theme="dark"] *[style*="border-color: #000"],
[data-theme="dark"] *[style*="border-color: #000000"] {
    border-color: var(--border-color) !important;
}

/* Enhanced fixes for any remaining text that might be invisible */
[data-theme="dark"] .invisible-text {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .hidden-text {
    color: var(--text-primary) !important;
}

/* Enhanced fixes for video and media elements */
[data-theme="dark"] video {
    border-radius: 12px !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] audio {
    filter: invert(1) hue-rotate(180deg) !important;
}

/* Enhanced fixes for iframe elements */
[data-theme="dark"] iframe {
    border: 1px solid var(--border-color) !important;
    border-radius: 8px !important;
}

/* Ensure proper contrast for all interactive elements */
[data-theme="dark"] button:not(.theme-toggle):not(.btn):not(.chat-toggle) {
    background-color: var(--bg-tertiary) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 6px !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] button:not(.theme-toggle):not(.btn):not(.chat-toggle):hover {
    background-color: var(--accent-blue) !important;
    color: white !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px var(--shadow-md) !important;
}

/* Enhanced fixes for hero background overlay */
[data-theme="dark"] .hero-bg-overlay {
    background: var(--overlay-light) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

/* Enhanced fixes for carousel controls */
[data-theme="dark"] .carousel-control {
    background-color: var(--card-bg) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 50% !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .carousel-control:hover {
    background-color: var(--accent-blue) !important;
    color: white !important;
    transform: scale(1.1) !important;
}

/* Enhanced fixes for carousel dots */
[data-theme="dark"] .carousel-dots .dot {
    background-color: var(--bg-tertiary) !important;
    border: 2px solid var(--border-color) !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] .carousel-dots .dot.active {
    background: var(--accent-gradient) !important;
    border-color: transparent !important;
    transform: scale(1.2) !important;
}

/* Enhanced scrollbar styling for webkit browsers */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
    background-color: var(--bg-secondary) !important;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background-color: var(--bg-tertiary) !important;
    border-radius: 4px !important;
    transition: var(--transition-normal) !important;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background-color: var(--accent-blue) !important;
}

[data-theme="dark"] ::-webkit-scrollbar-corner {
    background-color: var(--bg-secondary) !important;
}

/* Enhanced focus and selection styling */
[data-theme="dark"] ::selection {
    background-color: rgba(96, 165, 250, 0.3) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] ::-moz-selection {
    background-color: rgba(96, 165, 250, 0.3) !important;
    color: var(--text-primary) !important;
}

/* Enhanced accessibility and keyboard navigation */
[data-theme="dark"] :focus-visible {
    outline: 2px solid var(--accent-blue) !important;
    outline-offset: 2px !important;
    border-radius: 4px !important;
}

/* Enhanced print mode fixes */
@media print {
    [data-theme="dark"] {
        color-adjust: exact !important;
        -webkit-print-color-adjust: exact !important;
    }
}

/* Enhanced high contrast mode support */
@media (prefers-contrast: high) {
    [data-theme="dark"] {
        --border-color: #ffffff !important;
        --text-primary: #ffffff !important;
        --text-secondary: #ffffff !important;
        --bg-primary: #000000 !important;
        --bg-secondary: #000000 !important;
        --card-bg: #000000 !important;
    }
}

/* Enhanced reduced motion support */
@media (prefers-reduced-motion: reduce) {
    [data-theme="dark"] * {
        transition: none !important;
        animation: none !important;
    }
    
    [data-theme="dark"] .theme-toggle::before {
        display: none !important;
    }
    
    [data-theme="dark"] .card-3d-effect:hover {
        transform: none !important;
    }
}

/* Mobile specific dark mode fixes */
@media (max-width: 768px) {
    [data-theme="dark"] .mobile-nav-bottom {
        background-color: var(--nav-bg) !important;
        border-top: 1px solid var(--border-color) !important;
        backdrop-filter: blur(20px) !important;
        -webkit-backdrop-filter: blur(20px) !important;
    }
    
    [data-theme="dark"] .mobile-nav-item {
        color: var(--text-secondary) !important;
        transition: var(--transition-normal) !important;
    }
    
    [data-theme="dark"] .mobile-nav-item:hover,
    [data-theme="dark"] .mobile-nav-item.active {
        color: var(--accent-blue) !important;
        background-color: var(--button-hover) !important;
    }
}

/* Tablet specific fixes */
@media (min-width: 769px) and (max-width: 1024px) {
    [data-theme="dark"] .container {
        padding: 0 20px !important;
    }
}

/* Large screen optimizations */
@media (min-width: 1200px) {
    [data-theme="dark"] .hero-section-new {
        background-attachment: fixed !important;
    }
} 