/* =========================================================================
   Le Repère — Flipbook d'images (cartes PDF). Surcharge carte.css.
   Chargé APRÈS carte.css.
   ========================================================================= */

/* --- Spread : centre des pages au ratio A5/A4 (≈ 1:1.42) --- */
.page-carte .book__spread {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}

.page-carte .book__page {
  background: var(--paper, #fbf7ec);
  height: 100%;
  max-height: 100%;
  width: auto;
  max-width: 50%;
  aspect-ratio: 1500 / 2129;     /* ratio des images rendues */
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.page-carte .book__page:empty {
  background: transparent;
  box-shadow: none;
}

.flip-img {
  width: 100%;
  height: 100%;
  object-fit: contain;            /* ratio image = ratio page → pas de rognage */
  display: block;
  cursor: zoom-in;
  -webkit-user-drag: none;
  user-select: none;
}

/* fondu léger au changement de page */
.page-carte .book__spread.is-turning .flip-img {
  animation: flipFade .32s var(--ease, ease);
}
@keyframes flipFade {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}

/* mobile : une seule page (la droite). Dimensionner PAR LA LARGEUR (hauteur auto)
   sinon height:100% + largeur contrainte écrase l'aspect-ratio → bandes vides. */
@media (max-width: 1024px) {
  .page-carte .book { padding-left: 28px; padding-right: 28px; }
  .page-carte .book__page {
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    aspect-ratio: 1500 / 2129;
  }
  .page-carte .book__page--left { display: none; }
}

/* --- Zoom plein écran --- */
.flip-zoom {
  position: fixed;
  inset: 0;
  z-index: 300;
  background: rgba(20, 15, 12, .94);
  display: none;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  cursor: zoom-out;
}
.flip-zoom.is-open { display: block; }
.flip-zoom__img {
  display: block;
  margin: 0 auto;
  width: min(1500px, 200vw);     /* mobile : ~2× écran → lisible en pannant */
  max-width: none;               /* annule le max-width:100% global (sinon pas de zoom) */
  height: auto;
  box-shadow: 0 10px 50px rgba(0,0,0,.5);
}
.flip-zoom__close {
  position: fixed;
  top: 14px; right: 16px;
  z-index: 301;
  width: 44px; height: 44px;
  border: none; border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: #1b1410;
  font-size: 26px; line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,.35);
}
.flip-zoom__hint {
  position: fixed;
  bottom: 16px; left: 50%;
  transform: translateX(-50%);
  z-index: 301;
  margin: 0;
  color: #fff;
  font-size: .78rem;
  letter-spacing: .03em;
  background: rgba(0,0,0,.5);
  padding: .45rem .95rem;
  border-radius: 30px;
  pointer-events: none;
  white-space: nowrap;
}

/* --- Sommaire : items générés --- */
#tocList { list-style: none; padding: 0; margin: 0; }
.book-toc__item {
  display: flex;
  align-items: baseline;
  gap: .8rem;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border-bottom: 1px solid rgba(151,56,21,.18);
  padding: .85rem .2rem;
  cursor: pointer;
  font-family: var(--font-body, 'Cormorant Garamond', serif);
  color: var(--ink, #1b1410);
  transition: color .2s, padding-left .2s;
}
.book-toc__item:hover { color: var(--terracotta, #973815); padding-left: .6rem; }
.book-toc__num {
  font-family: var(--font-ui, 'Inter', sans-serif);
  font-size: .72rem;
  letter-spacing: .12em;
  color: var(--terracotta, #973815);
  min-width: 1.8em;
}
.book-toc__name { font-size: 1.15rem; }

/* --- Livre fermé (book-trigger) : vraie image de couverture --- */
.book-trigger__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}