/* ═══════════════════════════════════════════════════════
   Parish Publisher — Bulletin Archive & Flipbook Viewer
   Uses the --pp- variables defined in parish-publisher.css
═══════════════════════════════════════════════════════ */

.pp-bulletin-archive *, .pp-bulletin-header, .pp-bulletin-header * { box-sizing: border-box; }

.pp-bulletin-header {
  text-align: center; padding: 2.2rem 1rem 1.6rem; margin-bottom: .4rem;
  border-bottom: 1px solid var(--pp-border);
}
.pp-bulletin-header-eyebrow {
  display: inline-block; font-family: var(--pp-sans); font-size: 12.5px; font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; color: var(--pp-blue);
  background: var(--pp-blue-lt); padding: 4px 14px; border-radius: 20px; margin-bottom: .7rem;
}
.pp-bulletin-header-title {
  font-family: var(--pp-serif); font-weight: 600; font-size: clamp(1.8rem, 4vw, 2.6rem);
  color: var(--pp-slate); margin: 0;
}

.pp-bulletin-year-group { display: block; }

.pp-bulletin-year {
  font-family: var(--pp-serif); font-size: 1.3rem; font-weight: 600;
  color: var(--pp-slate); margin: 1.6rem 0 .9rem; padding-bottom: .4rem;
  border-bottom: 1px solid var(--pp-border);
}
.pp-bulletin-year-group:first-child .pp-bulletin-year { margin-top: 0; }

.pp-bulletin-more-wrap { text-align: center; margin: 1.8rem 0 .5rem; }
.pp-bulletin-load-more { border: none; cursor: pointer; font-family: var(--pp-sans); }
.pp-bulletin-load-more:disabled { opacity: .6; cursor: default; }

.pp-bulletin-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 20px; margin-bottom: .5rem;
}

.pp-bulletin-card {
  background: var(--pp-white); border: 1px solid var(--pp-border); border-radius: var(--pp-r);
  overflow: hidden; cursor: pointer; box-shadow: var(--pp-shadow); transition: transform .15s, box-shadow .15s;
}
.pp-bulletin-card:hover { transform: translateY(-3px); box-shadow: var(--pp-shadow-md); }

.pp-bulletin-thumb {
  position: relative; width: 100%; aspect-ratio: 210 / 297; background: var(--pp-bg);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.pp-bulletin-canvas { width: 100%; height: 100%; object-fit: contain; display: block; }

.pp-bulletin-thumb-spin {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
}
.pp-bulletin-thumb-spin::after {
  content: ''; width: 26px; height: 26px; border-radius: 50%;
  border: 3px solid var(--pp-border); border-top-color: var(--pp-blue);
  animation: pp-spin .8s linear infinite;
}
@keyframes pp-spin { to { transform: rotate(360deg); } }

.pp-bulletin-open-veil {
  position: absolute; inset: 0; background: rgba(13,61,114,.72);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  color: #fff; font-family: var(--pp-sans); font-size: 13px; font-weight: 500;
  opacity: 0; transition: opacity .18s;
}
.pp-bulletin-open-icon { font-size: 26px; }
.pp-bulletin-card:hover .pp-bulletin-open-veil { opacity: 1; }

.pp-bulletin-caption {
  padding: .7rem .9rem .8rem; display: flex; flex-direction: column; gap: 4px;
  font-family: var(--pp-sans);
}
.pp-bulletin-caption strong { font-size: .92rem; color: var(--pp-slate); }
.pp-bulletin-download { font-size: 12px; color: var(--pp-blue); text-decoration: none; }
.pp-bulletin-download:hover { text-decoration: underline; }

/* ── Flipbook modal ─────────────────────────────────── */
.pp-flip-modal {
  position: fixed; inset: 0; z-index: 100000; display: none;
  align-items: center; justify-content: center;
}
.pp-flip-modal.is-open { display: flex; }
.pp-flip-modal__backdrop { position: absolute; inset: 0; background: rgba(10,14,20,.86); }
body.pp-flip-lock { overflow: hidden; }

.pp-flip-modal__inner {
  position: relative; z-index: 1; width: min(94vw, 820px); max-height: 92vh;
  display: flex; flex-direction: column; align-items: center;
}

.pp-flip-modal__header {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  color: #f2f4f7; font-family: var(--pp-sans); padding: 0 4px 10px;
}
.pp-flip-modal__title { font-size: .95rem; font-weight: 500; }
.pp-flip-modal__close {
  background: none; border: none; color: #f2f4f7; font-size: 28px; line-height: 1;
  cursor: pointer; padding: 0 4px;
}
.pp-flip-modal__close:hover { color: var(--pp-gold-lt); }

.pp-flip-stage { display: flex; align-items: center; gap: 10px; width: 100%; justify-content: center; }

.pp-flip-book {
  position: relative; width: min(70vh, 78vw, 560px); aspect-ratio: 210 / 297; perspective: 1800px;
}
.pp-flip-page {
  position: absolute; inset: 0; background: #fff; border-radius: 4px; overflow: hidden;
  box-shadow: 0 12px 44px rgba(0,0,0,.4);
}
.pp-flip-page canvas { width: 100%; height: 100%; display: block; }
.pp-flip-page--back { z-index: 1; }
.pp-flip-page--front {
  z-index: 2; transform-origin: left center; backface-visibility: hidden;
  transition: transform .55s cubic-bezier(.45,.05,.55,.95), box-shadow .55s;
}
.pp-flip-page--front.pp-flip-turning-next { transform: rotateY(-160deg); box-shadow: 30px 16px 50px rgba(0,0,0,.55); }
.pp-flip-page--front.pp-flip-turning-prev { transform: rotateY(160deg);  box-shadow: -30px 16px 50px rgba(0,0,0,.55); }
.pp-flip-no-transition { transition: none !important; }

.pp-flip-nav {
  flex: none; width: 42px; height: 42px; border-radius: 50%; border: none;
  background: rgba(255,255,255,.12); color: #fff; font-size: 16px; cursor: pointer;
  transition: background .15s;
}
.pp-flip-nav:hover:not(:disabled) { background: rgba(255,255,255,.25); }
.pp-flip-nav:disabled { opacity: .3; cursor: default; }

.pp-flip-modal__footer {
  margin-top: 12px; color: #cfd6e0; font-family: var(--pp-sans); font-size: 12.5px;
}

@media (max-width: 640px) {
  .pp-flip-stage { gap: 4px; }
  .pp-flip-nav { width: 34px; height: 34px; font-size: 13px; }
}