/* ============================================================ FİYAT SAYFASI — KARANLIK TEMA ------------------------------------------------------------ Akşam/gece saatlerinde otomatik devreye girer, ziyaretçi isterse düğmeyle sabitler (bkz. fiyatlar.php tema betiği). KAPSAM: Yalnızca iken çalışır ve bu özniteliği YALNIZCA fiyatlar.php koyar. Dosya ust.php'den $sayfa_koyu_tema bayrağıyla yüklendiği için diğer public sayfalar hiç etkilenmez. NEDEN !important: css/fiyatlar.css sayfa gövdesinde, bu dosya ise 'de yükleniyor (FOUC olmasın diye). Yani kaynak sırası bize karşı; eşit özgüllükte fiyatlar.css kazanırdı. Aynı çözüm yonetim/ panelinin karanlık temasında da kullanıldı. PALET: sistem/ (CRM) panelinin ortak paletiyle aynı — ürünün iki tarafı aynı karanlık tonda görünsün. ============================================================ */ html[data-tema="koyu"] { --ozk-sayfa: #111111; /* sayfa zemini */ --ozk-yuzey: #1a1a1a; /* kart, bölüm */ --ozk-yuzey-ic: #212121; /* kart içi kutu */ --ozk-cizgi: #2a2a2a; /* kenarlık, ayraç */ --ozk-cizgi-guclu: #3a3a3a; /* Metin tonları BİLEREK saf beyaz DEĞİL: #ffffff koyu zeminde (~19:1 kontrast) göz alıyor ve okurken yoruyor. Kırık beyaz hem yeterince okunur (~15:1) hem gözü zorlamıyor. Saf beyaz yalnızca renkli zeminde kalır (mavi CTA gibi). */ --ozk-metin: #d5d5d5; --ozk-metin-vurgu: #f0f0f0; --ozk-metin-sonuk: #9e9e9e; --ozk-metin-silik: #808080; --ozk-mavi: #60a5fa; /* koyu zeminde okunur mavi */ --ozk-mor: #818cf8; --ozk-yesil: #4ade80; --ozk-amber: #fbbf24; color-scheme: dark; /* tarayıcı kaydırma çubuğu / form kontrolleri */ } /* ---------- 1) Sayfa ve büyük yüzeyler ---------- */ html[data-tema="koyu"] body, html[data-tema="koyu"] .pricing-page-wrapper { background-color: var(--ozk-sayfa) !important; color: var(--ozk-metin) !important; } /* Üst menü. Footer'a DOKUNULMUYOR: zaten siyah zemin + beyaz metin. */ html[data-tema="koyu"] header.header, html[data-tema="koyu"] .nav-dropdown-content, html[data-tema="koyu"] .nav-dropdown-mega-pro { background-color: var(--ozk-yuzey) !important; border-color: var(--ozk-cizgi) !important; color: var(--ozk-metin) !important; } /* Kart / bölüm ailesi. İsim listesi DOM taramasıyla çıkarıldı; sonundaki geniş [class*="-card"] yakalayıcısı gözden kaçanlar için. */ html[data-tema="koyu"] .pricing-card, html[data-tema="koyu"] .card-content, html[data-tema="koyu"] .enterprise-section, html[data-tema="koyu"] .pricing-integrations-section, html[data-tema="koyu"] .module-comparison-section, html[data-tema="koyu"] .payment-explanation-card, html[data-tema="koyu"] .tco-card, html[data-tema="koyu"] .value-focus-card, html[data-tema="koyu"] .support-stat-card, html[data-tema="koyu"] .plan-finder, html[data-tema="koyu"] .faq-section, html[data-tema="koyu"] [class*="-card"], html[data-tema="koyu"] [class*="-section"] { background-color: var(--ozk-yuzey) !important; border-color: var(--ozk-cizgi) !important; color: var(--ozk-metin) !important; } /* Kart içi açık gri kutular (#f7f7f7 / #f7fafc / #f8fafc ailesi) */ html[data-tema="koyu"] .plan-limits, html[data-tema="koyu"] .plan-capacity, html[data-tema="koyu"] .pk-konusma, html[data-tema="koyu"] .roi-calc, html[data-tema="koyu"] .roi-input-wrap, html[data-tema="koyu"] .trust-strip, html[data-tema="koyu"] .billing-cycle-toggle, html[data-tema="koyu"] .user-count-selector, html[data-tema="koyu"] .fm-sektor-secici, html[data-tema="koyu"] .count-input-group { background-color: var(--ozk-yuzey-ic) !important; border-color: var(--ozk-cizgi) !important; color: var(--ozk-metin) !important; } /* ---------- 2) Metin ---------- */ html[data-tema="koyu"] .main-title, html[data-tema="koyu"] .plan-title, html[data-tema="koyu"] .comparison-title, html[data-tema="koyu"] .enterprise-title, html[data-tema="koyu"] .section-title, html[data-tema="koyu"] h1, html[data-tema="koyu"] h2, html[data-tema="koyu"] h3, html[data-tema="koyu"] h4, html[data-tema="koyu"] h5, html[data-tema="koyu"] h6 { color: var(--ozk-metin-vurgu) !important; } html[data-tema="koyu"] .pricing-page-wrapper p, html[data-tema="koyu"] .pricing-page-wrapper li, html[data-tema="koyu"] .pricing-page-wrapper span, html[data-tema="koyu"] .pricing-page-wrapper td, html[data-tema="koyu"] .pricing-page-wrapper th, html[data-tema="koyu"] .pricing-page-wrapper label, html[data-tema="koyu"] .pricing-page-wrapper small { color: var(--ozk-metin); } /* İkincil/sönük metinler (#6b7280, #4b5563, #666, #757575 ailesi) */ html[data-tema="koyu"] .plan-description, html[data-tema="koyu"] .comparison-subtitle, html[data-tema="koyu"] .pricing-integrations-subtitle, html[data-tema="koyu"] .min-period-info, html[data-tema="koyu"] .kdv-bilgisi, html[data-tema="koyu"] .plan-capacity-headline, html[data-tema="koyu"] .pk-konusma-etiket small, html[data-tema="koyu"] .integrations-line-detail { color: var(--ozk-metin-sonuk) !important; } html[data-tema="koyu"] .plan-capacity-headline strong, html[data-tema="koyu"] .pk-konusma-sayi, html[data-tema="koyu"] .current-price { color: var(--ozk-metin-vurgu) !important; } /* Üstü çizili eski fiyat: koyu zeminde iyice sönük kalmalı */ html[data-tema="koyu"] .original-price { color: var(--ozk-metin-silik) !important; } /* ---------- 3) Tablolar ---------- */ html[data-tema="koyu"] .comparison-table, html[data-tema="koyu"] .comparison-table th, html[data-tema="koyu"] .comparison-table td { background-color: var(--ozk-yuzey) !important; border-color: var(--ozk-cizgi) !important; color: var(--ozk-metin) !important; } html[data-tema="koyu"] .comparison-table tr.group-header, html[data-tema="koyu"] .comparison-table tr.group-header td, html[data-tema="koyu"] td.plan-cell.ozgurkod-col, html[data-tema="koyu"] .tco-card.featured, html[data-tema="koyu"] li.included.fm-sektorel-satir { background-color: #1c2033 !important; /* mavimsi vurgu satırı (#eef2ff karşılığı) */ color: var(--ozk-metin) !important; } html[data-tema="koyu"] .comparison-table tr:hover td { background-color: #232323 !important; } /* ---------- 4) Kanal şeridi ---------- */ /* İkon karoları beyaz zeminliydi; koyu temada marka ikonları parlak beyaz kare içinde yüzüyordu. */ html[data-tema="koyu"] .pk-kanal { background: var(--ozk-yuzey-ic) !important; border-color: var(--ozk-cizgi-guclu) !important; box-shadow: none !important; } html[data-tema="koyu"] .pk-kanal.pk-ek { background: #2a2419 !important; /* amber tonun koyu karşılığı */ border-color: #6b5416 !important; } /* İpucu balonu zaten koyu; koyu zeminde ayrışsın diye kenarlık ver */ html[data-tema="koyu"] .pk-ipucu { background: #000000 !important; border: 1px solid var(--ozk-cizgi-guclu); } html[data-tema="koyu"] .pk-ipucu::after { border-top-color: #000000; } html[data-tema="koyu"] .pk-konusma i { color: var(--ozk-mor) !important; } /* ---------- 5) Rozetler ve durum renkleri ---------- */ html[data-tema="koyu"] .plan-capacity-status { color: var(--ozk-yesil) !important; } html[data-tema="koyu"] .plan-capacity.over .plan-capacity-status { color: var(--ozk-amber) !important; } html[data-tema="koyu"] .plan-capacity-count { background: #1e2a45 !important; color: #93b4fb !important; } html[data-tema="koyu"] .plan-capacity.over .plan-capacity-count { background: #2f2716 !important; color: var(--ozk-amber) !important; } html[data-tema="koyu"] .annual-discount { color: var(--ozk-yesil) !important; } /* Pastel rozetler: tonu koru, parlaklığı düşür. Tek tek hex kovalamak yerine yonetim/ panelindeki filtre yaklaşımı. .trust-strip-item bu listeden ÇIKARILDI: kendi zemini yok, düz metin — karartma onu okunmaz hâle getiriyordu. */ html[data-tema="koyu"] .discount-tag, html[data-tema="koyu"] .badge, html[data-tema="koyu"] [class*="badge"], html[data-tema="koyu"] .enterprise-capacity-chip { filter: brightness(0.85) saturate(1.05); } /* ---------- 6) Form ve düğmeler ---------- */ html[data-tema="koyu"] input, html[data-tema="koyu"] select, html[data-tema="koyu"] textarea { background-color: var(--ozk-yuzey-ic) !important; border-color: var(--ozk-cizgi-guclu) !important; color: var(--ozk-metin) !important; } html[data-tema="koyu"] .count-button { background-color: var(--ozk-yuzey-ic) !important; color: var(--ozk-metin) !important; } /* Siyah CTA düğmesi koyu zeminde kayboluyordu — maviye çevir */ html[data-tema="koyu"] .select-plan-btn { background-color: #2563eb !important; color: #ffffff !important; border-color: #2563eb !important; } html[data-tema="koyu"] .select-plan-btn:hover { background-color: #1d4ed8 !important; } /* Mavi bağlantı rengi YALNIZCA içerik alanında. Genel `a` seçicisi üst menüyü de boyayıp bütün navigasyonu maviye çeviriyordu — header nötr kalmalı (aşağıda §14). */ html[data-tema="koyu"] .pricing-page-wrapper a { color: var(--ozk-mavi); } html[data-tema="koyu"] .integrations-line-link, html[data-tema="koyu"] .pricing-integrations-cta { color: var(--ozk-mavi) !important; } /* ---------- 7) Beyaz zemine basılmış marka logoları ---------- */ /* Entegrasyon logoları beyaz karo içinde duruyordu. */ html[data-tema="koyu"] .pricing-integration-logo { background: var(--ozk-yuzey-ic) !important; border-color: var(--ozk-cizgi-guclu) !important; } /* Checkmark ikonu koyu zeminde görünür kalsın */ html[data-tema="koyu"] .feature-checkmark-icon { filter: brightness(1.25); } /* ---------- 8) Çerez bandı ---------- */ html[data-tema="koyu"] .kvkk-cerez-banner { background-color: var(--ozk-yuzey) !important; border-color: var(--ozk-cizgi) !important; color: var(--ozk-metin) !important; } /* ---------- 9) Tema düğmesi ---------- */ .ozk-tema-dugme { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 42px; height: 42px; padding: 0; border: 1px solid #e2e8f0; border-radius: 30px; background: #f7fafc; color: #4a5568; font-size: 15px; cursor: pointer; transition: background-color .2s ease, color .2s ease, border-color .2s ease; } .ozk-tema-dugme:hover { background: #edf2f7; } .ozk-tema-dugme:focus-visible { outline: 2px solid #4f46e5; outline-offset: 2px; } /* İkonlar tıklamayı yutmasın, olay her zaman düğmeye gitsin */ .ozk-tema-dugme i { pointer-events: none; } html[data-tema="koyu"] .ozk-tema-dugme { background: var(--ozk-yuzey-ic) !important; border-color: var(--ozk-cizgi-guclu) !important; color: var(--ozk-amber) !important; } /* Düğme, GİDİLECEK temayı gösterir: açık temadayken ay (koyuya geç), koyu temadayken güneş (açığa dön). Bu yüzden sınıf adları ikonu değil hedefi anlatıyor. */ .ozk-tema-dugme .ozk-ikon-aciga { display: none; } html[data-tema="koyu"] .ozk-tema-dugme .ozk-ikon-koyuya { display: none; } html[data-tema="koyu"] .ozk-tema-dugme .ozk-ikon-aciga { display: inline; } /* ---------- 10) Görselleri yumuşat ---------- */ /* Ekran görüntüleri ve beyaz zeminli PNG'ler koyu temada göz alıyor; hafif karartma yeterli (invert YOK — marka renkleri bozulur). */ html[data-tema="koyu"] .pricing-page-wrapper img:not([class*="logo"]):not(.feature-checkmark-icon):not(.avatar) { filter: brightness(0.92); } /* ============================================================ 11) DÜZELTMELER — koyu zeminde okunmayan metin ve açık çizgiler ------------------------------------------------------------ Dosyanın SONUNDA: kendi önceki kurallarımı da ezmesi gerekiyor. Seçiciler bilerek dar tutuldu; anlamsal renkleri (yeşil durum, amber uyarı, mavi bağlantı) kapsamıyorlar. §2'deki genel p/li/span kuralı !important DEĞİL, bu yüzden fiyatlar.css'in daha özgül `.features-list ul li` kuralı onu yeniyordu: modül adları koyu lacivert (#1a202c) kalıp koyu zeminde okunmuyordu. ============================================================ */ html[data-tema="koyu"] .features-list ul li, html[data-tema="koyu"] .module-checklist li, html[data-tema="koyu"] .module-checklist li.included, html[data-tema="koyu"] .plan-limits small, html[data-tema="koyu"] .plan-limits strong, html[data-tema="koyu"] .integrations-line, html[data-tema="koyu"] .integrations-line-text, html[data-tema="koyu"] .enterprise-feature-item span, html[data-tema="koyu"] .comparison-note, html[data-tema="koyu"] .faq-answer, html[data-tema="koyu"] .faq-question { color: var(--ozk-metin) !important; } /* Açık gri ayraçlar (#f0f0f0 / #e5e5e5 ailesi) */ html[data-tema="koyu"] .features-list ul li, html[data-tema="koyu"] .module-checklist li, html[data-tema="koyu"] .integrations-line, html[data-tema="koyu"] .module-section-title, html[data-tema="koyu"] .pricing-page-wrapper hr, html[data-tema="koyu"] .faq-item { border-color: var(--ozk-cizgi) !important; } /* Sektörel modül satırı: mavimsi vurgu koyu karşılığına */ html[data-tema="koyu"] .fm-sektorel-satir { background-color: #1c2033 !important; border-color: #2b3350 !important; } /* "Daha fazla göster" gibi ikincil düğmeler */ html[data-tema="koyu"] .fm-daha-fazla, html[data-tema="koyu"] [data-fm-sektor-ac] { color: var(--ozk-mavi) !important; border-color: var(--ozk-cizgi-guclu) !important; } /* ---------- 12) Üst kontrol satırı ---------- */ /* Güven şeridi ve sektör etiketi koyu zeminde kayboluyordu */ html[data-tema="koyu"] .trust-strip-item, html[data-tema="koyu"] .fm-sektor-etiket, html[data-tema="koyu"] .user-count-selector, html[data-tema="koyu"] .user-count-selector span { color: var(--ozk-metin) !important; } /* Faturalama anahtarı: seçili seçenek beyaz hapken koyu zeminde göz alıyordu; yüzey tonuna çekildi. */ html[data-tema="koyu"] .toggle-option { color: var(--ozk-metin-sonuk) !important; } html[data-tema="koyu"] .toggle-option.active { background-color: var(--ozk-yuzey) !important; color: var(--ozk-metin-vurgu) !important; } /* Sayı girişi ve sektör seçici okunur kalsın */ html[data-tema="koyu"] .user-count-input, html[data-tema="koyu"] .fm-sektor-select { background-color: var(--ozk-yuzey) !important; color: var(--ozk-metin) !important; border-color: var(--ozk-cizgi-guclu) !important; } /* Tema düğmesi kontrol satırında kendi başına alt satıra düşüp öksüz duruyordu; faturalama anahtarının hemen yanına alındı (fiyatlar.php'de de sıra değişti) ve satır sonuna itilmemesi için esnemesi kapatıldı. */ .billing-and-user-selector-container .ozk-tema-dugme { flex: 0 0 auto; } /* ============================================================ 13) CANLI SAYFADA GÖRÜLEN UYUMSUZLUKLAR ------------------------------------------------------------ Kontrast taramasıyla bulundu (WCAG oranı < 3.0). İki kök neden: a) KENDİ AÇIK ZEMİNİ OLAN ROZETLER: §2'deki genel metin kuralı onlara da açık renk verince açık zemin + açık yazı = görünmez (ör. .enterprise-capacity-chip oranı 1.05'ti). §5'teki `filter: brightness(.85)` bunları kurtarmaya yetmiyor — #e1e9fc'yi ancak #bfc6d6'ya indiriyor, hâlâ açık. Bu yüzden filtre yerine gerçek koyu zemin veriliyor. b) ÖNE ÇIKAN KART EZMESİ: fiyatlar.css:282 bloğu best-value ve expert-choice kartlarında metni #1a202c'ye sabitliyor; benim genel kurallarım daha düşük özgüllükte kaldığı için koyu zeminde koyu yazı çıkıyordu (".period" oranı 1.07). ============================================================ */ /* (a) Açık zeminli rozet/çipler — filtre iptal, gerçek koyu zemin */ html[data-tema="koyu"] .enterprise-capacity-chip, html[data-tema="koyu"] .pricing-integrations-more, html[data-tema="koyu"] .plan-finder-q-no, html[data-tema="koyu"] .top-crm-platform, html[data-tema="koyu"] .pricing-card.expert-choice .badge { background-color: #1c2033 !important; color: var(--ozk-metin) !important; border-color: #2b3350 !important; filter: none !important; } /* Karşılaştırma tablosundaki "yok" işareti */ html[data-tema="koyu"] .not-included-icon { background-color: var(--ozk-cizgi) !important; color: var(--ozk-metin-silik) !important; } /* Mavi zeminli indirim etiketi: açık gri yazı yerine beyaz */ html[data-tema="koyu"] .discount-tag { color: #ffffff !important; filter: none !important; } /* (b) Öne çıkan kartların zorladığı koyu metin */ html[data-tema="koyu"] .pricing-card.best-value .plan-title, html[data-tema="koyu"] .pricing-card.expert-choice .plan-title, html[data-tema="koyu"] .pricing-card.best-value .price-section .current-price, html[data-tema="koyu"] .pricing-card.expert-choice .price-section .current-price, html[data-tema="koyu"] .pricing-card.best-value .features-title, html[data-tema="koyu"] .pricing-card.expert-choice .features-title { color: var(--ozk-metin-vurgu) !important; } html[data-tema="koyu"] .pricing-card.best-value .plan-description, html[data-tema="koyu"] .pricing-card.expert-choice .plan-description, html[data-tema="koyu"] .pricing-card.best-value .price-section .period, html[data-tema="koyu"] .pricing-card.expert-choice .price-section .period, html[data-tema="koyu"] .pricing-card.best-value .features-list ul li, html[data-tema="koyu"] .pricing-card.expert-choice .features-list ul li { color: var(--ozk-metin) !important; } html[data-tema="koyu"] .pricing-card.best-value .annual-discount, html[data-tema="koyu"] .pricing-card.expert-choice .annual-discount { color: var(--ozk-yesil) !important; } /* Destek bölümündeki büyük sayı (#1a202c kalıyordu) */ html[data-tema="koyu"] .support-stat-value, html[data-tema="koyu"] .tco-value, html[data-tema="koyu"] .roi-sonuc-deger { color: var(--ozk-metin-vurgu) !important; } /* ============================================================ 14) ÜST MENÜ (HEADER) TON UYUMU ------------------------------------------------------------ §1'de yalnızca zemini koyulaştırmıştım; header'ın geri kalanı açık tema için tasarlandığı hâliyle kalmıştı: 1. .logo-text SAF SİYAH (#000) — koyu zeminde tamamen görünmez. 2. Mega menü başlıkları/linkleri #111827–#4b5563 aralığında. 3. Scroll'da "liquid glass" efekti (styles.css:360) devreye girip BEYAZ iç parlama gölgeleri basıyor: inset 0 0 2px 1px #ffffff8c inset 0 0 10px 4px #ffffff38 Koyu kapsülün içinde beyaz hâle olarak görünüyor — kullanıcının bildirdiği "ton uyumsuzluğu" büyük ölçüde buydu. ============================================================ */ /* Logo */ html[data-tema="koyu"] header.header .logo-text, html[data-tema="koyu"] header.header .logo-text-light { color: var(--ozk-metin-vurgu) !important; } /* Menü bağlantıları nötr kalsın (mavi DEĞİL) */ html[data-tema="koyu"] header.header .nav-link, html[data-tema="koyu"] header.header .nav-dropdown-btn, html[data-tema="koyu"] header.header .nav-dropdown-btn span { color: var(--ozk-metin) !important; } html[data-tema="koyu"] header.header .nav-link:hover, html[data-tema="koyu"] header.header .nav-dropdown-btn:hover { color: var(--ozk-metin-vurgu) !important; } /* Mega menü içeriği */ html[data-tema="koyu"] .nav-dropdown-content .mega-pro-title, html[data-tema="koyu"] .nav-dropdown-content .mpi-title { color: var(--ozk-metin-vurgu) !important; } html[data-tema="koyu"] .nav-dropdown-content a, html[data-tema="koyu"] .nav-dropdown-content .mpi-desc, html[data-tema="koyu"] .mobile-submenu-link { color: var(--ozk-metin) !important; } html[data-tema="koyu"] .nav-dropdown-content .mega-pro-all, html[data-tema="koyu"] .mobile-submenu-link.mega-pro-all { color: var(--ozk-mavi) !important; } html[data-tema="koyu"] .nav-dropdown-content a:hover { background-color: var(--ozk-yuzey-ic) !important; } /* Cam kapsül: beyaz iç parlamalar yerine ince açık kenar + koyu dış gölge */ html[data-tema="koyu"] header.header.scrolled, html[data-tema="koyu"] body:not(.is-blog-page) header.header.scrolled { background: rgba(26, 26, 26, 0.72) !important; border-color: rgba(255, 255, 255, 0.10) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05), 0 6px 24px rgba(0, 0, 0, 0.45), 0 12px 40px rgba(0, 0, 0, 0.30) !important; } /* Scroll'suz (üstteyken) header da sayfadan ayrışsın */ html[data-tema="koyu"] header.header { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45) !important; } /* js/script.js arka plan parlaklığına göre .header-on-dark ekliyor ve metni beyaza çeviriyor; koyu temada zaten açık olduğu için o kural saf beyaza zorlamasın (göz alan beyaz sorunu header'da da vardı). */ html[data-tema="koyu"] header.header.header-on-dark .nav-link, html[data-tema="koyu"] header.header.header-on-dark .nav-dropdown-btn, html[data-tema="koyu"] header.header.header-on-dark .nav-dropdown-btn span, html[data-tema="koyu"] header.header.header-on-dark .logo-text, html[data-tema="koyu"] header.header.header-on-dark .logo-text-light { color: var(--ozk-metin) !important; } /* ---------- 15) Saf beyaz kalan yerler ---------- */ /* Renkli zemin ÜSTÜNDEKİ beyaz kalır (mavi CTA okunur olmalı); koyu zemin üstündeki beyazlar kırık beyaza çekilir. */ html[data-tema="koyu"] .main-title, html[data-tema="koyu"] .plan-title, html[data-tema="koyu"] .current-price, html[data-tema="koyu"] .comparison-title, html[data-tema="koyu"] .enterprise-title { color: var(--ozk-metin-vurgu) !important; } /* Plan seçici cevap düğmeleri: koyu zemin üstünde saf beyaz yazıyorlardı (kullanıcının "göz alıyor" dediği durum). */ html[data-tema="koyu"] .plan-finder button, html[data-tema="koyu"] .plan-finder-opt { color: var(--ozk-metin) !important; border-color: var(--ozk-cizgi-guclu) !important; } html[data-tema="koyu"] .plan-finder button:hover, html[data-tema="koyu"] .plan-finder-opt:hover { background-color: var(--ozk-yuzey-ic) !important; color: var(--ozk-metin-vurgu) !important; } /* ---------- 16) Son ton düzeltmeleri ---------- */ /* Duyuru şeridi zaten koyu (#262626) ama saf beyaz yazıyordu — sayfanın geri kalanıyla aynı kırık beyaza çekildi. */ html[data-tema="koyu"] .announcement-bar, html[data-tema="koyu"] .announcement-content, html[data-tema="koyu"] .announcement-content strong { color: var(--ozk-metin-vurgu) !important; } html[data-tema="koyu"] .announcement-link { color: var(--ozk-mavi) !important; } /* Header'daki "Hemen Başla": açık temada siyah zemin/beyaz yazı marka stili, ama koyu header (#1a1a1a) üzerinde siyah düğme kayboluyor. Plan kartlarındaki CTA ile aynı maviye alındı — tek bir birincil eylem rengi olsun. */ html[data-tema="koyu"] header.header .btn-primary, html[data-tema="koyu"] .get-started-button { background-color: #2563eb !important; color: #ffffff !important; border-color: #2563eb !important; } html[data-tema="koyu"] header.header .btn-primary:hover, html[data-tema="koyu"] .get-started-button:hover { background-color: #1d4ed8 !important; } /* Alt promo bölümünün açıklaması çok sönüktü (kontrast 2.81) */ html[data-tema="koyu"] .promo-description, html[data-tema="koyu"] .bottom-promo-section p { color: var(--ozk-metin-sonuk) !important; } /* ============================================================ 17) GRADYANLAR VE AÇIK KENARLIKLAR ------------------------------------------------------------ Bu ikisi gözden kaçmıştı çünkü ilk taramalarım yalnızca `background-color` okuyordu — `background-image` (gradyan) ve `border-color` hiç bakılmamıştı. Sayfadaki en büyük parlak alanlar aslında gradyanlardı: .bottom-promo-section linear-gradient(#ffffff → #fef3f6) .quick-answer-box linear-gradient(#f8fafc → #eef2ff) ============================================================ */ html[data-tema="koyu"] .bottom-promo-section { background-image: linear-gradient(var(--ozk-yuzey) 0%, #1f1a1c 100%) !important; background-color: var(--ozk-yuzey) !important; } html[data-tema="koyu"] .quick-answer-box { background-image: linear-gradient(135deg, var(--ozk-yuzey-ic) 0%, #1c2033 100%) !important; background-color: var(--ozk-yuzey-ic) !important; border-color: #2b3350 !important; } /* Açık kenarlıklar (#e0e0e0 – #eef0f3 ailesi). Tarama sonucundaki isimler; `*` ile geniş bir ağ kurmadım çünkü kasıtlı renkli kenarlıkları (amber WhatsApp karosu, mavi öne çıkan kart) da ezip onları ayrıca geri getirmek gerekirdi. */ html[data-tema="koyu"] .mega-pro-title, html[data-tema="koyu"] .mega-pro-foot, html[data-tema="koyu"] .mega-pro-item, html[data-tema="koyu"] .enterprise-header, html[data-tema="koyu"] .enterprise-content, html[data-tema="koyu"] .faq-items-container, html[data-tema="koyu"] .faq-item, html[data-tema="koyu"] .comparison-table tr, html[data-tema="koyu"] .comparison-table td, html[data-tema="koyu"] .comparison-table th, html[data-tema="koyu"] .group-header, html[data-tema="koyu"] .kvkk-cerez-banner .kvkk-btn-secondary, html[data-tema="koyu"] .trust-strip, html[data-tema="koyu"] .plan-finder-q, html[data-tema="koyu"] .value-focus-card, html[data-tema="koyu"] .support-stat-card, html[data-tema="koyu"] .payment-explanation-card, html[data-tema="koyu"] .tco-card { border-color: var(--ozk-cizgi) !important; } /* Chatbot satırı (kanal şeridi altındaki mor kutu) */ html[data-tema="koyu"] .pk-chatbot { background: #1e1a2e !important; border-color: #332b52 !important; color: var(--ozk-metin) !important; } html[data-tema="koyu"] .pk-chatbot .pk-chatbot-ikon { color: var(--ozk-mor) !important; } html[data-tema="koyu"] .pk-chatbot strong { color: var(--ozk-metin-vurgu) !important; }