/* Published configurator theme. Commerce and shared navigation stay independent. */
#race-configurator {
  --config-bg:#101413; --config-surface:#191f1d; --config-raised:#242d29;
  --config-line:#35423b; --config-text:#f2f5f2; --config-muted:#adbab1;
  --config-green:#a6cbb5; --config-yellow:#f3d12d;
  --config-header-height:125px;
  background:var(--config-bg); color:var(--config-text); letter-spacing:0;
}
html:not(.dark-theme) #race-configurator { --config-bg:#f2f5f2; --config-surface:#fff; --config-raised:#e5ece6; --config-line:#ccd7ce; --config-text:#17231c; --config-muted:#53645a; --config-green:#226443; }
#race-configurator main { width:100%!important; max-width:1600px!important; margin:auto!important; padding:0 40px 48px!important; background:var(--config-bg)!important; }
#race-configurator main * { box-sizing:border-box; letter-spacing:0!important; }
#race-configurator main :where(h1,h2,h3,h4,strong,dt,dd) { color:var(--config-text)!important; }
#race-configurator main :where(p,small,li) { color:var(--config-muted)!important; }
#race-configurator main :where(.eyebrow,.tag) { color:var(--config-green)!important; font-size:11px; }
#race-configurator main :focus-visible { outline:2px solid #beab20; outline-offset:4px; }
#race-configurator main svg { width:20px; height:20px; flex-shrink:0; }
#race-configurator main>section { border-radius:0!important; box-shadow:none!important; }
#race-configurator main>section:before,#race-configurator main>section:after { display:none!important; }
#race-configurator .configurator-hero { min-height:194px!important; padding:36px 30px!important; margin:28px 0 22px!important; border:0!important; background:linear-gradient(90deg,#102219 0%,#102219 70%,#10221900 84%),url('assets/fanatec/CSL_Cockpit_racing_hall.width-1000.format-webp.webp') right 65% / auto 112% no-repeat #102219!important; display:flex!important; align-items:center!important; }
#race-configurator .configurator-hero>div { width:100%!important; }
#race-configurator .configurator-hero h1 { color:#fff!important; font-size:36px!important; line-height:1.1!important; max-width:60%; margin:10px 0!important; text-transform:none!important; }
#race-configurator .configurator-hero p { color:#becdc3!important; font-size:13px!important; line-height:1.6; max-width:55%; margin:0!important; }
#race-configurator .configurator-hero .eyebrow { color:#c7d88a!important; font-size:11px!important; }
#race-configurator :where(.configurator-hero>a,.config-line-switch,.configurator-section>.section-heading,.ecosystem-stage-header,.ecosystem-stage>p) { display:none!important; }
#race-configurator .configurator-section { padding:0!important; border:0!important; background:transparent!important; }
#race-configurator .ecosystem-stage { margin:0 0 22px!important; padding:0!important; border:0!important; background:transparent!important; border-radius:0!important; box-shadow:none!important; }
#race-configurator .ecosystem-switch { display:flex!important; justify-content:center!important; gap:18px!important; width:100%!important; max-width:none!important; padding:12px 0 24px!important; border-bottom:1px solid var(--config-line); }
#race-configurator .ecosystem-card { flex:0 1 280px; position:relative; min-width:0!important; display:flex!important; align-items:center!important; justify-content:center!important; height:108px!important; min-height:108px!important; padding:18px!important; background:var(--config-surface)!important; border:2px solid var(--config-line)!important; border-radius:6px!important; box-shadow:none!important; transform:none!important; }
#race-configurator .ecosystem-card.is-active { border-color:var(--config-yellow)!important; background:#283c30!important; box-shadow:inset 0 -4px 0 var(--config-yellow)!important; }
html:not(.dark-theme) #race-configurator .ecosystem-card.is-active { background:#e0ecdf!important; border-color:#927d04!important; box-shadow:inset 0 -4px 0 #d6b719!important; }
#race-configurator .ecosystem-card:hover:not(.is-active) { border-color:var(--config-green)!important; }
#race-configurator .ecosystem-card:before,#race-configurator .ecosystem-card:after { display:none!important; }
#race-configurator .ecosystem-card>*:not(.ecosystem-logo-frame):not(.config-brand-selected) { display:none!important; }
#race-configurator .ecosystem-logo-frame { width:240px!important; max-width:100%!important; height:52px!important; min-height:0!important; padding:0!important; margin:0!important; border:0!important; background:none!important; }
#race-configurator .ecosystem-logo-frame img { object-fit:contain!important; width:100%!important; height:100%!important; }
html:not(.dark-theme) #race-configurator [data-ecosystem="moza"] .ecosystem-logo-light { filter:brightness(0)!important; }
#race-configurator .config-brand-selected { display:none; position:absolute; top:8px; right:8px; width:22px; height:22px; padding:3px; border-radius:50%; color:#15251a; background:var(--config-yellow); }
#race-configurator .ecosystem-card.is-active .config-brand-selected { display:flex; align-items:center; justify-content:center; }
#race-configurator .config-brand-selected svg { width:16px; height:16px; }
#race-configurator .configurator { display:grid!important; grid-template-columns:minmax(0,1fr) 340px!important; gap:28px!important; align-items:start!important; }
#race-configurator .builder { min-width:0; display:block!important; }
#race-configurator .config-step-navigation { position:sticky; top:var(--config-sticky-offset, var(--config-header-height)); z-index:10; background:var(--config-bg); padding-bottom:16px; margin-bottom:8px; scroll-margin-top:calc(var(--config-sticky-offset, var(--config-header-height)) + 12px); }
#race-configurator .config-step-navigation .config-steps { position:static; margin-bottom:0; }
#race-configurator .config-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) 44px; gap:6px; padding:8px 0; border-bottom:1px solid var(--config-line); }
#race-configurator .config-steps button { min-width:0; height:72px; padding:10px 12px; border:1px solid var(--config-line); border-radius:4px; background:var(--config-surface); color:var(--config-muted); display:grid; grid-template-columns:minmax(0,1fr) 16px; grid-template-rows:18px 20px; align-content:center; gap:4px; font:inherit; cursor:pointer; }
#race-configurator .config-steps button:hover { border-color:var(--config-green); color:var(--config-text); }
#race-configurator .config-step-number { grid-column:1; grid-row:1; font-size:11px; text-align:left; }
#race-configurator .config-step-label { grid-column:1/-1; grid-row:2; font-size:14px; font-weight:700; text-align:left; line-height:20px; }
#race-configurator .config-steps svg { display:none; grid-column:2; grid-row:1; width:16px; height:16px; color:currentColor; }
#race-configurator .config-steps .is-complete .config-step-check { display:block; color:var(--config-green); }
#race-configurator .config-steps button.is-next { border-color:var(--config-green); background:var(--config-raised); color:var(--config-text); }
#race-configurator .config-steps .is-next .config-step-arrow { display:block; color:var(--config-green); }
#race-configurator .config-steps .is-next .config-step-check { display:none; }
#race-configurator .config-steps button[aria-current="step"] { background:var(--config-yellow); border-color:var(--config-yellow); color:#141810; }
#race-configurator .config-steps button[aria-current="step"] .config-step-check { color:#141810; }
#race-configurator .config-steps .config-summary-shortcut { display:flex; align-items:center; justify-content:center; padding:10px; }
#race-configurator .config-summary-shortcut svg { display:block!important; width:19px; height:19px; margin:0; }
#race-configurator .option-group { background:transparent!important; padding:0!important; border:0!important; border-radius:0!important; margin:0!important; box-shadow:none!important; }
#race-configurator .group-title { margin-bottom:20px!important; }
#race-configurator .group-title>span { display:none!important; }
#race-configurator .group-title h3 { font-size:22px!important; }
#race-configurator .group-title p { font-size:12px!important; }
#race-configurator .option-grid { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:14px!important; }
#race-configurator .option-card { min-width:0!important; border:1px solid var(--config-line)!important; background:var(--config-surface)!important; border-radius:5px!important; padding:14px!important; box-shadow:none!important; transform:none!important; display:flex!important; flex-direction:column; gap:9px!important; }
#race-configurator .option-card.selected { border-color:var(--config-yellow)!important; box-shadow:inset 0 0 0 1px var(--config-yellow)!important; }
#race-configurator .option-card>strong { font-size:15px!important; line-height:1.35!important; }
#race-configurator .option-card>p { font-size:11px!important; line-height:1.6; }
#race-configurator .option-card .price { font-size:18px!important; color:var(--config-text)!important; margin-top:auto; }
#race-configurator .option-card :where(.card-gallery,.option-photo) { width:100%!important; height:148px!important; min-height:0!important; margin:0 0 8px!important; border:0!important; border-radius:3px!important; background:#fff!important; }
#race-configurator .option-card .card-gallery img { width:100%!important; height:100%!important; object-fit:contain!important; padding:8px; filter:none!important; }
#race-configurator .option-card .select-copy { color:var(--config-green)!important; background:transparent!important; font-size:10px!important; }
#race-configurator .option-card .product-link { color:var(--config-muted)!important; font-size:10px!important; padding:4px 0!important; border:0!important; background:none!important; }
#race-configurator .variant-select { background:var(--config-raised)!important; color:var(--config-text)!important; border:1px solid var(--config-line)!important; border-radius:3px; max-width:100%; }
#race-configurator .summary { position:sticky!important; top:100px!important; left:auto!important; right:auto!important; bottom:auto!important; display:block!important; width:100%!important; min-width:0!important; max-width:none!important; transform:none!important; opacity:1!important; visibility:visible!important; pointer-events:auto!important; padding:24px!important; border:1px solid var(--config-line)!important; border-radius:4px!important; background:var(--config-surface)!important; box-shadow:none!important; max-height:none!important; overflow:visible!important; scroll-margin-top:100px; }
#race-configurator .summary h2 { font-size:23px!important; }
#race-configurator .summary #summary-description { font-size:12px; }
#race-configurator :where(.summary-start-card,.score,.kit-insight,.summary-scroll-button) { display:none!important; }
#race-configurator .summary-list { display:block!important; }
#race-configurator .summary-list>div { padding:12px 0!important; border-bottom:1px solid var(--config-line)!important; background:none!important; border-radius:0!important; }
#race-configurator .summary-list :where(dt,dd) { font-size:12px!important; line-height:1.6!important; }
#race-configurator .summary-list dt { color:var(--config-muted)!important; }
#race-configurator .compatibility-panel { background:transparent!important; border:0!important; padding:14px 0!important; }
#race-configurator .compatibility-panel strong { font-size:12px!important; }
#race-configurator .compatibility-panel p { font-size:11px!important; line-height:1.5!important; }
#race-configurator .compatibility-warning:not(:empty) { padding:10px!important; border:1px solid #807234!important; background:#322e1d!important; color:#ffeda4!important; border-radius:3px!important; }
#race-configurator .total-box { background:none!important; padding:16px 0!important; border:0!important; border-top:1px solid var(--config-line)!important; border-radius:0!important; }
#race-configurator #total-price { font-size:27px!important; }
#race-configurator .total-box>span { color:var(--config-muted)!important; font-size:12px!important; }
#race-configurator main .button { border-radius:4px!important; box-shadow:none!important; text-shadow:none!important; min-height:44px; font-size:13px!important; font-weight:700; white-space:normal!important; cursor:pointer; }
#race-configurator main .button.primary { background:var(--config-yellow)!important; color:#141810!important; border:1px solid var(--config-yellow)!important; }
#race-configurator main .button.secondary { background:transparent!important; color:var(--config-text)!important; border:1px solid var(--config-line)!important; }
#race-configurator .summary-actions { display:grid!important; gap:8px!important; }
#race-configurator .summary-actions .button { font-size:12px!important; padding:12px 8px!important; }
#race-configurator .config-step-actions { display:flex; justify-content:space-between; gap:12px; margin:22px 0; }
#race-configurator .config-step-actions .button { display:inline-flex; gap:8px; align-items:center; justify-content:center; padding:12px 18px; }
#race-configurator .config-summary-link { margin-left:auto; }
@media(min-width:1700px) { #race-configurator main { max-width:1760px!important; padding-inline:60px!important; } }
@media(max-width:1150px) {
  #race-configurator main { padding-inline:24px!important; }
  #race-configurator .option-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  #race-configurator .configurator { grid-template-columns:minmax(0,1fr) 300px!important; gap:20px!important; }
}
@media(max-width:800px) {
  #race-configurator main { padding:0 18px 32px!important; }
  #race-configurator .configurator-hero { margin-top:18px!important; padding:24px 20px!important; min-height:188px!important; background-image:linear-gradient(90deg,#102219ee,#10221999 55%,#10221922),url('assets/fanatec/CSL_Cockpit_racing_hall.width-1000.format-webp.webp')!important; background-size:auto,auto 100%!important; }
  #race-configurator .configurator-hero h1 { font-size:29px!important; max-width:75%!important; }
  #race-configurator .configurator-hero p { max-width:72%!important; font-size:11px!important; }
  #race-configurator .configurator { grid-template-columns:minmax(0,1fr)!important; }
  #race-configurator .summary { position:static!important; padding:22px!important; }
  #race-configurator .ecosystem-switch { gap:10px!important; padding:8px 0 18px!important; }
  #race-configurator .ecosystem-card { flex:1; height:90px!important; min-height:90px!important; padding:10px!important; }
  #race-configurator .ecosystem-logo-frame { height:38px!important; }
  #race-configurator .config-brand-selected { top:4px; right:4px; width:17px; height:17px; }
  #race-configurator .config-steps button { padding-inline:8px; }
}
@media(max-width:440px) {
  #race-configurator main { padding-inline:14px!important; }
  #race-configurator .configurator-hero { padding:22px 16px!important; }
  #race-configurator .configurator-hero h1 { font-size:27px!important; }
  #race-configurator .ecosystem-switch { gap:8px!important; }
  #race-configurator .ecosystem-card { padding:8px!important; height:82px!important; min-height:82px!important; }
  #race-configurator .option-grid { gap:10px!important; }
  #race-configurator .option-card { padding:10px!important; }
  #race-configurator .option-card .card-gallery { height:115px!important; }
  #race-configurator .option-card>strong { font-size:13px!important; }
  #race-configurator .option-card .price { font-size:16px!important; }
  #race-configurator .config-steps { gap:4px; }
  #race-configurator .config-steps button { padding-inline:5px; height:68px; }
  #race-configurator .config-step-label { font-size:12px; }
  #race-configurator .config-step-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.35fr); }
  #race-configurator .config-step-actions .button { padding:11px 10px; font-size:11px!important; }
  #race-configurator [data-config-next] { grid-column:2; }
  #race-configurator .config-summary-link { grid-column:1/-1; margin:0; }
}
#race-configurator main { padding-top:var(--config-header-height)!important; }
#race-configurator .summary { top:calc(var(--config-sticky-offset, var(--config-header-height)) + 16px)!important; scroll-margin-top:calc(var(--config-sticky-offset, var(--config-header-height)) + 16px); }
#race-configurator .cart-fab { right:20px!important; bottom:20px!important; }
#race-configurator .mobile-whatsapp { right:20px!important; bottom:82px!important; }
#race-configurator [hidden][hidden] { display:none!important; }
#race-configurator:not([data-active-config-step="vr"]) #pimax-accessory-group { display:none!important; }