/* =========================================================
   SRI – Front CSS v1.9
   ========================================================= */
:root {
  --sri-cols: 3; --sri-gap: 8px; --sri-radius: 8px;
  --sri-accent: #e1306c; --sri-transition: .25s ease;
  --sri-viewer-max-w: 420px;
}
.sri-empty { color:#888; font-style:italic; text-align:center; padding:2rem 0; }

/* ── Card ────────────────────────────────────────────────── */
.sri-card { position:relative; cursor:pointer; border-radius:var(--sri-radius); overflow:hidden; background:#111; transition:transform var(--sri-transition),box-shadow var(--sri-transition); }
.sri-card:hover,.sri-card:focus-visible { transform:translateY(-2px); box-shadow:0 6px 24px rgba(0,0,0,.25); outline:none; }
.sri-card__thumb { position:relative; overflow:hidden; background:#1a1a1a; }
.sri-card--square   .sri-card__thumb { aspect-ratio:1/1; }
.sri-card--portrait .sri-card__thumb { aspect-ratio:4/3; }
.sri-card--reel     .sri-card__thumb { aspect-ratio:9/16; }
.sri-card--auto     .sri-card__thumb { aspect-ratio:unset; }
.sri-card__thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.sri-card:hover .sri-card__thumb img { transform:scale(1.04); }
.sri-card__thumb--placeholder { min-height:120px; display:flex; align-items:center; justify-content:center; font-size:2.5rem; color:#444; }
.sri-card__play-icon { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:2rem; color:rgba(255,255,255,.85); opacity:0; transition:opacity var(--sri-transition); background:rgba(0,0,0,.15); }
.sri-card:hover .sri-card__play-icon { opacity:1; }
.sri-card__type-badge { position:absolute; top:8px; right:8px; background:rgba(0,0,0,.5); color:#fff; font-size:.9rem; padding:2px 6px; border-radius:4px; }
.sri-card__caption { margin:6px 8px 2px; font-size:.8rem; color:#333; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sri-card__date { display:block; margin:0 8px 8px; font-size:.72rem; color:#888; }

/* ── Grille ─────────────────────────────────────────────── */
.sri-grid { display:grid; grid-template-columns:repeat(var(--sri-cols),1fr); gap:var(--sri-gap); }
@media(max-width:768px){.sri-grid{--sri-cols:2 !important;}}
@media(max-width:480px){.sri-grid{--sri-cols:1 !important;}}

/* ── Bandeau ─────────────────────────────────────────────── */
.sri-bandeau { position:relative; overflow:hidden; }
.sri-bandeau__track { display:flex; gap:var(--sri-gap); overflow-x:auto; scroll-behavior:smooth; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding:4px 2px; }
.sri-bandeau__track::-webkit-scrollbar { display:none; }
.sri-bandeau__track .sri-card { flex:0 0 160px; }
@media(max-width:600px){.sri-bandeau__track .sri-card{flex:0 0 130px;}}
.sri-bandeau__arrow { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.92); border:none; width:34px; height:34px; border-radius:50%; font-size:1.3rem; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.2); z-index:2; display:flex; align-items:center; justify-content:center; }
.sri-bandeau__arrow--prev{left:4px;} .sri-bandeau__arrow--next{right:4px;}
@media(max-width:480px){.sri-bandeau__arrow{display:none;}}

/* ── Scroll / Single ─────────────────────────────────────── */
.sri-scroll-feed { display:flex; flex-direction:column; gap:16px; max-width:var(--sri-viewer-max-w); margin:0 auto; }
.sri-single { display:flex; flex-wrap:wrap; gap:var(--sri-gap); }
.sri-single .sri-card { flex:0 0 calc(33.333% - var(--sri-gap)); min-width:180px; }

/* ── Lien Instagram ──────────────────────────────────────── */
.sri-ig-link-wrap { text-align:center; margin-top:16px; }
.sri-ig-link {
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 20px; border-radius:24px;
  background:linear-gradient(135deg,#833ab4,#fd1d1d,#fcb045);
  color:#fff; text-decoration:none; font-size:.9rem; font-weight:600;
  transition:opacity .2s; box-shadow:0 4px 16px rgba(225,48,108,.3);
}
.sri-ig-link:hover { opacity:.88; color:#fff; }

/* ── Widget Vidéo Auto ───────────────────────────────────── */
.sri-video-auto { position:relative; width:100%; }
.sri-va__stage { position:relative; width:100%; overflow:hidden; background:#000; border-radius:12px; aspect-ratio:9/16; }
.sri-va__slide { position:absolute; inset:0; opacity:0; pointer-events:none; }
.sri-va__slide.is-active { opacity:1; pointer-events:auto; }
.sri-va__slide img { width:100%; height:100%; object-fit:cover; display:block; }
.sri-va__play-btn { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; cursor:pointer; background:rgba(0,0,0,.15); transition:background .2s; }
.sri-va__play-btn:hover { background:rgba(0,0,0,.3); }
.sri-va__play-icon { width:64px; height:64px; background:rgba(0,0,0,.55); border-radius:50%; display:flex; align-items:center; justify-content:center; }
.sri-va__caption-bar { position:absolute; bottom:48px; left:0; right:0; padding:32px 14px 8px; background:linear-gradient(transparent,rgba(0,0,0,.65)); pointer-events:none; }
.sri-va__caption-bar p { color:#fff; font-size:.82rem; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sri-va__counter { position:absolute; top:10px; right:12px; color:rgba(255,255,255,.85); font-size:.75rem; background:rgba(0,0,0,.4); padding:2px 8px; border-radius:10px; z-index:3; }
.sri-va__dots { position:absolute; bottom:10px; left:0; right:0; display:flex; justify-content:center; gap:5px; z-index:3; }
.sri-va__dot { height:6px; border-radius:3px; border:none; cursor:pointer; padding:0; background:rgba(255,255,255,.4); transition:all .2s; width:6px; border-radius:50%; }
.sri-va__dot.is-active { width:18px; border-radius:3px; background:#fff; }
.sri-va__ig-link { position:absolute; inset:0; background:rgba(0,0,0,.82); display:none; flex-direction:column; align-items:center; justify-content:center; color:#fff; text-decoration:none; z-index:5; }
.sri-va__ig-link.is-visible { display:flex; }
.sri-va__ig-link span { font-size:1rem; font-weight:700; margin:10px 0 4px; }
.sri-va__ig-link small { font-size:.8rem; opacity:.75; }

/* ══════════════════════════════════════════════════════════
   VIEWER PLEIN ÉCRAN
   ══════════════════════════════════════════════════════════ */
.sri-viewer { position:fixed; inset:0; z-index:999999; display:flex; align-items:center; justify-content:center; }
.sri-viewer[hidden] { display:none; }
.sri-viewer__overlay { position:absolute; inset:0; background:rgba(0,0,0,.88); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.sri-viewer__content { position:relative; z-index:1; display:flex; align-items:center; gap:16px; width:100%; max-width:calc(var(--sri-viewer-max-w) + 120px); padding:0 8px; box-sizing:border-box; }
.sri-viewer__stage { position:relative; flex:1; max-width:var(--sri-viewer-max-w); margin:0 auto; background:#000; border-radius:12px; overflow:hidden; box-shadow:0 24px 80px rgba(0,0,0,.8); }
.sri-viewer__stage.is-video { aspect-ratio:9/16; max-height:90dvh; }
.sri-viewer__stage.is-photo { aspect-ratio:1/1; max-width:min(90vw,560px); }
@media(max-width:600px){
  .sri-viewer__content { padding:0; gap:0; max-width:100%; }
  .sri-viewer__stage { border-radius:0; max-width:100vw !important; max-height:100dvh !important; }
  .sri-viewer__stage.is-video { aspect-ratio:9/16; }
  .sri-viewer__stage.is-photo { aspect-ratio:1/1; }
  .sri-viewer__nav { display:none; }
}
.sri-viewer__video { width:100%; height:100%; object-fit:cover; display:block; }
.sri-viewer__image { width:100%; height:100%; object-fit:contain; display:none; background:#000; }
.sri-viewer__video.is-hidden { display:none; }
.sri-viewer__image.is-visible { display:block; }
.sri-viewer__loader { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:opacity .2s; }
.sri-viewer__loader.is-loading { opacity:1; }
.sri-spinner { width:44px; height:44px; border:3px solid rgba(255,255,255,.2); border-top-color:#e1306c; border-radius:50%; animation:sri-spin .8s linear infinite; }
@keyframes sri-spin{to{transform:rotate(360deg);}}
.sri-viewer__info { position:absolute; bottom:56px; left:0; right:0; padding:32px 16px 8px; background:linear-gradient(transparent,rgba(0,0,0,.72)); }
.sri-viewer__caption { color:#fff; font-size:.88rem; line-height:1.45; margin:0 0 6px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.sri-viewer__permalink { color:rgba(255,255,255,.65); font-size:.77rem; text-decoration:none; }
.sri-viewer__permalink:hover { color:#fff; }
.sri-viewer__controls { position:absolute; bottom:10px; left:0; right:0; display:flex; align-items:center; justify-content:space-between; padding:0 14px; }
.sri-viewer__sound { background:rgba(255,255,255,.15); border:none; color:#fff; font-size:1.1rem; cursor:pointer; padding:6px 8px; border-radius:20px; }
.sri-viewer__sound:hover { background:rgba(255,255,255,.25); }
.sri-viewer__counter { color:rgba(255,255,255,.65); font-size:.78rem; }
.sri-viewer__close { position:absolute; top:12px; right:12px; background:rgba(0,0,0,.55); border:none; color:#fff; font-size:1.1rem; width:34px; height:34px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:10; }
.sri-viewer__close:hover { background:rgba(0,0,0,.85); }
.sri-viewer__nav { background:rgba(255,255,255,.12); border:none; color:#fff; font-size:2rem; width:44px; height:44px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .2s; }
.sri-viewer__nav:hover { background:rgba(255,255,255,.28); }
.sri-viewer__nav:disabled { opacity:.25; cursor:default; }
@keyframes sri-viewer-in{from{opacity:0;transform:scale(.95);}to{opacity:1;transform:scale(1);}}
.sri-viewer:not([hidden]) .sri-viewer__stage { animation:sri-viewer-in .2s ease; }