/* Only index2 opts into this theme; shared shop pages retain their colors. */
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 13px;border:1px solid #72B7D6;border-radius:24px;background:#FFFFFF;color:#0B4ACD;font-size:13px;font-weight:650;white-space:nowrap}
.theme-toggle:hover{background:#edf6ff}
.theme-toggle:focus-visible{outline:3px solid #72B7D6;outline-offset:4px}
.benefits-wheel-live[hidden]{display:none}
html[data-theme="dark"]{color-scheme:dark;background:#020e20}
html[data-theme="dark"] .index2-page{
 --navy:#f1f7ff;--muted:#b6c9de;--blue:#26c8f5;--green:#72B7D6;--pale:#061c32;--border:#173c58;
 --wabio-green-22b600:#26c8f5;--wabio-green-009d86:#087dcc;--wabio-green-007e71:#086cb2;
 --wabio-green-65ba16:#72B7D6;--wabio-green-18a68d:#72B7D6;--wabio-green-21a48c:#26c8f5;
 --wabio-green-119e8c:#26c8f5;--wabio-green-20d2c3:#26c8f5;--wabio-green-16a281:#26c8f5;
 --wabio-green-087357:#81ddff;--wabio-green-006c38:#087dcc;--wabio-green-096b36:#26c8f5;
 --wabio-green-086038:#26c8f5;--wabio-green-11984e:#087dcc;--wabio-green-087d3e:#086cb2;
 background:#020e20;color:#f1f7ff;
}
html[data-theme="dark"] .index2-page :is(h1,h2,h3,h4){color:#f1f7ff}
html[data-theme="dark"] .index2-page :is(p,.check-list li,.product-intro>p){color:#b6c9de}
html[data-theme="dark"] .index2-page :is(h2 span,.getting-started h2 span,.featured-banner h3 em){color:#26c8f5}
html[data-theme="dark"] .index2-shop-header{background:#03152a;border-color:#164967;box-shadow:0 2px 24px #0005}
html[data-theme="dark"] .index2-shop-header :is(.nav-link-custom,.dropdown-item){color:#f1f7ff}
html[data-theme="dark"] .index2-shop-header .nav-link-custom:hover{color:#26c8f5}
html[data-theme="dark"] .index2-shop-header .wellen-logo+div{color:#b6c9de!important}
/* Preserve the WABIO header mark's original green so it stays clearly visible on dark blue. */
html[data-theme="dark"] .wellen-logo img{filter:none;mix-blend-mode:normal}
/* Screen blending removes the white JPEG background and gives the footer logo a white finish. */
html[data-theme="dark"] .footer-logo img{filter:grayscale(1) contrast(3) invert(1);mix-blend-mode:screen}
/* Keep the WELLEN footer mark in its original blue palette; the shared white-logo filter makes its JPEG background look grey. */
html[data-theme="dark"] .index2-page .footer-logo{width:max-content;padding:7px 10px;background:#fff;border-radius:7px}
html[data-theme="dark"] .index2-page .footer-logo img{filter:none;mix-blend-mode:normal}
html[data-theme="dark"] .index2-shop-header :is(.user-menu,.user-logo-link){background:#08243d;border-color:#23506b}
html[data-theme="dark"] .index2-shop-header .dropdown-item:hover{background:#103750}
html[data-theme="dark"] .theme-toggle{background:#0a2b46;border-color:#26779a;color:#85e4ff}
html[data-theme="dark"] .theme-toggle:hover{background:#13425f}
html[data-theme="dark"] .index2-page :is(.product-section,.product-section:nth-child(odd),.testimonials,.getting-started,.vehicle-categories,.benefits-wheel,.refer-earn-strip,.hot-deals-strip,.app-promo-reference){background:#020e20}
html[data-theme="dark"] .index2-page :is(.solution-card,.product-card,.featured-item,.home-video-card,.review-card,.callback-form,.footer-card,dialog){background:linear-gradient(135deg,#092a43,#04172a);border:1px solid #173c58;box-shadow:0 5px 22px #0003;color:#f1f7ff}
html[data-theme="dark"] .index2-page :is(.solution-card:hover,.product-card:hover,.featured-item:hover){border-color:#26c8f5;box-shadow:0 0 20px #26c8f51c}
html[data-theme="dark"] .index2-page :is(.product-image,.featured-item-art,.vehicle-categories-inner,.getting-started-art){background:radial-gradient(ellipse,#103e5a,#061c32)}
html[data-theme="dark"] .index2-page :is(.solution-image,.product-image,.featured-item-art svg,.solution-card img){mix-blend-mode:normal}
html[data-theme="dark"] .index2-page :is(.product-card>p,.solution-card small,.featured-item p,.review-card blockquote,.review-summary,.review-person small,.getting-started-step p,.getting-started-heading p,.home-videos-subtitle,.store-difference-subtitle,.vehicle-category figcaption){color:#b6c9de}
html[data-theme="dark"] .index2-page :is(.button,.campaign-shop){background:#087dcc;border-color:#26c8f5;color:#fff}
html[data-theme="dark"] .index2-page .button:hover{background:#0b94de}
html[data-theme="dark"] .index2-page :is(.button.outline,.product-card .button){background:#08243d;color:#a1eaff;border-color:#27617f}
html[data-theme="dark"] .index2-page :is(.store-comparison .store-wabio-cell,.store-comparison .store-other-cell){background:linear-gradient(130deg,#0a304c,#04192c);border-color:#1c4864}
html[data-theme="dark"] .store-comparison :is(.store-comparison-content,.store-comparison-content>div){border-color:#1c4864}
html[data-theme="dark"] .index2-page .store-benefit-icon{background:#0c3e5a;color:#72dcff}
html[data-theme="dark"] .store-other-cell .store-benefit-icon{background:#183447;color:#9ab5c9}
html[data-theme="dark"] .store-wabio-logo{color:white}
html[data-theme="dark"] .store-wabio-logo svg{filter:grayscale(1) contrast(3) invert(1);mix-blend-mode:screen}
/* Keep partner logos on their own light tiles so their original branding stays readable. */
html[data-theme="dark"] .associated-logo-card{border-color:#24536e;box-shadow:0 0 16px #139ee51c}
html[data-theme="dark"] .benefits-wheel-reference{display:none!important}
html[data-theme="dark"] .benefits-wheel-live[hidden]{display:block}
html[data-theme="dark"] .benefits-wheel-brand{background:radial-gradient(circle,#0b304b,#04182c);border-color:#26c8f5;box-shadow:0 0 28px #26c8f533}
html[data-theme="dark"] .benefits-wheel-brand svg{filter:grayscale(1) contrast(3) invert(1);mix-blend-mode:screen}
html[data-theme="dark"] .benefits-wheel-brand :is(strong,small){color:white}
html[data-theme="dark"] .benefits-wheel-card{background:linear-gradient(135deg,#0d344e,#04182c);border-color:#23607d;box-shadow:0 5px 20px #0004;color:#f1f7ff}
html[data-theme="dark"] .benefits-wheel-card p{color:#b6c9de}
html[data-theme="dark"] .benefits-wheel-number{border-color:#06223b}
html[data-theme="dark"] .benefits-wheel-icon{background:#0c405c;color:#72dcff}
html[data-theme="dark"] #callback{background:radial-gradient(ellipse at top left,#0d4772,#04182c 75%)}
html[data-theme="dark"] #callback .callback-benefits .icon{background:#0c405c;color:#72dcff}
html[data-theme="dark"] #callback .form-grid :is(input,select){background:#03182b;color:#f1f7ff;border-color:#2b506b}
html[data-theme="dark"] #callback .form-grid label{color:#c7d9eb}
html[data-theme="dark"] #callback input::placeholder{color:#93adc4}
html[data-theme="dark"] #callback .form-notice{background:#0b3247;color:#a3edff}
html[data-theme="dark"] #callback .form-error{background:#40222e;color:#ffb5bd}
html[data-theme="dark"] .index2-page .site-footer{background:#031326}
html[data-theme="dark"] .index2-page .site-footer :is(.footer-col a,.footer-col ul,.footer-contact,.footer-bottom,.footer-brand p){color:#b6c9de}
html[data-theme="dark"] .index2-page .site-footer :is(.social-dot,.chip){background:#0b304b;color:#8ae3ff}
html[data-theme="dark"] .index2-page .site-footer :is(h4,.trust-title){color:white}
html[data-theme="dark"] #testimonials{background:#04172a}
html[data-theme="dark"] #testimonials :is(.review-summary,.review-person small,.review-rating small){color:#b6c9de}
html[data-theme="dark"] #testimonials :is(.review-rating strong,.review-person strong,.justdial-rating-count){color:#f1f7ff}
html[data-theme="dark"] #testimonials .round-button{background:#0d344e;border-color:#24536e;color:#85e4ff}
html[data-theme="dark"] .index2-page dialog::backdrop{background:#000b}
/* Dark-mode artwork already contains its own copy and CTA design, so show it without an HTML overlay. */
html[data-theme="dark"] .campaign-image-slide:after{display:none}
html[data-theme="dark"] .campaign-image-slide .campaign-background{object-fit:contain}
html[data-theme="dark"] .campaign-image-slide .campaign-content{display:none}
html[data-theme="dark"] .campaign-image-slide :is(.campaign-logo,.campaign-features){display:none}
/* Transparent link hit areas align with the CTA buttons already baked into darkmode1–6 artwork. */
html[data-theme="dark"] .campaign-image-slide :is(.campaign-image-shop,.campaign-image-demo){display:block}
html[data-theme="dark"] :is(.campaign-controls,.campaign-arrow){background:#06243ee8;border-color:#23607d;color:#85e4ff}
html[data-theme="dark"] .campaign-dot{background:#06243e;color:#85e4ff}
html[data-theme="dark"] .campaign-dot[aria-pressed="true"]{background:#087dcc;color:white}
@media(max-width:760px){.index2-shop-header nav{flex-wrap:wrap}.theme-toggle{font-size:12px;padding:8px 11px}}
@media(max-width:540px){.index2-shop-header nav{gap:14px}.theme-toggle{min-height:36px}.theme-toggle span{font-size:11px}
 html[data-theme="dark"] .campaign-image-slide .campaign-background{object-position:center}
}