/* ===================================
   CRITICAL FIXES - Load this LAST
   =================================== */

/* FIX 1: Make images appear smoothly (not instantly/glitchy) */
img {
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
}

/* Navigation and logo - always visible immediately */
.logo img,
.nav-link,
.navbar * {
    opacity: 1 !important;
    transition: none !important;
}

/* Hero elements - smooth fade in */
.chicken-icon img,
.chicken-icon-small img,
.quality-badge img,
.quality-badge-large img {
    animation: smoothFadeIn 0.8s ease-in-out;
}

@keyframes smoothFadeIn {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Text elements - visible but can animate */
[data-animate],
.hero-title,
.hero-subtitle,
.hero-description,
.section-title {
    opacity: 1;
}

/* FIX 2: POS Page Mobile - Keep overlap effect like reference */
@media (max-width: 968px) {
    .pos-hero {
        overflow: visible !important;
        height: 60vh !important;
        min-height: 500px !important;
    }
    .pos-intro-box {
        position: absolute !important;
        bottom: -10% !important;
        left: 5% !important;
        right: 5% !important;
        z-index: 10 !important;
    }
    .map-section {
        padding-top: 120px !important;
    }
}
@media (max-width: 768px) {
    .pos-hero {
        height: 55vh !important;
    }
    .pos-intro-box {
        bottom: -8% !important;
    }
    .map-section {
        padding-top: 100px !important;
    }
}
@media (max-width: 480px) {
    /* Very small phones */
    .pos-hero {
        height: 40vh !important;
        min-height: 320px !important;
    }
    
    .pos-intro-box {
        margin: 0 10px 15px !important;
        padding: 20px 15px !important;
    }
    
    .pos-intro-box p {
        font-size: 13px !important;
        line-height: 1.5 !important;
    }
    
    .map-section .section-title {
        font-size: 20px !important;
        line-height: 1.3 !important;
    }
    
    .location-card {
        flex: 0 0 85vw !important;
    }
    
    .location-header,
    .location-body,
    .location-footer {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    
    .location-name h3 {
        font-size: 20px !important;
    }
    
    .location-slider-btn {
        width: 35px !important;
        height: 35px !important;
        font-size: 14px !important;
    }
}

/* FIX 3: Prevent text from being invisible */
body * {
    opacity: 1;
}

/* FIX 4: Loading screen should hide after page loads */
.loading-screen.hidden {
    display: none !important;
}

/* FIX 5: Make sure nav is always on top */
.navbar {
    z-index: 1000 !important;
}

/* FIX 6: Hero images should be visible */
.hero-images img,
.left-chicken img,
.right-chicken img {
    opacity: 1 !important;
}