/** * DA « Carnet lumineux » — tokens (lumière naturelle + papier chaud) * * Hiérarchie : fond = mur / pièce (beige clair) ; blocs et surfaces = papier * encadré (crème / blanc cassé). Pont vers --theme-b-* pour les pages existantes * avec la classe .theme-carnet-lumineux sur . * * Usage : * * */ .theme-carnet-lumineux { /* —— Identité DA (préfixe --da-) —— Mur très clair (air / fenêtre) ; bois et CTA plus miel que noyer. */ --da-bg-page: #f7f4ee; --da-bg-page-mid: #f2ede5; --da-bg-page-end: #ebe4da; --da-halo-sun: rgba(255, 236, 212, 0.58); --da-halo-sun-fade: rgba(255, 244, 228, 0.24); --da-surface: #fefbf7; --da-surface-elevated: #ffffff; --da-text: #3a322b; --da-text-muted: #74675b; --da-border: #e8e2d8; --da-border-soft: #f0ebe3; --da-accent-warm: #c49a6c; --da-accent-wood: #a67d52; /* Secondaire « calme / nature » : labels, filets, liens discrets — pas le CTA bois */ --da-accent-sage: #7d8b7e; --da-cta-from: #c49a6c; --da-cta-to: #9e7348; --da-on-cta: #fffefb; --da-shadow-warm: 0 16px 36px rgba(100, 80, 58, 0.05); --da-shadow-card: 0 5px 22px rgba(85, 68, 48, 0.05); --da-shadow-btn: 0 4px 18px rgba(150, 110, 72, 0.16); --da-radius-card: 18px; --da-radius-btn: 12px; --da-radius-pill: 999px; --da-font-sans: "DM Sans", "Nunito", system-ui, sans-serif; --da-font-serif: "Source Serif 4", Georgia, "Times New Roman", serif; /* —— Pont theme-b (composants / controlbar existants) —— */ --theme-b-bg: var(--da-bg-page); --theme-b-surface: var(--da-surface-elevated); --theme-b-subtle: var(--da-bg-page-mid); --theme-b-page-shell: var(--da-bg-page-end); --theme-b-text: var(--da-text); --theme-b-text-muted: var(--da-text-muted); --theme-b-border: var(--da-border); --theme-b-border-strong: rgba(90, 75, 58, 0.2); --theme-b-tag-border: rgba(58, 48, 38, 0.08); --theme-b-primary: #453a30; --theme-b-primary-hover: #342a22; --theme-b-on-primary: #fffdfb; --theme-b-action: var(--da-cta-from); --theme-b-action-hover: var(--da-cta-to); --theme-b-on-action: var(--da-on-cta); --theme-b-accent-sage: var(--da-accent-sage); /* Sage discret : cases à cocher, curseurs natifs — pas sur la typo courante */ accent-color: var(--da-accent-sage); --theme-b-tag-bg: #ebe4da; --theme-b-tag-text: #4a3d32; --theme-b-success-bg: #e0ebe4; --theme-b-success-text: #2d4a38; --theme-b-success-border: rgba(45, 74, 56, 0.18); --theme-b-btn-shadow: var(--da-shadow-btn); --theme-b-btn-shadow-hover: 0 6px 22px rgba(160, 115, 75, 0.2); --theme-b-progress-track: rgba(58, 54, 48, 0.08); --theme-b-danger: #b42318; --theme-b-danger-muted: #c45c54; --theme-b-strength-1: #b45346; --theme-b-strength-2: #c67f2e; --theme-b-strength-3: #6b8f6b; --theme-b-strength-4: #2f5d40; background-color: var(--da-bg-page); color: var(--da-text); font-family: var(--da-font-sans); } .theme-carnet-lumineux ::selection { background: color-mix(in srgb, var(--da-accent-sage) 32%, var(--da-bg-page-mid)); color: var(--da-text); }