/* ============================================================ CARPEDIEM PLATFORM — themes.css 6 thèmes applicables via data-theme sur ============================================================ */ /* ── 1. PRESTIGE GOLD (défaut, sombre) ────────────────────── */ [data-theme="prestige-gold"] { --bg: #0A0A0A; --bg2: #111111; --panel: #141414; --panel2: #1A1A1A; --border: rgba(201,168,76,0.15); --border2: rgba(201,168,76,0.3); --accent: #C9A84C; --accent2: #F0D080; --accent-bg: rgba(201,168,76,0.10); --text: #E8E0D0; --text2: #B0A890; --muted: #666666; --muted2: #999999; --live: #E04040; --admin: #6ABEDF; --input-bg: rgba(255,255,255,0.04); --shadow: rgba(0,0,0,0.6); --scrollbar: rgba(201,168,76,0.2); } /* ── 2. MIDNIGHT BLUE (sombre) ────────────────────────────── */ [data-theme="midnight-blue"] { --bg: #0D1B2A; --bg2: #112236; --panel: #142840; --panel2: #1A3050; --border: rgba(79,195,247,0.15); --border2: rgba(79,195,247,0.3); --accent: #4FC3F7; --accent2: #B3E5FC; --accent-bg: rgba(79,195,247,0.08); --text: #D6EAF8; --text2: #90B4CC; --muted: #4A6A80; --muted2: #7A9DB8; --live: #FF6B6B; --admin: #80DEEA; --input-bg: rgba(255,255,255,0.05); --shadow: rgba(0,10,30,0.7); --scrollbar: rgba(79,195,247,0.2); } /* ── 3. CRIMSON STAGE (sombre) ────────────────────────────── */ [data-theme="crimson-stage"] { --bg: #120808; --bg2: #1A0A0A; --panel: #200C0C; --panel2: #2A1010; --border: rgba(229,57,53,0.18); --border2: rgba(229,57,53,0.35); --accent: #E53935; --accent2: #FF8A80; --accent-bg: rgba(229,57,53,0.10); --text: #F5E0E0; --text2: #C09090; --muted: #6A4040; --muted2: #9A6A6A; --live: #FF6D00; --admin: #F48FB1; --input-bg: rgba(255,255,255,0.04); --shadow: rgba(20,0,0,0.7); --scrollbar: rgba(229,57,53,0.2); } /* ── 4. ARCTIC WHITE (clair) ──────────────────────────────── */ [data-theme="arctic-white"] { --bg: #F7F5F0; --bg2: #EFEDE8; --panel: #FFFFFF; --panel2: #F5F3EE; --border: rgba(26,26,46,0.12); --border2: rgba(26,26,46,0.25); --accent: #1A1A2E; --accent2: #2E2E50; --accent-bg: rgba(26,26,46,0.07); --text: #1A1A2E; --text2: #3A3A5C; --muted: #8888AA; --muted2: #666688; --live: #D32F2F; --admin: #1565C0; --input-bg: rgba(26,26,46,0.05); --shadow: rgba(26,26,46,0.12); --scrollbar: rgba(26,26,46,0.15); } /* ── 5. WARM STAGE (clair) ────────────────────────────────── */ [data-theme="warm-stage"] { --bg: #FDF6EC; --bg2: #F7EEE0; --panel: #FFFFFF; --panel2: #FEF9F2; --border: rgba(184,84,26,0.15); --border2: rgba(184,84,26,0.30); --accent: #B8541A; --accent2: #D4722A; --accent-bg: rgba(184,84,26,0.08); --text: #2C1A0A; --text2: #5C3A1A; --muted: #A07050; --muted2: #7A5030; --live: #C62828; --admin: #1565C0; --input-bg: rgba(184,84,26,0.05); --shadow: rgba(100,50,10,0.15); --scrollbar: rgba(184,84,26,0.15); } /* ── 6. FOREST GREEN (clair) ──────────────────────────────── */ [data-theme="forest-green"] { --bg: #EEF4F0; --bg2: #E4EDE7; --panel: #FFFFFF; --panel2: #F2F8F4; --border: rgba(27,107,58,0.15); --border2: rgba(27,107,58,0.30); --accent: #1B6B3A; --accent2: #2E9E56; --accent-bg: rgba(27,107,58,0.08); --text: #0A2414; --text2: #1A4828; --muted: #6A9878; --muted2: #4A7858; --live: #C62828; --admin: #0277BD; --input-bg: rgba(27,107,58,0.05); --shadow: rgba(10,40,20,0.12); --scrollbar: rgba(27,107,58,0.15); } /* ── SOREL ───────────────────────────────────────────────────── */ [data-theme="sorel"] { --bg: #000000; --bg2: #0A0A0A; --panel: #111111; --panel2: #1A1A1A; --border: #2A2A2A; --border2: #3A3A3A; --text: #FFFFFF; --text2: #E0E0E0; --muted: #666666; --muted2: #888888; --accent: #FFFFFF; --accent2: #CCCCCC; --accent-bg: rgba(255,255,255,0.06); --input-bg: #1A1A1A; --shadow: rgba(0,0,0,0.8); --live: #FFFFFF; --admin: #AAAAAA; } /* ── COLUMBIA ─────────────────────────────────────────────── */ @font-face { font-family: 'GerTT'; src: url('/GerTT_Light.otf') format('opentype'); font-weight: 300; } @font-face { font-family: 'GerTT'; src: url('/GerTT_Medium.otf') format('opentype'); font-weight: 500; } @font-face { font-family: 'GerTT'; src: url('/GerTT_Bold.otf') format('opentype'); font-weight: 700; } [data-theme="columbia"] { --bg: #000000; --bg2: #0A0A0A; --panel: #111111; --panel2: #1A1A1A; --border: #222222; --border2: #2A2A2A; --text: #FFFFFF; --text2: #E8E8E8; --muted: #555555; --muted2: #888888; --accent: #1987C7; --accent2: #1570A8; --accent-bg: rgba(25,135,199,0.10); --input-bg: #161616; --shadow: rgba(0,0,0,0.8); --live: #1987C7; --admin: #1987C7; --font-brand: 'GerTT', sans-serif; } [data-theme="columbia"] body { font-family: 'GerTT', 'DM Sans', sans-serif; } [data-theme="columbia"] nav .brand, [data-theme="columbia"] .ptitle, [data-theme="columbia"] .tabs .tab.on, [data-theme="columbia"] h1, [data-theme="columbia"] h2, [data-theme="columbia"] h3 { font-family: 'GerTT', sans-serif; } [data-theme="columbia"] .btn.bg { background: #1987C7; color: #ffffff; } [data-theme="columbia"] .btn.bg:hover { background: #1570A8; } [data-theme="columbia"] .btn.bo:hover, [data-theme="columbia"] .btn.bo:focus { border-color: #1987C7; color: #1987C7; } [data-theme="columbia"] input:focus, [data-theme="columbia"] select:focus, [data-theme="columbia"] textarea:focus { border-color: #1987C7; outline: none; } [data-theme="columbia"] .tab.on { color: #1987C7; border-bottom-color: #1987C7; } [data-theme="columbia"] a { color: #1987C7; } [data-theme="columbia"] .ldot.on { background: #1987C7; box-shadow: 0 0 0 3px rgba(25,135,199,0.2); } [data-theme="columbia"] .toggle-btn.off { background: #1987C7; } [data-theme="columbia"] .toggle-btn.off:hover { background: #1570A8; } /* ── Logo sizing per theme ──────────────────────────── */ [data-theme="sorel"] #navLogo { height: 28px; } [data-theme="columbia"] #navLogo { height: 32px; } [data-theme="columbia"] #loginLogo { height: 80px; } [data-theme="sorel"] #loginLogo { height: 70px; }