@tailwind base;
@tailwind components;
@tailwind utilities;

/* Styles de base pour le rapport lui-même */
body.rapport-body { /* Ajout d'une classe spécifique pour éviter conflits si ce CSS était utilisé ailleurs */
    font-family: 'Inter', sans-serif; /* Police moderne et lisible */
    color: #374151; /* text-gray-700 */
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Inter', sans-serif;
    font-weight: 700; /* bold */
}

.container-report {
    /* @apply max-w-5xl mx-auto p-4; */ /* Géré par Tailwind dans index.html */
}
.title-report-h2 {
    /* @apply text-2xl font-semibold my-4; */ /* Géré par Tailwind dans index.html */
}
.grid-annexes {
    /* @apply grid gap-4 md:grid-cols-2; */ /* Géré par Tailwind dans index.html */
}


/* === OVERRIDES (CSS personnalisé ajouté au site WordPress Airess.net) === */
/* Ce CSS est inclus ici à titre informatif et pour documenter le travail réalisé sur le site client. */

/* === Titre centré sur la page blog === */
.title-page-blog {
  display: flex;
  justify-content: center;   /* Centre horizontalement */
  align-items: center;       /* Centre verticalement */
  height: 100%;              /* Adapter selon la section */
}

.customize-partial-edit-shortcut.customize-partial-edit-shortcut-nav_menu_instance-5b67bfebc44498a95231a9dbc9eced13 {
  display: none !important;
}

/* Taille du titre en mobile uniquement pour la page ID 2396 */
@media only screen and (min-width: 320px) and (max-width: 544px) {
  body.page-id-2396 .title-page-blog h1 {
    font-size: 3rem !important;
  }
}

/* === Extrait tronqué (WPBakery Post Grid) === */
.vc_gitem-post-data-source-post_excerpt p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  position: relative; 
  margin-bottom: 16px;
  color: #555;
  font-size: 0.95rem;
  line-height: 1.5;
}
 
/* === Style de la carte WPBakery (Post Grid) === */

/* 1. Bloc carte */
.vc_grid-item-mini {
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%; /* Pour que les cartes aient la même hauteur dans une grille */
}

/* 2. Image */
.vc_grid-item-mini .vc_gitem-zone-a { /* Zone image */
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  overflow: hidden;
  position: relative;
  aspect-ratio: 16 / 9; /* Maintient un ratio pour l'image */
}
.vc_grid-item-mini .vc_gitem-zone-a img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Assure que l'image couvre la zone */
  transition: transform 0.3s ease;
}
.vc_grid-item-mini:hover .vc_gitem-zone-a img {
  transform: scale(1.05); /* Léger zoom sur l'image au survol de la carte */
}


/* 3. Contenu texte + bouton */
.vc_grid-item-mini .vc_gitem-zone-c { /* Zone contenu */
  padding: 20px;
  flex-grow: 1; /* Permet à cette zone de prendre l'espace vertical restant */
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Espace le titre/extrait du bouton */
}
.vc_grid-item-mini .vc_gitem-zone-c > div:first-child { /* Conteneur pour titre et extrait */
    flex-grow: 1;
}


/* 4. Titre */
.vc_grid-item-mini h4 {
  margin-bottom: 12px;
  font-weight: 600; /* semi-bold */
  line-height: 1.3;
  font-size: 1.2rem; /* Légèrement plus grand */
  color: #1f2937; /* text-gray-800 */
}

/* 5. Bouton */
.vc_grid-item-mini .vc_btn3-container { /* Conteneur du bouton */
    margin-top: auto; /* Pousse le bouton en bas si l'extrait est court */
    padding-top: 1rem; /* Espace au-dessus du bouton */
}
.vc_grid-item-mini .vc_btn3-container a {
  align-self: flex-start;
  padding: 0.6em 1.2em;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  background-color: #0ea5e9; /* sky-500 */
  color: white;
  text-decoration: none;
  font-weight: 500;
  transition: background-color 0.2s ease, transform 0.2s ease;
  display: inline-block;
}
.vc_grid-item-mini .vc_btn3-container a:hover {
  background-color: #0284c7; /* sky-600 */
  transform: translateY(-1px);
}


/* 6. Effet au survol global de la carte */
.vc_grid-item-mini:hover {
  transform: translateY(-5px); /* Légère élévation */
  box-shadow: 0 10px 25px rgba(0,0,0,0.1), 0 5px 10px rgba(0,0,0,0.06); /* Ombre plus prononcée */
}

/* 7. Responsive mobile */
@media (max-width: 767px) {
  .vc_grid-item-mini {
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  }
  .vc_grid-item-mini .vc_gitem-zone-c {
    padding: 16px;
  }
   .vc_grid-item-mini h4 {
    font-size: 1.1rem; 
  }
  .vc_gitem-post-data-source-post_excerpt p {
    font-size: 0.9rem;
    -webkit-line-clamp: 2; /* Moins de lignes sur mobile */
  }
}

/* 8. Select des filtres WPBakery */
.vc_grid-filter-dropdown .vc_grid-styled-select select,
.vc_grid-filter-select .vc_grid-styled-select select {
  width: 100%;
  padding: 0.75em 1em;
  border-radius: 6px;
  border: 1px solid #d1d5db; /* gray-300 */
  background-color: white;
  color: #374151; /* gray-700 */
  appearance: none; /* Supprime le style par défaut du navigateur */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-position: right 0.75em center;
  background-repeat: no-repeat;
  background-size: 1.25em 1.25em;
  padding-right: 2.5em; /* Espace pour l'icône */
}
.vc_grid-filter-dropdown .vc_grid-styled-select select:focus,
.vc_grid-filter-select .vc_grid-styled-select select:focus {
    border-color: #3b82f6; /* blue-500 */
    outline: 2px solid transparent;
    outline-offset: 2px;
    box-shadow: 0 0 0 2px white, 0 0 0 4px #3b82f6; /* ring-2 ring-blue-500 */
}


#blogfooterdanscontent{
	/*display:none;*/
}
#titre-section-content-lp > div > h1 {font-size:35px !important;}

#post-2502 h4 { /* Cible un H4 dans un post spécifique */
  color: black !important; /* Usage de !important à éviter autant que possible */
}

/* Liste avec icônes personnalisées "pros" */
ul.pros li,
ol.pros li {
  position: relative;
  padding-left: 45px; /* Espace pour l'icône + petit décalage */
  margin-bottom: 1.25rem; /* Espacement entre les éléments */
  line-height: 1.7;
}

ul.pros li:last-child,
ol.pros li:last-child {
  margin-bottom: 0;
}

ul.pros li::before,
ol.pros li::before {
  content: "";
  background: url(https://www.impala-webstudio.fr/hubfs/Website/icons/top.svg?width=30&height=30) 
              no-repeat center center / contain;
  position: absolute;
  top: 0.1em; /* Ajustement vertical pour aligner avec le texte */
  left: 0px;
  width: 30px;
  height: 30px;
  display: block;
}

/* Section plein écran avec centrage */
#section-full-size01 {
  display: flex;
  flex-direction: column;
  justify-content: center; 
  align-items: center;     
  width: 100%;
  min-height: 100vh; /* Utiliser min-height pour permettre au contenu de déborder */
  padding: 2rem; /* Ajouter un padding pour que le contenu ne touche pas les bords */
  box-sizing: border-box; /* S'assurer que le padding est inclus dans width/height */
}