/* ============================================================ DUOLOCAL — BANDEAUX HOMME Bleu exact validé dashboard : #285f94 / #1b4268 / #5c91c2 Femme : aucune surcharge visuelle. ============================================================ */ /* ============================================================ VARIABLES HOMME DANS LES BANDEAUX UNIQUEMENT ============================================================ */ body.theme-male-bandeau .dashboard-welcome, body.theme-male-bandeau .page-heading, body.theme-male-bandeau .trust-hero, body.theme-male-bandeau .p8-hero, body.theme-male-bandeau .p8-form-hero, body.theme-male-bandeau .p8-event-detail-head, body.theme-male-bandeau .universe-hero, body.theme-male-bandeau .profile-header, body.theme-male-bandeau .profile-hero, body.theme-male-bandeau .search-header, body.theme-male-bandeau .search-hero, body.theme-male-bandeau .matches-hero, body.theme-male-bandeau .messages-hero, body.theme-male-bandeau .notifications-hero, body.theme-male-bandeau .activity-hero, body.theme-male-bandeau .premium-hero, body.theme-male-bandeau .profile-v3-hero, body.theme-male-bandeau .search-premium-hero { --primary: #285f94; --primary-dark: #1b4268; --primary-light: #5c91c2; } /* ============================================================ DASHBOARD Ne pas remplacer son fond : son propre thème homme est déjà validé. ============================================================ */ body.theme-male-bandeau .dashboard-welcome { border-color: rgba(47,111,174,.24) !important; } body.theme-male-bandeau .dashboard-welcome .dashboard-eyebrow > span:first-child { color: #285f94 !important; } /* ============================================================ PROFIL Le gradient rose est codé en dur dans profil-premium.css. On reproduit EXACTEMENT sa construction avec le bleu. ============================================================ */ body.theme-male-bandeau .profile-v3-hero { background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* ============================================================ RECHERCHE Son CSS utilise déjà : var(--primary) -> var(--primary-light) On ne touche donc PAS au background. Les variables ci-dessus suffisent. ============================================================ */ body.theme-male-bandeau .search-premium-hero { box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* ============================================================ ACCENTS DANS LES BANDEAUX ============================================================ */ body.theme-male-bandeau .page-heading .section-kicker, body.theme-male-bandeau .trust-hero .section-kicker, body.theme-male-bandeau .p8-hero .section-kicker, body.theme-male-bandeau .p8-form-hero .section-kicker, body.theme-male-bandeau .p8-event-detail-head .section-kicker, body.theme-male-bandeau .universe-hero .section-kicker { color: #285f94 !important; } /* ============================================================ SWITCH ADMIN H / F ============================================================ */ .dashboard-theme-adminbar-switch { display: inline-flex; align-items: center; gap: 4px; margin-left: 4px; padding-left: 4px; } .dashboard-theme-adminbar-switch .dashboard-theme-test-btn { appearance: none; position: static; display: inline-flex; align-items: center; justify-content: center; width: 27px; height: 27px; padding: 0; border: 1px solid rgba(255,255,255,.18); border-radius: 7px; background: rgba(255,255,255,.07); color: inherit; font: inherit; font-size: 11px; font-weight: 800; cursor: pointer; box-shadow: none; transform: none; } .dashboard-theme-adminbar-switch .dashboard-theme-test-btn:hover { background: rgba(255,255,255,.14); color: #fff; } .dashboard-theme-adminbar-switch .dashboard-theme-test-btn.is-active { color: #fff; } .dashboard-theme-adminbar-switch .dashboard-theme-test-btn[data-theme="theme-male"].is-active { background: #285f94; border-color: #5c91c2; } .dashboard-theme-adminbar-switch .dashboard-theme-test-btn[data-theme="theme-female"].is-active { background: #7b2d43; border-color: #d96c75; } /* ============================================================ TOUS LES BANDEAUX MEMBRES — THEME HOMME Uniquement le conteneur HERO. ============================================================ */ body.theme-male-bandeau .match-v3-hero, body.theme-male-bandeau .messages-v3-hero, body.theme-male-bandeau .list-v3-hero, body.theme-male-bandeau .photos-v3-hero, body.theme-male-bandeau .visitors-hero, body.theme-male-bandeau .score-v1-hero, body.theme-male-bandeau .premium-v5-hero, body.theme-male-bandeau .premium-v6-hero, body.theme-male-bandeau .coach-v1-hero, body.theme-male-bandeau .compat-v1-hero, body.theme-male-bandeau .jeux-duo-hero, body.theme-male-bandeau .duo-engage-hero, body.theme-male-bandeau .questions-duo-hero, body.theme-male-bandeau .member-activity-hero, body.theme-male-bandeau .dd-hero, body.theme-male-bandeau .p7-notifications-hero, body.theme-male-bandeau .p8-hero, body.theme-male-bandeau .p8-form-hero, body.theme-male-bandeau .p8-event-detail-head, body.theme-male-bandeau .universe-hero, body.theme-male-bandeau .trust-hero, body.theme-male-bandeau .signature-hero, body.theme-male-bandeau .dw-hero, body.theme-male-bandeau .eng-hero, body.theme-male-bandeau .dash-v5-hero { --primary: #285f94; --primary-dark: #1b4268; --primary-light: #5c91c2; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* ------------------------------------------------------------ Notifications : le petit compteur fait visuellement partie du bandeau. On remplace seulement son fond rose. ------------------------------------------------------------ */ body.theme-male-bandeau .p7-notifications-hero .p7-notification-summary { background: #1b4268 !important; } /* Eyebrow notification */ body.theme-male-bandeau .p7-notifications-hero .p7-eyebrow { color: #285f94 !important; } /* ------------------------------------------------------------ KICKERS contenus dans les bandeaux ------------------------------------------------------------ */ body.theme-male-bandeau .match-v3-hero .section-kicker, body.theme-male-bandeau .messages-v3-hero .section-kicker, body.theme-male-bandeau .list-v3-hero .section-kicker, body.theme-male-bandeau .photos-v3-hero .section-kicker, body.theme-male-bandeau .visitors-hero .section-kicker, body.theme-male-bandeau .score-v1-hero .section-kicker, body.theme-male-bandeau .premium-v5-hero .section-kicker, body.theme-male-bandeau .premium-v6-hero .section-kicker, body.theme-male-bandeau .coach-v1-hero .section-kicker, body.theme-male-bandeau .compat-v1-hero .section-kicker, body.theme-male-bandeau .jeux-duo-hero .section-kicker, body.theme-male-bandeau .duo-engage-hero .section-kicker, body.theme-male-bandeau .questions-duo-hero .section-kicker, body.theme-male-bandeau .member-activity-hero .section-kicker, body.theme-male-bandeau .p8-hero .section-kicker, body.theme-male-bandeau .p8-form-hero .section-kicker, body.theme-male-bandeau .p8-event-detail-head .section-kicker, body.theme-male-bandeau .universe-hero .section-kicker, body.theme-male-bandeau .trust-hero .section-kicker { color: #285f94 !important; } /* ============================================================ CORRECTIONS ACTIVITE / APPELS / REGLES ============================================================ */ /* ------------------------------------------------------------ ACTIVITE.PHP FEMME = rose DuoLocal HOMME = bleu DuoLocal ------------------------------------------------------------ */ /* Femme / style normal */ body:not(.theme-male-bandeau) .member-activity-hero { --primary: #7b2d43; --primary-dark: #6f2438; --primary-light: #d96c75; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border-color: rgba(123,45,67,.30) !important; box-shadow: 0 22px 55px rgba(123,45,67,.25) !important; } /* Homme */ body.theme-male-bandeau .member-activity-hero { --primary: #285f94; --primary-dark: #1b4268; --primary-light: #5c91c2; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* "La vie de la communauté" doit rester blanc */ .member-activity-hero h1, .member-activity-hero h2 { color: #fff !important; } /* ------------------------------------------------------------ APPELS.PHP ------------------------------------------------------------ */ body.theme-male-bandeau .rtc-page-hero { --primary: #285f94; --primary-dark: #1b4268; --primary-light: #5c91c2; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* ------------------------------------------------------------ REGLES-JEUX.PHP ------------------------------------------------------------ */ body.theme-male-bandeau .rules-hero { --primary: #285f94; --primary-dark: #1b4268; --primary-light: #5c91c2; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* ============================================================ ACTIVITE.PHP — TEXTE DU BANDEAU EN BLANC ============================================================ */ .member-activity-hero, .member-activity-hero h1, .member-activity-hero h2, .member-activity-hero h3, .member-activity-hero p, .member-activity-hero span, .member-activity-hero strong, .member-activity-hero small, .member-activity-hero a, .member-activity-hero .section-kicker { color: #fff !important; } /* ============================================================ ACTIVITE.PHP — FINITIONS ============================================================ */ /* Titre "La vie de la communauté" + textes du bandeau */ .member-activity-hero, .member-activity-hero h1, .member-activity-hero h2, .member-activity-hero h3, .member-activity-hero p, .member-activity-hero span, .member-activity-hero strong, .member-activity-hero small { color: #fff !important; } /* Bouton Recherche de la page activité = rose DuoLocal */ body:has(.member-activity-hero) form[role="search"] button, body:has(.member-activity-hero) .search-form button, body:has(.member-activity-hero) .search-form input[type="submit"], body:has(.member-activity-hero) button[type="submit"][name*="search"], body:has(.member-activity-hero) button[type="submit"][name*="recherche"] { background: #7b2d43 !important; border-color: #7b2d43 !important; color: #fff !important; } body:has(.member-activity-hero) form[role="search"] button:hover, body:has(.member-activity-hero) .search-form button:hover, body:has(.member-activity-hero) .search-form input[type="submit"]:hover, body:has(.member-activity-hero) button[type="submit"][name*="search"]:hover, body:has(.member-activity-hero) button[type="submit"][name*="recherche"]:hover { background: #6f2438 !important; border-color: #6f2438 !important; color: #fff !important; } /* ============================================================ ACTIVITE.PHP — CORRECTION EXACTE ============================================================ */ /* "La vie de la communauté" : blanc H + F */ body .member-activity-hero .section-kicker, body.theme-male-bandeau .member-activity-hero .section-kicker { color: #fff !important; } /* Bouton "Découvrir les profils" : rose comme les autres */ body .member-activity-hero > a.button.button-secondary, body.theme-male-bandeau .member-activity-hero > a.button.button-secondary { background: #7b2d43 !important; border-color: #7b2d43 !important; color: #fff !important; } /* Hover du bouton */ body .member-activity-hero > a.button.button-secondary:hover, body.theme-male-bandeau .member-activity-hero > a.button.button-secondary:hover { background: #6f2438 !important; border-color: #6f2438 !important; color: #fff !important; } /* ========================================================= DUOLOCAL-HEADER-COMPACT-V2 Barre compacte sans élément supplémentaire. ========================================================= */ @media (min-width: 1121px) { :root { --p4-header-height: 62px; } .site-header-v3.site-header-v4 { min-height: 62px; } .site-header-v4-inner.site-header-inner { width: min(1320px, calc(100% - 28px)); min-height: 62px; padding: 4px 0; /* Comme avant : logo | navigation | compte */ grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; } .site-nav-v4.site-nav-v3 { min-width: 0; justify-content: center; gap: 4px; flex-wrap: nowrap; } .site-nav-v4 .nav-link, .site-nav-v4 .nav-dropdown > summary { min-height: 40px; padding: 7px 10px; } .account-menu { justify-self: end; margin-left: auto; } .account-menu > summary { min-height: 46px; padding: 3px 7px 3px 5px; } } /* À la largeur où apparaît le vrai bouton Menu, tout reste côte à côte : logo | Menu Fixe | espace | Mon compte */ @media (max-width: 1120px) and (min-width: 681px) { .site-header-v4-inner.site-header-inner { grid-template-columns: auto auto minmax(0, 1fr) auto; gap: 10px; } .mobile-nav-toggle { min-height: 38px; padding: 5px 9px; gap: 6px; font-size: .84rem; white-space: nowrap; } .mobile-nav-toggle .ui-icon { width: 18px; height: 18px; } .account-menu { grid-column: 4; justify-self: end; margin-left: auto; } .account-menu > summary { min-height: 44px; } } /* ========================================================= DUOLOCAL-HEADER-COMPACT-V3 Menu Fixe réduit + Mon compte collé après Plus ========================================================= */ /* PC : Plus puis Mon compte immédiatement à droite */ @media (min-width: 1121px) { .site-header-v4-inner.site-header-inner { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; } .site-nav-v4.site-nav-v3 { justify-content: flex-end; gap: 4px; } .account-menu { justify-self: start; margin-left: 0; } .account-menu > summary { min-width: 168px; } } /* Vrai bouton Menu Fixe : plus discret */ @media (max-width: 1120px) { .mobile-nav-toggle { min-height: 34px !important; padding: 4px 7px !important; gap: 4px !important; border-radius: 8px !important; font-size: .74rem !important; line-height: 1 !important; white-space: nowrap; } .mobile-nav-toggle .ui-icon { width: 15px !important; height: 15px !important; } } /* ========================================================= DUOLOCAL-HEADER-COMPACT-V4 Desktop compact : Logo | Menu Fixe | navigation | Mon compte ========================================================= */ @media (min-width: 681px) and (max-width: 1120px) { :root { --p4-header-height: 58px; } .site-header-v3.site-header-v4 { min-height: 58px !important; } .site-header-v4-inner.site-header-inner { width: calc(100% - 18px) !important; min-height: 58px !important; padding: 3px 0 !important; grid-template-columns: auto auto minmax(0, 1fr) auto !important; gap: 6px !important; align-items: center !important; } /* MENU FIXE PETIT */ .mobile-nav-toggle { display: inline-flex !important; position: static !important; min-height: 30px !important; height: 30px !important; padding: 3px 6px !important; gap: 3px !important; justify-self: start !important; border-radius: 7px !important; font-size: .68rem !important; line-height: 1 !important; white-space: nowrap !important; } .mobile-nav-toggle .ui-icon { width: 13px !important; height: 13px !important; } /* ON REMET LA NAVIGATION SUR LA MEME LIGNE */ .site-nav-v4.site-nav-v3 { position: static !important; z-index: auto !important; top: auto !important; left: auto !important; right: auto !important; max-height: none !important; padding: 0 !important; display: flex !important; overflow: visible !important; align-items: center !important; justify-content: flex-end !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 2px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } .site-nav-v4 .nav-link, .site-nav-v4 .nav-dropdown > summary { width: auto !important; min-height: 34px !important; padding: 5px 7px !important; justify-content: center !important; border-radius: 8px !important; font-size: .76rem !important; white-space: nowrap !important; } /* PLUS redevient un vrai dropdown normal */ .site-nav-v4 .nav-dropdown { position: relative !important; width: auto !important; } .site-nav-v4 .nav-dropdown-panel { position: absolute !important; top: calc(100% + 8px) !important; left: 0 !important; min-width: 260px !important; margin: 0 !important; padding: 8px !important; background: var(--p4-surface) !important; box-shadow: var(--p4-shadow) !important; } /* MON COMPTE JUSTE APRES PLUS */ .account-menu { grid-column: 4 !important; justify-self: start !important; margin-left: 0 !important; } .account-menu > summary { min-width: 0 !important; min-height: 38px !important; padding: 3px 6px 3px 4px !important; gap: 5px !important; } .account-menu img, .account-avatar-placeholder { width: 32px !important; height: 32px !important; } .account-menu-label { min-width: 70px !important; } .account-menu-label strong { max-width: 92px !important; font-size: .76rem !important; } .account-menu-label small { margin-top: 1px !important; font-size: .62rem !important; } } /* Grand PC : rapproche aussi Mon compte de Plus */ @media (min-width: 1121px) { .site-header-v4-inner.site-header-inner { grid-template-columns: auto minmax(0, 1fr) auto !important; gap: 6px !important; } .site-nav-v4.site-nav-v3 { justify-content: flex-end !important; gap: 3px !important; } .account-menu { justify-self: start !important; margin-left: 0 !important; } } /* ============================================================ DUOLOCAL-ACTIVITY-FEED-BG-V1 ACTIVITE.PHP — fond sous les fiches ============================================================ */ /* Femme */ body:not(.theme-male-bandeau) .member-activity-feed { background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; padding: 12px; border-radius: 18px; } /* Homme */ body.theme-male-bandeau .member-activity-feed { background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; padding: 12px; border-radius: 18px; } /* ============================================================ DUOLOCAL-ACTIVITY-SECTION-BG-V1 Fond global du fil activité : Femme = rose / Homme = bleu ============================================================ */ /* FEMME */ body.page-activite:not(.theme-male-bandeau) .member-activity-section { background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border: 1px solid rgba(123,45,67,.30); } /* HOMME */ body.page-activite.theme-male-bandeau .member-activity-section { background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border: 1px solid rgba(40,95,148,.30); } /* Titre du fil lisible sur le fond */ body.page-activite .member-activity-section .section-heading h2, body.page-activite .member-activity-section .section-heading .section-kicker { color: #fff !important; } /* ============================================================ DUOLOCAL-PROFILE-VIEW-GENDER-THEME-V1 PROFIL VISITE : Femme = rose Homme = bleu Le sexe du visiteur n'influence plus le fond du profil. ============================================================ */ /* FEMME VISITEE — ROSE */ .profile-v3.profile-view-femme .profile-v3-hero { --primary: #7b2d43; --primary-dark: #6f2438; --primary-light: #d96c75; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; box-shadow: 0 22px 55px rgba(123,45,67,.25) !important; } /* HOMME VISITE — BLEU */ .profile-v3.profile-view-homme .profile-v3-hero { --primary: #285f94; --primary-dark: #1b4268; --primary-light: #5c91c2; background: radial-gradient( circle at top right, rgba(255,255,255,.26), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; box-shadow: 0 22px 55px rgba(40,95,148,.25) !important; } /* ============================================================ DUOLOCAL-PREMIUM-COMP-FAQ-HF-V1 premium.php Comparatif clair + Questions fréquentes Femme = rose Homme = bleu ============================================================ */ /* ------------------------------------------------------------ FEMME — ROSE ------------------------------------------------------------ */ body.page-premium:not(.theme-male-bandeau) .premium-v6-comparison, body.page-premium:not(.theme-male-bandeau) .premium-v7-faq { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border-color: rgba(123,45,67,.30) !important; box-shadow: 0 16px 38px rgba(123,45,67,.18) !important; } /* ------------------------------------------------------------ HOMME — BLEU ------------------------------------------------------------ */ body.page-premium.theme-male-bandeau .premium-v6-comparison, body.page-premium.theme-male-bandeau .premium-v7-faq { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 16px 38px rgba(40,95,148,.18) !important; } /* ------------------------------------------------------------ TITRES / INTRO EN BLANC ------------------------------------------------------------ */ body.page-premium .premium-v6-comparison > header h2, body.page-premium .premium-v6-comparison > header p, body.page-premium .premium-v6-comparison .premium-v6-kicker, body.page-premium .premium-v7-faq > header h2, body.page-premium .premium-v7-faq > header p, body.page-premium .premium-v7-faq > header .premium-v6-kicker { color: #fff !important; } /* ------------------------------------------------------------ CONTENU CLAIR PAR-DESSUS ------------------------------------------------------------ */ /* Tableau comparatif */ body.page-premium .premium-v6-comparison .premium-v6-table-wrap { background: #fff !important; border-color: rgba(255,255,255,.75) !important; } body.page-premium .premium-v6-comparison .premium-v6-table { background: #fff !important; } /* FAQ */ body.page-premium .premium-v7-faq details { background: #fff !important; border-color: rgba(255,255,255,.75) !important; box-shadow: 0 4px 12px rgba(35,24,29,.06); } /* Question ouverte : léger rose clair */ body.page-premium .premium-v7-faq details[open] summary { background: #fbf2ef !important; } /* ============================================================ DUOLOCAL-NOTIFICATIONS-PREFERENCES-HF-V1 notifications.php — bloc Préférences Femme = rose / Homme = bleu ============================================================ */ /* FEMME — ROSE */ body.page-notifications:not(.theme-male-bandeau) .p7-preferences { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border-color: rgba(123,45,67,.30) !important; box-shadow: 0 15px 36px rgba(123,45,67,.18); } /* HOMME — BLEU */ body.page-notifications.theme-male-bandeau .p7-preferences { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 15px 36px rgba(40,95,148,.18); } /* En-tête du bloc */ body.page-notifications .p7-preferences > div > .p7-eyebrow, body.page-notifications .p7-preferences > div > h2, body.page-notifications .p7-preferences > div > p { color: #fff !important; } /* Les réglages restent sur des fiches claires */ body.page-notifications .p7-preference-row { background: rgba(255,255,255,.96) !important; border-color: rgba(255,255,255,.72) !important; box-shadow: 0 3px 10px rgba(35,24,29,.05); } /* ============================================================ DUOLOCAL-VISITORS-DISCOVERY-HF-V1 visiteurs.php — "Découvrez qui vous visite" Femme = rose / Homme = bleu ============================================================ */ /* FEMME — ROSE */ body.page-visiteurs:not(.theme-male-bandeau) .visitors-lock-content { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border-color: rgba(123,45,67,.30) !important; box-shadow: 0 16px 38px rgba(123,45,67,.18) !important; } /* HOMME — BLEU */ body.page-visiteurs.theme-male-bandeau .visitors-lock-content { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 16px 38px rgba(40,95,148,.18) !important; } /* Texte du bloc */ body.page-visiteurs .visitors-lock-content h2, body.page-visiteurs .visitors-lock-content p { color: #fff !important; } /* Cadenas */ body.page-visiteurs .visitors-lock-content .visitors-lock-icon { background: rgba(255,255,255,.16) !important; color: #fff !important; } /* Passer Premium = bouton blanc */ body.page-visiteurs .visitors-lock-content > a { background: #fff !important; border: 1px solid rgba(255,255,255,.85) !important; color: #7b2d43 !important; box-shadow: 0 5px 14px rgba(35,24,29,.10); transition: transform .18s ease, background .18s ease, box-shadow .18s ease; } body.page-visiteurs .visitors-lock-content > a:hover { background: #fff8fb !important; transform: translateY(-2px); box-shadow: 0 9px 20px rgba(35,24,29,.15); } /* ============================================================ DUOLOCAL-VISITORS-PREMIUM-BUTTON-V1 visiteurs.php — bouton Passer Premium ============================================================ */ body.page-visiteurs .visitors-lock-content > a { background: linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border-color: #7b2d43 !important; color: #fff !important; box-shadow: 0 6px 15px rgba(123,45,67,.18); transition: background .18s ease, transform .18s ease, box-shadow .18s ease; } body.page-visiteurs .visitors-lock-content > a:hover, body.page-visiteurs .visitors-lock-content > a:focus-visible { background: linear-gradient( 135deg, #6f2438, #c95c73 ) !important; color: #fff !important; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(123,45,67,.24); } /* ============================================================ DUOLOCAL-MON-UNIVERS-HF-V1 mon-univers.php Tous les grands blocs : Femme = rose / Homme = bleu ============================================================ */ /* ------------------------------------------------------------ FEMME — ROSE ------------------------------------------------------------ */ body.page-mon-univers:not(.theme-male-bandeau) .universe-hero, body.page-mon-univers:not(.theme-male-bandeau) .universe-panel, body.page-mon-univers:not(.theme-male-bandeau) .universe-preview { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #7b2d43, #d96c75 ) !important; border-color: rgba(123,45,67,.30) !important; box-shadow: 0 15px 36px rgba(123,45,67,.18) !important; } /* ------------------------------------------------------------ HOMME — BLEU ------------------------------------------------------------ */ body.page-mon-univers.theme-male-bandeau .universe-hero, body.page-mon-univers.theme-male-bandeau .universe-panel, body.page-mon-univers.theme-male-bandeau .universe-preview { background: radial-gradient( circle at top right, rgba(255,255,255,.20), transparent 35% ), linear-gradient( 135deg, #285f94, #5c91c2 ) !important; border-color: rgba(40,95,148,.30) !important; box-shadow: 0 15px 36px rgba(40,95,148,.18) !important; } /* ------------------------------------------------------------ TEXTES SUR LES GRANDS FONDS ------------------------------------------------------------ */ body.page-mon-univers .universe-hero h1, body.page-mon-univers .universe-hero p, body.page-mon-univers .universe-panel-heading h2, body.page-mon-univers .universe-panel-heading p, body.page-mon-univers .universe-preview > h2, body.page-mon-univers .universe-preview > p { color: #fff !important; } /* Icônes et petits titres des blocs */ body.page-mon-univers .universe-hero-icon, body.page-mon-univers .universe-panel-heading .ui-icon { color: #fff !important; } /* ------------------------------------------------------------ ZONES DE TRAVAIL INTERNES RESTENT CLAIRES ------------------------------------------------------------ */ body.page-mon-univers .universe-panel textarea, body.page-mon-univers .universe-panel input, body.page-mon-univers .universe-panel select { background: #fff !important; } /* Aperçu du profil reste clair dans son grand cadre coloré */ body.page-mon-univers .universe-preview-card { background: rgba(255,255,255,.97) !important; border-color: rgba(255,255,255,.72) !important; box-shadow: 0 5px 16px rgba(35,24,29,.08); } /* Note sécurité lisible */ body.page-mon-univers .universe-preview-note { color: #fff !important; } /* Status du hero */ body.page-mon-univers .universe-hero-status { background: rgba(255,255,255,.15) !important; border-color: rgba(255,255,255,.25) !important; color: #fff !important; }