
/* SAFE: aucun SQL, aucune dépendance au schéma BDD */
.annonces-banner{position:relative!important;overflow:hidden!important;isolation:isolate}
.yp-annonces-safe-fx{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.annonces-banner .annonces-space,.annonces-banner .annonces-text{position:relative;z-index:3}
.yp-ad-safe-preview{position:absolute;right:2%;top:50%;z-index:6;transform:translateY(-50%);width:clamp(90px,13vw,170px);padding:5px;border:1px solid rgba(80,240,255,.75);border-radius:11px;background:rgba(4,10,22,.78);box-shadow:0 0 15px rgba(45,225,255,.35)}
.yp-ad-safe-label{text-align:center;color:#c8fbff;font:800 clamp(7px,.7vw,10px)/1 Arial;letter-spacing:.08em;margin:2px 0 5px}
.yp-ad-safe-screen{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:7px;background:#060a13}
.yp-ad-safe-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .9s ease,transform 20s linear}
.yp-ad-safe-img.is-on{opacity:1;transform:scale(1)}
.yp-ad-safe-title{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:12px 4px 4px;background:linear-gradient(transparent,rgba(0,0,0,.88));color:#fff;font:800 clamp(7px,.7vw,10px)/1.15 Arial;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yp-ad-safe-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#8df7ff;font-size:24px}.yp-ad-safe-empty small{font:800 7px Arial;margin-top:3px}
.yp-ad-safe-progress{height:2px;margin-top:5px;overflow:hidden;background:rgba(90,240,255,.15)}
.yp-ad-safe-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#55f4ff,#a961ff,#ff59bd)}
.yp-ad-safe-preview.running .yp-ad-safe-progress span{animation:ypSafe20 20s linear infinite}
@keyframes ypSafe20{from{width:0}to{width:100%}}
.yp-mega-safe{position:absolute;left:50%;top:50%;z-index:9;display:flex;align-items:center;gap:8px;opacity:0;transform:translate(-50%,-50%) scale(.2);pointer-events:none}
.yp-mega-safe-icon{font-size:clamp(45px,8vw,105px);filter:drop-shadow(0 0 12px #58efff)}
.yp-mega-safe-word{font:1000 clamp(22px,5vw,68px)/1 Arial;color:#fff;letter-spacing:.07em;text-shadow:0 0 7px #fff,0 0 18px #59eaff,0 0 28px #a85fff}
.annonces-banner.yp-final-safe .yp-mega-safe{animation:ypMegaSafe .7s cubic-bezier(.2,.85,.25,1.25) forwards}
.annonces-banner.yp-final-safe .yp-mega-safe-word{animation:ypWordSafe .8s .35s both}
@keyframes ypMegaSafe{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes ypWordSafe{from{opacity:0;transform:translateX(-50px) scaleX(.2)}to{opacity:1;transform:none}}
@media(max-width:700px){.yp-ad-safe-preview{right:1%;width:82px;padding:3px}}

/* FINAL — masque uniquement les reliquats de l'ancien pictogramme */
#ypAnnoncesSafe .ad-logo,
#ypAnnoncesSafe .ad-board,
#ypAnnoncesSafe .ad-pin,
#ypAnnoncesSafe .ad-tag{display:none!important}

/* La photo du slide ouvre l'annonce correspondante */
#ypAnnoncesSafe .yp-ad-safe-link{
 position:absolute;inset:0;display:block;text-decoration:none;color:inherit;
 cursor:pointer;z-index:3
}
#ypAnnoncesSafe .yp-ad-safe-link:focus-visible{
 outline:2px solid #65f4ff;outline-offset:-2px
}

/* v3.1 : le changement réel et la barre partagent le même cycle de 20 s */
#ypAnnoncesSafe .yp-ad-safe-img{will-change:opacity,transform}

/* YOUPLUGS ANNONCES FUTURISTIC THEME v4 */
#ypAnnoncesSafe{--a:#56efff;--b:#a45dff;--c:#ff55bc;--txt:#ecfdff;--panel:rgba(4,10,25,.74);--glow:rgba(86,239,255,.48);position:relative!important;min-height:clamp(145px,18vw,245px);border:1px solid var(--a)!important;border-radius:clamp(12px,1.5vw,22px);background:radial-gradient(circle at 12% 40%,color-mix(in srgb,var(--a) 25%,transparent),transparent 30%),radial-gradient(circle at 72% 20%,color-mix(in srgb,var(--b) 22%,transparent),transparent 33%),linear-gradient(135deg,#030817,#07101f 48%,#030711)!important;box-shadow:0 0 24px var(--glow),inset 0 0 35px rgba(0,0,0,.48)!important;transition:.45s}
#ypAnnoncesSafe:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.34;background-image:linear-gradient(color-mix(in srgb,var(--a) 18%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--a) 18%,transparent) 1px,transparent 1px);background-size:28px 28px;animation:ypGrid 16s linear infinite}
#ypAnnoncesSafe:after{content:"";position:absolute;left:-15%;right:-15%;top:-60%;height:80%;z-index:1;pointer-events:none;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--a) 20%,transparent),color-mix(in srgb,var(--b) 18%,transparent),transparent);filter:blur(20px);animation:ypScan 8s ease-in-out infinite alternate}
@keyframes ypGrid{to{background-position:28px 28px}}@keyframes ypScan{to{transform:translateY(180%) rotate(4deg)}}
#ypAnnoncesSafe .annonces-text{font-family:"Orbitron","Eurostile","Bank Gothic","Segoe UI",Arial,sans-serif!important;text-transform:uppercase;letter-spacing:.11em!important;filter:drop-shadow(0 0 7px var(--glow))}
#ypAnnoncesSafe .annonces-text .youplugs{color:var(--txt)!important;font-weight:800!important;letter-spacing:.28em!important;text-shadow:0 0 6px var(--a)!important}
#ypAnnoncesSafe .annonces-text .title{color:transparent!important;font-weight:950!important;letter-spacing:.12em!important;background:linear-gradient(90deg,var(--a),var(--b),var(--c),var(--a))!important;background-size:240% 100%!important;-webkit-background-clip:text!important;background-clip:text!important;filter:drop-shadow(0 0 5px var(--glow));animation:ypTitle 9s linear infinite}
@keyframes ypTitle{to{background-position:240% 0}}
#ypAnnoncesSafe .yp-ad-safe-preview{border-color:var(--a)!important;background:linear-gradient(145deg,rgba(255,255,255,.10),transparent 30%),var(--panel)!important;box-shadow:0 0 12px var(--glow),0 0 28px color-mix(in srgb,var(--b) 25%,transparent),inset 0 0 16px rgba(255,255,255,.07)!important;backdrop-filter:blur(9px) saturate(1.35)}
#ypAnnoncesSafe .yp-ad-safe-label{color:var(--txt)!important;font-family:"Orbitron","Eurostile","Bank Gothic","Segoe UI",Arial,sans-serif!important;letter-spacing:.13em!important;text-shadow:0 0 7px var(--a)!important}
#ypAnnoncesSafe .yp-ad-safe-screen{border:1px solid var(--a)!important;box-shadow:inset 0 0 14px var(--glow)}
#ypAnnoncesSafe .yp-ad-safe-progress span{background:linear-gradient(90deg,var(--a),var(--b),var(--c))!important;box-shadow:0 0 8px var(--a)!important}
#ypAnnoncesSafe .yp-mega-safe-word{font-family:"Orbitron","Eurostile","Bank Gothic","Segoe UI",Arial,sans-serif!important;color:transparent!important;background:linear-gradient(90deg,var(--a),var(--b),var(--c))!important;-webkit-background-clip:text!important;background-clip:text!important}
#ypAnnoncesSafe.yp-theme-white{--a:#22bde8;--b:#665cff;--c:#f14ca8;--txt:#101827;--panel:rgba(247,252,255,.88);--glow:rgba(45,195,255,.34);background:radial-gradient(circle at 12% 40%,rgba(57,207,255,.20),transparent 31%),radial-gradient(circle at 72% 20%,rgba(108,99,255,.15),transparent 35%),linear-gradient(135deg,#f9fdff,#eaf6ff 52%,#fdfaff)!important}
#ypAnnoncesSafe.yp-theme-black{--a:#8af7ff;--b:#a566ff;--c:#ff4ca8;--txt:#f5fbff;--panel:rgba(1,4,12,.84);--glow:rgba(94,235,255,.48)}
#ypAnnoncesSafe.yp-theme-cyan{--a:#00f4ff;--b:#00a8ff;--c:#78ffff;--txt:#eaffff;--panel:rgba(0,35,48,.78);--glow:rgba(0,244,255,.52)}
#ypAnnoncesSafe.yp-theme-green{--a:#55ff9a;--b:#00d878;--c:#c5ff5c;--txt:#edfff5;--panel:rgba(0,31,20,.80);--glow:rgba(70,255,145,.46)}
#ypAnnoncesSafe.yp-theme-blue{--a:#45a8ff;--b:#3057ff;--c:#70e5ff;--txt:#eff7ff;--panel:rgba(4,18,52,.82);--glow:rgba(69,168,255,.50)}
#ypAnnoncesSafe.yp-theme-purple{--a:#c068ff;--b:#7c45ff;--c:#ff58dc;--txt:#fff1ff;--panel:rgba(31,8,52,.82);--glow:rgba(192,104,255,.48)}
#ypAnnoncesSafe.yp-theme-red{--a:#ff536f;--b:#ff2f42;--c:#ff9a55;--txt:#fff1f3;--panel:rgba(50,5,13,.82);--glow:rgba(255,70,100,.47)}
#ypAnnoncesSafe.yp-theme-gold{--a:#ffd95b;--b:#ff9f2f;--c:#fff1a0;--txt:#fff9e6;--panel:rgba(47,31,3,.84);--glow:rgba(255,205,65,.45)}
@media(max-width:700px){#ypAnnoncesSafe{min-height:138px;border-radius:12px}#ypAnnoncesSafe:before{background-size:18px 18px}#ypAnnoncesSafe .annonces-text{max-width:52%;letter-spacing:.05em!important}#ypAnnoncesSafe .annonces-text .youplugs{font-size:clamp(8px,2.5vw,13px)!important;letter-spacing:.15em!important}#ypAnnoncesSafe .annonces-text .title{font-size:clamp(17px,5vw,30px)!important;letter-spacing:.05em!important}#ypAnnoncesSafe .yp-ad-safe-preview{right:2%!important;width:clamp(78px,27vw,112px)!important}.yp-ad-safe-label{font-size:6px!important}}
@media(max-width:420px){#ypAnnoncesSafe{min-height:125px}#ypAnnoncesSafe .yp-mega-safe-word{font-size:clamp(18px,8vw,30px)!important}}
@media(prefers-reduced-motion:reduce){#ypAnnoncesSafe:before,#ypAnnoncesSafe:after,#ypAnnoncesSafe .annonces-text .title{animation:none!important}}

/* v4.1 — fermeture animée du mégaphone au second clic */
#ypAnnoncesSafe.yp-mega-closing .yp-mega-safe{
 opacity:0!important;
 transform:translate(-50%,-50%) scale(.25) rotate(-5deg)!important;
 transition:opacity .42s ease,transform .48s cubic-bezier(.55,0,1,.45)!important;
}
#ypAnnoncesSafe.yp-mega-closing .yp-mega-safe-word{
 opacity:0!important;
 transform:translateX(-45px) scaleX(.35)!important;
 transition:opacity .28s ease,transform .42s ease!important;
}

/* v4.2 — alternance titre gauche <-> mégaphone */
#ypAnnoncesSafe .annonces-text{
 opacity:1;
 visibility:visible;
 transform:translateX(0) scale(1);
 transition:
   opacity .34s ease,
   transform .42s cubic-bezier(.2,.75,.25,1),
   visibility 0s linear 0s!important;
}

/* Dès que le mégaphone est ouvert, le titre original disparaît. */
#ypAnnoncesSafe.yp-final-safe .annonces-text{
 opacity:0!important;
 visibility:hidden!important;
 transform:translateX(-28px) scale(.88)!important;
 pointer-events:none!important;
 transition:
   opacity .25s ease,
   transform .34s ease,
   visibility 0s linear .25s!important;
}

/* Pendant la fermeture, on laisse d'abord partir le mégaphone,
   puis le titre revient doucement. */
#ypAnnoncesSafe.yp-mega-closing .annonces-text{
 opacity:0!important;
 visibility:hidden!important;
 transform:translateX(-20px) scale(.92)!important;
 pointer-events:none!important;
}

/* Le mégaphone prend la zone centrale/gauche sans recouvrir le slide. */
#ypAnnoncesSafe .yp-mega-safe{
 left:38%!important;
 max-width:58%!important;
}
#ypAnnoncesSafe.yp-final-safe .yp-mega-safe{
 animation:ypMegaSafe .7s .12s cubic-bezier(.2,.85,.25,1.25) forwards!important;
}

/* Le retour du titre après fermeture. */
#ypAnnoncesSafe:not(.yp-final-safe):not(.yp-mega-closing) .annonces-text{
 animation:ypTitleReturn .48s ease both;
}
@keyframes ypTitleReturn{
 from{opacity:0;transform:translateX(-18px) scale(.94)}
 to{opacity:1;transform:translateX(0) scale(1)}
}

@media(max-width:700px){
 #ypAnnoncesSafe .yp-mega-safe{
   left:35%!important;
   max-width:55%!important;
 }
}
