/* Infinity Tech public-site dark palette. All overrides are opt-in via body.dark. */
html body.dark {
    --it-dark-bg: #090e1b;
    --it-dark-surface: #121b2b;
    --it-dark-raised: #1b2840;
    --it-dark-line: #30415d;
    --it-dark-text: #e9effb;
    --it-dark-muted: #c2cee2;
    color-scheme: dark;
    background: var(--it-dark-bg) !important;
    color: var(--it-dark-text) !important;
}
html body.dark #main { background: var(--it-dark-bg) !important; color: var(--it-dark-text); }
html body.dark #main .home-page,
html body.dark #main .infinity-contact-page,
html body.dark #main .infinity-faq-page,
html body.dark #main .faq-hero,
html body.dark #main .custom-hero-section,
html body.dark #main .features-section,
html body.dark #main .target-sectors-section,
html body.dark #main #systems.infinity-systems,
html body.dark #main .infinity-latest-articles,
html body.dark #main .home-faq-modern,
html body.dark #main .infinity-success-partners,
html body.dark #main .gallery.infinity-works-gallery,
html body.dark #main .it-quote-section,
html body.dark #main .it-contact-map-section,
html body.dark #main .restaurant-page,
html body.dark #main .restaurant-hero,
html body.dark #main .school-page,
html body.dark #main .school-hero,
html body.dark #main .hrms-page,
html body.dark #main .hrms-hero,
html body.dark #main .pos-page,
html body.dark #main .pos-hero,
html body.dark #main .hospital-landing,
html body.dark #main .hospital-hero,
html body.dark #main .dotx-landing,
html body.dark #main .dotx-hero,
html body.dark #main .dotx,
html body.dark #main .dx-hero,
html body.dark #main .dotx-system-features,
html body.dark #main #dotx-system-features,
html body.dark #main .mobile-service-page,
html body.dark #main .mobile-hero,
html body.dark #main .mobile-section.soft,
html body.dark #main .mobile-work-showcase,
html body.dark #main .it-web-service,
html body.dark #main .it-web-hero,
html body.dark #main .it-section.soft,
html body.dark #main .services-hub,
html body.dark #main .services-hero,
html body.dark #main .solutions-hub,
html body.dark #main .erp-service-page,
html body.dark #main .erp-hero,
html body.dark #main .erp-section.soft,
html body.dark #main .about-infinity,
html body.dark #main .about-section.soft,
html body.dark #main #about-story,
html body.dark #main .about-why-us,
html body.dark #main .about-workflow,
html body.dark #main .blog-page,
html body.dark #main .blog-hero,
html body.dark #main .blog-article-page,
html body.dark #main .blog-article-hero,
html body.dark #main .section-bg,
html body.dark #main .breadcrumbs {
    background: var(--it-dark-bg) !important;
    color: var(--it-dark-text) !important;
}
html body.dark #main .modern-box,
html body.dark #main .icon-box,
html body.dark #main .card,
html body.dark #main .accordion-item,
html body.dark #main .accordion-button,
html body.dark #main .accordion-body,
html body.dark #main .faq-category-panel,
html body.dark #main .faq-badge,
html body.dark #main .home-faq-stack,
html body.dark #main .home-faq-badge,
html body.dark #main .infinity-system-card,
html body.dark #main .infinity-system-art,
html body.dark #main .target-sector-card,
html body.dark #main .system-badge,
html body.dark #main .feature-card,
html body.dark #main .floating-stat,
html body.dark #main .floating-pill,
html body.dark #main .infinity-article-card,
html body.dark #main .infinity-contact-kicker,
html body.dark #main .infinity-contact-form-card,
html body.dark #main .infinity-contact-info-card,
html body.dark #main .infinity-contact-channel,
html body.dark #main .it-quote-wrap,
html body.dark #main .it-quote-note,
html body.dark #main .restaurant-feature,
html body.dark #main .support-card,
html body.dark #main .report-card,
html body.dark #main .module-btn,
html body.dark #main .module-panel,
html body.dark #main .module-row,
html body.dark #main .flow-card,
html body.dark #main .fit-pill,
html body.dark #main .dash-card,
html body.dark #main .finance-card,
html body.dark #main .journey-card,
html body.dark #main .module-tab,
html body.dark #main .why-box,
html body.dark #main .hr-dashboard,
html body.dark #main .hr-kpi,
html body.dark #main .hr-chart,
html body.dark #main .hr-requests,
html body.dark #main .hr-feature,
html body.dark #main .hr-mod-btn,
html body.dark #main .hr-panel,
html body.dark #main .hr-row,
html body.dark #main .hr-flow-card,
html body.dark #main .hr-phone-screen,
html body.dark #main .hr-phone-card,
html body.dark #main .hr-report-card,
html body.dark #main .terminal-screen,
html body.dark #main .terminal-search,
html body.dark #main .terminal-product,
html body.dark #main .terminal-cart,
html body.dark #main .terminal-pay,
html body.dark #main .terminal-device,
html body.dark #main .compliance-card,
html body.dark #main .module-op,
html body.dark #main .payment-window,
html body.dark #main .payment-method,
html body.dark #main .payment-sum,
html body.dark #main .hardware-card,
html body.dark #main .hospital-feature,
html body.dark #main .account-card,
html body.dark #main .workflow-card,
html body.dark #main .hospital-panel,
html body.dark #main .hospital-module-pill,
html body.dark #main .hospital-list-row,
html body.dark #main .accounting-screen,
html body.dark #main .account-side,
html body.dark #main .account-kpi,
html body.dark #main .account-reports,
html body.dark #main .accounting-showcase,
html body.dark #main .doctor-point,
html body.dark #main .metric-box,
html body.dark #main .why-card,
html body.dark #main .dotx-feature,
html body.dark #main .dotx-module-pill,
html body.dark #main .dotx-panel,
html body.dark #main .dotx-list-row,
html body.dark #main .dotx-cms-box,
html body.dark #main .dx-trust,
html body.dark #main .dx-card,
html body.dark #main .dx-tab,
html body.dark #main .dx-panel,
html body.dark #main .dx-row,
html body.dark #main .dx-report,
html body.dark #main .dx-cms,
html body.dark #main .dotx-report-card,
html body.dark #main .dotx-system-feature,
html body.dark #main .dxsf-card,
html body.dark #main .mobile-eyebrow,
html body.dark #main .mobile-value-box,
html body.dark #main .solution-card,
html body.dark #main .integrations-band,
html body.dark #main .integration-item,
html body.dark #main .process-num,
html body.dark #main .quality-panel,
html body.dark #main .mobile-cta,
html body.dark #main .phone-screen,
html body.dark #main .app-stat,
html body.dark #main .app-nav,
html body.dark #main .floating-chip,
html body.dark #main .mobile-work-feature-detail,
html body.dark #main .portfolio-main,
html body.dark #main .portfolio-thumbs,
html body.dark #main .portfolio-thumb,
html body.dark #main .portfolio-feature,
html body.dark #main .portfolio-feature-tip,
html body.dark #main .portfolio-info,
html body.dark #main .it-web-kicker,
html body.dark #main .it-browser,
html body.dark #main .it-browser-top,
html body.dark #main .it-browser-address,
html body.dark #main .it-browser-card,
html body.dark #main .it-browser-hero,
html body.dark #main .it-phone,
html body.dark #main .it-phone-screen,
html body.dark #main .it-float-chip,
html body.dark #main .it-cap-strip-inner,
html body.dark #main .it-bento-card,
html body.dark #main .it-feature,
html body.dark #main .it-stack-pill,
html body.dark #main .it-why-card,
html body.dark #main .it-faq-item,
html body.dark #main .services-eyebrow,
html body.dark #main .services-node,
html body.dark #main .service-card,
html body.dark #main .services-proof-box,
html body.dark #main .advisor-badge,
html body.dark #main .solutions-advisor-card,
html body.dark #main .number-box,
html body.dark #main .solution-mini-tag,
html body.dark #main .solutions-empty,
html body.dark #main .solutions-contact-card,
html body.dark #main .contact-method,
html body.dark #main .schedule-box,
html body.dark #main .schedule-option,
html body.dark #main .erp-eyebrow,
html body.dark #main .erp-window,
html body.dark #main .erp-window-top,
html body.dark #main .erp-dashboard,
html body.dark #main .erp-period,
html body.dark #main .erp-kpi,
html body.dark #main .erp-chart,
html body.dark #main .erp-strip-box,
html body.dark #main .erp-module,
html body.dark #main .erp-core,
html body.dark #main .erp-business-card,
html body.dark #main .erp-report-board,
html body.dark #main .erp-report-kpi,
html body.dark #main .erp-report-chart,
html body.dark #main .erp-step-num,
html body.dark #main .erp-saudi-panel,
html body.dark #main .erp-saudi-item,
html body.dark #main .erp-cta,
html body.dark #main .erp-console,
html body.dark #main .erp-float,
html body.dark #main .about-mark-card,
html body.dark #main .about-strip-card,
html body.dark #main .about-story-copy,
html body.dark #main .about-sector,
html body.dark #main .about-capability,
html body.dark #main .about-value,
html body.dark #main .about-vision,
html body.dark #main .about-why-card,
html body.dark #main .about-workflow-kicker,
html body.dark #main .about-final-cta,
html body.dark #main .blog-search,
html body.dark #main .blog-chip,
html body.dark #main .featured-card,
html body.dark #main .blog-card,
html body.dark #main .blog-empty,
html body.dark #main .blog-side-card,
html body.dark #main .blog-related-card,
html body.dark #main .pos-screen,
html body.dark #main .pos-item,
html body.dark #main .pos-order,
html body.dark #main .testimonials,
html body.dark #main .testimonial-item,
html body.dark #main .contact,
html body.dark #main .info,
html body.dark #main .php-email-form {
    background: var(--it-dark-surface) !important;
    border-color: var(--it-dark-line) !important;
    color: var(--it-dark-text) !important;
}

/* Copy and brand headings remain legible on the dark surfaces. */
html body.dark #main :is(p, li, label, dt, dd, td, th, blockquote, small, strong, span),
html body.dark #main :is(.text-muted, .accordion-button, .form-label) {
    color: var(--it-dark-muted) !important;
}
html body.dark #main :is(h1, h2) {
    background-image: linear-gradient(90deg, #e9effb, #8dc6ff 52%, #edb1d9) !important;
}
html body.dark #main :is(h1, h2) span {
    color: inherit !important;
}
html body.dark #main :is(h3, h4, h5, h6) { color: #9acbff !important; }
html body.dark #main a:not([class*="btn"]):not([class*="button"]):not(.quote):not(.light):not(.primary) {
    color: #9acbff !important;
}
html body.dark #main :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), select, textarea),
html body.dark #main .form-control:focus {
    background: var(--it-dark-bg) !important;
    color: var(--it-dark-text) !important;
    border-color: var(--it-dark-line) !important;
}
html body.dark #main :is(input, textarea)::placeholder { color: #aebdd4 !important; opacity: 1; }
html body.dark #main :is(.accordion-button:not(.collapsed), .module-tab.active, .dx-tab.active, .hr-mod-btn.active, .blog-chip.active, .schedule-option.active) {
    background: var(--it-dark-raised) !important;
    color: #fff !important;
}
html body.dark #main :is(.custom-btn-outline, .services-btn.secondary, .erp-btn.secondary, .mobile-secondary, .it-web-btn.secondary, .portfolio-btn.secondary, .dotx-btn-light, .dx-btn.l, .about-btn.primary, .about-final-cta-btn, .faq-primary) {
    background: var(--it-dark-raised) !important;
    border-color: var(--it-dark-line) !important;
    color: #e9effb !important;
}
/* Light chips/buttons keep dark text; imagery and QR canvases keep their original colors. */
html body.dark #main :is(.restaurant-btn.light, .school-btn.light, .hospital-btn.light, .hrms-btn.light, .pos-btn.light),
html body.dark #main :is(.restaurant-btn.light, .school-btn.light, .hospital-btn.light, .hrms-btn.light, .pos-btn.light) span {
    color: #2F3A85 !important;
}
html body.dark #main .features-qr-label { color: #2F3A85 !important; }
html body.dark #footer.infinity-footer {
    background: #090e1b !important;
    color: var(--it-dark-muted) !important;
    border-color: var(--it-dark-line) !important;
}
html body.dark #footer.infinity-footer :is(.footer-panel, .footer-contact-item, .footer-address-card, .footer-map-card, .footer-bottom) {
    background: var(--it-dark-surface) !important;
    border-color: var(--it-dark-line) !important;
}
html body.dark #footer.infinity-footer :is(a, p, span, small, strong, h3, h4, .copyright, .credits) { color: var(--it-dark-muted) !important; }
html body.dark #footer.infinity-footer :is(a:hover, h3, h4, i) { color: #9acbff !important; }
html body.dark #footer.infinity-footer .footer-quick-links a:hover { background: var(--it-dark-raised) !important; }
html body.dark #infinity-cookie-notice {
    background: var(--it-dark-surface) !important;
    color: var(--it-dark-text) !important;
    border-color: var(--it-dark-line) !important;
}

html body.dark #main .solution-logo,
html body.dark #main .solution-logo-wrap,
html body.dark #main .solution-logo-dotx,
html body.dark #main .solution-logo-hrms,
html body.dark #main .solution-logo-restaurant,
html body.dark #main .solution-logo-pos,
html body.dark #main .solution-tags span,
html body.dark #main .solution-icon,
html body.dark #main .solution-mini-tag,
html body.dark #main .erp-tags span,
html body.dark #main .erp-report-tabs span,
html body.dark #main .erp-strip-icon,
html body.dark #main .proof-icon,
html body.dark #main .mobile-value-icon,
html body.dark #main .about-strip-icon,
html body.dark #main .about-kicker,
html body.dark #main .about-sector i,
html body.dark #main .it-phone-grid span,
html body.dark #main .finance-flow span,
html body.dark #main .accounting-tags span,
html body.dark #main .report-chips span,
html body.dark #main .payment-chips span,
html body.dark #main .blog-share a,
html body.dark #main .dotx-report-filter,
html body.dark #main .dx-report-filter button,
html body.dark #main .number-box button,
html body.dark #main .dx-report .ri,
html body.dark #main .restaurant-lang a,
html body.dark #main .school-lang a,
html body.dark #main .hrms-lang a,
html body.dark #main .pos-lang a,
html body.dark #main .hospital-lang a,
html body.dark #main .dotx-lang-pills a,
html body.dark #main .dx-lang a,
html body.dark #main .mobile-work-kicker,
html body.dark #main .portfolio-btn.secondary,
html body.dark #main .services-cta-actions .quote,
html body.dark #main .mobile-cta-actions .quote,
html body.dark #main .erp-cta-actions .quote,
html body.dark #main .it-final-actions .light,
html body.dark #main .solutions-contact-card,
html body.dark #main .contact-method-icon,
html body.dark #main .blog-side-cta a {
    background: var(--it-dark-raised) !important;
    color: var(--it-dark-text) !important;
    border-color: var(--it-dark-line) !important;
}
html body.dark #main .features-section .feature-card :is(h3, h4, p) { color: var(--it-dark-text) !important; }
html body.dark #footer.infinity-footer .footer-social-links a { background: var(--it-dark-raised) !important; }
html body.dark #footer.infinity-footer :is(.footer-whatsapp-btn, .footer-map-link) { color: #fff !important; }

html body.dark #main #sectors .row h3 { color: #9acbff !important; }
