/* ===========================================
   Aflamicose - dark-mode.css
   الوضع الليلي (الافتراضي للقالب)
=========================================== */

/* القالب مبني بالكامل على الوضع الليلي */
/* هذا الملف يضيف تحسينات إضافية وإمكانية التبديل */

.dark-mode {
    --bg-main: #0a0a0a;
    --bg-secondary: #111111;
    --bg-card: #1a1a1a;
    --bg-hover: #222222;
    --text-primary: #ffffff;
    --text-secondary: #cccccc;
    --text-muted: #888888;
    --border-color: #2a2a2a;
}

/* تحسينات الوضع الليلي */
.dark-mode ::-webkit-scrollbar { width: 6px; }
.dark-mode ::-webkit-scrollbar-track { background: var(--bg-secondary); }
.dark-mode ::-webkit-scrollbar-thumb { background: #333; border-radius: 3px; }
.dark-mode ::-webkit-scrollbar-thumb:hover { background: var(--primary-color); }
.dark-mode input, .dark-mode textarea, .dark-mode select { color-scheme: dark; }
.dark-mode img { filter: brightness(.95); }
.dark-mode img:hover { filter: brightness(1); }
.dark-mode .wp-block-image img { filter: none; }

/* ===== Light Mode Override (إذا أراد المستخدم) ===== */
.light-mode {
    --bg-main: #f5f5f5;
    --bg-secondary: #ffffff;
    --bg-card: #ffffff;
    --bg-hover: #f0f0f0;
    --text-primary: #111111;
    --text-secondary: #444444;
    --text-muted: #777777;
    --border-color: #e0e0e0;
}
.light-mode .site-header { background: rgba(255,255,255,.95); border-bottom-color: rgba(229,9,20,.2); box-shadow: 0 2px 10px rgba(0,0,0,.1); }
.light-mode .nav-link { color: #333; }
.light-mode .nav-link:hover { color: var(--primary-color); background: rgba(229,9,20,.08); }
.light-mode .hero-overlay { background: linear-gradient(90deg, rgba(255,255,255,.85) 30%, rgba(255,255,255,.4) 70%, rgba(255,255,255,.1) 100%); }
.light-mode .hero-title { color: #111; text-shadow: none; }
.light-mode .hero-excerpt { color: #444; }
.light-mode .movie-card:hover { box-shadow: 0 8px 30px rgba(0,0,0,.15); }
.light-mode .site-footer { background: #1a1a1a; }
.light-mode .footer-bottom { background: #111; }
.light-mode .copyright, .light-mode .footer-bottom-links a { color: #aaa; }

/* ===== Theme Toggle Button ===== */
.theme-toggle-btn {
    background: none;
    border: 1px solid var(--border-color);
    border-radius: 50px;
    width: 52px;
    height: 28px;
    position: relative;
    cursor: pointer;
    transition: var(--transition);
}
.theme-toggle-btn::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background: var(--primary-color);
    border-radius: 50%;
    top: 3px;
    right: 4px;
    transition: right .3s;
}
.light-mode .theme-toggle-btn::after { right: calc(100% - 24px); }

/* ===== Skeleton Loading ===== */
.skeleton { background: linear-gradient(90deg, var(--bg-card) 25%, var(--bg-hover) 50%, var(--bg-card) 75%); background-size: 200% 100%; animation: skeleton-loading 1.5s infinite; border-radius: var(--radius-sm); }
@keyframes skeleton-loading { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.skeleton-card { border-radius: var(--radius-md); overflow: hidden; }
.skeleton-img { aspect-ratio: 2/3; }
.skeleton-text { height: 14px; margin: 8px 4px; border-radius: 4px; }
.skeleton-text.short { width: 60%; }
.skeleton-text.medium { width: 80%; }

/* ===== Animations ===== */
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideInRight { from { transform: translateX(30px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.fade-in-up { animation: fadeInUp .5s ease forwards; }
.fade-in { animation: fadeIn .4s ease forwards; }
.slide-in-right { animation: slideInRight .4s ease forwards; }
.pulse { animation: pulse 2s infinite; }
.fa-spin { animation: spin 1s linear infinite; }

/* Staggered animations */
.movie-card:nth-child(1) { animation-delay: 0s; }
.movie-card:nth-child(2) { animation-delay: .05s; }
.movie-card:nth-child(3) { animation-delay: .1s; }
.movie-card:nth-child(4) { animation-delay: .15s; }
.movie-card:nth-child(5) { animation-delay: .2s; }
.movie-card:nth-child(6) { animation-delay: .25s; }

/* ===== Focus Styles (Accessibility) ===== */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* ===== Custom Scrollbar ===== */
* { scrollbar-width: thin; scrollbar-color: rgba(229,9,20,.5) rgba(255,255,255,.05); }
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-track { background: rgba(255,255,255,.03); }
*::-webkit-scrollbar-thumb { background: rgba(229,9,20,.4); border-radius: 3px; }
*::-webkit-scrollbar-thumb:hover { background: var(--primary-color); }

/* ===== Selection ===== */
::selection { background: rgba(229,9,20,.3); color: #fff; }
::-moz-selection { background: rgba(229,9,20,.3); color: #fff; }

/* ===== Glassmorphism Cards ===== */
.glass-card {
    background: rgba(255,255,255,.05);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: var(--radius-lg);
}

/* ===== Status Badges ===== */
.status-badge { position: absolute; top: 36px; right: 12px; padding: 3px 10px; border-radius: 4px; font-size: .7rem; font-weight: 700; }
.status-مستمر { background: rgba(70,211,105,.2); color: var(--green-color); border: 1px solid rgba(70,211,105,.3); }
.status-منتهي  { background: rgba(150,150,150,.2); color: #aaa; border: 1px solid rgba(150,150,150,.2); }
.status-قادم   { background: rgba(52,152,219,.2); color: #3498db; border: 1px solid rgba(52,152,219,.3); }

/* ===== Episode Navigation ===== */
.episode-navigation { display: flex; gap: 10px; justify-content: space-between; margin-top: 15px; flex-wrap: wrap; }
.ep-nav-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: var(--radius-sm); font-size: .88rem; font-weight: 600; transition: var(--transition); }
.ep-nav-btn:hover { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }
.ep-nav-btn.ep-next { margin-right: auto; }
.ep-nav-btn.ep-season { background: rgba(255,255,255,.07); }

/* ===== Suggest Section ===== */
.suggestion-genres-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 20px; padding: 12px 16px; background: var(--bg-card); border-radius: var(--radius-md); border: 1px solid var(--border-color); font-size: .88rem; color: var(--text-muted); }