/* ============================================================ OsezLouer — THEMES VISUELS ------------------------------------------------------------ Chaque theme ne redefinit QUE les design tokens (--ozl-*). Le pont (ozl.theme.bridge.css) se charge de les appliquer aux classes reelles. Selection via l'attribut sur : gere par ozl.theme.manager.pas. Palettes « dans le style de » (couleurs/espacements inspires) ; aucun asset de marque n'est utilise. ============================================================ */ /* ---- 1) OsezLouer (actuel, ameliore) ------------------------- */ /* Creme + emeraude, plus doux et plus aere que l'original. */ [data-ozl-theme="osezlouer"] { --ozl-font: "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, sans-serif; --ozl-bg: #f7f4ee; --ozl-surface: #ffffff; --ozl-surface-2: #fbf6e9; --ozl-ink: #243b35; --ozl-muted: #6f7d78; --ozl-line: #e7e1d3; --ozl-primary: #10b981; --ozl-primary-600: #0d9668; --ozl-primary-ink: #ffffff; --ozl-ok: #10b981; --ozl-warn: #d9822b; --ozl-danger: #e02424; --ozl-radius: 16px; --ozl-radius-sm: 10px; --ozl-shadow: 0 8px 24px rgba(16, 95, 70, 0.10); --ozl-shadow-sm: 0 2px 10px rgba(16, 95, 70, 0.08); --ozl-nav-bg: #eef3ef; --ozl-nav-ink: #243b35; --ozl-nav-active-bg: #10b981; --ozl-nav-active-ink:#ffffff; } /* ---- 2) Airbnb style ----------------------------------------- */ /* Blanc epure, rouge « Rausch », grands arrondis, ombres douces. */ [data-ozl-theme="airbnb"] { --ozl-font: "Circular", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --ozl-bg: #ffffff; --ozl-surface: #ffffff; --ozl-surface-2: #f7f7f7; --ozl-ink: #222222; --ozl-muted: #717171; --ozl-line: #dddddd; --ozl-primary: #ff385c; --ozl-primary-600: #e31c5f; --ozl-primary-ink: #ffffff; --ozl-ok: #008a05; --ozl-warn: #c13515; --ozl-danger: #c13515; --ozl-radius: 12px; --ozl-radius-sm: 12px; --ozl-shadow: 0 6px 16px rgba(0, 0, 0, 0.12); --ozl-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08); --ozl-nav-bg: #ffffff; --ozl-nav-ink: #222222; --ozl-nav-active-bg: #fff0f3; --ozl-nav-active-ink:#e31c5f; } /* ---- 3) Booking style ---------------------------------------- */ /* Bleu profond, interface dense et « boxy », CTA bleu vif. */ [data-ozl-theme="booking"] { --ozl-font: "BlinkMacSystemFont", -apple-system, "Segoe UI", Roboto, Arial, sans-serif; --ozl-bg: #f5f5f5; --ozl-surface: #ffffff; --ozl-surface-2: #ebf3ff; --ozl-ink: #1a1a1a; --ozl-muted: #6b6b6b; --ozl-line: #e0e0e0; --ozl-primary: #0071c2; --ozl-primary-600: #00487a; --ozl-primary-ink: #ffffff; --ozl-ok: #008009; --ozl-warn: #ff8000; --ozl-danger: #cc0000; --ozl-radius: 4px; --ozl-radius-sm: 4px; --ozl-shadow: 0 1px 4px rgba(0, 0, 0, 0.14); --ozl-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.10); --ozl-nav-bg: #003580; --ozl-nav-ink: #ffffff; --ozl-nav-active-bg: #0071c2; --ozl-nav-active-ink:#ffffff; } /* ---- 4) SeLoger style ---------------------------------------- */ /* Blanc clair, accent rouge/framboise, cartes nettes. */ [data-ozl-theme="seloger"] { --ozl-font: "Helvetica Neue", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; --ozl-bg: #f4f4f4; --ozl-surface: #ffffff; --ozl-surface-2: #fdeef1; --ozl-ink: #2b2b2b; --ozl-muted: #6e6e6e; --ozl-line: #e6e6e6; --ozl-primary: #e60043; --ozl-primary-600: #b80036; --ozl-primary-ink: #ffffff; --ozl-ok: #2e9b57; --ozl-warn: #e08600; --ozl-danger: #e60043; --ozl-radius: 8px; --ozl-radius-sm: 6px; --ozl-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); --ozl-shadow-sm: 0 1px 6px rgba(0, 0, 0, 0.06); --ozl-nav-bg: #ffffff; --ozl-nav-ink: #2b2b2b; --ozl-nav-active-bg: #e60043; --ozl-nav-active-ink:#ffffff; } /* ---- 5) Sombre (bonus) --------------------------------------- */ /* Theme nuit neutre, accent emeraude conserve. */ [data-ozl-theme="dark"] { --ozl-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; --ozl-bg: #0f1416; --ozl-surface: #1a2226; --ozl-surface-2: #222d31; --ozl-ink: #e8eef0; --ozl-muted: #95a3a8; --ozl-line: #2c383d; --ozl-primary: #10b981; --ozl-primary-600: #0d9668; --ozl-primary-ink: #06120d; --ozl-ok: #2ecc71; --ozl-warn: #e0a040; --ozl-danger: #ff5a5a; --ozl-radius: 14px; --ozl-radius-sm: 10px; --ozl-shadow: 0 8px 24px rgba(0, 0, 0, 0.45); --ozl-shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.35); --ozl-nav-bg: #1a2226; --ozl-nav-ink: #e8eef0; --ozl-nav-active-bg: #10b981; --ozl-nav-active-ink:#06120d; }