/* ============================================================ Helles Theme für die statischen Unterseiten (Artikel, Gästebuch, Konditionen, Pfad, Deep, Impressum, Datenschutz …). Greift nur bei und schlägt die Dunkel-Overrides aus v2-theme.css über höhere Spezifität. + Stil des Theme-Schalters (beide Themes). ============================================================ */ /* ---------- Schalter (von theme.js in die Navigation gesetzt) ---------- */ .malexa-nav-right { display: inline-flex; align-items: center; gap: 16px; } .malexa-theme-btn { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 999px; cursor: pointer; background: transparent; border: 1px solid rgba(201,161,74,.35); color: #c9a14a; transition: background .25s, color .25s, border-color .25s, transform .2s; } .malexa-theme-btn:hover { background: #c9a14a; color: #0a0606; transform: scale(1.05); } .malexa-theme-btn .i-sun { display: none; } html[data-theme="light"] .malexa-theme-btn .i-sun { display: inline; } html[data-theme="light"] .malexa-theme-btn .i-moon { display: none; } @media (max-width: 520px) { .malexa-nav-right { gap: 10px; } .malexa-theme-btn { width: 30px; height: 30px; } } /* ---------- Tokens ---------- */ html[data-theme="light"] { --bg: #f8f4ed !important; --bg-2: #f1eade !important; --bg-3: #e9dfce !important; --bg-dark: #1a1110 !important; /* bewusst dunkle Textbänder (z. B. /deep/) bleiben dunkel */ --fg: #1c1210 !important; --fg-2: rgba(28,18,16,.74) !important; --fg-3: rgba(28,18,16,.56) !important; --fg-light: rgba(28,18,16,.86) !important; --accent: #8b0d28 !important; --accent-2: #9e1432 !important; --wine: #8b0d28 !important; --gold: #8a6518 !important; --gold-bright: #d4a04a !important; /* nur auf dunklen Bändern verwendet */ --gold-light: #7d5b14 !important; --line: rgba(28,18,16,.14) !important; --ink: #1c1210 !important; color-scheme: light; } html[data-theme="light"], html[data-theme="light"] body { background: #f8f4ed !important; color: #1c1210 !important; } html[data-theme="light"] ::-webkit-scrollbar-track { background: #f8f4ed; } /* Navigation */ html[data-theme="light"] body nav.topnav, html[data-theme="light"] body .topnav, html[data-theme="light"] body .topbar, html[data-theme="light"] body .apply-top { background: rgba(248,244,237,.86) !important; border-bottom: 1px solid rgba(28,18,16,.12) !important; } html[data-theme="light"] body .topnav a, html[data-theme="light"] body .topnav .brand-mini, html[data-theme="light"] body .topnav .brand, html[data-theme="light"] body .topbar a, html[data-theme="light"] body .apply-top a { color: #1c1210 !important; } html[data-theme="light"] body .topnav .back, html[data-theme="light"] body .topbar .back { color: rgba(28,18,16,.66) !important; } html[data-theme="light"] body .topnav a:hover, html[data-theme="light"] body .topbar a:hover { color: #8a6518 !important; } /* Footer */ html[data-theme="light"] body footer { background: #f1eade !important; color: #1c1210 !important; border-top: 1px solid rgba(28,18,16,.12) !important; } html[data-theme="light"] body footer p, html[data-theme="light"] body footer .copy, html[data-theme="light"] body footer .disclaimer { color: rgba(28,18,16,.62) !important; } /* Inline-Style-Altlasten der V1-Seiten */ html[data-theme="light"] body [style*="#f5f1ea"] { background-color: #f8f4ed !important; } html[data-theme="light"] body [style*="#ebe5d8"] { background-color: #f1eade !important; } html[data-theme="light"] body [style*="color:#161310"], html[data-theme="light"] body [style*="color: #161310"] { color: #1c1210 !important; } html[data-theme="light"] body [style*="color:#5c544a"] { color: rgba(28,18,16,.6) !important; } /* Häufige Bausteine der Unterseiten */ html[data-theme="light"] body .booking, html[data-theme="light"] body .discipline-nav, html[data-theme="light"] body .dnav { background: #f1eade !important; } html[data-theme="light"] body blockquote, html[data-theme="light"] body .pull, html[data-theme="light"] body .quote { color: #2a1d1b !important; } html[data-theme="light"] body .contact, html[data-theme="light"] body .send-btn, html[data-theme="light"] body .card, html[data-theme="light"] body .panel { background: rgba(255,255,255,.55) !important; border-color: rgba(28,18,16,.16) !important; color: #1c1210 !important; } html[data-theme="light"] body .send-btn:hover, html[data-theme="light"] body .contact:hover { background: #8b0d28 !important; color: #fff !important; } html[data-theme="light"] body input, html[data-theme="light"] body textarea, html[data-theme="light"] body select { background: #fffdf9 !important; color: #1c1210 !important; border-color: rgba(28,18,16,.2) !important; } /* /deep/: dunkle Bänder behalten ihre helle Schrift */ html[data-theme="light"] body section.dark { background: #1a1110 !important; color: #ebe5d8 !important; } /* /bewerbung/: Seitenkopf lag im dunklen Theme dunkel auf dunkel (Kontrast 1,1) — gilt für beide Themes */ body .clinical-header h1 { color: var(--fg) !important; } body .clinical-header .lead, body .card-meta { color: var(--fg-2) !important; }