/* PromoPilot — light theme. Loaded only when the `light_theme_enabled` setting is on; applies when (set by includes/theme.php). Dark stays the default and is untouched. Contrast: text on surfaces >= 4.5:1 (WCAG AA). */ /* =================== Palette =================== */ :root[data-theme="light"] { color-scheme: light; --bg: #f4f7fb; --bg-2: #eaeff6; --surface: #ffffff; --surface-2: #f1f5f9; --text: #0f172a; --muted: #475569; --primary: #2563eb; --primary-2: #1d4ed8; --accent: #0e7490; --success: #047857; --warning: #b45309; --danger: #b91c1c; --border: rgba(15,23,42,.14); --shadow: 0 10px 30px rgba(15,23,42,.10); --pp-link-tab-bg: #ffffff; --pp-link-tab-border: rgba(15,23,42,.18); --pp-link-tab-hover-bg: rgba(29,78,216,.08); --pp-link-tab-hover-border: rgba(29,78,216,.45); --pp-link-tab-active-bg: linear-gradient(135deg, #1d4ed8, #0e7490); --pp-link-tab-active-border: #1d4ed8; --pp-link-tab-shadow: 0 18px 36px -24px rgba(29,78,216,.45); --pp-link-filter-bg: #ffffff; --pp-link-filter-border: rgba(15,23,42,.2); --pp-link-filter-text: #0f172a; --pp-link-filter-focus-shadow: rgba(29,78,216,.22); --glass-bg: rgba(255,255,255,.86); --glass-bg-strong: rgba(255,255,255,.94); --glass-border: rgba(15,23,42,.10); --glass-shadow: 0 20px 60px rgba(15,23,42,.10); --bs-body-bg: var(--bg); --bs-body-color: var(--text); --bs-border-color: var(--border); --bs-link-color: var(--primary); --bs-link-hover-color: var(--primary-2); --bs-heading-color: var(--text); --bs-card-bg: var(--surface); --bs-card-color: var(--text); --bs-tertiary-bg: var(--surface-2); --bs-secondary-color: #475569; --bs-emphasis-color: #0f172a; } /* =================== Auto-generated: pale text colours that were written for the dark theme (generated from style.css; edit by hand from here on) =================== */ :root[data-theme="light"] .pp-payment-card .card-body { color: #1e293b; } :root[data-theme="light"] .pp-amount-lg { color: #1e293b; } :root[data-theme="light"] .pp-autotopup-card .card-body { color: #1e293b; } :root[data-theme="light"] .tariff-price .value { color: #1e293b; } :root[data-theme="light"] .mobile-collapse-tabs .tab-btn { color: #1e293b; } :root[data-theme="light"] .dropdown-menu.language-switcher__menu .language-option { color: #1e293b; } :root[data-theme="light"] .language-switcher__menu .language-option { color: #1e293b; } :root[data-theme="light"] a.language-option { color: #1e293b; } :root[data-theme="light"] .flow-step__stat dd { color: #1e293b; } :root[data-theme="light"] .guarantee-card h3 { color: #1e293b; } :root[data-theme="light"] .seo-tool-card { color: #1e293b; } :root[data-theme="light"] .pp-amount-prefix { color: #1e40af; } :root[data-theme="light"] .pp-divider-label { color: #1e40af; } :root[data-theme="light"] .pp-fl-modal__close { color: #1e40af; } :root[data-theme="light"] .pp-preset-btn { color: #1e293b; } :root[data-theme="light"] .pp-saved-card-badge { color: #1e293b; } :root[data-theme="light"] .pp-onb-progress .pp-progress-label { color: #1e293b; } :root[data-theme="light"] .pp-onb-modal-header .modal-title { color: #1e293b; } :root[data-theme="light"] .pp-onb-modal-progress .pp-progress-label { color: #1e293b; } :root[data-theme="light"] .pp-active-promo-header .modal-title { color: #1e293b; } :root[data-theme="light"] .mobile-sidebar-panel .sidebar-panel__title { color: #1e293b; } :root[data-theme="light"] .telegram-code-wrapper input.telegram-code-input { color: #1e293b; } :root[data-theme="light"] .onboarding-steps .list-group-item i.bi-circle { color: #1e40af; } :root[data-theme="light"] .summary-chip { color: #1e293b; } :root[data-theme="light"] .pp-active-promotions-modal .modal-content { color: #1e293b; } :root[data-theme="light"] .add-project-form .btn-link-light { color: #1e293b; } :root[data-theme="light"] .add-project-form .btn-outline-light { color: #1e293b; } :root[data-theme="light"] .promotion-report-table .anchor-pill { color: #1e293b; } :root[data-theme="light"] .link-status-tabs .link-status-pill { color: #1e293b; } :root[data-theme="light"] .link-status-tabs .link-status-pill:hover { color: #1e293b; } :root[data-theme="light"] .input-stepper .btn-step { color: #1e293b; } :root[data-theme="light"] .nextstep-card__title { color: #1e293b; } :root[data-theme="light"] .payment-instruction__title { color: #1e293b; } :root[data-theme="light"] .notifications-item__message { color: #1e293b; } :root[data-theme="light"] .hero-simple { color: #1e293b; } :root[data-theme="light"] .active-promotions-list__progress-text { color: #1e293b; } :root[data-theme="light"] .project-stepper__circle { color: #1e293b; } :root[data-theme="light"] .project-brief-card .badge.bg-secondary { color: #1e293b; } :root[data-theme="light"] .promotion-report-section-head .section-icon { color: #1e293b; } :root[data-theme="light"] .project-create-overlay__tip { color: #1e293b; } :root[data-theme="light"] .notifications-dropdown__header span { color: #1e293b; } :root[data-theme="light"] .notifications-item__title { color: #1e293b; } :root[data-theme="light"] .hero-simple h1 { color: #1e293b; } :root[data-theme="light"] .dropdown-menu.language-switcher__menu .language-option__native { color: #1e293b; } :root[data-theme="light"] .language-option__native { color: #1e293b; } :root[data-theme="light"] .btn-close-circle:hover { color: #1e293b; } :root[data-theme="light"] .dashboard-project-card__edit { color: #1e293b; } :root[data-theme="light"] .dashboard-project-card__domain { color: #1e293b; } :root[data-theme="light"] .dashboard-project-card__domain-link { color: #1e293b; } :root[data-theme="light"] .notifications-dropdown__empty { color: #1e293b; } :root[data-theme="light"] .hero-feature { color: #1e293b; } :root[data-theme="light"] .cta-box > p { color: #1e293b; } :root[data-theme="light"] .notifications-item__meta { color: #1e40af; } :root[data-theme="light"] .hero-simple__note { color: #1e40af; } :root[data-theme="light"] .active-promotions-list__link { color: #1e40af; } :root[data-theme="light"] .active-promotions-list__meta { color: #1e40af; } :root[data-theme="light"] .form-helper { color: #1e40af; } :root[data-theme="light"] .referral-inline__income .label { color: #1e40af; } :root[data-theme="light"] .language-switcher .dropdown-toggle { color: #1e293b; } :root[data-theme="light"] .dropdown-menu .language-switcher__native { color: #1e293b; } :root[data-theme="light"] .beta-banner { color: #1e293b; } :root[data-theme="light"] .hero-simple__lead { color: #1e293b; } :root[data-theme="light"] .dashboard-balance-extra .extra-block__header { color: #1e293b; } :root[data-theme="light"] .hero-subtitle { color: #1e293b; } :root[data-theme="light"] .stat-label { color: #1e293b; } :root[data-theme="light"] .networks-report-note p { color: #1e293b; } :root[data-theme="light"] .cascade-result-compact p { color: #1e293b; } :root[data-theme="light"] .savings-block p { color: #1e293b; } :root[data-theme="light"] .hero-simple__list li { color: #1e293b; } :root[data-theme="light"] .project-stepper__title { color: #1e293b; } :root[data-theme="light"] .add-project-card .form-floating > label { color: #1e293b; } :root[data-theme="light"] .pp-pay-badge--text { color: #1e293b; } :root[data-theme="light"] .dashboard-balance-extra .extra-block__text { color: #1e293b; } :root[data-theme="light"] .project-create-overlay__headline span { color: #1e293b; } :root[data-theme="light"] .project-brief-meta__value { color: #1e293b; } :root[data-theme="light"] .notification-settings-form .notification-toggle .form-check-label { color: #1e293b; } :root[data-theme="light"] .value-card p { color: #1e293b; } :root[data-theme="light"] .network-stat-label { color: #1e293b; } :root[data-theme="light"] .breadcrumb-item.active { color: #1e293b; } :root[data-theme="light"] .safety-card p { color: #1e40af; } :root[data-theme="light"] .process-card p { color: #1e40af; } :root[data-theme="light"] .cta-note { color: #1e40af; } :root[data-theme="light"] .active-promotions-list__anchor { color: #1e293b; } :root[data-theme="light"] .active-promotions-list__updated { color: #1e40af; } :root[data-theme="light"] .metric-chip__hint { color: #1e40af; } :root[data-theme="light"] .comparison-subtitle { color: #1e40af; } :root[data-theme="light"] .dropdown-menu.language-switcher__menu .language-option__check { color: #1e293b; } :root[data-theme="light"] .language-option__check { color: #1e293b; } :root[data-theme="light"] .nextstep-card__meta { color: #1e293b; } :root[data-theme="light"] .sidebar-panel__title { color: #1e293b; } :root[data-theme="light"] .project-stepper__item.is-complete .project-stepper__circle { color: #065f46; } :root[data-theme="light"] .analysis-feedback:not([data-state]) { color: #1e40af; } :root[data-theme="light"] .analysis-actions__hint { color: #1e40af; } :root[data-theme="light"] .add-project-url__field > i { color: #1e40af; } :root[data-theme="light"] .metric-chip__label { color: #1e40af; } :root[data-theme="light"] .flow-step__stat { color: #1e40af; } :root[data-theme="light"] .faq-accordion .accordion-body { color: #1e40af; } :root[data-theme="light"] .seo-tool-card p { color: #1e40af; } :root[data-theme="light"] .free-link-box .free-link-subtitle { color: #1e40af; } :root[data-theme="light"] .pp-fl-modal__dialog .free-link-subtitle { color: #1e40af; } :root[data-theme="light"] .analysis-feedback[data-state="error"] { color: #b91c1c; } :root[data-theme="light"] .form-helper--compact { color: #1e293b; } :root[data-theme="light"] .add-project-url__label { color: #1e293b; } :root[data-theme="light"] .ap-label { color: #1e293b; } :root[data-theme="light"] .referral-inline__count { color: #1e293b; } :root[data-theme="light"] .referral-inline__balance-pair .pair-title { color: #1e293b; } :root[data-theme="light"] .payment-instruction__text { color: #1e293b; } :root[data-theme="light"] .xrumer-card__list li { color: #1e293b; } :root[data-theme="light"] .project-brief-card .badge.bg-danger { color: #b91c1c; } :root[data-theme="light"] .project-brief-meta__label { color: #1e40af; } :root[data-theme="light"] .extra-tx-meta .extra-tx-date { color: #1e40af; } :root[data-theme="light"] .table-transactions td .text-muted { color: #1e40af; } :root[data-theme="light"] .number-label { color: #1e40af; } :root[data-theme="light"] .project-brief-meta__value small { color: #1e40af; } :root[data-theme="light"] .ap-more > summary small { color: #1e40af; } :root[data-theme="light"] .notification-settings-form .notification-toggle .form-check-label .text-muted { color: #1e40af; } :root[data-theme="light"] .xrumer-bottom-note { color: #1e40af; } :root[data-theme="light"] .add-project-aside__list p { color: #1e293b; } :root[data-theme="light"] .add-project-url__field .form-control::placeholder { color: #1e40af; } :root[data-theme="light"] .add-project-card .ap-field .form-control::placeholder { color: #1e40af; } :root[data-theme="light"] .free-link-note { color: #1e40af; } :root[data-theme="light"] .pp-fl-modal__dialog .free-link-note { color: #1e40af; } :root[data-theme="light"] .btn-close-circle { color: #1e293b; } :root[data-theme="light"] .note { color: #1e40af; } :root[data-theme="light"] .finance-journal-summary { color: #1e40af; } :root[data-theme="light"] .extra-tx-item { color: #1e293b; } :root[data-theme="light"] .history-entry__stamp .network { color: #1e293b; } :root[data-theme="light"] .safety-icon { color: #1e40af; } :root[data-theme="light"] .telegram-copy-btn { color: #1e40af; } :root[data-theme="light"] .section-head h2 { color: #1e293b; } :root[data-theme="light"] .section-head p { color: #1e293b; } :root[data-theme="light"] .payment-instruction__note { color: #1e293b; } :root[data-theme="light"] .promotion-report-actions .dropdown-item { color: #1e293b; } :root[data-theme="light"] .telegram-copy-btn.copied { color: #065f46; } :root[data-theme="light"] .telegram-copy-btn.copy-error { color: #b91c1c; } :root[data-theme="light"] .stat-desc { color: #1e293b; } :root[data-theme="light"] .hero-note { color: #1e293b; } :root[data-theme="light"] .price-big span { color: #1e293b; } :root[data-theme="light"] .cta-note-final { color: #1e293b; } :root[data-theme="light"] .section-subtitle { color: #1e293b; } :root[data-theme="light"] .total-price { color: #1e293b; } :root[data-theme="light"] .timeline-step-compact p { color: #1e293b; } :root[data-theme="light"] .cascade-features li { color: #1e293b; } :root[data-theme="light"] .comparison-col ul li { color: #1e293b; } :root[data-theme="light"] .timeline-compact p { color: #1e293b; } :root[data-theme="light"] .faq-answer-compact { color: #1e293b; } :root[data-theme="light"] .example-desc { color: #1e293b; } :root[data-theme="light"] .feature-compact p { color: #1e293b; } :root[data-theme="light"] .start-step-compact p { color: #1e293b; } :root[data-theme="light"] .guarantee-card p { color: #1e293b; } :root[data-theme="light"] .free-link-form input::placeholder { color: #1e40af; } /* =================== Theme switcher =================== */ .theme-switcher__menu { min-width: 10rem; } .theme-option { display: flex; align-items: center; gap: .6rem; } .theme-option .theme-option__check { margin-left: auto; visibility: hidden; } .theme-option.active .theme-option__check { visibility: visible; } .theme-toggle.dropdown-toggle::after { display: none; } .theme-switcher .theme-toggle { width: 32px; height: 32px; font-size: 1rem; } .theme-switcher { margin-left: 0 !important; } /* =================== Dark islands (surfaces that stay dark by design) =================== */ :root[data-theme="light"] a[style*="background:#111218"] { --text: #f3f4f6; --muted: #b3b9c6; --primary: #60a5fa; --primary-2: #3b82f6; --border: rgba(255,255,255,.16); --surface: rgba(255,255,255,.08); --surface-2: rgba(255,255,255,.14); color: #f3f4f6; } /* =================== Cabinet sidebar =================== */ :root[data-theme="light"] main.page-wrap.layout-has-sidebar .sidebar { background: rgba(255,255,255,.7); } :root[data-theme="light"] .sidebar-panel, :root[data-theme="light"] .sidebar-panel--projects, :root[data-theme="light"] .sidebar-panel--menu, :root[data-theme="light"] .sidebar-panel--current, :root[data-theme="light"] .sidebar-panel--referral { background: #fff; border-color: rgba(15,23,42,.12); box-shadow: 0 8px 24px -18px rgba(15,23,42,.35); } :root[data-theme="light"] .menu-item { background: #fff; border-color: rgba(15,23,42,.1); box-shadow: none; } :root[data-theme="light"] .menu-item:hover { background: #f1f5f9; } :root[data-theme="light"] .sidebar-panel--referral .input-group .form-control { background: #fff; border-color: rgba(15,23,42,.2); } :root[data-theme="light"] .sidebar-panel--referral .btn-outline-primary { border-color: #1d4ed8; color: #1d4ed8; } :root[data-theme="light"] .sidebar-panel--referral .btn-outline-primary:hover { background: #1d4ed8; color: #fff; } /* =================== Buttons: gradients built on --primary are dark in light mode =================== */ :root[data-theme="light"] .btn-primary, :root[data-theme="light"] .btn-gradient, :root[data-theme="light"] .btn-publish, :root[data-theme="light"] .btn-primary i, :root[data-theme="light"] .btn-gradient i, :root[data-theme="light"] .btn-publish i { color: #fff; } /* =================== Tools (tools-v2 has its own tokens) =================== */ :root[data-theme="light"] .tv2 { --tv-muted: #475569; --tv-accent: #1d4ed8; --tv-accent-soft: rgba(29,78,216,.10); --tv-btn: #2f5ce0; --tv-btn-h: #1d4ed8; --tv-new: #047857; --tv-hot: #c2410c; } /* =================== Muted / small texts =================== */ :root[data-theme="light"] .text-muted, :root[data-theme="light"] .text-secondary { color: #475569 !important; } :root[data-theme="light"] .pp-tp-badge__cap { color: #475569; } :root[data-theme="light"] .pp-hint__text { color: #475569; } :root[data-theme="light"] .pp-proj-stat > span { color: #475569; } :root[data-theme="light"] .pp-hub { --hub-muted: #475569; } :root[data-theme="light"] .pp-hub-cta { color: #1d4ed8; } :root[data-theme="light"] .pp-review__name, :root[data-theme="light"] .pp-review__text, :root[data-theme="light"] .pp-review__link, :root[data-theme="light"] .pp-review__author * { color: #334155; } /* =================== Cabinet dashboard (client.php) =================== */ :root[data-theme="light"] .ppc-chip--all { color: #4338ca; } :root[data-theme="light"] .ppc-chip--all.active { background: #4f46e5; color: #fff; } :root[data-theme="light"] .ppc-chip--active { color: #047857; } :root[data-theme="light"] .ppc-chip--active.active { background: #047857; color: #fff; } :root[data-theme="light"] .ppc-chip--done { color: #7e22ce; } :root[data-theme="light"] .ppc-chip--date { color: #0369a1; } :root[data-theme="light"] .ppc-day__num { color: #334155; } :root[data-theme="light"] .ppc-day--empty .ppc-day__num { opacity: .75; color: #475569; } :root[data-theme="light"] .ppc-day.active .ppc-day__num { color: #fff; } /* =================== Onboarding tour =================== */ :root[data-theme="light"] #ppTourStep { color: #0369a1; } :root[data-theme="light"] #ppTourSkip { color: #475569; } /* =================== Batch 4: remaining contrast fixes =================== */ :root[data-theme="light"] .pp-proj-stat > span { opacity: 1; color: #475569; } :root[data-theme="light"] .ppc-day__num { opacity: 1; } :root[data-theme="light"] a[title="Всё время"] > .ppc-day__num { color: #fff; } :root[data-theme="light"] a[title="Всё время"] { background-color: #0369a1; } :root[data-theme="light"] .py-2.text-decoration-none.px-3 > .fw-bold { color: #9a3412 !important; } :root[data-theme="light"] .py-2.text-decoration-none.px-3:nth-child(n+2) > .fw-bold { color: #b91c1c !important; } :root[data-theme="light"] .py-2.text-decoration-none.px-3 .text-muted { color: #475569 !important; } :root[data-theme="light"] .badge.rounded-pill[style*="167,139,250"] { color: #5b21b6 !important; } :root[data-theme="light"] .pp-fields-disabled { opacity: .75; } :root[data-theme="light"] .pp-tour.is-on, :root[data-theme="light"] .pp-tour__go { } :root[data-theme="light"] .pp-hub-what, :root[data-theme="light"] .pp-hub-meta { color: #475569 !important; opacity: 1 !important; } :root[data-theme="light"] #links-card .links-advisor-btn__ai { color: #92400e; } :root[data-theme="light"] .pp-review__name, :root[data-theme="light"] .pp-review__text, :root[data-theme="light"] .pp-review__link { color: #334155 !important; opacity: 1 !important; } :root[data-theme="light"] .tv-tag.hot { color: #9a3412; } :root[data-theme="light"] .tv2 { --tv-hot: #9a3412; } :root[data-theme="light"] .sbx { --sb-good: #047857; --sb-mute: #475569; } :root[data-theme="light"] .pp-rlang__b.is-on { background: #4f46e5; } :root[data-theme="light"] .sbx.sbx { --sb-good: #047857; --sb-mute: #475569; } :root[data-theme="light"] .ppc-day--empty .ppc-day__num { opacity: 1; color: #475569; } :root[data-theme="light"] .pp-autotopup-fields .form-label { color: #334155; opacity: 1; } :root[data-theme="light"] .pp-autotopup-fields.pp-fields-disabled .form-label { color: #334155; opacity: 1; } :root[data-theme="light"] .pp-autotopup-fields.pp-fields-disabled { opacity: 1; filter: none; } :root[data-theme="light"] .pp-autotopup-fields.pp-fields-disabled .form-control { background: #f1f5f9; color: #334155; } :root[data-theme="light"] .btn-outline-secondary { color: #475569; border-color: #64748b; } :root[data-theme="light"] .btn-outline-secondary:hover { background: #475569; color: #fff; } /* =================== Batch 5: public pages =================== */ /* Pages that set --acc (service/corp landings): --acc-d is a darker shade of the same accent */ :root[data-theme="light"] .svc-seo, :root[data-theme="light"] .pp-corp { --acc: var(--acc-d); } :root[data-theme="light"] .svc-seo .is-main .nm, :root[data-theme="light"] .svc-seo .us { color: var(--acc-d); } :root[data-theme="light"] .btn-acc, :root[data-theme="light"] .svc-cta { color: #fff; } /* about */ :root[data-theme="light"] .ab-card [style*="00b67a"] { color: #047857 !important; } :root[data-theme="light"] .ab-card [style*="f59e0b"] { color: #b45309 !important; } :root[data-theme="light"] .rounded-3.p-3.h-100 > h3[style*="f87171"], :root[data-theme="light"] .col-md-6:nth-child(1) > .rounded-3.p-3.h-100 > h3 { color: #b91c1c !important; } :root[data-theme="light"] .col-md-6:nth-child(2) > .rounded-3.p-3.h-100 > h3 { color: #047857 !important; } /* changelog badges (colours are inline) */ :root[data-theme="light"] .changelog-badge[style*="16a34a"] { color: #166534 !important; } :root[data-theme="light"] .changelog-badge[style*="2563eb"] { color: #1d4ed8 !important; } :root[data-theme="light"] .changelog-badge[style*="d97706"] { color: #92400e !important; } /* inline code */ :root[data-theme="light"] code { color: #9d174d; } /* api-docs method pills */ :root[data-theme="light"] .pp-apidocs .pp-method--get { color: #047857; } :root[data-theme="light"] .pp-apidocs .pp-method--post { color: #1d4ed8; } :root[data-theme="light"] .pp-apidocs .pp-method--put, :root[data-theme="light"] .pp-apidocs .pp-method--patch { color: #92400e; } :root[data-theme="light"] .pp-apidocs .pp-method--delete { color: #b91c1c; } /* SEO radar landing */ :root[data-theme="light"] .radar-check__btn { background: #b45309; color: #fff; } :root[data-theme="light"] .rnw-tag { color: #92400e; } :root[data-theme="light"] .rnw-card > i { color: #b45309; } :root[data-theme="light"] .tm-details > summary { color: #1d4ed8; } :root[data-theme="light"] .pdlp { --acc-ink: color-mix(in srgb, var(--acc2) 75%, #000); } :root[data-theme="light"] .pp-apidocs .pp-method--get { color: #065f46; } :root[data-theme="light"] .pp-apidocs .pp-method--post { color: #1e40af; } /* =================== Batch 6 =================== */ :root[data-theme="light"] .pdlp .pdlp-price .nm, :root[data-theme="light"] .pdlp .pdlp-cmp thead .us, :root[data-theme="light"] .pdlp-kick { color: color-mix(in srgb, var(--acc2) 75%, #000); } :root[data-theme="light"] .text-success { color: #047857 !important; } :root[data-theme="light"] .text-danger { color: #b91c1c !important; } :root[data-theme="light"] .text-warning { color: #92400e !important; } :root[data-theme="light"] .text-primary { color: #1d4ed8 !important; } :root[data-theme="light"] .text-info { color: #0e7490 !important; } :root[data-theme="light"] .bg-primary-subtle { color: #1e40af !important; } :root[data-theme="light"] .bg-success-subtle { color: #065f46 !important; } :root[data-theme="light"] .ref-chart-card { background-color: #fff; color: #0f172a; border-color: rgba(15,23,42,.12); } :root[data-theme="light"] .stat-tile { background-color: #f1f5f9; } :root[data-theme="light"] .bonus-filter-btn.active { background: #4f46e5; border-color: #4f46e5; } :root[data-theme="light"] .bonus-filter-btn.active .opacity-50 { opacity: 1; } :root[data-theme="light"] .bonus-filter-btn .opacity-50 { opacity: .85; } :root[data-theme="light"] .bonus-card.bonus--gated { opacity: .92; filter: grayscale(.4); } :root[data-theme="light"] .bonus-card.bonus--gated .bonus-reward-corner { opacity: .9; } :root[data-theme="light"] .bonus-card [style*="ffc107"] { color: #92400e !important; } :root[data-theme="light"] [style*="color:#f97316"], :root[data-theme="light"] [style*="color: #f97316"] { color: #c2410c !important; } :root[data-theme="light"] [style*="color:#8b5cf6"], :root[data-theme="light"] [style*="color: #8b5cf6"] { color: #6d28d9 !important; } :root[data-theme="light"] .pp-review__name, :root[data-theme="light"] .pp-review__text, :root[data-theme="light"] .pp-review__link { transition: none !important; } :root[data-theme="light"] .pp-review--left, :root[data-theme="light"] .pp-review--right { opacity: .8; } /* =================== Referrals dashboard (dark-designed page) =================== */ :root[data-theme="light"] .referral-dashboard { color: #0f172a; } :root[data-theme="light"] .referral-dashboard .text-muted { color: #475569 !important; } :root[data-theme="light"] .referral-dashboard .card:not(.ref-metric-card) { background-color: #fff; border-color: rgba(15,23,42,.12); color: #0f172a; } :root[data-theme="light"] .referral-dashboard .card:not(.ref-metric-card) .card-header { border-color: rgba(15,23,42,.1); color: #0f172a; } :root[data-theme="light"] .referral-dashboard .form-control, :root[data-theme="light"] .referral-dashboard .form-control:focus { background-color: #fff; border-color: rgba(15,23,42,.25); color: #0f172a; } :root[data-theme="light"] .referral-dashboard .stat-value { color: #0f172a; } :root[data-theme="light"] .referral-dashboard .stat-label { color: #334155; } :root[data-theme="light"] .referral-dashboard .btn-primary { color: #fff; } /* bonuses */ :root[data-theme="light"] .bonus-card .fw-semibold.small[style] { filter: brightness(.7); } :root[data-theme="light"] .bonus-repeatable-tag { color: #4338ca; } :root[data-theme="light"] .bonus-filter-btn .opacity-50 { opacity: 1 !important; color: inherit; } :root[data-theme="light"] .bonus-filter-btn.active .opacity-50 { color: #fff; } :root[data-theme="light"] .ea-strip .ea-it.on small { opacity: 1; } /* bonuses: inline accent colours */ :root[data-theme="light"] .bonus-card [style*="ef4444"] { color: #b91c1c !important; } :root[data-theme="light"] .bonus-card [style*="0891b2"] { color: #0e7490 !important; } :root[data-theme="light"] .bonus-card [style*="0d9488"] { color: #0f766e !important; } :root[data-theme="light"] .bonus-card [style*="a855f7"] { color: #7e22ce !important; } :root[data-theme="light"] .bonus-card [style*="ec4899"] { color: #be185d !important; } :root[data-theme="light"] .bonus-card [style*="ffc107"] { color: #92400e !important; } :root[data-theme="light"] .bonus-card [style*="f97316"] { color: #c2410c !important; } :root[data-theme="light"] .bonus-card [style*="8b5cf6"] { color: #6d28d9 !important; } :root[data-theme="light"] .bonus-card [style*="22c55e"] { color: #166534 !important; } :root[data-theme="light"] .bonus-card [style*="10b981"] { color: #047857 !important; } :root[data-theme="light"] .bonus-card [style*="3b82f6"] { color: #1d4ed8 !important; } :root[data-theme="light"] .bonus-card [style*="f59e0b"] { color: #92400e !important; } :root[data-theme="light"] .bonus-card [style*="06b6d4"] { color: #0e7490 !important; } :root[data-theme="light"] .bonus-card [style*="14b8a6"] { color: #0f766e !important; } :root[data-theme="light"] .bonus-card [style*="6366f1"] { color: #4338ca !important; } :root[data-theme="light"] .bonus-card [style*="eab308"] { color: #854d0e !important; } :root[data-theme="light"] .bonus-card [style*="84cc16"] { color: #3f6212 !important; } :root[data-theme="light"] .ea-strip .ea-it.on small { color: #fff; } :root[data-theme="light"] .ea-strip .ea-it.on small { color: #fff !important; opacity: 1 !important; } :root[data-theme="light"] .btn-outline-warning { color: #92400e; border-color: #b45309; } :root[data-theme="light"] .btn-outline-warning:hover { background: #b45309; color: #fff; } :root[data-theme="light"] .btn-outline-success { color: #047857; border-color: #047857; } :root[data-theme="light"] .btn-outline-danger { color: #b91c1c; border-color: #b91c1c; } :root[data-theme="light"] .btn-outline-info { color: #0e7490; border-color: #0e7490; } /* style.css has a legacy `:root[data-theme="light"] .card { background:#fff }` that would flatten coloured cards */ :root[data-theme="light"] .card.ref-metric-click { background: linear-gradient(135deg, #1d4ed8, #0369a1); color: #fff; } :root[data-theme="light"] .card.ref-metric-signup { background: linear-gradient(135deg, #047857, #0f766e); color: #fff; } :root[data-theme="light"] .card.ref-metric-payout { background: linear-gradient(135deg, #7e22ce, #6d28d9); color: #fff; } :root[data-theme="light"] .card.ref-metric-wallet { background: linear-gradient(135deg, #c2410c, #b45309); color: #fff; } :root[data-theme="light"] .pp-tipc__k { color: #92400e; } :root[data-theme="light"] .pp-tipc__nx { color: #475569; } /* ===================================================================================== v2 design pass — homepage ===================================================================================== */ :root[data-theme="light"] { --pp2-orange: #ea580c; --pp2-amber: #b45309; --pp2-violet: #6d28d9; --pp2-blue: #0369a1; --pp2-green: #15803d; --pp2-red: #dc2626; --pp2-mut: #64748b; --pp-bg: #f4f7fb; } /* hero dashboard mock-up: light browser window instead of a black screen */ :root[data-theme="light"] .pp2-browser { background: linear-gradient(180deg, #ffffff, #f6f9fd); border-color: rgba(15,23,42,.12); box-shadow: 0 30px 70px -30px rgba(15,23,42,.35), 0 0 0 1px rgba(255,255,255,.6) inset; } :root[data-theme="light"] .pp2-bhead { border-bottom-color: rgba(15,23,42,.08); background: #f1f5f9; } :root[data-theme="light"] .pp2-url { background: #fff; border-color: rgba(15,23,42,.12); color: #64748b; } :root[data-theme="light"] .pp2-kpi { background: #fff; border-color: rgba(15,23,42,.1); box-shadow: 0 6px 16px -12px rgba(15,23,42,.3); } :root[data-theme="light"] .pp2-gline { stroke: rgba(15,23,42,.08); } :root[data-theme="light"] .pp2-axis { fill: #64748b; } :root[data-theme="light"] .pp2-float { background: #fff; border-color: rgba(15,23,42,.12); box-shadow: 0 22px 50px -24px rgba(15,23,42,.4); color: #0f172a; } :root[data-theme="light"] .pp2-fl-dr .was { color: #64748b; } :root[data-theme="light"] .pp2-feed { background: #fff; border-color: rgba(15,23,42,.1); box-shadow: 0 12px 30px -22px rgba(15,23,42,.35); } :root[data-theme="light"] .pp2-feed-item { color: #334155; } :root[data-theme="light"] .pp2-feed-item .ok { color: #15803d; } :root[data-theme="light"] .pp2-glowdot { filter: none; } :root[data-theme="light"] .pp2-scene text { fill: #475569; } :root[data-theme="light"] .pp2-scene { color: #0f172a; } /* marquee */ :root[data-theme="light"] .pp2-marq { border-color: rgba(15,23,42,.08); } :root[data-theme="light"] .pp2-marq::before { background: linear-gradient(90deg, var(--pp-bg), transparent); } :root[data-theme="light"] .pp2-marq::after { background: linear-gradient(-90deg, var(--pp-bg), transparent); } :root[data-theme="light"] .pp2-chip { background: #fff; border-color: rgba(15,23,42,.12); color: #334155; } /* cards */ :root[data-theme="light"] .pp2-fit { background: #fff; border-color: rgba(15,23,42,.1); box-shadow: 0 8px 24px -20px rgba(15,23,42,.35); } :root[data-theme="light"] .pp2-fit:hover { border-color: rgba(234,88,12,.45); } :root[data-theme="light"] .pp2-fit .ic { background: rgba(234,88,12,.1); color: #ea580c; } :root[data-theme="light"] .pp2-fit .ic i { color: #ea580c; } /* cascade diagram: a light panel instead of a black one */ :root[data-theme="light"] .pp2p-panel { background: linear-gradient(180deg, #ffffff, #f6f9fd); border-color: rgba(15,23,42,.12); box-shadow: 0 24px 60px -34px rgba(15,23,42,.35); } :root[data-theme="light"] .pp2p-node { fill: rgba(15,23,42,.04); stroke: rgba(71,85,105,.45); } :root[data-theme="light"] .pp2p-node.t2n { stroke: rgba(21,128,61,.6); } :root[data-theme="light"] .pp2p-node.t1 { stroke: rgba(234,88,12,.8); filter: none; } :root[data-theme="light"] .pp2p-node.site { fill: rgba(234,88,12,.12); stroke: #ea580c; filter: drop-shadow(0 0 10px rgba(234,88,12,.25)); } :root[data-theme="light"] .pp2p-edge { stroke: rgba(71,85,105,.28); } :root[data-theme="light"] .pp2p-edge.l2 { stroke: rgba(21,128,61,.4); } :root[data-theme="light"] .pp2p-edge.l1 { stroke: rgba(234,88,12,.7); filter: none; } :root[data-theme="light"] .pp2p-lab { fill: #475569; } :root[data-theme="light"] .pp2p-lab.site, :root[data-theme="light"] .pp2p-mult.grow { fill: #b45309; } :root[data-theme="light"] .pp2p-mult { fill: #64748b; } :root[data-theme="light"] .pp2p-flt { fill: #6d28d9; } :root[data-theme="light"] .pp2p-membrane { stroke: rgba(109,40,217,.5); } :root[data-theme="light"] .pp2p-spark.s3 { fill: #64748b; filter: none; } :root[data-theme="light"] .pp2p-spark.s2 { fill: #15803d; filter: none; } :root[data-theme="light"] .pp2p-spark.s1 { fill: #ea580c; filter: none; } :root[data-theme="light"] .pp2p-risk { fill: #dc2626; filter: none; } :root[data-theme="light"] .pp2p-burst { stroke: #dc2626; } :root[data-theme="light"] .pp2p-legend { color: #475569; } /* services switcher in the header */ :root[data-theme="light"] .pph-switch { background: #fff; border-color: rgba(15,23,42,.12); box-shadow: 0 1px 2px rgba(15,23,42,.05); } :root[data-theme="light"] .pph-switch__tab { color: #475569; } :root[data-theme="light"] .pph-switch__tab:hover { color: #0f172a; background: #f1f5f9; } :root[data-theme="light"] .pph-switch__tab.active { color: #fff; background: linear-gradient(135deg, #1d4ed8, #0e7490); box-shadow: 0 4px 12px rgba(29,78,216,.3); } :root[data-theme="light"] .pph-switch__tab.active i { color: #fff !important; } :root[data-theme="light"] .btn-modern-primary { background: linear-gradient(135deg, #1d4ed8, #6d28d9); border-color: transparent; box-shadow: 0 10px 24px -12px rgba(29,78,216,.55); color: #fff; } :root[data-theme="light"] .btn-modern-primary:hover { background: linear-gradient(135deg, #1e40af, #5b21b6); } :root[data-theme="light"] .btn-modern-primary i, :root[data-theme="light"] .new-hero .btn-modern-primary i, :root[data-theme="light"] .new-section .btn-modern-primary i, :root[data-theme="light"] .btn-modern-primary span { color: #fff; } :root[data-theme="light"] .stat-number { background-image: linear-gradient(135deg, #1d4ed8, #6d28d9); -webkit-background-clip: text; background-clip: text; } :root[data-theme="light"] .title-highlight { background-image: linear-gradient(135deg, #1d4ed8, #6d28d9); -webkit-background-clip: text; background-clip: text; } /* ===================================================================================== v2 design pass — cabinet ===================================================================================== */ :root[data-theme="light"] .pp-onb-progress { background: #e2e8f0; border: 1px solid rgba(15,23,42,.08); } :root[data-theme="light"] .pp-onb-progress .pp-progress-label { color: #0f172a; text-shadow: none; } :root[data-theme="light"] .nav-stat-chip i, :root[data-theme="light"] .sidebar i[style], :root[data-theme="light"] .menu-item i[style] { filter: brightness(.78) saturate(1.35); } /* cookie banner: light card */ :root[data-theme="light"] .pp-cookie-consent { background: rgba(255,255,255,.98); border-color: rgba(15,23,42,.14); box-shadow: 0 24px 60px -20px rgba(15,23,42,.35); } :root[data-theme="light"] .pp-cookie-consent__icon { color: #b45309; } :root[data-theme="light"] .pp-cookie-consent__title { color: #0f172a; } :root[data-theme="light"] .pp-cookie-consent__text { color: #475569; } :root[data-theme="light"] .pp-cookie-consent__link { color: #1d4ed8; } :root[data-theme="light"] .pp-cookie-btn-necessary, :root[data-theme="light"] .pp-cookie-consent--eu .pp-cookie-btn-necessary { color: #334155; border-color: rgba(15,23,42,.25); } :root[data-theme="light"] .pp-cookie-btn-necessary:hover { color: #0f172a; background: #f1f5f9; border-color: rgba(15,23,42,.4); } /* ===================================================================================== v2 design pass — SEO Radar (own --rdr-* palette: light variant) ===================================================================================== */ :root[data-theme="light"] .rdr-scope { --rdr-bg: #f6f4fc; --rdr-surface: #ffffff; --rdr-surface-2: #f0edfa; --rdr-line: rgba(91,70,160,.18); --rdr-line-2: rgba(91,70,160,.34); --rdr-gold: #b45309; --rdr-gold-soft: rgba(180,83,9,.10); --rdr-gold-line: rgba(180,83,9,.40); --rdr-emerald: #047857; --rdr-emerald-soft: rgba(4,120,87,.10); --rdr-txt: #1e1b3a; --rdr-dim: #5b5780; background: radial-gradient(1200px 620px at 12% -8%, rgba(99,80,190,.10), transparent 62%), var(--rdr-bg); box-shadow: 0 24px 60px -40px rgba(30,27,58,.35); } :root[data-theme="light"] .theme-toggle { background: #fff; border-color: rgba(15,23,42,.18); color: #334155; } :root[data-theme="light"] .theme-toggle:hover { background: #f1f5f9; color: #0f172a; } :root[data-theme="light"] .rdr-scope { --rdr-gold: #92400e; } :root[data-theme="light"] .pz-funit-top > span { color: #4338ca; } /* ===================================================================================== v2.1 — homepage layout review ===================================================================================== */ /* 1. no empty band under the header: the hero starts right away and shares the page background */ :root[data-theme="light"] .landing-container-new { margin-top: 0 !important; } :root[data-theme="light"] .new-hero { padding-top: 12px; background-image: linear-gradient(180deg, var(--bg), #eef3fa 100%); } /* 4. the animated particle canvas reads as dirt on a light page */ :root[data-theme="light"] #bgfx { opacity: 1; } /* 5. one calm page background; sections are separated by spacing and white cards, not by grey/white stripes */ :root[data-theme="light"] .new-section { background: transparent; } :root[data-theme="light"] .new-section + .new-section { border-top: 1px solid rgba(15,23,42,.06); } /* 3. hero actions: one primary (blue), one secondary (white), the rest quiet ghost links */ :root[data-theme="light"] .pp2-quick a.pp2-q-fill, :root[data-theme="light"] .pp2-quick a.pp2-q-ghost { background: #fff; color: #334155; border: 1px solid rgba(15,23,42,.14); box-shadow: none; font-weight: 600; } :root[data-theme="light"] .pp2-quick a.pp2-q-fill i, :root[data-theme="light"] .pp2-quick a.pp2-q-ghost i { color: #2563eb; } :root[data-theme="light"] .pp2-quick a:hover { border-color: #2563eb; color: #1d4ed8; background: #f8fbff; } :root[data-theme="light"] .btn-modern-outline { background: #fff; color: #1d4ed8; border: 1px solid rgba(29,78,216,.45); box-shadow: none; } :root[data-theme="light"] .btn-modern-outline i { color: #1d4ed8; } /* 7. bonus plaque: a calm accent card, not a warning strip */ :root[data-theme="light"] .bonus-banner { background: #fff; border: 1px solid rgba(37,99,235,.22); border-left-width: 1px; box-shadow: 0 10px 30px -22px rgba(37,99,235,.45); } :root[data-theme="light"] .bonus-banner::before, :root[data-theme="light"] .bonus-banner::after { display: none; } :root[data-theme="light"] .bonus-banner__icon { background: rgba(37,99,235,.10); color: #2563eb; border: 0; } :root[data-theme="light"] .bonus-banner__icon i { color: #2563eb; } :root[data-theme="light"] .bonus-banner__title { color: #0f172a; } :root[data-theme="light"] .bonus-banner__subtitle { color: #475569; } :root[data-theme="light"] .bonus-banner .btn-modern-amber { background: linear-gradient(135deg, #2563eb, #1d4ed8); color: #fff; border-color: transparent; box-shadow: 0 10px 24px -12px rgba(37,99,235,.6); } :root[data-theme="light"] .bonus-banner .btn-modern-amber i, :root[data-theme="light"] .bonus-banner .btn-modern-amber span { color: #fff; } /* 8. section headers: badge on top, title left (1-2 lines), description on the right, aligned to the top */ :root[data-theme="light"] .new-section .section-header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 56px; row-gap: 10px; align-items: start; text-align: left; padding: 0 0 22px; margin-bottom: 32px; border-bottom: 1px solid rgba(15,23,42,.1); } :root[data-theme="light"] .new-section .section-header .section-label { grid-column: 1 / -1; justify-self: start; margin: 0; } :root[data-theme="light"] .new-section .section-header .section-title { grid-column: 1; margin: 0; text-align: left; hyphens: none; overflow-wrap: normal; word-break: normal; font-size: clamp(26px, 3.2vw, 38px); line-height: 1.12; } :root[data-theme="light"] .new-section .section-header .section-subtitle { grid-column: 2; margin: 6px 0 0; text-align: left; align-self: start; color: #475569; } :root[data-theme="light"] .new-section .section-header > *:only-child { grid-column: 1 / -1; } @media (max-width: 860px) { :root[data-theme="light"] .new-section .section-header { grid-template-columns: 1fr; } :root[data-theme="light"] .new-section .section-header .section-subtitle { grid-column: 1; margin-top: 0; } } /* 9. "all tools" tile: same card language as the rest */ :root[data-theme="light"] .pp2-tools-cta { background: #fff; border: 1px solid rgba(37,99,235,.35); color: #1d4ed8; box-shadow: none; } :root[data-theme="light"] .pp2-tools-cta:hover { background: #f1f6ff; } :root[data-theme="light"] .pp2-tools-cta i { color: #2563eb; } /* 6. cascade diagram: stronger nodes and edges, larger labels, level colours kept */ :root[data-theme="light"] .pp2p-node { fill: #fff; stroke: rgba(51,65,85,.75); stroke-width: 1.6; } :root[data-theme="light"] .pp2p-node.t2n { stroke: #15803d; } :root[data-theme="light"] .pp2p-node.t1 { stroke: #ea580c; stroke-width: 2.2; } :root[data-theme="light"] .pp2p-edge { stroke: rgba(51,65,85,.42); stroke-width: 1.4; } :root[data-theme="light"] .pp2p-edge.l2 { stroke: rgba(21,128,61,.7); stroke-width: 2.2; } :root[data-theme="light"] .pp2p-edge.l1 { stroke: #ea580c; stroke-width: 3.4; } :root[data-theme="light"] .pp2p-lab { fill: #334155; font-size: 11.5px; font-weight: 600; } :root[data-theme="light"] .pp2p-lab.site { font-size: 13px; } :root[data-theme="light"] .pp2p-mult { fill: #475569; font-size: 12.5px; } :root[data-theme="light"] .pp2p-mult.grow { font-size: 13.5px; } :root[data-theme="light"] .pp2p-flt { fill: #5b21b6; font-size: 10.5px; font-weight: 600; } :root[data-theme="light"] .pp2p-legend { font-size: 13.5px; color: #334155; } :root[data-theme="light"] .new-section, :root[data-theme="light"] .new-section.how-section, :root[data-theme="light"] .new-section.pp2-ba-section, :root[data-theme="light"] .new-section.pro-services-section, :root[data-theme="light"] .new-section.final-cta-section { background: transparent !important; } :root[data-theme="light"] .new-hero { background-image: none; background-color: transparent; } :root[data-theme="light"] .pp2-radar { background: #fff; border-color: rgba(37,99,235,.25); box-shadow: 0 18px 44px -30px rgba(37,99,235,.4); } :root[data-theme="light"] .final-cta-card, :root[data-theme="light"] .pp2-result { background: #fff; border-color: rgba(15,23,42,.1); } :root[data-theme="light"] .pp2-price { background: #fff; border-color: rgba(15,23,42,.1); box-shadow: 0 10px 28px -22px rgba(15,23,42,.35); } :root[data-theme="light"] .pp2-price.hot, :root[data-theme="light"] .pp2-price.pp2-price--hot, :root[data-theme="light"] .pp2-price:first-child { background: linear-gradient(180deg, #f3f7ff, #fff); border-color: rgba(37,99,235,.4); } :root[data-theme="light"] .pp2-price .amt { background: linear-gradient(135deg, #1d4ed8, #6d28d9); -webkit-background-clip: text; background-clip: text; } /* ===================================================================================== v2.1 — cabinet review ===================================================================================== */ /* onboarding progress: light track, accent fill, dark label (was a dark island) */ :root[data-theme="light"] .pp-onb-progress { background-image: none !important; background-color: #e8eefc !important; border: 1px solid rgba(37,99,235,.18); box-shadow: none; } :root[data-theme="light"] .pp-onb-progress .progress-bar { background-image: linear-gradient(90deg, #2563eb, #6d28d9) !important; box-shadow: none; } :root[data-theme="light"] .pp-onb-progress .pp-progress-label { color: #0f172a; text-shadow: 0 0 6px #fff, 0 0 2px #fff; } /* streak / bonus chips: one soft surface, accent only on the amount */ :root[data-theme="light"] .card-body .d-flex.gap-2.flex-wrap > a.rounded-3 { background: #f8fafc !important; border: 1px solid rgba(15,23,42,.09); } :root[data-theme="light"] .card-body .d-flex.gap-2.flex-wrap > a.rounded-3:hover { background: #f1f5f9 !important; } :root[data-theme="light"] .py-2.text-decoration-none.px-3 > .fw-bold, :root[data-theme="light"] .py-2.text-decoration-none.px-3:nth-child(n+2) > .fw-bold { color: #1d4ed8 !important; } :root[data-theme="light"] .py-2.text-decoration-none.px-3 > i, :root[data-theme="light"] .py-2.text-decoration-none.px-3 .bi { filter: saturate(.85); } /* sidebar: one active style, neutral badges, no coloured edge bars on inactive items */ :root[data-theme="light"] .menu-item--advisor, :root[data-theme="light"] .menu-item--indexing, :root[data-theme="light"] .menu-item--advisor:not(.active), :root[data-theme="light"] .menu-item--indexing:not(.active) { border-left: 1px solid rgba(15,23,42,.1) !important; box-shadow: none; } :root[data-theme="light"] .menu-item::before { background: transparent; } :root[data-theme="light"] .menu-item__badge { background: #e8eefc !important; color: #1d4ed8 !important; border: 1px solid rgba(37,99,235,.22); box-shadow: none; text-shadow: none; } :root[data-theme="light"] .menu-item__badge[style*="10b981"] { background: #e7f6ef !important; color: #047857 !important; border-color: rgba(4,120,87,.25); } :root[data-theme="light"] .menu-item.active { background: #e8f0ff !important; border-color: rgba(37,99,235,.4) !important; color: #1d4ed8; box-shadow: inset 3px 0 0 #2563eb; } :root[data-theme="light"] .menu-item.active .menu-item__text, :root[data-theme="light"] .menu-item.active i { color: #1d4ed8; } /* header: counters as tidy neutral chips, service icons quiet except the active one */ :root[data-theme="light"] .nav-stat-chip { background: #f1f5f9; border: 1px solid rgba(15,23,42,.08); color: #334155; border-radius: 999px; } :root[data-theme="light"] .nav-stat-chip i { filter: none; color: #64748b !important; } :root[data-theme="light"] .pph-switch__tab:not(.active) i { color: #64748b !important; } :root[data-theme="light"] .pph-switch__tab:not(.active):hover i { color: #1d4ed8 !important; } :root[data-theme="light"] .pph-switch__tab.active i { color: #fff !important; } /* crypto pill in the footer: dark capsule (like the store badges) so its white text stays readable */ :root[data-theme="light"] .pp-pay2-crypto { background: linear-gradient(135deg, #1e1b4b, #312e81) !important; border-color: rgba(99,102,241,.5) !important; } :root[data-theme="light"] .pp-pay2-crypto-txt { color: #e2e8f0; } :root[data-theme="light"] .card-footer, :root[data-theme="light"] .finance-journal-footer { background: #f8fafc !important; border-top: 1px solid rgba(15,23,42,.08); color: #334155; } :root[data-theme="light"] .rdr-gate i.big { color: #2563eb; } /* header: bonus popover and badge in the light theme */ :root[data-theme="light"] .onboarding-chip .onb-chip__badge { background: rgba(180,83,9,.12); color: #92400e; } :root[data-theme="light"] .onboarding-chip [data-pp-onb-chip-text] { background: #fff; color: #0f172a; border-color: rgba(15,23,42,.14); box-shadow: 0 18px 40px -16px rgba(15,23,42,.35); } /* ===================================================================================== Mobile menu (burger) and cabinet drawer — light variant ===================================================================================== */ @media (max-width: 991.98px) { /* theme switcher: three big segments instead of a dropdown */ .theme-switcher { grid-column: 1 / -1; } .theme-switcher .theme-toggle { display: none; } .theme-switcher .theme-switcher__menu { display: flex !important; position: static !important; transform: none !important; inset: auto !important; min-width: 0; gap: 6px; padding: 4px; margin: 6px 0 0; border-radius: 14px; background: rgba(148,163,184,.14); border: 1px solid rgba(148,163,184,.25); box-shadow: none; } .theme-switcher .theme-switcher__menu > li { flex: 1 1 0; } .theme-switcher .theme-option { justify-content: center; min-height: 44px; border-radius: 10px; gap: .45rem; padding: .4rem .5rem; } .theme-switcher .theme-option .theme-option__check { display: none; } .theme-switcher .theme-option.active { background: #2563eb; color: #fff; } .theme-switcher .theme-option.active i { color: #fff; } :root[data-theme="light"] .navbar .navbar-collapse { background: #fff; box-shadow: 0 18px 40px -16px rgba(15,23,42,.35), 0 0 0 1px rgba(15,23,42,.1); } :root[data-theme="light"] .navbar .navbar-collapse .nav-link { color: #334155; } :root[data-theme="light"] .navbar .navbar-collapse .nav-link i { color: #475569; } :root[data-theme="light"] .navbar .navbar-collapse .nav-link--radar { color: #b45309 !important; } :root[data-theme="light"] .navbar .navbar-collapse .nav-link:hover, :root[data-theme="light"] .navbar .navbar-collapse .nav-link:active { background: #f1f5f9; color: #0f172a; } :root[data-theme="light"] .mobile-collapse-tabs .tab-btn { background: #f1f5f9; color: #334155; border-color: rgba(15,23,42,.12); } :root[data-theme="light"] .mobile-collapse-tabs .tab-btn.active { background: #e8f0ff; color: #1d4ed8; border-color: #2563eb; } :root[data-theme="light"] .navbar .navbar-collapse .navbar-nav > li.dropdown:not(.nav-item--chip) { background: #f8fafc; border-color: rgba(15,23,42,.1); } :root[data-theme="light"] .navbar .navbar-collapse .navbar-nav > li.dropdown:not(.nav-item--chip) .dropdown-menu .dropdown-item:not(.language-option), :root[data-theme="light"] .navbar .navbar-collapse .navbar-nav > li.dropdown:not(.nav-item--chip) form .btn { background: #fff; color: #334155; border: 1px solid rgba(15,23,42,.08); } :root[data-theme="light"] .pp-mobile-sep { color: #475569; opacity: 1; } :root[data-theme="light"] .navbar-toggler, :root[data-theme="light"] .sidebar-toggle { background: #fff; border-color: rgba(15,23,42,.2); color: #334155; } /* cabinet drawer */ :root[data-theme="light"] .mobile-sidebar-panel { background: #f4f7fb; border-right: 1px solid rgba(15,23,42,.12); box-shadow: 0 18px 40px -16px rgba(15,23,42,.35); } :root[data-theme="light"] .mobile-sidebar-panel .sidebar-panel { background: #fff; border-color: rgba(15,23,42,.1); } :root[data-theme="light"] .mobile-sidebar-panel .sidebar-panel__title { color: #0f172a; } :root[data-theme="light"] .mobile-sidebar-panel .menu-item:hover { background: #f1f5f9; } :root[data-theme="light"] .mobile-sidebar-panel__inner::-webkit-scrollbar-track { background: rgba(15,23,42,.06); } } @media (max-width: 991.98px) { .navbar .theme-switcher .theme-switcher__menu { background: rgba(148,163,184,.14) !important; border: 1px solid rgba(148,163,184,.3) !important; width: 100%; max-width: 100%; box-sizing: border-box; overflow: hidden; } .theme-switcher .theme-switcher__menu > li { min-width: 0; } .theme-switcher .theme-option { width: 100%; min-width: 0; padding: .4rem .25rem; font-size: .82rem; white-space: nowrap; flex-direction: column; gap: .15rem; background: transparent; color: inherit; } .theme-switcher .theme-option > i:first-child { font-size: 1.05rem; } .theme-switcher .theme-option span { overflow: hidden; text-overflow: ellipsis; max-width: 100%; } :root[data-theme="light"] .navbar .theme-switcher .theme-option { color: #334155; } :root[data-theme="light"] .navbar .theme-switcher .theme-option.active { color: #fff; } } @media (max-width: 991.98px) { .navbar .theme-switcher .theme-switcher__menu { box-shadow: none !important; } .navbar .theme-switcher .theme-option { background: transparent !important; } .navbar .theme-switcher .theme-option.active { background: #2563eb !important; } } @media (max-width: 380px) { .theme-switcher .theme-option { font-size: .72rem; } } /* quick-start card: progress track and CTA share one language (same height, radius, accent) */ :root[data-theme="light"] .pp-onb-progress { height: 44px !important; border-radius: 12px !important; overflow: hidden; } :root[data-theme="light"] .pp-onb-progress .progress-bar, :root[data-theme="light"] .pp-liquid-bar { background-image: linear-gradient(90deg, #3b82f6, #6366f1) !important; box-shadow: none !important; min-width: 44px; filter: none !important; animation: none !important; border-radius: 12px !important; } :root[data-theme="light"] .pp-liquid-bar::before, :root[data-theme="light"] .pp-liquid-bar::after { display: none !important; } :root[data-theme="light"] .pp-onb-progress .pp-progress-label { color: #0f172a; text-shadow: 0 0 5px #fff, 0 0 3px #fff; font-size: .92rem; } :root[data-theme="light"] .pp-onb-cta { height: 44px; border-radius: 12px; } :root[data-theme="light"] .pp-onb-col--action { padding-left: 4px; } :root[data-theme="light"] .pp-onb-col--action { margin-left: 10px; } /* header dropdowns (profile, language, theme): light card, readable items */ :root[data-theme="light"] .navbar .dropdown-menu { background: #fff !important; background-image: none !important; border: 1px solid rgba(15,23,42,.12) !important; box-shadow: 0 22px 48px -18px rgba(15,23,42,.38) !important; color: #0f172a; } :root[data-theme="light"] .navbar .dropdown-menu .dropdown-item { color: #334155 !important; background: transparent; } :root[data-theme="light"] .navbar .dropdown-menu .dropdown-item i { color: #64748b; } :root[data-theme="light"] .navbar .dropdown-menu .dropdown-item:hover, :root[data-theme="light"] .navbar .dropdown-menu .dropdown-item:focus { background: #f1f5f9 !important; color: #0f172a !important; } :root[data-theme="light"] .navbar .dropdown-menu .dropdown-item:hover i { color: #1d4ed8; } :root[data-theme="light"] .navbar .dropdown-menu .dropdown-divider { border-top-color: rgba(15,23,42,.08); } :root[data-theme="light"] .navbar .dropdown-menu code { color: #1d4ed8; background: transparent; } :root[data-theme="light"] .navbar .dropdown-menu .text-muted { color: #64748b !important; } :root[data-theme="light"] .navbar .dropdown-menu .btn-outline-danger { color: #b91c1c; border-color: rgba(185,28,28,.5); background: #fff; } :root[data-theme="light"] .navbar .dropdown-menu .btn-outline-danger:hover { background: #fef2f2; } :root[data-theme="light"] .navbar .dropdown-menu .badge.bg-success-subtle { color: #047857 !important; background: #e7f6ef !important; border-color: rgba(4,120,87,.25) !important; } /* contrast leftovers after the palette change */ :root[data-theme="light"] .section-subtitle { color: #475569; } :root[data-theme="light"] .pz-kicker { color: #4338ca; } :root[data-theme="light"] .cases-hero > p, :root[data-theme="light"] .docs-hero > p, :root[data-theme="light"] .cases-disclaimer { color: #475569; } :root[data-theme="light"] a[rel~="nofollow"][target="_blank"] { color: #1d4ed8; } :root[data-theme="light"] .pp-reviews__header .section-subtitle { color: #475569 !important; } @media (max-width: 991.98px) { :root[data-theme="light"] .navbar .navbar-collapse .nav-link.nav-link--radar { color: #334155 !important; } :root[data-theme="light"] .navbar .navbar-collapse .nav-balance-chip, :root[data-theme="light"] .navbar .navbar-collapse .nav-balance-chip * { color: #1d4ed8 !important; } :root[data-theme="light"] .navbar .navbar-collapse .nav-item--chip .nav-link { color: #334155; } .navbar .theme-switcher .theme-option.active i, .navbar .theme-switcher .theme-option.active span { color: #fff !important; } .mobile-sidebar-panel, .mobile-sidebar-panel:focus, .mobile-sidebar-panel:focus-visible { outline: none; } } /* hero: two ghost buttons in one row, "How it works" as a quiet text link under them */ :root[data-theme="light"] .pp2-quick { gap: .6rem .75rem; align-items: center; } :root[data-theme="light"] .pp2-quick a:nth-child(3) { background: transparent; border-color: transparent; padding-left: 6px; padding-right: 6px; color: #1d4ed8; text-decoration: underline; text-underline-offset: 3px; flex-basis: 100%; justify-content: flex-start; } :root[data-theme="light"] .pp2-quick a:nth-child(3):hover { background: transparent; border-color: transparent; color: #1e40af; } :root[data-theme="light"] .pp-onb-progress .progress-bar.pp-liquid-bar { background: linear-gradient(90deg, #3b82f6, #6366f1) !important; } :root[data-theme="light"] .pp-onb-progress .progress-bar.pp-liquid-bar { background: linear-gradient(90deg, #3b82f6, #6366f1) !important; background-size: 100% 100% !important; } /* quick-start callout: no beige gradient / drifting yellow blob in the light theme — a calm white card with a blue accent border */ :root[data-theme="light"] .dashboard-onboarding-callout { background: #fff; border: 1px solid rgba(37,99,235,.25); animation: none; box-shadow: 0 10px 28px -22px rgba(37,99,235,.4); } :root[data-theme="light"] .dashboard-onboarding-callout::before, :root[data-theme="light"] .dashboard-onboarding-callout::after { display: none; }