/* ========================================================================== MAGIC BOX FITNESS — AÇIK (BEYAZ) TEMA KATMANI Bu dosya ana koyu temaya DOKUNMAZ. etiketine "light-theme" class'ı eklendiğinde devreye girer. style.css / bilgi-merkezi.css / google-yorumlar.css dosyalarından SONRA çağrılmalıdır ki override edebilsin. ========================================================================== */ /* ------------------------------ Genel ------------------------------ */ html.light-theme body { background-color: #f6f6f8 !important; color: #16171a !important; } /* ------------------------------ Header ------------------------------ */ html.light-theme header { background-color: rgba(255, 255, 255, 0.92) !important; border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important; backdrop-filter: blur(10px) !important; } html.light-theme .menu-linkleri a { color: #5a5a5a !important; } html.light-theme .menu-linkleri a:hover, html.light-theme .menu-linkleri a.aktif { color: #7c8a00 !important; } html.light-theme .menu-linkleri a::after { background-color: #7c8a00 !important; } html.light-theme .canli-durum { background: rgba(0, 0, 0, 0.03) !important; border-color: rgba(0, 0, 0, 0.1) !important; } html.light-theme .canli-durum.acik { color: #6b7d00 !important; } html.light-theme .canli-durum.kapali { color: #d92626 !important; } html.light-theme .geri-sayim { background: rgba(0, 0, 0, 0.03) !important; border-color: rgba(0, 0, 0, 0.1) !important; color: #16171a !important; } html.light-theme .geri-sayim i, html.light-theme .geri-sayim strong { color: #7c8a00 !important; } html.light-theme .header-cta { background-color: #c7d600 !important; color: #0a0a0a !important; } html.light-theme .header-animasyonlu-logo img, html.light-theme .ust-header-logo { filter: brightness(0.15) !important; } /* ------------------------------ Hero (index) ------------------------------ */ html.light-theme .hero-maske, html.light-theme .hero-alani::after { background: rgba(255, 255, 255, 0.85) !important; } html.light-theme .hero-alani h1.premium-font, html.light-theme .premium-font { color: #0a0a0a !important; } html.light-theme .hero-alani p { color: #444444 !important; } html.light-theme .hero-video-overlay { background: radial-gradient(circle, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0.85) 75%, rgba(255,255,255,0.97) 100%) !important; } html.light-theme .hero-video-icerik h1, html.light-theme .hero-video-icerik p { color: #0a0a0a !important; text-shadow: none !important; } /* ------------------------------ Sayfa Başlıkları ------------------------------ */ html.light-theme .baslik-alani h1, html.light-theme .sayfa-baslik h2 { color: #0a0a0a !important; } html.light-theme .baslik-alani p, html.light-theme .sayfa-baslik p { color: #555555 !important; } /* ------------------------------ Günlük Giriş Kartı ------------------------------ */ html.light-theme .gunluk-giris-kart { background: linear-gradient(135deg, rgba(235,59,90,0.06) 0%, rgba(255,255,255,0.97) 100%) !important; border-color: rgba(235,59,90,0.28) !important; } html.light-theme .gunluk-detay h3 { color: #0a0a0a !important; } html.light-theme .gunluk-detay p { color: #666666 !important; } html.light-theme .gunluk-fiyat { color: #0a0a0a !important; } /* ------------------------------ Paketler / Fiyat Kartları ------------------------------ */ html.light-theme .fiyat-kart { background: #ffffff !important; border: 1px solid rgba(0,0,0,0.07) !important; box-shadow: 0 10px 30px rgba(0,0,0,0.06) !important; } html.light-theme .fiyat-kart.vip { background: linear-gradient(180deg, #ffffff 0%, #fbfce4 100%) !important; border-color: #c7d600 !important; } html.light-theme .fiyat-kart h3, html.light-theme .fiyat-rakam { color: #0a0a0a !important; } html.light-theme .fiyat-liste li { color: #333333 !important; } html.light-theme .fiyat-btn.siradan-btn { background: rgba(0,0,0,0.04) !important; border: 1px solid rgba(0,0,0,0.12) !important; color: #0a0a0a !important; } html.light-theme .header-cta, html.light-theme .fiyat-btn:not(.siradan-btn) { color: #0a0a0a !important; } /* ------------------------------ Prosedür / Harita Detay / İletişim Kartları ------------------------------ */ html.light-theme .prosedur-liste li span { color: #333333 !important; } html.light-theme .prosedur-liste li span strong { color: #0a0a0a !important; } html.light-theme .harita-kapsayici, html.light-theme .harita-detay-kart, html.light-theme .iletisim-kart, html.light-theme .vip-baglanti-kutusu { background: #ffffff !important; border: 1px solid rgba(0,0,0,0.06) !important; box-shadow: 0 10px 25px rgba(0,0,0,0.05) !important; } html.light-theme .harita-detay-kart h4, html.light-theme .vip-baglanti-kutusu h2, html.light-theme .iletisim-kart .kart-icerik h3 { color: #0a0a0a !important; } html.light-theme .harita-detay-kart p, html.light-theme .vip-baglanti-kutusu p, html.light-theme .iletisim-kart .kart-icerik p { color: #333333 !important; } html.light-theme .saat-satir { color: #555555 !important; border-bottom-color: rgba(0,0,0,0.08) !important; } html.light-theme .saat-satir.hafta-sonu { color: #333333 !important; } html.light-theme .bayram-notu { color: #666666 !important; } html.light-theme .harita-kapsayici iframe, html.light-theme .spec-iletisim-harita iframe { filter: none !important; } /* ------------------------------ Footer (Modern) ------------------------------ */ html.light-theme footer { background-color: #ffffff !important; border-top-color: rgba(0,0,0,0.06) !important; } html.light-theme .footer-Metin { color: #555555 !important; } html.light-theme .custom-modern-footer { background-color: #ffffff !important; border-top: 2px solid rgba(199,214,0,0.35) !important; } html.light-theme .custom-modern-footer h3 { color: #0a0a0a !important; border-left-color: #7c8a00 !important; } html.light-theme .custom-modern-footer .footer-motto { color: #777777 !important; } html.light-theme .custom-modern-footer .sosyal-medya-ikonlari a { background: #f1f1f1 !important; color: #0a0a0a !important; border-color: rgba(0,0,0,0.06) !important; } html.light-theme .custom-modern-footer .footer-btn-link { background: #f1f1f1 !important; color: #444444 !important; border-color: rgba(0,0,0,0.05) !important; } html.light-theme .custom-modern-footer .footer-btn-link i { color: #7c8a00 !important; } html.light-theme .custom-modern-footer .footer-btn-link:hover { background: #e9e9e9 !important; color: #0a0a0a !important; } html.light-theme .custom-modern-footer .sayac-mini-kart { background: #f1f1f1 !important; border-color: rgba(0,0,0,0.05) !important; } html.light-theme .custom-modern-footer .sayac-etiket { color: #666666 !important; } html.light-theme .custom-modern-footer .sayac-sayi { color: #7c8a00 !important; } html.light-theme .custom-modern-footer .telefon-mini-kart { background: #f1f1f1 !important; color: #0a0a0a !important; border-color: rgba(199,214,0,0.45) !important; } html.light-theme .custom-modern-footer .telefon-mini-kart:hover { background: #c7d600 !important; color: #0a0a0a !important; } html.light-theme .custom-modern-footer .footer-alt-bilgi-alani { background: #fafafa !important; border-top-color: rgba(0,0,0,0.05) !important; } html.light-theme .custom-modern-footer .copyright-yazi { color: #888888 !important; } html.light-theme .custom-modern-footer .ip-gosterge-metni { color: #777777 !important; } html.light-theme .custom-modern-footer .ip-blur-text { background: rgba(0,0,0,0.04) !important; color: #0a0a0a !important; } html.light-theme .custom-modern-footer .ip-blur-text.active { color: #7c8a00 !important; } html.light-theme .custom-modern-footer .ip-kayit-notu { color: #999999 !important; } html.light-theme .custom-modern-footer .kapsul-etiket { background: rgba(0,0,0,0.05) !important; color: #666666 !important; } html.light-theme .custom-modern-footer .kapsul-isim { background: rgba(199,214,0,0.18) !important; border-color: rgba(199,214,0,0.4) !important; color: #7c8a00 !important; } /* ------------------------------ Google Yorumlar ------------------------------ */ html.light-theme .google-reviews-section { background-color: #f6f6f8 !important; } html.light-theme .reviews-header h2 { color: #0a0a0a !important; text-shadow: none !important; } html.light-theme .reviews-header p { color: #555555 !important; } html.light-theme .google-rating-summary { background: #ffffff !important; border-color: rgba(0,0,0,0.08) !important; } html.light-theme .scroll-down-arrow { background: #ffffff !important; border-color: rgba(0,0,0,0.08) !important; color: #0a0a0a !important; } html.light-theme .more-reviews-btn { color: #0a0a0a !important; border-color: #7c8a00 !important; } html.light-theme .more-reviews-btn:hover { background-color: #7c8a00 !important; color: #ffffff !important; } /* ------------------------------ Bilgi Merkezi (v2) ------------------------------ */ html.light-theme .info-cta-section-v2 { background-color: #f6f6f8 !important; } html.light-theme .v2-header h2 { color: #0a0a0a !important; } html.light-theme .v2-header p { color: #555555 !important; } html.light-theme .v2-card { background: #ffffff !important; border-color: rgba(0,0,0,0.07) !important; } html.light-theme .v2-card-info h3 { color: #0a0a0a !important; } html.light-theme .v2-card-info p { color: #777777 !important; } html.light-theme .v2-card:hover .v2-card-info p { color: #333333 !important; } html.light-theme .v2-arrow-btn { color: #666666 !important; background: rgba(0,0,0,0.03) !important; border-color: rgba(0,0,0,0.08) !important; } html.light-theme .v2-premium-btn { background-color: #c7d600 !important; color: #0a0a0a !important; } /* ------------------------------ Galeri ------------------------------ */ html.light-theme .galeri-ana-baslik { color: #0a0a0a !important; } html.light-theme .galeri-alt-metin { color: #555555 !important; } html.light-theme .galeri-kart { background-color: #ffffff !important; border-color: rgba(0,0,0,0.07) !important; } /* ------------------------------ Konumumuz (Siber Panel) ------------------------------ */ html.light-theme .konum-baslik-alani h1, html.light-theme .kadro-baslik-alani h1 { color: #0a0a0a !important; } html.light-theme .konum-baslik-alani p { color: #555555 !important; } html.light-theme .harita-detay-kart-yeni { background: #ffffff !important; border-color: rgba(0,0,0,0.07) !important; } html.light-theme .harita-detay-kart-yeni:hover { background: #fafafa !important; } html.light-theme .kart-yazi h4 { color: #0a0a0a !important; } html.light-theme .kart-yazi p { color: #666666 !important; } html.light-theme .saat-tablosu .saat-satir span { color: #777777 !important; } html.light-theme .saat-tablosu .saat-satir strong { color: #0a0a0a !important; } html.light-theme .konum-harita-cercevesi { background: #ffffff !important; border-color: rgba(0,0,0,0.07) !important; } /* ------------------------------ Kadromuz (Yükleniyor Kartı) ------------------------------ */ html.light-theme .siber-loading-kart { background: #ffffff !important; box-shadow: 0 20px 40px rgba(0,0,0,0.08) !important; } html.light-theme .loading-icerik h2 { color: #0a0a0a !important; } html.light-theme .loading-aciklama { color: #666666 !important; } html.light-theme .canli-radar-not { color: #888888 !important; border-top-color: rgba(0,0,0,0.07) !important; } /* ------------------------------ Mobil Alt Bar ------------------------------ */ html.light-theme .mobil-alt-bar { background-color: rgba(255,255,255,0.95) !important; border-top-color: rgba(0,0,0,0.07) !important; } html.light-theme .mobil-alt-bar a { color: #666666 !important; } html.light-theme .mobil-alt-bar a:hover, html.light-theme .mobil-alt-bar a.aktif { color: #7c8a00 !important; } /* ========================================================================== YÜZEN TEMA DEĞİŞTİRME BUTONU ========================================================================== */ .tema-degistir-btn { position: fixed !important; bottom: 30px !important; right: 25px !important; width: 55px !important; height: 55px !important; border-radius: 50% !important; background-color: #121212 !important; color: #e6ff00 !important; border: 1px solid rgba(230, 255, 0, 0.25) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 21px !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important; z-index: 9999 !important; cursor: pointer !important; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; } .tema-degistir-btn:hover { transform: scale(1.08) translateY(-3px) !important; box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5) !important; } html.light-theme .tema-degistir-btn { background-color: #ffffff !important; color: #0a0a0a !important; border-color: rgba(0, 0, 0, 0.1) !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15) !important; } /* Pasif (tıklanamaz) durum — sadece görünür, henüz aktif değil */ .tema-degistir-btn.pasif { cursor: default !important; } .tema-degistir-btn.pasif:hover { transform: none !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important; } /* "Yakında" ipucu balonu — buton solda kaldığından sağa doğru açılır */ .tema-degistir-btn .tema-tooltip { position: absolute !important; right: 70px !important; background-color: #121212 !important; color: #ffffff !important; font-size: 12px !important; font-weight: 700 !important; padding: 8px 14px !important; border-radius: 8px !important; white-space: nowrap !important; opacity: 0 !important; visibility: hidden !important; transition: all 0.3s ease !important; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important; border: 1px solid rgba(255, 255, 255, 0.05) !important; } .tema-degistir-btn .tema-tooltip::before { content: "" !important; position: absolute !important; top: 50% !important; left: 100% !important; transform: translateY(-50%) !important; border-width: 6px !important; border-style: solid !important; border-color: transparent transparent transparent #121212 !important; } .tema-degistir-btn:hover .tema-tooltip { opacity: 1 !important; visibility: visible !important; } @media (max-width: 768px) { .tema-degistir-btn .tema-tooltip { display: none !important; } } /* Mobilde WhatsApp butonuyla çakışmasın diye sağ tarafa, alt barın üstüne alındı */ @media (max-width: 768px) { .tema-degistir-btn { bottom: 85px !important; right: 20px !important; width: 50px !important; height: 50px !important; font-size: 18px !important; } }