/** * ============================================================================ * LM Brand Theme for Bootstrap 5.3+ * ============================================================================ * * Override delle CSS custom properties di Bootstrap (--bs-*) con i token * brand LM (--lm-*). Si carica DOPO bootstrap.min.css e DOPO * crm-lm-assets/brand/palette/lm-palette.css. * * Ordine di caricamento richiesto nel consumer: * 1. lm-palette.css → definisce --lm-gold-600, --lm-bg-dark, ... * 2. bootstrap.min.css → vendor base con --bs-* di default * 3. bootstrap-theme.css → questo file: mappa --bs-* su --lm-* * 4. lm-extensions.css → opzionale, classi `lm-*` per cosmetica extra * * Dark mode: Bootstrap 5.3+ usa `[data-bs-theme="dark"]` sul ``. * Light mode: `[data-bs-theme="light"]` (default). * Sync con LM custom: applichiamo `data-bs-theme` come single source of truth. * * Brand book ufficiale: cdn.lmscit.com/brand-book/ * Palette source: lm-palette.css v2.13+ ("Roma") * ============================================================================ */ :root { /* Brand colors → Bootstrap palette */ --bs-primary: var(--lm-gold-600, #C8902A); --bs-primary-rgb: 200, 144, 42; --bs-secondary: var(--lm-gold-800, #8B5A10); --bs-secondary-rgb: 139, 90, 16; /* Typography stack */ --bs-font-sans-serif: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --bs-font-monospace: "JetBrains Mono", SFMono-Regular, Menlo, Monaco, Consolas, monospace; --bs-body-font-family: "DM Sans", var(--bs-font-sans-serif); /* Heading / display */ --bs-heading-font-family: "Cormorant Garamond", Georgia, serif; --bs-heading-font-weight: 600; /* Border radius — brand standard */ --bs-border-radius: 0.5rem; --bs-border-radius-sm: 0.375rem; --bs-border-radius-lg: 0.75rem; --bs-border-radius-xl: 1rem; /* Link */ --bs-link-color: var(--lm-gold-600); --bs-link-color-rgb: 200, 144, 42; --bs-link-hover-color: var(--lm-gold-700, #B07F25); --bs-link-hover-color-rgb: 176, 127, 37; } /* Light theme (default) — fondo brand light */ [data-bs-theme="light"], :root:not([data-bs-theme]) { --bs-body-bg: var(--lm-bg-light, #FAF7F2); --bs-body-color: var(--lm-text-light, #2A1F12); --bs-tertiary-bg: var(--lm-surface-light, #FFFFFF); --bs-border-color: var(--lm-border-light, #E8DDD0); --bs-emphasis-color: var(--lm-emphasis-light, #1A130A); } /* Dark theme — fondo brand dark */ [data-bs-theme="dark"] { --bs-body-bg: var(--lm-bg-dark, #0C0A08); --bs-body-color: var(--lm-text-dark, #E8DDD0); --bs-tertiary-bg: var(--lm-surface-dark, #1A1512); --bs-border-color: var(--lm-border-dark, #2E2318); --bs-emphasis-color: var(--lm-emphasis-dark, #FAF7F2); /* Brand glow accent leggermente piu' luminoso su dark */ --bs-primary: var(--lm-gold-500, #D9A332); --bs-primary-rgb: 217, 163, 50; --bs-link-color: var(--lm-gold-500, #D9A332); --bs-link-color-rgb: 217, 163, 50; } /* Heading font family - applicata a tutti i livelli */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: var(--bs-heading-font-family); font-weight: var(--bs-heading-font-weight); } /* .display-* di Bootstrap eredita gia' la heading family via --bs-heading-font-family */ /* Brand-specific button enhancement */ .btn-primary { --bs-btn-color: #fff; --bs-btn-bg: var(--lm-gold-600); --bs-btn-border-color: var(--lm-gold-600); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--lm-gold-700, #B07F25); --bs-btn-hover-border-color: var(--lm-gold-700, #B07F25); --bs-btn-focus-shadow-rgb: 200, 144, 42; --bs-btn-active-bg: var(--lm-gold-800, #8B5A10); --bs-btn-active-border-color: var(--lm-gold-800, #8B5A10); } /* Brand-specific link enhancement */ a.lm-link-brand { background-image: linear-gradient(currentColor, currentColor); background-position: 0 100%; background-repeat: no-repeat; background-size: 100% 1px; transition: background-size 200ms ease-out; text-decoration: none; } a.lm-link-brand:hover { background-size: 0% 1px; }