/* ==========================================================================
   Lecteur PDF partagé (packages/pdf-viewer/index.js)

   Reprend le vocabulaire des modales de la maquette (voile sombre flouté,
   carte blanche, rayon 5px) pour que le plan s'ouvre comme la carte ou la
   présentation. Le balisage est créé par le module : pas de HTML à écrire
   dans la page, seulement cette feuille à lier.
   ========================================================================== */

.pdf-modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(6px);
  display: none;
  /* Au-dessus des autres modales de la maquette (999) : le plan s'ouvre
     depuis la fiche villa, qui reste en place derrière. */
  z-index: 1000;
}

.pdf-modal.active {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

/* Le fond de la page ne doit pas défiler pendant qu'on parcourt le plan */
body.pdf-modal-open {
  overflow: hidden;
}

.pdf-card {
  display: flex;
  flex-direction: column;

  width: min(94vw, 1040px);
  height: min(88vh, 920px);

  border-radius: 5px;
  overflow: hidden;
  background: #fff;
  color: #111;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}

/* ---- Barre d'outils ---- */

.pdf-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;

  flex: 0 0 auto;
  height: 54px;
  padding: 0 10px 0 18px;

  border-bottom: 1px solid rgba(17, 17, 17, 0.1);
  background: #fff;
}

.pdf-title {
  flex: 1 1 auto;
  min-width: 0;

  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pdf-counter,
.pdf-zoom {
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #7b8087;
}

.pdf-zoom {
  min-width: 52px;
  text-align: center;
}

.pdf-tools {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 0 0 auto;
}

.pdf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 38px;
  height: 38px;
  border: none;
  border-radius: 5px;
  padding: 0;

  background: transparent;
  color: #111;
  cursor: pointer;
  transition: background-color 0.2s;
}

.pdf-btn:hover {
  background: rgba(17, 17, 17, 0.06);
}

/* ---- Zone de lecture ---- */

.pdf-scroll {
  position: relative;
  flex: 1 1 auto;
  overflow: auto;
  background: #ececed;
  -webkit-overflow-scrolling: touch;
}

/* min-width centre les pages tant qu'elles tiennent dans la largeur ;
   width laisse les conteneurs s'élargir avec le zoom pour que le défilement
   horizontal de .pdf-scroll prenne le relais. Les deux niveaux doivent porter
   la règle : sinon .pdf-doc reste à la largeur du cadre et rogne les pages
   zoomées au lieu de les laisser déborder. */
.pdf-doc,
.pdf-doc-inner {
  min-width: 100%;
  width: max-content;
}

.pdf-doc-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 16px;
}

/* Emplacement de page : dimensionné en ligne par render() dès l'ouverture,
   il tient la place (et donc la barre de défilement) avant même que la page
   soit rastérisée. Le fond blanc fait lire l'attente comme une page vierge
   plutôt que comme un trou. */
.pdf-page {
  display: block;
  flex: 0 0 auto;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
}

.pdf-page canvas {
  display: block;
  width: 100%;
  height: 100%;
}

/* ---- Chargement / erreur ---- */

.pdf-status {
  position: absolute;
  inset: 0;

  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 24px;

  text-align: center;
  font-size: 14px;
  color: #4c5166;
  background: #ececed;
}

.pdf-status.visible {
  display: flex;
}

.pdf-status p {
  margin: 0;
}

.pdf-fallback {
  display: inline-flex;
  align-items: center;

  padding: 11px 22px;
  border-radius: 5px;

  background: #111;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.pdf-fallback:hover {
  background: #393a44;
}

/* ---- Mobile : le plan mérite tout l'écran ---- */

@media (max-width: 700px) {
  .pdf-modal.active {
    padding: 0;
  }

  .pdf-card {
    width: 100vw;
    height: 100dvh;
    border-radius: 0;
  }

  .pdf-toolbar {
    padding: 0 6px 0 14px;
    gap: 6px;
  }

  /* Les pictogrammes suffisent : on garde le compteur de pages, pas le
     pourcentage de zoom. */
  .pdf-zoom {
    display: none;
  }

  .pdf-btn {
    width: 40px;
    height: 40px;
  }
}