/* TBP Gallery – FINAL (Enterprise Stable)
   - Mixed Image + Video
   - Desktop: vertical thumbs (left)
   - Mobile: horizontal thumbs (bottom)
   - Lightbox: true fullscreen, Fit/Fill toggle
*/

:root{
  --tbp-accent:#ff3c00;
  --tbp-border:#e8eaed;
  --tbp-bg:#fff;
  --tbp-shadow:0 10px 30px rgba(0,0,0,.08);
}

.tbp-gallery{
  display:flex;
  gap:14px;
  width:100%;
  align-items:stretch;
}

.tbp-g-main{ flex: 1 1 auto; min-width: 0; }
.tbp-g-thumbs{ flex: 0 0 auto; }

/* Desktop: thumbs left */
@media (min-width: 992px){
  .tbp-gallery{ flex-direction:row; }
  .tbp-g-thumbs{ width: 72px; height: 420px; }
  .tbp-g-thumbs .swiper{ height: 100%; }
}

/* Mobile: thumbs bottom */
@media (max-width: 991px){
  .tbp-gallery{ flex-direction:column; }
  .tbp-g-thumbs{ width:100%; height: 84px; order:2; }
}

/* Main container */
.tbp-g-main .tbp-swiper{
  background: var(--tbp-bg);
  border:1px solid var(--tbp-border);
  border-radius: 14px;
  box-shadow: var(--tbp-shadow);
  overflow:hidden;
}

/* Slide */
.tbp-slide{
  height: 480px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  background:#fff;
}

@media (max-width: 991px){
  .tbp-slide{ height: 340px; }
}

.tbp-imgwrap, .tbp-videowrap{
  width:100%;
  height:100%;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* Image */
.tbp-imgwrap{ cursor:zoom-in; }
.tbp-imgwrap img{
  width:100%;
  height:100%;
  object-fit: contain;
  transform-origin: center center;
  transition: transform .18s ease, transform-origin .05s linear;
  will-change: transform;
}

/* Desktop hover zoom only (gallery, not lightbox) */
@media (hover:hover) and (pointer:fine){
  .tbp-imgwrap.is-zoomed img{ transform: scale(2); }
}

/* Video */
.tbp-videowrap{ background:#000; }
.tbp-videowrap video{
  width:100%;
  height:100%;
  object-fit: contain;
  background:#000;
}

/* Badge overlay */
.tbp-media-badge{
  position:absolute;
  top:12px;
  left:12px;
  padding:6px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,.55);
  color:#fff;
  font-size:12px;
  display:flex;
  gap:6px;
  align-items:center;
  user-select:none;
  z-index:2;
}
.tbp-media-badge svg{ width:14px; height:14px; }

/* Nav buttons */
.tbp-g-main .swiper-button-next,
.tbp-g-main .swiper-button-prev{
  color:#111;
  width:44px;
  height:44px;
  border-radius: 999px;
  background: rgba(255,255,255,.85);
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}
.tbp-g-main .swiper-button-next:after,
.tbp-g-main .swiper-button-prev:after{
  font-size:16px;
  font-weight:700;
}
.tbp-g-main .swiper-pagination-bullet{ background:#bbb; opacity:1; }
.tbp-g-main .swiper-pagination-bullet-active{ background: var(--tbp-accent); }

/* Thumbs container */
.tbp-g-thumbs .tbp-thumbs{
  border:1px solid var(--tbp-border);
  border-radius: 14px;
  background:#fff;
  box-shadow: var(--tbp-shadow);
  overflow:hidden;
}

.tbp-thumb-slide{
  height: 62px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6px;
  position:relative;
}

@media (max-width: 991px){
  .tbp-thumb-slide{ height: 74px; }
}

.tbp-thumb{
  width:100%;
  height:100%;
  object-fit: cover;
  border-radius: 8px;
  border:2px solid transparent;
  background:#f6f7f8;
}
.swiper-slide-thumb-active .tbp-thumb{
  border-color: var(--tbp-accent);
}

.tbp-thumb-play{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}
.tbp-thumb-play span{
  width:30px; height:30px;
  border-radius:999px;
  background: rgba(0,0,0,.55);
  display:flex;
  align-items:center;
  justify-content:center;
}
.tbp-thumb-play svg{ width:14px; height:14px; fill:#fff; }

/* Lightbox */
.tbp-lightbox{
  position:fixed;
  inset:0;
  background: rgba(0,0,0,.92);
  z-index: 99999;
  display:none;
}
.tbp-lightbox.is-open{ display:block; }
body.tbp-noscroll{ overflow:hidden !important; }

/* True edge-to-edge */
.tbp-lightbox-inner{
  position:absolute;
  inset:0;
  padding:0;
  display:flex;
  flex-direction:column;
}

.tbp-lb-top{
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:56px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#fff;
  z-index:5;
  background: linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,0));
  pointer-events:none;
}

.tbp-lb-top > *{ pointer-events:auto; }

.tbp-lb-title{
  font-size:13px;
  opacity:.95;
  max-width:55vw;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.tbp-lb-actions{ display:flex; gap:8px; align-items:center; }

.tbp-lb-btn{
  border:1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.10);
  color:#fff;
  border-radius: 12px;
  padding:8px 10px;
  cursor:pointer;
  font-size:12px;
}
.tbp-lb-btn:hover{ background: rgba(255,255,255,.16); }

.tbp-lb-counter{
  font-size:12px;
  opacity:.9;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(0,0,0,.35);
}

.tbp-lb-main{
  position:absolute;
  inset:0;
  background:#000;
}

/* Make swiper fill */
.tbp-lb-main .tbp-lb-swiper,
.tbp-lb-main .swiper-wrapper,
.tbp-lb-main .swiper-slide{
  height:100%;
}

.tbp-lb-main .tbp-slide{ height:100%; background:#000; }

/* Lightbox media defaults (FIT) */
.tbp-lightbox .tbp-imgwrap{ cursor: default; }
.tbp-lightbox .tbp-imgwrap img{ object-fit: contain; transform:none !important; }
.tbp-lightbox .tbp-videowrap video{ object-fit: contain; }

/* Lightbox FILL mode */
.tbp-lightbox.is-fill .tbp-imgwrap img{ object-fit: cover; }
.tbp-lightbox.is-fill .tbp-videowrap video{ object-fit: cover; }

/* Lightbox navigation style */
.tbp-lightbox .swiper-button-next,
.tbp-lightbox .swiper-button-prev{
  color:#fff;
  width:44px;
  height:44px;
  border-radius:999px;
  background: rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(6px);
}
.tbp-lightbox .swiper-button-next:after,
.tbp-lightbox .swiper-button-prev:after{
  font-size:16px;
  font-weight:700;
}
.tbp-lightbox .swiper-pagination-bullet{ background:#bbb; opacity:1; }
.tbp-lightbox .swiper-pagination-bullet-active{ background: var(--tbp-accent); }

/* ===== TBP Gallery FINAL v3 overrides (fix thumb oversizing due to theme css) ===== */

@media (min-width: 992px){
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs{
    width: 70px !important;
    height: 480px !important;
  }
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .tbp-thumbs,
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .swiper,
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .swiper-wrapper{
    height: 100% !important;
  }
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .swiper-slide.tbp-thumb-slide{
    height: 70px !important;
  }
}

@media (max-width: 991px){
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs{
    height: 86px !important;
    width: 100% !important;
  }
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .tbp-thumbs,
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .swiper,
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .swiper-wrapper{
    height: 100% !important;
  }
  .tbp-gallery[data-tbp-gallery='final'] .tbp-g-thumbs .swiper-slide.tbp-thumb-slide{
    width: 92px !important;
    height: 74px !important;
  }
}

.tbp-gallery[data-tbp-gallery='final'] .tbp-thumb-slide{
  padding: 6px !important;
}

.tbp-gallery[data-tbp-gallery='final'] .tbp-thumb{
  border-radius: 8px !important;
}

.tbp-gallery[data-tbp-gallery='final'] .tbp-slide{
  height: 480px !important;
}
@media (max-width: 991px){
  .tbp-gallery[data-tbp-gallery='final'] .tbp-slide{
    height: 340px !important;
  }
}
