/*
Theme Name: TopCinma
Theme URI: https://topcinma.example/
Author: Mitatag
Author URI: https://topcinma.example/
Description: قالب ووردبريس عربي احترافي RTL لمشاهدة وتحميل الأفلام والمسلسلات والأنمي بتصميم سيما لايف (TopCinma). يدعم البطاقات الموحدة، المشغل المدمج، روابط التحميل بجودات متعددة، الحلقات، والتصنيفات.
Version: 2.3.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: topcinma
Domain Path: /languages
Tags: rtl-language-support, custom-menu, featured-images, theme-options, translation-ready, threaded-comments, post-thumbnails, custom-post-type
*/

/* =========================================
   1. المتغيرات والأساسيات
   ========================================= */
:root {
    --main-bg: #0e1116;
    --primary-color: #FFA836;
    --text-color: #ffffff;
    --text-muted: #aaaaaa;
    --card-bg: #151a21;
}

* { outline: 0; box-sizing: border-box; padding: 0; margin: 0; position: relative; }
li, ol, ul { list-style: none; padding: 0; margin: 0; }
h1, h2, h3, h4, h5, h6, ul, li { margin: 0; font-family: "Cairo", sans-serif; }
a { text-decoration: none; color: inherit; font-family: "Cairo", sans-serif; transition: 0.3s all ease; }
a:focus, a:hover { text-decoration: none; }
img { max-width: 100%; vertical-align: middle; border-style: none; display: block; }

body {
    font-family: "Cairo", sans-serif;
    direction: rtl;
    font-size: 14px;
    background-color: var(--main-bg);
    color: var(--text-color);
    overflow-x: hidden;
}

*::-webkit-scrollbar { width: 6px; }
*::-webkit-scrollbar-track { background: #33333354; }
*::-webkit-scrollbar-thumb { background-color: var(--primary-color); border-radius: 4px; }

.Content--Wrapper { margin: 0 auto; max-width: 1300px; width: 95%; }

.homepage__bg {
    position: fixed; top: 0; right: 0; left: 0; height: 100%;
    background-size: cover; background-position: center; background-repeat: no-repeat;
    z-index: -1; opacity: 0.08; transition: 0.3s all ease;
}
.homepage__bg::after {
    content: ''; background: linear-gradient(180deg,#1d1d1d14,#02020f 88%);
    position: absolute; bottom: 0; right: 0; left: 0; height: 60%;
}

/* =========================================
   2. الهيدر والقائمة
   ========================================= */
header.Main--Header {
    z-index: 9999; position: fixed; top: 0; right: 0; left: 0;
    transition: 0.35s all ease; border-bottom: 1px solid transparent;
    background: rgba(14, 17, 22, 0.85); backdrop-filter: blur(10px);
}
header.Main--Header.Fixed--Head {
    background: rgba(14, 17, 22, 0.95);
    box-shadow: 0 5px 20px rgba(0,0,0,0.5);
    padding-bottom: 0;
}
header.Main--Header .Content--Wrapper {
    display: flex; flex-wrap: wrap; padding: 15px 0;
    align-items: center; justify-content: space-between; gap: 15px;
}

.Logo--Area h1, .Logo--Area .logo-text {
    font-family: "Anton", sans-serif; font-size: 32px;
    color: var(--primary-color); line-height: 1; margin: 0;
}
.Logo--Area h1 span, .Logo--Area .logo-text span { color: #fff; }
.Logo--Area h1 em, .Logo--Area .logo-text em {
    font-family: "Cairo", sans-serif; font-style: normal;
    display: block; font-size: 12px; color: #fff; font-weight: 900; text-align: center;
}
.Logo--Area img { max-height: 50px; width: auto; }

header.Main--Header nav.Menu--Contents > ul { display: flex; gap: 25px; }
header.Main--Header nav.Menu--Contents > ul > li > a {
    display: block; padding: 8px 0 5px; font-size: 15px; font-weight: 600; position: relative;
}
header.Main--Header nav.Menu--Contents > ul > li > a::after {
    content: ''; position: absolute; bottom: 0; right: 0; width: 0; height: 2px;
    background: var(--primary-color); transition: 0.3s;
}
header.Main--Header nav.Menu--Contents > ul > li > a:hover,
header.Main--Header nav.Menu--Contents > ul > li.current-menu-item > a { color: var(--primary-color); }
header.Main--Header nav.Menu--Contents > ul > li > a:hover::after,
header.Main--Header nav.Menu--Contents > ul > li.current-menu-item > a::after { width: 100%; }

/* Sub-menu */
header.Main--Header nav.Menu--Contents ul.sub-menu {
    position: absolute; top: 100%; right: 0; min-width: 200px;
    background: rgba(14, 17, 22, 0.98); backdrop-filter: blur(10px);
    border-radius: 8px; padding: 10px 0; opacity: 0; visibility: hidden;
    transform: translateY(10px); transition: 0.3s; display: block;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
header.Main--Header nav.Menu--Contents > ul > li:hover > ul.sub-menu {
    opacity: 1; visibility: visible; transform: translateY(0);
}
header.Main--Header nav.Menu--Contents ul.sub-menu li a {
    display: block; padding: 8px 20px; font-size: 13px; color: #ddd;
}
header.Main--Header nav.Menu--Contents ul.sub-menu li a:hover {
    color: var(--primary-color); background: rgba(255,168,54,0.05);
}

header.Main--Header .Header--Search {
    width: 40px; height: 40px; text-align: center; display: flex;
    align-items: center; justify-content: center; font-size: 17px;
    border: 1px solid #ffffff1f; border-radius: 50%; cursor: pointer;
    background: rgba(255,255,255,0.05); transition: 0.3s;
}
header.Main--Header .Header--Search:hover { background: var(--primary-color); color: #000; }

.mobile--bars {
    display: none; align-items: center; justify-content: center;
    width: 45px; height: 45px; background: rgba(255,255,255,0.05);
    backdrop-filter: blur(6px); cursor: pointer; border-radius: 8px; font-size: 20px;
}

/* =========================================
   3. المحتوى الرئيسي والعناوين
   ========================================= */
.main-content { margin-top: 90px; padding-bottom: 50px; }

.TitleBox {
    display: flex; width: 100%; align-items: center; justify-content: space-between;
    margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #ffffff0d;
}
.TitleBox > h2 {
    font-size: 20px; font-weight: 700; position: relative; padding-right: 15px;
}
.TitleBox > h2::before {
    content: ""; height: 20px; width: 4px; background: var(--primary-color);
    border-radius: 2px; display: block; top: 5px; position: absolute; right: 0;
}
.TitleBox > ul { display: flex; align-items: center; gap: 10px; }
.TitleBox ul li a {
    display: block; background: #ffffff0d; padding: 5px 18px;
    border-radius: 35px; font-size: 13px; transition: 0.3s;
}
.TitleBox ul li a.active, .TitleBox ul li a:hover { background: var(--primary-color); color: #000; }

.section-block { margin-bottom: 40px; }

/* =========================================
   4. شبكة البطاقات الموحدة (أفلام ومسلسلات) - مع تأثيرات تفاعلية
   ========================================= */
ul.Posts--List { display: flex; flex-wrap: wrap; margin: 0 -10px; row-gap: 20px; }
ul.Posts--List.SixInRow > div { flex: 0 0 calc(100% / 6); padding: 0 10px; }
ul.Posts--List.FourInRow > div { flex: 0 0 calc(100% / 4); padding: 0 10px; }

/* الإطار الخارجي مع رفع البطاقة وظل برتقالي عند التحويم */
.Small--Box {
    perspective: 1000px;
}
.Small--Box a.recent--block {
    display: block; width: 100%; border-radius: 12px; overflow: hidden;
    background: var(--card-bg);
    transition: transform 0.45s cubic-bezier(.2,.9,.3,1.4),
                box-shadow 0.4s ease,
                border-color 0.3s ease;
    border: 2px solid transparent;
    transform-style: preserve-3d;
    will-change: transform;
}
.Small--Box a.recent--block:hover,
.Small--Box a.recent--block.is-touched {
    transform: translateY(-10px) scale(1.04);
    border-color: var(--primary-color);
    box-shadow:
        0 20px 40px rgba(0, 0, 0, 0.5),
        0 0 30px rgba(255, 168, 54, 0.35),
        0 0 60px rgba(255, 168, 54, 0.15);
    z-index: 5;
}

/* توهج خلفي يتحرك حول البطاقة */
.Small--Box a.recent--block::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 12px;
    background: conic-gradient(from 0deg,
        transparent 0%,
        var(--primary-color) 20%,
        transparent 40%,
        transparent 60%,
        var(--primary-color) 80%,
        transparent 100%);
    opacity: 0;
    z-index: -1;
    transition: opacity 0.4s ease;
    animation: tc-spin 4s linear infinite;
    animation-play-state: paused;
}
.Small--Box a.recent--block:hover::before,
.Small--Box a.recent--block.is-touched::before {
    opacity: 0.6;
    animation-play-state: running;
}
@keyframes tc-spin {
    to { transform: rotate(360deg); }
}

.Small--Box a.recent--block .Poster {
    display: block; padding-bottom: 150%; width: 100%; position: relative;
    background: #0a0d12;
    overflow: hidden;
}

/* الصورة: تكبير + تعتيم + إمالة بسيطة */
.Small--Box a.recent--block .Poster img {
    position: absolute; top: 0; right: 0; width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(.2,.9,.3,1),
                opacity 0.4s ease,
                filter 0.4s ease;
    filter: brightness(0.95);
}
.Small--Box a.recent--block:hover .Poster img,
.Small--Box a.recent--block.is-touched .Poster img {
    transform: scale(1.15) rotate(-1deg);
    opacity: 0.35;
    filter: brightness(0.7) blur(1px);
}

/* طبقة تدرج برتقالي تظهر عند التحويم */
.Small--Box a.recent--block .Poster::after {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(135deg,
        rgba(255, 168, 54, 0.0) 0%,
        rgba(255, 168, 54, 0.3) 50%,
        rgba(0, 0, 0, 0.4) 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    z-index: 2;
    pointer-events: none;
}
.Small--Box a.recent--block:hover .Poster::after,
.Small--Box a.recent--block.is-touched .Poster::after {
    opacity: 1;
}

/* زر تشغيل كبير يظهر في المنتصف */
.Small--Box a.recent--block .play-overlay {
    position: absolute;
    top: 50%; right: 50%;
    transform: translate(50%, -50%) scale(0.3);
    width: 60px; height: 60px;
    background: var(--primary-color);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: #000; font-size: 22px;
    opacity: 0;
    z-index: 8;
    transition: transform 0.45s cubic-bezier(.2,.9,.3,1.6),
                opacity 0.4s ease,
                box-shadow 0.4s ease;
    box-shadow: 0 0 0 0 rgba(255, 168, 54, 0.5);
    pointer-events: none;
}
.Small--Box a.recent--block:hover .play-overlay,
.Small--Box a.recent--block.is-touched .play-overlay {
    opacity: 1;
    transform: translate(50%, -50%) scale(1);
    box-shadow: 0 0 0 12px rgba(255, 168, 54, 0.15),
                0 0 0 24px rgba(255, 168, 54, 0.08),
                0 10px 25px rgba(0, 0, 0, 0.4);
    animation: tc-pulse 1.6s ease-out infinite;
}
@keyframes tc-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(255,168,54,0.5), 0 0 0 12px rgba(255,168,54,0.15), 0 10px 25px rgba(0,0,0,0.4); }
    70%  { box-shadow: 0 0 0 18px rgba(255,168,54,0), 0 0 0 30px rgba(255,168,54,0), 0 10px 25px rgba(0,0,0,0.4); }
    100% { box-shadow: 0 0 0 0 rgba(255,168,54,0), 0 0 0 12px rgba(255,168,54,0), 0 10px 25px rgba(0,0,0,0.4); }
}

/* IMDb badge */
.Small--Box a .number {
    position: absolute; top: 10px; right: 10px; background: rgba(0,0,0,0.85);
    z-index: 9; text-align: center; padding: 4px 10px; border-radius: 6px;
    font-size: 14px; font-weight: bold;
    transition: transform 0.35s ease, opacity 0.35s ease;
    backdrop-filter: blur(4px);
}
.Small--Box a .number span { display: block; font-size: 10px; color: #f5c518; }
.Small--Box a.recent--block:hover .number,
.Small--Box a.recent--block.is-touched .number {
    transform: translateY(-20px) scale(0.9);
    opacity: 0;
}

/* قائمة الجودة والسنة تنزلق من اليسار */
.Small--Box a ul.liList {
    position: absolute; top: 10px; left: 10px; z-index: 9;
    display: flex; flex-direction: column; gap: 5px;
}
.Small--Box a ul.liList li {
    background: rgba(0,0,0,0.75); color: #fff; font-size: 11px;
    border-radius: 4px; padding: 4px 10px; text-align: center;
    transform: translateX(40px); opacity: 0;
    transition: transform 0.4s cubic-bezier(.2,.9,.3,1.4), opacity 0.4s ease;
    backdrop-filter: blur(4px);
    font-weight: 600;
}
.Small--Box a ul.liList li:nth-child(1) {
    background: #ffcb17; color: #000;
    box-shadow: 0 4px 12px rgba(255, 203, 23, 0.3);
}
.Small--Box a.recent--block:hover ul.liList li,
.Small--Box a.recent--block.is-touched ul.liList li { transform: translateX(0); opacity: 1; }
.Small--Box a.recent--block:hover ul.liList li:nth-child(2),
.Small--Box a.recent--block.is-touched ul.liList li:nth-child(2) { transition-delay: 0.08s; }
.Small--Box a.recent--block:hover ul.liList li:nth-child(3),
.Small--Box a.recent--block.is-touched ul.liList li:nth-child(3) { transition-delay: 0.16s; }

/* شريط "جديد" */
.ribbon {
    position: absolute; top: 20px; left: -50px; width: 150px; height: 25px;
    background: linear-gradient(135deg, #ff2e2e, #ff6b00);
    text-align: center; font-size: 12px; line-height: 25px;
    color: #fff; transform: rotate(-45deg); z-index: 9;
    box-shadow: 0 2px 8px rgba(255, 46, 46, 0.6);
    transition: transform 0.4s ease, opacity 0.4s ease;
    font-weight: 700;
}
.Small--Box a.recent--block:hover .ribbon,
.Small--Box a.recent--block.is-touched .ribbon {
    opacity: 0;
    transform: rotate(-45deg) translateY(-30px);
}

/* العنوان يتحرك للأعلى ويتلون عند الـ hover */
.Small--Box a h3.title {
    font-size: 13px; position: absolute; bottom: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.95) 100%);
    padding: 40px 10px 12px; font-weight: 600; width: 100%; text-align: center;
    z-index: 7;
    transition: padding 0.35s ease, color 0.3s ease, background 0.4s ease;
}
.Small--Box a.recent--block:hover h3.title,
.Small--Box a.recent--block.is-touched h3.title {
    padding-bottom: 18px;
    color: var(--primary-color);
    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
    text-shadow: 0 2px 10px rgba(255, 168, 54, 0.4);
}

/* تأثير الضغط (click/tap) */
.Small--Box a.recent--block:active {
    transform: translateY(-6px) scale(1.01);
    transition: transform 0.15s ease;
}

/* تقليل التأثير لمستخدمي تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
    .Small--Box a.recent--block,
    .Small--Box a.recent--block .Poster img,
    .Small--Box a.recent--block::before,
    .Small--Box a.recent--block .play-overlay {
        transition: none !important;
        animation: none !important;
    }
    .Small--Box a.recent--block:hover {
        transform: translateY(-3px);
    }
}

/* =========================================
   5. صفحة المشاهدة (Single Movie/Series)
   ========================================= */
.single-cover {
    position: relative; padding: 60px 0 30px; margin-top: 70px;
    background-size: cover; background-position: center top;
}
.single-cover::before {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(14,17,22,0.85) 0%, rgba(14,17,22,0.98) 90%);
}
.single-cover .Content--Wrapper { position: relative; z-index: 2; }

.single-head { display: flex; gap: 30px; flex-wrap: wrap; }
.single-poster {
    flex: 0 0 280px; max-width: 280px;
    border-radius: 12px; overflow: hidden;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}
.single-poster img { width: 100%; display: block; }

.single-info { flex: 1; min-width: 280px; }
.single-info h1 {
    font-size: 32px; font-weight: 900; margin-bottom: 10px;
}
.single-info .original-title {
    font-size: 16px; color: var(--text-muted); margin-bottom: 15px;
    display: block;
}
.single-meta {
    display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px;
}
.single-meta span {
    background: rgba(255,255,255,0.06); padding: 5px 12px;
    border-radius: 20px; font-size: 12px;
}
.single-meta span.rating {
    background: #f5c518; color: #000; font-weight: bold;
}
.single-meta span.quality {
    background: var(--primary-color); color: #000; font-weight: bold;
}
.single-genres { margin: 15px 0; }
.single-genres a {
    display: inline-block; background: rgba(255,168,54,0.1);
    color: var(--primary-color); padding: 4px 14px; border-radius: 20px;
    font-size: 12px; margin-left: 5px; margin-bottom: 5px;
    border: 1px solid rgba(255,168,54,0.3);
}
.single-genres a:hover { background: var(--primary-color); color: #000; }

.single-story {
    background: var(--card-bg); padding: 20px; border-radius: 10px;
    margin-top: 20px; line-height: 1.9; color: #ddd;
}
.single-story h3 {
    font-size: 16px; margin-bottom: 10px; padding-right: 12px;
    position: relative;
}
.single-story h3::before {
    content: ''; width: 4px; height: 18px; background: var(--primary-color);
    border-radius: 2px; position: absolute; right: 0; top: 4px;
}

.action-buttons { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }
.action-buttons a {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 25px; border-radius: 8px; font-weight: 600;
    transition: 0.3s; font-size: 14px;
}
.btn-watch { background: var(--primary-color); color: #000; }
.btn-watch:hover { background: #fff; }
.btn-download { background: rgba(255,255,255,0.08); color: #fff; border: 1px solid rgba(255,255,255,0.1); }
.btn-download:hover { background: rgba(255,168,54,0.2); border-color: var(--primary-color); color: var(--primary-color); }
.btn-trailer { background: rgba(255, 46, 46, 0.15); color: #ff6e6e; border: 1px solid rgba(255,46,46,0.3); }
.btn-trailer:hover { background: #ff2e2e; color: #fff; }

/* المشغل وروابط التحميل */
.player-section { margin-top: 30px; }
.player-wrapper {
    background: #000; border-radius: 12px; overflow: hidden;
    aspect-ratio: 16/9; box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}
.player-wrapper iframe { width: 100%; height: 100%; border: 0; display: block; }
.player-placeholder {
    width: 100%; height: 100%; display: flex; align-items: center;
    justify-content: center; flex-direction: column; gap: 10px;
    color: #888; text-align: center; padding: 20px;
}
.player-placeholder i { font-size: 50px; color: var(--primary-color); }

.servers-list {
    display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px;
    background: var(--card-bg); padding: 12px; border-radius: 10px;
}
.servers-list .server-btn {
    background: rgba(255,255,255,0.05); padding: 8px 16px;
    border-radius: 6px; cursor: pointer; font-size: 13px;
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid transparent; transition: 0.3s;
}
.servers-list .server-btn:hover,
.servers-list .server-btn.active {
    background: var(--primary-color); color: #000; border-color: var(--primary-color);
}
.servers-list .server-btn i { font-size: 11px; }

.downloads-table {
    width: 100%; margin-top: 20px; border-collapse: collapse;
    background: var(--card-bg); border-radius: 10px; overflow: hidden;
}
.downloads-table th {
    background: rgba(255,168,54,0.1); color: var(--primary-color);
    padding: 12px; text-align: right; font-size: 13px; font-weight: 600;
}
.downloads-table td {
    padding: 12px; border-top: 1px solid rgba(255,255,255,0.05);
    font-size: 13px; color: #ddd;
}
.downloads-table tr:hover td { background: rgba(255,255,255,0.02); }
.downloads-table .dl-btn {
    background: var(--primary-color); color: #000; padding: 6px 16px;
    border-radius: 6px; font-weight: 600; display: inline-flex;
    align-items: center; gap: 6px; font-size: 12px;
}
.downloads-table .dl-btn:hover { background: #fff; }
.downloads-table .quality-tag {
    background: rgba(255,255,255,0.08); padding: 3px 10px;
    border-radius: 4px; font-size: 11px;
}

/* قائمة الحلقات */
.episodes-section { margin-top: 30px; }
.episodes-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    gap: 10px; background: var(--card-bg); padding: 15px; border-radius: 10px;
}
.episodes-list a {
    display: flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,0.05); padding: 12px 8px;
    border-radius: 6px; font-size: 13px; font-weight: 600;
    transition: 0.3s; text-align: center;
}
.episodes-list a:hover,
.episodes-list a.current { background: var(--primary-color); color: #000; }

.seasons-tabs {
    display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 15px;
}
.seasons-tabs a {
    background: rgba(255,255,255,0.05); padding: 8px 16px;
    border-radius: 6px; font-size: 13px;
}
.seasons-tabs a.active { background: var(--primary-color); color: #000; }

/* =========================================
   6. الفوتر والعناصر العامة
   ========================================= */
footer {
    background: rgba(0,0,0,0.3); border-top: 1px solid #ffffff05;
    padding: 30px 0; margin-top: 50px; text-align: center;
}
footer .footer-cols {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
    gap: 30px; text-align: right; margin-bottom: 30px;
}
footer .footer-col h4 {
    font-size: 16px; margin-bottom: 15px; padding-right: 12px;
    position: relative; color: var(--primary-color);
}
footer .footer-col h4::before {
    content: ''; width: 4px; height: 16px; background: var(--primary-color);
    border-radius: 2px; position: absolute; right: 0; top: 4px;
}
footer .footer-col ul li a {
    color: #aaa; font-size: 13px; line-height: 2.2;
}
footer .footer-col ul li a:hover { color: var(--primary-color); padding-right: 5px; }
footer p { color: var(--text-muted); font-size: 13px; }
footer a.copy-link { color: var(--primary-color); }

.gtop {
    width: 45px; height: 45px; background: var(--primary-color); color: #000;
    border-radius: 50%; position: fixed; bottom: 20px; left: 20px; z-index: 999;
    display: flex; align-items: center; justify-content: center; cursor: pointer;
    opacity: 0; visibility: hidden; transition: 0.3s; box-shadow: 0 5px 15px rgba(255, 168, 54, 0.3);
    border: none;
}
.gtop.show { opacity: 1; visibility: visible; }
.gtop:hover { transform: translateY(-5px); }

.popSearch {
    position: fixed; top: 0; right: 0; width: 100%; height: 100%; z-index: 99999;
    background: rgba(14, 17, 22, 0.95); backdrop-filter: blur(10px);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; visibility: hidden; transition: 0.3s;
}
.popSearch.active { opacity: 1; visibility: visible; }
.SearchPopForm { width: 90%; max-width: 600px; text-align: center; }
.SearchPopForm input {
    width: 100%; padding: 15px 20px; border-radius: 50px; border: none;
    background: #ffffff14; color: #fff; font-size: 16px; text-align: center;
    font-family: "Cairo", sans-serif;
}
.SearchPopForm input:focus { outline: 2px solid var(--primary-color); }
.SearchPopForm button {
    margin-top: 20px; padding: 10px 30px; background: transparent;
    border: 1px solid #fff; color: #fff; border-radius: 25px; cursor: pointer;
    font-family: "Cairo", sans-serif;
}

.MainMenuOverlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.7); opacity: 0; visibility: hidden;
    transition: 0.3s; z-index: 999998;
}
.MainMenuOverlay.active { opacity: 1; visibility: visible; }

.mobile--menu {
    position: fixed; top: 0; right: -100%; width: 280px; height: 100%;
    background: rgba(10, 15, 20, 0.95); backdrop-filter: blur(12px);
    overflow-y: auto; z-index: 999999; transition: 0.35s ease; padding: 20px;
}
.mobile--menu.active { right: 0; }
.mobile--menu ul li { border-bottom: 1px solid rgba(255,255,255,0.05); }
.mobile--menu ul li a {
    display: flex; justify-content: space-between; align-items: center;
    padding: 15px 10px; color: #aaa; font-size: 15px;
}
.mobile--menu ul li a:hover { color: #fff; background: rgba(255,255,255,0.05); padding-right: 15px; }
body.menu-open { overflow: hidden; }

/* الترقيم */
.pagination {
    display: flex; justify-content: center; gap: 8px; margin-top: 40px; flex-wrap: wrap;
}
.pagination a, .pagination span {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 40px; height: 40px; padding: 0 12px; border-radius: 8px;
    background: rgba(255,255,255,0.05); font-size: 14px; font-weight: 600;
}
.pagination a:hover, .pagination .current {
    background: var(--primary-color); color: #000;
}

/* الأرشيف وعنوان الصفحة */
.page-header {
    margin-top: 90px; padding: 30px 0 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05); margin-bottom: 30px;
}
.page-header h1 {
    font-size: 24px; padding-right: 15px; position: relative;
}
.page-header h1::before {
    content: ''; width: 5px; height: 28px; background: var(--primary-color);
    border-radius: 2px; position: absolute; right: 0; top: 4px;
}
.page-header .breadcrumbs {
    color: var(--text-muted); font-size: 13px; margin-top: 8px;
}
.page-header .breadcrumbs a:hover { color: var(--primary-color); }

/* النتائج الفارغة */
.no-results {
    background: var(--card-bg); padding: 60px 20px; border-radius: 12px;
    text-align: center;
}
.no-results i { font-size: 60px; color: var(--primary-color); margin-bottom: 15px; }
.no-results h2 { font-size: 22px; margin-bottom: 10px; }
.no-results p { color: var(--text-muted); }

/* التعليقات */
.comments-area {
    background: var(--card-bg); padding: 25px; border-radius: 12px;
    margin-top: 30px;
}
.comments-area h3 { margin-bottom: 20px; font-size: 18px; }
.comments-area ol.comment-list { padding: 0; }
.comments-area ol.comment-list li { margin-bottom: 20px; padding: 15px; background: rgba(255,255,255,0.03); border-radius: 8px; }
.comments-area .comment-author { font-weight: 600; color: var(--primary-color); }
.comments-area .comment-meta { font-size: 12px; color: var(--text-muted); margin-bottom: 8px; }
.comment-form input, .comment-form textarea {
    width: 100%; padding: 12px 15px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.03); color: #fff; font-family: "Cairo", sans-serif;
    margin-bottom: 12px;
}
.comment-form input[type="submit"] {
    width: auto; background: var(--primary-color); color: #000; border: none;
    padding: 10px 30px; font-weight: 600; cursor: pointer;
}

/* =========================================
   7. التجاوب (Responsive)
   ========================================= */
@media (max-width: 1024px) {
    ul.Posts--List.SixInRow > div { flex: 0 0 calc(100% / 4); }
}
@media (max-width: 768px) {
    header.Main--Header nav.Menu--Contents { display: none; }
    .mobile--bars { display: flex; }
    ul.Posts--List.SixInRow > div,
    ul.Posts--List.FourInRow > div { flex: 0 0 calc(100% / 3); }
    .TitleBox { flex-direction: column; align-items: flex-start; gap: 10px; }
    .TitleBox ul { width: 100%; overflow-x: auto; padding-bottom: 5px; }
    .single-head { flex-direction: column; align-items: center; text-align: center; }
    .single-info h1 { font-size: 24px; }
    .single-genres a { font-size: 11px; }
    .action-buttons { justify-content: center; }
}
@media (max-width: 480px) {
    ul.Posts--List.SixInRow > div,
    ul.Posts--List.FourInRow > div { flex: 0 0 calc(100% / 2); }
    .Logo--Area h1, .Logo--Area .logo-text { font-size: 26px; }
    .downloads-table th, .downloads-table td { padding: 8px 6px; font-size: 12px; }
}

/* =========================================
   8. صفحة المفرد بتصميم MovizLand
   ========================================= */

/* البانر العلوي مع الـ Backdrop */
.ml-single-hero {
    position: relative;
    margin-top: 70px;
    min-height: 480px;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    overflow: hidden;
}
.ml-single-hero::before {
    content: '';
    position: absolute; inset: 0;
    background:
        linear-gradient(180deg, rgba(14,17,22,0.5) 0%, rgba(14,17,22,0.95) 70%, var(--main-bg) 100%),
        linear-gradient(90deg, rgba(14,17,22,0.7) 0%, rgba(14,17,22,0.3) 100%);
}
.ml-single-hero .Content--Wrapper { position: relative; z-index: 2; padding: 40px 0 30px; }

.ml-hero-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 35px;
    align-items: flex-start;
}

/* البوستر */
.ml-poster {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 15px 45px rgba(0,0,0,0.6), 0 0 0 4px rgba(255,168,54,0.1);
    aspect-ratio: 2/3;
    background: #0a0d12;
}
.ml-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ml-poster .ml-rating-badge {
    position: absolute; top: 12px; right: 12px;
    background: rgba(0,0,0,0.85);
    backdrop-filter: blur(6px);
    padding: 6px 12px; border-radius: 8px;
    font-weight: 700; font-size: 14px;
    display: flex; align-items: center; gap: 6px;
    border: 1px solid rgba(255,203,23,0.3);
}
.ml-poster .ml-rating-badge i { color: #f5c518; }

/* معلومات الفيلم */
.ml-info { color: #fff; }
.ml-info .ml-cat-tag {
    display: inline-block;
    background: var(--primary-color);
    color: #000;
    padding: 4px 14px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 12px;
}
.ml-info h1 {
    font-size: 32px;
    font-weight: 900;
    margin-bottom: 8px;
    line-height: 1.3;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.ml-info .ml-orig-title {
    display: block;
    color: var(--text-muted);
    font-size: 15px;
    margin-bottom: 18px;
}

/* قائمة معلومات الطاقم */
.ml-crew {
    display: flex; flex-wrap: wrap;
    gap: 18px; margin-bottom: 18px;
    padding: 12px 0;
    border-top: 1px solid rgba(255,255,255,0.08);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.ml-crew .ml-crew-item { font-size: 13px; color: #ddd; }
.ml-crew .ml-crew-item strong {
    color: var(--primary-color);
    font-weight: 700;
    margin-left: 6px;
}

/* تقييم النجوم */
.ml-stars-block {
    display: flex; align-items: center;
    gap: 12px; margin-bottom: 18px; flex-wrap: wrap;
}
.ml-stars { display: inline-flex; gap: 2px; font-size: 16px; }
.ml-stars i { color: #444; }
.ml-stars i.on { color: #f5c518; }
.ml-stars-text { font-size: 13px; color: #aaa; }
.ml-stars-text b { color: #fff; }

/* تاريخ الإصدار */
.ml-release-date {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.05);
    padding: 6px 14px; border-radius: 6px;
    font-size: 13px; color: #ddd;
}
.ml-release-date i { color: var(--primary-color); }

/* زر التريلر */
.ml-trailer-btn {
    position: absolute;
    bottom: 30px; left: 30px;
    z-index: 5;
    display: inline-flex; align-items: center; gap: 10px;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(8px);
    color: #fff;
    padding: 10px 22px;
    border-radius: 30px;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,0.15);
    font-size: 13px;
    transition: 0.3s;
}
.ml-trailer-btn:hover {
    background: #e50914;
    border-color: #e50914;
    transform: scale(1.05);
}
.ml-trailer-btn i { color: #e50914; font-size: 18px; }
.ml-trailer-btn:hover i { color: #fff; }

/* فتات الخبز */
.ml-breadcrumbs {
    background: rgba(0,0,0,0.3);
    padding: 12px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}
.ml-breadcrumbs ul {
    display: flex; flex-wrap: wrap; gap: 8px;
    align-items: center;
    font-size: 13px; color: #aaa;
}
.ml-breadcrumbs li::after {
    content: '/';
    margin-right: 8px;
    color: #555;
}
.ml-breadcrumbs li:last-child::after { display: none; }
.ml-breadcrumbs li a { color: #aaa; }
.ml-breadcrumbs li a:hover { color: var(--primary-color); }
.ml-breadcrumbs li.active { color: var(--primary-color); }

/* جسم المحتوى */
.ml-single-body {
    padding: 30px 0 50px;
}

/* قسم القصة */
.ml-story-box {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 25px;
    border-right: 4px solid var(--primary-color);
}
.ml-story-box h2 {
    font-size: 20px;
    margin-bottom: 15px;
    color: var(--primary-color);
    display: flex; align-items: center; gap: 8px;
}
.ml-story-box .ml-story-text {
    line-height: 2;
    color: #ddd;
    font-size: 15px;
}

/* قائمة بيانات الفيلم النقطية */
.ml-meta-list {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 20px 25px;
    margin-bottom: 25px;
}
.ml-meta-list li {
    padding: 12px 0;
    border-bottom: 1px dashed rgba(255,255,255,0.06);
    display: flex; flex-wrap: wrap; gap: 8px;
    align-items: center;
    font-size: 14px;
}
.ml-meta-list li:last-child { border-bottom: none; }
.ml-meta-list li .ml-label {
    color: var(--primary-color);
    font-weight: 700;
    min-width: 130px;
    display: inline-flex; align-items: center; gap: 8px;
}
.ml-meta-list li .ml-label i { width: 18px; text-align: center; }
.ml-meta-list li .ml-value { color: #ddd; }
.ml-meta-list li .ml-value a {
    display: inline-block;
    background: rgba(255,168,54,0.1);
    color: var(--primary-color);
    padding: 3px 12px;
    border-radius: 4px;
    font-size: 12px;
    margin-left: 4px;
    transition: 0.3s;
    border: 1px solid rgba(255,168,54,0.2);
}
.ml-meta-list li .ml-value a:hover {
    background: var(--primary-color);
    color: #000;
}

/* الأزرار الرئيسية: مشاهدة + تحميل */
.ml-action-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    margin-bottom: 25px;
}
.ml-action-btn {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    padding: 22px 20px;
    border-radius: 12px;
    text-align: center;
    font-weight: 700;
    transition: 0.35s;
    position: relative;
    overflow: hidden;
}
.ml-action-btn::before {
    content: '';
    position: absolute;
    top: 0; right: -100%;
    width: 100%; height: 100%;
    background: rgba(255,255,255,0.1);
    transition: 0.5s;
    transform: skewX(-20deg);
}
.ml-action-btn:hover::before { right: 100%; }
.ml-action-btn i {
    font-size: 28px;
    margin-bottom: 8px;
    display: block;
}
.ml-action-btn .ml-btn-title {
    font-size: 18px;
    display: block;
    margin-bottom: 4px;
}
.ml-action-btn .ml-btn-sub {
    font-size: 12px;
    font-weight: 400;
    opacity: 0.8;
    display: block;
}
.ml-btn-watch {
    background: linear-gradient(135deg, var(--primary-color), #ff8c00);
    color: #000;
    box-shadow: 0 8px 20px rgba(255, 168, 54, 0.3);
}
.ml-btn-watch:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(255, 168, 54, 0.5);
    color: #000;
}
.ml-btn-download {
    background: linear-gradient(135deg, #1e88e5, #0d47a1);
    color: #fff;
    box-shadow: 0 8px 20px rgba(30, 136, 229, 0.3);
}
.ml-btn-download:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(30, 136, 229, 0.5);
    color: #fff;
}

/* رابط مختصر */
.ml-short-link {
    background: var(--card-bg);
    border-radius: 10px;
    padding: 12px 18px;
    display: flex; align-items: center; gap: 12px;
    margin-bottom: 25px;
    flex-wrap: wrap;
}
.ml-short-link .ml-sl-label {
    color: var(--primary-color);
    font-weight: 700;
    font-size: 13px;
}
.ml-short-link input {
    flex: 1; min-width: 200px;
    background: rgba(0,0,0,0.3);
    border: 1px solid rgba(255,255,255,0.08);
    color: #fff;
    padding: 8px 12px; border-radius: 6px;
    font-family: monospace; font-size: 12px;
    direction: ltr; text-align: left;
}
.ml-short-link button {
    background: var(--primary-color);
    color: #000;
    border: none;
    padding: 8px 18px;
    border-radius: 6px;
    font-weight: 700;
    cursor: pointer;
    font-size: 13px;
    transition: 0.3s;
    font-family: "Cairo", sans-serif;
}
.ml-short-link button:hover { background: #fff; }
.ml-short-link button.copied {
    background: #4caf50; color: #fff;
}

/* الأقسام (المشاهدة/التحميل في صفحة منفصلة) */
.ml-section {
    background: var(--card-bg);
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 25px;
}
.ml-section-title {
    font-size: 18px;
    color: var(--primary-color);
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    display: flex; align-items: center; gap: 10px;
}

/* قسم "مشاهدة عروض أخرى" */
.ml-related-section {
    margin-top: 30px;
}
.ml-related-section .TitleBox h2 i { margin-left: 8px; }

/* لايت بوكس التريلر */
.ml-lightbox {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.92);
    backdrop-filter: blur(8px);
    z-index: 99999;
    display: flex; align-items: center; justify-content: center;
    opacity: 0; visibility: hidden;
    transition: 0.3s;
}
.ml-lightbox.active { opacity: 1; visibility: visible; }
.ml-lightbox-content {
    width: 90%; max-width: 900px;
    aspect-ratio: 16/9;
    position: relative;
}
.ml-lightbox-content iframe {
    width: 100%; height: 100%;
    border: 0; border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.8);
}
.ml-lightbox-close {
    position: absolute;
    top: -50px; left: 0;
    width: 40px; height: 40px;
    background: var(--primary-color);
    color: #000;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; font-size: 18px;
    transition: 0.3s; border: none;
}
.ml-lightbox-close:hover { transform: rotate(90deg); }

/* صفحة المشاهدة المنفصلة */
.ml-watch-page { padding: 30px 0; }
.ml-watch-player {
    background: #000;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 16/9;
    margin-bottom: 20px;
    box-shadow: 0 15px 50px rgba(0,0,0,0.6);
}
.ml-watch-player iframe { width: 100%; height: 100%; border: 0; }
.ml-watch-back {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.05);
    padding: 10px 20px;
    border-radius: 8px;
    margin-bottom: 15px;
    font-size: 14px;
}
.ml-watch-back:hover { background: var(--primary-color); color: #000; }

/* تجاوب */
@media (max-width: 768px) {
    .ml-hero-grid { grid-template-columns: 1fr; gap: 20px; text-align: center; }
    .ml-poster { max-width: 220px; margin: 0 auto; }
    .ml-info h1 { font-size: 24px; }
    .ml-crew { justify-content: center; }
    .ml-action-grid { grid-template-columns: 1fr; }
    .ml-trailer-btn { position: static; margin-top: 15px; display: inline-flex; }
    .ml-meta-list li .ml-label { min-width: 100%; }
}

/* =========================================
   9. إصلاحات إضافية
   ========================================= */

/* منع ووردبريس من إضافة عنوان الصفحة فوق single content */
.single-cover h1.entry-title,
.ml-single-hero h1.entry-title { display: none; }

/* ضمان أن نص الأزرار لا يتلاصق */
.ml-action-btn span {
    display: block;
    width: 100%;
    line-height: 1.4;
}
.ml-action-btn .ml-btn-title {
    margin-top: 4px;
    margin-bottom: 6px;
}

/* أيقونات الميتا (للتأكد من عدم التصاقها بالنص) */
.ml-meta-list li .ml-label i {
    margin-left: 6px;
}

/* قائمة الجوال - تحسين */
.mobile--menu ul li a i {
    margin-left: 10px;
    color: var(--primary-color);
    width: 20px;
}

/* تحسين قائمة Wordpress الافتراضية في الهيدر */
header.Main--Header nav.Menu--Contents .menu-item-has-children > a::after {
    content: ' ▾';
    font-size: 10px;
    opacity: 0.6;
}

/* نموذج التعليقات */
.comments-area h3.comment-reply-title,
.comments-area > h3 {
    font-size: 18px;
    color: var(--primary-color);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.comment-form p { margin-bottom: 15px; }
.comment-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #ddd;
    font-size: 13px;
}
.comment-form label .required { color: #ff6b6b; }
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 12px 15px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.03);
    color: #fff;
    font-family: "Cairo", sans-serif;
    font-size: 14px;
}
.comment-form input:focus,
.comment-form textarea:focus {
    outline: none;
    border-color: var(--primary-color);
    background: rgba(255,168,54,0.05);
}
.comment-form .comment-form-cookies-consent input { width: auto; margin-left: 8px; }
.comment-form .comment-form-cookies-consent label {
    display: inline; font-weight: 400;
}
.comment-form input[type="submit"] {
    background: var(--primary-color);
    color: #000;
    border: none;
    padding: 12px 35px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    font-family: "Cairo", sans-serif;
    font-size: 14px;
    transition: 0.3s;
}
.comment-form input[type="submit"]:hover {
    background: #fff; transform: translateY(-2px);
}
.comment-notes { color: var(--text-muted); font-size: 12px; margin-bottom: 15px; }

/* إصلاح الـ Backdrop الافتراضي عندما لا توجد صورة */
.ml-single-hero:not([style*="background-image"]) {
    background: linear-gradient(135deg, #1a1f2e 0%, #0e1116 100%);
}
.ml-single-hero:not([style*="background-image"])::before {
    background: linear-gradient(180deg,
        rgba(255,168,54,0.05) 0%,
        rgba(14,17,22,0.95) 70%,
        var(--main-bg) 100%);
}

/* عند فتح صفحة بالـ ?p= نريد إخفاء أي محتوى نسخة Wordpress الافتراضية */
.single article.post > .entry-header,
.single article.movie > .entry-header,
.single article.series > .entry-header { display: none; }

/* =========================================
   10. السيرفرات الاحترافية في الأمامية
   ========================================= */
.servers-list {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px; margin-top: 15px;
    background: var(--card-bg); padding: 15px; border-radius: 12px;
}
.servers-list .server-btn {
    display: flex; align-items: center; gap: 10px;
    background: rgba(255,255,255,0.04);
    padding: 12px 16px; border-radius: 8px;
    cursor: pointer; transition: 0.3s;
    border: 2px solid transparent; font-size: 13px;
    position: relative; overflow: hidden;
}
.servers-list .server-btn::before {
    content: ''; position: absolute; top: 0; right: 0;
    width: 4px; height: 100%; background: var(--srv-color, var(--primary-color));
}
.servers-list .server-btn .srv-icon {
    width: 36px; height: 36px; border-radius: 8px;
    background: var(--srv-color, var(--primary-color));
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 16px; flex-shrink: 0;
}
.servers-list .server-btn .srv-info {
    flex: 1; min-width: 0; display: flex; flex-direction: column;
}
.servers-list .server-btn .srv-name {
    font-weight: 700; font-size: 13px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.servers-list .server-btn .srv-meta {
    font-size: 11px; color: var(--text-muted);
    display: flex; gap: 6px; margin-top: 2px;
}
.servers-list .server-btn .srv-meta span {
    background: rgba(255,255,255,0.05); padding: 1px 6px;
    border-radius: 3px;
}
.servers-list .server-btn:hover {
    background: rgba(255,168,54,0.1);
    border-color: var(--primary-color);
    transform: translateY(-2px);
}
.servers-list .server-btn.active {
    background: var(--primary-color); color: #000;
    border-color: var(--primary-color);
    box-shadow: 0 6px 20px rgba(255,168,54,0.3);
}
.servers-list .server-btn.active .srv-name,
.servers-list .server-btn.active .srv-meta { color: #000; }
.servers-list .server-btn.active .srv-meta span {
    background: rgba(0,0,0,0.15); color: #000;
}

/* علامة "سيرفر افتراضي" */
.server-btn.is-main::after {
    content: '★'; position: absolute; top: 6px; left: 8px;
    color: #f5c518; font-size: 14px;
}

/* =========================================
   11. جدول التحميل الاحترافي
   ========================================= */
.downloads-pro {
    display: grid; gap: 10px; margin-top: 15px;
}
.dl-row {
    display: grid; grid-template-columns: auto 1fr auto auto auto auto;
    gap: 12px; align-items: center;
    background: var(--card-bg); padding: 14px 18px;
    border-radius: 10px; border-right: 4px solid var(--dl-color, var(--primary-color));
    transition: 0.25s; position: relative;
}
.dl-row:hover {
    transform: translateX(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    background: rgba(255,168,54,0.03);
}
.dl-row .dl-host-icon {
    width: 44px; height: 44px; border-radius: 10px;
    background: var(--dl-color, var(--primary-color));
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 18px; flex-shrink: 0;
}
.dl-row .dl-info {
    display: flex; flex-direction: column; gap: 3px;
}
.dl-row .dl-info .dl-host-name {
    font-weight: 700; font-size: 14px;
}
.dl-row .dl-info .dl-note {
    font-size: 12px; color: var(--text-muted);
}
.dl-row .dl-quality {
    background: rgba(255,168,54,0.15); color: var(--primary-color);
    padding: 5px 12px; border-radius: 6px;
    font-weight: 700; font-size: 13px;
    border: 1px solid rgba(255,168,54,0.3);
}
.dl-row .dl-size {
    color: #aaa; font-size: 13px; font-weight: 600;
    background: rgba(255,255,255,0.04); padding: 5px 12px; border-radius: 6px;
}
.dl-row .dl-lang {
    background: rgba(255,255,255,0.05); padding: 4px 10px;
    border-radius: 6px; font-size: 12px;
}
.dl-row .dl-btn-pro {
    background: linear-gradient(135deg, var(--primary-color), #ff8c00);
    color: #000; padding: 10px 20px; border-radius: 8px;
    font-weight: 700; display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; transition: 0.3s;
}
.dl-row .dl-btn-pro:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 15px rgba(255,168,54,0.4);
    color: #000;
}

@media (max-width: 768px) {
    .dl-row { grid-template-columns: auto 1fr; row-gap: 8px; }
    .dl-row > * { grid-column: span 1; }
    .dl-row .dl-quality, .dl-row .dl-size, .dl-row .dl-lang { grid-column: 2 / -1; justify-self: start; }
    .dl-row .dl-btn-pro { grid-column: 1 / -1; justify-content: center; }
}

/* =========================================
   12. السلايدر العلوي
   ========================================= */
.tc-slider-wrap {
    margin-bottom: 35px;
}
.tc-slider {
    display: flex; gap: 15px;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory;
    padding-bottom: 10px;
    scrollbar-width: thin;
}
.tc-slider::-webkit-scrollbar { height: 6px; }
.tc-slider::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); }
.tc-slider::-webkit-scrollbar-thumb { background: var(--primary-color); border-radius: 3px; }

.tc-slide {
    flex: 0 0 calc(50% - 8px);
    min-width: 400px;
    height: 280px;
    border-radius: 14px;
    overflow: hidden;
    position: relative;
    background: linear-gradient(135deg, #1a1f2e, #0e1116);
    background-size: cover;
    background-position: center;
    scroll-snap-align: start;
    transition: 0.4s;
}
.tc-slide::before {
    content: '';
    position: absolute; inset: 0;
    background: linear-gradient(180deg,
        rgba(14,17,22,0.1) 0%,
        rgba(14,17,22,0.7) 50%,
        rgba(14,17,22,0.95) 100%);
}
.tc-slide:hover { transform: scale(1.02); box-shadow: 0 15px 40px rgba(0,0,0,0.5); }

.tc-slide-overlay {
    position: absolute;
    bottom: 0; right: 0; left: 0;
    padding: 25px;
    color: #fff;
    z-index: 2;
}
.tc-slide-cat {
    display: inline-block;
    background: var(--primary-color); color: #000;
    padding: 4px 12px; border-radius: 4px;
    font-size: 11px; font-weight: 700;
    margin-bottom: 8px;
}
.tc-slide-overlay h2 {
    font-size: 22px;
    margin: 0 0 10px;
    text-shadow: 0 2px 6px rgba(0,0,0,0.6);
}
.tc-slide-meta {
    display: flex; flex-wrap: wrap; gap: 10px;
    margin-bottom: 12px; font-size: 13px;
}
.tc-slide-meta span {
    display: inline-flex; align-items: center; gap: 4px;
    background: rgba(0,0,0,0.5); padding: 4px 10px; border-radius: 4px;
    backdrop-filter: blur(4px);
}
.tc-slide-meta .tc-slide-rating {
    background: #f5c518; color: #000; font-weight: 700;
}
.tc-slide-btn {
    display: inline-flex; align-items: center; gap: 6px;
    background: var(--primary-color); color: #000;
    padding: 8px 18px; border-radius: 6px;
    font-weight: 700; font-size: 13px;
    transition: 0.3s;
}
.tc-slide:hover .tc-slide-btn {
    background: #fff; transform: translateX(-3px);
}

/* TC Ad slots */
.tc-ad {
    margin: 25px auto;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
}
.tc-ad-header { padding-top: 90px; }

@media (max-width: 768px) {
    .tc-slide { min-width: 280px; height: 200px; flex: 0 0 90%; }
    .tc-slide-overlay h2 { font-size: 16px; }
    .tc-slide-overlay { padding: 15px; }
}

/* =========================================
   13. الفوتر الاحترافي
   ========================================= */
.tc-footer-top {
    display: grid;
    grid-template-columns: 1.2fr 2fr;
    gap: 40px;
    padding: 40px 0;
    text-align: right;
}
.tc-footer-about .logo-text { font-size: 28px; margin-bottom: 15px; }
.tc-footer-desc {
    color: var(--text-muted);
    line-height: 1.8;
    font-size: 14px;
    margin-bottom: 20px;
}

.tc-social-links {
    display: flex; gap: 10px; flex-wrap: wrap;
}
.tc-social-links a {
    width: 40px; height: 40px;
    border-radius: 10px;
    background: rgba(255,255,255,0.05);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
    transition: 0.3s;
    border: 1px solid rgba(255,255,255,0.05);
}
.tc-social-links a:hover {
    background: var(--c, var(--primary-color));
    color: #fff;
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.3);
    border-color: transparent;
}

.tc-footer-bottom {
    padding: 20px 0;
    border-top: 1px solid rgba(255,255,255,0.05);
    text-align: center;
    color: var(--text-muted);
    font-size: 13px;
}

@media (max-width: 768px) {
    .tc-footer-top { grid-template-columns: 1fr; gap: 25px; }
}

/* =========================================
   14. الإعلان المنبثق
   ========================================= */
.tc-popup-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.85);
    backdrop-filter: blur(5px);
    z-index: 999999;
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
    animation: tc-fade-in 0.3s;
}
@keyframes tc-fade-in { from { opacity: 0; } to { opacity: 1; } }

.tc-popup-content {
    background: var(--card-bg);
    border-radius: 16px;
    padding: 25px;
    max-width: 500px;
    width: 100%;
    position: relative;
    box-shadow: 0 20px 60px rgba(0,0,0,0.6);
}
.tc-popup-close {
    position: absolute;
    top: -15px; left: -15px;
    width: 40px; height: 40px;
    background: var(--primary-color);
    color: #000;
    border: none;
    border-radius: 50%;
    font-size: 24px;
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    transition: 0.3s;
}
.tc-popup-close:hover { transform: rotate(90deg); }