/**
 * Dark Mode Styles - Modern & Elegant
 * Compatible with all pages
 */

/* Dark Mode Variables - Improved Color Palette */
:root {
    --dm-bg-primary: #0f172a;
    --dm-bg-secondary: #1e293b;
    --dm-bg-tertiary: #334155;
    --dm-bg-card: #1e293b;
    --dm-text-primary: #f1f5f9;
    --dm-text-secondary: #cbd5e1;
    --dm-text-tertiary: #94a3b8;
    --dm-border: #334155;
    --dm-border-light: #475569;
    --dm-border-hover: #64748b;
    --dm-shadow: rgba(0, 0, 0, 0.4);
    --dm-shadow-lg: rgba(0, 0, 0, 0.6);
    --dm-accent: #FF6600;
    --dm-accent-hover: #FF8533;
    --dm-accent-light: rgba(255, 102, 0, 0.1);
    --dm-success: #10b981;
    --dm-warning: #f59e0b;
    --dm-error: #ef4444;
    --dm-info: #3b82f6;
}

/* Dark Mode Base Styles */
.dark-mode,
.dark-mode html,
.dark-mode body {
    background-color: var(--dm-bg-primary) !important;
    color: var(--dm-text-primary);
}

.dark-mode body {
    background: var(--dm-bg-primary) !important;
}

/* Force all white backgrounds to dark */
.dark-mode [style*="background: #fff"],
.dark-mode [style*="background:#fff"],
.dark-mode [style*="background: #ffffff"],
.dark-mode [style*="background:#ffffff"],
.dark-mode [style*="background: white"],
.dark-mode [style*="background:white"] {
    background: var(--dm-bg-secondary) !important;
}

/* All sections with white background */
.dark-mode section,
.dark-mode div[class*="section"],
.dark-mode div[class*="container"] {
    background-color: transparent;
}

/* Default text colors */
.dark-mode h1,
.dark-mode h2,
.dark-mode h3,
.dark-mode h4,
.dark-mode h5,
.dark-mode h6 {
    color: var(--dm-text-primary);
}

.dark-mode p,
.dark-mode span,
.dark-mode div {
    color: var(--dm-text-secondary);
}

/* Override all white backgrounds in style.css */
.dark-mode .hero-section {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .hero-section-new {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .services-slider {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .hosting-plans {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .cloud-vps-pricing {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .vps-locations {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .trust-statistics-section {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .comment {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .support-types {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .persian-gulf-section {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .blogs {
    background: var(--dm-bg-primary) !important;
}

/* Cards and boxes - Improved */
.dark-mode .card,
.dark-mode .box,
.dark-mode [class*="card"],
.dark-mode [class*="Card"] {
    background: var(--dm-bg-card) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-primary) !important;
    box-shadow: 0 2px 8px var(--dm-shadow) !important;
}

.dark-mode .card:hover,
.dark-mode [class*="card"]:hover {
    border-color: var(--dm-border-hover) !important;
    box-shadow: 0 4px 16px var(--dm-shadow-lg) !important;
}

/* All containers */
.dark-mode [class*="container"] {
    background-color: transparent !important;
}

/* All sections */
.dark-mode section {
    background-color: transparent !important;
}

/* Universal dark mode overrides - Catch all white backgrounds */
.dark-mode * {
    background-color: inherit;
}

/* Force override for common white background classes */
.dark-mode [class*="white"],
.dark-mode [class*="White"],
.dark-mode [class*="bg-white"],
.dark-mode [class*="bg-White"] {
    background: var(--dm-bg-secondary) !important;
}

/* Override inline styles with white background */
.dark-mode [style*="background"] {
    /* This will be handled by specific selectors */
}

/* Ensure all main content areas are dark */
.dark-mode main,
.dark-mode article,
.dark-mode aside {
    background-color: transparent;
}

/* Products and services pages */
.dark-mode .phome,
.dark-mode .ahome,
.dark-mode .terms-section,
.dark-mode .cpanel-section,
.dark-mode .download-section {
    background: var(--dm-bg-primary) !important;
}

/* Tables */
.dark-mode table {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode table th,
.dark-mode table td {
    border-color: var(--dm-border);
    color: var(--dm-text-primary);
}

/* Buttons - Improved */
.dark-mode .btn,
.dark-mode button:not(.dark-mode-toggle),
.dark-mode [class*="btn"]:not(.dark-mode-toggle) {
    background-color: var(--dm-bg-tertiary) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-primary) !important;
}

.dark-mode .btn:hover,
.dark-mode button:hover:not(.dark-mode-toggle),
.dark-mode [class*="btn"]:hover:not(.dark-mode-toggle) {
    background-color: var(--dm-bg-secondary) !important;
    border-color: var(--dm-border-hover) !important;
    color: var(--dm-text-primary) !important;
}

.dark-mode .btn-primary,
.dark-mode .header-btn-primary,
.dark-mode [class*="btn-primary"],
.dark-mode [class*="btn"][class*="primary"] {
    background: linear-gradient(135deg, var(--dm-accent) 0%, var(--dm-accent-hover) 100%) !important;
    border-color: var(--dm-accent) !important;
    color: #ffffff !important;
}

.dark-mode .btn-primary:hover,
.dark-mode .header-btn-primary:hover,
.dark-mode [class*="btn-primary"]:hover {
    background: linear-gradient(135deg, var(--dm-accent-hover) 0%, #FFA366 100%) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.3) !important;
    transform: translateY(-2px);
}

.dark-mode .btn-secondary {
    background: var(--dm-bg-tertiary) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-primary) !important;
}

.dark-mode .btn-secondary:hover {
    background: var(--dm-bg-secondary) !important;
    border-color: var(--dm-border-hover) !important;
}

.dark-mode .btn-success {
    background: var(--dm-success) !important;
    border-color: var(--dm-success) !important;
    color: #ffffff !important;
}

.dark-mode .btn-danger {
    background: var(--dm-error) !important;
    border-color: var(--dm-error) !important;
    color: #ffffff !important;
}

.dark-mode .btn-info {
    background: var(--dm-info) !important;
    border-color: var(--dm-info) !important;
    color: #ffffff !important;
}

.dark-mode .btn-warning {
    background: var(--dm-warning) !important;
    border-color: var(--dm-warning) !important;
    color: #ffffff !important;
}

/* Links */
.dark-mode a {
    color: var(--dm-text-secondary);
}

.dark-mode a:hover {
    color: var(--dm-accent);
}

/* Global override for any remaining white backgrounds - Fixed */
.dark-mode *:not(img):not(video):not(svg):not(canvas):not(.dark-mode-toggle):not(.dark-mode-toggle *) {
    background-color: inherit;
}

/* Specific overrides for common patterns */
.dark-mode [style*="background-color: #fff"],
.dark-mode [style*="background-color:#fff"],
.dark-mode [style*="background-color: #ffffff"],
.dark-mode [style*="background-color:#ffffff"],
.dark-mode [style*="background: #fff"],
.dark-mode [style*="background:#fff"],
.dark-mode [style*="background: #ffffff"],
.dark-mode [style*="background:#ffffff"],
.dark-mode [style*="background: white"],
.dark-mode [style*="background:white"] {
    background: var(--dm-bg-secondary) !important;
    background-color: var(--dm-bg-secondary) !important;
}

/* Ensure body and html are always dark */
.dark-mode html {
    background: var(--dm-bg-primary) !important;
}

.dark-mode body {
    background: var(--dm-bg-primary) !important;
    min-height: 100vh;
}

/* Header Dark Mode */
.dark-mode .main-header {
    background: var(--dm-bg-secondary);
    border-bottom: 1px solid var(--dm-border);
    box-shadow: 0 2px 12px var(--dm-shadow);
}

.dark-mode .header-navigation .nav-link {
    color: var(--dm-text-secondary);
}

.dark-mode .header-navigation .nav-link:hover {
    color: var(--dm-accent);
    background: rgba(255, 102, 0, 0.1);
}

.dark-mode .header-phone-link {
    background: rgba(255, 102, 0, 0.1);
    border-color: rgba(255, 102, 0, 0.2);
    color: var(--dm-text-secondary);
}

.dark-mode .header-phone-link:hover {
    background: rgba(255, 102, 0, 0.15);
    border-color: rgba(255, 102, 0, 0.3);
}

.dark-mode .header-phone-link span {
    color: var(--dm-text-secondary);
}

.dark-mode .header-btn-primary {
    background: linear-gradient(135deg, var(--dm-accent) 0%, var(--dm-accent-hover) 100%) !important;
    box-shadow: 0 2px 8px rgba(255, 102, 0, 0.3) !important;
    color: #ffffff !important;
    border: none !important;
}

.dark-mode .header-btn-primary:hover {
    background: linear-gradient(135deg, var(--dm-accent-hover) 0%, #FFA366 100%) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.4) !important;
}

/* Blog Page Dark Mode */
.dark-mode .blog-page {
    background: var(--dm-bg-primary);
}

.dark-mode .blog-breadcrumb a {
    color: var(--dm-accent);
}

.dark-mode .blog-breadcrumb {
    color: var(--dm-text-tertiary);
}

.dark-mode .blog-article,
.dark-mode .blog-related-section,
.dark-mode .blog-sidebar-widget {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
    box-shadow: 0 2px 8px var(--dm-shadow);
}

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

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

.dark-mode .blog-publish-date,
.dark-mode .blog-stat-item {
    color: var(--dm-text-tertiary);
}

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

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

.dark-mode .blog-content h2 {
    border-bottom-color: var(--dm-accent);
}

.dark-mode .blog-content a {
    color: var(--dm-accent);
    border-bottom-color: rgba(255, 102, 0, 0.3);
}

.dark-mode .blog-content blockquote {
    background: var(--dm-bg-tertiary);
    border-right-color: var(--dm-accent);
    color: var(--dm-text-secondary);
}

.dark-mode .blog-content code {
    background: var(--dm-bg-tertiary);
    color: #f472b6;
}

.dark-mode .blog-content pre {
    background: var(--dm-bg-tertiary);
    color: var(--dm-text-secondary);
}

.dark-mode .blog-toc {
    background: var(--dm-bg-tertiary);
    border-color: var(--dm-border);
}

.dark-mode .blog-toc-header h3 {
    color: var(--dm-text-primary);
}

.dark-mode .blog-toc-item a {
    color: var(--dm-text-secondary);
}

.dark-mode .blog-toc-item a:hover {
    color: var(--dm-accent);
}

.dark-mode .blog-share-section {
    background: var(--dm-bg-tertiary);
    border-color: var(--dm-border);
}

.dark-mode .blog-share-label {
    color: var(--dm-text-secondary);
}

.dark-mode .blog-widget-title {
    color: var(--dm-text-primary);
    border-bottom-color: var(--dm-border);
}

.dark-mode .blog-popular-content h4,
.dark-mode .blog-recent-content h4,
.dark-mode .blog-related-content h3 {
    color: var(--dm-text-primary);
}

.dark-mode .blog-popular-item,
.dark-mode .blog-recent-item {
    border-bottom-color: var(--dm-border);
}

.dark-mode .blog-recent-item:hover {
    background: var(--dm-bg-tertiary);
    border-color: var(--dm-border-light);
}

.dark-mode .blog-category-link {
    background: var(--dm-bg-tertiary);
    color: var(--dm-text-secondary);
    border-color: transparent;
}

.dark-mode .blog-category-link:hover {
    background: rgba(255, 102, 0, 0.1);
    border-color: rgba(255, 102, 0, 0.2);
    color: var(--dm-accent);
}

.dark-mode .blog-related-card {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .blog-related-card:hover {
    border-color: var(--dm-accent);
    box-shadow: 0 8px 24px var(--dm-shadow);
}

/* Single Blog Dark Mode */
.dark-mode .sblog {
    background: var(--dm-bg-primary);
}

.dark-mode .sblog-article {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .sblog-header h1 {
    color: var(--dm-text-primary);
}

.dark-mode .sblog-meta span {
    background: var(--dm-bg-tertiary);
    color: var(--dm-text-secondary);
}

.dark-mode .sblog-description {
    color: var(--dm-text-secondary);
}

.dark-mode .sblog-description h1,
.dark-mode .sblog-description h2,
.dark-mode .sblog-description h3,
.dark-mode .sblog-description h4 {
    color: var(--dm-text-primary);
}

.dark-mode .sblog-share {
    background: var(--dm-bg-tertiary);
    border-color: var(--dm-border);
}

.dark-mode .sidebar-widget {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .sidebar-widget h3 {
    color: var(--dm-text-primary);
    border-bottom-color: var(--dm-border);
}

.dark-mode .popular-item h4,
.dark-mode .related-item h4 {
    color: var(--dm-text-primary);
}

/* Blogs Page Dark Mode */
.dark-mode .blogs {
    background: var(--dm-bg-primary);
}

.dark-mode .blogs-banner {
    background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
}

.dark-mode .blog-card {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .blog-card:hover {
    border-color: var(--dm-accent);
    box-shadow: 0 8px 24px var(--dm-shadow);
}

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

.dark-mode .blog-card-title a:hover {
    color: var(--dm-accent);
}

.dark-mode .blog-card-description {
    color: var(--dm-text-secondary);
}

.dark-mode .filter-btn {
    background: var(--dm-bg-tertiary);
    color: var(--dm-text-secondary);
    border-color: var(--dm-border);
}

.dark-mode .filter-btn:hover {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border-light);
}

.dark-mode .filter-btn.active {
    background: var(--dm-accent);
    color: #ffffff;
    border-color: var(--dm-accent);
}

.dark-mode .sidebar-widget {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

/* Footer Dark Mode */
.dark-mode footer {
    background: var(--dm-bg-secondary);
    border-top-color: var(--dm-border);
    color: var(--dm-text-secondary);
}

.dark-mode footer a {
    color: var(--dm-text-secondary);
}

.dark-mode footer a:hover {
    color: var(--dm-accent);
}

/* General Dark Mode Styles */
.dark-mode .card,
.dark-mode .box,
.dark-mode .panel {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
    color: var(--dm-text-primary);
}

.dark-mode input,
.dark-mode textarea,
.dark-mode select {
    background: var(--dm-bg-tertiary);
    border-color: var(--dm-border);
    color: var(--dm-text-primary);
}

.dark-mode input:focus,
.dark-mode textarea:focus,
.dark-mode select:focus {
    border-color: var(--dm-accent);
    box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.1);
}

/* Footer Dark Mode */
.dark-mode footer {
    background: var(--dm-bg-secondary);
    border-top-color: var(--dm-border);
    color: var(--dm-text-secondary);
}

.dark-mode footer a {
    color: var(--dm-text-secondary);
}

.dark-mode footer a:hover {
    color: var(--dm-accent);
}

.dark-mode footer h3,
.dark-mode footer h4 {
    color: var(--dm-text-primary);
}

/* Footer Dark Mode Toggle */
.dark-mode .footer-dark-mode-toggle {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.9) 0%, rgba(51, 65, 85, 0.9) 100%);
    border-color: rgba(255, 102, 0, 0.5);
    box-shadow: 0 4px 20px rgba(255, 102, 0, 0.4), inset 0 0 20px rgba(0, 0, 0, 0.3);
}

.dark-mode .footer-dark-mode-toggle:hover {
    border-color: rgba(255, 102, 0, 0.7);
    box-shadow: 0 6px 25px rgba(255, 102, 0, 0.5), inset 0 0 25px rgba(0, 0, 0, 0.4);
}

.dark-mode .footer-dark-mode-toggle.active {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.95) 0%, rgba(51, 65, 85, 0.95) 100%);
    border-color: rgba(255, 102, 0, 0.6);
}

/* Megamenu Dark Mode */
.dark-mode .megamenu {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .megamenu-sidebar-item {
    color: var(--dm-text-secondary);
}

.dark-mode .megamenu-sidebar-item:hover,
.dark-mode .megamenu-sidebar-item.active {
    background: var(--dm-bg-tertiary);
    color: var(--dm-text-primary);
}

.dark-mode .megamenu-panel {
    background: var(--dm-bg-secondary);
}

.dark-mode .panel-category h3 {
    color: var(--dm-text-primary);
}

.dark-mode .panel-category a {
    color: var(--dm-text-secondary);
}

.dark-mode .panel-category a:hover {
    color: var(--dm-accent);
}

.dark-mode .product-card {
    background: var(--dm-bg-tertiary);
    border-color: var(--dm-border);
}

.dark-mode .product-card:hover {
    border-color: var(--dm-accent);
}

.dark-mode .product-info h4 {
    color: var(--dm-text-primary);
}

.dark-mode .product-info p {
    color: var(--dm-text-secondary);
}

/* Mobile Menu Dark Mode */
.dark-mode .headermobile {
    background: var(--dm-bg-secondary);
    border-bottom-color: var(--dm-border);
}

.dark-mode .menu {
    background: var(--dm-bg-secondary);
}

.dark-mode .menu-btn a {
    color: var(--dm-text-secondary);
}

.dark-mode .menu-btn a:hover {
    color: var(--dm-accent);
}

/* Main Page Sections Dark Mode */
.dark-mode .hero-section,
.dark-mode .hero-section-new {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .hero-section-new-container {
    background: var(--dm-bg-primary);
}

.dark-mode .hero-section-new-title,
.dark-mode .hero-section-new-subtitle,
.dark-mode .hero-title-sub {
    color: var(--dm-text-primary) !important;
}

.dark-mode .hero-section-new-description,
.dark-mode .hero-description {
    color: var(--dm-text-secondary) !important;
}

.dark-mode .hero-feature-item span,
.dark-mode .hero-section-new-feature-item span {
    color: var(--dm-text-secondary) !important;
}

.dark-mode .hero-feature-item i {
    color: var(--dm-accent) !important;
}

/* Services Slider Dark Mode */
.dark-mode .services-slider {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .services-slider-title h1,
.dark-mode .services-slider-title p {
    color: var(--dm-text-primary);
}

.dark-mode .service-card {
    background: var(--dm-bg-secondary) !important;
    border-color: var(--dm-border);
}

.dark-mode .service-card h3,
.dark-mode .service-card-content h3 {
    color: var(--dm-text-primary);
}

.dark-mode .service-card p,
.dark-mode .service-card-content p {
    color: var(--dm-text-secondary);
}

/* Hosting Plans Dark Mode */
.dark-mode .hosting-plans {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .hosting-plans-header h1 {
    color: var(--dm-text-primary);
}

.dark-mode .hosting-plan-card {
    background: var(--dm-bg-secondary) !important;
    border-color: var(--dm-border);
}

.dark-mode .hosting-plan-card-header h3,
.dark-mode .hosting-plan-card-header p {
    color: var(--dm-text-primary);
}

.dark-mode .hosting-plan-card-description p {
    color: var(--dm-text-secondary);
}

/* Cloud VPS Pricing Dark Mode */
.dark-mode .cloud-vps-pricing {
    background: var(--dm-bg-primary) !important;
}

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

.dark-mode .cloud-vps-pricing-table {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .cloud-vps-pricing-table th,
.dark-mode .cloud-vps-pricing-table td {
    border-color: var(--dm-border);
    color: var(--dm-text-primary);
}

.dark-mode .cloud-vps-row-label {
    color: var(--dm-text-secondary);
}

.dark-mode .cloud-vps-price,
.dark-mode .cloud-vps-spec {
    color: var(--dm-text-primary);
}

/* VPS Locations Dark Mode */
.dark-mode .vps-locations {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .vps-locations-title h1,
.dark-mode .vps-locations-title p {
    color: var(--dm-text-primary);
}

.dark-mode .vps-location-card {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .vps-location-content h3 {
    color: var(--dm-text-primary);
}

.dark-mode .vps-location-content p {
    color: var(--dm-text-secondary);
}

/* Trust Statistics Dark Mode */
.dark-mode .trust-statistics-section {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .trust-statistics-title h1,
.dark-mode .trust-statistics-title p {
    color: var(--dm-text-primary);
}

.dark-mode .trust-statistics-item-number,
.dark-mode .trust-statistics-item-label {
    color: var(--dm-text-primary);
}

/* Comments Dark Mode */
.dark-mode .comment {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .comment-title-text h1,
.dark-mode .comment-title-text p {
    color: var(--dm-text-primary);
}

.dark-mode .comments {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .comment-about h2 {
    color: var(--dm-text-primary);
}

.dark-mode .comment-about p,
.dark-mode .comment-bottom p {
    color: var(--dm-text-secondary);
}

/* Support Types Dark Mode */
.dark-mode .support-types {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .support-types-header h1,
.dark-mode .support-types-header p {
    color: var(--dm-text-primary);
}

.dark-mode .support-type-card {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
}

.dark-mode .support-type-card h3 {
    color: var(--dm-text-primary);
}

.dark-mode .support-type-card p {
    color: var(--dm-text-secondary);
}

/* Persian Gulf Section Dark Mode */
.dark-mode .persian-gulf-section {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .persian-gulf-text h1,
.dark-mode .persian-gulf-text p {
    color: var(--dm-text-primary);
}

.dark-mode .persian-gulf-badge {
    background: var(--dm-bg-secondary);
    border-color: var(--dm-border);
    color: var(--dm-text-primary);
}

/* Com Banner Dark Mode - Removed */

/* Blogs Section in Index Dark Mode */
.dark-mode .blogs {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .blogs-header-content h2,
.dark-mode .blogs-header-content p {
    color: var(--dm-text-primary);
}

.dark-mode .blogs-card {
    background: var(--dm-bg-secondary) !important;
    border-color: var(--dm-border);
}

.dark-mode .blogs-card-title h3 {
    color: var(--dm-text-primary);
}

.dark-mode .blogs-card:hover {
    border-color: var(--dm-accent);
    box-shadow: 0 8px 24px var(--dm-shadow);
}

.dark-mode .blogs-card-meta {
    color: var(--dm-text-tertiary);
}

.dark-mode .blogs-card-excerpt {
    color: var(--dm-text-secondary);
}

/* Products Page Dark Mode */
.dark-mode .phome {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .phome h1,
.dark-mode .phome h3 {
    color: var(--dm-text-primary);
}

.dark-mode .phome p {
    color: var(--dm-text-secondary);
}

/* About Us Dark Mode */
.dark-mode .ahome {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .ahome h1,
.dark-mode .ahome p {
    color: var(--dm-text-primary);
}

/* Terms Dark Mode */
.dark-mode .terms-section {
    background: var(--dm-bg-primary) !important;
}

.dark-mode .terms-section h1,
.dark-mode .terms-section h2,
.dark-mode .terms-section h3 {
    color: var(--dm-text-primary);
}

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

/* Hero Section Buttons Dark Mode */
.dark-mode .hero-section-new-btn-primary {
    background: linear-gradient(135deg, var(--dm-accent) 0%, var(--dm-accent-hover) 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

.dark-mode .hero-section-new-btn-primary:hover {
    background: linear-gradient(135deg, var(--dm-accent-hover) 0%, #FFA366 100%) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.4) !important;
}

.dark-mode .hero-section-new-btn-secondary {
    background: var(--dm-bg-tertiary) !important;
    border-color: var(--dm-border) !important;
    color: var(--dm-text-primary) !important;
}

.dark-mode .hero-section-new-btn-secondary:hover {
    background: var(--dm-bg-secondary) !important;
    border-color: var(--dm-border-hover) !important;
}

/* Service Card Buttons */
.dark-mode .service-card-btn,
.dark-mode .service-card a[class*="btn"] {
    background: var(--dm-accent) !important;
    color: #ffffff !important;
    border-color: var(--dm-accent) !important;
}

.dark-mode .service-card-btn:hover,
.dark-mode .service-card a[class*="btn"]:hover {
    background: var(--dm-accent-hover) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.3) !important;
}

/* Blog Card Buttons */
.dark-mode .blog-card-link,
.dark-mode .blogs-card-link,
.dark-mode .blogs-view-all {
    background: var(--dm-accent) !important;
    color: #ffffff !important;
    border-color: var(--dm-accent) !important;
}

.dark-mode .blog-card-link:hover,
.dark-mode .blogs-card-link:hover,
.dark-mode .blogs-view-all:hover {
    background: var(--dm-accent-hover) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.3) !important;
}

/* Hosting Plan Buttons */
.dark-mode .hosting-plan-card-button a,
.dark-mode [class*="plan-card-button"] a,
.dark-mode [class*="card-button"] a {
    background: var(--dm-accent) !important;
    color: #ffffff !important;
    border-color: var(--dm-accent) !important;
}

.dark-mode .hosting-plan-card-button a:hover,
.dark-mode [class*="plan-card-button"] a:hover {
    background: var(--dm-accent-hover) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.3) !important;
}

/* VPS Location Cards */
.dark-mode .vps-location-card {
    background: var(--dm-bg-card) !important;
    border-color: var(--dm-border) !important;
}

.dark-mode .vps-location-card:hover {
    border-color: var(--dm-accent) !important;
    box-shadow: 0 4px 16px var(--dm-shadow) !important;
}

/* Comment Cards */
.dark-mode .comments {
    background: var(--dm-bg-card) !important;
    border-color: var(--dm-border) !important;
}

.dark-mode .comment-btn a {
    background: var(--dm-accent) !important;
    color: #ffffff !important;
}

.dark-mode .comment-btn a:hover {
    background: var(--dm-accent-hover) !important;
}

/* Support Type Cards */
.dark-mode .support-type-card {
    background: var(--dm-bg-card) !important;
    border-color: var(--dm-border) !important;
}

.dark-mode .support-type-card:hover {
    border-color: var(--dm-border-hover) !important;
    box-shadow: 0 4px 16px var(--dm-shadow) !important;
}

/* Persian Gulf Button */
.dark-mode .persian-gulf-btn {
    background: var(--dm-accent) !important;
    color: #ffffff !important;
    border-color: var(--dm-accent) !important;
}

.dark-mode .persian-gulf-btn:hover {
    background: var(--dm-accent-hover) !important;
    box-shadow: 0 4px 16px rgba(255, 102, 0, 0.3) !important;
}

/* Smooth Transitions */
* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Exclude images and videos from transition */
img,
video,
svg {
    transition: none;
}