/* ========================================
   CORRECTIONS ANDROID - CHROME MOBILE
   Fixes pour Chrome Android (Mobile & Tablette)
   ======================================== */

/* Reset pour Android */
* {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Fix pour les images sur Android */
img {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

/* Fix viewport Android */
@viewport {
    width: device-width;
    zoom: 1.0;
}

/* ========================================
   NAVIGATION - FIX ANDROID
   ======================================== */

.navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 99999 !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.nav-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 20px !important;
}

/* ========================================
   HERO SECTION - FIX ANDROID
   ======================================== */

.hero {
    min-height: 100vh !important;
    height: 100vh !important;
    width: 100% !important;
    position: relative !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.hero-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 20px !important;
}

/* ========================================
   SECTIONS - FIX ANDROID
   ======================================== */

.section {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.container {
    width: 100% !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* ========================================
   GALERIE PROJETS - FIX ANDROID
   ======================================== */

.projects-gallery-container {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-behavior: smooth !important;
}

.projects-gallery {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 20px !important;
    padding: 20px 0 !important;
}

.project-card {
    flex: 0 0 auto !important;
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
}

/* ========================================
   MEDIA QUERIES - ANDROID MOBILE
   ======================================== */

/* Détection Android Chrome Mobile */
@supports (-webkit-appearance: none) {
    @media screen and (max-width: 600px) {
        
        /* Navigation Mobile */
        .navbar {
            height: 70px !important;
        }
        
        .nav-logo {
            height: 80px !important;
            width: auto !important;
        }
        
        /* Hero Mobile */
        .hero {
            padding-top: 70px !important;
        }
        
        .hero h1 {
            font-size: 2rem !important;
            line-height: 1.2 !important;
        }
        
        .hero-subtitle {
            font-size: 1rem !important;
        }
        
        /* Sections Mobile */
        .section {
            padding: 50px 0 !important;
        }
        
        .section-title {
            font-size: 28px !important;
        }
        
        /* Services Mobile */
        .services-grid {
            grid-template-columns: 1fr !important;
            gap: 20px !important;
        }
        
        /* Clients Mobile */
        .clients-grid {
            grid-template-columns: repeat(2, 1fr) !important;
            gap: 20px !important;
        }
        
        /* Social Mobile */
        .social-grid {
            grid-template-columns: 1fr !important;
            gap: 20px !important;
        }
        
        /* Contact Mobile */
        .contact-content {
            grid-template-columns: 1fr !important;
            gap: 30px !important;
        }
        
        /* Footer Mobile */
        .footer-content {
            grid-template-columns: 1fr !important;
            gap: 30px !important;
        }
        
        /* Projets Mobile */
        .project-card {
            width: 250px !important;
            min-width: 250px !important;
            max-width: 250px !important;
        }
    }
}

/* ========================================
   MEDIA QUERIES - ANDROID TABLETTE
   ======================================== */

@supports (-webkit-appearance: none) {
    @media screen and (min-width: 601px) and (max-width: 968px) {
        
        /* Navigation Tablette */
        .navbar {
            height: 80px !important;
        }
        
        .nav-logo {
            height: 100px !important;
        }
        
        /* Hero Tablette */
        .hero {
            padding-top: 80px !important;
        }
        
        .hero h1 {
            font-size: 2.5rem !important;
        }
        
        /* Services Tablette */
        .services-grid {
            grid-template-columns: repeat(2, 1fr) !important;
            gap: 25px !important;
        }
        
        /* Clients Tablette */
        .clients-grid {
            grid-template-columns: repeat(3, 1fr) !important;
            gap: 25px !important;
        }
        
        /* Social Tablette */
        .social-grid {
            grid-template-columns: repeat(2, 1fr) !important;
            gap: 20px !important;
        }
        
        /* Contact Tablette */
        .contact-content {
            grid-template-columns: 1fr 1fr !important;
            gap: 40px !important;
        }
        
        /* Footer Tablette */
        .footer-content {
            grid-template-columns: repeat(2, 1fr) !important;
            gap: 40px !important;
        }
    }
}

/* ========================================
   FIX TOUCH EVENTS - ANDROID
   ======================================== */

/* Améliorer les zones tactiles */
.btn,
.nav-link,
.lang-btn-toggle,
.social-card,
.project-card {
    -webkit-tap-highlight-color: rgba(212, 175, 55, 0.2) !important;
    touch-action: manipulation !important;
}

/* Fix pour les animations sur Android */
@media (prefers-reduced-motion: no-preference) {
    * {
        -webkit-backface-visibility: hidden !important;
        backface-visibility: hidden !important;
        -webkit-perspective: 1000 !important;
        perspective: 1000 !important;
    }
}

/* ========================================
   FIX FONTS - ANDROID
   ======================================== */

body,
button,
input,
textarea {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif !important;
}

/* ========================================
   FIX SCROLL - ANDROID
   ======================================== */

html {
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
}

body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

/* Fix pour le scroll horizontal sur Android */
* {
    max-width: 100%;
}

/* ========================================
   FIX ORIENTATION - ANDROID
   ======================================== */

/* Portrait */
@media screen and (orientation: portrait) and (max-width: 600px) {
    .hero {
        min-height: 100vh !important;
    }
    
    .project-card {
        width: 280px !important;
        min-width: 280px !important;
    }
}

/* Landscape */
@media screen and (orientation: landscape) and (max-height: 600px) {
    .hero {
        min-height: 100vh !important;
        padding-top: 60px !important;
    }
    
    .hero h1 {
        font-size: 2rem !important;
    }
}

/* ========================================
   FIX CHROME ANDROID SPECIFIC
   ======================================== */

/* Fix pour la barre d'adresse Chrome qui se cache */
@supports (-webkit-touch-callout: none) {
    .hero {
        min-height: -webkit-fill-available !important;
    }
    
    html {
        height: -webkit-fill-available !important;
    }
}

/* ========================================
   FIX Z-INDEX - ANDROID
   ======================================== */

.navbar {
    z-index: 99999 !important;
}

.language-switcher,
.language-switcher-dropdown {
    z-index: 9998 !important;
}

.lang-dropdown,
.lang-dropdown-menu {
    z-index: 9997 !important;
}

/* ========================================
   FIX BLUR - ANDROID
   ======================================== */

/* Désactiver blur sur Android pour performance */
@supports (-webkit-appearance: none) {
    .lang-btn-toggle,
    .lang-dropdown {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(26, 26, 26, 0.98) !important;
    }
}
