/* ========================================================================== THE ADS ENGINE — Complete Color Scheme Override This stylesheet is ONLY loaded when data-brand="ads" is set on . It overrides every hardcoded blue (#2F80ED) and purple (#8B5CF6) reference across all CSS files with the Ads Engine green palette. Primary: #00E676 (electric green) Hover: #00C853 (deeper green) Light bg: #E8F5E9 10% opacity: rgba(0, 230, 118, 0.10) 20% opacity: rgba(0, 230, 118, 0.20) Dark bg: #0A1628 ========================================================================== */ /* ---- NAV ---- */ .site-nav { border-bottom-color: rgba(0, 230, 118, 0.15) !important; } .site-nav::before { background: linear-gradient(90deg, #00E676, #00C853, #00E676) !important; } .site-nav__logo-text { background: linear-gradient(135deg, #fff 0%, #00E676 40%, #00C853 70%, #fff 100%) !important; background-size: 200% 200% !important; filter: drop-shadow(0 0 20px rgba(0, 230, 118, 0.3)) !important; } .btn-nav-login { border-color: rgba(0, 230, 118, 0.6) !important; color: #00E676 !important; } .btn-nav-login:hover { background: rgba(0, 230, 118, 0.12) !important; border-color: #00E676 !important; } .site-nav__link:hover, .site-nav__link.is-active { color: #00E676 !important; } .site-nav__link::after { background: #00E676 !important; } /* ---- BUTTONS ---- */ .btn-primary, .btn-primary-dark, button[type="submit"].btn-primary { background: linear-gradient(135deg, #00E676 0%, #00C853 100%) !important; color: #0A1628 !important; box-shadow: 0 4px 16px rgba(0, 230, 118, 0.3) !important; } .btn-primary:hover, .btn-primary-dark:hover, button[type="submit"].btn-primary:hover { background: linear-gradient(135deg, #00C853 0%, #00A844 100%) !important; box-shadow: 0 6px 24px rgba(0, 230, 118, 0.4) !important; } .btn-primary:focus-visible, .btn-primary-dark:focus-visible { outline-color: #00E676 !important; } .btn-secondary, .btn-outline { color: #00E676 !important; border-color: #00E676 !important; } .btn-secondary:hover, .btn-outline:hover { background: rgba(0, 230, 118, 0.08) !important; } .btn-secondary-dark { border-color: rgba(0, 230, 118, 0.6) !important; color: #fff !important; } .btn-secondary-dark:hover { background: rgba(0, 230, 118, 0.12) !important; border-color: #00E676 !important; } /* ---- LINKS ---- */ a:not(.btn-primary):not(.btn-secondary):not(.btn-nav-login):not(.site-nav__link) { color: inherit; } a[href]:not([class]):hover { color: #00E676; } /* ---- FORMS ---- */ input:focus, select:focus, textarea:focus, .form-input:focus, .form-select:focus, .form-textarea:focus { border-color: #00E676 !important; box-shadow: 0 0 0 3px rgba(0, 230, 118, 0.15) !important; } input[type="checkbox"]:checked, input[type="checkbox"]:checked + label::before { background-color: #00E676 !important; border-color: #00E676 !important; } input[type="radio"]:checked { border-color: #00E676 !important; } input[type="radio"]:checked::before { background: #00E676 !important; } input[type="checkbox"]:focus, input[type="radio"]:focus { box-shadow: 0 0 0 3px rgba(0, 230, 118, 0.20) !important; } .file-drop:hover, .file-drop.dragging { border-color: #00E676 !important; background: rgba(0, 230, 118, 0.04) !important; } /* ---- SIDEBAR ---- */ .sidebar { border-right-color: rgba(0, 230, 118, 0.1) !important; } .sidebar__link.is-active { background: linear-gradient(135deg, rgba(0, 230, 118, 0.18) 0%, rgba(0, 200, 83, 0.06) 100%) !important; box-shadow: -3px 0 16px rgba(0, 230, 118, 0.35), inset 0 0 16px rgba(0, 230, 118, 0.06) !important; } .sidebar__link.is-active .sidebar__icon { filter: drop-shadow(0 0 4px rgba(0, 230, 118, 0.5)) !important; } .sidebar__link:hover { background: rgba(0, 230, 118, 0.08) !important; } /* ---- TOPBAR ---- */ .topbar { border-bottom-color: rgba(0, 230, 118, 0.1) !important; } /* ---- DASHBOARD CARDS ---- */ .card:hover { border-color: rgba(0, 230, 118, 0.25) !important; } .card-stat:nth-child(1) { background: linear-gradient(135deg, rgba(0, 230, 118, 0.06), rgba(255, 255, 255, 0.02)) !important; } .card-stat__icon { background: rgba(0, 230, 118, 0.15) !important; } .card-stat__label a, .card a { color: #00E676 !important; } .card-feature__icon, .card-feature__icon-premium { color: #00E676 !important; background: rgba(0, 230, 118, 0.1) !important; } /* ---- BADGES ---- */ .badge--primary, .status-badge--active { background: rgba(0, 230, 118, 0.15) !important; color: #00E676 !important; } /* ---- PROGRESS ---- */ .progress__bar, .progress-bar__fill { background: linear-gradient(90deg, #00E676, #00C853) !important; } /* ---- TOGGLE ---- */ .toggle--active, .toggle.is-active { background-color: #00E676 !important; } /* ---- ACCORDION ---- */ .accordion__trigger:hover { color: #00E676 !important; } /* ---- TOAST ---- */ .toast--info { border-left-color: #00E676 !important; } /* ---- SPINNER ---- */ .spinner { border-top-color: #00E676 !important; } /* ---- PAGINATION ---- */ .pagination__link--active, .pagination__link:hover { background: #00E676 !important; color: #0A1628 !important; } /* ---- PWA BANNER ---- */ .pwa-banner__btn { background: linear-gradient(135deg, #00E676, #00C853) !important; } /* ---- PRICING CARDS ---- */ .pricing-card--featured, .pricing-card--popular { border-color: #00E676 !important; } .pricing-card__badge { background: #00E676 !important; color: #0A1628 !important; } /* ---- MARKETING SECTIONS ---- */ .section-overline, .overline { color: #00E676 !important; } .hero__headline em, .hero__headline span.accent { color: #00E676 !important; } /* ---- DASHBOARD GRADIENT ACCENTS ---- */ .dashboard-header__gradient, .welcome-banner { background: linear-gradient(135deg, rgba(0, 230, 118, 0.12), rgba(0, 200, 83, 0.08)) !important; } /* ---- CHARTS ---- */ .chart-legend__dot--primary { background: #00E676 !important; } /* ---- ONBOARDING ---- */ .onboarding-progress__step--active, .onboarding-progress__step--complete { background: #00E676 !important; border-color: #00E676 !important; color: #0A1628 !important; } .onboarding-progress__line--complete { background: #00E676 !important; } /* ---- MISC BLUE TEXT ---- */ .text-electric, .text-primary-accent { color: #00E676 !important; } /* ---- HERO DARK BACKGROUNDS ---- */ .section-hero, .hero-dark { background: linear-gradient(135deg, #0A1628 0%, #0D1F38 100%) !important; } /* ---- VIDEO PLACEHOLDER ---- */ .video-placeholder__play { background: linear-gradient(135deg, #00E676, #00C853) !important; box-shadow: 0 0 0 8px rgba(0, 230, 118, 0.20), 0 8px 24px rgba(0, 230, 118, 0.30) !important; } .video-placeholder:hover .video-placeholder__play { box-shadow: 0 0 0 12px rgba(0, 230, 118, 0.25), 0 12px 32px rgba(0, 230, 118, 0.35) !important; } /* ---- FOCUS RINGS (GLOBAL) ---- */ *:focus-visible { outline-color: #00E676 !important; } /* ---- SCROLLBAR ---- */ ::-webkit-scrollbar-thumb { background: rgba(0, 230, 118, 0.3) !important; } ::-webkit-scrollbar-thumb:hover { background: rgba(0, 230, 118, 0.5) !important; } /* ---- SELECTION ---- */ ::selection { background: rgba(0, 230, 118, 0.25) !important; color: #fff !important; }