
/* -------- Base container for shortcode (inline player) -------- */
.gpfa-container { display:flex; gap:12px; align-items:stretch; direction:rtl; }
.gpfa-container.thumbs-left { flex-direction: row; }
.gpfa-container.thumbs-bottom { flex-direction: column; }
.gpfa-main { position:relative; flex:1; background:#000; display:flex; align-items:center; justify-content:center; overflow:hidden; border-radius:12px; min-height:300px; }
.gpfa-main img { width:100%; height:100%; object-fit:contain; background:#000; }
.gpfa-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(0,0,0,0.4); border:none; color:#fff; font-size:28px; width:44px; height:44px; border-radius:999px; cursor:pointer; }
.gpfa-nav.prev{ left:10px; } .gpfa-nav.next{ right:10px; }
.gpfa-nav:hover{ background:rgba(255,255,255,0.15); }
.gpfa-fullscreen { position:absolute; bottom:10px; left:10px; background:rgba(0,0,0,0.4); color:#fff; border:none; border-radius:10px; padding:6px 10px; cursor:pointer; }
.gpfa-caption{ position:absolute; bottom:10px; right:10px; left:60px; color:#fff; background:linear-gradient(180deg, transparent, rgba(0,0,0,0.6)); padding:10px; border-radius:8px; font-size:14px; }
.gpfa-thumbs { display:flex; gap:8px; overflow:auto; }
.gpfa-container.thumbs-left .gpfa-thumbs { width:120px; flex-direction: column; }
.gpfa-container.thumbs-bottom .gpfa-thumbs { width:100%; flex-direction: row; }
.gpfa-thumbs img { width:100%; height:80px; object-fit:cover; border-radius:8px; opacity:.6; cursor:pointer; border:2px solid transparent; transition:opacity .2s, border-color .2s; }
.gpfa-thumbs img.active, .gpfa-thumbs img:hover{ opacity:1; border-color:#999; }
.gpfa-controls { display:flex; gap:8px; align-items:center; justify-content:flex-start; margin-top:8px; }

/* -------- Overlay Lightbox Player -------- */
.gpfa-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.92); display:flex; flex-direction:column; align-items:center; justify-content:center; z-index:999999; padding:12px; }
.gpfa-ov-topbar{ display:flex; align-items:center; width:100%; max-width:1100px; margin-bottom:8px; }
.gpfa-ov-topbar .spacer{ flex:1; }
.gpfa-ov-topbar button{ background:rgba(255,255,255,.14); border:none; color:#fff; border-radius:10px; padding:8px 12px; margin-inline-start:8px; cursor:pointer; }
.gpfa-ov-topbar .close{ width:40px; height:40px; border-radius:50%; font-size:22px; padding:0; margin-inline-start:0; }
.gpfa-ov-topbar button:hover{ background:rgba(255,255,255,.22); }

.gpfa-ov-main{ position:relative; width:100%; max-width:1100px; height:70dvh; background:#000; display:flex; align-items:center; justify-content:center; border-radius:12px; overflow:hidden; }
.gpfa-ov-main img{ max-width:100%; max-height:100%; object-fit:contain; }
.gpfa-ov-main .prev, .gpfa-ov-main .next{ position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.12); border:none; color:#fff; font-size:34px; width:52px; height:52px; border-radius:50%; cursor:pointer; }
.gpfa-ov-main .prev{ left:10px; } .gpfa-ov-main .next{ right:10px; }
.gpfa-ov-caption{ position:absolute; bottom:0; left:0; right:0; color:#fff; background:linear-gradient(180deg, transparent, rgba(0,0,0,.7)); padding:12px 16px; font-size:14px; }
.gpfa-ov-thumbs{ width:100%; max-width:1100px; display:flex; gap:8px; margin-top:10px; overflow:auto; padding-bottom:6px; }
.gpfa-ov-thumbs img{ height:72px; object-fit:cover; border-radius:8px; opacity:.6; cursor:pointer; border:2px solid transparent; transition:opacity .2s, border-color .2s; }
.gpfa-ov-thumbs img.active, .gpfa-ov-thumbs img:hover{ opacity:1; border-color:#ccc; }
.gpfa-overlay, .gpfa-overlay *{ user-select:none; -webkit-tap-highlight-color: transparent; }

@media (max-width: 768px){
  .gpfa-ov-main{ height:65dvh; }
  .gpfa-ov-thumbs img{ height:58px; }
  .gpfa-container{ flex-direction:column; }
  .gpfa-container.thumbs-left .gpfa-thumbs{ width:100%; flex-direction:row; }
  .gpfa-thumbs img{ height:60px; }
}

/* سه‌ستونه‌ کردن گالری در موبایل (اختیاری) */
@media (max-width:700px){
  body.gpfa-on .wp-block-gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  body.gpfa-on .wp-block-gallery figure{ margin:0; }
  body.gpfa-on .gallery .gallery-item{ width:33.333%!important; }
}
