/* ==================================================
   PANELLER VE OYNATICI (PLYR) ÖZELLEŞTİRME
   ================================================== */
:root { 
  --plyr-color-main: var(--accent-primary); 
}

.plyr--video .plyr__controls .plyr__control:hover, 
.plyr--video .plyr__controls .plyr__control[aria-expanded=true] { 
  background: var(--accent-primary) !important; 
  color: var(--text-on-accent) !important; 
}

.plyr--full-ui input[type=range] { 
  color: var(--accent-primary) !important; 
}

.video-player-container .plyr { 
  position: absolute !important; 
  top: 0; 
  left: 0; 
  width: 100% !important; 
  height: 100% !important; 
}

.video-player-section .card { 
  border: none; 
  border-radius: var(--radius-lg); 
  overflow: hidden; 
  box-shadow: var(--shadow-lg); 
  background: var(--bg-secondary);
}

/* ==================================================
   TAB (SEKME) SİSTEMİ
   ================================================== */
.nav-tabs {
  border-bottom: 1px solid var(--border-subtle) !important;
}

.nav-tabs .nav-link { 
  background-color: var(--bg-tertiary) !important; 
  border: 1px solid var(--border-default) !important; 
  color: var(--text-secondary) !important; 
  border-bottom-color: transparent !important;
  margin-right: 4px; 
  border-radius: var(--radius-sm) var(--radius-sm) 0 0; 
  font-weight: 600; 
  transition: all var(--transition);
}

.nav-tabs .nav-link:hover { 
  background-color: var(--bg-secondary) !important; 
  color: var(--accent-primary) !important; 
  border-color: var(--accent-primary) !important;
}

.nav-tabs .nav-link.active { 
  background-color: var(--bg-secondary) !important; 
  color: var(--accent-primary) !important; 
  border-color: var(--border-subtle) !important; 
  border-bottom-color: var(--bg-secondary) !important; 
}

.tab-content { 
  background-color: var(--bg-secondary) !important; 
  border: 1px solid var(--border-subtle) !important; 
  border-top: none !important; 
  border-radius: 0 0 var(--radius-lg) var(--radius-lg); 
  padding: 20px; 
}

/* ==================================================
   FİLM DETAY KUTUSU VE TABLOLAR
   ================================================== */
.film-details-box { 
  background-color: var(--bg-secondary) !important; 
  border: 1px solid var(--border-subtle) !important; 
  border-radius: var(--radius-lg); 
  padding: 2rem; 
  box-shadow: var(--shadow-glow); 
  backdrop-filter: blur(10px); 
}

.film-details-box h1, .film-details-box h1 a { 
  font-family: var(--font-display) !important;
  font-size: 1.6rem !important; 
  font-weight: 700 !important; 
  color: var(--accent-primary) !important;
  text-shadow: var(--shadow-glow) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin: 0 !important;
  position: relative !important;
  padding-left: 15px !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  display: block !important;
}

.film-details-box h1::before {
  content: '';
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 4px;
  width: 4px;
  background-color: var(--accent-primary) !important;
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-glow);
}

.film-ozet { 
  font-style: italic; 
  color: var(--text-secondary); 
  font-size: 0.95rem; 
  line-height: 1.6; 
  margin-top: 1rem; 
  margin-bottom: 1.5rem; 
}

.film-info-table th { 
  color: var(--accent-primary) !important; 
  width: 150px; 
  font-weight: 700;
}

.film-info-table th, .film-info-table td { 
  padding: 0.75rem; 
  border-bottom: 1px solid var(--border-subtle) !important; 
  background: transparent !important; 
  color: var(--text-secondary);
}

.film-info-table td a { 
  color: var(--text-primary); 
  text-decoration: none; 
  border-bottom: 1px dashed var(--accent-primary); 
  transition: all var(--transition);
}

.film-info-table td a:hover {
  color: var(--accent-primary);
  border-bottom-style: solid;
}

/* ==================================================
   ETKİLEŞİM BUTONLARI VE KAYNAKLAR
   ================================================== */
.etkilesim-butonlari { 
  display: flex; 
  gap: 0.75rem; 
  background-color: var(--bg-secondary); 
  padding: 1rem; 
  border-radius: var(--radius-lg); 
  border: 1px solid var(--border-subtle); 
  box-shadow: var(--shadow-md); 
}

.etkilesim-btn { 
  flex: 1; 
  font-size: 1rem; 
  font-weight: 600; 
  padding: 0.75rem; 
  border-radius: var(--radius-sm); 
  border: 1px solid var(--border-default); 
  background-color: var(--bg-tertiary); 
  color: var(--text-secondary); 
  transition: all var(--transition); 
  cursor: pointer; 
}

@media (max-width: 576px) {
  .etkilesim-butonlari { flex-wrap: wrap; gap: 0.5rem; }
  .etkilesim-btn { flex: 1 1 calc(50% - 0.25rem); font-size: 0.85rem; padding: 0.6rem 0.4rem; }
}

.etkilesim-btn:hover { 
  transform: translateY(-3px); 
  box-shadow: var(--shadow-glow); 
  border-color: var(--accent-primary); 
  color: var(--accent-primary);
}

.etkilesim-btn.active-like { background-color: #28a745 !important; border-color: #28a745 !important; color: #fff !important; }
.etkilesim-btn.active-dislike { background-color: #dc3545 !important; border-color: #dc3545 !important; color: #fff !important; }
.etkilesim-btn.active-watchlist { background-color: var(--accent-primary) !important; border-color: var(--accent-primary) !important; color: var(--text-on-accent) !important; }

.source-btn { 
  font-size: 0.85rem; 
  padding: 0.5rem 1rem; 
  border-radius: var(--radius-sm); 
  border: 1px solid var(--border-default); 
  background-color: var(--bg-tertiary); 
  color: var(--text-secondary); 
  transition: all var(--transition); 
  text-transform: uppercase; 
  letter-spacing: 0.5px; 
  font-weight: 600; 
  margin-right: 5px; 
  margin-bottom: 5px; 
}

.source-btn:hover { 
  background-color: var(--bg-secondary); 
  color: var(--accent-primary); 
  border-color: var(--accent-primary); 
}

.source-btn.active { 
  background-color: var(--accent-primary); 
  color: var(--text-on-accent); 
  border-color: var(--accent-primary); 
  box-shadow: var(--shadow-glow); 
}

/* ==================================================
   KAPAK RESMİ VE OYNATICI ALANI
   ================================================== */
.video-player-section .card-body { position: relative; }

#player-cover { 
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  background-size: cover; 
  background-position: center center; 
  cursor: pointer; 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  z-index: 10; 
  margin: 0.5rem; 
  border-radius: var(--radius-md); 
}

#player-cover::after { 
  content: ''; 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  background-color: rgba(0,0,0,0.65); 
  transition: background-color var(--transition); 
  border-radius: var(--radius-md); 
}

#player-cover:hover::after { 
  background-color: rgba(0,0,0,0.45); 
}

#player-play-button { 
  font-size: 80px; 
  color: rgba(255,255,255,0.9); 
  z-index: 11; 
  transition: all var(--transition); 
  text-shadow: 0 0 20px rgba(0,0,0,0.7); 
}

#player-cover:hover #player-play-button { 
  color: var(--accent-primary); 
  transform: scale(1.1); 
}

#video-player-container { display: none; }
#video-player-container iframe, 
#video-player-container video, 
#video-player-container .vibix-player-wrap { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
  border-radius: var(--radius-md); 
}

.film-detay-poster { 
  border-radius: var(--radius-md); 
  cursor: pointer; 
  transition: transform var(--transition), box-shadow var(--transition); 
  border: 2px solid var(--border-default); 
}

.film-detay-poster:hover { 
  transform: scale(1.03); 
  box-shadow: var(--shadow-glow); 
  border-color: var(--accent-primary); 
}

.modal-content { 
  background-color: var(--bg-secondary); 
  border: 1px solid var(--border-subtle); 
  box-shadow: var(--shadow-glow); 
}

.toast.bg-dark { 
  background-color: var(--bg-secondary) !important; 
  border: 1px solid var(--border-subtle); 
  color: var(--text-primary); 
  border-radius: var(--radius-md); 
}

.cevirmen-link { text-decoration: none; display: block; }

/* ==================================================
   YORUM FORMU KAPSAYICISI
   ================================================== */
.comment-box-wrapper { 
  background: var(--bg-secondary); 
  backdrop-filter: blur(10px); 
  border: 1px solid var(--border-subtle); 
  border-radius: var(--radius-lg); 
  padding: 25px; 
  box-shadow: var(--shadow-md); 
  margin-bottom: 40px; 
  position: relative; 
  overflow: hidden; 
}

.comment-box-wrapper::before { 
  content: ''; 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 4px; 
  height: 100%; 
  background: linear-gradient(to bottom, var(--accent-primary), transparent); 
}

.comment-box-title { 
  font-size: 1.2rem; 
  font-weight: 600; 
  color: #fff; 
  margin-bottom: 15px; 
  display: flex; 
  align-items: center; 
  gap: 10px; 
}

.comment-textarea { 
  background-color: var(--bg-tertiary) !important; 
  border: 1px solid var(--border-default) !important; 
  color: var(--text-primary) !important; 
  border-radius: var(--radius-sm); 
  transition: all var(--transition); 
}

.comment-textarea:focus { 
  background-color: var(--bg-elevated) !important; 
  border-color: var(--accent-primary) !important; 
  box-shadow: var(--shadow-glow); 
  color: #fff; 
}

/* ==================================================
   FRANCHISE VE DİZİ HIZLI GEÇİŞ SCROLLBAR
   ================================================== */
.scroll-container-series::-webkit-scrollbar {
  height: 6px;
}

.scroll-container-series::-webkit-scrollbar-track {
  background: var(--bg-primary);
  border-radius: 4px;
}

.scroll-container-series::-webkit-scrollbar-thumb {
  background: var(--border-subtle);
  border-radius: 4px;
}

.scroll-container-series::-webkit-scrollbar-thumb:hover {
  background: var(--accent-primary);
}

.active-franchise-card {
  box-shadow: var(--shadow-glow) !important;
  border-color: var(--accent-primary) !important;
}

.franchise-section .movie-card-wrapper:hover:not(.active-franchise-card) {
  transform: translateY(-5px);
  border-color: var(--accent-primary) !important;
  box-shadow: var(--shadow-glow);
}

.franchise-section .movie-card-wrapper:hover:not(.active-franchise-card) .poster-image {
  transform: scale(1.08);
}

.franchise-section .movie-card-wrapper:hover:not(.active-franchise-card) .play-overlay {
  opacity: 1 !important;
}

.news-section .card:hover {
  transform: translateY(-3px);
  border-color: var(--accent-primary) !important;
  box-shadow: var(--shadow-glow);
}