/* FIXED BACKGROUND FOR MOBILE - Solution alternative pour iOS/Android */

/* Remove background-attachment from body for mobile */
@media (max-width: 768px) {
  body {
    background-image: none !important;
    background-attachment: scroll !important;
    overflow-x: hidden;
    position: relative;
  }
  
  /* Create fixed background using pseudo-element */
  /* DÉSACTIVÉ - Maintenant géré par #sf-bg-image */
  /* body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100vh;
    max-height: 100%;
    background-image: url('/assets/backgrounds/background.jpeg');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    z-index: -1;
    pointer-events: none;
  } */
  
  /* Ensure content scrolls above fixed background */
  #root {
    position: relative;
    z-index: 1;
    background: transparent !important;
    min-height: 100vh;
  }
  
  /* Header FIXED on mobile - ALWAYS visible at top */
  header, .site-header, .geek-o-rama-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  }
  
  /* Add padding to body to compensate for fixed header */
  body {
    padding-top: 80px !important; /* Adjust based on header height */
  }
  
  /* Ensure main content starts below the fixed header */
  main, #root > div {
    margin-top: 0 !important;
  }
  
  /* Content blocks with semi-transparent background to see background image */
  main {
    background: transparent !important;
  }
  
  /* Individual content cards */
  .home-carousel, .content-block, .card {
    background: #ffffff !important;
    background-color: #ffffff !important;
  }
}

/* For larger screens, keep the original behavior */
@media (min-width: 769px) {
  body {
    background-attachment: fixed !important;
    padding-top: 0 !important; /* No padding needed on desktop */
  }
  
  /* Header sticky on desktop */
  header, .site-header, .geek-o-rama-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: #ffffff !important;
    backdrop-filter: none;
  }
}

/* Ensure content area is relative - FOND BLANC OPAQUE 100% */
main {
  background: transparent !important;
  position: relative;
  z-index: 1;
}

.home-carousel, .content-block {
  background: #ffffff !important;
  background-color: #ffffff !important;
  position: relative;
  z-index: 1;
}