/* ------------------------------------------------------------------ */ /* Hellofixx dark-mode.css */ /* */ /* Loaded after main.css. Activates when `.dark` is present on . */ /* Mirrors the Next.js globals.css dark-mode hooks using .hfx-* class */ /* targets and high-specificity !important overrides where needed. */ /* ------------------------------------------------------------------ */ .dark body { background-color: #1A1A1A !important; color: #E5E5E5 !important; } .dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 { color: #E5E5E5 !important; } .dark p { color: #AAAAAA !important; } /* Header */ .dark .hfx-header { background-color: #1A1A1A !important; } .dark .hfx-header .hfx-nav-link { color: #E5E5E5 !important; } .dark .hfx-header .hfx-nav-link.is-active { color: #FF6741 !important; } .dark .hfx-header.is-scrolled { box-shadow: 0 4px 24px rgba(0,0,0,0.4) !important; } /* Dropdown */ .dark .hfx-dropdown-menu { background-color: #252525 !important; border-color: rgba(255,255,255,0.1) !important; } .dark .hfx-dropdown-item { color: #E5E5E5 !important; } .dark .hfx-dropdown-item:hover { background-color: rgba(255,103,65,0.15) !important; color: #FF8F73 !important; } .dark .hfx-search-trigger { color: #AAAAAA !important; border-color: rgba(255,255,255,0.1) !important; } .dark .hfx-search-trigger:hover { border-color: #FF6741 !important; color: #FF6741 !important; } .dark .hfx-search-trigger kbd { background-color: rgba(255,255,255,0.1) !important; color: #AAAAAA !important; } .dark .hfx-icon-btn { color: #E5E5E5 !important; } .dark .hfx-icon-btn:hover { background-color: rgba(255,255,255,0.05) !important; color: #FF6741 !important; } /* Mobile menu */ .dark .hfx-mobile-menu { background-color: #252525 !important; border-top: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-mobile-nav-link { color: #E5E5E5 !important; } .dark .hfx-mobile-nav-link:hover, .dark .hfx-mobile-nav-link.is-active { background-color: rgba(255,103,65,0.15) !important; color: #FF6741 !important; } .dark .hfx-mobile-accordion-trigger { color: #E5E5E5 !important; } .dark .hfx-mobile-accordion-trigger:hover { background-color: rgba(255,103,65,0.15) !important; color: #FF6741 !important; } .dark .hfx-mobile-sublink { color: #AAAAAA !important; } .dark .hfx-mobile-sublink:hover { background-color: rgba(255,103,65,0.15) !important; color: #FF6741 !important; } /* Hero */ .dark .hfx-hero { background: linear-gradient(180deg, #1A1A1A 0%, #222222 100%) !important; } .dark .hfx-hero h1 { color: #FFFFFF !important; } .dark .hfx-hero p { color: #AAAAAA !important; } .dark .hfx-hero-trust-pill { background-color: rgba(255,103,65,0.15) !important; color: #FF8F73 !important; } .dark .hfx-hero-trust-row { border-top-color: rgba(255,255,255,0.1) !important; } .dark .hfx-hero-trust-row .item { color: #E5E5E5 !important; } .dark .hfx-hero-fade { background: linear-gradient(180deg, transparent, #1A1A1A) !important; } .dark .hfx-hero-badge { background-color: #252525 !important; border-color: rgba(255,255,255,0.1) !important; } .dark .hfx-hero-badge .label { color: #AAAAAA !important; } .dark .hfx-hero-badge .sub { color: #AAAAAA !important; } /* Trust strip */ .dark .hfx-trust-strip { background-color: #1A1A1A !important; border-top-color: rgba(255,255,255,0.05) !important; border-bottom-color: rgba(255,255,255,0.05) !important; } .dark .hfx-trust-item { color: #AAAAAA !important; } .dark .hfx-trust-divider { background-color: rgba(255,255,255,0.1) !important; } /* Generic cards / white sections */ .dark .hfx-white-section { background-color: #1A1A1A !important; } .dark .hfx-pink-section { background-color: #161616 !important; } .dark .hfx-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-card h3, .dark .hfx-card h4 { color: #E5E5E5 !important; } .dark .hfx-card p { color: #AAAAAA !important; } /* Section backgrounds */ .dark .hfx-services { background-color: #1A1A1A !important; } .dark .hfx-why-choose { background-color: #1A1A1A !important; } .dark .hfx-how-it-works { background-color: #161616 !important; } .dark .hfx-tips { background-color: #1A1A1A !important; } .dark .hfx-booking { background-color: #161616 !important; } .dark .hfx-zip { background-color: #1A1A1A !important; } .dark .hfx-service-areas { background-color: #161616 !important; } .dark .hfx-blog { background-color: #1A1A1A !important; } .dark .hfx-faq { background-color: #161616 !important; } .dark .hfx-contact { background-color: #1A1A1A !important; } /* Service cards */ .dark .hfx-service-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-service-card h3 { color: #E5E5E5 !important; } .dark .hfx-service-card p { color: #AAAAAA !important; } .dark .hfx-service-card .phone-link { color: #E5E5E5 !important; border-top-color: rgba(255,255,255,0.05) !important; } .dark .hfx-service-card .phone-link:hover { color: #FF6741 !important; } .dark .hfx-service-card .phone-link .icon { background-color: rgba(255,103,65,0.15) !important; } /* Icon containers */ .dark .hfx-icon-circle { background-color: rgba(255,103,65,0.15) !important; } /* Stats section */ .dark .hfx-stats { background-color: #111111 !important; } .dark .hfx-stats h3, .dark .hfx-stats .hfx-stat-number { color: #FFFFFF !important; } .dark .hfx-stats p { color: #AAAAAA !important; } .dark .hfx-stat .label { color: #AAAAAA !important; } .dark .hfx-stat .sublabel { color: #6B7280 !important; } /* How it works */ .dark .hfx-step-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-step-card h3 { color: #FF6741 !important; } .dark .hfx-step-card p { color: #AAAAAA !important; } /* Tips */ .dark .hfx-tip-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-tip-card h3 { color: #E5E5E5 !important; } .dark .hfx-tip-card p { color: #AAAAAA !important; } /* Booking calendar */ .dark .hfx-booking-panel { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-calendar { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-cal-header .month { color: #E5E5E5 !important; } .dark .hfx-cal-nav-btn { color: #E5E5E5 !important; } .dark .hfx-cal-nav-btn:hover:not(:disabled) { background-color: rgba(255,255,255,0.05) !important; color: #FF6741 !important; } .dark .hfx-cal-weekdays div { color: #6B7280 !important; } .dark .hfx-cal-day { color: #E5E5E5 !important; } .dark .hfx-cal-day.muted { color: #555555 !important; } .dark .hfx-cal-day.past { color: #555555 !important; } .dark .hfx-cal-day:hover:not(:disabled) { background-color: rgba(255,255,255,0.05) !important; } .dark .hfx-cal-day.selected { background-color: #FF6741 !important; color: #FFFFFF !important; } .dark .hfx-cal-day.today { border-color: #FF6741 !important; color: #FF6741 !important; } .dark .hfx-cal-status { color: #AAAAAA !important; } .dark .hfx-time-slot { background-color: #2D2D2D !important; color: #E5E5E5 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-time-slot:hover { border-color: #FF6741 !important; } .dark .hfx-time-slot.selected { background-color: #FF6741 !important; color: #FFFFFF !important; border-color: #FF6741 !important; } .dark .hfx-booking-summary { background-color: #2D2D2D !important; } .dark .hfx-booking-summary .row .label { color: #AAAAAA !important; } .dark .hfx-booking-summary .row .value { color: #E5E5E5 !important; } .dark .hfx-booking-success .ref-box { background-color: #2D2D2D !important; } /* Zip checker */ .dark .hfx-zip-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-zip-card h2 { color: #E5E5E5 !important; } /* Service areas */ .dark .hfx-area-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-area-card .label { color: #AAAAAA !important; } .dark .hfx-area-map { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-area-map .caption { color: #AAAAAA !important; } .dark .hfx-region-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-region-card .chip { background-color: #2D2D2D !important; color: #E5E5E5 !important; border-color: rgba(255,255,255,0.05) !important; } /* Blog */ .dark .hfx-blog-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-blog-card .body { color: inherit; } .dark .hfx-blog-card h3 { color: #E5E5E5 !important; } .dark .hfx-blog-card .meta { color: #6B7280 !important; } .dark .hfx-blog-card .excerpt { color: #AAAAAA !important; } .dark .hfx-blog-thumb .category { background-color: rgba(37,37,37,0.9) !important; } /* FAQ */ .dark .hfx-faq-item { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-faq-item .q { color: #E5E5E5 !important; } .dark .hfx-faq-item .q:hover { background-color: rgba(255,255,255,0.05) !important; } .dark .hfx-faq-item .a p { color: #AAAAAA !important; } .dark .hfx-faq-search input { background-color: #333333 !important; color: #E5E5E5 !important; border-color: rgba(255,255,255,0.1) !important; } /* Contact form */ .dark .hfx-contact-form { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-contact-form label { color: #E5E5E5 !important; } .dark .hfx-contact-input { background-color: #333333 !important; color: #E5E5E5 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-contact-input::placeholder { color: #777777 !important; } .dark .hfx-contact-input:focus { border-color: #FF6741 !important; } .dark .hfx-contact-success .icon-wrap { background-color: rgba(255,103,65,0.15) !important; color: #FF6741 !important; } .dark .hfx-contact-success h3 { color: #E5E5E5 !important; } /* CTA banner */ .dark .hfx-cta-banner-inner { background: linear-gradient(135deg, #16162A 0%, #1A1A2E 100%) !important; border-color: rgba(255,255,255,0.05) !important; } .dark .hfx-cta-banner-inner h2 { color: #FFFFFF !important; } .dark .hfx-cta-banner-inner p { color: #AAAAAA !important; } .dark .hfx-cta-banner-inner .hfx-btn-ghost { background-color: #252525 !important; color: #E5E5E5 !important; border-color: rgba(255,255,255,0.15) !important; } /* Footer */ .dark .hfx-footer { background-color: #0F0F1A !important; } /* Service page hero */ .dark .hfx-service-hero { background-color: #272D31 !important; } .dark .hfx-service-hero h1 { color: #FFFFFF !important; } .dark .hfx-service-hero p { color: #AAAAAA !important; } .dark .hfx-breadcrumb { color: #AAAAAA !important; } .dark .hfx-breadcrumb a { color: #FF8F73 !important; } .dark .hfx-breadcrumb .sep { color: #6B7280 !important; } /* Timeline / steps on service pages */ .dark .hfx-timeline-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-timeline-card h3 { color: #E5E5E5 !important; } .dark .hfx-timeline-card p { color: #AAAAAA !important; } /* Benefits dark section */ .dark .hfx-benefits-dark { background-color: #111111 !important; } .dark .hfx-benefits-dark h2 { color: #FFFFFF !important; } /* Pricing card */ .dark .hfx-pricing-card { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-pricing-card .small { color: #9CA3AF !important; } .dark .hfx-pricing-card .price { color: #FFFFFF !important; } .dark .hfx-pricing-card .per { color: #9CA3AF !important; } .dark .hfx-pricing-card .note { color: #AAAAAA !important; } .dark .hfx-pricing-card .divider { background-color: rgba(255,255,255,0.1) !important; } .dark .hfx-pricing-card li { color: #E5E5E5 !important; } /* Search overlay */ .dark .hfx-search-overlay { background-color: rgba(15,15,26,0.95) !important; } .dark .hfx-search-dialog { background-color: #252525 !important; border: 1px solid rgba(255,255,255,0.1) !important; } .dark .hfx-search-input { background-color: #333333 !important; color: #E5E5E5 !important; border-bottom-color: rgba(255,255,255,0.1) !important; } .dark .hfx-search-result { color: #E5E5E5 !important; border-bottom-color: rgba(255,255,255,0.04) !important; } .dark .hfx-search-result:hover { background-color: #2D2D2D !important; color: #FF6741 !important; } .dark .hfx-search-result small { color: #9CA3AF !important; } /* Floating back button on service pages */ .dark .hfx-back-to-home { background-color: #FF6741 !important; color: #fff !important; } .dark .hfx-back-to-home:hover { background-color: #E85A36 !important; color: #fff !important; } /* Sticky call bar */ .dark .hfx-sticky-call-bar { background-color: rgba(37,37,37,0.95) !important; border-top-color: rgba(255,255,255,0.1) !important; } /* Scrollbar */ .dark ::-webkit-scrollbar { width: 10px; height: 10px; } .dark ::-webkit-scrollbar-track { background: #1A1A1A; } .dark ::-webkit-scrollbar-thumb { background: #444444; border-radius: 6px; } .dark ::-webkit-scrollbar-thumb:hover { background: #FF6741; } /* Back-to-top + cookie consent */ .dark .hfx-back-to-top { background-color: #FF6741 !important; color: #fff !important; } .dark .hfx-cookie-consent { background-color: #252525 !important; border-color: rgba(255,255,255,0.1) !important; } .dark .hfx-cookie-consent p { color: #AAAAAA !important; } /* Mini TOC */ .dark .hfx-mini-toc a { background-color: rgba(255,255,255,0.2) !important; } .dark .hfx-mini-toc a.is-active { background-color: #FF6741 !important; } /* Generic dark-mode utility overrides */ .dark a { color: #FF8F73; } .dark a:hover { color: #FF6741; } .dark .hfx-text-primary { color: #FF6741 !important; } .dark select.hfx-contact-input { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23AAAAAA' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important; }