/* ================================================================ */
/* DARK MODE - فایل کاملاً مجزا
/* ================================================================ */

body.dark-mode {
    /* ========================================================== */
    /* BACKGROUNDS - پس‌زمینه‌ها */
    /* ========================================================== */
    --bg-body: #1a1d2e;           /* ← پس‌زمینه اصلی (آبی-تیره) */
    --bg-card: #22263b;           /* ← کارت‌ها (یک درجه روشن‌تر) */
    --bg-glass: rgba(34, 38, 59, 0.85);  /* ← پس‌زمینه شیشه‌ای */
    --bg-hover: rgba(34, 38, 59, 0.6);    /* ← هاور */

    /* ========================================================== */
    /* TEXT COLORS - رنگ‌های متن */
    /* ========================================================== */
    --text-primary: #e8edf5;       /* ← متن اصلی (سفید-کرمی) */
    --text-secondary: #c8d0dc;     /* ← متن فرعی (خاکستری روشن) */
    --text-muted: #8892a8;         /* ← متن کم‌رنگ (خاکستری) */

    /* ========================================================== */
    /* BORDERS & SHADOWS - حاشیه‌ها و سایه‌ها */
    /* ========================================================== */
    --border-color: #2d3147;       /* ← حاشیه‌ها (روشن‌تر از پس‌زمینه) */
    --shadow-color: rgba(0, 0, 0, 0.4);

    /* ========================================================== */
    /* NAVBAR & FOOTER - نوار ناوبری و فوتر */
    /* ========================================================== */
    --nav-bg: rgba(26, 29, 46, 0.92);
    --footer-bg: rgba(26, 29, 46, 0.7);
    --input-bg: rgba(34, 38, 59, 0.7);
}

/* ========================================================== */
/* BASE
/* ========================================================== */
body.dark-mode {
    background: var(--bg-body);
    color: var(--text-primary);
}

body.dark-mode .page-wrapper::before {
    background: rgba(255, 138, 0, 0.04);
}

body.dark-mode .page-wrapper::after {
    background: rgba(16, 185, 129, 0.03);
}

body.dark-mode .bg-blob-1 {
    background: rgba(255, 138, 0, 0.03);
}

body.dark-mode .bg-blob-2 {
    background: rgba(16, 185, 129, 0.02);
}

/* ========================================================== */
/* NAVBAR
/* ========================================================== */
body.dark-mode .navbar-glass {
    background: var(--nav-bg);
    border-color: rgba(255, 255, 255, 0.04);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

body.dark-mode .brand-link,
body.dark-mode .brand-name {
    color: var(--text-primary);
}

body.dark-mode .brand-link:hover {
    color: #fff;
}

body.dark-mode .search-box input {
    background: rgba(26, 29, 39, 0.7);
    border-color: rgba(255, 255, 255, 0.05);
    color: var(--text-primary);
}

body.dark-mode .search-box input::placeholder {
    color: var(--text-muted);
}

body.dark-mode .search-box input:focus {
    background: #1a1d27;
    border-color: var(--primary);
}

body.dark-mode .search-box .search-icon {
    color: var(--text-muted);
}

body.dark-mode .btn-theme {
    background: rgba(26, 29, 39, 0.7);
    border-color: rgba(255, 255, 255, 0.05);
    color: var(--text-muted);
}

body.dark-mode .btn-theme:hover {
    background: #2a2d3a;
    color: var(--text-primary);
}

body.dark-mode .btn-login {
    background: #2563eb;
    box-shadow: 0 4px 16px rgba(37, 99, 235, 0.3);
}

body.dark-mode .btn-login:hover {
    background: #1d4ed8;
}

body.dark-mode .btn-menu {
    color: var(--text-muted);
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .btn-menu:hover {
    background: #1a1d27;
    color: var(--text-primary);
}

body.dark-mode .navbar-links .nav-link {
    color: var(--text-muted);
}

body.dark-mode .navbar-links .nav-link:hover {
    color: var(--text-primary);
}

body.dark-mode .navbar-links .nav-link.active {
    color: var(--primary);
    background: rgba(255, 138, 0, 0.08);
}

body.dark-mode .dropdown-toggle-btn {
    background: rgba(26, 29, 39, 0.5);
    border-color: rgba(255, 255, 255, 0.04);
    color: var(--text-muted);
}

body.dark-mode .dropdown-toggle-btn:hover {
    background: #1a1d27;
}

body.dark-mode .dropdown-menu-services {
    background: rgba(26, 29, 39, 0.95);
    border-color: var(--border-color);
}

body.dark-mode .dropdown-header {
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .dropdown-item {
    color: var(--text-secondary);
}

body.dark-mode .dropdown-item:hover {
    background: rgba(255, 255, 255, 0.03);
}

body.dark-mode .dropdown-item .item-desc {
    color: var(--text-muted);
}

body.dark-mode .dropdown-item .item-arrow {
    color: var(--text-muted);
}

body.dark-mode .mobile-menu {
    background: rgba(15, 17, 23, 0.95);
    border-color: var(--border-color);
}

body.dark-mode .mobile-link {
    color: var(--text-muted);
}

body.dark-mode .mobile-link:hover {
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.03);
}

body.dark-mode .mobile-link.active {
    color: var(--primary);
    background: rgba(255, 138, 0, 0.08);
}

body.dark-mode .mobile-services-toggle {
    color: var(--text-muted);
}

body.dark-mode .mobile-services-toggle:hover {
    color: var(--text-primary);
}

body.dark-mode .mobile-services-list a {
    color: var(--text-muted);
}

body.dark-mode .mobile-services-list a:hover {
    background: rgba(255, 255, 255, 0.03);
    color: var(--text-primary);
}

body.dark-mode .mobile-btn-login {
    background: #2563eb;
}

body.dark-mode .mobile-btn-login:hover {
    background: #1d4ed8;
}

body.dark-mode .mobile-divider {
    border-color: var(--border-color);
}

/* ========================================================== */
/* HERO
/* ========================================================== */
body.dark-mode .hero-badge {
    background: rgba(26, 29, 39, 0.7);
    border-color: rgba(255, 255, 255, 0.04);
    color: var(--text-muted);
}

body.dark-mode .hero-title {
    color: var(--text-primary);
}

body.dark-mode .hero-title .text-gray {
    color: var(--text-muted);
}

body.dark-mode .hero-desc {
    color: var(--text-muted);
}

body.dark-mode .hero-image-glass {
    background: rgba(26, 29, 39, 0.3);
    border-color: rgba(255, 255, 255, 0.04);
}

body.dark-mode .hero-image {
    border-color: rgba(255, 255, 255, 0.04);
}

/* ========================================================== */
/* SECTION HEADER
/* ========================================================== */
body.dark-mode .section-title {
    color: var(--text-primary);
}

body.dark-mode .section-subtitle {
    color: var(--text-muted);
}

/* ========================================================== */
/* STEPS
/* ========================================================== */
body.dark-mode .step-card {
    background: var(--bg-card);
    border-color: var(--border-color);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

body.dark-mode .step-card:hover {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.3);
}

body.dark-mode .step-title {
    color: var(--text-primary);
}

body.dark-mode .step-desc {
    color: var(--text-muted);
}

body.dark-mode .step-icon {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-secondary);
}

body.dark-mode .step-top.green {
    background: rgba(16, 185, 129, 0.12);
}
body.dark-mode .step-top.red {
    background: rgba(239, 68, 68, 0.12);
}
body.dark-mode .step-top.blue {
    background: rgba(59, 130, 246, 0.12);
}
body.dark-mode .step-top.cyan {
    background: rgba(6, 182, 212, 0.12);
}
body.dark-mode .step-top.yellow {
    background: rgba(245, 158, 11, 0.12);
}
body.dark-mode .step-top.purple {
    background: rgba(139, 92, 246, 0.12);
}
body.dark-mode .step-top.pink {
    background: rgba(236, 72, 153, 0.12);
}
body.dark-mode .step-top.emerald {
    background: rgba(16, 185, 129, 0.12);
}

body.dark-mode .step-top.green .step-number {
    color: #34d399;
}
body.dark-mode .step-top.red .step-number {
    color: #f87171;
}
body.dark-mode .step-top.blue .step-number {
    color: #60a5fa;
}
body.dark-mode .step-top.cyan .step-number {
    color: #22d3ee;
}
body.dark-mode .step-top.yellow .step-number {
    color: #fbbf24;
}
body.dark-mode .step-top.purple .step-number {
    color: #a78bfa;
}
body.dark-mode .step-top.pink .step-number {
    color: #f472b6;
}
body.dark-mode .step-top.emerald .step-number {
    color: #34d399;
}

/* ========================================================== */
/* PROJECT CARDS
/* ========================================================== */
body.dark-mode .project-front {
    background: linear-gradient(to bottom right, rgba(255, 138, 0, 0.15), rgba(26, 29, 39, 0.8), rgba(16, 185, 129, 0.1));
}

body.dark-mode .project-front-inner {
    background: var(--bg-card);
}

body.dark-mode .project-title {
    color: var(--text-primary);
}

body.dark-mode .project-desc {
    color: var(--text-muted);
}

body.dark-mode .project-tag {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .project-arrow {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .project-card-wrapper:hover .project-arrow {
    background: rgba(255, 138, 0, 0.12);
    color: var(--primary);
}

body.dark-mode .project-stack-2 {
    background: rgba(26, 29, 39, 0.3);
    border-color: rgba(255, 255, 255, 0.03);
}

body.dark-mode .project-stack-1 {
    background: rgba(26, 29, 39, 0.4);
    border-color: rgba(255, 255, 255, 0.03);
}

/* ========================================================== */
/* CTA BANNER
/* ========================================================== */
body.dark-mode .cta-banner {
    background: linear-gradient(to right, rgba(255, 138, 0, 0.06), rgba(251, 191, 36, 0.02));
    border-color: rgba(255, 138, 0, 0.08);
}

body.dark-mode .cta-title {
    color: var(--text-primary);
}

body.dark-mode .cta-desc {
    color: var(--text-muted);
}

body.dark-mode .btn-cta {
    background: #2563eb;
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.25);
}

body.dark-mode .btn-cta:hover {
    background: #1d4ed8;
    box-shadow: 0 12px 32px rgba(37, 99, 235, 0.35);
}

/* ========================================================== */
/* TESTIMONIALS
/* ========================================================== */
body.dark-mode .testimonials-section::before {
    background: rgba(15, 17, 23, 0.4);
    border-color: var(--border-color);
}

body.dark-mode .testimonial-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .testimonial-text {
    color: var(--text-secondary);
}

body.dark-mode .author-name {
    color: var(--text-primary);
}

body.dark-mode .author-company {
    color: var(--text-muted);
}

body.dark-mode .testimonial-author img {
    border-color: var(--border-color);
}

/* ========================================================== */
/* BLOG CARDS
/* ========================================================== */
body.dark-mode .blog-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .blog-card:hover {
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

body.dark-mode .blog-title {
    color: var(--text-primary);
}

body.dark-mode .blog-card:hover .blog-title {
    color: #34d399;
}

body.dark-mode .blog-excerpt {
    color: var(--text-muted);
}

body.dark-mode .blog-date {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .blog-arrow {
    background: rgba(16, 185, 129, 0.12);
    color: #34d399;
    border-color: rgba(16, 185, 129, 0.15);
}

body.dark-mode .blog-card:hover .blog-arrow {
    background: #2563eb;
    color: #fff;
}

body.dark-mode .blog-image-wrapper {
    background: rgba(26, 29, 39, 0.5);
    border-color: var(--border-color);
}

/* ========================================================== */
/* FILTER SIDEBAR
/* ========================================================== */
body.dark-mode .filter-sidebar {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .filter-btn {
    color: var(--text-muted);
}

body.dark-mode .filter-btn:hover {
    color: var(--text-primary);
}

body.dark-mode .filter-btn.active {
    color: var(--primary);
    background: rgba(255, 138, 0, 0.08);
}

body.dark-mode .filter-btn .badge-count {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
}

body.dark-mode .filter-btn.active .badge-count {
    background: var(--primary);
    color: #fff;
}

/* ========================================================== */
/* FOOTER
/* ========================================================== */
body.dark-mode .footer {
    background: var(--footer-bg);
    border-color: var(--border-color);
}

body.dark-mode .footer-brand .brand-name {
    color: var(--text-primary);
}

body.dark-mode .footer-desc {
    color: var(--text-muted);
}

body.dark-mode .footer-title {
    color: var(--text-primary);
}

body.dark-mode .footer-links a {
    color: var(--text-muted);
}

body.dark-mode .footer-links a:hover {
    color: var(--primary);
}

body.dark-mode .footer-contact li {
    color: var(--text-muted);
}

body.dark-mode .footer-contact i {
    color: var(--text-muted);
}

body.dark-mode .footer-social a {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .footer-social a:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--text-primary);
}

body.dark-mode .footer-bottom {
    border-color: var(--border-color);
}

body.dark-mode .footer-copy {
    color: var(--text-muted);
}

body.dark-mode .footer-legal a {
    color: var(--text-muted);
}

body.dark-mode .footer-legal a:hover {
    color: var(--text-primary);
}

/* ========================================================== */
/* TEAM CARDS
/* ========================================================== */
body.dark-mode .team-member-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .team-member-name {
    color: var(--text-primary);
}

body.dark-mode .team-member-card:hover .team-member-name {
    color: var(--primary);
}

body.dark-mode .team-member-bio {
    color: var(--text-muted);
}

body.dark-mode .skill-tag {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .team-member-card:hover .skill-tag {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
    border-color: rgba(255, 138, 0, 0.15);
}

body.dark-mode .team-member-avatar {
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .team-member-card:hover .team-member-avatar {
    border-color: var(--primary);
    box-shadow: 0 0 0 8px rgba(255, 138, 0, 0.08);
}

/* ========================================================== */
/* TEAM DETAIL
/* ========================================================== */
body.dark-mode .team-detail-role-badge {
    background: rgba(255, 138, 0, 0.08);
    border-color: rgba(255, 138, 0, 0.15);
}

body.dark-mode .team-detail-name {
    color: var(--text-primary);
}

body.dark-mode .team-detail-role {
    color: var(--text-muted);
}

body.dark-mode .team-detail-bio p {
    color: var(--text-secondary);
}

body.dark-mode .social-link {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .social-link:hover {
    color: #fff;
}

body.dark-mode .skill-badge-lg {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-mode .skill-badge-lg:hover {
    border-color: var(--primary);
    color: var(--primary);
}

/* ========================================================== */
/* BLOG DETAIL
/* ========================================================== */
body.dark-mode .blog-detail-back {
    background: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .blog-detail-back:hover {
    border-color: rgba(255, 255, 255, 0.1);
    color: var(--text-primary);
}

body.dark-mode .blog-detail-meta {
    color: var(--text-muted);
}

body.dark-mode .blog-detail-title {
    color: var(--text-primary);
}

body.dark-mode .blog-detail-author {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .blog-detail-author-name {
    color: var(--text-primary);
}

body.dark-mode .blog-detail-author-role {
    color: var(--text-muted);
}

body.dark-mode .blog-detail-image {
    border-color: var(--border-color);
}

body.dark-mode .blog-detail-excerpt {
    border-color: #34d399;
}

body.dark-mode .blog-detail-excerpt p {
    color: var(--text-secondary);
}

body.dark-mode .blog-detail-content p {
    color: var(--text-secondary);
}

body.dark-mode .blog-detail-content h2,
body.dark-mode .blog-detail-content h3 {
    color: var(--text-primary);
}

body.dark-mode .blog-detail-list li {
    color: var(--text-secondary);
}

body.dark-mode .blog-detail-conclusion {
    background: rgba(26, 29, 39, 0.5);
    border-color: var(--border-color);
}

body.dark-mode .blog-detail-conclusion h3 {
    color: var(--text-primary);
}

body.dark-mode .blog-detail-conclusion p {
    color: var(--text-secondary);
}

body.dark-mode .blog-detail-tag {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .blog-detail-author-bio {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .blog-detail-author-bio-name {
    color: var(--text-primary);
}

body.dark-mode .blog-detail-author-bio-text {
    color: var(--text-muted);
}

body.dark-mode .blog-detail-author-bio-link {
    color: var(--text-muted);
}

body.dark-mode .blog-detail-author-bio-link:hover {
    color: var(--text-primary);
}

/* ========================================================== */
/* BLOG COMMENTS
/* ========================================================== */
body.dark-mode .blog-comments {
    border-color: var(--border-color);
}

body.dark-mode .blog-comments-title {
    color: var(--text-primary);
}

body.dark-mode .blog-comments-subtitle {
    color: var(--text-muted);
}

body.dark-mode .blog-comments-count {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .blog-comments-title-wrapper i {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
    border-color: rgba(255, 138, 0, 0.08);
}

body.dark-mode .blog-comment-form-wrapper {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .blog-comment-form-title {
    color: var(--text-primary);
}

body.dark-mode .blog-comment-form .form-label {
    color: var(--text-secondary);
}

body.dark-mode .blog-comment-form .form-control {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .blog-comment-form .form-control:focus {
    background: #1a1d27;
    border-color: var(--primary);
}

body.dark-mode .blog-comment-form .form-control::placeholder {
    color: var(--text-muted);
}

body.dark-mode .blog-comment-item {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .blog-comment-item:hover {
    background: rgba(26, 29, 39, 0.8);
}

body.dark-mode .blog-comment-author {
    color: var(--text-primary);
}

body.dark-mode .blog-comment-date {
    color: var(--text-muted);
}

body.dark-mode .blog-comment-badge {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
}

body.dark-mode .blog-comment-text {
    color: var(--text-secondary);
}

body.dark-mode .blog-comment-like {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .blog-comment-like:hover {
    border-color: rgba(239, 68, 68, 0.3);
    background: rgba(239, 68, 68, 0.08);
}

body.dark-mode .blog-comment-reply-btn {
    color: var(--text-muted);
}

body.dark-mode .blog-comment-reply-btn:hover {
    color: var(--primary);
    background: rgba(255, 138, 0, 0.08);
    border-color: rgba(255, 138, 0, 0.08);
}

body.dark-mode .blog-comment-reply {
    border-color: var(--border-color);
}

body.dark-mode .blog-comment-reply-avatar-letter {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
}

body.dark-mode .blog-comment-reply-author {
    color: var(--text-primary);
}

body.dark-mode .blog-comment-reply-badge {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
}

body.dark-mode .blog-comment-reply-badge.admin {
    background: var(--primary);
    color: #fff;
}

body.dark-mode .blog-comment-reply-date {
    color: var(--text-muted);
}

body.dark-mode .blog-comment-reply-text {
    color: var(--text-secondary);
}

body.dark-mode .blog-comment-reply-form-wrapper {
    border-color: var(--border-color);
}

body.dark-mode .blog-comment-reply-form .form-control {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .blog-comment-reply-form .form-control:focus {
    background: #1a1d27;
}

body.dark-mode .btn-reply-cancel {
    color: var(--text-muted);
}

body.dark-mode .btn-reply-cancel:hover {
    color: var(--text-primary);
    background: rgba(26, 29, 39, 0.7);
}

/* ========================================================== */
/* BLOG PAGINATION
/* ========================================================== */
body.dark-mode .blog-pagination .page-item .page-link {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .blog-pagination .page-item .page-link:hover {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
    border-color: rgba(255, 138, 0, 0.15);
}

body.dark-mode .blog-pagination .page-item.active .page-link {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

body.dark-mode .blog-pagination .page-item.disabled .page-link {
    opacity: 0.2;
}

/* ========================================================== */
/* BLOG TAG BUTTONS
/* ========================================================== */
body.dark-mode .blog-tag-btn {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .blog-tag-btn:hover {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
    border-color: rgba(255, 138, 0, 0.15);
}

body.dark-mode .blog-tag-btn.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

/* ========================================================== */
/* BLOG SIDEBAR CARD
/* ========================================================== */
body.dark-mode .blog-sidebar-card {
    background: rgba(26, 29, 39, 0.5);
    border-color: var(--border-color);
}

body.dark-mode .blog-sidebar-card-title {
    color: var(--text-primary);
}

body.dark-mode .blog-sidebar-card-desc {
    color: var(--text-muted);
}

/* ========================================================== */
/* TERMS
/* ========================================================== */
body.dark-mode .terms-sidebar {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .terms-sidebar-label {
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .terms-tab-btn {
    color: var(--text-muted);
}

body.dark-mode .terms-tab-btn:hover {
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.02);
}

body.dark-mode .terms-tab-btn.active {
    background: var(--primary);
    color: #fff;
}

body.dark-mode .terms-content-wrapper {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .terms-content-title {
    color: var(--text-primary);
}

body.dark-mode .terms-content-icon {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
}

body.dark-mode .terms-content-body p {
    color: var(--text-secondary);
}

body.dark-mode .terms-bullets {
    border-color: var(--border-color);
}

body.dark-mode .terms-bullets h4 {
    color: var(--text-primary);
}

body.dark-mode .terms-bullets ul li {
    background: rgba(26, 29, 39, 0.5);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-mode .terms-bottom-banner-inner {
    background: rgba(255, 138, 0, 0.04);
    border-color: rgba(255, 138, 0, 0.06);
}

body.dark-mode .terms-bottom-banner-title {
    color: #fbbf24;
}

body.dark-mode .terms-bottom-banner-desc {
    color: #fcd34d;
}

/* ========================================================== */
/* AUTH PAGES
/* ========================================================== */
body.dark-mode .auth-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .auth-title {
    color: var(--text-primary);
}

body.dark-mode .auth-subtitle {
    color: var(--text-muted);
}

body.dark-mode .auth-form-label {
    color: var(--text-secondary);
}

body.dark-mode .auth-form-label i {
    color: var(--text-muted);
}

body.dark-mode .auth-form-input {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .auth-form-input:focus {
    background: #1a1d27;
    border-color: var(--primary);
}

body.dark-mode .auth-form-input::placeholder {
    color: var(--text-muted);
}

body.dark-mode .auth-form-hint {
    color: var(--text-muted);
}

body.dark-mode .auth-demo-btn {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .auth-demo-btn:hover {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
    border-color: rgba(255, 138, 0, 0.15);
}

body.dark-mode .auth-security {
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .auth-footer-links {
    color: var(--text-muted);
}

body.dark-mode .auth-footer-links a {
    color: var(--primary);
}

body.dark-mode .auth-back-home a {
    color: var(--text-muted);
}

body.dark-mode .auth-back-home a:hover {
    color: var(--text-primary);
}

body.dark-mode .auth-icon {
    background: var(--primary);
}

/* ========================================================== */
/* SERVICES
/* ========================================================== */
body.dark-mode .service-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .service-card-title {
    color: var(--text-primary);
}

body.dark-mode .service-card-desc {
    color: var(--text-muted);
}

body.dark-mode .service-card-footer {
    border-color: var(--border-color);
}

body.dark-mode .service-card-tag {
    color: var(--text-muted);
}

body.dark-mode .service-card:hover .service-card-tag {
    color: var(--primary);
}

body.dark-mode .service-card-arrow {
    background: rgba(26, 29, 39, 0.7);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .service-card:hover .service-card-arrow {
    background: rgba(255, 138, 0, 0.08);
    color: var(--primary);
}

body.dark-mode .service-card::before {
    background: radial-gradient(circle, rgba(255, 138, 0, 0.04), transparent);
}

/* ========================================================== */
/* SERVICE DETAIL
/* ========================================================== */
body.dark-mode .seo-top-banner {
    border-color: rgba(16, 185, 129, 0.08);
    background: linear-gradient(to right, rgba(16, 185, 129, 0.03), transparent);
}

body.dark-mode .seo-top-banner-text {
    color: var(--text-muted);
}

body.dark-mode .service-detail-breadcrumb {
    color: var(--text-muted);
}

body.dark-mode .service-detail-breadcrumb:hover {
    color: var(--text-primary);
}

body.dark-mode .service-detail-hero-title {
    color: var(--text-primary);
}

body.dark-mode .service-detail-hero-desc {
    color: var(--text-muted);
}

body.dark-mode .service-detail-badge-label {
    color: var(--text-muted);
}

body.dark-mode .service-detail-metrics {
    background: rgba(26, 29, 39, 0.5);
    border-color: var(--border-color);
}

body.dark-mode .service-detail-metrics-title {
    color: var(--text-muted);
}

body.dark-mode .service-detail-metrics-list li {
    color: var(--text-muted);
}

body.dark-mode .service-detail-team {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .service-detail-team-title {
    color: var(--text-muted);
}

body.dark-mode .service-detail-team-name {
    color: var(--text-primary);
}

body.dark-mode .service-detail-team-role {
    color: var(--text-muted);
}

body.dark-mode .service-detail-team-item:hover {
    background: rgba(255, 255, 255, 0.02);
}

body.dark-mode .service-detail-section-title {
    color: var(--text-primary);
}

body.dark-mode .service-detail-full-text {
    color: var(--text-secondary);
}

body.dark-mode .service-detail-seo-block.seo-challenge {
    background: rgba(239, 68, 68, 0.04);
    border-color: rgba(239, 68, 68, 0.06);
}

body.dark-mode .service-detail-seo-block p {
    color: var(--text-secondary);
}

body.dark-mode .service-detail-feature-item {
    background: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-mode .service-detail-view-all {
    color: #34d399;
}

body.dark-mode .service-detail-view-all:hover {
    color: #6ee7b7;
}

body.dark-mode .service-detail-related-project {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .service-detail-related-project-title {
    color: var(--text-primary);
}

body.dark-mode .service-detail-related-project-desc {
    color: var(--text-muted);
}

body.dark-mode .service-detail-related-article {
    background: rgba(26, 29, 39, 0.5);
    border-color: var(--border-color);
}

body.dark-mode .service-detail-related-article:hover {
    background: var(--bg-card);
}

body.dark-mode .service-detail-related-article-title {
    color: var(--text-primary);
}

body.dark-mode .service-detail-related-article-date {
    color: var(--text-muted);
}

body.dark-mode .service-detail-faq-item {
    border-color: var(--border-color);
}

body.dark-mode .service-detail-faq-q {
    background: rgba(26, 29, 39, 0.5);
    color: var(--text-primary);
}

body.dark-mode .service-detail-faq-q:hover {
    background: rgba(26, 29, 39, 0.8);
}

body.dark-mode .service-detail-faq-a p {
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-mode .service-detail-google-mockup {
    background: #0a0c12;
    border-color: rgba(255, 255, 255, 0.03);
}

/* ========================================================== */
/* CONTACT FAQ
/* ========================================================== */
body.dark-mode .contact-faq-item {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .contact-faq-item:hover {
    background: rgba(26, 29, 39, 0.8);
}

body.dark-mode .contact-faq-item-title {
    color: var(--text-primary);
}

body.dark-mode .contact-faq-item-desc {
    color: var(--text-muted);
}

body.dark-mode .contact-faq-item-icon {
    background: rgba(255, 138, 0, 0.08);
}

body.dark-mode .contact-faq-header-title {
    color: var(--text-primary);
}

body.dark-mode .contact-faq-header-desc {
    color: var(--text-muted);
}
/* ================================================================ */
/* PRICING PAGE - DARK MODE
/* ================================================================ */

body.dark-mode .pricing-page-bg {
    background: var(--bg-body);
}

body.dark-mode .pricing-header-badge {
    background: rgba(255, 138, 0, 0.12);
    color: #fbbf24;
    border-color: rgba(255, 138, 0, 0.15);
}

body.dark-mode .pricing-title {
    color: var(--text-primary);
}

body.dark-mode .pricing-desc {
    color: var(--text-muted);
}

/* Calculator */
body.dark-mode .calc-wrapper {
    background: var(--bg-card);
    border-color: var(--border-color);
    box-shadow: 0 20px 40px var(--shadow-color);
}

body.dark-mode .calc-controls {
    border-color: var(--border-color);
}

body.dark-mode .calc-step-title {
    color: var(--text-primary);
}

body.dark-mode .calc-step-desc {
    color: var(--text-muted);
}

body.dark-mode .calc-step-badge.orange {
    background: rgba(255, 138, 0, 0.12);
    color: #fbbf24;
}

body.dark-mode .calc-step-badge.emerald {
    background: rgba(16, 185, 129, 0.12);
    color: #34d399;
}

/* Tier Buttons */
body.dark-mode .tier-btn {
    background: rgba(26, 29, 39, 0.6);
    border-color: var(--border-color);
}

body.dark-mode .tier-btn:hover {
    background: rgba(26, 29, 39, 0.8);
}

body.dark-mode .tier-btn .tier-label {
    color: var(--text-primary);
}

body.dark-mode .tier-btn .tier-desc {
    color: var(--text-muted);
}

body.dark-mode .tier-btn .tier-icon {
    color: var(--text-muted);
}

body.dark-mode .tier-btn.active {
    border-color: var(--primary);
    background: rgba(255, 138, 0, 0.08);
}

body.dark-mode .tier-btn.active .tier-icon {
    color: var(--primary);
}

/* Module Buttons */
body.dark-mode .module-btn {
    background: rgba(26, 29, 39, 0.6);
    border-color: var(--border-color);
}

body.dark-mode .module-btn:hover {
    background: rgba(26, 29, 39, 0.8);
}

body.dark-mode .module-btn.active {
    border-color: #34d399;
    background: rgba(16, 185, 129, 0.08);
}

body.dark-mode .module-btn .module-name {
    color: var(--text-primary);
}

body.dark-mode .module-btn .module-price {
    color: #34d399;
}

body.dark-mode .module-btn .module-check {
    border-color: var(--border-color);
}

body.dark-mode .module-btn.active .module-check {
    background: #34d399;
    border-color: #34d399;
}

/* Result */
body.dark-mode .calc-result {
    background: linear-gradient(135deg, #0a0c12, #151821);
}

body.dark-mode .result-footer-note {
    color: #6b7280;
}

/* Packages */
body.dark-mode .package-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .package-card:hover {
    box-shadow: 0 20px 40px var(--shadow-color);
}

body.dark-mode .package-card.popular {
    border-color: var(--primary);
    background: linear-gradient(135deg, var(--bg-card), rgba(255, 138, 0, 0.05));
}

body.dark-mode .package-name {
    color: var(--text-primary);
}

body.dark-mode .package-tagline {
    color: var(--text-muted);
}

body.dark-mode .package-price {
    color: #34d399;
    border-color: var(--border-color);
}

body.dark-mode .package-badge.default {
    background: rgba(26, 29, 39, 0.7);
    color: var(--text-muted);
}

body.dark-mode .package-features li {
    color: var(--text-secondary);
}

body.dark-mode .package-features li i {
    color: #34d399;
}

body.dark-mode .btn-package {
    background: rgba(26, 29, 39, 0.6);
    border-color: var(--border-color);
    color: var(--text-primary);
}

body.dark-mode .btn-package:hover {
    background: rgba(26, 29, 39, 0.8);
}

body.dark-mode .btn-package.popular-btn {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

body.dark-mode .btn-package.popular-btn:hover {
    background: var(--primary-dark);
}

body.dark-mode .btn-package.enterprise-btn {
    background: rgba(26, 29, 39, 0.8);
    color: var(--text-primary);
    border-color: var(--border-color);
}

body.dark-mode .btn-package.enterprise-btn:hover {
    background: rgba(26, 29, 39, 0.9);
}

/* FAQ */
body.dark-mode .faq-item {
    background: rgba(26, 29, 39, 0.4);
    border-color: var(--border-color);
}

body.dark-mode .faq-item .faq-q {
    color: var(--text-primary);
}

body.dark-mode .faq-item .faq-q i {
    color: var(--text-muted);
}

body.dark-mode .faq-item .faq-a-inner {
    color: var(--text-secondary);
    border-color: var(--border-color);
}

/* Itemized Table */
body.dark-mode .itemized-table {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .itemized-table thead {
    background: rgba(26, 29, 39, 0.5);
}

body.dark-mode .itemized-table thead th {
    color: var(--text-muted);
    border-color: var(--border-color);
}

body.dark-mode .itemized-table tbody td {
    color: var(--text-secondary);
    border-color: rgba(26, 29, 39, 0.5);
}

body.dark-mode .itemized-table tbody .text-muted-custom {
    color: var(--text-muted);
}

body.dark-mode .itemized-table tbody .text-emerald-custom {
    color: #34d399;
}
/* ================================================================ */
/* SUPPORT MODAL - DARK MODE
/* ================================================================ */

body.dark-mode .support-modal {
    background: rgba(31, 41, 55, 0.95);
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .support-section-title {
    color: #e5e7eb;
}

body.dark-mode .support-section-desc {
    color: #9ca3af;
}

body.dark-mode .support-platform {
    background: #1f2937;
    border-color: #374151;
}

body.dark-mode .support-platform:hover {
    border-color: #4b5563;
}

body.dark-mode .support-platform.active {
    border-color: #10b981;
    background: rgba(16, 185, 129, 0.1);
}

body.dark-mode .support-platform-name {
    color: #e5e7eb;
}

body.dark-mode .support-chat-box {
    background: #1f2937;
    border-color: #374151;
}

body.dark-mode .support-greeting {
    border-color: #374151;
}

body.dark-mode .support-greeting-title {
    color: #e5e7eb;
}

body.dark-mode .text-muted {
    color: #e5e7eb;
}

body.dark-mode .support-greeting-desc {
    color: #9ca3af;
}

body.dark-mode .support-input {
    background: #1f2937;
    border-color: #374151;
    color: #e5e7eb;
}

body.dark-mode .support-input:focus {
    border-color: #10b981;
}

body.dark-mode .support-input::placeholder {
    color: #6b7280;
}

body.dark-mode .support-textarea {
    background: #1f2937;
    border-color: #374151;
    color: #e5e7eb;
}

body.dark-mode .support-textarea:focus {
    border-color: #10b981;
}

body.dark-mode .support-textarea::placeholder {
    color: #6b7280;
}

body.dark-mode .support-char-count {
    color: #6b7280;
}

body.dark-mode .support-btn-primary {
    background: #374151;
    color: #e5e7eb;
}

body.dark-mode .support-btn-primary:hover {
    background: #4b5563;
}

body.dark-mode .support-call {
    background: linear-gradient(135deg, #1f2937, rgba(255, 138, 0, 0.04));
    border-color: #374151;
}

body.dark-mode .support-call-title {
    color: #e5e7eb;
}

body.dark-mode .support-call-desc {
    color: #9ca3af;
}

body.dark-mode .support-call-btn {
    background: #1f2937;
    border-color: #374151;
    color: #e5e7eb;
}

body.dark-mode .support-call-btn:hover {
    border-color: #f97316;
    color: #f97316;
}

body.dark-mode .support-footer {
    background: #1f2937;
    border-color: #374151;
}

body.dark-mode .support-footer-text {
    color: #6b7280;
}

body.dark-mode .support-footer-link {
    color: #34d399;
}

body.dark-mode .support-footer-link:hover {
    color: #10b981;
}

body.dark-mode .floating-tooltip {
    background: #1f2937;
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .floating-btn {
    background: linear-gradient(135deg, #059669, #047857);
}
/* ================================================================ */
/* ITEMIZED TABLE - FORCE DARK MODE
/* ================================================================ */
body.dark-mode .itemized-table,
body.dark-mode .itemized-table * {
    background: transparent !important;
}

body.dark-mode .itemized-table {
    background: #22263b !important;
    border-color: #2d3147 !important;
}

body.dark-mode .itemized-table thead {
    background: rgba(34, 38, 59, 0.5) !important;
}

body.dark-mode .itemized-table thead th {
    color: #8892a8 !important;
    border-color: #2d3147 !important;
    background: transparent !important;
}

body.dark-mode .itemized-table tbody td {
    color: #c8d0dc !important;
    border-color: rgba(45, 49, 71, 0.4) !important;
    background: transparent !important;
}

body.dark-mode .itemized-table tbody .text-muted-custom {
    color: #8892a8 !important;
}

body.dark-mode .itemized-table tbody .text-emerald-custom {
    color: #34d399 !important;
}

body.dark-mode .itemized-table tbody tr:hover td {
    background: rgba(34, 38, 59, 0.3) !important;
}
body.dark-mode .itemized-table {
    background: #22263b !important;
}
/* ================================================================ */
/* CONTACT PAGE - DARK MODE (اصلاح سریع)
/* ================================================================ */

/* ========================================================== */
/* CONTACT INFO CARD
/* ========================================================== */
body.dark-mode .contact-section .card[style*="background:rgba(255,255,255,0.6)"] {
    background: rgba(34, 38, 59, 0.7) !important;
    border-color: #2d3147 !important;
}

body.dark-mode .contact-section .card[style*="background:#fff"] {
    background: rgba(34, 38, 59, 0.7) !important;
    border-color: #2d3147 !important;
}

/* ========================================================== */
/* CONTACT INFO ITEMS
/* ========================================================== */
body.dark-mode .contact-section .d-flex[style*="background:#fff"] {
    background: rgba(34, 38, 59, 0.7) !important;
    border-color: #2d3147 !important;
}

body.dark-mode .contact-section .d-flex[style*="border-color:var(--gray-200)"] {
    border-color: #2d3147 !important;
}

/* ========================================================== */
/* CONTACT INFO TEXT
/* ========================================================== */
body.dark-mode .contact-section .fw-black[style*="color:var(--gray-800)"] {
    color: #e8edf5 !important;
}

body.dark-mode .contact-section .text-muted {
    color: #8892a8 !important;
}

body.dark-mode .contact-section .fw-black:not([style*="color"]) {
    color: #e8edf5 !important;
}

/* ========================================================== */
/* CONTACT FORM CARD
/* ========================================================== */
body.dark-mode .contact-section .card[style*="background:#fff"]:has(.contact-form) {
    background: rgba(34, 38, 59, 0.7) !important;
    border-color: #2d3147 !important;
}

body.dark-mode .contact-section .card.border-0.shadow-lg.p-4.p-md-5 {
    background: rgba(34, 38, 59, 0.7) !important;
    border-color: #2d3147 !important;
}

/* ========================================================== */
/* FORM CONTROLS
/* ========================================================== */
body.dark-mode .contact-section input.form-control,
body.dark-mode .contact-section textarea.form-control,
body.dark-mode .contact-section select.form-select {
    background: rgba(34, 38, 59, 0.7) !important;
    border-color: #2d3147 !important;
    color: #e8edf5 !important;
}

body.dark-mode .contact-section input.form-control:focus,
body.dark-mode .contact-section textarea.form-control:focus,
body.dark-mode .contact-section select.form-select:focus {
    background: #22263b !important;
    border-color: #ff8a00 !important;
    box-shadow: 0 0 0 3px rgba(255, 138, 0, 0.08) !important;
    color: #e8edf5 !important;
}

body.dark-mode .contact-section input.form-control::placeholder,
body.dark-mode .contact-section textarea.form-control::placeholder {
    color: #8892a8 !important;
}

body.dark-mode .contact-section .form-label {
    color: #c8d0dc !important;
}

/* ========================================================== */
/* SUBMIT BUTTON
/* ========================================================== */
body.dark-mode .contact-section .btn-dark {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
}

body.dark-mode .contact-section .btn-dark:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* ========================================================== */
/* COPY BUTTON
/* ========================================================== */
body.dark-mode .contact-section .btn-outline-secondary {
    border-color: #2d3147 !important;
    color: #8892a8 !important;
}

body.dark-mode .contact-section .btn-outline-secondary:hover {
    background: rgba(34, 38, 59, 0.8) !important;
    color: #e8edf5 !important;
}

/* ========================================================== */
/* MAP CARD
/* ========================================================== */
body.dark-mode .contact-section [style*="background:var(--gray-800)"] {
    background: #1a1d2e !important;
    border: 1px solid #2d3147 !important;
}

body.dark-mode .contact-section .text-light-emphasis {
    color: #8892a8 !important;
}

body.dark-mode .contact-section .badge.bg-white\/10 {
    background: rgba(255, 255, 255, 0.05) !important;
}
/* ================================================================ */
/* PORTFOLIO DETAIL - DARK MODE
/* ================================================================ */

body.dark-mode .portfolio-detail-back {
    background: rgba(34, 38, 59, 0.6);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-back:hover {
    border-color: var(--primary);
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-badge {
    background: rgba(34, 38, 59, 0.6);
    border-color: var(--border-color);
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-year {
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-title {
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-desc {
    color: var(--text-secondary);
}

body.dark-mode .portfolio-detail-info {
    background: rgba(34, 38, 59, 0.4);
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-info-title {
    color: var(--text-muted);
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .portfolio-detail-info-list > div {
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .portfolio-detail-info-list dt {
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-info-list dd {
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-team {
    background: rgba(34, 38, 59, 0.4);
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-team-title {
    color: var(--text-muted);
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-mode .portfolio-detail-team-item:hover {
    background: rgba(255, 255, 255, 0.03);
}

body.dark-mode .portfolio-detail-team-name {
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-team-role {
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-section-title {
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-section-subtitle {
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-section-text {
    color: var(--text-secondary);
}

body.dark-mode .seo-challenge {
    background: rgba(239, 68, 68, 0.04);
    border-color: rgba(239, 68, 68, 0.06);
}

body.dark-mode .seo-solution {
    background: rgba(16, 185, 129, 0.04);
    border-color: rgba(16, 185, 129, 0.06);
}

body.dark-mode .portfolio-detail-process-list li {
    background: rgba(34, 38, 59, 0.4);
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-mode .portfolio-detail-stat {
    background: rgba(34, 38, 59, 0.4);
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-stat-label {
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-faq-item {
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-faq-q {
    background: rgba(34, 38, 59, 0.3);
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-faq-q:hover {
    background: rgba(34, 38, 59, 0.5);
}

body.dark-mode .portfolio-detail-faq-q i:last-child {
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-faq-a p {
    border-color: var(--border-color);
    color: var(--text-secondary);
}

body.dark-mode .portfolio-detail-google-mockup {
    background: #0a0c12;
}

body.dark-mode .similar-project-card {
    background: var(--bg-card);
    border-color: var(--border-color);
}

body.dark-mode .similar-project-title {
    color: var(--text-primary);
}

body.dark-mode .similar-project-desc {
    color: var(--text-muted);
}

body.dark-mode .portfolio-detail-similar-title {
    color: var(--text-primary);
}

body.dark-mode .portfolio-detail-seo {
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-similar {
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-media-wrapper {
    border-color: var(--border-color);
}

body.dark-mode .portfolio-detail-media-caption {
    color: var(--text-muted);
}
/* ================================================================ */
/* CATEGORY DESCRIPTION - DARK MODE
/* ================================================================ */
body.dark-mode .category-description-card {
    background: rgba(34, 38, 59, 0.6);
    border-color: var(--border-color, #2d3147);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

body.dark-mode .category-description-card:hover {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

body.dark-mode .category-description-card::before {
    background: radial-gradient(circle, rgba(255, 138, 0, 0.06), transparent 70%);
}

body.dark-mode .category-description-card::after {
    background: radial-gradient(circle, rgba(16, 185, 129, 0.04), transparent 70%);
}

body.dark-mode .category-description-icon {
    background: linear-gradient(135deg, rgba(255, 138, 0, 0.15), rgba(255, 138, 0, 0.05));
    border-color: rgba(255, 138, 0, 0.06);
}

body.dark-mode .category-description-label {
    color: var(--text-muted, #8892a8);
}

body.dark-mode .category-description-text {
    color: var(--text-secondary, #c8d0dc);
}

body.dark-mode .category-description-card::after {
    opacity: 0.4;
}