/* ============================================================ UpMyChain — refonte 2026 + mode sombre Chargee EN DERNIER dans master.blade.php : surcharge le theme Worketic d'origine sans toucher a ses feuilles. Le theme est porte par [data-theme] sur . ============================================================ */ :root{ --umc-accent:#ff6300; --umc-accent-hover:#ff7a24; --umc-accent-soft:#fff3ea; /* Sur l'orange de marque, le noir contraste 7:1 la ou le blanc plafonne a 3:1 */ --umc-on-accent:#14100c; --umc-bg:#ffffff; /* fond de page */ --umc-bg-2:#f6f7f9; /* fond alterne */ --umc-surface:#ffffff; /* cartes, panneaux */ --umc-surface-2:#fafafb; /* entetes de cartes */ --umc-line:#e7e8ec; /* bordures */ --umc-line-strong:#d3d6dd; --umc-ink:#101114; /* texte principal */ --umc-ink-2:#3d414a; /* texte secondaire */ --umc-ink-3:#6b7280; /* texte tertiaire */ --umc-shadow:0 1px 2px rgba(16,17,20,.04),0 8px 24px rgba(16,17,20,.06); --umc-radius:12px; color-scheme:light; } html[data-theme="dark"]{ --umc-accent:#ff7a24; --umc-accent-hover:#ff8f45; --umc-accent-soft:#2a1a0f; --umc-on-accent:#14100c; --umc-bg:#0e0f12; --umc-bg-2:#131519; --umc-surface:#16181d; --umc-surface-2:#1c1f25; --umc-line:#282c34; --umc-line-strong:#343943; --umc-ink:#e9eaee; --umc-ink-2:#b3b7c0; --umc-ink-3:#868c98; --umc-shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35); color-scheme:dark; } /* ---------- Socle ---------- */ body{ background-color:var(--umc-bg)!important; color:var(--umc-ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; -webkit-font-smoothing:antialiased; } h1,h2,h3,h4,h5,h6{color:var(--umc-ink);letter-spacing:-.018em;} p,li,td,th,label,span,div{color:inherit;} a{color:var(--umc-accent);} a:hover,a:focus{color:var(--umc-accent-hover);} hr{border-color:var(--umc-line);} .text-muted{color:var(--umc-ink-3)!important;} .text-primary{color:var(--umc-accent)!important;} /* Conteneurs de page du theme */ .wt-main,.wt-wrapper,.wt-contentwrapper,.wt-haslayout, .wt-main.wt-haslayout.main-site-pf-view, .wt-main.wt-haslayout.profile-custom-design{ background-color:var(--umc-bg)!important; color:var(--umc-ink); } /* ---------- Surfaces : cartes, panneaux, encadres ---------- */ .wt-dashboardbox,.wt-dashboardboxcontent,.wt-dashboardboxtitle, .wt-settingscontent,.wt-tabsinfo,.wt-userform,.wt-formtheme, .wt-widget,.wt-widgetcontent,.wt-userlistinghold,.wt-userlistingcontent, .wt-categoriescontentholder,.wt-tablecategories,.wt-featured,.wt-bgwhite, .card,.panel,.modal-content,.dropdown-menu,.list-group-item, .wt-experiencelisting,.wt-offersmessages,.wt-profilecodescan{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink); } .wt-dashboardboxtitle,.wt-tabscontenttitle,.wt-contenthead,.wt-titlewithsearch{ background-color:var(--umc-surface-2)!important; border-color:var(--umc-line)!important; } .card,.wt-dashboardbox,.wt-widget,.wt-userlistinghold{ border-radius:var(--umc-radius)!important; box-shadow:none!important; border:1px solid var(--umc-line)!important; } .card:hover,.wt-userlistinghold:hover{ border-color:var(--umc-line-strong)!important; box-shadow:var(--umc-shadow)!important; } /* ---------- Tableaux ---------- */ table,.table{background-color:var(--umc-surface)!important;color:var(--umc-ink);} table th,.table th{ background-color:var(--umc-surface-2)!important; color:var(--umc-ink-2)!important; border-color:var(--umc-line)!important; font-weight:600; } table td,.table td{border-color:var(--umc-line)!important;color:var(--umc-ink);} .table-striped tbody tr:nth-of-type(odd){background-color:var(--umc-bg-2)!important;} .table-hover tbody tr:hover{background-color:var(--umc-surface-2)!important;} /* ---------- Formulaires ---------- */ .form-control,.wt-select select,select,textarea,input[type=text],input[type=email], input[type=password],input[type=number],input[type=search],input[type=url],input[type=tel], input[type=date]{ background-color:var(--umc-surface)!important; border:1px solid var(--umc-line)!important; color:var(--umc-ink)!important; border-radius:10px!important; box-shadow:none!important; transition:border-color .15s,box-shadow .15s; } .form-control:focus,select:focus,textarea:focus,input:focus{ border-color:var(--umc-accent)!important; box-shadow:0 0 0 3px rgba(255,99,0,.16)!important; outline:none!important; } .form-control::placeholder,textarea::placeholder,input::placeholder{color:var(--umc-ink-3)!important;} label,.form-group>label{color:var(--umc-ink-2);font-weight:560;} .wt-formtheme fieldset{border-color:var(--umc-line);} /* Cases et boutons radio du theme */ .wt-checkbox label,.wt-radio label{color:var(--umc-ink-2);} /* ---------- Boutons ---------- */ .btn,.wt-btn,.wt-searchgbtn,button.btn{ border-radius:10px!important; font-weight:560; letter-spacing:0; box-shadow:none!important; transition:background-color .15s,border-color .15s,color .15s; } .btn-primary,.wt-btn,.wt-searchgbtn,.btn-success{ background-color:var(--umc-accent)!important; border-color:var(--umc-accent)!important; color:var(--umc-on-accent)!important; } .btn-primary:hover,.wt-btn:hover,.wt-searchgbtn:hover,.btn-success:hover{ background-color:var(--umc-accent-hover)!important; border-color:var(--umc-accent-hover)!important; color:var(--umc-on-accent)!important; } .btn-default,.btn-secondary,.btn-light{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink-2)!important; } .btn-default:hover,.btn-secondary:hover,.btn-light:hover{ border-color:var(--umc-line-strong)!important; color:var(--umc-ink)!important; } /* ---------- Navigation, entete, pied ---------- */ header,.wt-header,.wt-navigationarea,.wt-nav,.navbar{ background-color:var(--umc-surface)!important; border-bottom:1px solid var(--umc-line)!important; box-shadow:none!important; } .wt-navigation>ul>li>a,.nav-link,.navbar-nav>li>a{color:var(--umc-ink-2)!important;} .wt-navigation>ul>li>a:hover,.nav-link:hover{color:var(--umc-accent)!important;} footer,.wt-footer{ background-color:var(--umc-surface)!important; border-top:1px solid var(--umc-line)!important; color:var(--umc-ink-2); } footer a,.wt-footer a{color:var(--umc-ink-2)!important;} footer a:hover,.wt-footer a:hover{color:var(--umc-accent)!important;} .wt-fwidgettitle h6{color:var(--umc-ink-3)!important;text-transform:uppercase; letter-spacing:.05em;font-size:13px;} /* ---------- Fenetres modales et menus ---------- */ .modal-content{border:1px solid var(--umc-line)!important;border-radius:16px!important;} .modal-header,.modal-footer{border-color:var(--umc-line)!important; background-color:var(--umc-surface-2)!important;} .dropdown-menu{border:1px solid var(--umc-line)!important;border-radius:12px!important; box-shadow:var(--umc-shadow)!important;} .dropdown-menu li a,.dropdown-item{color:var(--umc-ink-2)!important;} .dropdown-menu li a:hover,.dropdown-item:hover{ background-color:var(--umc-bg-2)!important;color:var(--umc-ink)!important;} /* ---------- Alertes ---------- */ .alert{border-radius:10px!important;border:1px solid var(--umc-line)!important;} .alert-success{background-color:rgba(34,160,90,.10)!important;color:#1c7a45!important; border-color:rgba(34,160,90,.28)!important;} .alert-danger{background-color:rgba(214,58,58,.10)!important;color:#b23434!important; border-color:rgba(214,58,58,.28)!important;} .alert-warning{background-color:var(--umc-accent-soft)!important;color:var(--umc-accent)!important; border-color:rgba(255,99,0,.28)!important;} html[data-theme="dark"] .alert-success{color:#5fd08d!important;} html[data-theme="dark"] .alert-danger{color:#ef8080!important;} /* ---------- Pagination ---------- */ .wt-pagination ul li a,.page-link{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink-2)!important;border-radius:8px!important;} .wt-pagination ul li.active a,.page-item.active .page-link{ background-color:var(--umc-accent)!important;border-color:var(--umc-accent)!important; color:var(--umc-on-accent)!important;} /* ---------- Barre de defilement ---------- */ ::-webkit-scrollbar{width:10px;height:10px;} ::-webkit-scrollbar-track{background:var(--umc-bg-2);} ::-webkit-scrollbar-thumb{background:var(--umc-line-strong);border-radius:8px;} ::-webkit-scrollbar-thumb:hover{background:var(--umc-ink-3);} /* ---------- Bascule clair / sombre ---------- */ .umc-theme-toggle{ display:inline-flex;align-items:center;justify-content:center; width:36px;height:36px;padding:0;margin:0 6px; background:transparent;border:1px solid var(--umc-line);border-radius:10px; color:var(--umc-ink-2);cursor:pointer;vertical-align:middle; transition:border-color .15s,color .15s,background-color .15s; } .umc-theme-toggle:hover{border-color:var(--umc-accent);color:var(--umc-accent);} .umc-theme-toggle svg{width:17px;height:17px;fill:none;stroke:currentColor; stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;} .umc-theme-toggle .umc-moon{display:none;} html[data-theme="dark"] .umc-theme-toggle .umc-moon{display:block;} html[data-theme="dark"] .umc-theme-toggle .umc-sun{display:none;} /* ---------- Mode sombre : rattrapages ---------- */ html[data-theme="dark"] img.umc-invert-logo{filter:brightness(0) invert(1);opacity:.92;} html[data-theme="dark"] .bg_gray,html[data-theme="dark"] .bg-white, html[data-theme="dark"] .bg-light,html[data-theme="dark"] .white-bg{ background-color:var(--umc-bg-2)!important;} /* Fonds blancs poses en style inline dans les vues du theme */ html[data-theme="dark"] [style*="background: #fff"], html[data-theme="dark"] [style*="background:#fff"], html[data-theme="dark"] [style*="background-color: #fff"], html[data-theme="dark"] [style*="background-color:#fff"], html[data-theme="dark"] [style*="background: white"], html[data-theme="dark"] [style*="background: aliceblue"]{ background-color:var(--umc-surface)!important;} html[data-theme="dark"] [style*="color:#000"], html[data-theme="dark"] [style*="color: #000"], html[data-theme="dark"] [style*="color:#333"], html[data-theme="dark"] [style*="color: #333"]{color:var(--umc-ink)!important;} /* ---------- Entete : barre de recherche et acces compte ---------- */ .wt-header,.wt-navigationarea,.wt-nav,.wt-respsonsive-search{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; } .wt-header .form-control,.wt-respsonsive-search .form-control{ background-color:var(--umc-bg-2)!important; border-color:var(--umc-line)!important; color:var(--umc-ink)!important; } /* Le bouton loupe restait rouge : on le remet a la couleur de marque */ .wt-header button[type=submit],.wt-header .wt-searchgbtn, .wt-respsonsive-search button,.wt-searchbtn, .wt-header .fa-search{color:var(--umc-on-accent)!important;} .wt-header button[type=submit],.wt-respsonsive-search button,.wt-searchbtn{ background-color:var(--umc-accent)!important; border-color:var(--umc-accent)!important; border-radius:0 10px 10px 0!important; } .wt-loginbtn a,.wt-logininfo a,.wt-header .wt-loginarea>a{color:var(--umc-ink-2)!important;} .wt-loginbtn a:hover,.wt-logininfo a:hover{color:var(--umc-accent)!important;} /* ---------- Ecrans de connexion et d'inscription ---------- */ .wt-loginformhold,.wt-loginarea,.wt-logininfo,.wt-loginfooterinfo, .wt-registerformhold,.wt-registerarea{ background-color:var(--umc-surface)!important; border:1px solid var(--umc-line)!important; border-radius:16px!important; color:var(--umc-ink); } .wt-loginheader,.wt-registerheader{ background-color:var(--umc-surface-2)!important; border-bottom:1px solid var(--umc-line)!important; border-radius:16px 16px 0 0!important; } .wt-loginheader h3,.wt-loginheader h2{color:var(--umc-ink)!important;font-size:18px;} .wt-forgot-password a{color:var(--umc-accent)!important;} /* Cases a cocher du theme, illisibles en sombre */ .wt-checkbox input[type=checkbox],input[type=checkbox],input[type=radio]{ accent-color:var(--umc-accent); width:16px;height:16px;vertical-align:middle; } /* ---------- Pages d'erreur ---------- */ .wt-error,.wt-errorholder,.wt-error404,.wt-errorcontent,.wt-errorimg{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; border-radius:16px!important; color:var(--umc-ink); } /* ---------- Listes de resultats ---------- */ .wt-userlistinghold,.wt-userlistingcontent,.wt-userlisting-breadcrumb, .wt-contenthead,.wt-starcontent,.wt-widgettitle,.wt-widgetcontent, .wt-searchresult,.wt-tag,.wt-widgettag{ background-color:transparent!important; border-color:var(--umc-line)!important; } .wt-userlistinghold{background-color:var(--umc-surface)!important;} .wt-widget{background-color:var(--umc-surface)!important;} /* Le theme pose des titres tres sombres : illisibles sur fond sombre */ html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3, html[data-theme="dark"] h4,html[data-theme="dark"] h5,html[data-theme="dark"] h6, html[data-theme="dark"] .wt-title h2,html[data-theme="dark"] .wt-title h3, html[data-theme="dark"] .wt-title h4,html[data-theme="dark"] .wt-title a, html[data-theme="dark"] .wt-contenthead h2,html[data-theme="dark"] .wt-widgettitle h2, html[data-theme="dark"] .wt-widgettitle h3,html[data-theme="dark"] .wt-starcontent, html[data-theme="dark"] .wt-userlistingcontent h3, html[data-theme="dark"] .wt-userlistingcontent a{ color:var(--umc-ink)!important; } html[data-theme="dark"] .wt-description p,html[data-theme="dark"] .wt-description, html[data-theme="dark"] .wt-userlisting-breadcrumb li, html[data-theme="dark"] .wt-userlisting-breadcrumb a{color:var(--umc-ink-2)!important;} /* Fonds clairs poses en dur par le theme */ html[data-theme="dark"] [style*="#f7f7f7"],html[data-theme="dark"] [style*="#f5f5f5"], html[data-theme="dark"] [style*="#eee"],html[data-theme="dark"] [style*="#fafafa"], html[data-theme="dark"] [style*="#f9f9f9"],html[data-theme="dark"] [style*="aliceblue"]{ background-color:var(--umc-surface-2)!important;color:var(--umc-ink)!important; } /* ---------- Logo : le mot-marque disparaissait sur fond sombre ---------- */ #logo img,.wt-logo img,.wt-logo a img,header .logo img, #header_menu img,.navbar-brand img,img.logo_normal,img.logo_sticky{ content:url('/images/logo-umc-light.svg'); height:36px!important;width:auto!important;max-width:none!important;min-width:150px; } html[data-theme="dark"] #logo img,html[data-theme="dark"] .wt-logo img, html[data-theme="dark"] .wt-logo a img,html[data-theme="dark"] header .logo img, html[data-theme="dark"] #header_menu img,html[data-theme="dark"] .navbar-brand img, html[data-theme="dark"] img.logo_normal,html[data-theme="dark"] img.logo_sticky{ content:url('/images/logo-umc-dark.svg'); } /* Le pied de page reprend le meme logo */ footer .wt-footerlogo img,.wt-footerlogo img,.ft-logo img{ content:url('/images/logo-umc-light.svg');height:32px!important;width:auto!important;} html[data-theme="dark"] footer .wt-footerlogo img, html[data-theme="dark"] .wt-footerlogo img, html[data-theme="dark"] .ft-logo img{content:url('/images/logo-umc-dark.svg');} /* ---------- Tout ce qui est orange porte une ecriture noire ---------- */ .btn-primary,.btn-primary *,.wt-btn,.wt-btn *,.btn-success,.btn-success *, .wt-searchgbtn,.wt-searchgbtn *,.wt-searchbtn,.wt-searchbtn *, input[type=submit],button[type=submit], .wt-header button[type=submit],.wt-header button[type=submit] *, .page-item.active .page-link,.wt-pagination ul li.active a, .umc-on-accent{ color:var(--umc-on-accent)!important; -webkit-text-fill-color:var(--umc-on-accent); } .btn-primary i,.wt-btn i,.btn-success i,.wt-searchgbtn i, button[type=submit] i,input[type=submit]{color:var(--umc-on-accent)!important;} /* Les liens rendus en bouton par le theme */ a.btn-primary,a.wt-btn,a.btn-success{color:var(--umc-on-accent)!important;} /* Le lien de connexion restait bleu par defaut */ #sign-in,a#sign-in,.btn_access,.wt-loginbtn a,a.wt-loginlink{ color:var(--umc-ink-2)!important;} #sign-in:hover,.btn_access:hover{color:var(--umc-accent)!important;} .btn_access.green,a.btn_access.green{ background-color:var(--umc-accent)!important;border-color:var(--umc-accent)!important; color:var(--umc-on-accent)!important;} /* ---------- Cadres : le piege des bordures sans couleur ---------- Le theme ecrit souvent « border: 1px solid » sans couleur. La bordure prend alors currentColor — soit le texte, devenu CLAIR en mode sombre. D'ou les contours blancs (cadre OTP, fieldsets, encadres invisibles). On redonne une couleur de ligne a tout ce qui structure la page. */ html[data-theme="dark"] div,html[data-theme="dark"] section, html[data-theme="dark"] article,html[data-theme="dark"] aside, html[data-theme="dark"] form,html[data-theme="dark"] fieldset, html[data-theme="dark"] legend,html[data-theme="dark"] table, html[data-theme="dark"] thead,html[data-theme="dark"] tbody, html[data-theme="dark"] tr,html[data-theme="dark"] td,html[data-theme="dark"] th, html[data-theme="dark"] ul,html[data-theme="dark"] ol,html[data-theme="dark"] li, html[data-theme="dark"] p,html[data-theme="dark"] span,html[data-theme="dark"] dl, html[data-theme="dark"] dt,html[data-theme="dark"] dd,html[data-theme="dark"] figure, html[data-theme="dark"] nav,html[data-theme="dark"] header,html[data-theme="dark"] footer, html[data-theme="dark"] iframe,html[data-theme="dark"] img,html[data-theme="dark"] hr{ border-color:var(--umc-line); } /* Cadres explicitement blancs, y compris poses en style inline */ html[data-theme="dark"] [style*="border:1px solid #fff"], html[data-theme="dark"] [style*="border: 1px solid #fff"], html[data-theme="dark"] [style*="border:1px solid white"], html[data-theme="dark"] [style*="border: 1px solid white"], html[data-theme="dark"] [style*="border-color:#fff"], html[data-theme="dark"] [style*="border-color: #fff"], html[data-theme="dark"] [style*="border:1px solid rgb(255"], html[data-theme="dark"] [style*="border: 1px solid rgb(255"]{ border-color:var(--umc-line)!important; } /* Contenus embarques : sans color-scheme, un iframe se peint en blanc */ iframe{color-scheme:light dark;} html[data-theme="dark"] iframe{ color-scheme:dark;background-color:var(--umc-surface); border:1px solid var(--umc-line)!important;border-radius:12px; } html[data-theme="dark"] fieldset,html[data-theme="dark"] .well, html[data-theme="dark"] .popover,html[data-theme="dark"] .tooltip-inner, html[data-theme="dark"] .wt-otpholder,html[data-theme="dark"] .wt-2fa{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink); } /* Un QR code doit rester lisible par une camera : on garde son fond blanc, mais dans un cadre propre au lieu d'un rectangle blanc a vif. */ .wt-profilecodescan img,.qrcode img,img[src*="qr"],svg.qrcode, .wt-profilecodescan svg,.qrcode svg{ background:#ffffff!important;padding:12px!important; border-radius:12px!important;border:1px solid var(--umc-line)!important; } /* ---------- Back-office : textes rendus illisibles en sombre ---------- */ html[data-theme="dark"] .custom-dashboard-sidebar, html[data-theme="dark"] .custom-dashboard-sidebar h3, html[data-theme="dark"] .custom-dashboard-sidebar h4, html[data-theme="dark"] .custom-dashboard-sidebar span, html[data-theme="dark"] .custom-dashboard-sidebar a, html[data-theme="dark"] .wt-dashboardmenu a,html[data-theme="dark"] .wt-dashboardmenu span, html[data-theme="dark"] .wt-username,html[data-theme="dark"] .wt-username h3, html[data-theme="dark"] .dz-filename,html[data-theme="dark"] .dz-size, html[data-theme="dark"] .dz-details,html[data-theme="dark"] .dz-details *, html[data-theme="dark"] .nav-tabs .nav-link, html[data-theme="dark"] .wt-tabscontenttitle h2, html[data-theme="dark"] .wt-tabscontenttitle h3{ color:var(--umc-ink)!important; } html[data-theme="dark"] .nav-tabs .nav-link.active, html[data-theme="dark"] .tab-content,html[data-theme="dark"] .tab-pane{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink)!important; } /* La zone de depot de fichiers passait en blanc sur blanc */ html[data-theme="dark"] .dropzone,html[data-theme="dark"] .dz-preview, html[data-theme="dark"] .vue-dropzone{ background-color:var(--umc-surface-2)!important; border:1px dashed var(--umc-line-strong)!important; color:var(--umc-ink-2)!important; } /* ============================================================ Rattrapages issus d'un AUDIT du DOM rendu, pas d'une supposition : parcours de /admin/profile, /admin/users, /search-results, /login et de l'accueil, en relevant chaque element dont le fond, le texte ou la bordure calcules restaient clairs en mode sombre. ============================================================ */ html[data-theme="dark"] ul.sub-menu, html[data-theme="dark"] .wt-navigation ul, html[data-theme="dark"] .dropdown-menu ul, html[data-theme="dark"] #wt-sidebarwrapper, html[data-theme="dark"] .wt-sidebarwrapper, html[data-theme="dark"] #wt-btnmenutoggle, html[data-theme="dark"] .wt-btnmenutoggle, html[data-theme="dark"] .wt-companysdetails, html[data-theme="dark"] .wt-usersidebar, html[data-theme="dark"] .wt-dashboardsidebar, html[data-theme="dark"] figure, html[data-theme="dark"] .wt-tabscontent, html[data-theme="dark"] .tab-content, html[data-theme="dark"] .wt-updatall, html[data-theme="dark"] .la-updateall-holder, html[data-theme="dark"] .wt-404errorcontent, html[data-theme="dark"] .wt-404errorimg, html[data-theme="dark"] .wt-404error, html[data-theme="dark"] main#wt-main, html[data-theme="dark"] .wt-innerbannerholder, html[data-theme="dark"] .wt-breadcrumbarea{ background-color:var(--umc-surface)!important; } html[data-theme="dark"] .wt-navigation ul li a.active, html[data-theme="dark"] .sub-menu li a.active, html[data-theme="dark"] a.active{ background-color:var(--umc-surface-2)!important;color:var(--umc-accent)!important; } /* Bordures restees claires */ html[data-theme="dark"] li,html[data-theme="dark"] li.menu-item-has-children, html[data-theme="dark"] figure,html[data-theme="dark"] span.version-area, html[data-theme="dark"] .sub-menu li{border-color:var(--umc-line)!important;} /* Textes restes sombres */ html[data-theme="dark"] label, html[data-theme="dark"] em.selected-search-type, html[data-theme="dark"] .selected-search-type, html[data-theme="dark"] .menu-icon, html[data-theme="dark"] .wt-uploadingbar, html[data-theme="dark"] .dz-filename,html[data-theme="dark"] .dz-size, html[data-theme="dark"] .version-area, html[data-theme="dark"] i.lnr,html[data-theme="dark"] .lnr-magnifier, html[data-theme="dark"] .wt-btnmenutoggle,html[data-theme="dark"] #wt-btnmenutoggle{ color:var(--umc-ink-2)!important; } /* Rappel : sur un fond orange, l'ecriture reste noire — cette regle passe apres les precedentes et reprend la main sur les icones. */ .btn-primary,.btn-primary *,.wt-btn,.wt-btn *,.btn-success,.btn-success *, .wt-searchgbtn,.wt-searchgbtn *,.wt-searchbtn,.wt-searchbtn *, button[type=submit],button[type=submit] *,input[type=submit], .wt-header button[type=submit] *{ color:var(--umc-on-accent)!important; } /* Menu deroulant du compte : il restait entierement blanc (220x608 mesures) */ html[data-theme="dark"] #wt-profiledashboard, html[data-theme="dark"] .wt-usernav, html[data-theme="dark"] .wt-usernav ul, html[data-theme="dark"] .wt-usernav ul li, html[data-theme="dark"] .wt-userlogedin ul, html[data-theme="dark"] .wt-userlogedin .dropdown-menu{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; } html[data-theme="dark"] .wt-usernav a,html[data-theme="dark"] .wt-userlogedin ul a{ color:var(--umc-ink-2)!important; } html[data-theme="dark"] .wt-usernav a:hover,html[data-theme="dark"] .wt-userlogedin ul a:hover{ background-color:var(--umc-bg-2)!important;color:var(--umc-accent)!important; } html[data-theme="dark"] .wt-updatall span, html[data-theme="dark"] .la-updateall-holder span{color:var(--umc-ink-2)!important;} /* Articles : cartes et titres restes clairs (mesure sur /articles) */ html[data-theme="dark"] .wt-articlecontent,html[data-theme="dark"] .wt-articlecontents, html[data-theme="dark"] .wt-articles,html[data-theme="dark"] .wt-articleimg, html[data-theme="dark"] .wt-blogpost,html[data-theme="dark"] .wt-postarticle{ background-color:var(--umc-surface)!important;border-color:var(--umc-line)!important; } html[data-theme="dark"] .wt-articlecontent a,html[data-theme="dark"] .wt-articlecontent h2, html[data-theme="dark"] .wt-articlecontent h3,html[data-theme="dark"] .wt-articlecontent h4, html[data-theme="dark"] .custom-black-text,html[data-theme="dark"] a.custom-black-text{ color:var(--umc-ink)!important; } html[data-theme="dark"] .wt-articlecontent p,html[data-theme="dark"] .wt-articlecontents p{ color:var(--umc-ink-2)!important; } /* ---------- Profils publics et espace utilisateur (mesures sur /profile/…) ---------- */ html[data-theme="dark"] .wt-freelancers-details, html[data-theme="dark"] .wt-userprofileholder, html[data-theme="dark"] .wt-statisticcontent, html[data-theme="dark"] [class*="wt-countercolor"], html[data-theme="dark"] .wt-services-holder, html[data-theme="dark"] .wt-clientfeedback, html[data-theme="dark"] .wt-craftedprojects, html[data-theme="dark"] .wt-videos, html[data-theme="dark"] .wt-experience, html[data-theme="dark"] .wt-education, html[data-theme="dark"] .wt-proposalsr, html[data-theme="dark"] .wt-userprofile, html[data-theme="dark"] .wt-usersidebar, html[data-theme="dark"] .wt-skillsholder, html[data-theme="dark"] .wt-portfolio, html[data-theme="dark"] .wt-reviews, html[data-theme="dark"] div.button, html[data-theme="dark"] .la-no-record{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink); } /* Textes du profil : le theme les fixe en quasi-noir */ html[data-theme="dark"] .wt-userprofileholder *, html[data-theme="dark"] .wt-freelancers-details *, html[data-theme="dark"] .wt-experience *, html[data-theme="dark"] .wt-services-holder *, html[data-theme="dark"] .wt-craftedprojects *{ color:inherit; } html[data-theme="dark"] .wt-userprofileholder a, html[data-theme="dark"] .wt-freelancers-details a{color:var(--umc-ink)!important;} html[data-theme="dark"] .wt-userprofileholder a:hover, html[data-theme="dark"] .wt-freelancers-details a:hover{color:var(--umc-accent)!important;} /* Profil public : blocs releves dans le HTML rendu de /profile/… */ html[data-theme="dark"] .wt-userprofile, html[data-theme="dark"] .wt-usertitle, html[data-theme="dark"] .wt-freelancers-info, html[data-theme="dark"] .wt-freelancers-content, html[data-theme="dark"] .wt-freelancers-rating, html[data-theme="dark"] .wt-freelancers-img, html[data-theme="dark"] .wt-emptydetails, html[data-theme="dark"] .wt-emptydata-holder, html[data-theme="dark"] .wt-emptydata, html[data-theme="dark"] .wt-empty-person, html[data-theme="dark"] .wt-titlewithselect, html[data-theme="dark"] .wt-widgetcompany, html[data-theme="dark"] .wt-clicksavebtn, html[data-theme="dark"] .wt-btntext, html[data-theme="dark"] .wt-select, html[data-theme="dark"] .wt-login{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; } html[data-theme="dark"] .wt-usertitle h2,html[data-theme="dark"] .wt-usertitle h3, html[data-theme="dark"] .wt-usertitle a,html[data-theme="dark"] .wt-usertitle span, html[data-theme="dark"] .wt-freelancers-info h3,html[data-theme="dark"] .wt-freelancers-info a, html[data-theme="dark"] .wt-freelancers-content h3,html[data-theme="dark"] .wt-freelancers-content a, html[data-theme="dark"] .wt-emptydetails h3,html[data-theme="dark"] .wt-emptydata h3, html[data-theme="dark"] .wt-statisticcontent h3,html[data-theme="dark"] .wt-statisticcontent span, html[data-theme="dark"] .wt-title h2,html[data-theme="dark"] .wt-title h3{ color:var(--umc-ink)!important; } html[data-theme="dark"] .wt-description p,html[data-theme="dark"] .wt-emptydetails p, html[data-theme="dark"] .wt-emptydata p{color:var(--umc-ink-2)!important;} /* Offres d'abonnement (/membership) et annonces (/jobs) */ html[data-theme="dark"] .box, html[data-theme="dark"] .wt-viewjobholder, html[data-theme="dark"] .wt-viewjobfolder, html[data-theme="dark"] .wt-viewjobtag, html[data-theme="dark"] .wt-viewjobclock, html[data-theme="dark"] .wt-effectiveholder, html[data-theme="dark"] .wt-jobholder, html[data-theme="dark"] .wt-joblisting, html[data-theme="dark"] .wt-pricingtable, html[data-theme="dark"] .wt-packagehold{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; } html[data-theme="dark"] .box *, html[data-theme="dark"] .wt-viewjobholder h2,html[data-theme="dark"] .wt-viewjobholder h3, html[data-theme="dark"] .wt-viewjobholder h4,html[data-theme="dark"] .wt-viewjobholder a, html[data-theme="dark"] .wt-viewjobfolder h3,html[data-theme="dark"] .wt-viewjobfolder a, html[data-theme="dark"] .wt-widgettitle h2,html[data-theme="dark"] .wt-widgettitle h3, html[data-theme="dark"] .wt-effectiveholder h3{ color:var(--umc-ink)!important; } html[data-theme="dark"] .box p,html[data-theme="dark"] .wt-viewjobholder p, html[data-theme="dark"] .wt-viewjobtag,html[data-theme="dark"] .wt-viewjobclock{ color:var(--umc-ink-2)!important; } /* Les prix restent en couleur de marque */ html[data-theme="dark"] .box .price,html[data-theme="dark"] .box strong.price, html[data-theme="dark"] .wt-price{color:var(--umc-accent)!important;} /* Page d'abonnement : sections et FAQ ont leurs propres classes */ html[data-theme="dark"] .membership,html[data-theme="dark"] .sec2, html[data-theme="dark"] .section4,html[data-theme="dark"] .section2, html[data-theme="dark"] .section3,html[data-theme="dark"] .faq_card, html[data-theme="dark"] button.accordion,html[data-theme="dark"] .accordion, html[data-theme="dark"] .panel,html[data-theme="dark"] .accordion-content{ background-color:var(--umc-surface)!important; border-color:var(--umc-line)!important; color:var(--umc-ink)!important; } html[data-theme="dark"] .faq_card *,html[data-theme="dark"] button.accordion *, html[data-theme="dark"] .membership h1,html[data-theme="dark"] .membership h2, html[data-theme="dark"] .membership h3,html[data-theme="dark"] .membership h4, html[data-theme="dark"] .sec2 h2,html[data-theme="dark"] .sec2 h3, html[data-theme="dark"] .section4 h2,html[data-theme="dark"] .section4 h3{ color:var(--umc-ink)!important; } html[data-theme="dark"] .membership p,html[data-theme="dark"] .sec2 p, html[data-theme="dark"] .section4 p,html[data-theme="dark"] .faq_card p{ color:var(--umc-ink-2)!important; } /* Annonces : les titres restaient quasi noirs */ html[data-theme="dark"] .wt-title h2 a,html[data-theme="dark"] .wt-title h3 a, html[data-theme="dark"] .wt-title h4 a,html[data-theme="dark"] .wt-jobtitle, html[data-theme="dark"] .wt-viewjobholder span, html[data-theme="dark"] .wt-widgettag a,html[data-theme="dark"] .wt-tag a{ color:var(--umc-ink)!important; } @media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}