/* =============== DARK MODE =============== */
html.dark-mode body {
    background: #0f172a;
    color: #f8fafc;
}
html.dark-mode .navbar {
    background: rgba(30, 41, 59, 0.8);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}
html.dark-mode .logo h2 {
    color: #f8fafc;
}
html.dark-mode .nav-menu a {
    color: #cbd5e1;
}
html.dark-mode .nav-menu a.active ,
html.dark-mode .mobile-nav-links a.active {
    color: #a78bfa;
}
html.dark-mode .user-dropdown-menu {
    background: #1e293b;
    border-color: #334155;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
html.dark-mode .user-dropdown-menu .user-dropdown-menu-item {
    color: #f1f5f9;
}
html.dark-mode .user-dropdown-menu .user-dropdown-menu-item:hover {
    background: #334155;
    color: #a78bfa;
}
html.dark-mode .logout-btn:hover {
    background: rgba(239, 68, 68, 0.1);
}
html.dark-mode .mobile-sidebar{
    background:#0f172a;
}
html.dark-mode .mobile-nav-links a{
    color:#e2e8f0;
    border-color:#1e293b;
}
html.dark-mode .mobile-language-dropdown{
    background:#1e293b;
    border-color:#334155;
}
html.dark-mode .mobile-language-dropdown a{
    color:#e2e8f0;
}
html.dark-mode .mobile-language-dropdown a:hover{
    background:#334155;
}
html.dark-mode .mobile-close-btn{
    background:#1e293b;
    color:#fff;
}
html.dark-mode .mobile-theme-switch{
    background:#1e293b;
    color:#fff;
}
html.dark-mode .mobile-logo h2{
    color:#fff;
}
html.dark-mode .mobile-divider{
    background:#334155;
}
html.dark-mode .hero-left h1 {
    color: #f8fafc;
}
html.dark-mode .hero-left p {
    color: #94a3b8;
}
html.dark-mode .badge {
    background: #1e293b;
    border-color: #334155;
    color: #e2e8f0;
}
html.dark-mode .hero-card,
html.dark-mode .card,
html.dark-mode .guest-card,
html.dark-mode .trust-section,
html.dark-mode .pricing-card {
    background: rgba(30, 41, 59, 0.8);
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
}
html.dark-mode .hero-card h3,
html.dark-mode .section-title h3,
html.dark-mode .tone-section h4 {
    color: #f8fafc;
}
html.dark-mode .progress-bar {
    background: #334155;
}
html.dark-mode textarea {
    background: #1e293b;
    border-color: #334155;
    color: #f8fafc;
}
html.dark-mode textarea:focus {
    border-color: #a78bfa;
}
html.dark-mode .clear-btn {
    background: #1e293b;
    border-color: #334155;
    color: #f8fafc;
}
html.dark-mode .tone-card {
    background: #1e293b;
    border-color: #334155;
    color: #cbd5e1;
}
html.dark-mode .tone-card.active {
    border-color: #a78bfa;
    color: #f8fafc;
}
html.dark-mode .result-box {
    border-color: #475569;
    background: rgba(30, 41, 59, 0.3);
}
html.dark-mode .result-box h4 {
    color: #f8fafc;
}
html.dark-mode .result-box p,
html.dark-mode .guest-card p,
html.dark-mode .guest-note,
html.dark-mode .word-limit,
html.dark-mode .limit-note {
    color: #94a3b8;
}
html.dark-mode .result-btn {
    background: #1e293b;
    border-color: #334155;
    color: #f8fafc;
}
html.dark-mode .result-box #humanizedResultText {
    color: #f8fafc;
}
html.dark-mode .footer {
    background: #0f172a;
    border-top-color: #1e293b;
}
html.dark-mode .footer-brand p,
html.dark-mode .footer-column a,
html.dark-mode .footer-bottom {
    color: #94a3b8;
}
html.dark-mode .footer-column h4 {
    color: #f8fafc;
}
html.dark-mode .guest-lock {
    background: #1e293b;
}

html.dark-mode .pricing-toggle {
    background: #1e293b;
    border-color: #334155;
}
html.dark-mode .pricing-toggle span {
    color: #f8fafc;
}
html.dark-mode .slider {
    background: #475569;
}
html.dark-mode .pricing-card.featured {
    border-color: #a78bfa;
}
html.dark-mode .main-heading {
    color: #f8fafc;
}
html.dark-mode .sub-heading {
    color: #94a3b8;
}

/* Catch-all for text elements */
html.dark-mode h1, html.dark-mode h2, html.dark-mode h3, html.dark-mode h4, html.dark-mode h5, html.dark-mode h6 {
    color: #f8fafc;
}
html.dark-mode p, html.dark-mode span, html.dark-mode li {
    color: #cbd5e1;
}
html.dark-mode .logo h2 span {
    color: #a78bfa;
}
html.dark-mode .login-popup,
html.dark-mode .register-popup {
    background: #1e293b;
    border-color: #334155;
    color: #cbd5e1;
}
html.dark-mode .popup-left, 
html.dark-mode .popup-right,
html.dark-mode .left-side,
html.dark-mode .right-side {
    background: #1e293b;
    border-color: #334155;
    color: #f8fafc;
}
html.dark-mode .form-group label,
html.dark-mode .remember-check {
    color: #f8fafc;
}
html.dark-mode .input-field {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
/* BLOG PAGE */
html.dark-mode .blog-page{
    background:#0F172A;
}
/* Hero */
html.dark-mode .hero-badge{
    background:rgba(124,58,237,.15);
    border-color:rgba(124,58,237,.25);
    color:#C4B5FD;
}
html.dark-mode .blog-hero h1,
html.dark-mode .section-heading h2{
    color:#F8FAFC;
}
html.dark-mode .blog-hero p{
    color:#94A3B8;
}
html.dark-mode .blog-search-form input{
    background:#111827;
    border-color:#374151;
    color:#F8FAFC;
    box-shadow:none;
}
html.dark-mode .blog-search-form input::placeholder{
    color:#64748B;
}
html.dark-mode .blog-search-form svg{
    color:#64748B;
}
html.dark-mode .blog-search-form input:focus{
    border-color:#7C3AED;
    box-shadow:0 0 0 5px rgba(124,58,237,.15);
}
/* Blog Cards */
html.dark-mode .blog-card{
    background:#111827;
    border-color:#1F2937;
    box-shadow:none;
}
html.dark-mode .blog-card:hover{
    box-shadow:0 25px 60px rgba(0,0,0,.35);
}
html.dark-mode .blog-content h3{
    color:#F8FAFC;
}
html.dark-mode .blog-content p{
    color:#94A3B8;
}
html.dark-mode .blog-meta{
    color:#94A3B8;
}
html.dark-mode .category{
    background:rgba(124,58,237,.18);
    color:#C4B5FD;
}
html.dark-mode .author strong{
    color:#F8FAFC;
}
html.dark-mode .blog-footer a{
    color:#A78BFA;
}
/* Pagination */
html.dark-mode .page,
html.dark-mode .pagination-btn,
html.dark-mode .pagination .page-link{
    background:#111827;
    border-color:#374151;
    color:#F8FAFC;
}
html.dark-mode .page:hover,
html.dark-mode .pagination-btn:hover,
html.dark-mode .pagination .page-link:hover{
    background:#1F2937;
}
html.dark-mode .page.active,
html.dark-mode .pagination .active .page-link{
    background:linear-gradient(135deg,#7C3AED,#6366F1);
    color:#fff;
    border:none;
}            
/* Testimonials */
html.dark-mode .testimonials{
    background:#0B1220;
}
html.dark-mode .testimonial-card{
    background:#111827;
    border-color:#1F2937;
    box-shadow:none;
}
html.dark-mode .testimonial-card:hover{
    box-shadow:0 25px 60px rgba(0,0,0,.35);
}
html.dark-mode .testimonial-card p{
    color:#94A3B8;
}
html.dark-mode .testimonial-user strong{
    color:#F8FAFC;
}
html.dark-mode .testimonial-user span{
    color:#94A3B8;
}
html.dark-mode .testimonial-prev , html.dark-mode .testimonial-next {
    background: transparent;
}
html.dark-mode .testimonial-prev:hover, html.dark-mode .testimonial-next:hover {
    background: #5B5CF0;
}
/* CTA */
html.dark-mode .cta-box{
    background: linear-gradient(135deg, #1E1B4B, #312E81);
}
html.dark-mode .blog-btn-primary{
    background:#fff;
    color:#7C3AED;
}
html.dark-mode .blog-btn-secondary{
    background:rgba(255,255,255,.10);
    border-color:rgba(255,255,255,.20);
}
html.dark-mode .blog-btn-secondary:hover{
    background:rgba(255,255,255,.18);
}
/* Empty State */
html.dark-mode .no-results h3{
    color:#F8FAFC;
}
/* =========================
   DARK MODE OVERRIDES
========================= */
html.dark-mode body.dashboard-body {
    background: #0f172a;
    color: #f8fafc;
}
html.dark-mode .sidebar {
    background: linear-gradient(160deg, #020617 0%, #0f172a 60%, #1e1b4b 100%);
    box-shadow: 4px 0 30px rgba(0,0,0,0.4);
}
html.dark-mode .dash-topbar {
    background: rgba(30, 41, 59, 0.85);
    border-bottom-color: #334155;
}
html.dark-mode .dash-topbar-left h1 {
    color: #f8fafc;
}
html.dark-mode .dash-topbar-left p {
    color: #94a3b8;
}
html.dark-mode .stat-card,
html.dark-mode .dash-card,
html.dark-mode .quick-actions-card,
html.dark-mode .api-key-card,
html.dark-mode .usage-summary-card,
html.dark-mode .billing-history-card,
html.dark-mode .detector-card,
html.dark-mode .support-card,
html.dark-mode .card {
    background: #1e293b;
    border-color: #334155;
    box-shadow: 0 4px 24px rgba(0,0,0,0.2);
}
html.dark-mode .stat-label {
    color: #94a3b8;
}
html.dark-mode .stat-value {
    color: #f8fafc;
}
html.dark-mode .stat-progress-bar,
html.dark-mode .usage-bar {
    background: #334155;
}
html.dark-mode .stat-footer {
    color: #94a3b8;
}
html.dark-mode .dash-card-header {
    border-bottom-color: #334155;
}
html.dark-mode .dash-card-header h3,
html.dark-mode .quick-actions-card h3,
html.dark-mode .api-key-card h3,
html.dark-mode .usage-summary-card h3 {
    color: #f8fafc;
}
html.dark-mode .history-table thead tr {
    background: #0f172a;
}
html.dark-mode .history-table th {
    color: #94a3b8;
}
html.dark-mode .history-table td {
    color: #e2e8f0;
    border-top-color: #334155;
}
html.dark-mode .history-table tbody tr:hover {
    background: rgba(15, 23, 42, 0.5);
}
html.dark-mode .history-text-preview {
    color: #e2e8f0;
}
html.dark-mode .quick-action-btn {
    background: #0f172a;
    border-color: #334155;
    color: #cbd5e1;
}
html.dark-mode .quick-action-btn:hover {
    background: #334155;
    border-color: #a78bfa;
    color: #f8fafc;
}
html.dark-mode .quick-action-icon {
    background: #1e293b;
    box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}
html.dark-mode .api-key-display {
    background: #0f172a;
    border-color: #334155;
}
html.dark-mode .api-key-value {
    color: #e2e8f0;
}
html.dark-mode .usage-info-label {
    color: #cbd5e1 !important;
}
html.dark-mode .usage-info-count {
    color: #94a3b8 !important;
}

/* Fix profile input fields */
html.dark-mode input, html.dark-mode textarea {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}
html.dark-mode label {
    color: #f8fafc !important;
}
html.dark-mode h4, html.dark-mode h1, html.dark-mode h2, html.dark-mode h3 {
    color: #f8fafc !important;
}
html.dark-mode p, html.dark-mode span, html.dark-mode li {
    color: #cbd5e1;
}
/* ===================================
   DARK MODE - PLAN PAGE
=================================== */

html.dark-mode .payment-card,
html.dark-mode .upcoming-card,
html.dark-mode .empty-state{
    background:#161b22;
    border-color:#2d333b;
}

html.dark-mode .payment-content h3,
html.dark-mode .upcoming-top h4,
html.dark-mode .section-title{
    color:#f8fafc;
}

html.dark-mode .payment-content p,
html.dark-mode .upcoming-grid span,
html.dark-mode .empty-state{
    color:#94a3b8;
}

html.dark-mode .payment-icon{
    background:#1e293b;
}

html.dark-mode .upcoming-grid strong{
    color:#f8fafc;
}

/* Active Plan Card */

html.dark-mode .active-plan-card{
    background:linear-gradient(
        135deg,
        #4f46e5,
        #6d28d9
    );
}

/* Stats */

html.dark-mode .stat-box{
    background:rgba(255,255,255,0.08);
}

html.dark-mode .stat-box strong{
    color:#ffffff;
}

html.dark-mode .stat-box span{
    color:rgba(255,255,255,0.75);
}

/* Progress */

html.dark-mode .progress-bar{
    background:rgba(255,255,255,0.12);
}

html.dark-mode .progress-fill{
    background:#ffffff;
}

/* Upcoming Status */

html.dark-mode .pending-pill{
    background:rgba(91,92,240,.15);
    color:#a5b4fc;
}

/* Hover */

html.dark-mode .upcoming-card:hover{
    box-shadow:0 15px 35px rgba(0,0,0,.35);
}

/* Cancel Button */

html.dark-mode .cancel-btn{
    background:#dc2626;
}

html.dark-mode .cancel-btn:hover{
    background:#b91c1c;
}
/* API PAGE DARK MODE */
html.dark-mode .api-hero{
    background:#0f172a;
    color:#f8fafc;
}
/* Containers */
html.dark-mode .section-heading h2, html.dark-mode .hero-content h1, html.dark-mode .api-service-card h3, 
html.dark-mode .feature-card h3,html.dark-mode .workflow-card h3, html.dark-mode .cta-card h2 {
    color:#ffffff;
}
html.dark-mode .section-heading p, html.dark-mode .hero-content p, html.dark-mode .feature-card p,
html.dark-mode .api-service-card p, html.dark-mode .workflow-card p, html.dark-mode .cta-card p {
    color:#94a3b8;
}
/* HERO CODE CARD */
html.dark-mode .hero-code-card {
    background:#111827;
    border:1px solid #374151;
    box-shadow:none;
}
html.dark-mode .code-request, html.dark-mode .code-response {
    background:#1e293b;
    border-color:#334155;
    color:#e2e8f0;
}
html.dark-mode .code-request pre, html.dark-mode .code-response pre {
    color:#e2e8f0;
}
/* FLOATING CARDS */
html.dark-mode .hero-api {
    background:#1f1638;
    border-color:#3b2a67;
}
html.dark-mode .hero-secure {
    background:#11251a;
    border-color:#1d4d32;
}
html.dark-mode .hero-fast {
    background:#1e293b;
    border-color:#334155;
}
html.dark-mode .hero-floating span {
    color:#f8fafc;
}
html.dark-mode .hero-shape {
    border-color:#6d5efc;
}
/* FEATURE CARDS */
html.dark-mode .feature-card {
    background:#111827;
    border-color:#374151;
}
html.dark-mode .feature-card:hover {
    border-color:#6f3df4;
}
html.dark-mode .feature-icon {
    background:#1f1638;
}
/* Multi Colors */
html.dark-mode .feature-card:nth-child(1) .feature-icon {
    background:#261b47;
}
html.dark-mode .feature-card:nth-child(2) .feature-icon {
    background:#10261a;
}
html.dark-mode .feature-card:nth-child(3) .feature-icon {
    background:#33240a;
}
html.dark-mode .feature-card:nth-child(4) .feature-icon {
    background:#12233f;
}
/* API CARDS */
html.dark-mode .api-service-card {
    background:#111827;
    border-color:#374151;
}
html.dark-mode .api-service-card:hover {
    border-color:#6f3df4;
}
html.dark-mode .api-feature-list li {
    color:#cbd5e1;
}
/* Humanizer */
html.dark-mode .api-service-card:first-child .api-service-icon {
    background:#261b47;
}
html.dark-mode .api-service-card:first-child .api-service-icon i {
    color:#a78bfa;
}
/* Detector */
html.dark-mode .api-service-card:last-child .api-service-icon {
    background:#102d57;
}
html.dark-mode .api-service-card:last-child .api-service-icon i {
    color:#60a5fa;
}
/*  API SERVICE CARD DARK MODE */
html.dark-mode .api-service-card h3 {
    color:#ffffff;
}
html.dark-mode .api-service-card p {
    color:#94a3b8;
}
html.dark-mode .api-feature-list li {
    color:#cbd5e1;
}
html.dark-mode .api-feature-list li::before {
    background:#312e81;
    color:#c4b5fd;
}
/* QUICK START */
html.dark-mode .code-panel, html.dark-mode .code-box {
    background:#111827;
    border:1px solid #374151;
}
html.dark-mode .panel-header {
    color:#f8fafc;
    border-bottom:1px solid #374151;
}
html.dark-mode .code-panel .pre-div, html.dark-mode .code-box .pre-div {
    color:#cbd5e1;
}
/* WORKFLOW */
html.dark-mode .workflow-icon {
    background:#1e293b;
}
html.dark-mode .workflow-card:nth-child(1) .workflow-icon {
    background:#261b47;
}
html.dark-mode .workflow-card:nth-child(2) .workflow-icon {
    background:#102d57;
}
html.dark-mode .workflow-card:nth-child(3) .workflow-icon {
    background:#103622;
}
html.dark-mode .workflow-card:nth-child(4) .workflow-icon {
    background:#3d2b09;
}
html.dark-mode .workflow-line {
    background:#334155;
}
html.dark-mode .workflow-number {
    background:#6f3df4;
}
/* LANGUAGES */
html.dark-mode .language-pill {
    background:#111827;
    border-color:#374151;
    color:#e2e8f0;
}
/* STATS */
html.dark-mode .api-stat-card {
    background:#111827;
    border:1px solid #374151;
}
html.dark-mode .api-stat-card h3 {
    color:#ffffff;
}
html.dark-mode .api-stat-card p {
    color:#94a3b8;
}
html.dark-mode .stat-icon {
    background:#1e293b;
}
/* CTA */
html.dark-mode .cta-card {
    background:linear-gradient(135deg, #1E1B4B, #312E81);
    border:1px solid #374151;
}
/* BUTTONS */
html.dark-mode .btn-outline-primary {
    /* background:transparent; */
    border-color:#6f3df4;
    color:#a78bfa;
}
html.dark-mode .btn-outline-primary:hover {
    background:#6f3df4;
    color:#fff !important;
}
/* TRUSTED USERS */
html.dark-mode .hero-trusted p, html.dark-mode .trusted-users span {
    color:#cbd5e1;
}
/* GLOW EFFECT */
html.dark-mode .hero-code-card::before {
    opacity:.35;
}
html.dark-mode .page-section {
    background: #0f172a;
}

html.dark-mode .page-card {
    background: #1e293b;
    border-color: #334155;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

html.dark-mode .page-header {
    border-bottom-color: #334155;
}

html.dark-mode .page-header h1 {
    color: #f8fafc;
}

html.dark-mode .page-content {
    color: #cbd5e1;
}

/* Headings */

html.dark-mode .page-content h1,
html.dark-mode .page-content h2,
html.dark-mode .page-content h3,
html.dark-mode .page-content h4,
html.dark-mode .page-content h5,
html.dark-mode .page-content h6 {
    color: #ffffff;
}
/* Paragraph */
html.dark-mode .page-content p {
    color: #cbd5e1;
}
/* Strong */
html.dark-mode .page-content strong,
html.dark-mode .page-content b {
    color: #ffffff;
}
/* Links */
html.dark-mode .page-content a {
    color: #a78bfa;
}

html.dark-mode .page-content a:hover {
    color: #c4b5fd;
}
/* Lists */
html.dark-mode .page-content ul,
html.dark-mode .page-content ol {
    color: #cbd5e1;
}

html.dark-mode .page-content li {
    color: #cbd5e1;
}
/* Blockquotes */
html.dark-mode .page-content blockquote {
    background: #312e81;
    border-left-color: #8b5cf6;
    color: #e2e8f0;
}
/* Tables */
html.dark-mode .page-content table {
    border-color: #475569;
}
html.dark-mode .page-content table th {
    background: #334155;
    color: #ffffff;
    border-color: #475569;
}
html.dark-mode .page-content table td {
    border-color: #475569;
    color: #cbd5e1;
}
/* Horizontal Rule */
html.dark-mode .page-content hr {
    border-top-color: #334155;
}
/* Code Blocks */
html.dark-mode .page-content pre {
    background: #0f172a;
    color: #e2e8f0;
    border: 1px solid #334155;
    padding: 15px;
    border-radius: 10px;
    overflow-x: auto;
}
html.dark-mode .page-content code {
    background: #334155;
    color: #f8fafc;
    padding: 2px 6px;
    border-radius: 4px;
}
/* Images */
html.dark-mode .page-content img {
    opacity: 0.95;
}
/* Selection */
html.dark-mode .page-content ::selection {
    background: #7c3aed;
    color: #ffffff;
}
/* FAQ */
html.dark-mode .faq-item {
    background:#111827;
    border:1px solid #374151;
}
html.dark-mode .faq-question {
    background:none;
    color:#ffffff;
}
html.dark-mode .faq-answer {
    color:#cbd5e1;
}
html.dark-mode .faq-item {
    background:#111827;
    border-color:#374151;
}
html.dark-mode .faq-question {
    color:#fff;
}
html.dark-mode .faq-answer-inner{
    color:#94a3b8;
}
html.dark-mode .faq-icon {
    background:#1f2937;
    color:#a78bfa;
}
html.dark-mode .faq-item.active .faq-icon {
    background:#7c3aed;
    color:#fff;
}
/* ===================================
   BLOG DETAILS DARK MODE
=================================== */

html.dark-mode .blog-details-page {
    background: #0F172A;
    color: #E5E7EB;
}

/* Breadcrumb */
html.dark-mode .breadcrumb {
    color: #94A3B8;
}

html.dark-mode .breadcrumb a {
    color: #CBD5E1;
}

html.dark-mode .breadcrumb a:hover {
    color: #7C3AED;
}

html.dark-mode .breadcrumb span {
    color: #64748B;
}

/* Article */
html.dark-mode .blog-article {
    background: #111827;
}

html.dark-mode .article-title {
    color: #F8FAFC;
}

html.dark-mode .article-meta {
    color: #94A3B8;
}

/* Featured Image */
html.dark-mode .featured-image-wrapper {
    border: 1px solid #1F2937;
}

/* CKEditor Content */
html.dark-mode .article-content {
    color: #D1D5DB;
}

html.dark-mode .article-content h1,
html.dark-mode .article-content h2,
html.dark-mode .article-content h3,
html.dark-mode .article-content h4,
html.dark-mode .article-content h5,
html.dark-mode .article-content h6 {
    color: #F8FAFC;
}

html.dark-mode .article-content p,
html.dark-mode .article-content li,
html.dark-mode .article-content span {
    color: #D1D5DB;
}

html.dark-mode .article-content a {
    color: #8B5CF6;
}

html.dark-mode .article-content blockquote {
    background: #1E293B;
    border-left: 4px solid #7C3AED;
    color: #CBD5E1;
}

html.dark-mode .article-content code {
    background: #1E293B;
    color: #F8FAFC;
}

html.dark-mode .article-content pre {
    background: #0F172A;
    border: 1px solid #334155;
    color: #E5E7EB;
}

/* Previous / Next Navigation */
html.dark-mode .article-nav-card {
    background: #111827;
    border: 1px solid #1F2937;
    color: #E5E7EB;
}

html.dark-mode .article-nav-card:hover {
    border-color: #7C3AED;
    background: #1E293B;
}

html.dark-mode .article-nav-card span {
    color: #A78BFA;
}

html.dark-mode .article-nav-card h4 {
    color: #F8FAFC;
}

/* Sidebar Cards */
html.dark-mode .sidebar-card {
    background: #111827;
    border: 1px solid #1F2937;
}

html.dark-mode .sidebar-card h3 {
    color: #F8FAFC;
}

html.dark-mode .sidebar-card p {
    color: #CBD5E1;
}

/* Latest Articles */
html.dark-mode .recent-blog-list li {
    border-color: #1F2937;
}

html.dark-mode .recent-blog-list a {
    color: #D1D5DB;
}

html.dark-mode .recent-blog-list a:hover {
    color: #8B5CF6;
}

/* CTA Button */
html.dark-mode .sidebar-cta-btn {
    background: linear-gradient(135deg, #7C3AED, #6366F1);
    color: #FFFFFF;
}

html.dark-mode .sidebar-cta-btn:hover {
    opacity: 0.9;
}

/* Bottom CTA */
html.dark-mode .bottom-cta {
    background: linear-gradient(135deg, #1E1B4B, #312E81);
    border: 1px solid #4338CA;
}

html.dark-mode .bottom-cta h2 {
    color: #FFFFFF;
}

html.dark-mode .bottom-cta p {
    color: #CBD5E1;
}

/* CTA Buttons */
html.dark-mode .btn-light {
    background: #FFFFFF;
    color: #111827;
}

html.dark-mode .btn-light:hover {
    background: #F3F4F6;
}

html.dark-mode .btn-outline-light {
    border: 1px solid rgba(255,255,255,0.3);
    color: #FFFFFF;
}

html.dark-mode .btn-outline-light:hover {
    background: rgba(255,255,255,0.08);
}

/* Tables inside CKEditor content */
html.dark-mode .article-content table {
    border-color: #334155;
}

html.dark-mode .article-content th {
    background: #1E293B;
    color: #F8FAFC;
    border-color: #334155;
}

html.dark-mode .article-content td {
    border-color: #334155;
    color: #D1D5DB;
}

/* Horizontal Rule */
html.dark-mode .article-content hr {
    border-color: #334155;
}
/* ===================================
   BILLING HISTORY DARK MODE
=================================== */

html.dark-mode .invoice-row{
    background:#1f2937;
    border-color:#374151;
}

html.dark-mode .invoice-row:hover{
    box-shadow:0 10px 30px rgba(0,0,0,.35);
}

html.dark-mode .invoice-details h4{
    color:#f9fafb;
}

html.dark-mode .invoice-details p{
    color:#9ca3af;
}

html.dark-mode .invoice-details small{
    color:#6b7280;
}

html.dark-mode .invoice-price{
    color:#f9fafb;
}

/* STATUS BADGES */

html.dark-mode .status-paid,
html.dark-mode .status-success{
    background:#14532d;
    color:#86efac;
}

html.dark-mode .status-pending{
    background:#78350f;
    color:#fcd34d;
}

html.dark-mode .status-failed{
    background:#7f1d1d;
    color:#fca5a5;
}

/* ACTION BUTTON */

html.dark-mode .invoice-btn{
    background:#111827;
    color:#a78bfa;
    border:1px solid #374151;
}

html.dark-mode .invoice-btn:hover{
    background:#4f46e5;
    color:#fff;
    border-color:#4f46e5;
}

/* MODAL */

html.dark-mode .invoice-modal{
    background:rgba(0,0,0,.75);
}

html.dark-mode .invoice-modal-content{
    background:#1f2937;
    box-shadow:0 20px 50px rgba(0,0,0,.5);
}

/* MODAL HEADER */

html.dark-mode .invoice-header{
    border-bottom-color:#374151;
}

html.dark-mode .invoice-header h2{
    color:#f9fafb;
}

html.dark-mode .invoice-header p{
    color:#9ca3af;
}

html.dark-mode .close-invoice{
    background:#111827;
    color:#f9fafb;
}

html.dark-mode .close-invoice:hover{
    background:#374151;
}

/* TOP CARD */

html.dark-mode .invoice-top-card{
    background:linear-gradient(
        135deg,
        #4f46e5,
        #7c3aed
    );
}
html.dark-mode .invoice-status {
    background:linear-gradient(135deg, #ede9fe, #ddd6fe);    
}
html.dark-mode .invoice-status .status-badge {
    color:#22c55e;
}
html.dark-mode .invoice-status-popup {
    background:#fff;
    color:#22c55e;
}
/* INVOICE INFO ITEMS */

html.dark-mode .invoice-item{
    background:#111827;
    border:1px solid #374151;
}

html.dark-mode .invoice-item label{
    color:#9ca3af;
}

html.dark-mode .invoice-item p{
    color:#f9fafb;
}

/* FOOTER */

html.dark-mode .invoice-footer{
    border-top-color:#374151;
}

html.dark-mode .download-btn{
    background:#4f46e5;
    color:#fff;
}

html.dark-mode .download-btn:hover{
    background:#6366f1;
}

html.dark-mode .close-btn{
    background:#111827;
    color:#f9fafb;
    border:1px solid #374151;
}

html.dark-mode .close-btn:hover{
    background:#374151;
}