/**
 * Dark Mode CSS - Optimized & Organized
 * Based on Reference Design
 */

/* ============================================
   CSS Variables
   ============================================ */
:root {
    --bg-body: #fff;
    --bg-primary: #fff;
    --bg-secondary: #f9fafb;
    --bg-tertiary: #f3f4f6;
    --bg-hover: #e5e7eb;

    --text-primary: #111827;
    --text-secondary: #374151;
    --text-muted: #6b7280;
    --text-light: #9ca3af;
    --text-white: #fff;

    --border-color: rgba(0,0,0,.06);
    --border-strong: #e5e7eb;

    --shadow-sm: 0 1px 3px rgba(0,0,0,.1);
    --shadow-lg: 0 10px 40px rgba(0,0,0,.12);

    --green-50: #ecfdf5;
    --green-100: #d1fae5;
    --green-500: #10b981;
    --green-600: #059669;
    --green-700: #047857;
    --green-800: #065f46;
    --green-900: #064e3b;

    --blue-50: #eff6ff;
    --blue-100: #dbeafe;
    --blue-500: #3b82f6;
    --blue-600: #2563eb;
    --blue-700: #1d4ed8;
    --blue-800: #1e40af;
    --blue-900: #1e3a8a;

    --amber-50: #fffbeb;
    --amber-100: #fef3c7;
    --amber-500: #f59e0b;
    --amber-600: #d97706;
    --amber-700: #b45309;
    --amber-800: #92400e;
    --amber-900: #78350f;

    --purple-900: #581c87;
    --indigo-900: #312e81;
}

[data-theme="dark"] {
    --bg-body: #0f172a;
    --bg-primary: #111827;
    --bg-secondary: rgba(31,41,55,.5);
    --bg-secondary-solid: #1f2937;
    --bg-tertiary: #374151;
    --bg-hover: #374151;

    --text-primary: #f9fafb;
    --text-secondary: #e2e8f0;
    --text-muted: #9ca3af;
    --text-light: #6b7280;
    --text-white: #fff;

    --border-color: rgba(255,255,255,.06);
    --border-strong: #374151;
    --border-medium: #1f2634;

    --shadow-sm: 0 1px 3px rgba(0,0,0,.3);
    --shadow-lg: 0 10px 40px rgba(0,0,0,.4);

    --green-50: rgba(6,78,59,.3);
    --green-100: rgba(6,78,59,.2);
    --green-500: #10b981;
    --green-600: #6ee7b7;
    --green-700: #34d399;

    --blue-50: rgba(30,58,138,.3);
    --blue-100: rgba(30,58,138,.2);
    --blue-500: #60a5fa;
    --blue-600: #93c5fd;
    --blue-700: #dbeafe;

    --amber-50: rgba(120,53,15,.3);
    --amber-100: rgba(120,53,15,.2);
    --amber-500: #fbbf24;
    --amber-600: #fcd34d;
    --amber-700: #fef3c7;

    --purple-50: rgba(88,28,135,.3);
    --purple-600: #d8b4fe;

    --indigo-50: rgba(49,46,129,.3);
    --indigo-100: rgba(49,46,129,.2);
    --indigo-600: #a5b4fc;
}

/* ============================================
   Global
   ============================================ */
[data-theme="dark"] body { background-color: var(--bg-body); color: var(--text-primary) }
[data-theme="dark"] a { color: var(--text-secondary) }
[data-theme="dark"] a:hover { color: var(--text-primary) }

/* ============================================
   Bootstrap Overrides
   ============================================ */
[data-theme="dark"] .bg-white { background-color: var(--bg-primary) !important }
[data-theme="dark"] .bg-light { background-color: var(--bg-secondary) !important }
[data-theme="dark"] .bg-dark { background-color: #172031 !important }
[data-theme="dark"] .text-body { color: var(--text-primary) !important }
[data-theme="dark"] .text-muted { color: var(--text-muted) !important }
[data-theme="dark"] .border,
[data-theme="dark"] .border-bottom,
[data-theme="dark"] .border-top { border-color: var(--border-medium) !important }
[data-theme="dark"] .shadow-sm { box-shadow: var(--shadow-sm) !important }
[data-theme="dark"] .card { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .form-control { background-color: var(--bg-secondary); border-color: var(--border-strong); color: var(--text-primary) }
[data-theme="dark"] .form-control:focus { background-color: var(--bg-primary); border-color: var(--green-500); color: var(--text-primary); box-shadow: 0 0 0 2px rgba(16,185,129,.2) }
[data-theme="dark"] .form-control::placeholder { color: var(--text-light) }
[data-theme="dark"] .input-group-text { background-color: var(--bg-tertiary); border-color: var(--border-strong); color: var(--text-muted) }
[data-theme="dark"] .btn-light { background-color: var(--bg-secondary); border-color: var(--border-strong); color: var(--text-secondary) }
[data-theme="dark"] .btn-light:hover { background-color: var(--bg-tertiary); color: var(--text-primary) }

/* ============================================
   Header
   ============================================ */
[data-theme="dark"] .site-header { background: #111827 !important; border-color: rgba(255,255,255,.06) !important }
[data-theme="dark"] #masthead.site-header { background: #111827 !important; border-color: rgba(255,255,255,.06) !important; box-shadow: 0 1px 4px rgba(0,0,0,.3) !important }
[data-theme="dark"] .header-btn { background: #1f2937; color: #d1d5db }
[data-theme="dark"] .header-btn:hover { background: rgba(255,255,255,.08); color: #f9fafb }
[data-theme="dark"] .header-lang-btn { background: #1f2937; color: #d1d5db }
[data-theme="dark"] .header-lang-btn:hover { background: #374151 }
[data-theme="dark"] .header-lang-dropdown { background: #1f2937; border-color: #374151; box-shadow: 0 10px 40px rgba(0,0,0,.4) }
[data-theme="dark"] .header-lang-dropdown li a,
[data-theme="dark"] .header-lang-item { color: #d1d5db }
[data-theme="dark"] .header-lang-dropdown li a:hover,
[data-theme="dark"] .header-lang-item:hover { background: #374151 }
[data-theme="dark"] .header-lang-dropdown li.current-lang a,
[data-theme="dark"] .header-lang-item.current-lang { background: #064e3b; color: #6ee7b7 }

/* Logo — dark mode visibility fix */
/* إذا اللوقو غامق أو أسود بيتحول لأبيض تلقائياً */
[data-theme="dark"] .site-logo img {
    filter: brightness(0) invert(1);
}
/* إذا اللوقو SVG inline */
[data-theme="dark"] .site-logo svg path,
[data-theme="dark"] .site-logo svg rect,
[data-theme="dark"] .site-logo svg circle,
[data-theme="dark"] .site-logo svg polygon {
    fill: #ffffff !important;
}
/* للـ logo text */
[data-theme="dark"] .site-logo .logo-text { color: #f9fafb !important }
/* Sidebar logo */
[data-theme="dark"] .sidebar-logo img { filter: brightness(0) invert(1) }
[data-theme="dark"] .sidebar-logo svg path,
[data-theme="dark"] .sidebar-logo svg rect,
[data-theme="dark"] .sidebar-logo svg circle { fill: #ffffff !important }
[data-theme="dark"] .sidebar-logo .logo-text { color: #f9fafb !important }

/* ============================================
   Search Overlay
   ============================================ */
[data-theme="dark"] .search-box { background: #111827 !important; box-shadow: 0 20px 60px rgba(0,0,0,.5) !important }
[data-theme="dark"] .search-box-top { background: #111827 !important; border-bottom-color: rgba(255,255,255,.06) !important }
[data-theme="dark"] .search-box-body { background: #111827 !important }
[data-theme="dark"] .search-box-input { color: #f9fafb !important; background: #111827 !important }
[data-theme="dark"] .search-box-input::placeholder { color: #6b7280 !important }
[data-theme="dark"] .search-icon-svg { stroke: #4b5563 !important }
[data-theme="dark"] .search-close-x { background: #1f2937 !important; color: #9ca3af !important }
[data-theme="dark"] .search-close-x:hover { background: #374151 !important; color: #f9fafb !important }
[data-theme="dark"] .search-label { color: #6b7280 !important }
[data-theme="dark"] .search-chip { background: #1f2937; color: #d1d5db; border-color: #374151 }
[data-theme="dark"] .search-chip:hover { background: #064e3b; color: #6ee7b7; border-color: #065f46 }
[data-theme="dark"] .search-chip-count { background: #374151; color: #9ca3af }
[data-theme="dark"] .search-live-results { background: #111827 !important }
[data-theme="dark"] .apk-skeleton { background: linear-gradient(90deg,#1f2937 25%,#2d3748 50%,#1f2937 75%) !important; background-size: 600px 100% !important }

/* ============================================
   Sidebar
   ============================================ */
[data-theme="dark"] .sidebar-panel { background: #111827 !important; border-color: rgba(255,255,255,.06) !important }
[data-theme="dark"] .sidebar-header { border-color: rgba(255,255,255,.06) !important }
[data-theme="dark"] .sidebar-close-btn { background: #1f2937; color: #9ca3af }
[data-theme="dark"] .sidebar-close-btn:hover { background: #374151; color: #f9fafb }
[data-theme="dark"] .sidebar-menu > li > a { color: #d1d5db }
[data-theme="dark"] .sidebar-menu > li > a:hover,
[data-theme="dark"] .sidebar-menu > li.current-menu-item > a,
[data-theme="dark"] .sidebar-menu > li.current-menu-ancestor > a,
[data-theme="dark"] .sidebar-menu > li.current-menu-parent > a { background: #1f2937 !important; color: #f9fafb !important }
[data-theme="dark"] .sidebar-menu > li.current-menu-item > a { font-weight: 700 }
[data-theme="dark"] .sidebar-menu .sub-menu a { color: #9ca3af }
[data-theme="dark"] .sidebar-menu .sub-menu a:hover { background: #1f2937 !important; color: #f9fafb !important }
[data-theme="dark"] .sidebar-telegram { background: linear-gradient(135deg,#1d4ed8,#1e40af) !important; color: #fff !important }
[data-theme="dark"] .sidebar-telegram:hover { background: linear-gradient(135deg,#1e40af,#1e3a8a) !important; color: #fff !important }
[data-theme="dark"] .sidebar-menu .pll-parent-menu-item > a { color: #d1d5db }
[data-theme="dark"] .sidebar-menu .pll-parent-menu-item > a:hover { background: #1f2937 }
[data-theme="dark"] .sidebar-menu .pll-parent-menu-item .sub-menu {
    background: #1f2937 !important;
    border-color: #374151 !important;
    box-shadow: 0 10px 40px rgba(0,0,0,.4) !important;
}
[data-theme="dark"] .sidebar-menu .pll-parent-menu-item .sub-menu li a { color: #d1d5db }
[data-theme="dark"] .sidebar-menu .pll-parent-menu-item .sub-menu li a:hover { background: #374151 }
[data-theme="dark"] .sidebar-menu .pll-parent-menu-item .sub-menu li.current-lang a,
[data-theme="dark"] .sidebar-menu .lang-item.current-lang > a { background: #064e3b !important; color: #6ee7b7 !important }
[data-theme="dark"] .sidebar-divider { background: rgba(255,255,255,.06) }
[data-theme="dark"] .sidebar-lang-toggle { color: #d1d5db }
[data-theme="dark"] .sidebar-lang-toggle:hover { background: #1f2937 }
[data-theme="dark"] .sidebar-lang-current { background: #374151; color: #9ca3af }
[data-theme="dark"] .sidebar-lang-dropdown li a { color: #d1d5db }
[data-theme="dark"] .sidebar-lang-dropdown li a:hover { background: #1f2937 }
[data-theme="dark"] .sidebar-lang-dropdown li.current-lang a { background: #064e3b; color: #6ee7b7 }
[data-theme="dark"] .sidebar-footer { border-color: rgba(255,255,255,.06) }

/* ============================================
   App Header
   ============================================ */
[data-theme="dark"] .app-header-title,
[data-theme="dark"] .app-header-name,
[data-theme="dark"] .app-title,
[data-theme="dark"] .dlh-mini-name { color: var(--text-primary) }
[data-theme="dark"] .app-header-dev { color: var(--text-muted) }
[data-theme="dark"] .app-header-icon,
[data-theme="dark"] .dlh-mini-icon { border-color: var(--border-strong) }
[data-theme="dark"] .app-verified-badge { border-color: var(--bg-primary) }
[data-theme="dark"] .dlh-chip { background-color: var(--bg-secondary); border-color: var(--border-strong); color: var(--text-secondary) }
[data-theme="dark"] .dlh-chip-verified { background-color: var(--green-50); border-color: var(--green-800); color: var(--green-600) }

/* ============================================
   Download Box
   ============================================ */
[data-theme="dark"] .dl-box { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .dl-box-header { background-color: var(--bg-secondary); border-color: var(--border-color) }
[data-theme="dark"] .dl-box-header h3 { color: var(--text-primary) }
[data-theme="dark"] .dl-arch-header { background-color: var(--bg-secondary) }
[data-theme="dark"] .dl-arch-name { color: var(--text-primary) }
[data-theme="dark"] .dl-arch-desc { color: var(--text-muted) }
[data-theme="dark"] .dl-arch-section { border-color: var(--bg-secondary-solid) }
[data-theme="dark"] .dl-file-item { border-color: var(--border-color) }
[data-theme="dark"] .dl-file-item:hover { background-color: var(--bg-secondary) }
[data-theme="dark"] .dl-file-type { color: var(--text-primary) }
[data-theme="dark"] .dl-file-meta { color: var(--text-muted) }
[data-theme="dark"] .dl-badge-blue { background-color: var(--blue-50); color: var(--blue-600) }
[data-theme="dark"] .dl-badge-purple { background-color: var(--purple-50); color: var(--purple-600) }
[data-theme="dark"] .dl-badge-amber { background-color: var(--amber-50); color: var(--amber-600) }
[data-theme="dark"] .dl-badge-indigo { background-color: var(--indigo-50); color: var(--indigo-600) }
[data-theme="dark"] .dl-badge-emerald { background-color: var(--green-50); color: var(--green-600) }
[data-theme="dark"] .dl-file-icon-emerald { background-color: var(--green-100) }
[data-theme="dark"] .dl-file-icon-amber { background-color: var(--amber-100) }
[data-theme="dark"] .dl-file-icon-indigo { background-color: var(--indigo-100) }
[data-theme="dark"] .dl-btn-secondary { background-color: var(--bg-tertiary); color: var(--text-primary) }
[data-theme="dark"] .dl-btn-secondary:hover { background-color: #4b5563; color: var(--text-primary) !important }
[data-theme="dark"] .telegram-btn { background-color: var(--blue-100); color: var(--blue-500); border-color: var(--blue-50) }
[data-theme="dark"] .telegram-btn:hover { background-color: rgba(30,58,138,.4); color: #60a5fa }
[data-theme="dark"] .download-info-item { color: var(--text-muted) }

/* ============================================
   Share
   ============================================ */
[data-theme="dark"] .share-btn-main { background-color: var(--bg-primary); border-color: var(--border-strong); color: #d1d5db }
[data-theme="dark"] .share-btn-main:hover { background-color: var(--bg-secondary-solid); border-color: var(--bg-tertiary) }
[data-theme="dark"] .share-dropdown { background: var(--bg-secondary-solid); border-color: var(--bg-tertiary) }
[data-theme="dark"] .share-qr-btn { border-color: #3f4c62 }
[data-theme="dark"] .share-qr-btn:hover { background-color: #18212f }
[data-theme="dark"] .share-divider { background-color: #3f4c62 }
[data-theme="dark"] .share-copy-btn { background: var(--bg-primary); color: var(--text-muted) }
[data-theme="dark"] .trust-dot { background: #374151 }

/* ============================================
   Description
   ============================================ */
[data-theme="dark"] .desc-section { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .desc-header { color: var(--text-primary) }
[data-theme="dark"] .desc-header svg { color: var(--text-muted) }
[data-theme="dark"] .desc-text { color: var(--text-secondary) }
[data-theme="dark"] .desc-text a,
[data-theme="dark"] .desc-read-more { color: var(--green-600) }

/* ============================================
   FAQ + Accordion — زي الصورة
   ============================================ */
[data-theme="dark"] .faq-section,
[data-theme="dark"] .app-info-section,
[data-theme="dark"] .install-guide-section { background-color: var(--bg-body) !important; border-color: rgba(255,255,255,.06) !important }
[data-theme="dark"] .faq-header,
[data-theme="dark"] .info-header,
[data-theme="dark"] .install-header { color: var(--text-primary) }
[data-theme="dark"] .faq-list { border-color: rgba(255,255,255,.06) }
[data-theme="dark"] .faq-item { background-color: var(--bg-body) !important; border-color: rgba(255,255,255,.06) !important }

/* Toggler/Question — bg-secondary-solid + أبيض */
[data-theme="dark"] .faq-question,
[data-theme="dark"] .accordion .toggler,
[data-theme="dark"] .accordion-more-info .toggler {
    background-color: var(--bg-secondary-solid) !important;
    color: #f9fafb !important;
}
[data-theme="dark"] .faq-question:hover,
[data-theme="dark"] .accordion .toggler:hover { background-color: var(--bg-tertiary) !important }
[data-theme="dark"] .faq-question svg { color: #9ca3af }
[data-theme="dark"] .faq-question span { color: #f9fafb !important }

/* Answer/body */
[data-theme="dark"] .faq-answer { background-color: var(--bg-body) !important }
[data-theme="dark"] .faq-answer > * { background-color: var(--bg-body) !important }
[data-theme="dark"] .faq-answer-inner { background-color: var(--bg-body) !important; color: var(--text-secondary) }
[data-theme="dark"] .faq-answer p { background-color: var(--bg-body) !important; color: var(--text-muted) !important }
[data-theme="dark"] .faq-answer a { color: #60a5fa }

/* Bootstrap accordion */
[data-theme="dark"] .accordion .card { background-color: var(--bg-body) !important; border-color: rgba(255,255,255,.06) !important }
[data-theme="dark"] .accordion .card-header { background-color: var(--bg-secondary-solid) !important; color: #f9fafb !important }
[data-theme="dark"] .accordion .card-body { background-color: var(--bg-body) !important; color: var(--text-secondary) }
[data-theme="dark"] .collapse    { background-color: var(--bg-body) !important }
[data-theme="dark"] .collapsing  { background-color: var(--bg-body) !important }
[data-theme="dark"] .collapse.show     { background-color: var(--bg-body) !important }
[data-theme="dark"] .collapse.show > * { background-color: var(--bg-body) !important; color: var(--text-secondary) }

/* Schema FAQ */
[data-theme="dark"] .schema-faq-section { background-color: var(--bg-body) !important; border-color: rgba(255,255,255,.06) }
[data-theme="dark"] .schema-faq-answer   { background-color: var(--bg-body) !important; color: var(--text-secondary) }
[data-theme="dark"] .schema-faq-answer * { background-color: var(--bg-body) !important }

/* ============================================
   Screenshots
   ============================================ */
[data-theme="dark"] .screenshots-section { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .screenshots-header { color: var(--text-primary) }
[data-theme="dark"] .screenshot-item img { border-color: var(--border-strong) }
[data-theme="dark"] .ss-lightbox { background: rgba(0,0,0,.95) }
[data-theme="dark"] .ss-lightbox-close,
[data-theme="dark"] .ss-lightbox-prev,
[data-theme="dark"] .ss-lightbox-next { background: var(--bg-secondary); color: var(--text-primary) }
[data-theme="dark"] .ss-lightbox-close:hover,
[data-theme="dark"] .ss-lightbox-prev:hover,
[data-theme="dark"] .ss-lightbox-next:hover { background: var(--bg-tertiary) }
[data-theme="dark"] .ss-lightbox-counter { background: var(--bg-secondary); color: var(--text-muted) }

/* ============================================
   Security
   ============================================ */
[data-theme="dark"] .security-section { background-color: var(--bg-secondary-solid); border-color: var(--border-strong) }
[data-theme="dark"] .security-title { color: var(--text-primary) }
[data-theme="dark"] .security-text { color: var(--text-secondary) }
[data-theme="dark"] .security-check { color: var(--text-muted) }
[data-theme="dark"] .security-icon-wrap { background-color: var(--green-100) }
[data-theme="dark"] .security-icon-wrap svg { color: var(--green-700) }
[data-theme="dark"] .virustotal-link { border: 2px solid var(--bg-tertiary); background: var(--bg-primary) }

/* ============================================
   Stats & Info
   ============================================ */
[data-theme="dark"] .stat-card,
[data-theme="dark"] .info-item { background-color: var(--bg-secondary); border-color: var(--border-color) }
[data-theme="dark"] .stat-value { color: var(--text-white) }
[data-theme="dark"] .scan-label,
[data-theme="dark"] .security-date { color: var(--text-muted) }
[data-theme="dark"] .info-value { color: var(--text-white) }
[data-theme="dark"] .info-link a { color: var(--blue-500) }
[data-theme="dark"] .info-label,
[data-theme="dark"] .info-mono { color: var(--text-muted) }

/* ============================================
   Help Box
   ============================================ */
[data-theme="dark"] .help-box { background-color: var(--blue-100); border-color: var(--blue-800) }
[data-theme="dark"] .help-box-title { color: var(--blue-700) }
[data-theme="dark"] .help-box-list { color: var(--blue-600) }
[data-theme="dark"] .help-box-icon-wrap { background-color: rgba(30,58,138,.4) }
[data-theme="dark"] .help-box-icon-wrap svg { color: var(--blue-500) }

/* ============================================
   XAPK Notice
   ============================================ */
[data-theme="dark"] .xapk-notice { background-color: var(--amber-100); border-color: var(--amber-500) }
[data-theme="dark"] .xapk-notice-title { color: var(--amber-700) }
[data-theme="dark"] .xapk-notice-text { color: rgba(252,211,77,.8) }
[data-theme="dark"] .xapk-notice-icon { color: var(--amber-500) }

/* ============================================
   Install Guide
   ============================================ */
[data-theme="dark"] .install-tabs-container { border-color: var(--bg-tertiary) }
[data-theme="dark"] .install-tabs { background-color: var(--bg-secondary-solid) }
[data-theme="dark"] .install-tab.active[data-tab="apk"] { color: var(--green-700); background-color: var(--bg-primary) }
[data-theme="dark"] .install-tab.active[data-tab="xapk"] { background-color: var(--bg-primary) }
[data-theme="dark"] .step-emerald { background-color: var(--green-50) }
[data-theme="dark"] .step-blue { background-color: var(--blue-50) }
[data-theme="dark"] .step-title { color: var(--text-white) }
[data-theme="dark"] .step-desc { color: var(--text-muted) }

/* ============================================
   Sticky Bottom Bar
   ============================================ */
[data-theme="dark"] .sticky-bottom-bar { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .sticky-app-title { color: var(--text-primary) }
[data-theme="dark"] .sticky-app-meta { color: var(--text-muted) }

/* ============================================
   Modals
   ============================================ */
[data-theme="dark"] .ci-modal-content { background-color: var(--bg-primary) }
[data-theme="dark"] .ci-modal-content h4,
[data-theme="dark"] .ci-modal-title { color: var(--text-primary) }
[data-theme="dark"] .ci-modal-content p,
[data-theme="dark"] .ci-modal-text { color: var(--text-secondary) }
[data-theme="dark"] .ci-modal-text a { color: var(--blue-600) }
[data-theme="dark"] .ci-modal-close { color: var(--text-muted) }
[data-theme="dark"] .ci-modal-close:hover { background-color: var(--bg-secondary); color: var(--text-primary) }
[data-theme="dark"] .ci-modal-icon { background-color: var(--blue-50); color: var(--blue-600) }
[data-theme="dark"] .page-link .svg-6 { fill: #fff }

/* ============================================
   Footer
   ============================================ */
[data-theme="dark"] footer,
[data-theme="dark"] .site-footer { background-color: var(--bg-primary); border-color: var(--border-color); color: var(--text-secondary) }
[data-theme="dark"] .site-footer .bg-dark { background-color: #172031 !important }
[data-theme="dark"] .site-footer a { color: var(--text-muted) }
[data-theme="dark"] .site-footer a:hover { color: var(--text-primary) }
[data-theme="dark"] .site-footer svg { fill: var(--text-muted) }

/* ============================================
   Tables — table-striped dark mode (same logic as light)
   light: nth-of-type(odd) = rgba(0,0,0,.05)
   dark:  nth-of-type(odd) = rgba(255,255,255,.04)
   ============================================ */
[data-theme="dark"] table { color: var(--text-secondary) }
[data-theme="dark"] thead th,
[data-theme="dark"] th { background-color: var(--bg-secondary-solid) !important; color: var(--text-primary); border-color: rgba(255,255,255,.08) !important }
[data-theme="dark"] td { border-color: rgba(255,255,255,.06) !important }

[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) > td,
[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) > th { background-color: rgba(255,255,255,.04) !important }
[data-theme="dark"] .table-striped tbody tr:nth-of-type(even) > td,
[data-theme="dark"] .table-striped tbody tr:nth-of-type(even) > th { background-color: transparent !important }

/* جداول بدون table-striped */
[data-theme="dark"] tbody tr:nth-of-type(odd)  td { background-color: rgba(255,255,255,.04) !important }
[data-theme="dark"] tbody tr:nth-of-type(even) td { background-color: transparent !important }

/* Info items */
[data-theme="dark"] .info-item { background-color: var(--bg-secondary) !important; border-color: rgba(255,255,255,.06) !important }

/* ============================================
   Pagination
   ============================================ */
[data-theme="dark"] .pagination .page-link { background-color: var(--bg-secondary); border-color: var(--border-strong); color: var(--text-secondary) }
[data-theme="dark"] .pagination .page-link:hover { background-color: var(--bg-tertiary); color: var(--text-primary) }
[data-theme="dark"] .pagination .page-item.active .page-link { background-color: var(--green-500); border-color: var(--green-500); color: #fff }

/* ============================================
   Breadcrumb
   ============================================ */
[data-theme="dark"] .breadcrumb { background-color: var(--bg-body) !important }
[data-theme="dark"] .breadcrumb-item a { color: var(--text-muted) }
[data-theme="dark"] .breadcrumb-item a:hover { color: var(--text-primary) }
[data-theme="dark"] .breadcrumb-item.active { color: var(--text-secondary) }
[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { color: var(--text-light) }

/* ============================================
   Widgets
   ============================================ */
[data-theme="dark"] .widget { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .widget-title { color: var(--text-primary); border-color: var(--border-color) }
[data-theme="dark"] .widget a { color: var(--text-secondary) }
[data-theme="dark"] .widget a:hover { color: var(--text-primary) }

/* ============================================
   App Cards
   ============================================ */
[data-theme="dark"] .app-card { background-color: var(--bg-primary); border-color: var(--border-color) }
[data-theme="dark"] .app-card:hover { background-color: var(--bg-secondary); border-color: var(--green-800) }
[data-theme="dark"] .app-card-title { color: var(--text-primary) }
[data-theme="dark"] .app-card-dev { color: var(--text-muted) }
[data-theme="dark"] .app-card-icon { border-color: var(--border-strong) }

/* ============================================
   Alerts
   ============================================ */
[data-theme="dark"] .alert-info { background-color: var(--blue-50); border-color: var(--border-color); color: var(--blue-600) }
[data-theme="dark"] .alert-success { background-color: var(--green-50); border-color: var(--green-800); color: var(--green-600) }
[data-theme="dark"] .alert-warning { background-color: var(--amber-50); border-color: var(--amber-500); color: var(--amber-600) }

/* ============================================
   Comments
   ============================================ */
[data-theme="dark"] .comment { border-color: var(--border-color) }
[data-theme="dark"] .comment-author { color: var(--text-primary) }
[data-theme="dark"] .comment-text { color: var(--text-secondary) }
[data-theme="dark"] .comment-date { color: var(--text-muted) }

/* ============================================
   Scrollbar
   ============================================ */
[data-theme="dark"] ::-webkit-scrollbar { width: 8px; height: 8px }
[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg-secondary-solid) }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--bg-tertiary); border-radius: 4px }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: var(--text-light) }

/* ============================================
   Selection
   ============================================ */
[data-theme="dark"] ::selection { background-color: var(--green-500); color: #fff }

/* ============================================
   Dark Mode Toggle Icons
   ============================================ */
.icon-sun  { display: block }
.icon-moon { display: none  }
[data-theme="dark"] .icon-sun  { display: none  }
[data-theme="dark"] .icon-moon { display: block }

/* ============================================
   Transitions
   ============================================ */
body,
.site-header,
.bg-white,
.card,
.form-control,
.btn,
.desc-section,
.faq-section,
.screenshots-section,
.dl-box,
.help-box,
.app-card,
.security-section,
.install-guide-section,
.sidebar-panel,
.search-box,
.header-lang-dropdown {
    transition: background-color .2s ease, border-color .2s ease, color .2s ease
}