/* ============ E-VISIOCAM - STYLES COMMUNS ============ */ ::-webkit-scrollbar { width: 6px; height: 6px; } ::-webkit-scrollbar-track { background: rgba(0,0,0,0.05); } ::-webkit-scrollbar-thumb { background: rgba(233, 30, 99, 0.3); border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: rgba(233, 30, 99, 0.6); } .live-pulse { animation: pulse 1.5s infinite; } @keyframes pulse { 0% { opacity: 1; } 50% { opacity: 0.4; } 100% { opacity: 1; } } .scrollbar-none { scrollbar-width: none; -ms-overflow-style: none; } .scrollbar-none::-webkit-scrollbar { display: none; } .animate-fade-in { animation: fadeIn 0.3s ease-out; } @keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } } .video-glow { box-shadow: 0 0 40px rgba(233, 30, 99, 0.15), inset 0 0 60px rgba(0,0,0,0.3); } .emoji-reaction { position: absolute; animation: floatUp 2s ease-out forwards; pointer-events: none; font-size: 1.5rem; } @keyframes floatUp { 0% { opacity: 1; transform: translateY(0) scale(1); } 100% { opacity: 0; transform: translateY(-80px) scale(1.5); } } .typing-dots span { animation: typing 1.4s infinite; line-height: 0; font-size: 1.2rem; } .typing-dots span:nth-child(2) { animation-delay: 0.2s; } .typing-dots span:nth-child(3) { animation-delay: 0.4s; } @keyframes typing { 0%, 60%, 100% { opacity: 0.2; } 30% { opacity: 1; } } .legal-content h2 { font-size: 1.25rem; font-weight: 700; margin-top: 2rem; margin-bottom: 0.75rem; color: #0f172a; } .legal-content h3 { font-size: 1.05rem; font-weight: 600; margin-top: 1.25rem; margin-bottom: 0.5rem; color: #1e293b; } .legal-content p { margin-bottom: 0.75rem; line-height: 1.7; color: #475569; } .legal-content ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1rem; color: #475569; } .legal-content li { margin-bottom: 0.25rem; line-height: 1.6; } @keyframes badgePop { 0% { transform: scale(1); } 50% { transform: scale(1.4); } 100% { transform: scale(1); } } /* Bannière accueil */ .cam-banner,.cam-banner *{box-sizing:border-box} .cam-banner{position:relative;isolation:isolate;overflow:hidden;min-height:290px;border:1px solid #393036;border-radius:18px;background:#11090f;color:#fff;box-shadow:0 12px 30px #0002;font-family:Inter,Arial,sans-serif} .cam-banner-art{position:absolute;z-index:-2;inset:0;background-image:radial-gradient(120% 150% at 88% 12%,rgba(255,22,128,.32) 0%,rgba(255,22,128,0) 55%),radial-gradient(90% 120% at 100% 92%,rgba(255,229,0,.20) 0%,rgba(255,229,0,0) 50%),linear-gradient(115deg,#141416 0%,#111113 45%,#1c1218 100%);background-size:cover;background-position:center right} .cam-banner:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#11090f 0%,#11090f 36%,rgba(17,9,15,.9) 43%,rgba(17,9,15,0) 58%)} .cam-banner-content{position:relative;padding:30px 26px;width:55%;max-width:560px} .cam-banner h1{margin:0;font-size:clamp(28px,3vw,44px);line-height:1.04;font-weight:800;letter-spacing:-1px;text-transform:uppercase} .cam-banner h1 span{color:#ffe500} .cam-banner p{max-width:410px;margin:12px 0 18px;color:#d7d3d6;font-size:13px;line-height:1.55} .cam-banner-cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 19px;border-radius:11px;background:#ffe500;color:#101010;font-size:13px;font-weight:800;text-decoration:none;box-shadow:0 4px 19px #ffe50030;transition:background .2s,transform .2s} .cam-banner-cta:hover{background:#fff24a;transform:translateY(-1px)} .cam-banner-cta:focus-visible{outline:3px solid white;outline-offset:4px} .cam-banner-cta svg{width:19px;height:19px;fill:currentColor} .cam-banner-trust{display:flex;flex-wrap:wrap;gap:12px 22px;margin:22px 0 0;padding:0;list-style:none;color:#d7d3d6;font-size:11px;font-weight:600} .cam-banner-trust li{display:flex;align-items:center;gap:7px;white-space:nowrap} .cam-banner-trust svg{width:21px;height:21px;fill:#ff1680;flex:none} @media(min-width:1400px){.cam-banner{min-height:330px}.cam-banner-content{padding:36px 30px}.cam-banner-trust{margin-top:26px}} @media(max-width:700px){.cam-banner{min-height:340px}.cam-banner-art{background-size:cover;background-position:center right;clip-path:none;opacity:1}.cam-banner:after{background:linear-gradient(90deg,#11090f 5%,rgba(17,9,15,.95) 30%,rgba(17,9,15,.35) 100%)}.cam-banner-content{width:100%;max-width:430px;padding:27px 22px}.cam-banner h1{font-size:34px}.cam-banner p{max-width:260px}.cam-banner-trust{max-width:280px;gap:12px 18px}} main.flex-1{min-width:0} @media(prefers-reduced-motion:reduce){.cam-banner-cta{transition:none}} /* Direction artistique commune à l'accueil : noir, jaune et rose. */ html.cam-theme:where(:not([data-theme="light"])){background:#111113;color-scheme:dark} :where(html:not([data-theme="light"])) .cam-home{--cam-bg:#111113;--cam-panel:#1c1c20;--cam-border:#343439;--cam-yellow:#ffe500;--cam-pink:#ff1680;background:var(--cam-bg);color:#f5f5f6;min-height:100vh} :where(html:not([data-theme="light"])) .cam-home .cam-header{background:#18181b;border-color:var(--cam-border);box-shadow:0 4px 20px #0003} :where(html:not([data-theme="light"])) .cam-home .cam-logo{background:var(--cam-yellow);color:#111113;border:1px solid #fff14f;border-radius:11px;box-shadow:none} :where(html:not([data-theme="light"])) .cam-home .text-slate-900,:where(html:not([data-theme="light"])) .cam-home .text-slate-800{color:#f5f5f6} :where(html:not([data-theme="light"])) .cam-home .text-slate-600{color:#ceced4} :where(html:not([data-theme="light"])) .cam-home .text-slate-500,:where(html:not([data-theme="light"])) .cam-home .text-slate-400{color:#a6a6b1} :where(html:not([data-theme="light"])) .cam-home .text-brand-primary{color:var(--cam-yellow)} :where(html:not([data-theme="light"])) .cam-home .border-brand-primary{border-color:var(--cam-yellow)} .cam-home .cam-topnav a{padding-top:22px;padding-bottom:20px} :where(html:not([data-theme="light"])) .cam-home .cam-topnav a:hover{color:var(--cam-yellow)} :where(html:not([data-theme="light"])) .cam-home .cam-search input{background:#25252a;color:#f5f5f6;border:1px solid #3a3a42;border-radius:10px} :where(html:not([data-theme="light"])) .cam-home .cam-search input::placeholder{color:#a6a6b1} :where(html:not([data-theme="light"])) .cam-home .cam-search input:focus{background:#2b2b30;border-color:var(--cam-yellow)} :where(html:not([data-theme="light"])) .cam-home header button:hover{background:#2b2b30;color:var(--cam-yellow)} :where(html:not([data-theme="light"])) .cam-home header button .bg-brand-primary{background:var(--cam-pink);--tw-ring-color:#18181b} :where(html:not([data-theme="light"])) .cam-home .cam-go-live{background:var(--cam-yellow);background-image:none;color:#111113;border:1px solid #fff14f;border-radius:12px;box-shadow:0 4px 16px #0003;font-size:13px} :where(html:not([data-theme="light"])) .cam-home .cam-go-live:hover{background:#fff04a;opacity:1} :where(html:not([data-theme="light"])) .cam-home .cam-sidenav,:where(html:not([data-theme="light"])) .cam-home .cam-live-panel{background:var(--cam-panel);border:1px solid var(--cam-border);border-radius:16px;box-shadow:0 8px 24px #0002} .cam-home .cam-sidenav a{min-height:46px;border:1px solid transparent;border-radius:10px;transition:background .15s,color .15s} :where(html:not([data-theme="light"])) .cam-home .cam-sidenav a[href="index.html"]{background:#ffe500;color:#111113;border-color:#fff14f} :where(html:not([data-theme="light"])) .cam-home .cam-sidenav a:not([href="index.html"]):hover{background:#2c2c32;color:#fff} :where(html:not([data-theme="light"])) .cam-home .cam-sidenav a:not([href="index.html"]) i{color:var(--cam-pink)} :where(html:not([data-theme="light"])) .cam-home .cam-sidenav a[href="credits.html"] i{color:var(--cam-yellow)} :where(html:not([data-theme="light"])) .cam-home .cam-sidenav .bg-brand-primary{background:var(--cam-pink);color:#fff} :where(html:not([data-theme="light"])) .cam-home .cam-live-panel h2{display:flex;align-items:center;gap:10px;color:#f5f5f6;font-size:19px;letter-spacing:-.3px} :where(html:not([data-theme="light"])) .cam-home .cam-live-panel h2:before{content:"";display:block;width:9px;height:9px;border-radius:50%;background:var(--cam-pink);flex:none} :where(html:not([data-theme="light"])) .cam-home .cam-live-panel p{color:#acacb7} :where(html:not([data-theme="light"])) .cam-home .cam-banner{border-color:#3c3038;box-shadow:0 10px 30px #0003;border-radius:16px} .cam-home #navAuth a,.cam-home #navAuth button{border-radius:10px} :where(html:not([data-theme="light"])) .cam-home #navAuth .bg-white{background:#25252a;color:#f5f5f6;border-color:#3a3a42} :where(html:not([data-theme="light"])) .cam-home #navAuth .bg-brand-primary,:where(html:not([data-theme="light"])) .cam-home #navAuth a[href*="register"]{background:var(--cam-yellow);background-image:none;color:#111113;border-color:var(--cam-yellow)} :where(html:not([data-theme="light"])) .cam-home :is(a,button,input):focus-visible{outline:2px solid var(--cam-yellow);outline-offset:4px} :where(html:not([data-theme="light"])) .cam-home ::-webkit-scrollbar-track{background:#18181b} :where(html:not([data-theme="light"])) .cam-home ::-webkit-scrollbar-thumb{background:#53535d} :where(html:not([data-theme="light"])) .cam-home ::-webkit-scrollbar-thumb:hover{background:#ff1680} @media(min-width:1024px) and (max-width:1450px){.cam-home .cam-search{display:none}} @media(max-width:640px){.cam-home .cam-header>div{gap:8px;padding-left:12px;padding-right:12px}.cam-home .cam-header>div>div{gap:10px}.cam-home .cam-logo+span{font-size:19px}.cam-home .cam-logo{width:30px;height:30px}.cam-home .cam-layout{gap:16px}.cam-home .cam-live-panel{padding:20px}.cam-home #navAuth{gap:5px;font-size:12px}.cam-home #navAuth a,.cam-home #navAuth button{padding:8px}} @media(prefers-reduced-motion:reduce){.cam-home .cam-sidenav a{transition:none}} /* ========================================================== THÈME GLOBAL E-VISIOCAM S'applique à toutes les pages chargeant ce fichier, sans classe à ajouter. Les composants créés en JS sont inclus. Modifier ces variables pour faire évoluer la palette. ========================================================== */ :root{--ev-bg:#111113;--ev-panel:#1c1c20;--ev-field:#25252b;--ev-hover:#303037;--ev-border:#3b3b43;--ev-text:#f5f5f7;--ev-muted:#b1b1bd;--ev-yellow:#ffe500;--ev-yellow-hover:#fff04a;--ev-pink:#ff1680} html:where(:not([data-theme="light"])){background:var(--ev-bg);color-scheme:dark} body,body.gradient-bg{font-family:Inter,Arial,sans-serif} :where(html:not([data-theme="light"])) body,:where(html:not([data-theme="light"])) body.gradient-bg{background:var(--ev-bg);color:var(--ev-text)} :where(html:not([data-theme="light"])) body .bg-white,:where(html:not([data-theme="light"])) body .login-card,:where(html:not([data-theme="light"])) body .register-card{background:var(--ev-panel);color:var(--ev-text);backdrop-filter:none} :where(html:not([data-theme="light"])) body .bg-slate-50,:where(html:not([data-theme="light"])) body [class~="bg-slate-50/50"],:where(html:not([data-theme="light"])) body [class~="bg-slate-50/30"],:where(html:not([data-theme="light"])) body .bg-slate-100{background-color:var(--ev-field)} :where(html:not([data-theme="light"])) body.bg-slate-100{background:var(--ev-bg)} :where(html:not([data-theme="light"])) body .bg-slate-200{background-color:#37373f} :where(html:not([data-theme="light"])) body .bg-slate-700,:where(html:not([data-theme="light"])) body .bg-slate-800{background-color:#25252b} :where(html:not([data-theme="light"])) body .bg-slate-900{background-color:#161619} :where(html:not([data-theme="light"])) body .text-slate-900,:where(html:not([data-theme="light"])) body .text-slate-800{color:var(--ev-text)} :where(html:not([data-theme="light"])) body .text-slate-700,:where(html:not([data-theme="light"])) body .text-slate-600{color:#d1d1da} :where(html:not([data-theme="light"])) body .text-slate-500,:where(html:not([data-theme="light"])) body .text-slate-400{color:var(--ev-muted)} :where(html:not([data-theme="light"])) body .text-slate-300{color:#d1d1da} :where(html:not([data-theme="light"])) body .border-slate-50,:where(html:not([data-theme="light"])) body .border-slate-100,:where(html:not([data-theme="light"])) body .border-slate-200,:where(html:not([data-theme="light"])) body [class~="border-slate-200/80"],:where(html:not([data-theme="light"])) body .border-slate-300{border-color:var(--ev-border)} :where(html:not([data-theme="light"])) body [class~="divide-slate-100"]>:not([hidden])~:not([hidden]),:where(html:not([data-theme="light"])) body [class~="divide-slate-200"]>:not([hidden])~:not([hidden]){border-color:var(--ev-border)} :where(html:not([data-theme="light"])) body header.bg-white,:where(html:not([data-theme="light"])) body footer.bg-white{background:#18181b;border-color:var(--ev-border)} :where(html:not([data-theme="light"])) body .text-brand-primary,:where(html:not([data-theme="light"])) body .text-brand-hover{color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body .border-brand-primary{border-color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body .bg-brand-primary,:where(html:not([data-theme="light"])) body .bg-brand-hover,:where(html:not([data-theme="light"])) body .from-brand-primary{background:var(--ev-yellow);color:#111113;box-shadow:none} :where(html:not([data-theme="light"])) body .bg-brand-primary .text-white,:where(html:not([data-theme="light"])) body .from-brand-primary .text-white{color:#111113} :where(html:not([data-theme="light"])) body a.bg-brand-primary:hover,:where(html:not([data-theme="light"])) body button.bg-brand-primary:hover,:where(html:not([data-theme="light"])) body a.from-brand-primary:hover,:where(html:not([data-theme="light"])) body button.from-brand-primary:hover{background:var(--ev-yellow-hover)} :where(html:not([data-theme="light"])) body [class~="hover:bg-brand-hover"]:hover{background:var(--ev-yellow-hover);color:#111113} /* Boutons et liens jaunes de tout le site : même style brillant que .ev-btn (pastilles et badges exclus) */ :where(html:not([data-theme="light"])) body :is(a, button).bg-brand-primary, :where(html:not([data-theme="light"])) body :is(a, button).from-brand-primary{ background:var(--btn-brillant-fond);box-shadow:var(--btn-brillant-ombre); text-shadow:0 1px 0 rgba(255,255,255,.35);transition:box-shadow .15s, filter .15s, transform .15s} :where(html:not([data-theme="light"])) body :is(a, button).bg-brand-primary:hover:not(:disabled), :where(html:not([data-theme="light"])) body :is(a, button).from-brand-primary:hover:not(:disabled){ background:var(--btn-brillant-fond-survol);box-shadow:var(--btn-brillant-ombre-survol);transform:translateY(-1px)} :where(html:not([data-theme="light"])) body :is(a, button).bg-brand-primary:active, :where(html:not([data-theme="light"])) body :is(a, button).from-brand-primary:active{transform:translateY(0);filter:brightness(.97)} :where(html:not([data-theme="light"])) body button:is(.bg-brand-primary, .from-brand-primary):disabled{box-shadow:var(--btn-brillant-ombre);filter:saturate(.6) brightness(.85)} :where(html:not([data-theme="light"])) body [class~="hover:text-brand-primary"]:hover{color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body [class~="hover:bg-slate-50"]:hover,:where(html:not([data-theme="light"])) body [class~="hover:bg-slate-100"]:hover,:where(html:not([data-theme="light"])) body [class~="hover:bg-white"]:hover{background-color:var(--ev-hover)} :where(html:not([data-theme="light"])) body [class~="hover:text-slate-700"]:hover,:where(html:not([data-theme="light"])) body [class~="hover:text-slate-900"]:hover{color:var(--ev-text)} :where(html:not([data-theme="light"])) body .bg-pink-50{background-color:#382333} :where(html:not([data-theme="light"])) body .bg-pink-100{background-color:#49283e} :where(html:not([data-theme="light"])) body [class~="border-pink-200/60"],:where(html:not([data-theme="light"])) body .border-pink-200{border-color:#74465d} :where(html:not([data-theme="light"])) body [class~="from-pink-50"],:where(html:not([data-theme="light"])) body [class~="from-pink-100"]{background:#28222a} :where(html:not([data-theme="light"])) body [class~="from-purple-900"],:where(html:not([data-theme="light"])) body [class~="to-purple-900"],:where(html:not([data-theme="light"])) body [class~="to-purple-800"]{background:#232027} :where(html:not([data-theme="light"])) body .bg-purple-50,:where(html:not([data-theme="light"])) body .bg-purple-100{background:#30283c} :where(html:not([data-theme="light"])) body .text-purple-700{color:#cfb2f5} :where(html:not([data-theme="light"])) body .border-purple-200{border-color:#5b466f} /* Erreurs et états : garder un sens distinct des actions jaunes. */ :where(html:not([data-theme="light"])) body .bg-rose-50,:where(html:not([data-theme="light"])) body .bg-rose-100{background:#3a202a} :where(html:not([data-theme="light"])) body .text-rose-600,:where(html:not([data-theme="light"])) body .text-rose-700,:where(html:not([data-theme="light"])) body .text-rose-800{color:#ff99b3} :where(html:not([data-theme="light"])) body .border-rose-200{border-color:#754052} :where(html:not([data-theme="light"])) body .bg-red-50,:where(html:not([data-theme="light"])) body .bg-red-100{background:#3b2025} :where(html:not([data-theme="light"])) body .text-red-600,:where(html:not([data-theme="light"])) body .text-red-700,:where(html:not([data-theme="light"])) body .text-red-800{color:#ffaaaa} :where(html:not([data-theme="light"])) body .border-red-200{border-color:#77404a} :where(html:not([data-theme="light"])) body .bg-green-50,:where(html:not([data-theme="light"])) body .bg-green-100,:where(html:not([data-theme="light"])) body .bg-emerald-50,:where(html:not([data-theme="light"])) body .bg-emerald-100{background:#18392c} :where(html:not([data-theme="light"])) body .text-green-600,:where(html:not([data-theme="light"])) body .text-green-700,:where(html:not([data-theme="light"])) body .text-green-800,:where(html:not([data-theme="light"])) body .text-emerald-600,:where(html:not([data-theme="light"])) body .text-emerald-700{color:#80e5b3} :where(html:not([data-theme="light"])) body .border-green-200,:where(html:not([data-theme="light"])) body .border-emerald-200{border-color:#376b50} :where(html:not([data-theme="light"])) body .bg-blue-50,:where(html:not([data-theme="light"])) body .bg-blue-100{background:#203249} :where(html:not([data-theme="light"])) body .text-blue-600,:where(html:not([data-theme="light"])) body .text-blue-700,:where(html:not([data-theme="light"])) body .text-blue-800{color:#9fcaff} :where(html:not([data-theme="light"])) body .border-blue-200{border-color:#3d6088} :where(html:not([data-theme="light"])) body .bg-amber-50,:where(html:not([data-theme="light"])) body .bg-amber-100,:where(html:not([data-theme="light"])) body .bg-yellow-50,:where(html:not([data-theme="light"])) body .bg-yellow-100{background:#3b321c} :where(html:not([data-theme="light"])) body .text-amber-600,:where(html:not([data-theme="light"])) body .text-amber-700,:where(html:not([data-theme="light"])) body .text-amber-800,:where(html:not([data-theme="light"])) body .text-yellow-700,:where(html:not([data-theme="light"])) body .text-yellow-800{color:#ffdc83} :where(html:not([data-theme="light"])) body .border-amber-200,:where(html:not([data-theme="light"])) body .border-yellow-200{border-color:#746139} /* Champs de formulaire, y compris connexion et inscription. */ :where(html:not([data-theme="light"])) body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="submit"]):not([type="button"]),:where(html:not([data-theme="light"])) body textarea,:where(html:not([data-theme="light"])) body select{background-color:var(--ev-field);color:var(--ev-text);border-color:var(--ev-border)} :where(html:not([data-theme="light"])) body input::placeholder,:where(html:not([data-theme="light"])) body textarea::placeholder{color:#a3a3b0;opacity:1} :where(html:not([data-theme="light"])) body input[type="checkbox"],:where(html:not([data-theme="light"])) body input[type="radio"],:where(html:not([data-theme="light"])) body input[type="range"]{accent-color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body .input-field:focus,:where(html:not([data-theme="light"])) body [class~="focus:border-brand-primary"]:focus{border-color:var(--ev-yellow);box-shadow:0 0 0 3px #ffe50024} :where(html:not([data-theme="light"])) body :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--ev-yellow);outline-offset:3px} :where(html:not([data-theme="light"])) body option{background:var(--ev-field);color:var(--ev-text)} :where(html:not([data-theme="light"])) body .login-card,:where(html:not([data-theme="light"])) body .register-card{border:1px solid var(--ev-border);box-shadow:0 20px 60px #0005} :where(html:not([data-theme="light"])) body .legal-content h2,:where(html:not([data-theme="light"])) body .legal-content h3{color:var(--ev-text)} :where(html:not([data-theme="light"])) body .legal-content p,:where(html:not([data-theme="light"])) body .legal-content ul,:where(html:not([data-theme="light"])) body .legal-content li{color:#c5c5cf} :where(html:not([data-theme="light"])) body .legal-content a{color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body [class~="ring-white"]{--tw-ring-color:var(--ev-panel)} :where(html:not([data-theme="light"])) body [class~="focus:ring-brand-primary"]{--tw-ring-color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body ::-webkit-scrollbar-track{background:#18181b} :where(html:not([data-theme="light"])) body ::-webkit-scrollbar-thumb{background:#555560} :where(html:not([data-theme="light"])) body ::-webkit-scrollbar-thumb:hover{background:var(--ev-pink)} /* Identité visuelle des logos et cartes de mise en avant. */ :where(html:not([data-theme="light"])) body header .to-brand-primary,:where(html:not([data-theme="light"])) body a[href="index.html"] .to-purple-600{background:var(--ev-yellow);color:#111113;box-shadow:none} :where(html:not([data-theme="light"])) body :is(button,a).from-pink-500,:where(html:not([data-theme="light"])) body :is(button,a).from-pink-600,:where(html:not([data-theme="light"])) body :is(button,a).from-purple-600{background:var(--ev-yellow);color:#111113;box-shadow:none} :where(html:not([data-theme="light"])) body .from-purple-500,:where(html:not([data-theme="light"])) body .from-pink-500,:where(html:not([data-theme="light"])) body .from-rose-500{--tw-gradient-from:#a71957;--tw-gradient-to:#ff1680} :where(html:not([data-theme="light"])) body .to-purple-600:not(.from-brand-primary){--tw-gradient-to:#572038} /* Compléments : récupération du compte, RGPD et composants dynamiques. */ :where(html:not([data-theme="light"])) body.gradient-bg .card{background:var(--ev-panel);color:var(--ev-text);border:1px solid var(--ev-border);backdrop-filter:none} :where(html:not([data-theme="light"])) body.gradient-bg h1 .text-pink-500{color:var(--ev-yellow)} :where(html:not([data-theme="light"])) body.gradient-bg :is(a,button).bg-pink-500{background:var(--ev-yellow);color:#111113} :where(html:not([data-theme="light"])) body.gradient-bg :is(a,button).bg-pink-500:hover{background:var(--ev-yellow-hover)} :where(html:not([data-theme="light"])) body .right-card{background:var(--ev-field);border-left-color:var(--ev-pink)} :where(html:not([data-theme="light"])) body .right-card h3{color:var(--ev-text)!important} :where(html:not([data-theme="light"])) body .text-blue-900{color:#b8d8ff} :where(html:not([data-theme="light"])) body .text-green-900,:where(html:not([data-theme="light"])) body .text-emerald-800{color:#a0e8be} :where(html:not([data-theme="light"])) body [class~="hover:bg-brand-primary"]:hover{background:var(--ev-yellow);color:#111113} :where(html:not([data-theme="light"])) body #radioWidgetMinimized{background:var(--ev-panel);border-color:var(--ev-border);backdrop-filter:none} :where(html:not([data-theme="light"])) body #radioFrame{background:#30212d} :where(html:not([data-theme="light"])) body #radioWidgetFloating .border-pink-100{border-color:var(--ev-border)} :where(html:not([data-theme="light"])) body #radioWidgetFloating .from-pink-50{background:var(--ev-field)} :where(html:not([data-theme="light"])) body #radioWidgetFloating #radioPlayBtn,:where(html:not([data-theme="light"])) body #radioWidgetFloating #radioMiniPlayIcon{color:#111113} :where(html:not([data-theme="light"])) body #toast{background:#25252b!important;color:var(--ev-text)!important;border:1px solid var(--ev-border)} /* Styles inline du composant existant : surcharge visuelle seulement. */ :where(html:not([data-theme="light"])) body #legalOverlay{background:#111113f5!important;backdrop-filter:none!important} :where(html:not([data-theme="light"])) body #legalOverlay>div{background:var(--ev-panel)!important;border:1px solid var(--ev-border);color:var(--ev-text)} :where(html:not([data-theme="light"])) body #legalOverlay>div>div:first-child{background:var(--ev-pink)!important} :where(html:not([data-theme="light"])) body #legalOverlay h1{color:var(--ev-text)!important} :where(html:not([data-theme="light"])) body #legalOverlay p,:where(html:not([data-theme="light"])) body #legalOverlay span{color:#cdccd5!important} :where(html:not([data-theme="light"])) body #legalOverlay label{background:var(--ev-field)!important} :where(html:not([data-theme="light"])) body #legalOverlay input{accent-color:var(--ev-yellow)!important} :where(html:not([data-theme="light"])) body #legalOverlay a{color:var(--ev-yellow)!important} :where(html:not([data-theme="light"])) body #legalOverlay>div>button{background:var(--ev-field)!important;color:#d1d1da!important} :where(html:not([data-theme="light"])) body #legalOverlay #acceptLegalBtn:not(:disabled){background:var(--ev-yellow)!important;color:#111113!important} :where(html:not([data-theme="light"])) body #legalOverlay #acceptLegalBtn:disabled{background:#37373f!important;color:#a6a6b1!important} :where(html:not([data-theme="light"])) body #legalOverlay>div>div:last-child{border-top-color:var(--ev-border)!important} @media(max-width:480px){body #legalOverlay>div{padding:22px!important}body #radioWidgetFloating{max-width:calc(100vw - 24px);right:12px!important}} /* Bannière responsive à images indépendantes du texte. */ .cam-banner .banner-slides{position:absolute;inset:0;z-index:-2;overflow:hidden} .cam-banner .banner-slide{position:absolute;width:100%;height:100%;object-fit:cover;object-position:var(--focal,65%) center;opacity:0;transition:opacity .8s ease} .cam-banner .banner-slide.is-active{opacity:1} .cam-banner.has-banner-slides .cam-banner-art{display:none} .cam-banner.has-banner-slides:after{background:linear-gradient(90deg,#100b12f5 0%,#100b12dc 32%,#100b1245 64%,#100b120a 100%)} .cam-banner .cam-banner-content{width:56%;max-width:620px;padding-bottom:42px} .banner-controls{position:absolute;bottom:12px;right:18px;display:flex;align-items:center;gap:14px} .banner-controls[hidden]{display:none} .banner-controls button{cursor:pointer;border:1px solid #ffffff65;background:#18181b;color:#fff;padding:5px 10px;border-radius:20px;font:600 11px Inter,Arial} .banner-dots{display:flex;gap:7px}.banner-dots button{padding:0;width:10px;height:10px;background:#777}.banner-dots button[aria-pressed="true"]{background:#ffe500;border-color:#ffe500} @media(max-width:700px){.cam-banner{min-height:390px}.cam-banner .cam-banner-content{width:100%;max-width:410px;padding:28px 22px 55px}.cam-banner .banner-slide{object-position:var(--mobile-focal,65%) center}.cam-banner.has-banner-slides:after{background:linear-gradient(90deg,#100b12ed,#100b1299 65%,#100b1244)}.cam-banner-trust{max-width:320px}} @media(prefers-reduced-motion:reduce){.cam-banner .banner-slide{transition:none}} /* Administration du décor, sans dépendance à Tailwind. */ .decor-page *{box-sizing:border-box}.decor-page{margin:0;background:#111113;color:#f5f5f7;font:15px/1.5 Inter,Arial,sans-serif}.decor-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 5%;border-bottom:1px solid #36363e;background:#19191d}.decor-header a{color:#d1d1da;text-decoration:none;font-size:13px}.decor-header span,.decor-eyebrow{color:#ffe500}.decor-main{max-width:1200px;padding:32px 24px 64px;margin:auto}.decor-main h1{font-size:32px;margin:4px 0 8px}.decor-eyebrow{font-size:12px;letter-spacing:2px;font-weight:bold}.decor-intro,.decor-panel p,.decor-save p{color:#b1b1bd}.decor-panel{padding:24px;border:1px solid #383840;border-radius:16px;background:#1c1c20;margin:24px 0}.decor-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.decor-panel h2{margin:0 0 12px;font-size:20px}.decor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.decor-card{background:#25252b;border:1px solid #414149;border-radius:12px;padding:14px;margin:12px 0}.decor-card h3{margin:0 0 10px}.decor-card>img{width:100%;height:120px;object-fit:cover;border-radius:8px;cursor:pointer}.decor-card label{display:block;margin:14px 0;font-size:12px}.decor-card input{width:100%;margin-top:8px}.decor-card-actions{display:flex;flex-wrap:wrap;gap:6px}.decor-page button{padding:10px 14px;border:1px solid #4b4b56;border-radius:9px;background:#303037;color:#fff;font:600 13px Inter,Arial;cursor:pointer}.decor-page button:disabled{opacity:.45;cursor:not-allowed}.decor-page #saveDecor,.decor-page #addBanner{background:#ffe500;border-color:#ffe500;color:#111113}.decor-page input[type=number]{display:block;margin-top:8px;padding:10px;width:120px;border:1px solid #555;border-radius:8px}.decor-error{color:#ff99b3}#decorStatus{min-height:24px}.decor-preview{position:relative;isolation:isolate;overflow:hidden;border-radius:14px;background:#30212d;min-height:280px;margin:auto}.decor-preview>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.decor-preview:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#100b12ed,#100b1230)}.decor-preview-copy{padding:30px;max-width:430px}.decor-preview-copy>strong{font-size:34px;line-height:1.1}.decor-preview-copy>strong span{color:#ffe500}.preview-cta{display:inline-block;padding:12px;background:#ffe500;color:#111113;font-weight:bold;border-radius:10px}.decor-preview.is-mobile{max-width:375px;min-height:390px}.decor-save{display:flex;align-items:center;gap:20px}.decor-save p{font-size:12px;max-width:400px} @media(max-width:800px){.decor-grid{grid-template-columns:1fr}.decor-header{flex-wrap:wrap}.decor-main{padding:24px 14px}.decor-panel{padding:18px}.decor-save,.decor-heading{align-items:flex-start;flex-direction:column}} /* ========================================================== THÈME CLAIR (html[data-theme="light"]) Le thème sombre ci-dessus ne s'applique pas dans ce cas : les pages reprennent leur apparence d'origine (Tailwind). On ajoute seulement ce que le thème sombre fournissait seul : fond de l'accueil, logo, couleur de marque rose. Le choix est commun à toutes les pages (theme.js, clé « evc-theme »). ========================================================== */ html[data-theme="light"]{color-scheme:light;background:#f1f5f9} html[data-theme="light"] body.cam-home{background:#f1f5f9;color:#1e293b} html[data-theme="light"] .cam-home .cam-logo{background:linear-gradient(135deg,#e91e63,#9c27b0);color:#fff;border:0;border-radius:11px} /* Couleur de marque : l'accueil la règle en jaune pour le thème sombre ; sur fond clair, on revient au rose */ html[data-theme="light"] .text-brand-primary,html[data-theme="light"] [class~="hover:text-brand-primary"]:hover{color:#e91e63} html[data-theme="light"] .border-brand-primary,html[data-theme="light"] [class~="focus:border-brand-primary"]:focus{border-color:#e91e63} html[data-theme="light"] .bg-brand-primary{background-color:#e91e63} html[data-theme="light"] [class~="hover:bg-brand-hover"]:hover{background-color:#d81b60} html[data-theme="light"] .from-brand-primary{--tw-gradient-from:#e91e63;--tw-gradient-to:rgb(233 30 99 / 0);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)} html[data-theme="light"] .accent-brand-primary{accent-color:#e91e63} /* Page « Décor » (sans Tailwind) */ html[data-theme="light"] .decor-page{background:#f2f3f6;color:#14161c} html[data-theme="light"] .decor-header{background:#fff;border-bottom-color:#dcdfe6} html[data-theme="light"] .decor-header a{color:#475569} html[data-theme="light"] .decor-header span,html[data-theme="light"] .decor-eyebrow{color:#c2185b} html[data-theme="light"] .decor-intro,html[data-theme="light"] .decor-panel p,html[data-theme="light"] .decor-save p{color:#6a7282} html[data-theme="light"] .decor-panel{background:#fff;border-color:#dcdfe6} html[data-theme="light"] .decor-card{background:#eef0f4;border-color:#dcdfe6} html[data-theme="light"] .decor-page button{background:#eef0f4;border-color:#cfd3dc;color:#14161c} html[data-theme="light"] .decor-page #saveDecor,html[data-theme="light"] .decor-page #addBanner{background:#ffe500;border-color:#ffe500;color:#111113} html[data-theme="light"] .decor-page input[type=number]{background:#fff;border-color:#bbb;color:#14161c} html[data-theme="light"] .decor-error{color:#c2185b} /* ========================================================== CORRECTIFS D'AFFICHAGE — THÈME SOMBRE (2026-10-03) Styles écrits en clair directement dans certaines pages (cartes, encadrés, tableaux) qui restaient blancs. ========================================================== */ /* Bande claire en bas des pages longues : le gardait bg-slate-100 */ html:not([data-theme="light"]).bg-slate-100{background:var(--ev-bg)} /* Texte en gras des pages légales (« 48 heures », « DPO : »…) */ :where(html:not([data-theme="light"])) body .legal-content strong{color:var(--ev-text)} :where(html:not([data-theme="light"])) body .legal-content code{background:var(--ev-field);color:#ff8ab8} /* Cartes de la page Contact */ :where(html:not([data-theme="light"])) body .contact-card{background:var(--ev-field);border-left-color:var(--ev-pink);color:var(--ev-text)} :where(html:not([data-theme="light"])) body .contact-card:hover{box-shadow:0 8px 20px #0006} :where(html:not([data-theme="light"])) body .contact-card h3{color:var(--ev-text)} :where(html:not([data-theme="light"])) body .contact-card p,:where(html:not([data-theme="light"])) body .contact-card ul,:where(html:not([data-theme="light"])) body .contact-card li{color:#c5c5cf} /* Encadrés des CGU */ :where(html:not([data-theme="light"])) body .info-box{background:#3b321c;color:#f3e6c2} :where(html:not([data-theme="light"])) body .danger-box{background:#3b2025;color:#f6d0d5} /* Tableaux (page Cookies) */ :where(html:not([data-theme="light"])) body .legal-content th{background:var(--ev-field);color:var(--ev-text)} :where(html:not([data-theme="light"])) body .legal-content :is(th,td){border-bottom-color:var(--ev-border)} /* Messagerie */ :where(html:not([data-theme="light"])) body .msg-bubble-received{background:var(--ev-field);color:var(--ev-text)} :where(html:not([data-theme="light"])) body .conv-item:hover{background:var(--ev-hover)} :where(html:not([data-theme="light"])) body .conv-item.active{background:#382333;border-left-color:var(--ev-pink)} /* Questions fréquentes repliables */ :where(html:not([data-theme="light"])) body details summary{color:var(--ev-text)} /* ========================================================== PIED DE PAGE COMMUN (footer.js) — identique sur toutes les pages ========================================================== */ .ev-footer{--f-bg:#18181b;--f-border:#3b3b43;--f-text:#f5f5f7;--f-muted:#b1b1bd;--f-accent:#ffe500; align-self:stretch;width:100%;margin-top:3rem;background:var(--f-bg);border-top:1px solid var(--f-border);color:var(--f-muted);font:14px/1.6 Inter,Arial,sans-serif;text-align:left} html[data-theme="light"] .ev-footer{--f-bg:#fff;--f-border:#e2e8f0;--f-text:#0f172a;--f-muted:#64748b;--f-accent:#e91e63} .ev-footer *{box-sizing:border-box} .ev-footer-inner{max-width:1200px;margin:0 auto;padding:40px 24px 28px;display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px} .ev-footer-brand{display:flex;align-items:center;gap:10px;color:var(--f-text);font-weight:900;font-size:20px;text-decoration:none} .ev-footer-logo{width:34px;height:34px;border-radius:10px;background:#ffe500;color:#111113;display:flex;align-items:center;justify-content:center} html[data-theme="light"] .ev-footer-logo{background:linear-gradient(135deg,#e91e63,#9c27b0);color:#fff} .ev-footer-logo svg{width:18px;height:18px;fill:currentColor} .ev-footer-name{color:var(--f-text)}.ev-footer-name span{color:var(--f-accent)} .ev-footer p{margin:12px 0 0;font-size:13px;max-width:320px} .ev-footer-age{display:inline-block;margin-top:12px;padding:2px 10px;border:1px solid var(--f-border);border-radius:999px;font-size:12px;font-weight:700;color:var(--f-text)} .ev-footer h2{margin:0 0 12px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--f-text)} .ev-footer ul{list-style:none;margin:0;padding:0} .ev-footer li{margin:0 0 8px} .ev-footer a{color:var(--f-muted);text-decoration:none;word-break:break-word} .ev-footer a:hover,.ev-footer a[aria-current="page"]{color:var(--f-accent)} .ev-footer a[aria-current="page"]{font-weight:700} .ev-footer a:focus-visible{outline:2px solid var(--f-accent);outline-offset:3px;border-radius:2px} .ev-footer-bottom{border-top:1px solid var(--f-border)} .ev-footer-bottom>div{max-width:1200px;margin:0 auto;padding:16px 24px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:12px} @media(max-width:900px){.ev-footer-inner{grid-template-columns:1fr 1fr}} @media(max-width:560px){.ev-footer-inner{grid-template-columns:1fr;padding:32px 16px 20px;gap:24px}.ev-footer-bottom>div{padding:14px 16px;flex-direction:column}} /* ========================================================== PLATINE RADIO E-VISIOCAM (accueil + widget flottant) Noir, jaune et rose, comme le reste du site ; même rendu en thème clair et sombre (c'est un appareil). ========================================================== */ .evc-deck{--d-bg:#1c1c20;--d-panel:#25252b;--d-border:#36363e;--d-text:#f5f5f7;--d-muted:#a6a6b1;--d-yellow:#ffe500;--d-pink:#ff1680; position:relative;padding:16px;border-radius:18px;color:var(--d-text);font-family:Inter,Arial,sans-serif; background:linear-gradient(160deg,#232328 0%,#1a1a1e 55%,#141417 100%);border:1px solid var(--d-border); box-shadow:0 14px 34px #0006,inset 0 1px 0 #ffffff0f} .evc-deck *{box-sizing:border-box} .evc-deck-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--d-border)} .evc-deck-brand{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase} .evc-deck-brand b{color:var(--d-yellow);font-weight:900} .evc-deck-brand i{width:8px;height:8px;border-radius:50%;background:var(--d-yellow);box-shadow:0 0 8px #ffe50099} .evc-deck-tag{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:800;letter-spacing:.12em;color:var(--d-muted)} .evc-deck-tag>i{width:6px;height:6px;border-radius:50%;background:var(--d-pink);box-shadow:0 0 8px var(--d-pink)} .evc-deck-tag button{margin-left:4px;padding:2px 4px;border:0;background:none;color:var(--d-muted);cursor:pointer} .evc-deck-tag button:hover{color:var(--d-yellow)} /* Plateau */ .evc-deck-platter{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;display:flex;align-items:center;justify-content:center;margin-bottom:12px; background:radial-gradient(circle at 50% 50%,#2b1622 0%,#17121a 55%,#0c0b0e 100%);box-shadow:inset 0 0 30px #000c,inset 0 0 0 1px #ffffff0d} .evc-deck-platter:before{content:"";position:absolute;inset:6px;border-radius:50%;border:1px dashed #ff168040} .evc-deck-vinyl{position:relative;width:82%;height:82%;border-radius:50%; background:repeating-radial-gradient(circle at 50% 50%,#0b0b0d 0 2px,#17171b 3px 4px,#0b0b0d 5px 6px); box-shadow:0 0 0 2px #ff168026,0 0 24px #ff168033,0 0 20px #000e,inset 0 0 30px #0008} .evc-deck-platter:after{content:"";position:absolute;top:9%;left:9%;width:82%;height:82%;border-radius:50%;pointer-events:none;z-index:2;background:conic-gradient(from 20deg,#ffffff00 0deg,#ffffff14 40deg,#ffffff00 80deg,#ffffff00 180deg,#ffffff10 220deg,#ffffff00 260deg)} .evc-deck-label{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:38%;height:38%;border-radius:50%;display:flex;align-items:center;justify-content:center; background:radial-gradient(circle at 35% 30%,#ff5aa6 0%,#ff1680 45%,#a71957 100%);box-shadow:0 0 14px #ff168066;color:#fff;font-size:1.4rem;z-index:1} .evc-deck-spindle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:radial-gradient(circle,#ffe500 0%,#b9a200 100%);z-index:2} /* Bras de lecture : rotation pilotée par radio-widget.js */ /* Bras de lecture : pivot en bas à droite, le bras remonte vers le disque. Le disque tourne dans le sens horaire : sous la pointe (côté droit), le sillon arrive DEVANT la pointe. Repos : rotate(2deg), à côté du disque. Lecture : rotate(-22deg), la pointe posée sur le sillon. */ .evc-deck-arm{position:absolute;top:8%;right:8%;width:4px;height:58%;margin-right:-2px;border-radius:2px;transform-origin:50% 0;transform:rotate(0deg);transition:transform 1.2s ease; background:linear-gradient(180deg,#cfcfd6 0%,#8c8c96 50%,#55555e 100%);box-shadow:2px 2px 4px #0008;z-index:3} .evc-deck-arm:before{content:"";position:absolute;top:-9px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#9a9aa4,#3a3a42 70%);border:1px solid #5a5a63;box-shadow:0 2px 5px #0009} .evc-deck-weight{position:absolute;top:-24px;left:50%;width:12px;height:12px;margin-left:-6px;border-radius:3px;background:linear-gradient(145deg,#4a4a52,#1f1f24);border:1px solid #5a5a63} .evc-deck-headshell{position:absolute;bottom:-14px;left:50%;width:12px;height:18px;margin-left:-6px;transform-origin:50% 0;transform:rotate(22deg);border-radius:2px 2px 3px 3px;background:linear-gradient(180deg,#2c2c32,#141417);box-shadow:0 2px 4px #0009} .evc-deck-headshell:after{content:"";position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);width:3px;height:6px;border-radius:0 0 2px 2px;background:var(--d-yellow)} .evc-deck-adapter{position:absolute;top:12px;left:12px;width:11px;height:11px;border-radius:50%;background:radial-gradient(circle,#5a5a63,#26262b)} .evc-deck-onair{position:absolute;bottom:9px;right:10px;display:flex;align-items:center;gap:5px;font-size:8px;font-weight:800;letter-spacing:.12em;color:var(--d-muted)} .evc-deck-onair i{width:6px;height:6px;border-radius:50%;background:var(--d-pink);box-shadow:0 0 6px var(--d-pink);animation:pulse 1.5s infinite} /* Contrôles */ .evc-deck-controls{display:grid;gap:10px} .evc-deck-row{display:flex;align-items:center;justify-content:space-between;gap:8px} .evc-deck-play{flex:none;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;border:0;cursor:pointer; background:var(--d-yellow);color:#111113;font-size:14px;box-shadow:0 4px 14px #ffe50040;transition:transform .15s,background .15s} .evc-deck-play:hover{background:#fff04a} .evc-deck-play:active,.evc-deck-btn:active{transform:scale(.94)} .evc-deck-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:9px;cursor:pointer; background:var(--d-panel);border:1px solid var(--d-border);color:var(--d-text);font-size:10px;transition:border-color .15s,color .15s} .evc-deck-btn:hover{border-color:var(--d-yellow);color:var(--d-yellow)} .evc-deck :is(button):focus-visible{outline:2px solid var(--d-yellow);outline-offset:2px} .evc-deck-volume{flex:1;min-width:40px;height:4px;accent-color:var(--d-yellow);cursor:pointer} .evc-deck-group{display:flex;align-items:center;gap:5px} .evc-deck-speed{display:flex;border-radius:8px;overflow:hidden;background:#111113;border:1px solid var(--d-border);font-size:8px;font-weight:900} .evc-deck-speed span{padding:3px 6px;color:#6b6b75} .evc-deck-speed span:first-child{color:#111113;background:var(--d-yellow)} .evc-deck-status{display:flex;align-items:center;gap:6px;font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--d-muted);text-transform:uppercase} .evc-deck-status i{width:6px;height:6px;border-radius:50%;background:var(--d-pink);box-shadow:0 0 6px var(--d-pink)} .evc-deck-display{padding:7px 10px;border-radius:10px;background:#0c0c0e;border:1px solid var(--d-border);box-shadow:inset 0 2px 6px #000c; font:700 10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;color:var(--d-yellow);text-shadow:0 0 6px #ffe50080;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #radioVinyl.spinning{animation:vinylSpin 1.8s linear infinite;animation-direction:normal} @keyframes vinylSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}} /* angle croissant = sens des aiguilles d'une montre */ @media(prefers-reduced-motion:reduce){#radioVinyl.spinning{animation-duration:12s}.evc-deck-arm{transition:none}} /* Version flottante (pages sans barre latérale) */ .evc-deck--compact{width:252px;padding:12px} .evc-deck--compact .evc-deck-head{margin-bottom:9px;padding-bottom:8px} .evc-deck--compact .evc-deck-platter{margin-bottom:9px} .evc-deck--compact .evc-deck-label{font-size:1.05rem} .evc-deck--compact .evc-deck-controls{gap:7px} .evc-deck--compact .evc-deck-play{width:38px;height:38px;font-size:12px} .evc-deck--compact .evc-deck-btn{width:26px;height:26px} /* Pastille réduite du widget flottant */ :where(html:not([data-theme="light"])) body #radioWidgetMinimized{background:#1c1c20;border:1px solid #36363e} #radioWidgetMinimized .bg-brand-primary{background:#ffe500;color:#111113} /* ========================================================== ACCUEIL — maquette « Votre salon. Vos rencontres. » ========================================================== */ .cam-home{--h-panel:#1c1c20;--h-border:#2f2f36;--h-text:#f5f5f7;--h-muted:#b1b1bd;--h-yellow:#ffe500;--h-pink:#ff1680;--h-btn-text:#111113} html[data-theme="light"] .cam-home{--h-panel:#fff;--h-border:#e2e8f0;--h-text:#0f172a;--h-muted:#64748b;--h-yellow:#e91e63;--h-pink:#e91e63;--h-btn-text:#fff} /* Bannière */ .cam-banner-art{background-image:url("img/hero-neon.webp"),linear-gradient(115deg,#141416 0%,#111113 45%,#1c1218 100%);background-size:auto 100%,cover;background-position:right center,center;background-repeat:no-repeat} .cam-banner:after{background:linear-gradient(90deg,#0d0b0e 0%,#0d0b0e 34%,rgba(13,11,14,.85) 44%,rgba(13,11,14,0) 62%)} .cam-banner h1{font-size:clamp(32px,3.6vw,54px);font-weight:900;letter-spacing:-1.5px;line-height:1} .cam-banner p{font-size:15px;color:#e4e1e4;max-width:440px;margin:14px 0 22px} .cam-banner-actions{display:flex;flex-wrap:wrap;gap:12px} .cam-banner-cta{font-size:14px;padding:13px 22px;border:1px solid #ffe500;cursor:pointer;font-family:inherit} .cam-banner-cta i{font-size:15px} .cam-banner-cta--ghost{background:transparent;color:#fff;border-color:#ffffffb3;box-shadow:none} .cam-banner-cta--ghost:hover{background:#ffffff14;border-color:#fff} .cam-banner .cam-banner-content{padding-bottom:30px} @media(max-width:700px){.cam-banner-art{background-size:auto 100%,cover;background-position:62% center,center}.cam-banner h1{font-size:34px}.cam-banner-cta{padding:12px 16px;font-size:13px}} /* Bandeau « Le direct commence avec vous » */ .ev-live{display:flex;align-items:center;gap:20px;padding:20px 24px;border-radius:18px;background:var(--h-panel);border:1px solid var(--h-border);color:var(--h-text)} .ev-live-icon{flex:none;width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid var(--h-border);background:#ffffff08;color:var(--h-text);font-size:22px} .ev-live.is-live .ev-live-icon{color:var(--h-pink);border-color:var(--h-pink);box-shadow:0 0 18px #ff168040} .ev-live-text{flex:1;min-width:0} .ev-live h2{margin:0;font-size:19px;font-weight:800;letter-spacing:-.3px} .ev-live p{margin:4px 0 0;font-size:14px;color:var(--h-muted)} .ev-btn-ghost{flex:none;display:inline-flex;align-items:center;gap:10px;padding:11px 20px;border-radius:12px;border:1px solid var(--h-text);background:transparent;color:var(--h-text);font:700 13px Inter,Arial,sans-serif;cursor:pointer;transition:border-color .15s,color .15s} .ev-btn-ghost:hover{border-color:var(--h-yellow);color:var(--h-yellow)} @media(max-width:700px){.ev-live{flex-wrap:wrap;padding:18px}.ev-live-icon{width:48px;height:48px;font-size:18px}.ev-btn-ghost{width:100%;justify-content:center}} /* Titre de section */ .ev-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:8px 0 16px} .ev-section-head h2{margin:0;font-size:clamp(22px,2.2vw,30px);font-weight:900;letter-spacing:-.6px;color:var(--h-text)} .ev-section-head a{flex:none;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--h-yellow);text-decoration:none} .ev-section-head a:hover{text-decoration:underline} /* Cartes ambiance */ .ev-ambiances{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px} .ev-ambiance{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:18px;background:#121214;border:1px solid var(--h-border);color:#fff;isolation:isolate;transition:transform .2s,box-shadow .2s} .ev-ambiance:hover{transform:translateY(-3px);box-shadow:0 14px 34px #0006} .ev-ambiance img{display:block;width:100%;aspect-ratio:557/211;height:auto;object-fit:cover} .ev-ambiance:after{content:"";position:absolute;inset:0;z-index:-1} .ev-ambiance-body{position:relative;flex:1;display:flex;flex-direction:column;margin-top:-56px;padding:0 24px 24px;background:linear-gradient(180deg,#12121400 0,#121214e6 56px,#121214 90px)} .ev-ambiance h3{margin:0;font-size:22px;font-weight:800;letter-spacing:-.4px;text-shadow:0 2px 12px #000} .ev-ambiance p{flex:1;margin:6px 0 16px;font-size:14px;line-height:1.5;color:#d6d3d8} .ev-btn{align-self:flex-start;display:inline-flex;align-items:center;gap:10px;padding:11px 22px;border-radius:11px;background:#ffe500;color:#111113;font:800 14px Inter,Arial,sans-serif;text-decoration:none;transition:background .15s} .ev-btn:hover{background:#fff04a} /* Bouton jaune « brillant » (thème sombre) : reflet en haut, double liseré doré, halo lumineux. Le liseré est une ombre intérieure (pas une bordure) : les boutons gardent exactement leur taille. */ :root{ --btn-brillant-fond: linear-gradient(180deg, rgba(255,255,255,.62) 0%, rgba(255,255,255,.14) 46%, rgba(255,255,255,0) 50%), linear-gradient(180deg, #fff06a 0%, #ffd600 52%, #f2b300 100%); --btn-brillant-fond-survol: linear-gradient(180deg, rgba(255,255,255,.7) 0%, rgba(255,255,255,.18) 46%, rgba(255,255,255,0) 50%), linear-gradient(180deg, #fff27a 0%, #ffdc1a 52%, #f5bb00 100%); --btn-brillant-ombre: inset 0 0 0 2px #ffd21a, inset 0 0 0 3.5px rgba(122,74,0,.5), inset 0 -5px 9px rgba(196,118,0,.35), 0 0 12px rgba(255,214,0,.55), 0 0 26px rgba(255,186,0,.22); --btn-brillant-ombre-survol: inset 0 0 0 2px #ffe04a, inset 0 0 0 3.5px rgba(122,74,0,.5), inset 0 -5px 9px rgba(196,118,0,.3), 0 0 16px rgba(255,214,0,.75), 0 0 34px rgba(255,186,0,.32); } .ev-btn{ background:var(--btn-brillant-fond); box-shadow:var(--btn-brillant-ombre); text-shadow:0 1px 0 rgba(255,255,255,.35); transition:box-shadow .15s, filter .15s, transform .15s; } .ev-btn:hover{background:var(--btn-brillant-fond-survol);box-shadow:var(--btn-brillant-ombre-survol);transform:translateY(-1px)} .ev-btn:active{transform:translateY(0);filter:brightness(.97)} .ev-btn:focus-visible,.ev-btn-ghost:focus-visible,.ev-section-head a:focus-visible{outline:2px solid var(--h-yellow);outline-offset:3px} @media(max-width:1100px){.ev-ambiances{grid-template-columns:1fr 1fr}.ev-ambiance:last-child{grid-column:1/-1}} @media(max-width:640px){.ev-ambiances{grid-template-columns:1fr}.ev-ambiance:last-child{grid-column:auto}} @media(prefers-reduced-motion:reduce){.ev-ambiance{transition:none}.ev-ambiance:hover{transform:none}} /* « À chacun sa façon de participer » */ .ev-features{padding:22px 24px;border-radius:18px;background:var(--h-panel);border:1px solid var(--h-border);color:var(--h-text)} .ev-features h2{margin:0 0 16px;font-size:20px;font-weight:800;letter-spacing:-.3px} .ev-features ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none} .ev-features li{display:flex;align-items:flex-start;gap:16px;padding:0 22px;border-left:1px solid var(--h-border)} .ev-features li:first-child{padding-left:0;border-left:0} .ev-features li>i{flex:none;width:44px;text-align:center;font-size:30px;color:var(--h-pink);margin-top:2px} .ev-features h3{margin:0;font-size:15px;font-weight:800} .ev-features p{margin:4px 0 0;font-size:13px;line-height:1.5;color:var(--h-muted)} @media(max-width:900px){.ev-features ul{grid-template-columns:1fr;gap:16px}.ev-features li{padding:0;border-left:0}} /* En-tête sur petit téléphone : tout tient sur la largeur de l'écran */ @media(max-width:480px){ .cam-home .cam-header>div{gap:6px;padding-left:10px;padding-right:10px} .cam-home .cam-header>div>div:first-child span{font-size:16px;white-space:nowrap} .cam-home .cam-header .ml-auto{gap:2px} .cam-home .cam-header [data-theme-toggle],.cam-home .cam-header [data-nav-bell]{padding:6px} .cam-home #navAuth a{padding:7px 9px!important;font-size:12px} .cam-home .cam-header button[onclick="toggleMobileSidebar()"]{padding:6px} } @media(max-width:430px){.cam-home .cam-header>div>div:first-child a>span{display:none}} /* ========================================================== THÈME CLAIR — accueil harmonisé (bannière, cartes, radio) Les visuels restent, mais le texte passe sur fond clair : plus de gros blocs noirs au milieu d'une page blanche. ========================================================== */ /* Bannière : voile blanc à gauche, l'image néon se fond à droite */ html[data-theme="light"] .cam-banner{background:#fff;color:#0f172a;border-color:#e2e8f0;box-shadow:0 10px 30px #0f172a14} html[data-theme="light"] .cam-banner:after, html[data-theme="light"] .cam-banner.has-banner-slides:after{background:linear-gradient(90deg,#fff 0%,#fff 33%,rgba(255,255,255,.82) 45%,rgba(255,255,255,0) 66%)} html[data-theme="light"] .cam-banner h1{color:#0f172a} html[data-theme="light"] .cam-banner h1 span{color:#e91e63} html[data-theme="light"] .cam-banner p{color:#475569} html[data-theme="light"] .cam-banner-cta{background:#e91e63;border-color:#e91e63;color:#fff;box-shadow:0 6px 18px #e91e6340} html[data-theme="light"] .cam-banner-cta:hover{background:#d81b60;border-color:#d81b60} html[data-theme="light"] .cam-banner-cta--ghost{background:#fff;color:#0f172a;border-color:#cbd5e1;box-shadow:none} html[data-theme="light"] .cam-banner-cta--ghost:hover{background:#fdf2f8;border-color:#e91e63;color:#e91e63} html[data-theme="light"] .banner-controls button{background:#fff;color:#0f172a;border-color:#cbd5e1} html[data-theme="light"] .banner-dots button{background:#cbd5e1} html[data-theme="light"] .banner-dots button[aria-pressed="true"]{background:#e91e63;border-color:#e91e63} @media(max-width:700px){html[data-theme="light"] .cam-banner:after,html[data-theme="light"] .cam-banner.has-banner-slides:after{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 45%,rgba(255,255,255,.55) 100%)}} /* Cartes ambiance : image en haut, texte sur fond blanc */ html[data-theme="light"] .ev-ambiance{background:#fff;color:#0f172a;border-color:#e2e8f0;box-shadow:0 6px 20px #0f172a0f} html[data-theme="light"] .ev-ambiance:hover{box-shadow:0 14px 30px #0f172a1f} html[data-theme="light"] .ev-ambiance-body{margin-top:0;padding-top:18px;background:#fff} html[data-theme="light"] .ev-ambiance h3{text-shadow:none} html[data-theme="light"] .ev-ambiance p{color:#475569} html[data-theme="light"] .ev-btn{background:#e91e63;color:#fff;border-color:#e91e63;box-shadow:none;text-shadow:none} html[data-theme="light"] .ev-btn:hover{background:#d81b60;box-shadow:none} /* Bandeau direct */ html[data-theme="light"] .ev-live-icon{background:#fdf2f8;border-color:#fbcfe8;color:#e91e63} /* Platine radio : boîtier clair, plateau et vinyle restent sombres */ html[data-theme="light"] .evc-deck{--d-panel:#f1f5f9;--d-border:#e2e8f0;--d-text:#0f172a;--d-muted:#64748b;--d-yellow:#e91e63; background:linear-gradient(160deg,#ffffff 0%,#f8fafc 60%,#f1f5f9 100%);box-shadow:0 10px 26px #0f172a1a,inset 0 1px 0 #fff} html[data-theme="light"] .evc-deck-brand i{box-shadow:0 0 8px #e91e6366} html[data-theme="light"] .evc-deck-play{color:#fff;box-shadow:0 4px 14px #e91e6340} html[data-theme="light"] .evc-deck-play:hover{background:#d81b60} html[data-theme="light"] .evc-deck-speed{background:#e2e8f0} html[data-theme="light"] .evc-deck-speed span{color:#94a3b8} html[data-theme="light"] .evc-deck-speed span:first-child{color:#fff} html[data-theme="light"] .evc-deck-display{background:#fff;box-shadow:inset 0 1px 3px #0f172a14;text-shadow:none} html[data-theme="light"] .evc-deck-headshell:after,html[data-theme="light"] .evc-deck-spindle{background:#ffe500} /* Bouton « Inscription » de l'en-tête : couleur pleine (le dégradé s'effaçait en thème clair) */ html[data-theme="light"] #navAuth a[href*="register"]{background:#e91e63;background-image:none;color:#fff} html[data-theme="light"] #navAuth a[href*="register"]:hover{background:#d81b60} html[data-theme="light"] #radioWidgetMinimized .bg-brand-primary{background:#e91e63;color:#fff} .ev-vip{display:inline-block;vertical-align:middle;margin-left:6px;padding:2px 8px;border-radius:999px;background:#ffe500;color:#111113;font-size:11px;font-weight:900;letter-spacing:.05em;text-shadow:none} html[data-theme="light"] .ev-vip{background:#e91e63;color:#fff} /* Cartes ambiance : même mise en page en sombre qu'en clair — image entière en haut, texte en dessous (plus de texte posé sur l'image). */ .ev-ambiance{background:var(--h-panel)} .ev-ambiance-body{margin-top:0;padding-top:18px;background:var(--h-panel)} .ev-ambiance h3{text-shadow:none} /* Icônes des titres de section (chat, live, admin) : rose de la marque, comme sur l'accueil */ .ev-ico{color:#ff1680;margin-right:2px} html[data-theme="light"] .ev-ico{color:#e91e63} /* Cœur des favoris */ .ev-fav{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:36px;height:36px;padding:0 10px;border-radius:999px;border:1px solid #ffffff33;background:#11111399;color:#fff;font:700 12px Inter,Arial,sans-serif;cursor:pointer;backdrop-filter:blur(4px);transition:transform .15s,color .15s,border-color .15s} .ev-fav:hover{transform:scale(1.06);border-color:#ff1680} .ev-fav.is-fav{color:#ff1680;border-color:#ff1680} .ev-fav:focus-visible{outline:2px solid #ffe500;outline-offset:2px} html[data-theme="light"] .ev-fav{background:#ffffffd9;color:#0f172a;border-color:#e2e8f0} html[data-theme="light"] .ev-fav.is-fav{color:#e91e63;border-color:#e91e63} /* Suggestions de la recherche (en-tête) */ .ev-suggest{position:absolute;top:calc(100% + 6px);left:0;right:0;min-width:260px;z-index:60;padding:6px;border-radius:14px;background:#1c1c20;border:1px solid #3b3b43;box-shadow:0 16px 40px #0008;font-family:Inter,Arial,sans-serif} .ev-suggest[hidden]{display:none} .ev-suggest a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;color:#f5f5f7;text-decoration:none;font-size:13px} .ev-suggest a:hover,.ev-suggest a.is-active{background:#2a2a31} .ev-suggest-ico{flex:none;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#ff168026;color:#ff1680;font-weight:900} .ev-suggest-txt{display:flex;flex-direction:column;min-width:0} .ev-suggest-txt b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ev-suggest-txt small{color:#a6a6b1;font-size:11px} .ev-suggest a.ev-suggest-all{justify-content:center;color:#ffe500;font-weight:700;font-size:12px;border-top:1px solid #3b3b43;border-radius:0 0 10px 10px;margin-top:4px} html[data-theme="light"] .ev-suggest{background:#fff;border-color:#e2e8f0;box-shadow:0 16px 40px #0f172a26} html[data-theme="light"] .ev-suggest a{color:#0f172a} html[data-theme="light"] .ev-suggest a:hover,html[data-theme="light"] .ev-suggest a.is-active{background:#f1f5f9} html[data-theme="light"] .ev-suggest-ico{background:#fdf2f8;color:#e91e63} html[data-theme="light"] .ev-suggest-txt small{color:#64748b} html[data-theme="light"] .ev-suggest a.ev-suggest-all{color:#e91e63;border-top-color:#e2e8f0} /* Barre de navigation mobile (mobile-nav.js) */ .ev-mnav{display:none} @media(max-width:1023px){ .ev-mnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:70; padding:6px 4px calc(6px + env(safe-area-inset-bottom));background:#18181bf2;border-top:1px solid #3b3b43;backdrop-filter:blur(8px)} .ev-mnav a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:4px 0;color:#a6a6b1;text-decoration:none;font:600 10px Inter,Arial,sans-serif} .ev-mnav svg{width:22px;height:22px;fill:currentColor} .ev-mnav a[aria-current="page"]{color:#ffe500} .ev-mnav a:focus-visible{outline:2px solid #ffe500;outline-offset:-2px;border-radius:8px} body.has-mnav{padding-bottom:calc(64px + env(safe-area-inset-bottom))} body.has-mnav #radioWidgetFloating{bottom:calc(76px + env(safe-area-inset-bottom))!important} body.has-mnav #toast,body.has-mnav #evisio-toast{bottom:calc(80px + env(safe-area-inset-bottom))!important} html[data-theme="light"] .ev-mnav{background:#fffffff2;border-top-color:#e2e8f0} html[data-theme="light"] .ev-mnav a{color:#64748b} html[data-theme="light"] .ev-mnav a[aria-current="page"]{color:#e91e63} } /* Alerte « un modèle suivi est en direct » (nav-auth.js) */ .ev-live-alert{position:fixed;left:16px;bottom:20px;z-index:80;display:flex;align-items:center;gap:12px;max-width:min(380px,calc(100vw - 32px));padding:12px 14px;border-radius:14px; background:#1c1c20;border:1px solid #ff168066;color:#f5f5f7;box-shadow:0 14px 34px #0008;font:500 13px Inter,Arial,sans-serif;animation:fadeIn .3s ease-out} .ev-live-alert small{display:block;color:#a6a6b1;font-size:11px} .ev-live-alert a{margin-left:auto;padding:7px 12px;border-radius:10px;background:#ffe500;color:#111113;font-weight:800;text-decoration:none;white-space:nowrap} .ev-live-alert button{border:0;background:none;color:#a6a6b1;font-size:18px;cursor:pointer;padding:0 2px} .ev-live-dot{flex:none;width:10px;height:10px;border-radius:50%;background:#ff1680;box-shadow:0 0 10px #ff1680;animation:pulse 1.5s infinite} body.has-mnav .ev-live-alert{bottom:calc(80px + env(safe-area-inset-bottom))} html[data-theme="light"] .ev-live-alert{background:#fff;color:#0f172a;border-color:#fbcfe8;box-shadow:0 14px 34px #0f172a26} html[data-theme="light"] .ev-live-alert a{background:#e91e63;color:#fff} /* En-tête des pages intérieures sur petit téléphone : tout tient sur une ligne */ @media(max-width:480px){ body:not(.cam-home)>header.sticky>div{gap:6px;padding-left:10px;padding-right:10px} body:not(.cam-home)>header.sticky .text-2xl{font-size:16px;white-space:nowrap} body:not(.cam-home) #navAuth a{padding:7px 9px!important;font-size:12px} } @media(max-width:430px){body:not(.cam-home)>header.sticky>div>div:first-child a>span{display:none}} /* Accueil : invitation + guides */ .ev-invite{margin-top:16px} .ev-invite-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px} .ev-invite p{margin:0 0 14px;color:var(--h-muted,inherit);line-height:1.6;font-size:14px} .ev-invite .ev-btn{display:inline-flex;align-items:center;gap:8px} .ev-invite .ev-guides{display:block!important;margin:0;padding:0;list-style:none} .ev-invite .ev-guides li{display:block!important;padding:6px 0!important;border:0!important} .ev-invite .ev-guides a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:3px} @media (max-width:760px){.ev-invite-grid{grid-template-columns:1fr}} /* ---------- Style brillant étendu aux autres boutons jaunes du site (thème sombre) ---------- */ /* Placé en fin de fichier : il passe après les règles d'origine, à sélecteur égal */ :where(html:not([data-theme="light"])) .cam-banner-cta:not(.cam-banner-cta--ghost), :where(html:not([data-theme="light"])) .cam-home .cam-go-live, :where(html:not([data-theme="light"])) .cam-home #navAuth a.bg-brand-primary, :where(html:not([data-theme="light"])) .cam-home #navAuth a[href*="register"], :where(html:not([data-theme="light"])) body :is(button,a):is(.from-pink-500,.from-pink-600,.from-purple-600), :where(html:not([data-theme="light"])) body.gradient-bg :is(a,button).bg-pink-500, :where(html:not([data-theme="light"])) .decor-page #saveDecor, :where(html:not([data-theme="light"])) .decor-page #addBanner{ background:var(--btn-brillant-fond);border-color:transparent;box-shadow:var(--btn-brillant-ombre); text-shadow:0 1px 0 rgba(255,255,255,.35);transition:box-shadow .15s, filter .15s, transform .15s} :where(html:not([data-theme="light"])) .cam-banner-cta:not(.cam-banner-cta--ghost):hover, :where(html:not([data-theme="light"])) .cam-home .cam-go-live:hover, :where(html:not([data-theme="light"])) .cam-home #navAuth a.bg-brand-primary:hover, :where(html:not([data-theme="light"])) .cam-home #navAuth a[href*="register"]:hover, :where(html:not([data-theme="light"])) body :is(button,a):is(.from-pink-500,.from-pink-600,.from-purple-600):hover:not(:disabled), :where(html:not([data-theme="light"])) body.gradient-bg :is(a,button).bg-pink-500:hover, :where(html:not([data-theme="light"])) .decor-page #saveDecor:hover:not(:disabled), :where(html:not([data-theme="light"])) .decor-page #addBanner:hover{ background:var(--btn-brillant-fond-survol);box-shadow:var(--btn-brillant-ombre-survol);transform:translateY(-1px)} /* Bandeau légal : la règle d'origine est en !important (le bouton a un style écrit dans le HTML) */ :where(html:not([data-theme="light"])) body #legalOverlay #acceptLegalBtn:not(:disabled){ background:var(--btn-brillant-fond)!important;box-shadow:var(--btn-brillant-ombre)!important;text-shadow:0 1px 0 rgba(255,255,255,.35)} /* ---------- Style brillant : derniers boutons jaunes (aide, radio, menu latéral, alertes, fiches) ---------- */ /* La bulle d'aide et les fiches membres injectent leur propre