/* ============================================================ La Cueille — Dark Mode Overrides Activated via [data-theme="dark"] on Does NOT modify any light-mode styles. ============================================================ */ /* ── Variable overrides ─────────────────────────────────── */ [data-theme="dark"] { --lc-cream: #1A1A18; --lc-cream-dark: #141412; --lc-cream-mid: #22221F; --lc-dark: #F5F0E8; --lc-dark-soft: #E8E2D6; --lc-white: #F5F0E8; --lc-green: #5A8A52; --lc-green-light:#2A3328; --lc-terracotta: #D4774E; --lc-gold: #C9A96E; --lc-stone: #B5A88E; --lc-terra: #D4774E; --shadow: 0 8px 40px rgba(0,0,0,0.4); } /* style.css root vars */ [data-theme="dark"] { --lc-rouge: #C42B26; --lc-rouge-fonce: #99211d; --lc-rouge-clair: #E04040; --lc-creme: #1A1A18; --lc-sombre: #F5F0E8; } /* ── Body ───────────────────────────────────────────────── */ [data-theme="dark"] body { background: #1A1A18; color: #F5F0E8; } /* ── Headings ───────────────────────────────────────────── */ [data-theme="dark"] .lc-heading { color: #F5F0E8; } /* ── Labels ─────────────────────────────────────────────── */ [data-theme="dark"] .lc-label { color: #C9A96E; } /* ── Buttons ────────────────────────────────────────────── */ [data-theme="dark"] .lc-btn--primary { background: #D4774E; border-color: #D4774E; color: #F5F0E8; } [data-theme="dark"] .lc-btn--primary:hover { background: transparent; border-color: #F5F0E8; color: #F5F0E8 !important; } [data-theme="dark"] .lc-btn--outline { color: #F5F0E8; border-color: rgba(245,240,232,0.4); } [data-theme="dark"] .lc-btn--outline:hover { background: #F5F0E8; color: #1A1A18; } /* ── The7 content wrappers ──────────────────────────────── */ [data-theme="dark"] #page, [data-theme="dark"] .page-inner, [data-theme="dark"] #content, [data-theme="dark"] .content, [data-theme="dark"] #main, [data-theme="dark"] .wf-wrap, [data-theme="dark"] .wf-container-main { background: #1A1A18 !important; } /* ── Sections with cream/white backgrounds ──────────────── */ [data-theme="dark"] section, [data-theme="dark"] .lc-section { background-color: #1A1A18; } [data-theme="dark"] section[style*="background"], [data-theme="dark"] .lc-section[style*="background"] { background-color: #1A1A18 !important; } /* Sections with explicit bg classes */ [data-theme="dark"] .lc-bg-cream, [data-theme="dark"] .lc-bg-white { background: #1A1A18 !important; } [data-theme="dark"] .lc-bg-dark { background: #22221F !important; } /* ── Cards & containers ─────────────────────────────────── */ [data-theme="dark"] .lc-card, [data-theme="dark"] .lc-box { background: #22221F; border-color: rgba(245,240,232,0.06); } /* ── Text colors ────────────────────────────────────────── */ [data-theme="dark"] p, [data-theme="dark"] li, [data-theme="dark"] span, [data-theme="dark"] td, [data-theme="dark"] th, [data-theme="dark"] label { color: #E8E2D6; } [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6 { color: #F5F0E8; } [data-theme="dark"] a { color: #C9A96E; } [data-theme="dark"] a:hover { color: #D4B87E; } /* ── Images ─────────────────────────────────────────────── */ [data-theme="dark"] img:not(.lc-site-header__logo img):not(.lc-darkmode-toggle svg) { filter: brightness(0.88) contrast(1.05); } /* ── Forms ───────────────────────────────────────────────── */ [data-theme="dark"] input, [data-theme="dark"] textarea, [data-theme="dark"] select { background: #2A2924 !important; color: #F5F0E8 !important; border-color: rgba(245,240,232,0.12) !important; } [data-theme="dark"] input::placeholder, [data-theme="dark"] textarea::placeholder { color: rgba(245,240,232,0.35) !important; } [data-theme="dark"] input:focus, [data-theme="dark"] textarea:focus, [data-theme="dark"] select:focus { border-color: #C9A96E !important; outline-color: #C9A96E; } /* ── Language switcher (fixed bottom-left) ──────────────── */ [data-theme="dark"] .lc-lang__btn { background: #2A2924; } [data-theme="dark"] .lc-lang__dd { background: #2A2924; box-shadow: 0 6px 24px rgba(0,0,0,0.5); } [data-theme="dark"] .lc-lang__dd a { color: #F5F0E8; } [data-theme="dark"] .lc-lang__dd a:hover { background: rgba(201,169,110,0.1); } /* ── Footer ─────────────────────────────────────────────── */ [data-theme="dark"] footer, [data-theme="dark"] #footer, [data-theme="dark"] .footer { background: #141412 !important; color: #B5A88E; } /* ── Borders & dividers ─────────────────────────────────── */ [data-theme="dark"] hr { border-color: rgba(245,240,232,0.08); } /* ── Custom header (site-header) ────────────────────────── */ [data-theme="dark"] .lc-site-header--solid { background: #1A1A18 !important; border-bottom-color: rgba(201,169,110,0.1) !important; } [data-theme="dark"] .lc-site-header--scrolled { background: rgba(26,26,24,0.97) !important; } /* ── Menu CTA in side header ────────────────────────────── */ [data-theme="dark"] .lc-menu-resa a { background: var(--lc-terracotta) !important; } /* ── Smooth transition on theme change ──────────────────── */ html[data-theme] *, html[data-theme] *::before, html[data-theme] *::after { transition: background-color 0.4s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; } /* ── Dark mode toggle button ────────────────────────────── */ .lc-darkmode-toggle { display: inline-flex; align-items: center; justify-content: center; background: none; border: none; cursor: pointer; padding: 0; margin: 0; width: 22px; height: 22px; opacity: 0.5; transition: opacity 0.2s ease, transform 0.2s ease; } .lc-darkmode-toggle:hover { opacity: 1; transform: scale(1.15); } .lc-darkmode-toggle svg { width: 20px; height: 20px; fill: none; stroke: #C9A96E; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; transition: transform 0.5s ease; } /* Sun rays */ .lc-darkmode-toggle .lc-sun-ray { transform-origin: center; transition: opacity 0.4s ease, transform 0.5s ease; } .lc-darkmode-toggle .lc-sun-ray line { transition: opacity 0.4s ease, transform 0.5s ease; transform-origin: center; } /* Moon mask */ .lc-darkmode-toggle .lc-moon-mask { transition: transform 0.5s ease; transform: translateX(-8px); } /* Center circle */ .lc-darkmode-toggle .lc-sun-core { transition: transform 0.5s ease; transform-origin: center; } /* ── Dark state: morph sun -> moon ──────────────────────── */ [data-theme="dark"] .lc-darkmode-toggle { opacity: 0.7; } [data-theme="dark"] .lc-darkmode-toggle:hover { opacity: 1; } [data-theme="dark"] .lc-darkmode-toggle .lc-sun-ray { opacity: 0; transform: scale(0) rotate(60deg); } [data-theme="dark"] .lc-darkmode-toggle .lc-moon-mask { transform: translateX(0); } [data-theme="dark"] .lc-darkmode-toggle .lc-sun-core { transform: scale(0.75); } [data-theme="dark"] .lc-darkmode-toggle svg { transform: rotate(-45deg); } /* ── Header toggle (mobile/top bar) ─────────────────────── */ .lc-darkmode-toggle--header { margin-right: 8px; } .lc-darkmode-toggle--header svg { stroke: var(--lc-dark, #1A1A18); } .lc-site-header--transparent .lc-darkmode-toggle--header svg { stroke: #F5F0E8; } .lc-site-header--scrolled .lc-darkmode-toggle--header svg, .lc-site-header--solid .lc-darkmode-toggle--header svg { stroke: var(--lc-dark, #1A1A18); } [data-theme="dark"] .lc-darkmode-toggle--header svg { stroke: #C9A96E !important; } /* Moon mask must match header bg */ .lc-site-header--transparent .lc-darkmode-toggle--header .lc-moon-mask { fill: transparent; } .lc-site-header--scrolled .lc-darkmode-toggle--header .lc-moon-mask { fill: #fff; } [data-theme="dark"] .lc-darkmode-toggle--header .lc-moon-mask { fill: #1A1A18; } /* ── Inline bg overrides (The7 + page templates) ────────── */ [data-theme="dark"] [style*="background-color: #F5F0E8"], [data-theme="dark"] [style*="background-color: #f5f0e8"], [data-theme="dark"] [style*="background: #F5F0E8"], [data-theme="dark"] [style*="background: #f5f0e8"], [data-theme="dark"] [style*="background-color:#F5F0E8"], [data-theme="dark"] [style*="background-color:#f5f0e8"], [data-theme="dark"] [style*="background-color: #EDE7D9"], [data-theme="dark"] [style*="background-color:#ede7d9"], [data-theme="dark"] [style*="background-color: #FFFFFF"], [data-theme="dark"] [style*="background-color:#ffffff"], [data-theme="dark"] [style*="background-color: #fff"], [data-theme="dark"] [style*="background: #fff"], [data-theme="dark"] [style*="background:#fff"] { background-color: #1A1A18 !important; } [data-theme="dark"] [style*="background-color: #1A1A18"], [data-theme="dark"] [style*="background-color:#1a1a18"], [data-theme="dark"] [style*="background: #1A1A18"] { background-color: #22221F !important; } /* ── Fancybox overlay ───────────────────────────────────── */ [data-theme="dark"] .fancybox__backdrop { background: rgba(10,10,8,0.95) !important; } /* ── Scrollbar ──────────────────────────────────────────── */ [data-theme="dark"] ::-webkit-scrollbar { background: #1A1A18; } [data-theme="dark"] ::-webkit-scrollbar-thumb { background: #3A3A34; border-radius: 4px; } [data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #4A4A44; } /* ── Selection ──────────────────────────────────────────── */ [data-theme="dark"] ::selection { background: rgba(201,169,110,0.3); color: #F5F0E8; }