/* JeuxDeRue Deferred CSS - Loaded async after FCP */
/* Non-critical styles: hover effects, animations, mobile responsive, forms */

/* Hover Effects */
.video-card:hover{border-color:rgba(255,45,45,.4);transform:translateY(-2px);box-shadow:0 20px 25px -5px rgba(255,45,45,.1)}
.btn-primary:hover{background-color:#ff6b35;color:#fff}
.btn-cyan:hover{background-color:#fff;box-shadow:0 0 20px rgba(255,45,45,.3)}
.btn-gold:hover{filter:brightness(1.1);transform:translateY(-1px)}
.btn-buy:hover{filter:brightness(1.1);transform:translateY(-1px)}
.badge-category:hover{background-color:rgba(255,45,45,.1);color:#ff2d2d}
.tag-hover{transition:all .2s}
.tag-hover:hover{transform:scale(1.05);background-color:rgba(255,45,45,.1);color:#ff2d2d}

/* Secondary buttons */
.btn-secondary{background-color:#0d0f14;border:1px solid rgba(255,45,45,.3);color:#fff;padding:.5rem 1rem;border-radius:.5rem;transition:all .2s}
.btn-secondary:hover{background-color:#151822;border-color:rgba(255,45,45,.5)}
.btn-buy{background:linear-gradient(to right,#22c55e,#059669);color:#fff;font-weight:700;padding:.5rem 1rem;border-radius:.5rem;transition:all .2s;box-shadow:0 4px 6px -1px rgba(34,197,94,.3)}

/* More badges */
.badge-exclusive{background:linear-gradient(to right,#eab308,#f97316);color:#000;font-size:.75rem;font-weight:700;padding:.25rem .5rem;border-radius:9999px}
.badge-ppv{background:linear-gradient(to right,#22c55e,#059669);color:#fff;font-size:.75rem;font-weight:700;padding:.25rem .5rem;border-radius:9999px}
.text-gradient-gold{background:linear-gradient(135deg,#fbbf24,#f59e0b,#d97706);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* Glows */
.glow-cyan{box-shadow:0 0 20px rgba(255,45,45,.3)}
.glow-blue{box-shadow:0 0 20px rgba(14,165,233,.3)}

/* Ad label */
.ad-label{position:absolute;top:.25rem;right:.25rem;font-size:10px;color:rgba(161,161,170,.6);text-transform:uppercase}

/* Animations */
@keyframes pulse-glow{0%,100%{box-shadow:0 0 5px rgba(34,197,94,.5)}50%{box-shadow:0 0 20px rgba(34,197,94,.8)}}
.btn-pulse{animation:pulse-glow 2s infinite}
@keyframes scanPreview{0%{width:0}50%{width:100%}100%{width:0}}
@keyframes scanLine{0%{background-position:0 0}50%{background-position:0 100%}100%{background-position:0 0}}
@keyframes shrink-width{from{width:100%}to{width:0}}
.animate-shrink-width{animation:shrink-width 6s linear forwards}
.animate-shrink-width-slow{animation:shrink-width 8s linear forwards}

/* Forms */
.form-input{width:100%;padding:.75rem 1rem;background-color:#fff;border:1px solid #d1d5db;border-radius:.5rem;color:#111827;font-size:1rem;transition:all .2s}
.form-input:focus{outline:none;border-color:#ff2d2d;box-shadow:0 0 0 3px rgba(255,45,45,.2)}
.form-input::placeholder{color:#9ca3af}
.form-input.border-red-500{border-color:#ef4444}
.form-checkbox{width:1rem;height:1rem;border-radius:.25rem;border:1px solid #6b7280;background-color:#1f2937;cursor:pointer}
.form-checkbox:checked{background-color:#ff2d2d;border-color:#ff2d2d}
.form-select{width:100%;padding:.75rem 1rem;background-color:#fff;border:1px solid #d1d5db;border-radius:.5rem;color:#111827;font-size:1rem;cursor:pointer}
.form-select:focus{outline:none;border-color:#ff2d2d;box-shadow:0 0 0 3px rgba(255,45,45,.2)}
.form-textarea{width:100%;padding:.75rem 1rem;background-color:#fff;border:1px solid #d1d5db;border-radius:.5rem;color:#111827;font-size:1rem;resize:vertical;min-height:100px}
.form-textarea:focus{outline:none;border-color:#ff2d2d;box-shadow:0 0 0 3px rgba(255,45,45,.2)}

/* ===== MOBILE RESPONSIVE ===== */
@media(max-width:767px){
    *,*::before,*::after{max-width:100vw;box-sizing:border-box}
    .container{padding-left:.75rem!important;padding-right:.75rem!important;max-width:100%!important;overflow-x:hidden!important}
    body{font-size:14px;padding-bottom:64px!important}
    h1{font-size:1.375rem!important;line-height:1.3!important}
    h2{font-size:1.125rem!important;line-height:1.3!important}
    h3{font-size:1rem!important}
    .section-title{font-size:1.125rem!important}
    .video-card .text-sm,.video-card h3{font-size:.8125rem!important}
    .text-\[10px\],.text-\[11px\]{font-size:11px!important}
    .grid-cols-1.sm\:grid-cols-2,.grid-cols-1.sm\:grid-cols-3,.grid-cols-1.min-\[540px\]\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.5rem!important}
    .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3{grid-template-columns:1fr!important;gap:12px!important}
    .video-player-container,#video-player-wrapper,.plyr,.plyr__video-wrapper{width:100vw!important;max-width:100vw!important;margin-left:calc(-50vw + 50%)!important;border-radius:0!important}
    #video-player-wrapper{min-height:56.25vw!important;position:relative!important}
    #video-player-wrapper iframe{width:100%!important;height:100%!important;position:absolute!important;top:0!important;left:0!important}
    .swiper,.categories-swiper,#categoriesSwiper{overflow:hidden!important;max-width:100%!important}
    .swiper-wrapper{max-width:100%!important;overflow:hidden}
    .swiper-slide{flex-shrink:0}
    .swiper-slide .w-36,.swiper-slide .sm\:w-40,.swiper-slide .lg\:w-44{width:7.5rem!important}
    .shrink-0 .w-40,.shrink-0 .sm\:w-44{width:8rem!important}
    a,button,[role="button"]{-webkit-tap-highlight-color:rgba(255,45,45,.1)}
    #mobile-bottom-nav a{min-height:48px!important;min-width:48px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important}
    footer a,footer li a{min-height:44px!important;display:inline-flex!important;align-items:center!important;padding-top:.5rem!important;padding-bottom:.5rem!important}
    .pagination a,.pagination span{min-width:40px!important;min-height:40px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
    #toast-container{top:auto!important;bottom:70px!important;right:.5rem!important;left:.5rem!important;max-width:none!important;width:auto!important}
    .lg\:w-80{width:100%!important}
    .badge-premium,.badge-exclusive,.badge-ppv,.badge-free{font-size:.5625rem!important;padding:.2rem .4rem!important}
    .ad-container{max-width:100%!important;overflow:hidden!important}
    .hidden.md\:block.ad-container{display:none!important}
    input[type="text"],input[type="email"],input[type="password"],input[type="search"],input[type="url"],input[type="tel"],input[type="number"],select,textarea,.form-input,.form-select,.form-textarea{font-size:16px!important;min-height:48px!important;width:100%!important}
    footer .grid{grid-template-columns:1fr 1fr!important;gap:1.5rem!important}
    footer .col-span-2,footer .sm\:col-span-3{grid-column:span 2!important}
    header .container{padding-left:.5rem!important;padding-right:.5rem!important}
    [x-show*="megaMenuOpen"]{display:none!important}
    [x-show="searchOpen"] .max-w-2xl{max-width:100%!important}
    [x-show="searchOpen"] input{font-size:16px!important}
    .grid.grid-cols-2{gap:.5rem!important}
    .gap-4{gap:.5rem!important}
    .gap-8{gap:1rem!important}
    [x-show][class*="fixed"][class*="inset-0"] .max-w-md,[x-show][class*="fixed"][class*="inset-0"] .max-w-lg,[x-show][class*="fixed"][class*="inset-0"] .max-w-xl{max-width:100%!important;margin:.5rem!important;max-height:calc(100vh - 80px)!important;overflow-y:auto!important}
    .scrollbar-hide::-webkit-scrollbar{display:none}
    .scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}
    .overflow-x-auto{max-width:100vw!important;-webkit-overflow-scrolling:touch}
    #mobile-bottom-nav{z-index:2147483647!important}
    [id^="exo-mobile-im-container-wrapper"]{bottom:64px!important}
    footer{margin-bottom:0!important;padding-bottom:1rem!important}
    /* Lazy sections for performance */
    section:nth-child(n+4){content-visibility:auto;contain-intrinsic-size:0 500px}
}

/* Tablets */
@media(min-width:768px) and (max-width:1023px){
    .container{padding-left:1.5rem!important;padding-right:1.5rem!important}
    h1{font-size:1.5rem!important}
    .grid-cols-1.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

/* Touch optimizations */
@media(max-width:1024px){
    .orientation-link,#orientation-bar a{min-height:44px;line-height:34px;padding:5px 16px!important}
    nav button,header button,.hamburger-btn{min-width:44px;min-height:44px}
    .search-btn,.nav-toggle{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
}

@media(hover:none) and (pointer:coarse){
    .video-card:hover{transform:none!important}
    a,button{-webkit-tap-highlight-color:rgba(255,45,45,.1)}
    .video-card,.btn-primary,.btn-secondary,.btn-cyan{transition-duration:.1s!important}
}

/* iOS Safe Areas */
@supports(padding:max(0px)){
    body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
    header{padding-left:max(.5rem,env(safe-area-inset-left));padding-right:max(.5rem,env(safe-area-inset-right))}
    #mobile-bottom-nav{padding-bottom:env(safe-area-inset-bottom,0)!important}
}

/* Swiper overflow */
.swiper-container,.swiper{max-width:100vw;overflow:hidden}
