/* ============================================================================
   pdf-reader.css — Lecteur PDF embarqué (assets/js/lettre-reader.js, PDF.js)
   ----------------------------------------------------------------------------
   Partagé par les Lettres (archive, page d'une lettre) et les galeries dont
   une vignette mène à un PDF (arrêtés préfectoraux, page Partenaires).
   Chargé en dépendance de lettres.css, ou par le bloc galerie au besoin.
   ========================================================================== */

:root {
  --pdfr-shadow:      color-mix(in srgb, var(--ink) 28%, transparent);
  --pdfr-shadow-soft: color-mix(in srgb, var(--ink) 10%, transparent);
  --pdfr-bar-h:       56px;
}
.pdfr__bar {
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px;
  min-height: var(--pdfr-bar-h); padding: 0 12px;
}
.pdfr__title {
  margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: var(--display); font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
}
.pdfr__nav, .pdfr__tools { display: flex; align-items: center; gap: 2px; }
.pdfr__tools { justify-content: flex-end; }
.pdfr__count, .pdfr__zoom { font-family: var(--serif); font-size: var(--fs-note); font-variant-numeric: tabular-nums; min-width: 4.5em; text-align: center; }
.pdfr__btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--tap-min); height: var(--tap-min); padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: inherit; cursor: pointer; transition: background var(--transition), color var(--transition);
}
.pdfr__btn:disabled { opacity: .35; cursor: default; }
.pdfr__btn:focus-visible { outline: 2px solid var(--ochre); outline-offset: -2px; }
.pdfr__status { margin: 48px auto; text-align: center; font-family: var(--serif); font-style: italic; font-size: 20px; }
.pdfr__status[hidden] { display: none; }
.pdfr__status a { margin-left: 8px; color: inherit; }
.pdfr__pages { display: flex; flex-direction: column; align-items: center; gap: 24px; width: max-content; min-width: 100%; box-sizing: border-box; }
.pdfr__page { position: relative; max-width: none; background: var(--paper); box-shadow: 0 6px 24px var(--pdfr-shadow); }
.pdfr__page canvas { display: block; width: 100%; height: 100%; }
.pdfr__page:not(.is-drawn)::after {
  content: ""; position: absolute; inset: 0; margin: auto; width: 28px; height: 28px; border-radius: 50%;
  border: 2px solid var(--rule); border-top-color: var(--ochre); animation: pdfr-spin 1s linear infinite;
}
@keyframes pdfr-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .pdfr__page:not(.is-drawn)::after { animation: none; } }

/* Plein écran (<dialog>) : fond encre, pages centrées, défilement interne. */
.pdfr-dialog {
  position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  margin: 0; padding: 0; border: 0; background: var(--ink); color: var(--bone);
  display: none; flex-direction: column;
}
.pdfr-dialog[open] { display: flex; }
.pdfr-dialog::backdrop { background: var(--ink); }
html.has-pdfr-open { overflow: hidden; }
.pdfr-dialog .pdfr__bar { background: var(--burgundy-deep); border-bottom: 1px solid color-mix(in srgb, var(--ochre) 30%, transparent); }
.pdfr-dialog .pdfr__title { color: var(--ochre-soft); }
.pdfr-dialog .pdfr__btn:hover:not(:disabled) { background: color-mix(in srgb, var(--bone) 12%, transparent); }
.pdfr-dialog .pdfr__scroll { flex: 1; overflow: auto; overscroll-behavior: contain; touch-action: pan-x pan-y; }
.pdfr-dialog .pdfr__pages { padding: 24px 16px 48px; transform-origin: 0 0; }

/* Dans la page d'une lettre : pages dans le flux, barre collante sous le header. */
.pdfr--inline .pdfr__bar {
  position: sticky; top: var(--header-h); z-index: 5;
  background: var(--paper); color: var(--ink-soft);
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.pdfr--inline .pdfr__title { color: var(--ochre-deep); }
.pdfr--inline .pdfr__btn:hover:not(:disabled) { background: var(--bone-warm); color: var(--burgundy); }
.pdfr--inline .pdfr__pages { padding: 24px 0 8px; }
.pdfr--inline .pdfr__status { color: var(--ink-soft); }

@media (max-width: 640px) {
  .pdfr__bar { grid-template-columns: 1fr auto; gap: 4px; padding: 0 4px 0 12px; }
  .pdfr__title { grid-column: 1 / -1; padding-top: 8px; font-size: 10px; }
  .pdfr__nav { justify-self: start; margin-left: -8px; }
  .pdfr__zoom { display: none; }
  .pdfr-dialog .pdfr__pages { padding: 12px 8px 32px; gap: 12px; }
}
