/* Orejime — Thème Vintera (dark metal) — v3 */ :root { --ov-bg: #1a1a1a; --ov-text: #e5e7eb; --ov-muted: #9ca3af; --ov-accent: #e63535; --ov-accent-h: #c42b2b; --ov-border: rgba(255,255,255,0.09); --ov-on: #e63535; --ov-off: #4b5563; --ov-r: 12px; } /* ── Notice (bandeau bas de page) ─────────────────────────────────────────── */ .orejime-Notice { background: var(--ov-bg) !important; border: 1px solid var(--ov-border) !important; border-radius: var(--ov-r) !important; color: var(--ov-text) !important; box-shadow: 0 8px 40px rgba(0,0,0,0.75) !important; } .orejime-Notice-title { color: var(--ov-text) !important; font-weight: 700 !important; } .orejime-Notice-description, .orejime-Notice-purposes { color: var(--ov-muted) !important; font-size: 0.85em !important; } /* ── Boutons ──────────────────────────────────────────────────────────────── */ /* "Tout accepter" (notice) et "Sauvegarder" (modal) */ .orejime-Button--accept, .orejime-Button--acceptAll, .orejime-Button--save { background: var(--ov-accent) !important; color: #fff !important; border: none !important; border-radius: 8px !important; font-weight: 700 !important; padding: 10px 20px !important; cursor: pointer !important; } .orejime-Button--accept:hover, .orejime-Button--acceptAll:hover, .orejime-Button--save:hover { background: var(--ov-accent-h) !important; } /* "Tout refuser" / "Accepter nécessaires seulement" */ .orejime-Button--decline, .orejime-Button--acceptNecessary { background: transparent !important; color: var(--ov-muted) !important; border: 1px solid var(--ov-border) !important; border-radius: 8px !important; padding: 10px 20px !important; cursor: pointer !important; } .orejime-Button--decline:hover, .orejime-Button--acceptNecessary:hover { color: var(--ov-text) !important; border-color: rgba(255,255,255,0.2) !important; } /* Boutons liens (gestion, infos) */ .orejime-Button--manage, .orejime-Button--info, .orejime-Notice-learnMoreButton { color: var(--ov-accent) !important; background: transparent !important; border: none !important; text-decoration: underline !important; font-size: 0.82em !important; cursor: pointer !important; } /* ── Backdrop / Overlay ───────────────────────────────────────────────────── */ .orejime-ModalOverlay, .orejime-NoticeOverlay { background: rgba(0,0,0,0.78) !important; } /* Fix scroll-to-top quand la modal s'ouvre Orejime ajoute position:fixed sur body, ce qui reset le scroll. On override avec overflow:hidden sur et position:static sur body. */ .orejimeHtml-WithModalOpen { overflow: hidden !important; height: auto !important; } .orejimeHtml-WithModalOpen body { position: static !important; overflow: visible !important; height: auto !important; width: auto !important; } /* ── Modal ────────────────────────────────────────────────────────────────── */ .orejime-ModalWrapper { z-index: 10000 !important; } .orejime-Modal { background: var(--ov-bg) !important; color: var(--ov-text) !important; border: 1px solid var(--ov-border) !important; border-radius: var(--ov-r) !important; box-shadow: 0 16px 60px rgba(0,0,0,0.85) !important; } .orejime-Modal-header { border-bottom: 1px solid var(--ov-border) !important; background: rgba(255,255,255,0.02) !important; } .orejime-Modal-title { color: var(--ov-text) !important; font-weight: 700 !important; } .orejime-Modal-closeButton { color: var(--ov-muted) !important; background: none !important; border: none !important; } .orejime-Modal-closeButton:hover { color: var(--ov-text) !important; } .orejime-Modal-footer { border-top: 1px solid var(--ov-border) !important; } .orejime-Modal-poweredByLink { color: var(--ov-muted) !important; } /* ── App items ────────────────────────────────────────────────────────────── */ .orejime-AppList { padding: 0 !important; } /* Framway force position:relative + padding-left:1.4em + pseudo-éléments sur input[type=checkbox]+label — ça déplace le switch ET masque le titre. On annule tout ça sur le label Orejime. */ .orejime-AppItem-label { position: static !important; padding: 0 !important; margin: 0 !important; border: none !important; font-size: inherit !important; line-height: inherit !important; text-transform: none !important; display: block !important; cursor: default !important; } .orejime-AppItem-label::before, .orejime-AppItem-label::after { content: none !important; display: none !important; width: 0 !important; height: 0 !important; border: none !important; background: none !important; opacity: 0 !important; } /* Correct the padding-left so the absolute toggle doesn't overlap the title */ .orejime-AppList-item { position: relative !important; padding-left: 68px !important; min-height: 44px !important; border-bottom: 1px solid var(--ov-border) !important; margin-top: 0 !important; padding-top: 12px !important; padding-bottom: 12px !important; } .orejime-AppList-item:last-child { border-bottom: none !important; } .orejime-AppItem-title { color: var(--ov-text) !important; font-weight: 600 !important; font-size: 0.93em !important; display: block !important; overflow: visible !important; white-space: normal !important; text-overflow: clip !important; max-width: none !important; max-height: none !important; } .orejime-AppItem-description { color: var(--ov-muted) !important; font-size: 0.8em !important; margin-top: 2px !important; } /* ── Toggle switch — sélecteur réel Orejime v2 ────────────────────────────── */ .orejime-AppItem-slider { background: var(--ov-off) !important; border-radius: 20px !important; box-shadow: none !important; } .orejime-AppItem-input:checked + .orejime-AppItem-label .orejime-AppItem-slider { background: var(--ov-on) !important; } .orejime-AppItem-slider:before { background: #fff !important; border: none !important; } /* Checkbox réelle — invisible, superposée au switch. Sélecteur très spécifique pour battre les resets Framway sur input[type=checkbox]. */ .orejime-AppList-item input[type="checkbox"].orejime-AppItem-input, .orejime-AppItem input[type="checkbox"].orejime-AppItem-input { position: absolute !important; top: 0 !important; left: 0 !important; opacity: 0 !important; width: 52px !important; height: 28px !important; z-index: 2 !important; cursor: pointer !important; -webkit-appearance: none !important; appearance: none !important; margin: 0 !important; padding: 0 !important; border: none !important; background: transparent !important; box-shadow: none !important; display: block !important; clip: unset !important; transform: none !important; } /* Switch visuel — positionné à gauche de l'item, padding-left: 68px sur l'item crée l'espace */ .orejime-AppItem-switch { position: absolute !important; left: 8px !important; top: 50% !important; transform: translateY(-50%) !important; display: inline-block !important; width: 52px !important; height: 28px !important; } /* ── Masquer le bruit technique (Utilisation / optOut / required) ────────── */ .orejime-AppItem-optOut, .orejime-AppItem-required, .orejime-AppItem-purposes, .orejime-AppItem-purpose, .orejime-AppItem-switchLabel { display: none !important; } /* ── Tag "requis" ─────────────────────────────────────────────────────────── */ .orejime-Tag--required { background: rgba(229,53,53,0.15) !important; color: var(--ov-accent) !important; border: 1px solid rgba(229,53,53,0.3) !important; border-radius: 4px !important; font-size: 0.7em !important; padding: 2px 6px !important; }