/* ============================================
   FILMHA DARK THEME - Phase 1
   Colors, Header, Footer, Buttons
   ============================================ */

:root {
  /* Backgrounds */
  --th-bg-dark: #1a1a1a;
  --th-bg-darker: #0f0f0f;
  --th-bg-card: #252525;
  --th-bg-light: #f5f5f5;
  
  /* Accent Colors */
  --th-accent: #e50914;
  --th-accent-hover: #b8070f;
  
  /* Text Colors */
  --th-text-light: #e8e8e8;
  --th-text-muted: #999999;
  --th-text-dark: #1a1a1a;
  
  /* Borders */
  --th-border: #2a2a2a;
  --th-border-light: #e0e0e0;
}

/* ============================================
   1. Top Header Bar
   ============================================ */
#masthead .top-header {
  background-color: var(--th-bg-darker) !important;
  border-bottom: 1px solid var(--th-border);
}

#masthead .top-header .row .social ul li i:hover {
  color: var(--th-accent) !important;
}

/* ============================================
   2. Main Header
   ============================================ */
#masthead .header {
  background-color: var(--th-bg-dark) !important;
  border-bottom: 1px solid var(--th-border);
}

#masthead .header .mobile-search {
  background-color: var(--th-bg-dark) !important;
}

#masthead .poster {
  background-color: var(--th-bg-dark) !important;
}

/* Mobile menu overlay */
#masthead .header .container .menu .navbar #navbar-content {
  background-color: rgba(15, 15, 15, 0.98) !important;
  backdrop-filter: blur(10px);
}

#masthead .header .container .menu .navbar #navbar-content ul li .sub-menu {
  background-color: rgba(20, 20, 20, 0.98) !important;
}

/* ============================================
   3. Main Menu - Hover & Active Item
   ============================================ */
#masthead .header .container .menu .navbar #navbar-content ul li a:hover {
  color: var(--th-accent) !important;
}

@media (min-width: 992px) {
  #masthead .header .container .menu .navbar #navbar-content ul li.current_page_item::after,
  #masthead .header .container .menu .navbar #navbar-content ul li.current-menu-item::after {
    background-color: var(--th-accent) !important;
  }
}

/* ============================================
   4. Search Box
   ============================================ */
#masthead .header .container .search .custom-search-form form.search-form label .search-field {
  border-color: var(--th-border) !important;
  background-color: var(--th-bg-card) !important;
  color: var(--th-text-light) !important;
}

#masthead .header .container .search .custom-search-form form.search-form label .search-field::placeholder {
  color: var(--th-text-muted) !important;
}

/* ============================================
   5. Login/Register Button and Profile Link
   ============================================ */
#masthead .header .container .search button,
#masthead .header .container .search .profile a {
  background-color: var(--th-accent) !important;
  border-color: var(--th-accent) !important;
  color: #fff !important;
  transition: all 0.2s ease;
}

#masthead .header .container .search button:hover,
#masthead .header .container .search .profile a:hover {
  background-color: var(--th-accent-hover) !important;
  border-color: var(--th-accent-hover) !important;
  transform: translateY(-1px);
}

/* ============================================
   6. Footer
   ============================================ */
#colophon {
  background-color: var(--th-bg-darker) !important;
  border-top: 1px solid var(--th-border);
}

#colophon .row .menu nav #navbar-content ul li a:hover {
  color: var(--th-accent) !important;
}

/* ============================================
   7. Notification Bar
   ============================================ */
.alert.notification {
  background-color: var(--th-bg-dark) !important;
  color: var(--th-text-light) !important;
  border: none;
  border-bottom: 1px solid var(--th-border);
}

.alert.notification a {
  background-color: var(--th-accent) !important;
  color: #fff !important;
}

.alert.notification .close,
.alert.notification .btn-close {
  color: var(--th-accent) !important;
  filter: invert(15%) sepia(90%) saturate(5000%) hue-rotate(355deg);
}

/* ============================================
   8. General Buttons & CTA
   ============================================ */
button:not(.navbar-toggler):not(.btn-close),
input[type=submit],
.user-submit {
  background-color: var(--th-accent) !important;
  border-color: var(--th-accent) !important;
  transition: all 0.2s ease;
}

button:not(.navbar-toggler):not(.btn-close):hover,
input[type=submit]:hover,
.user-submit:hover {
  background-color: var(--th-accent-hover) !important;
  border-color: var(--th-accent-hover) !important;
}

/* ============================================
   9. Dark Scrollbar
   ============================================ */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: var(--th-bg-darker);
}

::-webkit-scrollbar-thumb {
  background: var(--th-bg-card);
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--th-accent);
}
/* ============================================
   FILMHA DARK THEME - Phase 2
   Slider (#intro) + Latest Tabs (#latest)
   ============================================ */

/* ============================================
   1. Intro Slider - Content Overlay
   ============================================ */
#intro .item .content {
  background-color: var(--th-bg-dark) !important;
  color: var(--th-text-light) !important;
}

#intro .item .content .title {
  color: #fff !important;
}

#intro .item .content .title:before {
  background-color: var(--th-accent) !important;
}

/* Links inside slider content - gradient underline */
#intro .item .content a:not(.title) {
  color: #fff !important;
}

/* Slider prev/next buttons */
#intro button.next,
#intro button.prev {
  background-color: var(--th-accent) !important;
  transition: all 0.2s ease;
}

#intro button.next:hover,
#intro button.prev:hover {
  background-color: var(--th-accent-hover) !important;
}

/* ============================================
   2. Latest Tabs - Navigation
   ============================================ */
#latest .container .nav.nav-tabs .nav-item a {
  color: var(--th-text-light) !important;
  transition: color 0.2s ease;
}

#latest .container .nav.nav-tabs .nav-item a:before {
  background-color: #4a4a4a !important;
}

#latest .container .nav.nav-tabs .nav-item a.active:before {
  background-color: var(--th-accent) !important;
}

#latest .container .nav.nav-tabs .nav-item a.active {
  color:var(--th-accent) !important;
}

#latest .container .nav.nav-tabs .nav-item a:hover {
  color: var(--th-accent) !important;
}

/* Arrows in tab header */
#latest .container .nav.nav-tabs .button .next-arrow,
#latest .container .nav.nav-tabs .button .prev-arrow {
  color: var(--th-text-light) !important;
}

#latest .container .nav.nav-tabs .button .next-arrow i,
#latest .container .nav.nav-tabs .button .prev-arrow i {
  color: var(--th-accent) !important;
}

/* ============================================
   3. Latest Carousel - Cards
   ============================================ */
#latest .container .tab-content .desktop-carousel .item {
  background-color: var(--th-bg-card) !important;
  border-radius: 8px;
  overflow: hidden;
}

#latest .container .tab-content .desktop-carousel .item .content {
  background-color: var(--th-bg-card) !important;
}

#latest .container .tab-content .desktop-carousel .item .content .text-box .title {
  color: var(--th-text-light) !important;
}

#latest .container .tab-content .desktop-carousel .item .content .text-box .title:before {
  background-color: #4a4a4a !important;
}

#latest .container .tab-content .desktop-carousel .item:hover .content .text-box .title:before {
  background-color: var(--th-accent) !important;
}

/* Hover state */
#latest .container .tab-content .desktop-carousel .item:hover {
  box-shadow: 0 4px 20px rgba(229, 9, 20, 0.15) !important;
}

/* ============================================
   4. Archive Button (بعد از هر تب)
   ============================================ */
#latest .archive-btn a {
  background: var(--th-accent) !important;
  color: #fff !important;
  transition: all 0.2s ease;
}

#latest .archive-btn a:hover {
  background: var(--th-accent-hover) !important;
  transform: translateY(-2px);
}

/* ============================================
   5. Slick Dots (نقطه‌های اسلایدر موبایل)
   ============================================ */
#intro .slick-dots li button:before {
  color: var(--th-text-muted) !important;
}

#intro .slick-dots li.slick-active button:before {
  color: var(--th-accent) !important;
}

/* ============================================
   6. Mobile Collapse Tabs (accordion موبایل)
   ============================================ */
#latest .container #collapse-tab-accordion .card {
  background-color: var(--th-bg-card) !important;
  border-radius: 8px;
}

#latest .container #collapse-tab-accordion .card .card-header {
  background-color: var(--th-bg-card) !important;
}

#latest .container #collapse-tab-accordion .card .card-header .card-title a {
  color: var(--th-text-light) !important;
  border-bottom-color: var(--th-border) !important;
}

#latest .container #collapse-tab-accordion .card .card-header .card-title a:before {
  background-color: var(--th-accent) !important;
}

#latest .container #collapse-tab-accordion .card .card-header .card-title a i {
  color: var(--th-text-light) !important;
}

#latest .container #collapse-tab-accordion .card #series,
#latest .container #collapse-tab-accordion .card #movies {
  background-color: var(--th-bg-dark) !important;
}

#latest .container #collapse-tab-accordion .card #series .item,
#latest .container #collapse-tab-accordion .card #movies .item {
  background: var(--th-bg-card) !important;
  box-shadow: 0 0 4px 1px #000 !important;
}

#latest .container #collapse-tab-accordion .card #series .item .text-box .title,
#latest .container #collapse-tab-accordion .card #movies .item .text-box .title {
  color: var(--th-text-light) !important;
}
/* ============================================
   FILMHA DARK THEME - Phase 3
   Page Background, Section Backgrounds, Headers
   ============================================ */

/* ============================================
   1. Page & Body Backgrounds
   ============================================ */
body,
body.custom-background,
#page,
#content.site-content {
  background-color: var(--th-bg-dark) !important;
}

/* ============================================
   2. Generic Section Headers (Titles + Lines)
   ============================================ */
#news .archive h2,
#dubbed-movies .header .col .title a,
#iranian-movies-series .header .col .title a,
#genre-archive .header .col .title h2,
#post-archive .header .col .title h2,
#all-post h2.title,
#taxonomy .header .col .title h2 {
  color: var(--th-text-light) !important;
}

#news .archive .line,
#dubbed-movies .header .col .line,
#iranian-movies-series .header .col .line,
#genre-archive .header .col .line,
#post-archive .header .col .line,
#taxonomy .header .col .line {
  background-color: var(--th-border) !important;
}

/* ============================================
   3. Section Wrappers
   ============================================ */
#latest,
#news,
#dubbed-movies,
#iranian-movies-series,
#all-post {
  background-color: var(--th-bg-dark) !important;
}

/* ============================================
   4. News Section (ComingSoon + Cinematic News)
   ============================================ */
#news .archive .category a {
  color: var(--th-text-muted) !important;
  transition: color 0.2s ease;
}

#news .archive .category a:hover {
  color: var(--th-accent) !important;
}

#news .posts {
  background-color: var(--th-bg-card) !important;
  border-radius: 8px;
  overflow: hidden;
}

#news .posts .item {
  color: var(--th-text-light) !important;
  border-bottom: 1px solid var(--th-border);
  transition: all 0.2s ease;
}

#news .posts .item:last-child {
  border-bottom: none;
}

#news .posts .item i {
  color: var(--th-text-muted) !important;
}

#news .posts .item:hover {
  color: #fff !important;
  background-color: var(--th-bg-dark) !important;
}

#news .posts .item:hover i {
  color: var(--th-accent) !important;
}

/* ============================================
   5. All-Post Cards (آخرین مطالب)
   ============================================ */
#all-post .container .line {
  background-color: var(--th-bg-card) !important;
  border: 1px solid var(--th-border) !important;
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.2s ease;
}

#all-post .container .line:hover {
  border-color: var(--th-accent);
}

#all-post .container .line .content {
  color: var(--th-text-light) !important;
}

#all-post .container .line .content .info .right .title a,
#all-post .container .line .content .info .right .year span,
#all-post .container .line .content .info .right .language span,
#all-post .container .line .content .info .right a {
  color: var(--th-text-light) !important;
}

#all-post .container .line .content .info .right .ratings,
#all-post .container .line .content .info .right .language,
#all-post .container .line .content .info .right .country,
#all-post .container .line .content .info .right .director,
#all-post .container .line .content .info .right .actors,
#all-post .container .line .content .info .right .description,
#all-post .container .line .content .info .right .year,
#all-post .container .line .content .info .right .genre {
  color: var(--th-text-muted) !important;
}

#all-post .container .line .content .info .left {
  background-color: var(--th-bg-dark) !important;
  color: var(--th-text-muted) !important;
  border-top: 1px solid var(--th-border);
}

#all-post .container .line .content .info .left .comming-soon {
  background-color: var(--th-bg-darker) !important;
  color: var(--th-text-light) !important;
  border-left-color: var(--th-accent) !important;
}

/* ============================================
   6. Archive Buttons (Load More / آرشیو)
   ============================================ */
#all-post .container .more .movie a,
#all-post .container .more .serial a {
  background-color: var(--th-bg-card) !important;
  color: var(--th-text-light) !important;
  transition: all 0.2s ease;
}

#all-post .container .more .movie a:hover,
#all-post .container .more .serial a:hover {
  background-color: var(--th-accent) !important;
  color: #fff !important;
}

#all-post .container .more .load-more {
  background-color: var(--th-accent) !important;
  color: #fff !important;
}

#all-post .container .more .load-more:hover {
  background-color: var(--th-accent-hover) !important;
}
/* ============================================
   FILMHA DARK THEME - Phase 4
   Card Text Fixes, Pagination, Details
   ============================================ */

/* ============================================
   1. All-Post Cards - All Text Colors
   ============================================ */
#all-post .container .line .content .info .right,
#all-post .container .line .content .info .right *,
#all-post .container .line .content .info .right a,
#all-post .container .line .content .info .right p,
#all-post .container .line .content .info .right span,
#all-post .container .line .content .info .right div {
  color: var(--th-text-light) !important;
}

/* Labels (سال تولید، زبان، محصول، ...) */
#all-post .container .line .content .info .right .year,
#all-post .container .line .content .info .right .language,
#all-post .container .line .content .info .right .country,
#all-post .container .line .content .info .right .director,
#all-post .container .line .content .info .right .actors,
#all-post .container .line .content .info .right .genre,
#all-post .container .line .content .info .right .description,
#all-post .container .line .content .info .right .ratings {
  color: var(--th-text-muted) !important;
}

/* Title link */
#all-post .container .line .content .info .right .entry-header .title a {
  color: #fff !important;
  transition: color 0.2s ease;
}

#all-post .container .line .content .info .right .entry-header .title a:hover {
  color: var(--th-accent) !important;
}

/* Icon colors */
#all-post .container .line .content .info .right .entry-header i {
  color: var(--th-text-muted) !important;
}

/* IMDB rating */
#all-post .container .line .content .info .right .ratings p i {
  background-color: #f5c518 !important;
  color: #1a1a1a !important;
}

#all-post .container .line .content .info .right .ratings p .rate,
#all-post .container .line .content .info .right .ratings p .vote {
  color: #f5c518 !important;
}

/* Left side (rate, size, encoder) */
#all-post .container .line .content .info .left {
  background-color: #202020 !important;
  color: var(--th-text-muted) !important;
  border-top: 1px solid var(--th-border);
}

#all-post .container .line .content .info .left * {
  color: var(--th-text-muted) !important;
}

#all-post .container .line .content .info .left .size,
#all-post .container .line .content .info .left .quality,
#all-post .container .line .content .info .left .encoder {
  color: var(--th-text-light) !important;
}

#all-post .container .line .content .info .left .comming-soon {
  background-color: #2a2a2a !important;
  color: #fff !important;
  border-left: 2px solid var(--th-accent) !important;
}

#all-post .container .line .content .info .left .rate .inner-rate {
  color: var(--th-text-light) !important;
}

#all-post .container .line .content .info .left .rate .inner-rate i {
  color: var(--th-accent) !important;
}

/* ============================================
   2. Post Thumbnail Background
   ============================================ */
#all-post .container .line .thumb {
  background-color: var(--th-bg-darker);
}

#all-post .container .line .thumb img {
  display: block;
  margin: 0 auto;
}

/* ============================================
   3. Pagination
   ============================================ */
.navigation,
.navigation.posts-navigation,
.navigation.comment-navigation,
.navigation.post-navigation {
  color: var(--th-text-muted) !important;
}

.navigation li a,
.navigation li a:hover,
.navigation li.disabled {
  color: var(--th-text-muted) !important;
  transition: all 0.2s ease;
}

.navigation li a:hover {
  color: #fff !important;
  background-color: var(--th-bg-card) !important;
}

.navigation li.active a {
  color: #fff !important;
  background-color: var(--th-accent) !important;
}

/* Posts navigation (Next/Prev) */
.posts-navigation .nav-previous a,
.posts-navigation .nav-next a,
.post-navigation .nav-previous a,
.post-navigation .nav-next a {
  color: var(--th-text-light) !important;
  background-color: var(--th-bg-card) !important;
  padding: 10px 18px;
  border-radius: 25px;
  display: inline-block;
  transition: all 0.2s ease;
  font-size: 13px;
}

.posts-navigation .nav-previous a:hover,
.posts-navigation .nav-next a:hover,
.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover {
  background-color: var(--th-accent) !important;
  color: #fff !important;
}

/* ============================================
   4. Empty/Whitespace Elements Fix
   ============================================ */
#all-post .container .line .content .info .right br + div,
#all-post .container .line .content .info .right br {
  display: none;
}

/* ============================================
   5. Special Section - Background Fix
   ============================================ */
#special {
  background-color: var(--th-bg-darker) !important;
  background-blend-mode: overlay;
}

#special .content .title {
  color: #fff !important;
}

#special .content .inner .genre {
  background-color: var(--th-accent) !important;
}

/* ============================================
   6. Dubbed & Iranian Sections - Card Text
   ============================================ */
#dubbed-movies .dubbed-movies .slick-list .item .content,
#iranian-movies-series .dubbed-movies .slick-list .item .content {
  background-color: rgba(20, 20, 20, 0.9) !important;
}

#dubbed-movies .dubbed-movies .slick-list .item .content a.link,
#iranian-movies-series .dubbed-movies .slick-list .item .content a.link {
  background-color: var(--th-accent) !important;
}

/* ============================================
   7. Search Results & Archive Pages
   ============================================ */
#genre-archive,
#post-archive,
.search {
  background-color: var(--th-bg-dark) !important;
}

#genre-archive h2.title,
#post-archive h2.title,
.search h2.title {
  color: var(--th-text-light) !important;
}

/* ============================================
   8. Blog Archive Cards
   ============================================ */
#post-archive .line,
#genre-archive .line {
  background-color: var(--th-bg-card) !important;
  border: 1px solid var(--th-border) !important;
  border-radius: 8px;
  transition: border-color 0.2s ease;
}

#post-archive .line:hover,
#genre-archive .line:hover {
  border-color: var(--th-accent);
}

#post-archive .line .content,
#genre-archive .line .content {
  color: var(--th-text-light) !important;
}

#post-archive .line .content *,
#genre-archive .line .content * {
  color: var(--th-text-light) !important;
}

#post-archive .line .content .entry-header a:hover,
#genre-archive .line .content .entry-header a:hover {
  color: var(--th-accent) !important;
}

#post-archive .date,
#genre-archive .date {
  color: var(--th-text-muted) !important;
}

/* ============================================
   FILMHA DARK THEME - Phase 5
   Single Movie Page (#post-info, #download, #tags)
   ============================================ */

/* ============================================
   1. Post Info - Head (Horizontal Poster)
   ============================================ */
.single #post-info .head {
  background-color: var(--th-bg-darker) !important;
  position: relative;
}

.single #post-info .head .container .gradient .left {
  background: linear-gradient(270deg, rgba(15, 15, 15, 0) 0%, #0f0f0f 95%, #0f0f0f 100%) !important;
}

.single #post-info .head .container .gradient .right {
  background: linear-gradient(90deg, rgba(15, 15, 15, 0) 0%, #0f0f0f 95%, #0f0f0f 100%) !important;
}

.single #post-info .head .container .gradient::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(15, 15, 15, 0.3) 0%, rgba(15, 15, 15, 0.8) 100%);
  z-index: 1;
  pointer-events: none;
}

/* ============================================
   2. Post Info - Intro Section (Title & Details)
   ============================================ */
.single #post-info .intro .content .header .title {
  color: #fff !important;
  font-weight: 500 !important;
}

.single #post-info .intro .content .header .title::before {
  background-color: var(--th-accent) !important;
}

/* View counter */
.single #post-info .intro .content .header .view {
  color: var(--th-text-muted) !important;
}

/* Age rating badge */
.single #post-info .intro .content .inner .age-rate {
  background-color: var(--th-bg-card) !important;
  color: var(--th-text-light) !important;
}

.single #post-info .intro .content .inner .age-rate i {
  color: var(--th-accent) !important;
}

/* Genre tags */
.single #post-info .intro .content .inner .genre {
  background-color: var(--th-accent) !important;
  color: #fff !important;
  transition: all 0.2s ease;
}

.single #post-info .intro .content .inner .genre:hover {
  background-color: var(--th-accent-hover) !important;
  transform: translateY(-1px);
}

/* ============================================
   3. Ratings (IMDB, Rotten, Metacritic)
   ============================================ */
.single #post-info .intro .content .inner .ratings {
  color: var(--th-text-light) !important;
}

.single #post-info .intro .content .inner .ratings .imdb {
  color: var(--th-text-light) !important;
}

.single #post-info .intro .content .inner .ratings .imdb .rate,
.single #post-info .intro .content .inner .ratings .imdb .ten,
.single #post-info .intro .content .inner .ratings .imdb .vote {
  color: #f5c518 !important;
}

.single #post-info .intro .content .inner .ratings .imdb i {
  color: #1a1a1a !important;
  background-color: #f5c518 !important;
}

.single #post-info .intro .content .inner .ratings .rotten .rate,
.single #post-info .intro .content .inner .ratings .metacritic .rate {
  color: #f5c518 !important;
}

.single #post-info .intro .content .inner .ratings .rotten i {
  color: #f93209 !important;
}

.single #post-info .intro .content .inner .ratings .metacritic i {
  color: #f5c518 !important;
}

/* ============================================
   4. Movie Details (Director, Actors, Country, etc.)
   ============================================ */
.single #post-info .intro .content .inner .director,
.single #post-info .intro .content .inner .runtime,
.single #post-info .intro .content .inner .country,
.single #post-info .intro .content .inner .actors,
.single #post-info .intro .content .inner .language,
.single #post-info .intro .content .inner .boxoffice,
.single #post-info .intro .content .inner .year,
.single #post-info .intro .content .inner .subtitle,
.single #post-info .intro .content .inner .dubbing {
  color: var(--th-text-muted) !important;
}

.single #post-info .intro .content .inner .director a,
.single #post-info .intro .content .inner .country a,
.single #post-info .intro .content .inner .actors a,
.single #post-info .intro .content .inner .director span,
.single #post-info .intro .content .inner .runtime span,
.single #post-info .intro .content .inner .language span,
.single #post-info .intro .content .inner .country span,
.single #post-info .intro .content .inner .actors span,
.single #post-info .intro .content .inner .year span,
.single #post-info .intro .content .inner .boxoffice span,
.single #post-info .intro .content .inner .subtitle span,
.single #post-info .intro .content .inner .dubbing span {
  color: var(--th-text-light) !important;
  transition: color 0.2s ease;
}

.single #post-info .intro .content .inner .director a:hover,
.single #post-info .intro .content .inner .country a:hover,
.single #post-info .intro .content .inner .actors a:hover {
  color: var(--th-accent) !important;
}

/* Update notice */
.single #post-info .intro .content .inner .update_notice {
  color: var(--th-accent) !important;
}

/* Description */
.single #post-info .intro .content .inner .desc {
  color: var(--th-text-muted) !important;
}

.single #post-info .intro .content .inner .desc span {
  color: var(--th-text-light) !important;
}

/* Awards & Nominees */
.single #post-info .intro .image .award {
  background-color: #f5c518 !important;
  color: #1a1a1a !important;
}

.single #post-info .intro .image .nominee {
  background-color: var(--th-bg-card) !important;
  color: var(--th-text-light) !important;
}

/* ============================================
   5. Download Section
   ============================================ */
#download.movie {
  background-color: transparent !important;
}

#download.movie .title {
  background-color: var(--th-bg-card) !important;
  border-radius: 8px;
  padding: 0 20px;
}

#download.movie .title h2 {
  color: #fff !important;
}

#download.movie .title span {
  color: var(--th-text-muted) !important;
}

/* Download table rows */
#download.movie .movie .row {
  color: var(--th-text-light) !important;
  border-bottom: 1px solid var(--th-border) !important;
  background-color: var(--th-bg-card);
  border-radius: 6px;
  margin-bottom: 6px;
  transition: all 0.2s ease;
}

#download.movie .movie .row:hover {
  background-color: #2e2e2e;
}

#download.movie .movie .row .quality span,
#download.movie .movie .row .encoder span,
#download.movie .movie .row .size span {
  color: var(--th-text-light) !important;
}

/* Quality indicator dot */
#download.movie .movie .row .quality span::before {
  background-color: var(--th-accent) !important;
}

#download.movie .movie .row .encoder span::before {
  background-color: #4a4a4a !important;
}

#download.movie .movie .row .size span::after {
  background-color: #4a4a4a !important;
}

/* Download badges (Dubbing/Subtitle) */
#download.movie .movie .row .badge .dubbing,
#download.movie .movie .row .badge .subtitle {
  background-color: #f5c518 !important;
  color: #1a1a1a !important;
}

/* ============================================
   6. File Links & Buttons
   ============================================ */
#download .file-links .downloadbtn,
#download .file-links a:not(.report) {
  color: var(--th-text-light) !important;
  background-color: var(--th-bg-darker) !important;
  border: 1px solid var(--th-border) !important;
  font-size: 12px;
  border-radius: 25px;
  padding: 5px 14px;
  transition: all 0.2s ease;
}

#download .file-links .downloadbtn:hover,
#download .file-links a:not(.report):hover {
  color: #fff !important;
  background-color: var(--th-accent) !important;
  border-color: var(--th-accent) !important;
}

/* Main download button */
#download .file-links .link,
#download .file-links a.link {
  color: #fff !important;
  background-color: var(--th-accent) !important;
  border: none;
  border-radius: 25px;
  padding: 6px 20px;
  transition: all 0.2s ease;
}

#download .file-links .link:hover,
#download .file-links a.link:hover {
  background-color: var(--th-accent-hover) !important;
  transform: translateY(-1px);
}

/* Play button (online playback) */
#download .file-links a.play i {
  color: var(--th-text-light) !important;
  border-color: var(--th-border) !important;
  transition: all 0.2s ease;
}

#download .file-links a.play:hover i {
  color: #fff !important;
  background-color: var(--th-accent) !important;
  border-color: var(--th-accent) !important;
}

/* Report icon */
#download .file-links .report i {
  color: var(--th-text-muted) !important;
}

#download .file-links .report:hover i {
  color: var(--th-accent) !important;
}

#download .file-links .report.sent i {
  color: var(--th-accent) !important;
}

/* Empty link placeholder */
#download .file-links a[href=""] {
  color: var(--th-text-muted) !important;
  background-color: transparent !important;
  border: 1px dashed var(--th-border) !important;
}

/* ============================================
   7. Related Posts (مطالب مرتبط)
   ============================================ */
.single .related {
  background-color: transparent !important;
}

.single .related .rpbt_shortcode h3 {
  color: var(--th-text-light) !important;
}

.single .related .rpbt_shortcode h3::after {
  background-color: var(--th-border) !important;
}

.single .related .rpbt_shortcode h3::before {
  background-color: var(--th-accent) !important;
}

.single .related .rpbt_shortcode .item {
  background-color: var(--th-bg-card);
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.single .related .rpbt_shortcode .item:hover {
  box-shadow: 0 4px 20px rgba(229, 9, 20, 0.2);
  transform: translateY(-3px);
}

/* ============================================
   8. Tags Section
   ============================================ */
.single .tags {
  color: var(--th-text-light) !important;
}

.single .tags a {
  color: var(--th-accent) !important;
  transition: all 0.2s ease;
}

.single .tags a:hover {
  color: #fff !important;
  background-color: var(--th-accent);
  padding: 2px 8px;
  border-radius: 4px;
}

/* ============================================
   9. Comments Section
   ============================================ */
.single .comment .comment-title .title {
  color: var(--th-text-light) !important;
}

.single .comment .comment-title .line {
  background-color: var(--th-border) !important;
}

.single .comment #comment-form #commentform .comment-form-comment textarea,
.single .comment #comment-form #commentform input:not(.submit) {
  background-color: var(--th-bg-card) !important;
  border-color: var(--th-border) !important;
  color: var(--th-text-light) !important;
}

.single .comment #comment-form #commentform .comment-form-comment textarea::placeholder,
.single .comment #comment-form #commentform input::placeholder {
  color: var(--th-text-muted) !important;
}

.single .comment #comment-form #commentform input.submit {
  background-color: var(--th-accent) !important;
  color: #fff !important;
  border-color: var(--th-accent) !important;
}

.single .comment .comment-list li {
  border-bottom-color: var(--th-border) !important;
}

.single .comment .comment-list a,
.single .comment .comment-list .commentmetadata,
.single .comment .comment-list p {
  color: var(--th-text-light) !important;
}

/* ============================================
   10. Video Player Modal
   ============================================ */
#video-player .modal-content {
  background-color: var(--th-bg-darker) !important;
  border: 1px solid var(--th-border);
}

#video-player .modal-body {
  background-color: var(--th-bg-darker) !important;
}

/* ============================================
   11. Ad Banners (overlay to darken)
   ============================================ */
.abvertise {
  position: relative;
  background-color: var(--th-bg-dark);
}

.abvertise a {
  display: block;
  position: relative;
}

.abvertise img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
  filter: brightness(0.9);
  transition: filter 0.2s ease;
}

.abvertise a:hover img {
  filter: brightness(1);
}