/* Entrepose Media Viewer V2 — isolated CSS (no pvgal classes/vars) */

.emv2{
  --emv2-view-h: 85vh;
  --emv2-fit: cover;

  --emv2-thumb-w: 160px;
  --emv2-thumb-h: 90px;
  --emv2-gap: 10px;

  --emv2-radius: 0px;
  --emv2-active: #ffffff;

  --emv2-arrow-size: 44px;
  --emv2-arrow-outside: 12px;
  --emv2-arrow-bg: rgba(0,0,0,0.55);
  --emv2-arrow-color: #fff;

  width: 100%;
}

.emv2 * { box-sizing: border-box; }

/* ---------- HARDEN BUTTONS (theme reset) ---------- */
.emv2 button{
  -webkit-appearance: none;
  appearance: none;
  font: inherit;
  line-height: 1;
}

.emv2 .emv2-expand,
.emv2 .emv2-view-nav,
.emv2 .emv2-arrow,
.emv2 .emv2-thumb{
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
}

.emv2 .emv2-expand{ width: 40px !important; height: 40px !important; }
.emv2 .emv2-view-nav,
.emv2 .emv2-arrow{ width: 44px !important; height: 44px !important; }

/* ---------- VIEWER ---------- */
.emv2-view{
  position: relative;
  width: 100%;
  height: var(--emv2-view-h);
  overflow: hidden;
  border-radius: var(--emv2-radius);
  background: #0b0b0b;
}

.emv2-view-image,
.emv2-view-video{
  width: 100% !important;
  height: 100% !important;
  min-width: 100%;
  min-height: 100%;
  max-width: none;
  max-height: none;
  display: block;
  object-fit: var(--emv2-fit) !important;
  object-position: center;
}

.emv2-view-video{
  background: #000;
}

.emv2-view[hidden],
.emv2-view-image[hidden],
.emv2-view-video[hidden]{
  display:none !important;
}

.emv2-expand{
  position:absolute;
  top: 10px;
  right: 10px;
  z-index: 5;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 999px;
  background: rgba(0,0,0,0.55);
  color: #fff;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 18px;
}

.emv2-view-nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  z-index:4;
  width: 44px;
  height: 44px;
  border:0;
  border-radius: 999px;
  background: rgba(0,0,0,0.45);
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 26px;
  opacity: 0;
  transition: opacity .15s ease;
}

.emv2-view:hover .emv2-view-nav{
  opacity: 1;
}

.emv2-view-nav--prev{ left: 10px; }
.emv2-view-nav--next{ right: 10px; }

.emv2-view-nav[disabled]{
  opacity: .25 !important;
  cursor: default;
}

/* ---------- CAROUSEL ---------- */
.emv2-carousel{
  position: relative;
  margin-top: 12px;
  overflow: visible; /* allow arrows to sit outside */
}

.emv2-track{
  display:flex;
  flex-wrap: nowrap;
  gap: var(--emv2-gap);

  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;

  padding: 6px calc(var(--emv2-arrow-size) + var(--emv2-gap));
  border-radius: var(--emv2-radius);
}

/* Hide scrollbar (keep scroll) */
.emv2-track{
  scrollbar-width: none;
}
.emv2-track::-webkit-scrollbar{
  width:0;
  height:0;
}

.emv2-thumb{
  position: relative;
  flex: 0 0 auto;
  width: var(--emv2-thumb-w);
  height: var(--emv2-thumb-h);
  padding: 0;
  border: 0;
  border-radius: var(--emv2-radius);
  background: #1a1a1a;
  cursor: pointer;
  scroll-snap-align: start;
  overflow: hidden;
}

.emv2-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit: cover;
}

.emv2-thumb.is-active{
  outline: 2px solid var(--emv2-active);
  outline-offset: 2px;
}

.emv2-badge{
  position:absolute;
  inset: auto 8px 8px auto;
  z-index:2;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: rgba(0,0,0,0.6);
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 14px;
}

/* ---------- ARROWS (carousel) ---------- */
.emv2-arrow{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  z-index: 10;

  width: var(--emv2-arrow-size);
  height: var(--emv2-arrow-size);
  border:0;
  border-radius: 999px;

  background: var(--emv2-arrow-bg);
  color: var(--emv2-arrow-color);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;

  font-size: 28px;
  line-height: 1;
}

.emv2-arrow--prev{
  left: calc(0px - var(--emv2-arrow-outside));
}
.emv2-arrow--next{
  right: calc(0px - var(--emv2-arrow-outside));
}

.emv2-arrow[disabled]{
  opacity: .25;
  cursor: default;
}

/* ---------- LIGHTBOX ---------- */
.emv2-lb{
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(0,0,0,0.92);
  display:none;
}

.emv2-lb.is-open{
  display:flex;
  align-items:center;
  justify-content:center;
}

.emv2-lb-inner{
  position: relative;
  width: min(96vw, 1600px);
  height: min(94vh, 900px);
  display:flex;
  align-items:center;
  justify-content:center;
}

.emv2-lb img,
.emv2-lb video{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  display:block;
}

.emv2-lb video{
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
}

.emv2-lb-close{
  position:absolute;
  top: -52px;
  right: 0;
  width: 44px;
  height: 44px;
  border:0;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color:#fff;
  cursor:pointer;
  font-size: 22px;
}

.emv2-lb-nav{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  border:0;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  color:#fff;
  cursor:pointer;
  font-size: 30px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.emv2-lb-nav--prev{ left: -64px; }
.emv2-lb-nav--next{ right: -64px; }

@media (max-width: 768px){
  .emv2-lb-nav--prev{ left: 8px; }
  .emv2-lb-nav--next{ right: 8px; }
  .emv2-lb-close{ top: 8px; right: 8px; }
  .emv2-view-nav{ display:none; } /* keep view clean on mobile */
}