/* Code Hub Soft - Dark Mode Styles */

:root {
    --dark-bg-primary: #1a202c;
    --dark-bg-secondary: #2d3748;
    --dark-bg-tertiary: #4a5568;
    --dark-text-primary: #f7fafc;
    --dark-text-secondary: #e2e8f0;
    --dark-text-muted: #a0aec0;
    --dark-border: #4a5568;
    --dark-shadow: rgba(0, 0, 0, 0.3);
    --dark-gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    --dark-gradient-secondary: linear-gradient(135deg, #2d3748 0%, #1a202c 100%);
}

/* Dark Mode Toggle */
.dark-mode-toggle {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1001;
    background: var(--dark-bg-secondary);
    border: 2px solid var(--dark-border);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: var(--dark-text-primary);
    font-size: 1.2rem;
}

.dark-mode-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 5px 15px var(--dark-shadow);
}

/* Dark Mode Body */
body.dark-mode {
    background: var(--dark-bg-primary);
    color: var(--dark-text-primary);
}

/* Dark Mode Navigation */
body.dark-mode .navbar {
    background: rgba(45, 55, 72, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--dark-border);
}

body.dark-mode .navbar-brand {
    color: var(--dark-text-primary) !important;
}

body.dark-mode .navbar-nav .nav-link {
    color: var(--dark-text-secondary) !important;
}

body.dark-mode .navbar-nav .nav-link:hover {
    color: #667eea !important;
}

body.dark-mode .dropdown-menu {
    background: var(--dark-bg-secondary);
    border: 1px solid var(--dark-border);
}

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

body.dark-mode .dropdown-item:hover {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
}

/* Dark Mode Hero Section */
body.dark-mode .hero-section {
    background: var(--dark-gradient-primary);
    color: var(--dark-text-primary);
}

body.dark-mode .hero-section::before {
    background: linear-gradient(135deg, rgba(26, 32, 44, 0.8), rgba(45, 55, 72, 0.8));
}

/* Dark Mode Stats Section */
body.dark-mode .stats-section {
    background: var(--dark-bg-secondary);
}

body.dark-mode .stat-number {
    color: #667eea;
}

/* Dark Mode Services Section */
body.dark-mode .services-section {
    background: var(--dark-bg-primary);
}

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

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

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

/* Dark Mode Trust Bar */
body.dark-mode .trust-bar {
    background: var(--dark-bg-tertiary);
    border-top-color: var(--dark-border);
    border-bottom-color: var(--dark-border);
}

/* Dark Mode Reviews Marquee */
body.dark-mode .reviews-marquee {
    background: var(--dark-bg-secondary);
}

body.dark-mode .marquee-item {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
}

/* Dark Mode About Section */
body.dark-mode .about-section {
    background: var(--dark-bg-primary);
    color: var(--dark-text-primary);
}

/* Dark Mode CTA Section */
body.dark-mode .cta-section {
    background: var(--dark-gradient-primary);
}

/* Dark Mode Footer */
body.dark-mode .footer {
    background: var(--dark-bg-primary);
    border-top: 1px solid var(--dark-border);
}

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

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

body.dark-mode .footer-links a:hover {
    color: #667eea;
}

/* Dark Mode Cards */
body.dark-mode .card {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

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

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

/* Dark Mode Buttons */
body.dark-mode .btn-outline-primary {
    border-color: #667eea;
    color: #667eea;
}

body.dark-mode .btn-outline-primary:hover {
    background: #667eea;
    color: white;
}

body.dark-mode .btn-light {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

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

/* Dark Mode Forms */
body.dark-mode .form-control {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

body.dark-mode .form-control:focus {
    background: var(--dark-bg-tertiary);
    border-color: #667eea;
    color: var(--dark-text-primary);
    box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25);
}

body.dark-mode .form-select {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

body.dark-mode .form-check-input {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
}

body.dark-mode .form-check-input:checked {
    background-color: #667eea;
    border-color: #667eea;
}

/* Dark Mode Accordions */
body.dark-mode .accordion-item {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
}

body.dark-mode .accordion-button {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

body.dark-mode .accordion-button:not(.collapsed) {
    background: var(--dark-bg-primary);
    color: #667eea;
}

body.dark-mode .accordion-body {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-secondary);
}

/* Dark Mode Testimonials */
body.dark-mode .testimonial-card {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
}

/* Dark Mode Pricing Cards */
body.dark-mode .pricing-card {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
}

body.dark-mode .pricing-card.popular {
    border-color: #667eea;
}

/* Dark Mode Newsletter Section */
body.dark-mode .newsletter-section {
    background: var(--dark-gradient-primary);
}

/* Dark Mode Contact Form */
body.dark-mode .contact-form-container {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
}

/* Dark Mode Badges */
body.dark-mode .badge {
    background: var(--dark-bg-tertiary);
    color: var(--dark-text-primary);
}

/* Dark Mode Progress Bars */
body.dark-mode .progress {
    background: var(--dark-bg-tertiary);
}

/* Dark Mode Tables */
body.dark-mode .table {
    color: var(--dark-text-primary);
}

body.dark-mode .table-striped > tbody > tr:nth-of-type(odd) > * {
    background: var(--dark-bg-tertiary);
}

/* Dark Mode Breadcrumbs */
body.dark-mode .breadcrumb {
    background: var(--dark-bg-secondary);
}

body.dark-mode .breadcrumb-item a {
    color: #667eea;
}

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

/* Dark Mode Pagination */
body.dark-mode .pagination {
    background: var(--dark-bg-secondary);
}

body.dark-mode .page-link {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

body.dark-mode .page-link:hover {
    background: var(--dark-bg-primary);
    color: #667eea;
}

body.dark-mode .page-item.active .page-link {
    background: #667eea;
    border-color: #667eea;
}

/* Dark Mode Tooltips */
body.dark-mode .tooltip-inner {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
}

body.dark-mode .tooltip .arrow::before {
    border-color: var(--dark-bg-secondary);
}

/* Dark Mode Modals */
body.dark-mode .modal-content {
    background: var(--dark-bg-secondary);
    color: var(--dark-text-primary);
}

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

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

/* Dark Mode Alerts */
body.dark-mode .alert {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

body.dark-mode .alert-primary {
    background: rgba(102, 126, 234, 0.1);
    border-color: rgba(102, 126, 234, 0.3);
    color: #667eea;
}

body.dark-mode .alert-success {
    background: rgba(72, 187, 120, 0.1);
    border-color: rgba(72, 187, 120, 0.3);
    color: #48bb78;
}

body.dark-mode .alert-warning {
    background: rgba(237, 137, 54, 0.1);
    border-color: rgba(237, 137, 54, 0.3);
    color: #ed8936;
}

body.dark-mode .alert-danger {
    background: rgba(245, 101, 101, 0.1);
    border-color: rgba(245, 101, 101, 0.3);
    color: #f56565;
}

/* Dark Mode Code Blocks */
body.dark-mode pre {
    background: var(--dark-bg-tertiary);
    border-color: var(--dark-border);
    color: var(--dark-text-primary);
}

body.dark-mode code {
    background: var(--dark-bg-tertiary);
    color: #667eea;
}

/* Dark Mode Blockquotes */
body.dark-mode blockquote {
    border-left-color: #667eea;
    color: var(--dark-text-secondary);
}

/* Dark Mode Scrollbar */
body.dark-mode ::-webkit-scrollbar {
    width: 8px;
}

body.dark-mode ::-webkit-scrollbar-track {
    background: var(--dark-bg-tertiary);
}

body.dark-mode ::-webkit-scrollbar-thumb {
    background: var(--dark-bg-primary);
    border-radius: 4px;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: #667eea;
}

/* Dark Mode Selection */
body.dark-mode ::selection {
    background: rgba(102, 126, 234, 0.3);
    color: var(--dark-text-primary);
}

body.dark-mode ::-moz-selection {
    background: rgba(102, 126, 234, 0.3);
    color: var(--dark-text-primary);
}

/* Dark Mode Focus Styles */
body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus,
body.dark-mode .btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(102, 126, 234, 0.25);
}

/* Dark Mode Transitions */
body.dark-mode * {
    transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

/* Dark Mode Print Styles */
@media print {
    body.dark-mode {
        background: white !important;
        color: black !important;
    }

    body.dark-mode .card,
    body.dark-mode .service-card,
    body.dark-mode .testimonial-card {
        background: white !important;
        border: 1px solid #ccc !important;
        color: black !important;
    }
}

/* Dark Mode High Contrast */
@media (prefers-contrast: high) and (prefers-color-scheme: dark) {
    body.dark-mode {
        --dark-bg-primary: #000000;
        --dark-bg-secondary: #1a1a1a;
        --dark-bg-tertiary: #333333;
        --dark-text-primary: #ffffff;
        --dark-text-secondary: #cccccc;
        --dark-text-muted: #999999;
        --dark-border: #666666;
    }
}

/* Dark Mode Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    body.dark-mode * {
        transition: none !important;
    }
}

/* Dark Mode Mobile Adjustments */
@media (max-width: 768px) {
    body.dark-mode .navbar-collapse {
        background: var(--dark-bg-secondary);
        border: 1px solid var(--dark-border);
    }

    body.dark-mode .dark-mode-toggle {
        top: 15px;
        right: 15px;
        width: 45px;
        height: 45px;
    }
}