div.information-camping {
   margin: auto;
   margin-top: 25px;
   margin-bottom: 25px;
   max-width: 500px;
   border: 5px solid #ffea83;
   border-radius: 10px;
   padding: 10px;
   font-style: italic;
   background-color: #fffac8;
   color: #694913;
}

.pricing-table {
   width: 100%;
   border-collapse: collapse;
   font-family: system-ui, -apple-system, sans-serif;
   background: var(--bg-color-global);
}

.pricing-table th,
.pricing-table td {
   padding: 12px 14px;
   border: 1px solid #e0e0e0;
   text-align: center;
   /* background-color: #ffffff; */
}

.pricing-table th {
   color: #fff;
   background-color: var(--bg-color-logoCamping);
}

.pricing-table td:first-child {
   text-align: left;
   font-weight: 600;
}

.pricing-table tbody tr:nth-child(even) {
   background: #f7f9f8;
}

.pricing-table tbody tr:nth-child(odd) {
   background: #ffffff;
}

/* 📱 Mobile responsive */
@media (max-width: 768px) {
   .pricing-table thead {
      display: none;
   }

   .pricing-table,
   .pricing-table tbody,
   .pricing-table tr,
   .pricing-table td {
      display: block;
   }

   .pricing-table tr {
      margin-bottom: 16px;
      border: 1px solid #dddddd;
      border-radius: 8px;
      overflow: hidden;
      background: #ffffff;
   }

   .pricing-table td:first-child {
      padding-left: 12px;
   }

   .pricing-table td {
      text-align: right;
      padding: 10px 12px;
      position: relative;
      padding-left: 50%;
   }

   .pricing-table td::before {
      content: attr(data-label);
      position: absolute;
      left: 12px;
      font-weight: 600;
      color: #2f6f5f;
      text-align: left;
      width: 50%;
      overflow-y: hidden;
      /* white-space: nowrap; */
   }

   .pricing-table td:first-child {
      color: #fff;
      background-color: var(--bg-color-logoCamping);
      text-align: left;
      font-weight: 700;
   }
}

.fit-image {
   width: 90%;
   margin: 10px;
}

.max-image {
   width: 90%;
   max-width: 500px;
   margin: 10px;
}

.gallery {
   display: flex;
   justify-content: space-evenly;
   align-items: flex-start;
   gap: 10px;
   flex-wrap: wrap;
   width: 100%;
}

/* TODO maybe ? rendre ça paramétré pour le nombre d'image */
.gallery img {
   height: 20vw;
   width: auto;
   object-fit: contain;
   border-radius: 5px;
}

@media screen and (max-width: 1000px) {
   .gallery img {
      height: 25vw;
   }
}

@media screen and (max-width: 600px) {
   .gallery img {
      height: 30vw;
   }
}