/* * Cetobaşkan - Dark Purple & Neon Theme 
 * Bu CSS dosyası, görseldeki renk paletini HTML yapısına uygular.
 */

:root {
  /* Ana Arka Plan Rengi (Derin Mor/Siyah) */
  --color-bg-body: #0b0510;
  
  /* Kart, Menü ve Sidebar Arka Planları (Koyu Mor) */
  --color-bg-card: #150a21;
  --color-bg-elevated: #1e0e2f;
  
  /* Kenarlık Renkleri (Belirgin Açık Mor) */
  --color-border-light: #30184b;
  --color-border-subtle: #200f35;
  
  /* Marka Ana Rengi (Kayıt Ol butonu ve vurgular için Neon Mor/Pembe) */
  --color-brand-primary: #b829e3;
  --color-brand-primary-dark: #931ab8;
  --color-brand-primary-deeper: #6a0d87;
  
  /* Metin Renkleri */
  --color-text-main: #ffffff;
  --color-text-muted: #9583b3;
}

/* Sayfa Geneli Arka Plan ve Metin */
body, 
html, 
.main-content, 
.bg-bg-body {
  background-color: var(--color-bg-body) !important;
  color: var(--color-text-main) !important;
}

/* Kart ve Menü Arka Plan Sınıfları */
.bg-bg-card,
header,
#notif-dropdown,
#user-dropdown,
.bl-modal-box {
  background-color: var(--color-bg-card) !important;
}

.bg-bg-elevated,
.hover\:bg-bg-elevated:hover {
  background-color: var(--color-bg-elevated) !important;
}

/* Kenarlık Sınıfları */
.border-border-light {
  border-color: var(--color-border-light) !important;
}

.border-border-subtle {
  border-color: var(--color-border-subtle) !important;
}

/* Marka Rengi ve Vurgu Sınıfları */
.text-brand-primary {
  color: var(--color-brand-primary) !important;
}

.bg-brand-primary {
  background-color: var(--color-brand-primary) !important;
}

.bg-brand-primary-dark,
.hover\:bg-brand-primary-dark:hover {
  background-color: var(--color-brand-primary-dark) !important;
}

/* Gradient (Geçişli) Butonlar İçin */
.from-brand-primary {
  --tw-gradient-from: var(--color-brand-primary) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgba(184, 41, 227, 0)) !important;
}
.to-brand-primary {
  --tw-gradient-to: var(--color-brand-primary) !important;
}
.to-brand-primary-dark {
  --tw-gradient-to: var(--color-brand-primary-dark) !important;
}

/* Metin Rengi Düzenlemeleri (Soluk mor-gri) */
.text-zinc-400 { color: #afa1c4 !important; }
.text-zinc-500 { color: var(--color-text-muted) !important; }
.text-zinc-600 { color: #725d8f !important; }

/* * HTML içindeki Inline (Satır İçi) Stilleri Ezme
 * Üst menü butonlarındaki mavi/gri temayı mor temaya çeviriyoruz 
 */
#top-menu-buttons a[style*="background"] {
  background-color: var(--color-bg-card) !important;
  border: 1px solid var(--color-border-light) !important;
  color: var(--color-text-main) !important;
  box-shadow: 0 0 10px rgba(184, 41, 227, 0.1);
}
#top-menu-buttons a[style*="background"]:hover {
  border-color: var(--color-brand-primary) !important;
  background-color: var(--color-bg-elevated) !important;
}

/* Arama Çubuğu Özelleştirmesi */
input[type="search"] {
  background-color: transparent !important;
  color: #ffffff !important;
}
input[type="search"]::placeholder {
  color: var(--color-text-muted) !important;
}
.focus-within\:ring-brand-primary\/10:focus-within {
  --tw-ring-color: rgba(184, 41, 227, 0.25) !important;
}
.focus-within\:border-brand-primary\/40:focus-within {
  border-color: rgba(184, 41, 227, 0.6) !important;
}
kbd {
  background-color: var(--color-bg-body) !important;
  border-color: var(--color-border-light) !important;
  color: var(--color-text-muted) !important;
}

/* Yarı Saydam Beyaz Sınıfları Mor Temaya Uyarlama */
.bg-white\/5 { background-color: rgba(255, 255, 255, 0.03) !important; }
.bg-white\/\[0\.02\] { background-color: rgba(255, 255, 255, 0.015) !important; }
.hover\:bg-white\/10:hover { background-color: rgba(255, 255, 255, 0.06) !important; }

/* Kayan Yazı (Marquee) Gölgeleri İçin */
.marquee-wrapper > div.absolute {
  background: none !important;
}
.marquee-wrapper::before,
.marquee-wrapper::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 80px;
  z-index: 10;
  pointer-events: none;
}
.marquee-wrapper::before {
  left: 0;
  background: linear-gradient(to right, var(--color-bg-body) 10%, transparent);
}
.marquee-wrapper::after {
  right: 0;
  background: linear-gradient(to left, var(--color-bg-body) 10%, transparent);
}

/* Güvenilir Siteler Kart Hover ve Highlight Efektleri */
.ss-card {
  background-color: var(--color-bg-card) !important;
  border-color: var(--color-border-light) !important;
}
.ss-card:hover, .ss-card.ss-highlight {
  border-color: var(--color-brand-primary) !important;
  box-shadow: 0 0 25px rgba(184, 41, 227, 0.2), 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}
.ss-card-bg {
  background: radial-gradient(ellipse at 50% 0%, rgba(184, 41, 227, 0.08) 0%, transparent 70%) !important;
}

/* Bonus Kartları Düzenlemesi */
.bonus-item {
  background-color: var(--color-bg-card) !important;
  border-color: var(--color-border-light) !important;
}
.bonus-item:hover {
  border-color: rgba(184, 41, 227, 0.4) !important;
  background-color: var(--color-bg-elevated) !important;
}
.bg-brand-primary\/15 {
  background-color: rgba(184, 41, 227, 0.15) !important;
}

/* Kaydırma Çubuğu (Scrollbar) Mor Tema Ayarı */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: var(--color-bg-body);
}
::-webkit-scrollbar-thumb {
  background: var(--color-border-light);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-brand-primary);
}