body.rvg-lightbox-open {
overflow: hidden;
}
.rvg-lightbox-overlay {
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0, 0, 0, 0.85);
z-index: 999999;
display: flex;
align-items: center;
justify-content: center;
padding: 30px;
box-sizing: border-box;
}
.rvg-lightbox-inner {
position: relative;
width: 100%;
max-width: 960px;
}
.rvg-lightbox-frame-wrap {
width: 100%;
} .rvg-lightbox-frame-ratio {
position: relative;
width: 100%;
padding-top: 56.25%;
background: #000;
}
.rvg-lightbox-frame-ratio iframe,
.rvg-lightbox-frame-ratio video {
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
border: 0;
object-fit: contain;
background: #000;
}
.rvg-lightbox-title {
color: #fff;
text-align: center;
font-size: 15px;
padding: 12px 14px;
display: none;
max-height: 22vh;
overflow-y: auto;
line-height: 1.5;
box-sizing: border-box;
background: rgba(0, 0, 0, 0.65);
border-radius: 0 0 6px 6px;
margin-top: 0;
}
.rvg-lightbox-title::-webkit-scrollbar { width: 6px; }
.rvg-lightbox-title::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.3); border-radius: 3px; }
.rvg-lightbox-close,
.rvg-lightbox-prev,
.rvg-lightbox-next {
position: absolute;
background: rgba(0, 0, 0, 0.55);
color: #fff;
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.15s ease;
}
.rvg-lightbox-close:hover,
.rvg-lightbox-prev:hover,
.rvg-lightbox-next:hover {
background: rgba(0, 0, 0, 0.85);
}
.rvg-lightbox-close {
top: -46px;
right: 0;
width: 36px;
height: 36px;
border-radius: 50%;
font-size: 24px;
line-height: 1;
}
.rvg-lightbox-prev,
.rvg-lightbox-next {
top: 50%;
transform: translateY(-50%);
width: 44px;
height: 44px;
border-radius: 50%;
font-size: 26px;
}
.rvg-lightbox-prev { left: -60px; }
.rvg-lightbox-next { right: -60px; }
@media (max-width: 780px) {
.rvg-lightbox-overlay { padding: 16px; }
.rvg-lightbox-close { top: -42px; right: 0; }
.rvg-lightbox-prev { left: 6px; }
.rvg-lightbox-next { right: 6px; }
}