/* Shu Engine — theme luxe pencere v0.3.0
   Sélecteurs RÉELS vérifiés empiriquement (headless Chrome, DOM inspection v29) :
   .pc-root .pc-stage .pc-slot .pc-img .pc-toolbar-top .pc-toolbar-bottom
   .pc-counter .pc-caption .pc-btn--nav .pc-btn--prev .pc-btn--next .pc-btn--close */

:root {
  --pc-bg: #0a0a0a;
  --pc-fg: #f5f5f5;
  --pc-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Neue Haas Grotesk Display", "Söhne", sans-serif;
  --pc-focus: #f5f5f5;
}

/* ===== FIX BANDES NOIRES — kill toolbar gradients (Tristan : "j'abîme l'image") ===== */
.pc-toolbar-top,
.pc-toolbar-bottom {
  background: none !important;
  background-image: none !important;
}

/* ===== FIX SIZING — image toujours contenue dans le viewport (fini l'overflow crop) ===== */
/* Slot remplit le stage ; l'image se contient dedans (object-fit contain) → jamais coupée */
.pc-slot {
  width: 100% !important;
  height: 100% !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  aspect-ratio: auto !important;
}
.pc-img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  object-fit: contain !important;
}

/* ===== COUNTER caché (verdict luxe : "on ne compte pas les diamants") ===== */
.pc-counter { display: none !important; }

/* ===== CAPTION vide → pas d'espace réservé ===== */
.pc-caption:empty { display: none !important; }

/* ===== FLÈCHES nav — HINT 3s au 1er open puis masquées (affordance client 60yo) =====
   Nav réelle = clavier ← → + swipe. Les flèches sont un indice visuel bref, restent cliquables. */
.pc-btn--nav,
.pc-btn--prev,
.pc-btn--next {
  opacity: 0 !important;
  transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) !important;  /* fade-out hint : DR L1 → 500ms ease-out */
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
}
/* Classe ajoutée par viewer-loader.js au 1er open, retirée après 3s */
.pc-root.pc-hint-arrows .pc-btn--prev,
.pc-root.pc-hint-arrows .pc-btn--next,
.pc-root.pc-hint-arrows .pc-btn--nav { opacity: 0.5 !important; }

/* ===== CLOSE — seul bouton visible, discret, reveal au hover ===== */
.pc-btn--close {
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
  opacity: 0;
  transition: opacity 300ms cubic-bezier(0.32, 0.72, 0, 1) !important;
  cursor: pointer;
}
.pc-root:hover .pc-btn--close { opacity: 0.4; }
.pc-btn--close:hover { opacity: 1 !important; }

/* ===== VIEW TRANSITIONS API — morph miniature → viewer (cinéma) ===== */
@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-duration: 400ms;   /* DR L1 : morph 400ms (Material <400 seuil lourdeur, iOS Sheet 500) */
    animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1);
  }
  ::view-transition-old(pencere-hero),
  ::view-transition-new(pencere-hero) {
    animation-duration: 400ms;   /* morph miniature→viewer : sweet spot luxe validé DR */
    animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1);  /* courbe iOS Sheet confirmée LE choix luxe */
  }
}

/* ===== PhotoSwipe fallback overrides ===== */
.pswp { --pswp-bg: #0a0a0a; }
.pswp__counter,
.pswp__button--arrow--prev,
.pswp__button--arrow--next { display: none !important; }