.video-slider-section{padding:60px 0;background:#fff}.video-slider-section .container{max-width:1400px;margin:0 auto;padding:0 20px}@media (max-width: 768px){.video-slider-section .container{padding:0 12px}}.video-slider-title{text-align:center;font-size:2rem;font-weight:700;margin-bottom:40px;color:#000}.video-slider-wrapper{position:relative;display:flex;align-items:center;gap:20px}@media (max-width: 768px){.video-slider-wrapper{gap:8px}}.video-slider-container{flex:1;overflow:hidden}@media (max-width: 768px){.video-slider-container{overflow:visible;position:relative}.video-slider-container:after{content:"";position:absolute;top:0;right:-10px;width:60px;height:100%;background:linear-gradient(to right,transparent,rgba(255,255,255,.7));pointer-events:none;z-index:1}}.video-slider-track{display:flex;gap:20px;transition:transform .4s cubic-bezier(.4,0,.2,1)}@media (max-width: 768px){.video-slider-track{gap:12px}.video-slide:not(:first-child){opacity:.5;transform:scale(.95);transition:opacity .3s ease,transform .3s ease}.video-slide:first-child{opacity:1;transform:scale(1)}}.video-slide{flex:0 0 calc(33.333% - 14px);min-width:calc(33.333% - 14px)}@media (max-width: 1024px){.video-slide{flex:0 0 calc(50% - 10px);min-width:calc(50% - 10px)}}@media (max-width: 768px){.video-slide{flex:0 0 calc(90% - 10px);min-width:calc(90% - 10px)}.video-slider-container{overflow:visible}}.video-container{position:relative;width:100%;padding-bottom:133.33%;background:#000;border-radius:8px;overflow:hidden}.video-wrapper{position:absolute;top:0;left:0;width:100%;height:100%}.video-thumbnail{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;z-index:1}.native-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border:none;cursor:pointer;background:#000;z-index:2}.native-video:not([autoplay]){display:none}.native-video.playing{display:block}.video-thumbnail.hidden{display:none}.no-video-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#999;font-size:14px;padding:20px;background:#ffffffe6;border-radius:8px;z-index:3}.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:transparent;border:none;cursor:pointer;z-index:2;transition:transform .2s ease,opacity .2s ease;overflow:hidden;border-radius:50%}.play-button:hover{transform:translate(-50%,-50%) scale(1.1)}.play-button:active{transform:translate(-50%,-50%) scale(.95)}.play-button .ripple{position:absolute;border-radius:50%;background:#fff9;transform:scale(0);animation:ripple-animation .6s ease-out;pointer-events:none}@keyframes ripple-animation{to{transform:scale(2);opacity:0}}.video-control-button{position:absolute;bottom:60px;left:20px;width:48px;height:48px;background:#000000b3;border:none;border-radius:50%;cursor:pointer;display:none;align-items:center;justify-content:center;z-index:3;transition:background .2s ease}.video-control-button:hover{background:#000000e6}.sound-button{position:absolute;bottom:60px;right:20px;width:48px;height:48px;background:#ffffffe6;border:none;border-radius:50%;cursor:pointer;display:none;align-items:center;justify-content:center;z-index:3;transition:background .2s ease}.sound-button:hover{background:#fff}.sound-button svg{width:24px;height:24px;stroke-width:2}.video-timeline{position:absolute;bottom:0;left:0;width:100%;height:4px;background:#ffffff4d;z-index:3}.timeline-progress{height:100%;width:0%;background-color:var(--timeline-color);transition:width .1s linear}.video-description{margin-top:16px;padding:16px;background:var(--description-bg);border-radius:8px;font-size:14px;line-height:1.6;color:#333}.video-description p{margin:0}.slider-nav{flex-shrink:0;width:48px;height:48px;background:#fff;border:2px solid #e5e5e5;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;color:#333;z-index:2;box-shadow:0 2px 8px #00000026}.slider-nav:hover:not(:disabled){background:#f5f5f5;border-color:#333;transform:scale(1.05)}.slider-nav:disabled{opacity:.3;cursor:not-allowed}.slider-nav svg{width:24px;height:24px}@media (max-width: 768px){.slider-nav{width:40px;height:40px;background:#fffffff2;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 4px 12px #0003}.slider-nav svg{width:20px;height:20px}.slider-nav-prev{margin-right:8px}.slider-nav-next{margin-left:8px}}.slider-dots{display:flex;justify-content:center;gap:12px;margin-top:32px}.slider-dot{width:10px;height:10px;background:#d1d5db;border:none;border-radius:50%;cursor:pointer;padding:0;transition:all .2s ease}.slider-dot:hover{background:#9ca3af;transform:scale(1.2)}.slider-dot.active{background:#374151;transform:scale(1.3)}@media (max-width: 768px){.video-slider-section{padding:40px 0}.video-slider-title{font-size:1.5rem;margin-bottom:24px}.video-control-button,.sound-button{width:40px;height:40px;bottom:50px}.video-control-button svg,.sound-button svg{width:20px;height:20px}}@media (hover: none) and (pointer: coarse){.play-button:hover{transform:translate(-50%,-50%)}.slider-nav:hover:not(:disabled){transform:none}}.play-button:focus,.video-control-button:focus,.sound-button:focus,.slider-nav:focus,.slider-dot:focus{outline:2px solid #3b82f6;outline-offset:2px}.native-video[src=""]{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/video-slider.css.map */