/**
 * Clean Effects - Removes excessive blur, shine, and reflection effects
 * Focus: Content visibility and professional appearance
 * Addresses user feedback about "too much shining and reflects"
 */

/* OVERRIDE EXCESSIVE BLUR EFFECTS */

/* Reduce navigation blur from 20px to subtle 3px */
.navbar,
.nav {
    backdrop-filter: blur(3px) !important;
    -webkit-backdrop-filter: blur(3px) !important;
}

/* Remove excessive blur from contact sections */
.contact-info,
.stat-card {
    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
}

/* Clean up project overlays - remove heavy glassmorphism */
.project-overlay,
.modern-overlay {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    /* Removed dark overlay that was hiding project images */
}

/* Remove blur from project cards and stats */
.total-projects,
.category-stat {
    backdrop-filter: blur(1px) !important;
    -webkit-backdrop-filter: blur(1px) !important;
}

/* Clean up glassmorphism effects - content visibility first */
.glass-effect,
.glassmorphism {
    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
    background: rgba(255, 255, 255, 0.05) !important; /* Much more subtle */
}

/* REMOVE EXCESSIVE SHINE AND REFLECTION EFFECTS */

/* Remove text shadows that create shine effects */
.hero-title,
.section-title,
h1, h2, h3 {
    text-shadow: none !important;
}

/* Simplify button effects - remove shine */
.btn,
.filter-btn,
.project-card {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.btn:hover,
.filter-btn:hover,
.project-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.12) !important;
    transform: translateY(-2px) !important; /* Simple lift instead of complex effects */
}

/* Remove excessive drop shadows that create reflection effects */
.feature-icon,
.expertise-icon {
    filter: none !important;
    drop-shadow: none !important;
}

/* Allow project images to display properly */
.project-image img {
    drop-shadow: none !important;
    /* Removed filter: none to allow proper image brightness */
}

/* Clean overlay effects - remove reflection-like gradients */
.hero-overlay,
.section-overlay {
    background: linear-gradient(180deg, 
        rgba(0, 0, 0, 0.3) 0%, 
        rgba(0, 0, 0, 0.1) 100%) !important;
}

/* PERFORMANCE OPTIMIZATIONS */

/* Remove will-change from elements that don't need it */
.project-card,
.btn,
.filter-btn {
    will-change: auto !important;
}

/* Simplify transitions - remove complex property lists */
* {
    transition-property: opacity, transform !important;
    transition-duration: 0.2s !important;
    transition-timing-function: ease !important;
}

/* MOBILE OPTIMIZATIONS - Remove all blur on mobile for performance */
@media (max-width: 768px) {
    * {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    
    .navbar,
    .nav {
        background: rgba(248, 246, 240, 0.95) !important;
    }
    
    /* Dark theme mobile navbar */
    [data-theme="dark"] .navbar,
    [data-theme="dark"] .nav {
        background: rgba(26, 15, 7, 0.95) !important;
    }
    
    .project-overlay {
        background: rgba(0, 0, 0, 0.8) !important;
    }
}

/* ACCESSIBILITY IMPROVEMENTS */

/* Ensure text remains readable without effects */
.hero-content,
.intro-content,
.section-content {
    background: rgba(255, 255, 255, 0.02) !important;
    backdrop-filter: none !important;
    padding: 1rem !important;
    border-radius: 8px !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .project-overlay,
    .glass-effect,
    .glassmorphism {
        background: rgba(0, 0, 0, 0.9) !important;
        backdrop-filter: none !important;
        border: 2px solid rgba(255, 255, 255, 0.8) !important;
    }
}

/* Reduced motion - remove all effects */
@media (prefers-reduced-motion: reduce) {
    * {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        filter: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
        transition: none !important;
        animation: none !important;
    }
}

/* CLEAN FOCUS STATES - Remove excessive glow */
button:focus,
a:focus,
input:focus,
textarea:focus {
    outline: 2px solid var(--color-primary, #D69456) !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}

/* PRESERVE HERO PARALLAX (user loves it) - but make it cleaner */
.hero-gallery img,
.hero-slide img {
    filter: none !important;
    backdrop-filter: none !important;
}

.hero-section {
    /* Keep parallax but remove excessive overlays */
    position: relative;
}

.hero-section::before {
    background: linear-gradient(
        180deg, 
        rgba(0, 0, 0, 0.2) 0%, 
        rgba(0, 0, 0, 0.1) 50%,
        transparent 100%
    ) !important;
}

/* CONTENT VISIBILITY PRIORITY */
.main-content,
.portfolio-content,
.about-content {
    background: var(--color-background, #FFFFFF) !important;
    backdrop-filter: none !important;
    position: relative !important;
    z-index: 10 !important;
}

/* Clean loading states - no shimmer effects */
.loading,
.skeleton {
    background: rgba(0, 0, 0, 0.05) !important;
    animation: none !important;
}

/* Override any remaining shimmer/shine animations */
@keyframes shimmer,
@keyframes shine,
@keyframes glow {
    0%, 100% { opacity: 1; }
}

/* ADDITIONAL BRIGHTNESS AND REFLECTION FIXES */

/* Reduce excessive box-shadows that create reflection effects */
.project-card.enhanced,
.project-card {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

.project-card.enhanced:hover,
.project-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
}

/* Clean up excessive glassmorphism in project cards */
.project-card.enhanced {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.92) 0%, 
        rgba(255, 202, 153, 0.05) 30%, 
        rgba(255, 255, 255, 0.88) 70%, 
        rgba(214, 148, 86, 0.08) 100%
    ) !important;
}

.project-card.enhanced:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.95) 0%, 
        rgba(255, 202, 153, 0.06) 30%, 
        rgba(255, 255, 255, 0.92) 70%, 
        rgba(214, 148, 86, 0.08) 100%
    ) !important;
}

/* Fix excessive brightness on images */
.project-image img,
.gallery-image,
.bento-image {
    filter: brightness(1) contrast(1) saturate(1) !important;
}

.project-card:hover .project-image img,
.project-card.enhanced:hover .project-image img,
.gallery-cell:hover .gallery-image,
.bento-cell:hover .bento-image {
    filter: brightness(1.01) contrast(1.005) saturate(1.02) !important;
}

/* Reduce excessive inset shadows that create glow effects */
.project-card.enhanced:hover {
    border-color: rgba(214, 148, 86, 0.15) !important;
}

/* Clean up feature cards */
.feature-card,
.expertise-item {
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06) !important;
    backdrop-filter: blur(1px) !important;
}

.feature-card:hover,
.expertise-item:hover {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1) !important;
}

/* Remove excessive brightness from buttons */
.btn {
    filter: none !important;
    backdrop-filter: none !important;
}

.btn:hover {
    filter: brightness(1.01) !important;
    transform: translateY(-1px) scale(1.01) !important;
}

/* Fix any remaining bright gradients */
.gradient-overlay,
.glass-gradient {
    opacity: 0.3 !important;
}

/* Clean statistics section - Ensure visibility */
.intro-stats {
    opacity: 1 !important;
    visibility: visible !important;
    display: grid !important;
}

/* Clean statistics cards - Professional styling */
.stat-item,
.intro-stats .stat-item {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(3px) !important;
    box-shadow: 
        0 4px 16px rgba(214, 148, 86, 0.08),
        0 2px 8px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(214, 148, 86, 0.12) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: flex !important;
    flex-direction: column !important;
}

.stat-item:hover,
.intro-stats .stat-item:hover {
    transform: translateY(-8px) scale(1.02) !important;
    box-shadow: 
        0 12px 32px rgba(214, 148, 86, 0.15),
        0 4px 16px rgba(0, 0, 0, 0.08) !important;
    border-color: rgba(214, 148, 86, 0.2) !important;
    background: rgba(255, 255, 255, 0.95) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Ensure smooth performance on mobile */
.stat-item,
.intro-stats .stat-item {
    will-change: transform !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Improve text contrast and readability */
.stat-number {
    color: var(--color-amber-700) !important;
    text-shadow: 0 1px 2px rgba(214, 148, 86, 0.2) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    font-size: 2.5rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

.stat-label {
    color: var(--color-gray-600) !important;
    font-weight: 500 !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    margin-top: 0.5rem !important;
}

/* Reduce any bright backgrounds in hero section */
.hero-section {
    background: linear-gradient(to bottom right, 
        rgba(255, 248, 240, 0.95) 0%, 
        rgba(255, 237, 213, 0.9) 30%, 
        rgba(255, 248, 220, 0.95) 100%
    ) !important;
}

/* Clean up navigation brightness */
.navbar {
    background: rgba(248, 246, 240, 0.92) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
}

/* DARK THEME OVERRIDES FOR STATISTICS */

/* Dark theme statistics cards */
[data-theme="dark"] .stat-item,
[data-theme="dark"] .intro-stats .stat-item {
    background: rgba(57, 28, 11, 0.92) !important;
    border: 1px solid rgba(107, 69, 38, 0.15) !important;
    backdrop-filter: blur(3px) !important;
    box-shadow: 
        0 4px 16px rgba(26, 15, 7, 0.3),
        0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .stat-item:hover,
[data-theme="dark"] .intro-stats .stat-item:hover {
    background: rgba(57, 28, 11, 0.95) !important;
    border-color: rgba(107, 69, 38, 0.25) !important;
    box-shadow: 
        0 12px 32px rgba(26, 15, 7, 0.4),
        0 4px 16px rgba(0, 0, 0, 0.3) !important;
}

/* Dark theme statistics text */
[data-theme="dark"] .stat-number {
    color: var(--color-amber-300) !important;
    text-shadow: 0 1px 2px rgba(245, 184, 133, 0.3) !important;
}

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

/* Dark theme navigation */
[data-theme="dark"] .navbar {
    background: rgba(26, 15, 7, 0.92) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

/* Dark theme hero section */
[data-theme="dark"] .hero-section {
    background: linear-gradient(to bottom right, 
        rgba(15, 8, 5, 0.95) 0%, 
        rgba(26, 15, 7, 0.9) 30%, 
        rgba(43, 26, 15, 0.95) 100%
    ) !important;
}

/* Dark theme main content areas */
[data-theme="dark"] .main-content,
[data-theme="dark"] .portfolio-content,
[data-theme="dark"] .about-content {
    background: var(--color-background) !important;
}

[data-theme="dark"] .intro-content,
[data-theme="dark"] .section-content {
    background: rgba(26, 15, 7, 0.02) !important;
}

/* Dark theme project cards */
[data-theme="dark"] .project-card.enhanced,
[data-theme="dark"] .project-card {
    background: linear-gradient(135deg, 
        rgba(57, 28, 11, 0.92) 0%, 
        rgba(107, 69, 38, 0.05) 30%, 
        rgba(43, 26, 15, 0.88) 70%, 
        rgba(74, 36, 16, 0.08) 100%
    ) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .project-card.enhanced:hover,
[data-theme="dark"] .project-card:hover {
    background: linear-gradient(135deg, 
        rgba(57, 28, 11, 0.95) 0%, 
        rgba(107, 69, 38, 0.06) 30%, 
        rgba(43, 26, 15, 0.92) 70%, 
        rgba(74, 36, 16, 0.08) 100%
    ) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

/* Dark theme feature cards */
[data-theme="dark"] .feature-card,
[data-theme="dark"] .expertise-item {
    background: rgba(57, 28, 11, 0.9) !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .feature-card:hover,
[data-theme="dark"] .expertise-item:hover {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}

/* Dark theme buttons */
[data-theme="dark"] .btn,
[data-theme="dark"] .filter-btn {
    background: rgba(57, 28, 11, 0.9) !important;
    border: 1px solid rgba(107, 69, 38, 0.3) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .btn:hover,
[data-theme="dark"] .filter-btn:hover {
    background: rgba(107, 69, 38, 0.9) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4) !important;
}