.modal-container{display:flex;align-items:center;justify-content:center}.modal-content{position:relative;background:transparent;border-radius:8px;overflow:hidden}.modal-close-btn{position:absolute;top:16px;right:16px;z-index:50;padding:8px;border-radius:9999px;background-color:rgba(0,0,0,.5);transition:background-color .2s}.modal-close-btn:hover{background-color:rgba(0,0,0,.7)}.modal-nav-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:50;padding:8px;border-radius:9999px;background-color:rgba(0,0,0,.5);transition:background-color .2s}.modal-nav-btn:hover{background-color:rgba(0,0,0,.7)}.modal-nav-btn-left{left:16px}.modal-nav-btn-right{right:16px}.image-wrapper,.modal-media-container,.video-wrapper{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.image-wrapper{position:relative}.modal-image{max-width:65%!important;max-height:65%;object-fit:contain;border-radius:8px;margin-top:48px}.modal-thumbnails{position:absolute;top:8px;left:50%;transform:translateX(-50%);display:flex;gap:8px;overflow-x:auto;max-width:90%;padding:8px;background-color:rgba(0,0,0,.5);border-radius:8px;-ms-overflow-style:none;scrollbar-width:none}.modal-thumbnails::-webkit-scrollbar{display:none}.thumbnail-btn{position:relative;width:64px;height:64px;border-radius:4px;overflow:hidden;transition:all .2s}.thumbnail-btn.active{border:2px solid #fff}.thumbnail-image{object-fit:cover;width:100%;height:100%}.video-thumbnail{width:100%;height:100%;background-color:#1a1a1a;display:flex;align-items:center;justify-content:center}.react-player{max-width:70%;max-height:70%;margin-top:65px;width:70%;height:63%}@media (max-width:768px){.modal-content{width:100%!important;height:100vh!important;padding:0}.modal-image,.react-player{max-width:100%!important;max-height:70vh;margin-top:80px}.react-player{width:95%;height:63%}.media-details{width:90%;padding:1rem}.thumbnail-btn{width:48px;height:48px}.modal-nav-btn{padding:12px}.modal-nav-btn-left{left:8px}.modal-nav-btn-right{right:8px}}@media (max-width:480px){.modal-image,.react-player{margin-top:60px}.react-player{width:95%;height:63%}.media-details{width:95%;padding:.75rem}.media-title{font-size:1.25rem}.media-caption{font-size:.875rem}}.react-player{position:relative}.react-player video{border-radius:8px}.thumbnail-container{-ms-overflow-style:none;scrollbar-width:none}.thumbnail-container::-webkit-scrollbar{display:none}.nav-button{opacity:.7;transition:opacity .2s ease}.nav-button:hover{opacity:1}.media-details{position:relative;width:70%;margin:3px auto;text-align:left;color:#fff;padding-top:1rem;border-radius:.5rem}.media-title{font-size:1.5rem;font-weight:600;margin-bottom:.5rem;color:var(--white)}.media-caption{font-size:1rem;line-height:1.5;color:var(--white)}