/* ======================================================================== BETWEENHIM STUDIOS — GLOBAL DARK MODE (injiziert via custom.css.php in ) Betrifft: Body, T4-Template, Header, Outer-Wrapper und alle Seiten ======================================================================== */ /* ── 1. BODY & HTML — nur auf EasySocial-Seiten ────────────── */ /* Auf der Homepage & anderen Nicht-ES-Seiten bleibt body */ /* unverändert damit Hero-Backgrounds etc. korrekt funktionieren */ body.com_easysocial { background-color: #0d0d14 !important; } /* ── 2. T4 HEADER / NAVBAR ──────────────────────────────────── */ /* NUR auf EasySocial-Seiten (body.com_easysocial) abdunkeln. */ /* Auf der Homepage & anderen Seiten bleibt der Header */ /* transparent/original, damit Hero-Images durchscheinen. */ body.com_easysocial #t4-header, body.com_easysocial .t4-header, body.com_easysocial #sp-header, body.com_easysocial .sp-header, body.com_easysocial header, body.com_easysocial #header, body.com_easysocial nav.navbar, body.com_easysocial .navbar, body.com_easysocial .t4-navbar, body.com_easysocial .t4-topbar { /* Transparent — Masthead-Bild soll wie auf allen anderen Seiten durchscheinen */ background-color: transparent !important; background: transparent !important; } /* Navbar-Links — nur auf ES-Seiten */ body.com_easysocial .navbar-nav .nav-link, body.com_easysocial .navbar-nav > li > a, body.com_easysocial .navbar a, body.com_easysocial nav a, body.com_easysocial header a, body.com_easysocial .t4-header a { color: #a0a5b1 !important; transition: color 0.2s ease !important; } body.com_easysocial .navbar-nav .nav-link:hover, body.com_easysocial .navbar a:hover, body.com_easysocial nav a:hover, body.com_easysocial header a:hover { color: #00ffff !important; } body.com_easysocial .navbar-nav .nav-link.active, body.com_easysocial .navbar-nav > li.active > a { color: #00ffff !important; } /* Navbar Dropdown — nur auf ES-Seiten */ body.com_easysocial .navbar .dropdown-menu, body.com_easysocial .t4-header .dropdown-menu, body.com_easysocial nav .dropdown-menu { background-color: #1a1a24 !important; border: 1px solid rgba(0, 255, 255, 0.15) !important; border-radius: 10px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important; } body.com_easysocial .navbar .dropdown-menu .dropdown-item, body.com_easysocial .t4-header .dropdown-menu a { color: #a0a5b1 !important; background: transparent !important; } body.com_easysocial .navbar .dropdown-menu .dropdown-item:hover, body.com_easysocial .t4-header .dropdown-menu a:hover { background: rgba(0, 255, 255, 0.06) !important; color: #00ffff !important; } /* ── 3. SEITEN-WRAPPER — nur auf EasySocial-Seiten ─────────── */ body.com_easysocial #t4-body, body.com_easysocial .t4-body, body.com_easysocial #t4-mainbody, body.com_easysocial .t4-mainbody, body.com_easysocial #t4-maincontent, body.com_easysocial .t4-maincontent, body.com_easysocial .t4-wrapper, body.com_easysocial .t4-content, body.com_easysocial #sp-main-body, body.com_easysocial .sp-main-body, body.com_easysocial #sp-content, body.com_easysocial .sp-content { background-color: #0d0d14 !important; background: #0d0d14 !important; } /* ── 4. SIDEBAR — nur auf ES-Seiten ────────────────────────── */ body.com_easysocial #t4-sidebar, body.com_easysocial .t4-sidebar, body.com_easysocial #sp-sidebar, body.com_easysocial .sp-sidebar, body.com_easysocial #sp-left, body.com_easysocial #sp-right { background-color: #111118 !important; } /* ── 5. FOOTER — nur auf ES-Seiten ─────────────────────────── */ body.com_easysocial #t4-footer, body.com_easysocial .t4-footer, body.com_easysocial footer, body.com_easysocial #footer, body.com_easysocial #sp-footer, body.com_easysocial .sp-footer { background-color: #0d0d14 !important; border-top: 1px solid rgba(255, 255, 255, 0.06) !important; color: #798796 !important; } body.com_easysocial footer a, body.com_easysocial .t4-footer a { color: #798796 !important; } body.com_easysocial footer a:hover, body.com_easysocial .t4-footer a:hover { color: #00ffff !important; } /* ── 6. JOOMLA ALLGEMEIN ────────────────────────────────────── */ /* Joomla-Breadcrumb */ .breadcrumb { background: transparent !important; } .breadcrumb-item a { color: #a0a5b1 !important; } .breadcrumb-item.active { color: #798796 !important; } .breadcrumb-item + .breadcrumb-item::before { color: #4a4a5a !important; } /* Joomla System-Messages */ .alert { border-radius: 8px !important; } .alert-info { background: rgba(0,255,255,0.06) !important; border-color: rgba(0,255,255,0.2) !important; color: #a0a5b1 !important; } .alert-success { background: rgba(0,255,100,0.08) !important; border-color: rgba(0,255,100,0.3) !important; color: #00ff64 !important; } .alert-warning { background: rgba(255,170,0,0.08) !important; border-color: rgba(255,170,0,0.3) !important; color: #ffaa00 !important; } .alert-danger { background: rgba(255,51,102,0.08) !important; border-color: rgba(255,51,102,0.3) !important; color: #ff3366 !important; } /* Joomla Pagination */ .pagination .page-link { background-color: #1a1a24 !important; border-color: rgba(255,255,255,0.1) !important; color: #a0a5b1 !important; } .pagination .page-item.active .page-link { background-color: rgba(0,255,255,0.1) !important; border-color: #00ffff !important; color: #00ffff !important; } .pagination .page-link:hover { background-color: rgba(0,255,255,0.06) !important; color: #00ffff !important; } /* ── 7. EASYSOCIAL BUTTON OVERRIDES (aus EasySocial-Config) ── */ #es .es-mobile-filter-slider .is-active .es-mobile-filter-slider__btn, #es .es-story-privacy .es-privacy .es-privacy-toggle, #es .btn-es-primary { background: #4e72e2 !important; color: #0a78cc !important; border-color: rgba(78,114,226, 0) !important; } #es .btn-es-primary:hover, #es .btn-es-primary:active, #es .btn-es-primary:focus { background-color: #224dd1 !important; } #es .btn-es-danger { background: #f43f5e !important; color: #ffffff !important; border-color: rgba(244,63,94, 0) !important; } #es .btn-es-danger:hover, #es .btn-es-danger:active, #es .btn-es-danger:focus { background-color: #e80d33 !important; } #es .btn-es-danger-o:hover, #es .btn-es-danger-o:active, #es .btn-es-danger-o { color: #f43f5e !important; } #es .btn-es-default { background: #000000 !important; color: #ffffff !important; border: 1px solid rgba(255,255,255, 0.2) !important; } #es .btn-es-success { background: #00a576 !important; color: #ffffff !important; border-color: rgba(0,165,118, 0) !important; } #es .btn-es-success:hover { background-color: #00684a !important; } #es .es-stream .es-stream-content.es-story--bg-1 a { font-weight: 700; text-decoration: underline; color: #000000 !important; } #es .es-stream .es-stream-content.es-story--bg-1 { line-height: 1.5; min-height: 40px; text-align: center; font-size: 20px; font-weight: bold; border-radius: 4px; } #es .es-story--bg-1 .es-story-textfield, #es .es-story--bg-1 { color: #000000 !important; background-image: linear-gradient(to right, #FFD1CD 0%, #D5FFFA 100%) !important;} #es .es-stream .es-stream-content.es-story--bg-2 a { font-weight: 700; text-decoration: underline; color: #000000 !important; } #es .es-stream .es-stream-content.es-story--bg-2 { line-height: 1.5; min-height: 40px; text-align: center; font-size: 20px; font-weight: bold; border-radius: 4px; } #es .es-story--bg-2 .es-story-textfield, #es .es-story--bg-2 { color: #000000 !important; background-image: linear-gradient(to right, #FFAFBC 0%, #FFC3A0 100%) !important;} #es .es-stream .es-stream-content.es-story--bg-3 a { font-weight: 700; text-decoration: underline; color: #FFFFFF !important; } #es .es-stream .es-stream-content.es-story--bg-3 { line-height: 1.5; min-height: 40px; text-align: center; font-size: 20px; font-weight: bold; border-radius: 4px; } #es .es-story--bg-3 .es-story-textfield, #es .es-story--bg-3 { color: #FFFFFF !important; background-image: linear-gradient(to right, #DFAFFD 0%, #4E6FFB 100%) !important;} #es .es-stream .es-stream-content.es-story--bg-4 a { font-weight: 700; text-decoration: underline; color: #000000 !important; } #es .es-stream .es-stream-content.es-story--bg-4 { line-height: 1.5; min-height: 40px; text-align: center; font-size: 20px; font-weight: bold; border-radius: 4px; } #es .es-story--bg-4 .es-story-textfield, #es .es-story--bg-4 { color: #000000 !important; background-image: linear-gradient(to right, #87FCC4 0%, #EBE7B3 100%) !important;} #es .es-stream .es-stream-content.es-story--bg-5 a { font-weight: 700; text-decoration: underline; color: #FFFFFF !important; } #es .es-stream .es-stream-content.es-story--bg-5 { line-height: 1.5; min-height: 40px; text-align: center; font-size: 20px; font-weight: bold; border-radius: 4px; } #es .es-story--bg-5 .es-story-textfield, #es .es-story--bg-5 { color: #FFFFFF !important; background-image: linear-gradient(to right, #ED9286 0%, #D73E68 100%) !important;}