/* ====== Opening (calendrier 6×7) — polish ====== */

.page--opening{
  padding: 2rem;
}

/* Mobile (cohérent avec questions.css) */
@media (max-width:767px){
  .page--opening{ padding: 1rem; }
}

/* Wrapper : centre + look “carte” moderne, scroll horizontal sur mobile */
.opening-grid-wrap{
  max-width: 1200px;
  margin: 0 auto;

  overflow-x: auto;
  -webkit-overflow-scrolling: touch;

  padding-bottom: .75rem;

  border-radius: 18px;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(0,0,0,0.08);
  border-left: 4px solid rgba(217,55,49,0.65);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}

/* Grille 7 colonnes */
.opening-grid{
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  min-width: 720px; /* force 7 colonnes et active le scroll < 720px */
}

/* Traits internes plus doux que le rouge plein */
:root{
  --openingLine: rgba(217,55,49,0.32);
}

.opening-cell{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;

  padding: .85rem .65rem;
  min-height: 84px;

  border-right: 1px solid var(--openingLine);
  border-bottom: 1px solid var(--openingLine);
  background: rgba(255,255,255,0.92);
}

/* Dernière colonne : pas de trait droit */
.opening-cell.is-last-col{ border-right: none; }

/* Dernière rangée : pas de trait bas */
.opening-grid > .opening-cell:nth-last-child(-n+7){
  border-bottom: none;
}

/* Base */
.opening-cell.month-even {
    background-color: #eef0f3;
}
/* un peu plus foncé */
.opening-cell.month-odd {
    background-color: #ffffff;
}

/* Typographie (proche de questions.css) */
.opening-cell__date{
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: .35rem;
  color: rgba(0,0,0,0.90);
}

.opening-cell__hours{
  font-size: .95rem;
  line-height: 1.25;
  color: rgba(0,0,0,0.72);
}

/* Optionnel : style “fermé” (si tu ajoutes la classe is-closed en markup) */
.opening-cell.is-closed .opening-cell__hours{
  color: rgba(217,55,49,0.95);
  font-weight: 700;
}

@media (hover:hover) {
    .opening-cell {
        transition: background-color 140ms ease, box-shadow 140ms ease;
        will-change: background-color, box-shadow;
    }

        .opening-cell:hover {
            /* Effet très léger, aucune translation, aucune bordure externe */
            box-shadow: inset 0 0 0 1px rgba(0,0,0,.10), inset 0 10px 18px rgba(0,0,0,.03);
        }

        .opening-cell.month-even:hover {
            background-color: #e6eaef;
        }

        .opening-cell.month-odd:hover {
            background-color: #f7f8fa;
        }
}


/* < 768px : densité un peu plus compacte */
@media (max-width:767px){
  .opening-grid{ min-width: 720px; }

  .opening-cell{
    padding: .7rem .55rem;
    min-height: 74px;
  }

  .opening-cell__date{ font-size: .95rem; margin-bottom: .25rem; }
  .opening-cell__hours{ font-size: .85rem; }
}

/* 769–1199px : un peu plus d’air */
@media (min-width:769px) and (max-width:1199px){
  .opening-cell{ min-height: 90px; }
}

/* ≥ 1200px : lecture confortable */
@media (min-width:1200px){
  .opening-cell{ min-height: 96px; }
  .opening-cell__date{ font-size: 1.02rem; }
  .opening-cell__hours{ font-size: .98rem; }
}

/* Slideshow : même largeur que le calendrier */
.page--opening .hero-slideshow{
  max-width: 1200px;
  margin: 2rem auto 0;
}