/** * Theme annonce-bdsm.com — Brand Book v1.0 (juin 2026). * * Palette : rose brand #D6426A sur dark profond #0F0F10, typo Plus Jakarta Sans. * Convention Mlb : seules les variables sont definies ici ; les vues/partials * partages consomment var(--xyz). On ajoute en plus quelques variables propres * a la landing brand book (--nav, --input, --text2/3, --ph, --brand*). * * Un seul theme ("dark"). On applique les vars sur :root ET * :root[data-theme="dark"] ET :root:not([data-theme]) pour etre robuste aux * residus de localStorage('mlb-theme') herites du toggle retire. */ /* Police brand book — chargee ici pour rester self-contained (beta). A optimiser en dans le a la perf-pass. */ @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;1,600;1,700&display=swap'); :root, :root[data-theme="dark"] { /* --- Surfaces (brand book) --- */ --bg: #0F0F10; --bg2: #161618; --card: #1A1A1C; --card2: #161618; --border: #2A2A2E; /* --- Texte --- */ --text: #E8E4DF; --muted: #8A8078; /* --- Couleurs semantiques (brand book) --- */ --primary: #D6426A; --primary2: #E8758F; --secondary: #E8E4DF; --secondary2: #C9C3BC; --highlight: #E8A04B; --accent3: #00D9C0; --green: #5CB85C; /* --- Glows / radial backgrounds (rgba) --- */ --glow-primary: rgba(214, 66, 106, 0.18); --glow-secondary: rgba(255, 255, 255, 0.04); --glow-highlight: rgba(232, 160, 75, 0.06); /* --- Gradients CTA --- */ --grad: linear-gradient(135deg, #D6426A, #C23560); --grad-h: linear-gradient(135deg, #E8758F, #D6426A); /* --- Typographie & forme (brand book) --- */ --display: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; --display-italic: normal; --display-weight: 700; --display-spacing: -0.02em; --body: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; --radius: 8px; --radius-lg: 16px; --radius-pill: 9999px; /* --- Ombres --- */ --shadow: 0 30px 80px -20px rgba(0,0,0,0.6), 0 0 60px -30px rgba(214,66,106,0.30); /* --- Variables propres a la landing brand book --- */ --nav: #0A0A0B; --input: #111113; --text2: #7A7068; --text3: #5A5048; --ph: #3A3530; --brand: #D6426A; --brand-hover:#C23560; } /* Fallback : aucun data-theme -> applique le dark */ :root:not([data-theme]) { --bg: #0F0F10; --bg2: #161618; --card: #1A1A1C; --card2: #161618; --border: #2A2A2E; --text: #E8E4DF; --muted: #8A8078; --primary: #D6426A; --primary2: #E8758F; --secondary: #E8E4DF; --secondary2: #C9C3BC; --highlight: #E8A04B; --accent3: #00D9C0; --green: #5CB85C; --glow-primary: rgba(214, 66, 106, 0.18); --glow-secondary: rgba(255, 255, 255, 0.04); --glow-highlight: rgba(232, 160, 75, 0.06); --grad: linear-gradient(135deg, #D6426A, #C23560); --grad-h: linear-gradient(135deg, #E8758F, #D6426A); --display: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; --display-italic: normal; --display-weight: 700; --display-spacing: -0.02em; --body: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; --radius: 8px; --radius-lg: 16px; --radius-pill: 9999px; --shadow: 0 30px 80px -20px rgba(0,0,0,0.6), 0 0 60px -30px rgba(214,66,106,0.30); --nav: #0A0A0B; --input: #111113; --text2: #7A7068; --text3: #5A5048; --ph: #3A3530; --brand: #D6426A; --brand-hover:#C23560; } /* Transitions globales */ :root { color-scheme: dark; } html { transition: background-color .35s ease, color .35s ease; } body, .card, .surface, button, input, .btn { transition: background-color .35s ease, color .35s ease, border-color .35s ease, box-shadow .35s ease; } /* Accessibilite — reduced motion */ @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } /* Accessibilite — focus visible clavier (WCAG 2.4.7) */ :where(a, button, input, textarea, select, [role="button"], [tabindex]):focus-visible, .ml-btn:focus-visible, .ml-top-cta:focus-visible, .ml-nav a:focus-visible, .ml-filter:focus-visible, .mlb-tab:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: var(--radius-pill, 8px); } :where(input, textarea, select):focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; } /* Brand annonce-bdsm — "annonce-" (text) + "bdsm" (rose) + ".com" (tertiaire) */ .ml-brand, .lg-brand, .ep-brand, .ab-brand, .ba-brand, .bu-brand, .chat-brand, .pa-brand, .sg-brand, .va-brand, .off-brand { font-family: var(--display); font-weight: 700; letter-spacing: -0.02em; text-transform: none; } .ab-pre, .ab-mid, .ab-com { -webkit-text-fill-color: currentColor; } .ab-pre { color: var(--text); } .ab-mid { color: var(--brand); } .ab-com { color: var(--text3); font-size: 0.62em; font-weight: 400; vertical-align: baseline; }