/* ===========================
   Variables + bases (hors calendrier/modale)
=========================== */
:root{
  --c-primary:#539795;
  --c-primary-600:#035d67;
  --c-bg:#fff;
  --c-bg-soft:#F5FAFD;
  --c-text:#000;
  --shadow-1:0 5px 21px -14px rgba(0,0,0,.24);
  --shadow-2:0 5px 21px -14px rgba(0,0,0,.14);
  --ring: inset 0 .5em 1.5em #0000001a, inset 0 .125em .5em #00000026;
}

*,
*::before,
*::after { box-sizing: border-box; }

body { background-color: var(--c-bg); }
p { font-size: .9rem; }

/* Liens, icônes, marque */
a, i, .navbar-brand { color: var(--c-primary); }
a:hover, i:hover, .navbar-brand:hover { color: var(--c-primary-600); }
i { font-size: 1.8rem; }
.navbar-brand { font-size: 1.4rem; }

/* Titres */
h2 {
  font-size: 1.4rem;
  margin: 48px 0;
  text-align: center;
  color: var(--c-primary);
}
.home h2 {
  font-size: 2.6rem;
  margin: 18px 0;
  color: var(--c-primary-600);
}
h3 {
  text-align: center;
  font-size: 1.3rem;
  margin: 48px 0;
  color: var(--c-primary);
}
.row h3 { margin: 0; }
h4 {
  text-align: center;
  font-size: 1.2rem;
  margin: 12px 0;
}
h5 { font-size: 1rem; font-weight: 600; }

/* Helpers généraux */
header a i { margin-right: 8px; }
.navbar-collapse { flex-grow: 0 !important; }
.b-divider{
  width:100%;
  height:3rem;
  background-color: var(--c-bg-soft);
  border:1px solid rgba(0,0,0,.15);
  border-left:0; border-right:0;
  box-shadow: var(--ring);
}
.b{
  padding:25px;
  background-color: var(--c-bg-soft);
  box-shadow: var(--ring);
  text-align:center;
}

/* Navigation */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link{
  color:#fff;
  background-color: var(--c-primary);
}
.nav-link{ color: var(--c-primary); }
.nav-link:focus,
.nav-link:hover{ color: var(--c-primary-600); }

/* Hero */
.home{
  background: url('../img/home.png') bottom center no-repeat;
  min-height: 600px;
}

/* Icônes sections */
.rul .bi { font-size: 2.2rem; }

/* Boutons */
.btn-primary{
  background-color: var(--c-primary);
  border-color: var(--c-primary);
}
.btn-primary:hover{
  background-color: var(--c-primary-600);
  border-color: var(--c-primary-600);
}
.btn-outline-secondary{
  background-color:#fff;
  color: var(--c-primary);
  border-color: var(--c-primary);
}
.btn-outline-secondary:hover{
  background-color: var(--c-primary-600);
  border-color: var(--c-primary-600);
  color:#fff;
}

/* Variantes boutons dans formulaires */
.reserv-form .btn-primary,
.form .btn-primary{
  background-color:#fff;
  border-color: var(--c-primary-600);
  color: var(--c-primary-600);
}
.reserv-form .btn-primary:hover,
.form .btn-primary:hover{
  background-color: var(--c-primary-600);
  border-color:#fff;
  color:#fff;
}

/* Cartes / blocs */
.review,
.form,
.reserv-form{
  margin:30px 0;
  padding:30px 20px;
  min-height:350px;
  border:1px solid var(--c-primary-600);
  border-radius:12px;
  box-shadow: var(--shadow-2);
  font-size:.8rem;
}
.reserv-form{
  margin:0;
}
.review{ min-height:380px; }
.reserv-title { padding:72px 0; }
.quote { position:relative; top:-10px; }
.titre { font-size:1rem; }
.nom { font-size:.9rem; color: var(--c-primary); }

.dropdown-menu div a{
  text-align:right;
  font-size:.9rem;
}

/* RGPD */
#rgpd-box{
  position:fixed;
  bottom:36px;
  right:36px;
  z-index:9999;
}

/* Listes spécifiques */
.comment ul { list-style:none; }

/* Form floating */
.form-floating > label { color: var(--c-text); }

/* Couleurs utilitaires */
.bg-primary { background: var(--c-primary) !important; }

/* Sections génériques non-calendrier */
.heading-section{
  font-size:28px;
  color: var(--c-text);
}
.img{
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
}

/* ===========================
   Media Queries (hors calendrier/modale)
=========================== */
@media (max-width: 767.98px){
  .nav-pills{
    width:500px;
    display:inline-block;
  }
  .navbar-toggler{ display:block; }
  .show .nav-link{ padding-left:8px !important; }
  .sho .nav-item{ width:100%; }
}

@media (max-width: 575.98px){
  .home{ min-height:680px; }
  #rgpd-box{ right:6px; }
}

/* ======================================================
   ⛔️ A partir d’ici : CALENDRIER & MODALE — INCHANGÉS
   (collé tel quel depuis ton CSS d’origine)
====================================================== */

/*  Events display */
.events-container {
  margin: 0;
  padding: 0;
  border-bottom-right-radius: 3px;
  border-top-right-radius: 3px;
  }
  @media (max-width: 767.98px) {
    .events-container {
       } }

.event-card {
  padding: 8px 0;
  max-width: 100%;
  background: #539795;
  border: none !important;
  border-radius: 16px;
  margin: 20px;
  margin-left: 12px; 
  text-align: center;
}
.event-link {
  display: block;
  width: 100%;
  height: 100%;
  font-size: 1.2rem;
  text-decoration: none!important;
  cursor: pointer;
  color: #fff;
  font-weight: 600;
}
.event-name {
  color: #fff;
  font-weight: 600;

}
  @media (max-width: 991.98px) {
    .event-card {
      margin: 10px; } }
  @media (max-width: 767.98px) {}

/*  Calendar wrapper */
.calendar-container {
  margin: 0 auto;
  background: #fff;
  font: 13px Helvetica, Arial, san-serif;
  }
  @media (max-width: 991.98px) {
    .calendar-container {
      padding: 0;
       } }
  @media (max-width: 767.98px) {
    .calendar-container {
      margin: 0 auto;
      padding: 0;
       
    }
}
/* Calendar Header */
.year-header {
  width: 100%;
  height: 40px;
  text-align: center;
  position: relative;
  color: #fff;
  border-top-left-radius: 3px;}

.year-header span {
  display: inline-block;
  font-size: 20px;
  line-height: 40px;
  color: #000;
  margin: auto 0;
}

.left-button, .right-button {
  cursor: pointer;
  width: 28px;
  text-align: center;
  position: absolute;
  color: #000 !important;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
  font-size: 14px !important; }
  @media (prefers-reduced-motion: reduce) {
    .left-button, .right-button {
      -webkit-transition: none;
      -o-transition: none;
      transition: none; } }
  .left-button:hover, .right-button:hover {
    color: #7e0cf5 !important; }

.left-button {
  left: 0; }

.right-button {
  right: 0;
  top: 0; }

/* Days/months tables */
.days-table, .dates-table, .months-table {
  width: 100%;
  border-collapse: separate;
  text-align: center; }

.day {
  height: 26px;
  width: 26px;
  padding: 0 10px;
  line-height: 26px;
  border: 2px solid transparent;
  text-transform: uppercase;
  font-size: 10px;
  color: #000; }

.month {
  cursor: default;
  padding: 0 2px;
  padding-top: 10px;
  line-height: 26px;
  text-transform: uppercase;
  font-size: 11px;
  color: #666;
  -webkit-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms; }
  @media (max-width: 991.98px) {
    .month {
      font-size: 8px; } }
  @media (max-width: 767.98px) {
    .month {
      font-size: 10.5px; } }

.active-month {
  font-weight: 700;
  color: #539795; }

.month:hover {
  color: #035d67; }

/*  Dates table */
.table-date {
  cursor: default;
  color: #2b2b2b;
  height: 26px;
  width: 26px;
  font-size: 15px;
  padding: 10px;
  line-height: 26px;
  text-align: center;
  border-radius: 50%;
  border: 2px solid transparent;
  -webkit-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms; }

.table-date:not(.nil):hover {
  border-color: #cd4dcc; }

.event-date {
  border-color: #539795;
  background: #539795;
  color: #fff; }
  .event-date:after {
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    content: '';
    background: #28a745; }

.active-date {
  background: #fff;
  color: #539795; }

.event-date.active-date {
  background: #fff; }

/* input dialog */
.dialog {
  z-index: 5;
  background: #000;
  position: absolute;
  width: 50%;
  height: 500px;
  top: 0;
  right: 0;
  display: none; }
  @media (max-width: 767.98px) {
    .dialog {
      width: 100%; } }

.dialog-header {
  margin: 20px;
  color: #fff;
  text-align: center;
  font-size: 28px; }

/* Modale (inchangée) */
@media (max-width: 767.98px) {
  .modal-body { width: 440px!important; }
}
@media (max-width: 575.98px) {
  .modal-body { width: 390px!important; }
}

/* Cartes modernes (hors calendrier) */
.card-modern {
  border: none;
  border-radius: 18px;
  box-shadow: 0 15px 35px rgba(0,0,0,0.08);
  margin-bottom: 36px;
}
.card-modern .card-header {
  border-bottom: none;
  background: linear-gradient(135deg, #539795, #035d67);
  color: #fff;
  border-radius: 18px 18px 0 0;
}
.badge-step {
  font-size: 0.7rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.section-title {
  font-size: 0.95rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #000;
  margin-bottom: 0.25rem;
}
.divider {
  height: 1px;
  background: linear-gradient(to right, transparent, #035d67, transparent);
  margin: 1.5rem 0;
}
.appointment-meta small {
  display: block;
  color: rgba(255,255,255,0.85);
}
.reserv-form {
  background: #ffffff;
  border-radius: 14px;
}
