/**
 * Fallback CSS for Background Images
 * Ensures images load even if JavaScript fails
 */

/* Hero Section Background */
section#home.hero-bg {
    background-image: url('img/demos/restaurant/backgrounds/background-1.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    min-height: 100vh;
    position: relative;
}

/* Testimonials Background */
section.testimonials-bg {
    background-image: url('img/demos/restaurant/backgrounds/background-2.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    min-height: 60vh;
    position: relative;
}

/* Contact Background */
section.contact-bg {
    background-image: url('img/demos/restaurant/backgrounds/background-1.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    min-height: 80vh;
    position: relative;
}

/* Mobile Fallback - Remove fixed attachment for better performance */
@media (max-width: 768px) {
    section#home.hero-bg,
    section.testimonials-bg,
    section.contact-bg {
        background-attachment: scroll !important;
    }
}

/* Overlay Improvements */
section.hero-bg::before,
section.testimonials-bg::before,
section.contact-bg::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    pointer-events: none;
}

section.hero-bg::before {
    background: rgba(0, 0, 0, 0.4);
}

section.testimonials-bg::before {
    background: rgba(0, 0, 0, 0.3);
}

section.contact-bg::before {
    background: rgba(0, 0, 0, 0.6);
}

/* Ensure content is above overlay */
section.hero-bg .container,
section.testimonials-bg .container,
section.contact-bg .container {
    position: relative;
    z-index: 2;
}