/* Theme styles for roxmedia */

/* Light Theme */
body[data-theme="light"] {
  --pico-background-color: #ffffff;
  --card-background-color: #ffffff; /* Cards are white */
  --pico-color: #212529;
  --muted-color: #6c757d;
  --muted-border-color: rgba(0, 0, 0, 0.06);
  --pico-primary: #667eea;
  --border-radius: 50px;
  background-color: #e1e3e6; /* Mobile general background */
  margin: 0 !important;
  padding-top: 0 !important;
}

/* Desktop override for Light Theme */
@media (min-width: 768px) {
  body[data-theme="light"] {
    background-color: #e9ecef !important; /* Desktop general background */
  }
  /* Ensure main container is transparent to show body background */
  body[data-theme="light"] main.container {
    background-color: transparent !important;
  }
  /* Settings and Profile page backgrounds */
  body[data-theme="light"] .settings-page,
  body[data-theme="light"] .profile-wrapper {
    background-color: #e9ecef !important;
  }

  /* Archive page empty state text color */
  body[data-theme="light"] .empty-state h3 {
    color: #3e3f40 !important;
  }
}

/* Dark Theme (Default) */
body[data-theme="dark"] {
  --card-background-color: #1a1c23;
  --muted-border-color: rgba(58, 58, 66, 0.4);
}

body[data-theme="dark"] .media-grid-bg {
  background-color: transparent !important;
  opacity: 0.7 !important; /* Koyu temada da arka plan rengi kaldırıldı */
}

body[data-theme="light"] .content-section,
body[data-theme="light"] .action-button,
body[data-theme="light"] .stat-card {
  background: #ffffff !important; /* Desktop media grid, content grid, quick stats */
  border: none !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
}

body[data-theme="light"] .media-card {
  background: #e9ecef !important; /* Media cards are #e9ecef on desktop */
  border-color: rgba(0, 0, 0, 0.06) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .archive-card {
  background: #e9ecef !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
}

body[data-theme="light"] .auth-card {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 50px 100px rgba(0, 0, 0, 0.15), 0 15px 40px rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .auth-title {
  background: linear-gradient(135deg, #333 0%, #666 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

body[data-theme="light"] .media-grid-bg {
  background-color: transparent !important;
  opacity: 0.85 !important; /* Beyaz temada posterler daha canlı görünsün */
}

body[data-theme="light"] .auth-card input {
  color: #212529 !important;
  background: #f8f9fa !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .auth-card input::placeholder {
  color: #6c757d !important;
}

body[data-theme="light"] .custom-dropdown,
body[data-theme="light"] .dropdown-trigger {
  background: #ffffff !important;
  color: #212529 !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .dropdown-label {
  color: #212529 !important;
}

body[data-theme="light"] .dropdown-menu {
  background: #fff !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .dropdown-option {
  color: #212529 !important;
}

body[data-theme="light"] .dropdown-option:hover {
  background: #f8f9fa !important;
}

body[data-theme="light"] .dropdown-menu .dropdown-item {
  color: #212529 !important;
}

body[data-theme="light"] .dropdown-menu .dropdown-item:hover {
  background: #f8f9fa !important;
}

body[data-theme="light"] .auth-button {
  color: #fff !important;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
  border-radius: 50px !important;
}

body[data-theme="light"] .auth-button span {
  color: #fff !important;
}

body[data-theme="light"] .auth-button i,
body[data-theme="light"] .auth-button svg {
  display: none !important;
}

body[data-theme="light"] .auth-footer a {
  color: #667eea !important;
}

/* Mobile: Settings and Profile cards are white */
@media (max-width: 767px) {
  body[data-theme="light"] .settings-card,
  body[data-theme="light"] .stats-card,
  body[data-theme="light"] .profile-stat-card,
  body[data-theme="light"] .menu-card {
    background: #ffffff !important;
    border: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
  }
}

/* Desktop: Settings and Profile cards are white */
@media (min-width: 768px) {
  body[data-theme="light"] .settings-card,
  body[data-theme="light"] .stats-card,
  body[data-theme="light"] .profile-stat-card,
  body[data-theme="light"] .menu-card {
    background: #ffffff !important;
    border: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08) !important;
  }
}

body[data-theme="light"] .media-poster {
  background: #f8f9fa !important;
}

/* Bu kuralı kaldırdık çünkü logo container'larına arka plan ekledik
body[data-theme="light"] .logo-image,
body[data-theme="light"] .fallout-logo {
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1)) 
          drop-shadow(0 4px 8px rgba(0, 0, 0, 0.08)) 
          drop-shadow(0 8px 16px rgba(0, 0, 0, 0.06)) !important;
}
*/

body[data-theme="light"] .media-info,
body[data-theme="light"] .archive-info {
  background: #e9ecef !important;
  color: #212529 !important;
}

body[data-theme="light"] .media-title,
body[data-theme="light"] .media-platform,
body[data-theme="light"] .media-date,
body[data-theme="light"] .progress-text,
body[data-theme="light"] .archive-title,
body[data-theme="light"] .archive-year,
body[data-theme="light"] .media-card .media-title,
body[data-theme="light"] .media-card .media-platform,
body[data-theme="light"] .media-card .media-date {
  color: #212529 !important;
}

body[data-theme="light"] .nav-item:hover {
  color: #667eea !important;
  background: transparent !important;
  transform: scale(1.2);
}

body[data-theme="dark"] .nav-item:hover {
  background: transparent !important;
  color: #ffffff !important;
  transform: scale(1.2);
}

body[data-theme="light"] .desktop-nav,
body[data-theme="light"] .profile-bar {
  background: #ffffff !important; /* Desktop navigation bars */
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1) !important;
}

/* Mobile navigation bars are white */
@media (max-width: 767px) {
  body[data-theme="light"] .desktop-nav,
  body[data-theme="light"] .profile-bar {
    background: #ffffff !important;
  }
}

body[data-theme="light"] .nav-tooltip {
  background: #ffffff !important;
  color: #212529 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
  opacity: 0;
}

body[data-theme="light"] .nav-item:hover .nav-tooltip {
  opacity: 1 !important;
  visibility: visible !important;
}

body[data-theme="light"] .progress-bar {
  background: rgba(0, 0, 0, 0.1) !important;
}

body[data-theme="light"] .progress-text {
  color: #212529 !important;
}

body[data-theme="light"] .stat-card .stat-number,
body[data-theme="light"] .stat-card .stat-label {
  color: #000000 !important;
}

body[data-theme="light"] .item-count {
  background: rgba(128, 128, 128, 0.75) !important;
  color: #ffffff !important;
}

/* Mobile status bar fix */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  height: 100% !important;
  width: 100% !important;
  overflow-x: hidden !important;
}

/* iOS safe area support */
@supports (padding-top: env(safe-area-inset-top)) {
  body {
    padding-top: env(safe-area-inset-top) !important;
  }
}

/* Remove any top border or bar */
body::before,
body::after {
  display: none !important;
  content: none !important;
}

/* Ensure no top spacing */
.container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.header-wrapper {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body[data-theme="light"] h1.arama-title {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #3e3f40 !important;
  color: #3e3f40 !important;
}

body[data-theme="light"] .sonuc-header h3,
body[data-theme="light"] .populer-section .sonuc-header h3 {
  color: #3e3f40 !important;
}

body[data-theme="light"] .loading-overlay h3,
body[data-theme="light"] .loading-overlay p {
  color: #ffffff !important;
}

.loading-overlay p {
  margin-top: -1.5rem !important;
}

@media (max-width: 768px) {
  body[data-theme="light"] .hero-title {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: #000000 !important;
    color: #000000 !important;
    text-shadow: none !important;
  }

  body[data-theme="light"] .rating-badge {
    background: rgba(0, 0, 0, 0.78) !important;
    border-color: rgba(0, 0, 0, 0.85) !important;
  }

  body[data-theme="light"] .rating-badge .rating-label,
  body[data-theme="light"] .rating-badge .rating-value {
    color: #ffffff !important;
  }

  html[data-theme="light"],
  body[data-theme="light"] {
    background-color: #e9ecef !important;
    opacity: 1 !important;
  }

  body[data-theme="light"] .container,
  body[data-theme="light"] .main-homepage,
  body[data-theme="light"] .homepage-container,
  body[data-theme="light"] .content-grid,
  body[data-theme="light"] .content-section,
  body[data-theme="light"] .media-grid {
    background-color: #e9ecef !important;
    border: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
  }

  body[data-theme="light"] .media-card {
    background: #ffffff !important;
  }

  body[data-theme="light"] .media-info {
    background: #ffffff !important;
  }
}

/* Giriş ekranı poster çerçeveleri - Beyaz tema */
body[data-theme="light"] .media-poster-item {
  background: transparent !important; /* Koyu arka plan kaldırıldı */
  border: none !important; /* Çerçeve kaldırıldı */
  box-shadow: none !important; /* Gölge kaldırıldı */
}

/* Giriş ekranı poster çerçeveleri - Koyu tema (opsiyonel, isterseniz kaldırabilirsiniz) */
body[data-theme="dark"] .media-poster-item {
  border: 1px solid rgba(255, 255, 255, 0.05) !important; /* Daha hafif çerçeve */
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3) !important; /* Daha hafif gölge */
}

/* Auth sayfalarında logo görünürlüğü - Beyaz tema */
body[data-theme="light"] .logo-image {
  filter: none !important;
}

/* Fallout logo için stil */
body[data-theme="light"] .fallout-logo {
  box-shadow: none !important;
  filter: none !important;
}

body[data-theme="light"] .fallout-logo img {
  filter: none !important;
}