/* =============================
   🖼️ IMAGES DYNAMIQUES ET FONDS
   =============================
   Fichier dédié aux images de fond dynamiques et propriétés
   qui étaient précédemment gérées par des styles inline
*/

/* =============================
   🏠 HOME MENU - CARTES AVEC IMAGES DYNAMIQUES
   ============================= */

/* Carte Jardin avec overlay spécial — image d\u00e9clar\u00e9e une seule fois via .bg-jardin */
.menu-card-jardin,
.bg-jardin {
  background-image: url("https://pub-ad2f7e4aa0604ffcbfb24f59c89d840a.r2.dev/orval/jardin/fleurs-bourrache-jardin-de-margny-1600w.webp");
  background-color: #e5e7eb; /* fallback */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Carte standard avec image dynamique */
.menu-card-standard {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* IMAGE RESET – fallback backgrounds cleared, placeholder for future integration */
.bg-gite {
  background-color: #e5e7eb;
}

.bg-chambres-hotes {
  background-color: #e5e7eb;
}

.bg-environs {
  background-color: #e5e7eb;
}

.bg-activites {
  background-color: #e5e7eb;
}

.bg-contacts {
  background-color: #e5e7eb;
}

/* IMAGE RESET – data-image selectors preserved, images cleared */
.menu-card-standard[data-image="Gite_cuisine.JPG"] {
  background-image: url("https://pub-ad2f7e4aa0604ffcbfb24f59c89d840a.r2.dev/orval/gite/cuisine-gite-jardin-de-margny.jpg");
  background-color: #d1d5db; /* fallback */
}

.menu-card-standard[data-image="jardin-de-margny-chambres-espace-commun-1.jpg"] {
  background-image: url("https://pub-ad2f7e4aa0604ffcbfb24f59c89d840a.r2.dev/orval/chambres_d_hotes/cuisine-chambres-hotes-jardin-de-margny.jpg");
  background-color: #d1d5db; /* fallback */
}

.menu-card-standard[data-image="/jardin/jardin-de-margny-fleurs-jardin-2.jpg"] {
  background-image: url("https://pub-ad2f7e4aa0604ffcbfb24f59c89d840a.r2.dev/orval/jardin/campagne-gaumaise-vue-champs-jardin-de-margny.jpg");
  background-color: #d1d5db; /* fallback */
}

.menu-card-standard[data-image="jardin-de-margny-fleurs-jardin-1.jpg"] {
  background-image: url("https://pub-ad2f7e4aa0604ffcbfb24f59c89d840a.r2.dev/orval/activitees/images_groseilles-rouges-jardin-de-margny-fruits-du-verger.jpg");
  background-color: #d1d5db; /* fallback */
}

.menu-card-standard[data-image="legume_2.jpeg"] {
  background-image: url("https://pub-ad2f7e4aa0604ffcbfb24f59c89d840a.r2.dev/orval/logo/logo_original.jpg");
  background-color: #d1d5db; /* fallback */
}

/* =============================
   🌿 GARDEN SECTIONS - SECTIONS AVEC IMAGES DE FOND
   ============================= */

/* Section jardin avec image de fond */
.garden-section-bg {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* IMAGE RESET – garden section data-image selectors preserved, images cleared */
.garden-section-bg[data-image="jardin_1.jpeg"] {
  /* IMAGE RESET – placeholder for future integration */
  background-color: #d1d5db;
}

.garden-section-bg[data-image="jardin_2.jpeg"] {
  /* IMAGE RESET – placeholder for future integration */
  background-color: #d1d5db;
}

.garden-section-bg[data-image="jardin_3.jpeg"] {
  /* IMAGE RESET – placeholder for future integration */
  background-color: #d1d5db;
}

.garden-section-bg[data-image="jardin_4.jpeg"] {
  /* IMAGE RESET – placeholder for future integration */
  background-color: #d1d5db;
}

/* =============================
   🎬 ACTIVITIES SECTION - IMAGES AVEC POSITIONNEMENT
   ============================= */

/* Image avec bordure arrondie */
.activity-image-rounded {
  border-radius: 15px;
}

/* Image potager avec positionnement spécifique */
.activity-image-potager {
  border-radius: 15px;
  object-position: center 15%;
}

/* Image plantes avec positionnement spécifique */
.activity-image-plantes {
  border-radius: 15px;
  object-position: center 15%;
}

/* Image cuisine avec positionnement spécifique */
.activity-image-cuisine {
  border-radius: 15px;
  object-position: center 5%;
}

/* =============================
   🎥 PAGE JARDIN - VIDÉO ET CONTENEUR
   ============================= */

/* Conteneur vidéo principal */
.video-container-main {
  background-color: #f5f5f5;
  width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* =============================
   🏡 PAGE GÎTE - CONTENEUR ET EN-TÊTE
   ============================= */

/* Conteneur principal de la page Gîte */
.gite-container-main {
  background-color: #f6f1e9;
  width: 100%;
  min-height: 100vh;
  padding-top: 2rem;
}

/* Section en-tête de la page Gîte */
.gite-header-section {
  text-align: center;
  padding: 2rem 1rem;
  margin-bottom: 2rem;
}

/* Contenu principal de la page Gîte */
.gite-content {
  padding: 0 1rem 2rem 1rem;
}

/* Vidéo responsive */
.video-responsive {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}

/* =============================
   🗺️ GOOGLE MAP - IFRAME SANS BORDURE
   ============================= */

/* Iframe Google Maps sans bordure */
.map-iframe-no-border {
  border: 0;
}

/* =============================
   🖱️ GITE CAROUSEL - CURSEUR POINTEUR
   ============================= */

/* Curseur pointeur pour les éléments cliquables */
.cursor-pointer {
  cursor: pointer;
}

/* =============================
   📱 RESPONSIVE DESIGN
   ============================= */

@media (max-width: 768px) {
  .video-container-main {
    min-height: 80vh;
  }
  
  .video-responsive {
    border-radius: 8px;
  }
}

@media (max-width: 480px) {
  .video-container-main {
    min-height: 70vh;
  }
  
  .video-responsive {
    border-radius: 6px;
  }
} 