/* MOBILE SECTIONS CSS - For all event pages */

/* Mobile-specific styles for venue/section layouts */
@media (max-width: 768px) {
    /* COMPLETELY RESTRUCTURE SECTIONS FOR MOBILE */
    .venue-section, 
    .section-container,
    .ambiente-section,
    .gastronomia-section,
    .entertainment-section,
    .atmosphere-section,
    .celebration-section,
    .folklore-section,
    .experiencia-section {
        padding: 20px 0 40px 0 !important;
        margin-bottom: 30px !important;
        border-bottom: 1px solid #eee !important;
        display: block !important; /* Override flex */
        margin-top: 30px !important; /* Ensure no overlap with header */
    }
    
    /* Hide all desktop layout elements */
    .venue-section .sig_content_container,
    .venue-section .sig_image_container,
    .venue-section .background_image,
    .section-container .sig_content_container,
    .section-container .sig_image_container,
    .section-container .background_image,
    .ambiente-section .sig_content_container,
    .ambiente-section .sig_image_container,
    .ambiente-section .background_image,
    .gastronomia-section .sig_content_container,
    .gastronomia-section .sig_image_container,
    .gastronomia-section .background_image,
    .entertainment-section .sig_content_container,
    .entertainment-section .sig_image_container,
    .entertainment-section .background_image,
    .folklore-section .sig_content_container,
    .folklore-section .sig_image_container,
    .folklore-section .background_image,
    .experiencia-section .sig_content_container,
    .experiencia-section .sig_image_container,
    .experiencia-section .background_image {
        display: none !important;
    }
    
    /* Show mobile-only content instead */
    .mobile-content {
        display: block !important;
        margin: 0 auto;
        width: 90%;
        max-width: 500px;
    }
    
    /* Style the mobile text box */
    .mobile-text-box {
        background: #fff;
        border: 2px solid #b49383;
        padding: 25px;
        margin-bottom: 25px;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    }
    
    /* Style the mobile image container */
    .mobile-image-container {
        margin-top: 20px;
        text-align: center;
    }
    
    /* Style the mobile images */
    .mobile-image {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
        box-shadow: 0 10px 25px rgba(0,0,0,0.15);
        object-fit: cover !important;
    }
    
    /* Special styling for Bailes Tradicionales image */
    .folklore-section .mobile-image {
        height: 300px !important; /* Force taller height */
        object-position: center 25% !important; /* Position to show dancers better */
    }
    
    /* Fix column offsets on mobile */
    .col-lg-5.offset-lg-7,
    .col-lg-7.offset-lg-5 {
        margin-left: 0;
    }
    
    /* Ensure proper spacing between sections */
    .venue-section + .venue-section,
    .section-container + .section-container {
        margin-top: 20px;
    }
    
    /* Force ALL section images to be visible */
    .venue-section img,
    .section-container img,
    .sig_image img,
    .mobile-visible-img {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        max-height: 350px !important;
        object-fit: contain !important;
        margin: 0 auto !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Hide background images completely on mobile */
    .sig_image .background_image {
        display: none !important;
    }
    
    /* Ensure proper container sizing */
    .sig_image {
        height: auto !important;
        min-height: 200px !important;
        width: 100% !important;
        margin-bottom: 30px !important;
        position: relative !important;
        overflow: visible !important;
        text-align: center !important;
    }
    
    /* Fix spacing for Dominican Introduction section */
    .dominican-intro-section {
        padding-top: 130px !important; /* Extra space for fixed header */
    }
}