{{ header }}
<div id="racechip-results-page" class="container">


  <div class="row">{{ column_left }}
    {% if column_left and column_right %}{% set class = 'col-sm-6' %}{% elseif column_left or column_right %}{% set class = 'col-sm-9' %}{% else %}{% set class = 'col-sm-12' %}{% endif %}
    <div id="content" class="{{ class }}">
      {{ content_top }}

      <section class="rc-car-hero {% if vehicle_image %}rc-car-hero-with-image{% endif %}">
        <div class="rc-car-hero-copy">
          <h1>{{ heading_title }}</h1>
          <p class="rc-car-engine">{{ vehicle_title }}</p>
          <div class="rc-baseline">
            {% if vehicle.default_ps %}<div><small>HP</small><strong>{{ vehicle.default_ps|number_format(0, '.', '') }}</strong><span>{{ text_original_power }}</span></div>{% endif %}
            {% if vehicle.default_kw %}<div><small>kW</small><strong>{{ vehicle.default_kw|number_format(0, '.', '') }}</strong><span>{{ text_original_power }}</span></div>{% endif %}
            {% if vehicle.default_nm %}<div><small>Nm</small><strong>{{ vehicle.default_nm|number_format(0, '.', '') }}</strong><span>{{ text_original_torque }}</span></div>{% endif %}
          </div>
        </div>
        {% if vehicle_image %}
          <div class="rc-car-hero-image"><img src="{{ vehicle_image }}" alt="{{ vehicle_title }} RaceChip" loading="eager"></div>
        {% endif %}
      </section>

      {% if vehicle_description %}
        <section class="rc-vehicle-description" data-rc-description>
          <div class="rc-vehicle-description-content" id="rcVehicleDescriptionContent">
            {{ vehicle_description|raw }}
          </div>
          <button type="button" class="rc-vehicle-description-toggle" aria-expanded="false" aria-controls="rcVehicleDescriptionContent" hidden>
            <span>Περισσότερα</span>
            <i class="fa fa-angle-down" aria-hidden="true"></i>
          </button>
        </section>
      {% endif %}

      {% if tuning_products %}
      <section class="rc-shop-section rc-chip-section">
        <div class="rc-shop-heading">
          <span class="rc-shop-kicker">RACECHIP PERFORMANCE</span>
          <h2>{{ text_available_products }}</h2>
          <p>{{ vehicle_title }}</p>
        </div>

        <div class="rc-product-tabs visible-xs visible-sm">
          {% for product in tuning_products %}
            <a href="#rc-card-{{ product.product_id }}" class="rc-product-tab">
              <img src="{{ product.image }}" alt="{{ product.chip_name }}">
              <strong>{{ product.chip_name }}</strong>
              {% if product.performance_ps %}<span>+{{ product.performance_ps|number_format(0, '.', '') }} HP</span>{% endif %}
            </a>
          {% endfor %}
        </div>

        <div class="rc-compare-grid">
          {% for product in tuning_products %}
            <article id="rc-card-{{ product.product_id }}" class="rc-compare-card rc-family-{{ product.family_class }} {% if product.featured %}is-featured{% endif %}" data-product-card="{{ product.product_id }}">
              {% if product.featured %}<div class="rc-favorite-ribbon">{{ text_customer_favorite }}</div>{% endif %}

              <div class="rc-card-head">
                <div class="rc-product-mark">RACECHIP</div>
                <h3>{{ product.chip_name }}</h3>
                <div class="rc-card-subtitle">{{ product.subtitle }}</div>
                <div class="rc-card-image"><img src="{{ product.image }}" alt="{{ product.chip_name }}" loading="lazy"></div>
                {% if product.performance_ps or product.performance_kw or product.performance_nm %}
                  <div class="rc-after-label">{{ text_performance_after }}</div>
                {% endif %}
              </div>

              <div class="rc-card-body">
                <div class="rc-performance-bar">
                  {% if product.performance_ps %}
                    <div class="rc-performance-item"><strong>+{{ product.performance_ps|number_format(0, '.', '') }}</strong><span>HP</span>{% if product.total_ps %}<small>{{ product.total_ps|number_format(0, '.', '') }} HP total</small>{% endif %}</div>
                  {% endif %}
                  {% if product.performance_kw %}
                    <div class="rc-performance-item"><strong>+{{ product.performance_kw|number_format(0, '.', '') }}</strong><span>kW</span>{% if product.total_kw %}<small>{{ product.total_kw|number_format(0, '.', '') }} kW total</small>{% endif %}</div>
                  {% endif %}
                  {% if product.performance_nm %}
                    <div class="rc-performance-item"><strong>+{{ product.performance_nm|number_format(0, '.', '') }}</strong><span>Nm</span>{% if product.total_nm %}<small>{{ product.total_nm|number_format(0, '.', '') }} Nm total</small>{% endif %}</div>
                  {% endif %}
                </div>

                {% if product.performance_fuel %}
                  <div class="rc-fuel-line"><i class="fa fa-leaf"></i><span>{{ text_fuel_saving }}</span><strong>{{ text_up_to }} {{ product.performance_fuel|number_format(0, '.', '') }}%</strong></div>
                {% endif %}

                <div class="rc-feature-links">
                  {% if product.info.maps %}
                    <button type="button" class="rc-feature-link" data-rc-modal="rc-info-{{ product.product_id }}">
                      <span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ product.info.maps }} {{ text_finetuning_mappings }}</strong></span><i class="fa fa-plus-circle"></i>
                    </button>
                  {% endif %}
                  {% if product.info.has_safety %}
                    <button type="button" class="rc-feature-link" data-rc-modal="rc-safety-{{ product.product_id }}">
                      <span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ text_safety_package }}</strong><small>{% if product.info.engine_warranty_years %}{{ product.info.engine_warranty_years }} {{ product.info.engine_warranty_years == 1 ? text_year : text_years }} {{ text_engine_warranty|lower }}{% if product.info.engine_warranty_eur %} ({{ text_up_to_eur }}{{ product.info.engine_warranty_eur|number_format(0, '.', ',') }}){% endif %}{% if product.info.product_warranty_years %} · {% endif %}{% endif %}{% if product.info.product_warranty_years %}{{ product.info.product_warranty_years }} {{ product.info.product_warranty_years == 1 ? text_year : text_years }} {{ text_product_warranty|lower }}{% endif %}</small></span><i class="fa fa-plus-circle"></i>
                    </button>
                  {% endif %}
                  {% if product.info.has_app %}
                    <button type="button" class="rc-feature-link" data-rc-modal="rc-app-modal">
                      <span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ text_app_control }}{% if product.has_app_option %} ({{ text_optional }}){% endif %}</strong><small>{{ text_feature_app_short }}</small></span><i class="fa fa-plus-circle"></i>
                    </button>
                  {% endif %}
                  {% if product.info.has_smart %}
                    <button type="button" class="rc-feature-link" data-rc-modal="rc-smart-modal">
                      <span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ text_smart_functions }}</strong><small>{{ text_feature_smart_short }}</small></span><i class="fa fa-plus-circle"></i>
                    </button>
                  {% endif %}
                  {% if product.info.has_reprogramming %}
                    <button type="button" class="rc-feature-link" data-rc-modal="rc-reprogramming-modal">
                      <span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ text_reprogramming }}</strong><small>{{ text_feature_reprogramming_short }}</small></span><i class="fa fa-plus-circle"></i>
                    </button>
                  {% endif %}
                </div>

                <div class="rc-main-price">
                  {% if product.special %}<span class="rc-old-price">{{ product.price }}</span><strong>{{ product.special }}</strong>{% elseif product.price %}<strong>{{ product.price }}</strong>{% endif %}
                </div>

                <button type="button" class="rc-select-product {% if product.featured %}rc-select-featured{% endif %}" data-product-id="{{ product.product_id }}" aria-expanded="false">
                  <span>{{ text_select }}</span><i class="fa fa-angle-down"></i>
                </button>

                <div class="rc-config-panel" hidden>
                  <form id="rc-form-{{ product.product_id }}" class="rc-product-form rc-tuning-form"
                        data-product-id="{{ product.product_id }}"
                        data-product-name="{{ product.chip_name|e }}"
                        data-base-price="{{ product.display_price_value }}"
                        data-output-total="{{ product.total_ps ? product.total_ps : '' }}"
                        data-output-kw="{{ product.total_kw ? product.total_kw : '' }}"
                        data-torque-total="{{ product.total_nm ? product.total_nm : '' }}"
                        data-selected="0">
                    <input type="hidden" name="product_id" value="{{ product.product_id }}">
                    <input type="hidden" name="quantity" value="1">

                    <div class="rc-config-title">{{ product.options ? text_add_extras : text_configuration }}</div>

                    {% if XX and product.info.engine_warranty_years and product.info.family in ['rs', 'gts5', 'gts5-black'] %}
                      <div class="rc-addon-wrap rc-included-wrap">
                        <div class="rc-addon-item rc-addon-included is-selected" aria-label="{{ text_engine_warranty_included }}">
                          <span class="rc-addon-check"><i class="fa fa-check"></i></span>
                          <span class="rc-addon-copy">
                            <strong>{{ text_engine_warranty_included }}</strong>
                            <small>{{ product.info.engine_warranty_years }} {{ product.info.engine_warranty_years == 1 ? text_year : text_years }} {{ text_engine_warranty|lower }}{% if product.info.engine_warranty_eur %} ({{ text_up_to_eur }}{{ product.info.engine_warranty_eur|number_format(0, '.', ',') }}){% endif %}</small>
                          </span>
                          <span class="rc-addon-price rc-included-label">{{ text_included }}</span>
                        </div>
                      </div>
                    {% endif %}

                    {% for option in product.options %}
                      {% if (option.kind == 'app' or option.kind == 'smart') and option.values|length == 1 %}
                        {% set ov = option.values[0] %}
                        <div class="rc-addon-wrap">
                          <select name="option[{{ option.product_option_id }}]" class="rc-native-addon" data-option-id="{{ option.product_option_id }}" aria-hidden="true" tabindex="-1">
                            <option value="" data-price="0" data-label=""></option>
                            <option value="{{ ov.product_option_value_id }}" data-price="{{ ov.price_value_gross }}" data-label="{{ ov.name|e }}">{{ ov.name }}</option>
                          </select>
                          <button type="button" class="rc-addon-item rc-addon-{{ option.kind }}" data-option-id="{{ option.product_option_id }}" data-value="{{ ov.product_option_value_id }}" aria-pressed="false">
                            <span class="rc-addon-check"><i class="fa fa-check"></i></span>
                            <span class="rc-addon-copy">
                              {% if option.kind == 'smart' %}
                                <strong>{{ text_smart_functions }}</strong>
                                <small>{{ text_smart_desc }}</small>
                                <ul class="rc-smart-list"><li>{{ text_smart_warmup }}</li><li>{{ text_smart_health }}</li><li>{{ text_smart_install }}</li></ul>
                              {% else %}
                                <strong>{{ text_app_control }}</strong>
                                <small>{{ text_app_desc }}</small>
                              {% endif %}
                            </span>
                            {% if ov.price %}<span class="rc-addon-price">{{ ov.price }}</span>{% endif %}
                          </button>
                        </div>
                      {% elseif option.type == 'select' %}
                        <div class="rc-standard-option {% if option.required %}required{% endif %}">
                          <label>{{ option.name }}</label>
                          <select name="option[{{ option.product_option_id }}]" class="form-control rc-price-option" {% if option.required %}data-required="1"{% endif %}>
                            <option value="" data-price="0" data-label="">{{ text_select_option }}</option>
                            {% for ov in option.values %}<option value="{{ ov.product_option_value_id }}" data-price="{{ ov.price_value_gross }}" data-label="{{ ov.name|e }}">{{ ov.name }}{% if ov.price %} ({{ ov.price }}){% endif %}</option>{% endfor %}
                          </select>
                        </div>
                      {% elseif option.type == 'radio' %}
                        <div class="rc-standard-option {% if option.required %}required{% endif %}"><label>{{ option.name }}</label>
                          <div class="rc-choice-grid">{% for ov in option.values %}<label class="rc-choice"><input class="rc-price-option" type="radio" name="option[{{ option.product_option_id }}]" value="{{ ov.product_option_value_id }}" data-price="{{ ov.price_value_gross }}" data-label="{{ ov.name|e }}" {% if option.required %}data-required="1"{% endif %}><span>{{ ov.name }}{% if ov.price %}<em>{{ ov.price }}</em>{% endif %}</span></label>{% endfor %}</div>
                        </div>
                      {% elseif option.type == 'checkbox' %}
                        <div class="rc-standard-option {% if option.required %}required{% endif %}"><label>{{ option.name }}</label>
                          <div class="rc-choice-grid">{% for ov in option.values %}<label class="rc-choice"><input class="rc-price-option" type="checkbox" name="option[{{ option.product_option_id }}][]" value="{{ ov.product_option_value_id }}" data-price="{{ ov.price_value_gross }}" data-label="{{ ov.name|e }}"><span>{{ ov.name }}{% if ov.price %}<em>{{ ov.price }}</em>{% endif %}</span></label>{% endfor %}</div>
                        </div>
                      {% endif %}
                    {% endfor %}

                    <div class="rc-config-total"><span>{{ text_total_price }}</span><strong class="rc-live-total">{% if product.special %}{{ product.special }}{% else %}{{ product.price }}{% endif %}</strong></div>
                    <div class="rc-form-feedback" aria-live="polite"></div>
                  </form>
                </div>

                <div class="rc-card-more-row">
                  <button type="button" class="rc-learn-link rc-modal-trigger" data-rc-modal="rc-info-{{ product.product_id }}">{{ text_learn_more }} <i class="fa fa-angle-right"></i></button>
                  <a class="rc-product-page-link" href="{{ product.href }}">{{ text_view_product }}</a>
                </div>
              </div>
            </article>
          {% endfor %}
        </div>

        <div class="rc-compare-control">
          <button type="button" class="rc-compare-toggle" id="rcCompareToggle" aria-expanded="false">
            <svg class="rc-compare-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><line x1="18" y1="20" x2="18" y2="10"></line><line x1="12" y1="20" x2="12" y2="4"></line><line x1="6" y1="20" x2="6" y2="14"></line></svg>
            <span>{{ text_compare_products }}</span><b class="rc-compare-arrow">▼</b>
          </button>
        </div>

        <div class="rc-compare-table-wrap" id="rcCompareTable" hidden>
          <div class="rc-compare-scroll-hint">← {{ text_compare_scroll }} →</div>
          <div class="rc-table-scroll">
            <table class="rc-comparison-table">
              <thead><tr><th>{{ text_compare_feature }}</th>{% for product in tuning_products %}<th class="{% if product.featured %}is-featured{% endif %}">{{ product.chip_name }}{% if product.featured %} ★{% endif %}</th>{% endfor %}</tr></thead>
              <tbody>
                <tr><th>{{ text_summary_price }}</th>{% for product in tuning_products %}<td>{% if product.special %}<span class="rc-table-old">{{ product.price }}</span>{{ product.special }}{% else %}{{ product.price }}{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_power_gain }} (HP)</th>{% for product in tuning_products %}<td>{% if product.performance_ps %}+{{ product.performance_ps|number_format(0, '.', '') }} HP{% else %}—{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_power_gain }} (kW)</th>{% for product in tuning_products %}<td>{% if product.performance_kw %}+{{ product.performance_kw|number_format(0, '.', '') }} kW{% else %}—{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_torque_gain }}</th>{% for product in tuning_products %}<td>{% if product.performance_nm %}+{{ product.performance_nm|number_format(0, '.', '') }} Nm{% else %}—{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_fuel_saving }}</th>{% for product in tuning_products %}<td>{% if product.performance_fuel %}{{ text_up_to }} {{ product.performance_fuel|number_format(0, '.', '') }}%{% else %}—{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_app_control }}</th>{% for product in tuning_products %}<td>{{ product.has_app_option ? text_yes : text_no }}</td>{% endfor %}</tr>
                <tr><th>{{ text_smart_functions }}</th>{% for product in tuning_products %}<td>{{ product.has_smart_option ? text_yes : text_no }}</td>{% endfor %}</tr>
                <tr><th>{{ text_finetuning_mappings }}</th>{% for product in tuning_products %}<td>{% if product.info.maps %}{{ product.info.maps }}{% else %}—{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_product_warranty }}</th>{% for product in tuning_products %}<td>{% if product.info.product_warranty_years %}{{ product.info.product_warranty_years }} {{ product.info.product_warranty_years == 1 ? text_year : text_years }}{% else %}—{% endif %}</td>{% endfor %}</tr>
                <tr><th>{{ text_engine_warranty }}</th>{% for product in tuning_products %}<td>{% if product.info.engine_warranty_years %}{{ product.info.engine_warranty_years }} {{ product.info.engine_warranty_years == 1 ? text_year : text_years }} / {{ text_up_to_eur }}{{ product.info.engine_warranty_eur|number_format(0, '.', ',') }}{% else %}—{% endif %}</td>{% endfor %}</tr>
              </tbody>
            </table>
          </div>
        </div>
      </section>
      {% endif %}

      {% if response_products %}
      <section class="rc-shop-section rc-xlr-section">
        <div class="rc-shop-heading rc-xlr-heading-copy">
          <span class="rc-shop-kicker">RACECHIP XLR</span>
          <h2>{{ text_xlr_heading }}</h2>
          <p>{{ vehicle_title }}</p>
        </div>

        {% for product in response_products %}
          <article class="rc-xlr-product" id="rc-card-{{ product.product_id }}" data-product-card="{{ product.product_id }}">
            <div class="rc-xlr-visual">
              <div class="rc-xlr-image"><img class="rc-xlr-primary-image" src="{{ product.image }}" data-default-src="{{ product.image }}" data-controller-src="{{ product.controller_image }}" alt="{{ product.chip_name }}" loading="lazy"></div>
              <div class="rc-xlr-complement"><i class="fa fa-check"></i> {{ text_xlr_heading }}</div>
            </div>
            <div class="rc-xlr-content">
              <div class="rc-product-mark">RACECHIP</div>
              <h3>{{ product.chip_name }}</h3>
              <p class="rc-xlr-intro">{{ product.subtitle }}</p>
              <div class="rc-feature-links rc-xlr-feature-links">
                <button type="button" class="rc-feature-link" data-rc-modal="rc-info-{{ product.product_id }}"><span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ product.info.driving_levels ? product.info.driving_levels : 7 }} {{ text_driving_levels }}</strong><small>{{ text_xlr_feature_1 }}</small></span><i class="fa fa-plus-circle"></i></button>
                <button type="button" class="rc-feature-link" data-rc-modal="rc-app-modal"><span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ text_app_control }}</strong><small>{{ text_feature_app_short }}</small></span><i class="fa fa-plus-circle"></i></button>
                {% if product.info.has_controller %}<button type="button" class="rc-feature-link rc-controller-feature-link" data-rc-modal="rc-controller-modal"><span class="rc-feature-dot"></span><span class="rc-feature-copy"><strong>{{ text_smart_controller }} ({{ text_optional }})</strong><small><b>{{ text_security_functions }}:</b> {{ text_security_functions_short }}</small></span><i class="fa fa-plus-circle"></i></button>{% endif %}
              </div>

              <div class="rc-main-price rc-xlr-price">{% if product.special %}<span class="rc-old-price">{{ product.price }}</span><strong>{{ product.special }}</strong>{% elseif product.price %}<strong>{{ product.price }}</strong>{% endif %}</div>

              <button type="button" class="rc-select-xlr" data-product-id="{{ product.product_id }}" aria-expanded="false"><span>{{ text_select }}</span><i class="fa fa-angle-down"></i></button>

              <div class="rc-config-panel rc-xlr-config" hidden>
                <form id="rc-form-{{ product.product_id }}" class="rc-product-form rc-xlr-form"
                      data-product-id="{{ product.product_id }}"
                      data-product-name="{{ product.chip_name|e }}"
                      data-base-price="{{ product.display_price_value }}"
                      data-selected="0">
                  <input type="hidden" name="product_id" value="{{ product.product_id }}">
                  <input type="hidden" name="quantity" value="1">

                  {% for option in product.options %}
                    {% if option.kind == 'controller' and option.values|length == 1 %}
                      {% set ov = option.values[0] %}
                      <div class="rc-addon-wrap rc-xlr-addon-wrap">
                        <select name="option[{{ option.product_option_id }}]" class="rc-native-addon" data-option-id="{{ option.product_option_id }}" data-kind="controller" aria-hidden="true" tabindex="-1">
                          <option value="" data-price="0" data-label=""></option>
                          <option value="{{ ov.product_option_value_id }}" data-price="{{ ov.price_value_gross }}" data-label="{{ ov.name|e }}">{{ ov.name }}</option>
                        </select>
                        <button type="button" class="rc-addon-item rc-addon-controller" data-option-id="{{ option.product_option_id }}" data-value="{{ ov.product_option_value_id }}" aria-pressed="false">
                          <span class="rc-addon-check"><i class="fa fa-check"></i></span>
                          <span class="rc-addon-copy"><strong>{{ text_smart_controller }}</strong><small>{{ ov.name }}</small><span class="rc-addon-meta"><b>{{ text_security_functions }}:</b> {{ text_security_functions_short }}</span></span>
                          {% if ov.price %}<span class="rc-addon-price">{{ ov.price }}</span>{% endif %}
                        </button>
                      </div>
                    {% elseif option.type == 'select' %}
                      <div class="rc-standard-option"><label>{{ option.name }}</label><select name="option[{{ option.product_option_id }}]" class="form-control rc-price-option" {% if option.required %}data-required="1"{% endif %}><option value="" data-price="0" data-label="">{{ text_select_option }}</option>{% for ov in option.values %}<option value="{{ ov.product_option_value_id }}" data-price="{{ ov.price_value_gross }}" data-label="{{ ov.name|e }}">{{ ov.name }}{% if ov.price %} ({{ ov.price }}){% endif %}</option>{% endfor %}</select></div>
                    {% endif %}
                  {% endfor %}

                  <div class="rc-config-total"><span>{{ text_total_price }}</span><strong class="rc-live-total">{% if product.special %}{{ product.special }}{% else %}{{ product.price }}{% endif %}</strong></div>
                  <div class="rc-form-feedback" aria-live="polite"></div>
                </form>
              </div>
              <div class="rc-card-more-row rc-xlr-more-row">
                <button type="button" class="rc-learn-link rc-modal-trigger" data-rc-modal="rc-info-{{ product.product_id }}">{{ text_learn_more }} <i class="fa fa-angle-right"></i></button>
                <a class="rc-product-page-link" href="{{ product.href }}">{{ text_view_product }}</a>
              </div>
            </div>
          </article>
        {% endfor %}
      </section>
      {% endif %}


      {# v1.5 RaceChip-style information popups. All artwork is served locally. #}
      {% for product in tuning_products %}
        <div class="rc-modal-overlay" id="rc-info-{{ product.product_id }}" hidden aria-hidden="true">
          <div class="rc-info-modal" role="dialog" aria-modal="true" aria-labelledby="rc-info-title-{{ product.product_id }}">
            <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
            <div class="rc-modal-header">
              <div class="rc-modal-badge"><i class="fa fa-bolt"></i></div>
              <div><div class="rc-modal-tag">{{ product.chip_name }}</div><h3 id="rc-info-title-{{ product.product_id }}">{{ product.info.overview_title }}</h3></div>
            </div>
            <div class="rc-modal-body">
              <div class="rc-modal-product-grid">
                {% if product.info.modal_image %}<div class="rc-modal-product-image"><img src="{{ product.info.modal_image }}" alt="{{ product.chip_name }}"></div>{% endif %}
                <div class="rc-modal-product-copy">
                  <p>{{ product.info.overview_description }}</p>
                  <div class="rc-modal-keyfacts">
                    {% if product.info.maps %}<span><i class="fa fa-sliders"></i><strong>{{ product.info.maps }}</strong> {{ text_finetuning_mappings }}</span>{% endif %}
                    {% if product.info.product_warranty_years %}<span><i class="fa fa-shield"></i><strong>{{ product.info.product_warranty_years }}</strong> {{ product.info.product_warranty_years == 1 ? text_year : text_years }} {{ text_product_warranty|lower }}</span>{% endif %}
                    {% if product.info.has_app %}<span><i class="fa fa-mobile"></i>{{ text_app_control }}</span>{% endif %}
                    {% if product.info.has_smart %}<span><i class="fa fa-cogs"></i>{{ text_smart_functions }}</span>{% endif %}
                  </div>
                </div>
              </div>

              <div class="rc-modal-delivery">
                <div class="rc-modal-section-title">{{ text_scope_delivery }}</div>
                <div class="rc-modal-delivery-grid {% if not product.info.delivery_image %}no-image{% endif %}">
                  {% if product.info.delivery_image %}<div><img src="{{ product.info.delivery_image }}" alt="{{ text_scope_delivery }} {{ product.chip_name }}"></div>{% endif %}
                  <ul>{% for delivery_item in product.info.delivery_items %}<li><i class="fa fa-check"></i>{{ delivery_item }}</li>{% endfor %}</ul>
                </div>
              </div>

              <div class="rc-modal-actions">
                <button type="button" class="rc-modal-secondary rc-modal-close-action">{{ text_close }}</button>
                <a href="{{ product.href }}" class="rc-modal-primary">{{ text_view_product }} <i class="fa fa-angle-right"></i></a>
              </div>
            </div>
          </div>
        </div>

        {% if product.info.has_safety %}
        <div class="rc-modal-overlay" id="rc-safety-{{ product.product_id }}" hidden aria-hidden="true">
          <div class="rc-info-modal rc-safety-modal" role="dialog" aria-modal="true" aria-labelledby="rc-safety-title-{{ product.product_id }}">
            <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
            <div class="rc-modal-header">
              <div class="rc-modal-badge"><i class="fa fa-shield"></i></div>
              <div><div class="rc-modal-tag">{{ text_safety_package }}</div><h3 id="rc-safety-title-{{ product.product_id }}">{{ product.chip_name }}</h3></div>
            </div>
            <div class="rc-modal-body">
              <div class="rc-warranty-grid">
                {% if product.info.engine_warranty_years %}
                  <div class="rc-warranty-card rc-warranty-engine">
                    <i class="fa fa-cog"></i><h4>{{ text_engine_warranty }}</h4>
                    <strong>{{ product.info.engine_warranty_years }} {{ product.info.engine_warranty_years == 1 ? text_year : text_years }}</strong>
                    {% if product.info.engine_warranty_eur %}<span>{{ text_up_to_eur }}{{ product.info.engine_warranty_eur|number_format(0, '.', ',') }}</span>{% endif %}
                    <ul>
                      <li>{{ text_major_engine_components }}</li>
                      {% if product.info.max_mileage %}<li>{{ text_max_mileage }}: {{ product.info.max_mileage|number_format(0, '.', '.') }} km</li>{% endif %}
                    </ul>
                  </div>
                {% endif %}
                {% if product.info.product_warranty_years %}
                  <div class="rc-warranty-card">
                    <i class="fa fa-check-circle"></i><h4>{{ text_product_warranty }}</h4>
                    <strong>{{ product.info.product_warranty_years }} {{ product.info.product_warranty_years == 1 ? text_year : text_years }}</strong>
                    <span>{{ product.chip_name }}</span>
                  </div>
                {% endif %}
              </div>
              <p class="rc-warranty-note"><i class="fa fa-info-circle"></i>{{ text_warranty_note }}</p>
              <div class="rc-modal-actions"><button type="button" class="rc-modal-primary rc-modal-close-action">{{ text_close }}</button></div>
            </div>
          </div>
        </div>
        {% endif %}
      {% endfor %}

      {% for product in response_products %}
        <div class="rc-modal-overlay" id="rc-info-{{ product.product_id }}" hidden aria-hidden="true">
          <div class="rc-info-modal" role="dialog" aria-modal="true" aria-labelledby="rc-xlr-info-title-{{ product.product_id }}">
            <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
            <div class="rc-modal-header">
              <div class="rc-modal-badge"><i class="fa fa-tachometer"></i></div>
              <div><div class="rc-modal-tag">{{ product.chip_name }}</div><h3 id="rc-xlr-info-title-{{ product.product_id }}">{{ product.info.overview_title }}</h3></div>
            </div>
            <div class="rc-modal-body">
              <div class="rc-modal-product-grid">
                {% if product.info.modal_image %}<div class="rc-modal-product-image"><img src="{{ product.info.modal_image }}" alt="{{ product.chip_name }}"></div>{% endif %}
                <div class="rc-modal-product-copy">
                  <p>{{ product.info.overview_description }}</p>
                  <div class="rc-modal-keyfacts">
                    <span><i class="fa fa-sliders"></i><strong>{{ product.info.driving_levels ? product.info.driving_levels : 7 }}</strong> {{ text_driving_levels }}</span>
                    <span><i class="fa fa-mobile"></i>{{ text_app_control }}</span>
                    {% if product.info.has_controller %}<span><i class="fa fa-gamepad"></i>{{ text_smart_controller }}</span>{% endif %}
                  </div>
                </div>
              </div>
              <div class="rc-modal-delivery">
                <div class="rc-modal-section-title">{{ text_in_the_box }}</div>
                <div class="rc-modal-delivery-grid no-image"><ul>{% for delivery_item in product.info.delivery_items %}<li><i class="fa fa-check"></i>{{ delivery_item }}</li>{% endfor %}</ul></div>
              </div>
              <div class="rc-modal-actions"><button type="button" class="rc-modal-secondary rc-modal-close-action">{{ text_close }}</button><a href="{{ product.href }}" class="rc-modal-primary">{{ text_view_product }} <i class="fa fa-angle-right"></i></a></div>
            </div>
          </div>
        </div>
      {% endfor %}

      {% if has_any_app %}
      <div class="rc-modal-overlay" id="rc-app-modal" hidden aria-hidden="true">
        <div class="rc-info-modal" role="dialog" aria-modal="true" aria-labelledby="rc-app-modal-title">
          <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
          <div class="rc-modal-header"><div class="rc-modal-badge"><i class="fa fa-mobile"></i></div><div><div class="rc-modal-tag">{{ text_app_control }}</div><h3 id="rc-app-modal-title">{{ text_app_modal_title }}</h3></div></div>
          <div class="rc-modal-body">
            <p class="rc-modal-intro">{{ text_app_modal_intro }}</p>
            <div class="rc-modal-feature-grid">
              <div class="rc-modal-feature"><i class="fa fa-tachometer"></i><div><strong>{{ text_app_feature_1 }}</strong><p>{{ text_app_feature_1_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-sliders"></i><div><strong>{{ text_app_feature_2 }}</strong><p>{{ text_app_feature_2_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-refresh"></i><div><strong>{{ text_app_feature_3 }}</strong><p>{{ text_app_feature_3_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-link"></i><div><strong>{{ text_app_feature_4 }}</strong><p>{{ text_app_feature_4_desc }}</p></div></div>
            </div>
            <div class="rc-modal-actions"><button type="button" class="rc-modal-primary rc-modal-close-action">{{ text_close }}</button></div>
          </div>
        </div>
      </div>
      {% endif %}

      {% if has_any_smart %}
      <div class="rc-modal-overlay" id="rc-smart-modal" hidden aria-hidden="true">
        <div class="rc-info-modal" role="dialog" aria-modal="true" aria-labelledby="rc-smart-modal-title">
          <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
          <div class="rc-modal-header"><div class="rc-modal-badge"><i class="fa fa-cogs"></i></div><div><div class="rc-modal-tag">{{ text_smart_functions }}</div><h3 id="rc-smart-modal-title">{{ text_smart_modal_title }}</h3></div></div>
          <div class="rc-modal-body">
            <p class="rc-modal-intro">{{ text_smart_modal_intro }}</p>
            <div class="rc-modal-feature-grid">
              <div class="rc-modal-feature"><i class="fa fa-thermometer-half"></i><div><strong>{{ text_smart_feature_1 }}</strong><p>{{ text_smart_feature_1_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-heartbeat"></i><div><strong>{{ text_smart_feature_2 }}</strong><p>{{ text_smart_feature_2_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-check-square-o"></i><div><strong>{{ text_smart_feature_3 }}</strong><p>{{ text_smart_feature_3_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-wrench"></i><div><strong>{{ text_smart_feature_4 }}</strong><p>{{ text_smart_feature_4_desc }}</p></div></div>
            </div>
            <div class="rc-modal-actions"><button type="button" class="rc-modal-primary rc-modal-close-action">{{ text_close }}</button></div>
          </div>
        </div>
      </div>
      {% endif %}

      {% if has_xlr_controller %}
      <div class="rc-modal-overlay" id="rc-controller-modal" hidden aria-hidden="true">
        <div class="rc-info-modal" role="dialog" aria-modal="true" aria-labelledby="rc-controller-modal-title">
          <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
          <div class="rc-modal-header"><div class="rc-modal-badge"><i class="fa fa-gamepad"></i></div><div><div class="rc-modal-tag">{{ text_smart_controller }}</div><h3 id="rc-controller-modal-title">{{ text_controller_modal_title }}</h3></div></div>
          <div class="rc-modal-body">
            <p class="rc-modal-intro">{{ text_controller_modal_intro }}</p>
            <div class="rc-modal-feature-grid">
              <div class="rc-modal-feature"><i class="fa fa-lock"></i><div><strong>{{ text_controller_feature_1 }}</strong><p>{{ text_controller_feature_1_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-key"></i><div><strong>{{ text_controller_feature_2 }}</strong><p>{{ text_controller_feature_2_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-adjust"></i><div><strong>{{ text_controller_feature_3 }}</strong><p>{{ text_controller_feature_3_desc }}</p></div></div>
              <div class="rc-modal-feature"><i class="fa fa-random"></i><div><strong>{{ text_controller_feature_4 }}</strong><p>{{ text_controller_feature_4_desc }}</p></div></div>
            </div>
            <div class="rc-modal-actions"><button type="button" class="rc-modal-primary rc-modal-close-action">{{ text_close }}</button></div>
          </div>
        </div>
      </div>
      {% endif %}


      {% if has_reprogramming %}
      <div class="rc-modal-overlay" id="rc-reprogramming-modal" hidden aria-hidden="true">
        <div class="rc-info-modal" role="dialog" aria-modal="true" aria-labelledby="rc-reprogramming-modal-title">
          <button type="button" class="rc-modal-close" aria-label="{{ text_close }}"><i class="fa fa-times"></i></button>
          <div class="rc-modal-header"><div class="rc-modal-badge"><i class="fa fa-car"></i></div><div><div class="rc-modal-tag">{{ text_reprogramming }}</div><h3 id="rc-reprogramming-modal-title">{{ text_reprogramming_modal_title }}</h3></div></div>
          <div class="rc-modal-body">
            <p class="rc-modal-intro">{{ text_reprogramming_modal_intro }}</p>
            <div class="rc-modal-feature-grid rc-reprogramming-grid">
              <div class="rc-modal-feature"><i class="fa fa-check"></i><div><strong>{{ text_reprogramming_feature_1 }}</strong></div></div>
              <div class="rc-modal-feature"><i class="fa fa-refresh"></i><div><strong>{{ text_reprogramming_feature_2 }}</strong></div></div>
              <div class="rc-modal-feature"><i class="fa fa-exchange"></i><div><strong>{{ text_reprogramming_feature_3 }}</strong></div></div>
            </div>
            <p class="rc-warranty-note"><i class="fa fa-info-circle"></i>{{ text_reprogramming_note }}</p>
            <div class="rc-modal-actions"><button type="button" class="rc-modal-primary rc-modal-close-action">{{ text_close }}</button></div>
          </div>
        </div>
      </div>
      {% endif %}

      {% if tuning_products or response_products %}
      <section class="rc-order-summary" id="rcOrderSummary" aria-label="{{ text_summary_title }}">
        <div class="rc-summary-expand" id="rcSummaryDetails" hidden>
          <div class="rc-summary-inner">
            <div class="rc-summary-table">
              <div class="rc-summary-row rc-summary-head">
                <div>{{ text_summary_vehicle_product }}</div><div>{{ text_summary_output }}</div><div>{{ text_summary_torque }}</div><div>{{ text_summary_price }}</div>
              </div>
              <div class="rc-summary-row rc-summary-base">
                <div class="rc-summary-col-product">{{ vehicle.make_name }} {{ vehicle.model_name }} {{ vehicle.motor_name }}</div>
                <div class="rc-summary-col-output">{% if vehicle.default_ps %}{{ vehicle.default_ps|number_format(0, '.', '') }} HP{% if vehicle.default_kw %} ({{ vehicle.default_kw|number_format(0, '.', '') }} kW){% endif %}{% else %}—{% endif %}</div>
                <div class="rc-summary-col-torque">{% if vehicle.default_nm %}{{ vehicle.default_nm|number_format(0, '.', '') }} Nm{% else %}—{% endif %}</div>
                <div class="rc-summary-col-price">—</div>
              </div>
              <div id="rcSummarySelections"></div>
              <div class="rc-summary-row rc-summary-total">
                <div class="rc-summary-col-product"><strong>{{ vehicle.make_name }} {{ vehicle.model_name }}, {{ text_summary_optimized }}</strong></div>
                <div class="rc-summary-col-output" id="rcSummaryOutput">—</div>
                <div class="rc-summary-col-torque" id="rcSummaryTorque">—</div>
                <div class="rc-summary-col-price" id="rcSummaryTotal">—</div>
              </div>
            </div>
            <div class="rc-summary-feedback" id="rcSummaryFeedback" aria-live="polite"></div>
          </div>
        </div>

        <div class="rc-summary-dockbar" id="rcSummaryDockBar">
          <div class="rc-summary-dock-inner">
            <button type="button" class="rc-summary-toggle" id="rcSummaryToggle" aria-expanded="false" aria-controls="rcSummaryDetails">
              <span class="rc-summary-toggle-icon"><i class="fa fa-list-ul" aria-hidden="true"></i></span>
              <span class="rc-summary-toggle-copy">
                <strong>{{ text_summary_title }}</strong>
                <small id="rcSummaryToggleHint" class="rc-summary-toggle-hint">{{ text_summary_show }}</small>
              </span>
              <span class="rc-summary-total-wrap"><small>{{ text_total_price }}</small><span class="rc-summary-dock-total" id="rcSummaryDockTotal">—</span></span>
              <span class="rc-summary-chevron"><i class="fa fa-chevron-up" aria-hidden="true"></i></span>
            </button>
            <button type="button" id="rcAddSelection" class="rc-final-cart-button" data-mode="add" disabled>
              <i class="fa fa-shopping-cart"></i><span>{{ text_add_selection_to_cart }}</span>
            </button>
          </div>
        </div>
      </section>
      {% endif %}

      {% if not tuning_products and not response_products %}<div class="alert alert-info">{{ text_no_products }}</div>{% endif %}

      {{ content_bottom }}
    </div>
    {{ column_right }}
  </div>
</div>

{% if schema_json %}<script type="application/ld+json">{{ schema_json|raw }}</script>{% endif %}
{{ promo_popup }}

<style>
#racechip-results-page{--rc-red:#e30613;--rc-orange:#f06422;--rc-dark:#141517;--rc-ink:#1d1f22;--rc-muted:#777c82;--rc-border:#e6e8eb;--rc-soft:#f5f6f7;padding-top:18px;padding-bottom:70px}
.rc-breadcrumb{margin-bottom:18px}.rc-car-hero{position:relative;display:grid;grid-template-columns:1fr;overflow:hidden;background:linear-gradient(125deg,#101113 0%,#1b1c20 70%,#25272b 100%);color:#fff;border-radius:18px;margin-bottom:34px;box-shadow:0 20px 55px rgba(0,0,0,.14);min-height:330px}.rc-car-hero-with-image{grid-template-columns:minmax(0,1.04fr) minmax(360px,.96fr)}.rc-car-hero-copy{padding:40px;z-index:2;display:flex;flex-direction:column;justify-content:center}.rc-official{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;color:#c5c7ca;margin-bottom:12px}.rc-official span{width:8px;height:8px;border-radius:50%;background:var(--rc-red);box-shadow:0 0 0 5px rgba(227,6,19,.14)}.rc-car-hero h1{color:#fff;margin:0;font-size:34px;line-height:1.14;font-weight:850;letter-spacing:-.55px}.rc-car-engine{color:#b9bcc1;font-size:15px;margin:12px 0 25px}.rc-baseline{display:flex;gap:9px;flex-wrap:wrap}.rc-baseline>div{min-width:104px;background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.09);border-radius:10px;padding:9px 12px}.rc-baseline small{font-size:9px;color:#9da1a7}.rc-baseline strong{display:block;font-size:20px;line-height:1.05;margin-top:2px}.rc-baseline span{display:block;font-size:9px;color:#9da1a7;margin-top:3px}.rc-car-hero-image{position:relative;min-height:330px}.rc-car-hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#101113 0%,rgba(16,17,19,.2) 28%,transparent 58%)}.rc-car-hero-image img{width:100%;height:100%;object-fit:cover}.rc-vehicle-description{background:#fff;border:1px solid var(--rc-border);border-radius:14px;padding:28px 30px;margin-bottom:42px;line-height:1.72;color:#3d4146;box-shadow:0 7px 24px rgba(0,0,0,.035)}
.rc-vehicle-description-content{position:relative}
.rc-vehicle-description.is-collapsible .rc-vehicle-description-content{max-height:150px;overflow:hidden;transition:max-height .35s ease}
.rc-vehicle-description.is-collapsible:not(.is-expanded) .rc-vehicle-description-content:after{content:"";position:absolute;left:0;right:0;bottom:0;height:58px;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 82%)}
.rc-vehicle-description-toggle{display:flex;align-items:center;justify-content:center;gap:7px;margin:14px auto 0;padding:9px 15px;border:1px solid #d6d8db;border-radius:3px;background:#fff;color:#3d4146;font-size:11px;font-weight:700;cursor:pointer;transition:.18s ease}
.rc-vehicle-description-toggle:hover,.rc-vehicle-description-toggle:focus{border-color:var(--rc-orange);color:var(--rc-orange);outline:0}
.rc-vehicle-description-toggle i{transition:transform .22s ease}
.rc-vehicle-description.is-expanded .rc-vehicle-description-toggle i{transform:rotate(180deg)}
.rc-shop-section{margin:42px 0 56px}.rc-shop-heading{text-align:center;max-width:760px;margin:0 auto 24px}.rc-shop-kicker{display:block;color:var(--rc-red);font-size:10px;line-height:1;font-weight:900;letter-spacing:1.7px;margin-bottom:9px}.rc-shop-heading h2{font-size:29px;color:var(--rc-ink);font-weight:850;letter-spacing:-.4px;margin:0 0 8px}.rc-shop-heading p{margin:0;color:#777;font-size:13px}.rc-product-tabs{display:flex;overflow-x:auto;gap:8px;margin:0 -5px 18px;padding:2px 5px 8px}.rc-product-tab{min-width:118px;flex:1;text-align:center;border:1px solid var(--rc-border);background:#fff;border-radius:11px;padding:8px;color:var(--rc-ink)}.rc-product-tab img{height:58px;max-width:100%;object-fit:contain;display:block;margin:auto}.rc-product-tab strong{display:block;font-size:11px}.rc-product-tab span{font-size:10px;color:var(--rc-red);font-weight:800}
.rc-compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:16px;max-width:1180px;margin:0 auto}.rc-compare-card{position:relative;background:#fff;border:1px solid #dfe2e5;border-radius:13px;overflow:hidden;box-shadow:0 6px 22px rgba(0,0,0,.055);transition:.22s ease}.rc-compare-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(0,0,0,.09)}.rc-compare-card.is-featured{border:2px solid var(--rc-orange);box-shadow:0 12px 32px rgba(240,100,34,.13);margin-top:-8px}.rc-compare-card.is-selected{box-shadow:0 0 0 3px rgba(240,100,34,.18),0 18px 42px rgba(0,0,0,.10)}.rc-favorite-ribbon{background:var(--rc-orange);color:#fff;text-align:center;font-size:9px;font-weight:900;letter-spacing:1.15px;padding:7px 8px}.rc-card-head{text-align:center;padding:20px 20px 8px}.rc-product-mark{font-size:9px;letter-spacing:2.1px;color:#6d7176;font-weight:900}.rc-card-head h3,.rc-xlr-content h3{font-size:27px;line-height:1;margin:6px 0 7px;font-weight:900;letter-spacing:-.7px;color:var(--rc-ink)}.rc-card-subtitle{font-size:12px;color:#767b81;min-height:18px}.rc-card-image{height:185px;display:flex;align-items:center;justify-content:center;margin:8px 0 0}.rc-card-image img{max-width:100%;max-height:180px;object-fit:contain}.rc-after-label{font-size:9px;color:#999;text-transform:uppercase;letter-spacing:.6px;margin-top:3px}.rc-card-body{padding:0 18px 18px}.rc-performance-bar{display:grid;grid-template-columns:repeat(3,1fr);background:#222326;color:#fff;border-radius:7px;overflow:hidden;margin:7px 0 12px}.rc-performance-item{text-align:center;padding:11px 4px 9px;border-right:1px solid rgba(255,255,255,.12)}.rc-performance-item:last-child{border-right:0}.rc-performance-item strong{font-size:21px;line-height:1;display:inline-block}.rc-performance-item>span{display:inline-block;font-size:9px;color:#bbb;margin-left:2px;font-weight:700}.rc-performance-item small{display:block;color:#8e9297;font-size:8px;margin-top:4px}.rc-fuel-line{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;background:#f5f7f5;border-radius:7px;padding:9px 10px;color:#5b625c;font-size:10px}.rc-fuel-line i{color:#5b935f}.rc-fuel-line strong{font-size:11px;color:#344737}.rc-main-price{text-align:center;padding:15px 0 10px}.rc-main-price strong{font-size:25px;color:#17191b;letter-spacing:-.4px}.rc-old-price{display:block;color:#989b9f;text-decoration:line-through;font-size:11px;line-height:1.2}
.rc-select-product,.rc-select-xlr{width:100%;border:0;border-radius:5px;background:#25272a;color:#fff;font-weight:800;font-size:12px;padding:12px 14px;display:flex;align-items:center;justify-content:center;gap:8px;transition:.18s}.rc-select-product:hover,.rc-select-product:focus,.rc-select-xlr:hover,.rc-select-xlr:focus{background:var(--rc-red);color:#fff}.rc-select-product.rc-select-featured{background:var(--rc-orange)}.rc-select-product.is-selected,.rc-select-xlr.is-selected{background:#2e7d32}.rc-select-product i,.rc-select-xlr i{margin-left:auto}.rc-config-panel{border-top:1px solid var(--rc-border);margin-top:14px;padding-top:13px}.rc-config-title{text-align:left;font-size:10px;font-weight:900;color:#4a4d51;letter-spacing:.7px;text-transform:uppercase;margin-bottom:9px}.rc-native-addon{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none}.rc-addon-wrap{margin:8px 0}.rc-addon-item{width:100%;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:9px;text-align:left;border:1px solid #dfe2e5;background:#fff;border-radius:7px;padding:10px;cursor:pointer;transition:.16s}.rc-addon-item:hover{border-color:#b7bbc0;background:#fafafa}.rc-addon-item.is-selected{border-color:var(--rc-orange);background:#fff8f4;box-shadow:0 0 0 1px var(--rc-orange)}.rc-addon-check{width:22px;height:22px;border-radius:5px;border:1px solid #c9cdd1;color:transparent;display:flex;align-items:center;justify-content:center;background:#fff}.rc-addon-item.is-selected .rc-addon-check{background:var(--rc-orange);border-color:var(--rc-orange);color:#fff}.rc-addon-copy strong{display:block;font-size:11px;color:#24272a}.rc-addon-copy small{display:block;font-size:9px;color:#7b8085;line-height:1.3;margin-top:2px}.rc-addon-price{font-size:11px;font-weight:850;color:#222;white-space:nowrap}.rc-smart-list{padding-left:15px;margin:5px 0 0;color:#777;font-size:9px}.rc-standard-option{margin:10px 0;text-align:left}.rc-standard-option>label{display:block;font-size:10px;font-weight:800;margin-bottom:5px}.rc-standard-option select.form-control{height:39px;border:1px solid #dfe2e5;border-radius:6px;box-shadow:none;font-size:11px}.rc-choice-grid{display:grid;gap:5px}.rc-choice{display:flex;align-items:center;gap:7px;border:1px solid #e2e4e6;border-radius:6px;padding:8px;font-size:10px;cursor:pointer}.rc-choice em{font-style:normal;font-weight:800;margin-left:4px}.rc-config-total{display:flex;justify-content:space-between;align-items:end;border-top:1px solid var(--rc-border);margin-top:12px;padding:12px 0 4px}.rc-config-total span{font-size:10px;color:#777;text-transform:uppercase;font-weight:800}.rc-config-total strong{font-size:19px;color:#17191b}.rc-form-feedback{min-height:16px;color:#c62828;font-size:10px}.rc-learn-link{display:flex;justify-content:center;align-items:center;gap:5px;color:#666;font-size:10px;font-weight:700;margin-top:10px}.rc-learn-link:hover{color:var(--rc-red)}
.rc-compare-control{text-align:center;margin:24px 0 12px}.rc-compare-toggle{border:0;background:transparent;color:#333;font-weight:800;font-size:12px;padding:10px 14px}.rc-compare-toggle i{margin-right:8px;color:var(--rc-red)}.rc-compare-toggle b{font-size:9px;margin-left:8px}.rc-compare-table-wrap{max-width:1180px;margin:0 auto;background:#fff;border:1px solid var(--rc-border);border-radius:10px;overflow:hidden}.rc-table-scroll{overflow-x:auto}.rc-comparison-table{width:100%;min-width:720px;border-collapse:collapse}.rc-comparison-table th,.rc-comparison-table td{padding:12px 14px;border-bottom:1px solid #eceef0;text-align:center;font-size:11px}.rc-comparison-table th:first-child{text-align:left;color:#666}.rc-comparison-table thead th{background:#202225;color:#fff;font-size:12px}.rc-comparison-table thead th.is-featured{background:var(--rc-orange)}.rc-table-old{display:block;text-decoration:line-through;color:#999;font-size:9px}
.rc-xlr-section{margin-top:62px}.rc-xlr-product{display:grid;grid-template-columns:minmax(330px,.9fr) minmax(0,1.1fr);max-width:1120px;margin:0 auto 24px;border:1px solid #dedfe1;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 12px 36px rgba(0,0,0,.07)}.rc-xlr-product.is-selected{box-shadow:0 0 0 3px rgba(240,100,34,.18),0 18px 42px rgba(0,0,0,.11)}.rc-xlr-visual{position:relative;background:linear-gradient(135deg,#17181a,#2a2c30);min-height:430px;padding:28px;display:flex;align-items:center;justify-content:center}.rc-xlr-image{width:100%;height:320px;display:flex;align-items:center;justify-content:center}.rc-xlr-image img{max-width:100%;max-height:320px;object-fit:contain}.rc-xlr-complement{position:absolute;left:24px;bottom:22px;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);padding:8px 11px;border-radius:6px;font-size:10px;font-weight:800}.rc-xlr-complement i{color:#7ecb87;margin-right:6px}.rc-xlr-content{padding:36px 38px}.rc-xlr-content h3{font-size:34px;margin-top:7px}.rc-xlr-intro{color:#62676d;line-height:1.65;font-size:13px;margin:12px 0 18px}.rc-xlr-features{list-style:none;padding:0;margin:0 0 21px;display:grid;gap:9px}.rc-xlr-features li{position:relative;padding-left:18px;color:#3e4246;font-size:11px;font-weight:650}.rc-xlr-features li:before{content:"";position:absolute;left:0;top:6px;width:6px;height:6px;border-radius:50%;background:var(--rc-orange)}.rc-xlr-addon-wrap{margin:16px 0}.rc-xlr-price{text-align:left}.rc-xlr-content .rc-learn-link{justify-content:flex-start}

.rc-feature-links{display:grid;gap:2px;margin:12px 0 4px;border-top:1px solid #eef0f2;border-bottom:1px solid #eef0f2;padding:7px 0}.rc-feature-link{border:0;background:transparent;width:100%;display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:7px;text-align:left;padding:7px 3px;color:#44484d;font-size:10px;font-weight:700;cursor:pointer}.rc-feature-link:hover,.rc-feature-link:focus{color:var(--rc-red);background:#fafafa}.rc-feature-link i{color:#c1c4c8;font-size:11px}.rc-feature-link:hover i{color:var(--rc-red)}.rc-feature-dot{width:6px;height:6px;background:var(--rc-orange);border-radius:50%}.rc-card-more-row{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap;margin-top:8px}.rc-card-more-row .rc-learn-link{border:0;background:transparent;padding:0;cursor:pointer;margin-top:0}.rc-product-page-link{font-size:10px;color:#999;font-weight:650}.rc-product-page-link:hover{color:var(--rc-red)}.rc-xlr-feature-links{margin:14px 0 20px}.rc-xlr-more-row{justify-content:flex-start}
body.rc-modal-open{overflow:hidden}.rc-modal-overlay[hidden]{display:none!important}.rc-modal-overlay{position:fixed;z-index:999999;inset:0;background:rgba(10,12,15,.72);display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(4px);overflow:auto}.rc-info-modal{position:relative;width:min(880px,100%);max-height:calc(100vh - 48px);overflow:auto;background:#fff;border-radius:16px;box-shadow:0 28px 90px rgba(0,0,0,.32)}.rc-modal-close{position:absolute;right:16px;top:16px;width:38px;height:38px;border-radius:50%;border:1px solid #e1e3e6;background:#fff;color:#555;z-index:3;display:flex;align-items:center;justify-content:center}.rc-modal-close:hover{color:var(--rc-red);border-color:#cfd2d6}.rc-modal-header{display:flex;align-items:center;gap:14px;padding:24px 66px 20px 26px;border-bottom:1px solid #eceef0;background:linear-gradient(120deg,#fafafa,#fff)}.rc-modal-badge{width:44px;height:44px;flex:0 0 44px;border-radius:12px;background:#222326;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px}.rc-modal-tag{font-size:9px;font-weight:900;letter-spacing:1.3px;text-transform:uppercase;color:var(--rc-orange);margin-bottom:4px}.rc-modal-header h3{font-size:26px;line-height:1.08;margin:0;color:#202225;font-weight:900;letter-spacing:-.45px}.rc-modal-body{padding:26px}.rc-modal-intro,.rc-modal-product-copy>p{font-size:13px;line-height:1.7;color:#5e6369;margin:0}.rc-modal-product-grid{display:grid;grid-template-columns:minmax(260px,.85fr) minmax(0,1.15fr);gap:28px;align-items:center}.rc-modal-product-image{height:300px;display:flex;align-items:center;justify-content:center;background:#f6f7f8;border-radius:12px;overflow:hidden}.rc-modal-product-image img{max-width:100%;max-height:100%;object-fit:contain}.rc-modal-keyfacts{display:grid;gap:8px;margin-top:18px}.rc-modal-keyfacts span{display:flex;align-items:center;gap:8px;padding:9px 10px;background:#f6f7f8;border-radius:8px;color:#3b3f44;font-size:11px}.rc-modal-keyfacts i{width:18px;color:var(--rc-orange);text-align:center}.rc-modal-delivery{margin-top:28px;padding-top:22px;border-top:1px solid #eceef0}.rc-modal-section-title{font-size:15px;font-weight:850;color:#202225;margin-bottom:14px}.rc-modal-delivery-grid{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.1fr);gap:24px;align-items:center}.rc-modal-delivery-grid.no-image{grid-template-columns:1fr}.rc-modal-delivery-grid img{max-width:100%;max-height:310px;display:block;margin:auto;object-fit:contain}.rc-modal-delivery-grid ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}.rc-modal-delivery-grid li{font-size:11px;color:#494e53;display:flex;align-items:flex-start;gap:8px}.rc-modal-delivery-grid li i{color:#2f8b4b;margin-top:2px}.rc-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.rc-modal-primary,.rc-modal-secondary{border:0;border-radius:6px;padding:11px 17px;font-size:11px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}.rc-modal-primary{background:var(--rc-red);color:#fff}.rc-modal-primary:hover,.rc-modal-primary:focus{background:#bd0010;color:#fff}.rc-modal-secondary{background:#f1f2f3;color:#444}.rc-modal-secondary:hover{background:#e7e8ea}.rc-modal-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:20px}.rc-modal-feature{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:15px;background:#f7f8f9;border:1px solid #eceef0;border-radius:10px}.rc-modal-feature>i{width:42px;height:42px;border-radius:10px;background:#fff;color:var(--rc-orange);display:flex;align-items:center;justify-content:center;font-size:17px;box-shadow:0 2px 8px rgba(0,0,0,.04)}.rc-modal-feature strong{display:block;font-size:12px;color:#25282c;margin-bottom:4px}.rc-modal-feature p{font-size:10px;line-height:1.5;color:#72777c;margin:0}.rc-warranty-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.rc-warranty-card{position:relative;border:1px solid #e2e4e7;background:#f8f9fa;border-radius:12px;padding:20px}.rc-warranty-card>i{font-size:22px;color:var(--rc-orange);margin-bottom:8px}.rc-warranty-card h4{font-size:12px;margin:0 0 7px;color:#60656a;text-transform:uppercase;letter-spacing:.5px}.rc-warranty-card>strong{display:block;font-size:24px;color:#202225}.rc-warranty-card>span{display:block;color:#666;font-size:11px;margin-top:3px}.rc-warranty-card ul{padding-left:17px;margin:12px 0 0;color:#64696e;font-size:10px;line-height:1.65}.rc-warranty-note{font-size:9px;color:#777;margin:14px 0 0}.rc-warranty-note i{margin-right:5px;color:#999}

.rc-order-summary{max-width:1120px;margin:56px auto 20px;background:#fff;border:1px solid #dfe2e5;border-radius:14px;box-shadow:0 14px 38px rgba(0,0,0,.07);overflow:hidden}.rc-summary-inner{padding:26px}.rc-summary-inner h2{font-size:25px;font-weight:850;margin:0 0 18px;color:#1d1f22}.rc-summary-inner h2:after{content:"";display:block;width:48px;height:3px;background:var(--rc-orange);margin-top:8px}.rc-summary-table{border:1px solid #e6e8eb;border-radius:9px;overflow:hidden}.rc-summary-row{display:grid;grid-template-columns:minmax(250px,2fr) 1fr 1fr 1fr;align-items:center}.rc-summary-row>div{padding:12px 14px;border-right:1px solid #eceef0;border-bottom:1px solid #eceef0;font-size:11px}.rc-summary-row>div:last-child{border-right:0;text-align:right}.rc-summary-row>div:nth-child(2),.rc-summary-row>div:nth-child(3){text-align:center}.rc-summary-head{background:#222326;color:#fff;font-weight:800}.rc-summary-base{color:#666}.rc-summary-selected{color:#222}.rc-summary-selected .rc-summary-product-name{font-weight:800}.rc-summary-addons{display:block;color:#777;font-size:9px;margin-top:3px}.rc-summary-total{background:#f7f8f9;font-weight:800}.rc-summary-total>div{border-bottom:0}.rc-summary-actions{display:grid;grid-template-columns:1fr minmax(240px,340px);gap:18px;align-items:center;margin-top:18px}.rc-summary-feedback{font-size:11px}.rc-summary-feedback.rc-error{color:#c62828}.rc-summary-feedback.rc-success{color:#2e7d32}.rc-final-cart-button{border:0;border-radius:6px;background:var(--rc-red);color:#fff;font-weight:850;padding:14px 18px;font-size:13px}.rc-final-cart-button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:1100px){.rc-compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.rc-compare-card.is-featured{margin-top:0}.rc-xlr-product{grid-template-columns:1fr 1.2fr}.rc-car-hero-with-image{grid-template-columns:1fr}.rc-car-hero-image{min-height:270px;order:-1}.rc-car-hero-image:after{background:linear-gradient(0deg,#101113,transparent 55%)}}
@media(max-width:760px){.rc-modal-overlay{padding:10px}.rc-info-modal{max-height:calc(100vh - 20px);border-radius:11px}.rc-modal-header{padding:18px 52px 16px 18px}.rc-modal-header h3{font-size:21px}.rc-modal-body{padding:18px}.rc-modal-product-grid,.rc-modal-delivery-grid,.rc-modal-feature-grid,.rc-warranty-grid{grid-template-columns:1fr}.rc-modal-product-image{height:220px}.rc-modal-actions{flex-direction:column}.rc-modal-primary,.rc-modal-secondary{width:100%}.rc-card-more-row{gap:10px}#racechip-results-page{padding-bottom:45px}.rc-car-hero{border-radius:12px;min-height:0}.rc-car-hero-copy{padding:27px 20px}.rc-car-hero h1{font-size:25px}.rc-car-hero-image{min-height:210px}.rc-vehicle-description{padding:21px 18px;border-radius:10px;margin-bottom:32px}.rc-shop-heading h2{font-size:24px}.rc-compare-grid{grid-template-columns:1fr}.rc-card-head{padding-top:17px}.rc-card-image{height:160px}.rc-card-image img{max-height:155px}.rc-xlr-product{grid-template-columns:1fr}.rc-xlr-visual{min-height:300px;padding:20px}.rc-xlr-image{height:235px}.rc-xlr-image img{max-height:230px}.rc-xlr-content{padding:27px 20px}.rc-xlr-content h3{font-size:29px}.rc-xlr-complement{left:15px;bottom:15px}.rc-performance-item small{display:none}.rc-summary-inner{padding:16px}.rc-summary-row{grid-template-columns:minmax(155px,1.7fr) .8fr .8fr 1fr}.rc-summary-row>div{padding:9px 7px;font-size:9px}.rc-summary-actions{grid-template-columns:1fr}.rc-final-cart-button{width:100%}}

/* v1.6 sticky optimization summary + mobile hardening */
#racechip-results-page{padding-bottom:calc(90px + var(--rc-summary-dock-height,0px))}
.rc-order-summary{position:fixed;left:0;right:0;bottom:0;z-index:9997;margin:0;background:transparent;box-shadow:none;border:0;border-radius:0;max-width:none;overflow:visible;pointer-events:none}
.rc-summary-expand,.rc-summary-dockbar{pointer-events:auto}
.rc-summary-expand{background:#fff;border-top:1px solid #dfe2e5;box-shadow:0 -18px 44px rgba(0,0,0,.13);max-height:min(62vh,470px);overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.rc-summary-expand[hidden]{display:none!important}
.rc-summary-inner{max-width:1180px;margin:0 auto;padding:20px 22px 17px}
.rc-summary-dockbar{background:rgba(20,21,23,.98);color:#fff;border-top:1px solid rgba(255,255,255,.08);box-shadow:0 -8px 28px rgba(0,0,0,.22);padding-bottom:env(safe-area-inset-bottom)}
.rc-summary-dock-inner{max-width:1180px;margin:0 auto;padding:10px 22px;display:grid;grid-template-columns:minmax(0,1fr) minmax(245px,340px);gap:16px;align-items:center}
.rc-summary-toggle{appearance:none;border:0;background:transparent;color:#fff;min-height:52px;padding:4px 6px;display:grid;grid-template-columns:minmax(0,1fr) auto 22px;align-items:center;gap:14px;text-align:left;width:100%;cursor:pointer}
.rc-summary-toggle-copy{min-width:0}.rc-summary-toggle-copy strong{display:block;font-size:14px;line-height:1.2;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rc-summary-toggle-copy small{display:block;color:#aeb2b8;font-size:10px;margin-top:3px}
.rc-summary-dock-total{font-size:18px;font-weight:900;color:#fff;white-space:nowrap}.rc-summary-toggle>i{font-size:12px;color:#c7c9cd;transition:transform .2s ease}.rc-summary-toggle[aria-expanded="true"]>i{transform:rotate(180deg)}
.rc-final-cart-button{min-height:50px;display:flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;transition:.18s ease;touch-action:manipulation}.rc-final-cart-button:not(:disabled):hover{filter:brightness(.94)}.rc-final-cart-button.is-checkout{background:#198754}.rc-final-cart-button.is-checkout:hover{background:#157347;filter:none}
.rc-summary-feedback{min-height:18px;margin-top:12px;font-size:11px}
.rc-summary-table{overflow:hidden}
.rc-product-tabs,.rc-table-scroll{scrollbar-width:thin;-webkit-overflow-scrolling:touch}.rc-product-tabs{scroll-snap-type:x proximity}.rc-product-tab{scroll-snap-align:start}
.rc-select-product,.rc-select-xlr,.rc-addon-item,.rc-card-info-btn,.rc-compare-toggle{touch-action:manipulation}
@media(max-width:991px){.rc-summary-dock-inner{padding:9px 14px;grid-template-columns:minmax(0,1fr) minmax(210px,280px);gap:10px}.rc-summary-toggle-copy strong{font-size:13px}.rc-summary-dock-total{font-size:16px}.rc-final-cart-button{min-height:48px;padding:11px 13px}.rc-summary-inner{padding:15px 14px}.rc-summary-expand{max-height:60vh}}
@media(max-width:760px){racechip-results-page{padding-bottom:calc(78px + var(--rc-summary-dock-height,0px))}.rc-summary-dock-inner{grid-template-columns:1fr;padding:8px 12px 9px;gap:7px}.rc-summary-toggle{min-height:43px;padding:1px 3px;grid-template-columns:minmax(0,1fr) auto 18px;gap:9px}.rc-summary-toggle-copy strong{font-size:12px}.rc-summary-toggle-copy small{font-size:9px}.rc-summary-dock-total{font-size:15px}.rc-final-cart-button{width:100%;min-height:46px;font-size:12px;border-radius:7px}.rc-summary-expand{max-height:68vh}.rc-summary-inner{padding:12px}.rc-summary-head{display:none}.rc-summary-row{grid-template-columns:1fr 1fr!important;padding:9px 10px;border-bottom:1px solid #eceef0}.rc-summary-row>div{border:0!important;padding:4px 5px!important;font-size:10px!important;text-align:left!important}.rc-summary-col-product{grid-column:1/-1;font-size:11px!important}.rc-summary-col-output:before{content:"{{ text_summary_output|e('css') }}: ";color:#888;font-size:8px;text-transform:uppercase}.rc-summary-col-torque:before{content:"{{ text_summary_torque|e('css') }}: ";color:#888;font-size:8px;text-transform:uppercase}.rc-summary-col-price{grid-column:1/-1;text-align:right!important;font-size:12px!important;font-weight:800}.rc-summary-col-price:before{content:"{{ text_summary_price|e('css') }}: ";color:#888;font-size:8px;text-transform:uppercase;font-weight:500}.rc-summary-total{background:#f7f8f9}.rc-summary-table{border-radius:8px}.rc-car-hero-copy{padding:24px 17px}.rc-car-hero h1{font-size:23px}.rc-baseline>div{min-width:calc(50% - 5px);flex:1}.rc-performance-item strong{font-size:19px}.rc-card-body{padding-left:14px;padding-right:14px}.rc-addon-item{padding:11px}.rc-modal-overlay{align-items:flex-end;padding:0}.rc-info-modal{width:100%;max-height:92dvh;border-radius:16px 16px 0 0}.rc-modal-body{padding-bottom:calc(18px + env(safe-area-inset-bottom))}}
@media(max-width:420px){.rc-summary-toggle-copy strong{max-width:220px}.rc-product-tab{min-width:104px}.rc-card-head h3,.rc-xlr-content h3{font-size:25px}.rc-performance-item{padding-left:2px;padding-right:2px}.rc-performance-item strong{font-size:18px}.rc-baseline strong{font-size:18px}}


/* v1.7 closer RaceChip.com visual language */
#racechip-results-page{--rc-red:#e65100;--rc-orange:#e65100;--rc-dark:#1f2022;--rc-ink:#262626;--rc-muted:#666b70;--rc-border:#dedede;--rc-soft:#f6f6f6;font-family:Roboto,Arial,Helvetica,sans-serif;color:var(--rc-ink)}
#racechip-results-page button,#racechip-results-page input,#racechip-results-page select{font-family:inherit}
.rc-shop-kicker,.rc-product-mark{color:#e65100;letter-spacing:1.45px}.rc-shop-heading h2,.rc-card-head h3,.rc-xlr-content h3{font-weight:700;letter-spacing:-.35px}.rc-card-subtitle,.rc-xlr-intro{color:#686868}
.rc-compare-card{border-color:#d9d9d9;border-radius:4px;box-shadow:0 2px 10px rgba(0,0,0,.06)}.rc-compare-card:hover{box-shadow:0 9px 26px rgba(0,0,0,.11)}.rc-compare-card.is-featured{border:2px solid #e65100;box-shadow:0 7px 24px rgba(230,81,0,.13)}.rc-favorite-ribbon{background:#e65100;font-size:10px;letter-spacing:.75px}.rc-performance-bar{background:#2a2a2a;border-radius:2px}.rc-main-price strong{font-weight:700}.rc-select-product,.rc-select-xlr{background:#333;border-radius:2px;font-weight:700}.rc-select-product.rc-select-featured{background:#e65100}.rc-select-product:hover,.rc-select-product:focus,.rc-select-xlr:hover,.rc-select-xlr:focus{background:#e65100}
.rc-feature-links{gap:0;border-color:#ececec;padding:4px 0}.rc-feature-link{grid-template-columns:9px minmax(0,1fr) 18px;gap:8px;padding:8px 3px;color:#3b3b3b;font-size:11px;font-weight:400}.rc-feature-link:hover,.rc-feature-link:focus{color:#e65100;background:#fff}.rc-feature-link>i{color:#e65100;font-size:12px}.rc-feature-dot{width:5px;height:5px;background:#e65100}.rc-feature-copy{display:block;min-width:0}.rc-feature-copy strong{display:block;color:inherit;font-size:11px;font-weight:700;line-height:1.25}.rc-feature-copy small{display:block;color:#858585;font-size:9px;font-weight:400;line-height:1.35;margin-top:2px}.rc-feature-copy small b{color:#5a5a5a;font-weight:700}
.rc-addon-item{border-radius:2px;border-color:#d8d8d8;padding:12px 11px;background:#fff}.rc-addon-item:hover{border-color:#bdbdbd}.rc-addon-item.is-selected{border-color:#e65100;background:#fff9f6;box-shadow:inset 3px 0 0 #e65100}.rc-addon-check{border-radius:2px}.rc-addon-item.is-selected .rc-addon-check{background:#e65100;border-color:#e65100}.rc-addon-copy strong{font-size:12px;font-weight:700}.rc-addon-copy small{font-size:10px;color:#777}.rc-addon-meta{display:block;margin-top:5px;color:#777;font-size:9px;line-height:1.4}.rc-addon-meta b{color:#4a4a4a}.rc-addon-price{font-size:12px;font-weight:700}.rc-included-wrap{margin-top:10px}.rc-addon-included{cursor:default;background:#f7f7f7!important;border-color:#d9d9d9!important;box-shadow:none!important}.rc-addon-included .rc-addon-check{background:#e65100!important;border-color:#e65100!important;color:#fff!important}.rc-included-label{color:#666;background:#ececec;border-radius:2px;padding:4px 7px;font-size:9px;text-transform:uppercase;letter-spacing:.35px}
.rc-xlr-product{border-radius:4px;border-color:#d8d8d8}.rc-xlr-visual{background:#222325}.rc-xlr-primary-image{transition:opacity .16s ease,transform .22s ease}.rc-xlr-primary-image.is-changing{opacity:.15;transform:scale(.985)}.rc-xlr-product.has-controller-selected .rc-xlr-visual{box-shadow:inset 0 0 0 2px rgba(230,81,0,.22)}
.rc-compare-control{display:flex;justify-content:center;margin:27px 0 15px}.rc-compare-toggle{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;border:1px solid #cfcfcf;border-radius:2px;background:#fff;color:#333;font-weight:700;font-size:12px;padding:11px 18px;box-shadow:none;transition:.15s ease}.rc-compare-toggle:hover,.rc-compare-toggle:focus{border-color:#e65100;color:#e65100;background:#fff}.rc-compare-icon{flex:0 0 18px}.rc-compare-arrow{font-size:9px;margin-left:2px;color:#777;transition:transform .18s ease}.rc-compare-toggle[aria-expanded="true"] .rc-compare-arrow{transform:rotate(180deg)}.rc-compare-table-wrap{border-radius:2px}.rc-compare-scroll-hint{display:none;padding:8px 12px;text-align:center;background:#f6f6f6;color:#777;font-size:9px;border-bottom:1px solid #e5e5e5}
.rc-summary-dockbar{background:#202124}.rc-summary-dock-inner{grid-template-columns:minmax(0,1fr) minmax(250px,340px);gap:18px}.rc-summary-toggle{grid-template-columns:40px minmax(0,1fr) auto 34px;gap:11px;min-height:58px;padding:3px 4px}.rc-summary-toggle-icon{width:36px;height:36px;border-radius:50%;background:#303236;display:flex;align-items:center;justify-content:center;color:#e65100;font-size:14px}.rc-summary-toggle-copy strong{font-size:14px;font-weight:700;letter-spacing:-.1px}.rc-summary-toggle-hint{display:inline-flex!important;align-items:center;width:max-content;margin-top:5px!important;padding:3px 8px;border-radius:2px;background:#e65100;color:#fff!important;font-size:9px!important;font-weight:700;letter-spacing:.15px}.rc-summary-total-wrap{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;white-space:nowrap}.rc-summary-total-wrap>small{color:#9da1a5;font-size:8px;text-transform:uppercase;letter-spacing:.55px}.rc-summary-dock-total{font-size:20px;font-weight:700;margin-top:1px}.rc-summary-chevron{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid #44474c;color:#fff}.rc-summary-chevron i{transition:transform .2s ease}.rc-summary-toggle[aria-expanded="true"] .rc-summary-chevron i{transform:rotate(180deg)}.rc-final-cart-button{border-radius:2px;background:#e65100;font-weight:700}.rc-final-cart-button.is-checkout{background:#2e7d32}
@media(max-width:760px){.rc-compare-scroll-hint{display:block}.rc-feature-copy strong{font-size:11px}.rc-feature-copy small{font-size:9px}.rc-addon-item{padding:12px 10px}.rc-addon-included{grid-template-columns:26px minmax(0,1fr);}.rc-addon-included .rc-included-label{grid-column:2;justify-self:start;margin-top:3px}.rc-summary-dock-inner{gap:8px}.rc-summary-toggle{grid-template-columns:34px minmax(0,1fr) auto 28px;min-height:52px}.rc-summary-toggle-icon{width:31px;height:31px;font-size:12px}.rc-summary-toggle-copy strong{font-size:12px}.rc-summary-toggle-hint{font-size:8px!important;padding:2px 6px}.rc-summary-total-wrap>small{display:none}.rc-summary-dock-total{font-size:16px}.rc-summary-chevron{width:26px;height:26px}.rc-xlr-primary-image{max-width:100%}.rc-compare-toggle{width:100%;max-width:330px}}
@media(max-width:420px){.rc-summary-toggle{grid-template-columns:30px minmax(0,1fr) auto 24px;gap:7px}.rc-summary-toggle-icon{width:28px;height:28px}.rc-summary-toggle-copy strong{font-size:11px}.rc-summary-dock-total{font-size:15px}.rc-summary-chevron{width:23px;height:23px}.rc-feature-copy small{font-size:8.5px}}

</style>

<script>
(function($){
  var cartUrl='{{ cart_add_url|e('js') }}';
  var checkoutUrl='{{ checkout_url|e('js') }}';
  var currency='{{ currency_code|e('js') }}';
  var locale=(document.documentElement.lang||'el-GR').replace('_','-');

  function openRcModal(id){
    if(!id)return;
    var modal=$('#'+id);
    if(!modal.length)return;
    modal.prop('hidden',false).attr('aria-hidden','false').addClass('is-open');
    $('body').addClass('rc-modal-open');
    window.setTimeout(function(){modal.find('.rc-modal-close').first().trigger('focus');},20);
  }

  function closeRcModal(modal){
    modal=$(modal);
    if(!modal.length)return;
    modal.prop('hidden',true).attr('aria-hidden','true').removeClass('is-open');
    if(!$('.rc-modal-overlay.is-open').length)$('body').removeClass('rc-modal-open');
  }

  $(document).on('click','[data-rc-modal]',function(e){
    e.preventDefault();
    openRcModal($(this).attr('data-rc-modal'));
  });
  $(document).on('click','.rc-modal-close,.rc-modal-close-action',function(){closeRcModal($(this).closest('.rc-modal-overlay'));});
  $(document).on('click','.rc-modal-overlay',function(e){if(e.target===this)closeRcModal(this);});
  $(document).on('keydown',function(e){if(e.key==='Escape'||e.keyCode===27){var open=$('.rc-modal-overlay.is-open').last();if(open.length)closeRcModal(open);}});

  function initVehicleDescription(){
    $('[data-rc-description]').each(function(){
      var box=$(this),content=box.find('.rc-vehicle-description-content').first(),button=box.find('.rc-vehicle-description-toggle').first();
      if(!content.length||!button.length)return;

      var collapsedHeight=150;
      if(content[0].scrollHeight<=collapsedHeight+8){
        button.prop('hidden',true);
        return;
      }

      box.addClass('is-collapsible');
      content.css('max-height',collapsedHeight+'px');
      button.prop('hidden',false);

      button.on('click',function(){
        var expanded=button.attr('aria-expanded')==='true';
        if(expanded){
          content.css('max-height',collapsedHeight+'px');
          box.removeClass('is-expanded');
          button.attr('aria-expanded','false').find('span').text('Περισσότερα');
        }else{
          content.css('max-height',content[0].scrollHeight+'px');
          box.addClass('is-expanded');
          button.attr('aria-expanded','true').find('span').text('Λιγότερα');
        }
      });

      $(window).on('resize.rcVehicleDescription',function(){
        if(button.attr('aria-expanded')==='true'){
          content.css('max-height',content[0].scrollHeight+'px');
        }
      });
    });
  }

  initVehicleDescription();

  function setSummaryExpanded(expanded){
    var details=$('#rcSummaryDetails'),toggle=$('#rcSummaryToggle');
    if(!details.length||!toggle.length)return;
    details.prop('hidden',!expanded);
    toggle.attr('aria-expanded',expanded?'true':'false');
    $('#rcSummaryToggleHint').text(expanded?'{{ text_summary_hide|e('js') }}':'{{ text_summary_show|e('js') }}');
  }

  function syncSummaryDockHeight(){
    var bar=$('#rcSummaryDockBar');
    if(!bar.length)return;
    document.documentElement.style.setProperty('--rc-summary-dock-height',Math.ceil(bar.outerHeight())+'px');
  }

  function resetCheckoutMode(){
    var button=$('#rcAddSelection');
    if(!button.length||button.attr('data-mode')!=='checkout')return;
    button.attr('data-mode','add').removeClass('is-checkout');
    button.find('i').attr('class','fa fa-shopping-cart');
    button.find('span').text('{{ text_add_selection_to_cart|e('js') }}');
    $('#rcSummaryFeedback').removeClass('rc-error rc-success').text('');
  }

  $('#rcSummaryToggle').on('click',function(){
    setSummaryExpanded($(this).attr('aria-expanded')!=='true');
  });
  $(window).on('resize orientationchange',function(){window.setTimeout(syncSummaryDockHeight,40);});
  $('body').addClass('rc-summary-dock-active');
  syncSummaryDockHeight();

  function money(value){
    value=parseFloat(value)||0;
    try{return new Intl.NumberFormat(locale,{style:'currency',currency:currency}).format(value);}catch(e){return value.toFixed(2)+' '+currency;}
  }

  function currentTotal(form){
    var total=parseFloat(form.attr('data-base-price'))||0;
    form.find('select.rc-price-option,select.rc-native-addon').each(function(){
      var opt=$(this).find('option:selected');
      total+=parseFloat(opt.attr('data-price'))||0;
    });
    form.find('input.rc-price-option:checked').each(function(){total+=parseFloat($(this).attr('data-price'))||0;});
    return total;
  }

  function selectedAddonLabels(form){
    var labels=[];
    form.find('select.rc-native-addon option:selected,select.rc-price-option option:selected').each(function(){
      var label=$(this).attr('data-label')||'';
      if(label)labels.push(label);
    });
    form.find('input.rc-price-option:checked').each(function(){
      var label=$(this).attr('data-label')||'';
      if(label)labels.push(label);
    });
    return labels;
  }

  function syncXlrControllerImage(form){
      
      return;
      //skip there are issues with rx (racechip-byd-atto-3-from-2022-atto-3-204-hp-150-kw-chip-tuning)
      
      
    if(!form || !form.length || !form.hasClass('rc-xlr-form'))return;
    var card=form.closest('.rc-xlr-product');
    var img=card.find('.rc-xlr-primary-image').first();
    if(!img.length)return;
    var selected=!!form.find('select.rc-native-addon[data-kind="controller"]').val();
    var defaultSrc=img.attr('data-default-src')||img.attr('src')||'';
    var controllerSrc=img.attr('data-controller-src')||'';
    var nextSrc=(selected&&controllerSrc)?controllerSrc:defaultSrc;
    card.toggleClass('has-controller-selected',selected);
    if(nextSrc && img.attr('src')!==nextSrc){
      img.addClass('is-changing');
      window.setTimeout(function(){img.attr('src',nextSrc);img.removeClass('is-changing');},90);
    }
  }

  function updateTotal(form){
    form.find('.rc-live-total').text(money(currentTotal(form)));
    syncXlrControllerImage(form);
    updateSummary();
  }

  function setTuningSelected(button, selected){
    var card=button.closest('.rc-compare-card'),form=card.find('.rc-tuning-form').first(),panel=card.find('.rc-config-panel').first();
    form.attr('data-selected',selected?'1':'0');
    card.toggleClass('is-selected',selected);
    panel.prop('hidden',!selected);
    button.toggleClass('is-selected',selected).attr('aria-expanded',selected?'true':'false');
    button.find('span').text(selected?'{{ text_selected|e('js') }}':'{{ text_select|e('js') }}');
    button.find('i').toggleClass('fa-check',selected).toggleClass('fa-angle-down',!selected);
    if(selected)updateTotal(form);
  }

  $('.rc-select-product').on('click',function(){
    var button=$(this),wasSelected=button.hasClass('is-selected');
    $('.rc-select-product').each(function(){setTuningSelected($(this),false);});
    if(!wasSelected)setTuningSelected(button,true);
    updateSummary();
  });

  $('.rc-select-xlr').on('click',function(){
    var button=$(this),card=button.closest('.rc-xlr-product'),form=card.find('.rc-xlr-form').first(),panel=card.find('.rc-config-panel').first();
    var selected=!button.hasClass('is-selected');

    // If multiple XLR cards ever reach the page, allow only one.
    $('.rc-select-xlr').each(function(){
      var b=$(this),c=b.closest('.rc-xlr-product'),f=c.find('.rc-xlr-form').first(),p=c.find('.rc-config-panel').first();
      b.removeClass('is-selected').attr('aria-expanded','false');b.find('span').text('{{ text_select|e('js') }}');b.find('i').removeClass('fa-check').addClass('fa-angle-down');
      c.removeClass('is-selected');f.attr('data-selected','0');p.prop('hidden',true);
    });

    if(selected){
      button.addClass('is-selected').attr('aria-expanded','true');button.find('span').text('{{ text_selected|e('js') }}');button.find('i').removeClass('fa-angle-down').addClass('fa-check');
      card.addClass('is-selected');form.attr('data-selected','1');panel.prop('hidden',false);updateTotal(form);
    }
    updateSummary();
  });

  $('.rc-addon-item').on('click',function(){
    var tile=$(this),form=tile.closest('form'),optionId=tile.attr('data-option-id');
    var select=form.find('select.rc-native-addon[data-option-id="'+optionId+'"]');
    var isSelected=tile.hasClass('is-selected');
    if(isSelected){select.val('');tile.removeClass('is-selected').attr('aria-pressed','false');}
    else{select.val(tile.attr('data-value'));tile.addClass('is-selected').attr('aria-pressed','true');}
    select.trigger('change');
  });

  $(document).on('change','.rc-product-form .rc-price-option,.rc-product-form .rc-native-addon',function(){updateTotal($(this).closest('form'));});
  $('.rc-product-form').each(function(){updateTotal($(this));});

  $('#rcCompareToggle').on('click',function(){
    var btn=$(this),table=$('#rcCompareTable'),opening=table.prop('hidden');
    table.prop('hidden',!opening);btn.attr('aria-expanded',opening?'true':'false');
    btn.find('span').text(opening?'{{ text_hide_comparison|e('js') }}':'{{ text_compare_products|e('js') }}');
    btn.find('.rc-compare-arrow').text(opening?'▲':'▼');
  });

  function updateSummary(){
    var selected=$('.rc-product-form[data-selected="1"]');
    var rows='',total=0,optimizedOutput='—',optimizedTorque='—';

    selected.each(function(){
      var form=$(this),name=form.attr('data-product-name')||'',price=currentTotal(form),addons=selectedAddonLabels(form);
      var isXlr=form.hasClass('rc-xlr-form');
      var output=isXlr?'{{ text_throttle_tuning|e('js') }}':(form.attr('data-output-total') ? form.attr('data-output-total')+' HP'+(form.attr('data-output-kw')?' ('+form.attr('data-output-kw')+' kW)':'') : '—');
      var torque=isXlr?'—':(form.attr('data-torque-total') ? form.attr('data-torque-total')+' Nm' : '—');
      if(!isXlr){optimizedOutput=output;optimizedTorque=torque;}
      total+=price;
      rows+='<div class="rc-summary-row rc-summary-selected"><div class="rc-summary-col-product"><span class="rc-summary-product-name">'+$('<div>').text(name).html()+'</span>';
      if(addons.length){rows+='<span class="rc-summary-addons">+ '+$('<div>').text(addons.join(' · ')).html()+'</span>';}
      rows+='</div><div class="rc-summary-col-output">'+output+'</div><div class="rc-summary-col-torque">'+torque+'</div><div class="rc-summary-col-price">'+money(price)+'</div></div>';
    });

    $('#rcSummarySelections').html(rows);
    $('#rcSummaryOutput').text(optimizedOutput);
    $('#rcSummaryTorque').text(optimizedTorque);
    var totalLabel=selected.length?money(total):'—';
    $('#rcSummaryTotal').text(totalLabel);
    $('#rcSummaryDockTotal').text(totalLabel);
    resetCheckoutMode();
    $('#rcAddSelection').prop('disabled',selected.length===0);
    if(selected.length===0)$('#rcSummaryFeedback').removeClass('rc-error rc-success').text('');
    syncSummaryDockHeight();
  }

  function validateForm(form){
    var ok=true;
    form.find('select[data-required="1"]').each(function(){if(!$(this).val())ok=false;});
    form.find('input[type="radio"][data-required="1"]').each(function(){
      var name=$(this).attr('name');if(name && form.find('input[name="'+name+'"]:checked').length===0)ok=false;
    });
    return ok;
  }

  function ajaxAdd(form){
    return $.ajax({url:cartUrl,type:'post',dataType:'json',data:form.serialize()});
  }

  $('#rcAddSelection').on('click',function(){
    var button=$(this),feedback=$('#rcSummaryFeedback');
    if(button.attr('data-mode')==='checkout'){
      window.location.href=checkoutUrl;
      return;
    }
    var forms=$('.rc-product-form[data-selected="1"]');
    if(!forms.length){feedback.addClass('rc-error').text('{{ text_select_a_product|e('js') }}');return;}

    var invalid=false;
    forms.each(function(){if(!validateForm($(this)))invalid=true;});
    if(invalid){feedback.removeClass('rc-success').addClass('rc-error').text('{{ text_cart_error|e('js') }}');return;}

    button.prop('disabled',true);feedback.removeClass('rc-error rc-success').text('{{ text_adding_to_cart|e('js') }}');
    var list=forms.toArray(),i=0,lastJson=null;

    function next(){
      if(i>=list.length){
        if(lastJson&&lastJson.total)$('#cart-total').html(lastJson.total);
        feedback.removeClass('rc-error').addClass('rc-success').html('<i class="fa fa-check-circle"></i> {{ text_added_to_cart|e('js') }}');
        button.attr('data-mode','checkout').addClass('is-checkout').prop('disabled',false);
        button.find('i').attr('class','fa fa-credit-card');
        button.find('span').text('{{ text_complete_purchase|e('js') }}');
        syncSummaryDockHeight();
        return;
      }
      var form=$(list[i++]);
      ajaxAdd(form).done(function(json){
        if(json&&json.redirect){window.location.href=json.redirect;return;}
        if(json&&json.error){
          var message='{{ text_cart_error|e('js') }}';
          if(json.error.warning)message=json.error.warning;
          if(json.error.option){var keys=Object.keys(json.error.option);if(keys.length)message=json.error.option[keys[0]];}
          feedback.removeClass('rc-success').addClass('rc-error').text(message);button.prop('disabled',false);return;
        }
        lastJson=json||lastJson;next();
      }).fail(function(){
        feedback.removeClass('rc-success').addClass('rc-error').text('{{ text_cart_error|e('js') }}');button.prop('disabled',false);
      });
    }
    next();
  });

  setSummaryExpanded(false);
  updateSummary();
  window.setTimeout(syncSummaryDockHeight,80);
})(window.jQuery);
</script>



<style>
.rc-car-hero-image img {
  max-width: 300px;
  height: auto;
  float: right;
  margin-top: 60px;
}
</style>
{{ footer }}