<div class="b2b-cart">
    <div class="b2b-cart__container">
        <div class="b2b-cart__message">
            <div class="message--error">
                <div class="message__container--disabled">
                    <span class="visually-hidden">Error message</span>
                    <div class="message__content">
                        <p class="message__text">Bitte überprüfen Sie alle erforderlichen Felder</p>
                    </div>
                    <div class="message__close-button">
                        <button class="button-icon--icon-regular -icon-close" type="button" name="close-big-menu" value="yes">
                            <span class="visually-hidden">Schliessen</span>
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="b2b-cart__title-container">
            <div class="image ">
                <picture>
                    <img src="/example-assets/images/cart/dealer.svg" class="image__img b2b-cart__title-image is-loading" alt="Händler" onload="this.classList.remove('is-loading')" />
                </picture>
            </div>

            <h3 class="b2b-cart__title">Warenkorb «Händler»</h3>
        </div>
        <div class="b2b-cart__info-block">
            <div class="info-block">
                <div class="info-block__container">
                    <div class="info-block__block">
                        <div class="info-block__block-title">Lieferadresse</div>
                        <div class="delivery-address">
                            <div class="delivery-address__address-form">
                                <div class="dynamic-form">
                                    <fieldset class="dynamic-form__fieldset--full-width">
                                        <div class="dynamic-form__element">
                                            <div class="text-field--light is-initialized">
                                                <div class="text-field__wrapper">
                                                    <input class="text-field__input" id="checkout-firstName" type="text" name="firstName" required />
                                                    <label class="text-field__label" for="checkout-firstName">Vorname
                                                        *
                                                    </label>
                                                </div>

                                                <div class="text-field__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                        </div>

                                        <div class="dynamic-form__element">
                                            <div class="text-field--light is-initialized">
                                                <div class="text-field__wrapper">
                                                    <input class="text-field__input" id="checkout-lastName" type="text" name="lastName" required />
                                                    <label class="text-field__label" for="checkout-lastName">Nachname
                                                        *
                                                    </label>
                                                </div>

                                                <div class="text-field__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                        </div>

                                        <div class="dynamic-form__element--street-number">
                                            <div class="text-field--light is-initialized">
                                                <div class="text-field__wrapper">
                                                    <input class="text-field__input" id="checkout-street" type="text" name="street" required />
                                                    <label class="text-field__label" for="checkout-street">Strasse
                                                        *
                                                    </label>
                                                </div>

                                                <div class="text-field__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                            <div class="text-field--light is-initialized">
                                                <div class="text-field__wrapper">
                                                    <input class="text-field__input" id="checkout-street-number" type="text" name="street-number" required />
                                                    <label class="text-field__label" for="checkout-street-number">Nr.
                                                        *
                                                    </label>
                                                </div>

                                                <div class="text-field__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                        </div>
                                        <div class="dynamic-form__element--zip-city">
                                            <div class="text-field--light is-initialized">
                                                <div class="text-field__wrapper">
                                                    <input class="text-field__input" id="checkout-zip" type="text" name="zip" required />
                                                    <label class="text-field__label" for="checkout-zip">PLZ
                                                        *
                                                    </label>
                                                </div>

                                                <div class="text-field__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                            <div class="text-field--light is-initialized">
                                                <div class="text-field__wrapper">
                                                    <input class="text-field__input" id="checkout-city" type="text" name="city" required />
                                                    <label class="text-field__label" for="checkout-city">Ort
                                                        *
                                                    </label>
                                                </div>

                                                <div class="text-field__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                        </div>
                                        <div class="dynamic-form__element">
                                            <div class="select--light is-initialized is-filled-in with-label">
                                                <div class="select__wrapper">
                                                    <select class="select__select" id="checkout-country" name="country" required>

                                                        <option value="" disabled>Bitte wählen</option>
                                                        <option value="ch" selected="selected">Schweiz</option>
                                                        <option value="de">Deutschland</option>
                                                        <option value="fr">Frankreich</option>
                                                        <option value="it">Italien</option>
                                                        <option value="li">Lichtenstein</option>
                                                    </select>
                                                    <label class="select__label" for="checkout-country">Land
                                                        *
                                                    </label>
                                                </div>

                                                <div class="select__error">Dieses Feld ist erforderlich.</div>
                                            </div>

                                        </div>

                                    </fieldset>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="info-block__block">
                        <div class="info-block__block-title">Lieferart</div>
                        <div class="delivery-method">
                            <div class="delivery-method__method">
                                <div class="select--light is-initialized is-filled-in">
                                    <div class="select__wrapper">
                                        <select class="select__select" id="checkout-delivery-method" name="delivery-method" required>

                                            <option value="" disabled>Please choose</option>
                                            <option value="postEconomy" selected="selected">Post Economy: CHF 9.00</option>
                                            <option value="postSameDay">Post Same Day: CHF 64.00</option>
                                        </select>
                                    </div>

                                </div>
                            </div>
                            <div class="delivery-method__cost">Portofreie Lieferung (ab CHF 50.00)</div>
                            <div class="delivery-method__note">Bestellungen bis 18 Uhr erhalten Sie am folgenden Werktag, nach 18 Uhr am übernächsten Werktag. Portofreie Lieferung ab CHF 300.00 Warenwert (exkl. MwSt).</div>
                            <div class="delivery-method__date">

                                <div class="text-field--light date-picker--light is-initialized is-filled-in" data-disable-text-field-js data-language="" data-format="" data-min-date="" data-max-date="">
                                    <div class="text-field__wrapper date-picker__wrapper">
                                        <input class="text-field__input date-picker__input" id="checkout-desired-date" type="text" name="checkout-desired-date" value="2021-04-09" />
                                        <label class="text-field__label date-picker__label" for="checkout-desired-date">Wunschtermin</label>
                                        <button type="reset" class="date-picker__reset"></button>
                                    </div>

                                </div>
                            </div>
                            <div class="delivery-method__information">
                                <div class="text-area--light is-initialized">
                                    <div class="text-area__wrapper">
                                        <textarea class="text-area__input" id="checkout-delivery-information" name="delivery-information" rows="2" maxlength="100">
					</textarea>
                                        <label class="text-area__label" for="checkout-delivery-information">Lieferinformationen
                                        </label>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="info-block__block">
                        <div class="info-block__block-title">Zahlungsart</div>
                        <div class="payment-method">
                            <div class="payment-method__icon-container">
                                <div class="payment-method__icon--select">
                                    <div class="image ">
                                        <picture>
                                            <img src="/example-assets/images/payment-method/invoice.svg" class="image__img payment-method__image is-loading" alt="Invoice" onload="this.classList.remove('is-loading')" />
                                        </picture>
                                    </div>

                                </div>
                                <div class="payment-method__method">
                                    <div class="select--light is-initialized is-filled-in">
                                        <div class="select__wrapper">
                                            <select class="select__select" id="checkout-payment-method" name="payment-method" required>

                                                <option value="" disabled>Please choose</option>
                                                <option value="invoice" selected="selected">Rechnung</option>
                                                <option value="cashOnDelivery">Nachnahme</option>
                                            </select>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <div class="payment-method__billing-address">
                                <address class="address">
                                    <div class="address__title">
                                        Rechnungsadresse
                                    </div>
                                    <div class="address__address-value">Speedy Gonzales GmbH</div>
                                    <div class="address__address-value">Daniel Downhill</div>
                                    <div class="address__address-value">Im Grip 10</div>
                                    <div class="address__address-value">4242 Laufen</div>
                                    <div class="address__address-value">Schweiz</div>
                                </address>
                            </div>
                            <div class="payment-method__promo-code">
                                <div class="text-field--light is-initialized">
                                    <div class="text-field__wrapper">
                                        <input class="text-field__input" id="checkout-promo-code" type="text" name="promo-code" />
                                        <label class="text-field__label" for="checkout-promo-code">Promo Code
                                        </label>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="info-block__block">
                        <div class="info-block__block-title">Optionale Angaben</div>
                        <div class="further-information">
                            <div class="further-information__order-no">
                                <div class="text-field--light is-initialized">
                                    <div class="text-field__wrapper">
                                        <input class="text-field__input" id="checkout-own-order-no" type="text" name="own-order-no" />
                                        <label class="text-field__label" for="checkout-own-order-no">Eigene Bestellnummer
                                        </label>
                                    </div>

                                </div>
                            </div>
                            <div class="further-information__comment">
                                <div class="text-area--light is-initialized">
                                    <div class="text-area__wrapper">
                                        <textarea class="text-area__input" id="checkout-comment" name="comment" rows="2" maxlength="100">
					</textarea>
                                        <label class="text-area__label" for="checkout-comment">Bemerkung
                                        </label>
                                    </div>

                                </div>
                            </div>
                            <div class="further-information__toner-return">
                                <div class="checkbox--light is-initialized is-filled-in">
                                    <div class="checkbox__wrapper">
                                        <input class="checkbox__input" id="checkout-toner-return" type="checkbox" name="toner-return" value="1" />

                                        <label class="checkbox__label" for="checkout-toner-return">
                                            <span>Ich möchte Toner retournieren
                                            </span>
                                        </label>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="b2b-cart__table">
            <div class="cart-table">

                <div class="table-header">

                    <div class="table-header__column--title">

                        <h4 class="heading-counter">
                            Artikel
                            <span class="counter-bubble" data-counter="27"></span>
                        </h4>

                    </div>

                    <div class="table-header__column--buttons">

                        <button class="button-icon--icon-text-regular -icon-trash" type="button" name="refresh" value="true">
                            Warenkorb leeren
                        </button>

                        <button class="button-icon--icon-text-regular -icon-import" type="button" name="refresh" value="true">
                            CSV Importieren
                        </button>

                    </div>

                </div>
                <div class="responsive-table--first-column-mobile-full-height -spacing-large">
                    <div class="table-search" data-offset="none">
                        <div class="table-search__container">

                            <div class="text-field--light text-field-search--light is-initialized" data-disable-text-field-js>
                                <div class="text-field__wrapper text-field-search__wrapper">
                                    <input class="text-field__input text-field-search__input" id="cart-table-search" type="text" name="cart-table-search" required data-responsive-table-search="true" placeholder="Suche" />
                                    <label class="visually-hidden" for="cart-table-search">Suche</label>
                                    <button type="reset" class="text-field-search__reset"></button>
                                    <button type="submit" class="text-field-search__search"></button>
                                    <div class="text-field-search__loader ">
                                        <div class="loading-spinner -vertical -horizontal">
                                            <div class="loading-spinner__spinner--small"></div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="responsive-table__container--auto-scrollbar">
                        <table class="responsive-table__table" data-responsive-table-filter-context>
                            <colgroup>
                                <col style="">
                                <col style="">
                                <col style="72px">
                                <col style="">
                                <col style="">
                                <col style="">
                                <col style="">
                                <col style="">
                                <col style="">
                                <col style="160px">
                                <col style="64px">
                            </colgroup>
                            <thead>
                                <tr class="responsive-table__tr">
                                    <th class="responsive-table__th">
                                        <div class="responsive-table__select-all-box">
                                            <div class="checkbox--light is-initialized">
                                                <div class="checkbox__wrapper">
                                                    <input class="checkbox__input" id="multi-selection-checkbox" type="checkbox" name="&#x23;" />

                                                    <label class="checkbox__label has-empty-label" for="multi-selection-checkbox">
                                                        <span>
                                                        </span>
                                                    </label>
                                                </div>

                                            </div>
                                            <div class="responsive-table__multiselect-dropdown">
                                                <div class="dropdown">
                                                    <button type="button" class="dropdown__toggle is-thin" style="max-width: 170px;"> </button>
                                                    <div class="dropdown__content">
                                                        <div class="responsive-table__batch-operations-dropdown">
                                                            <button type="button" class="responsive-table__batch-operations-dropdown-item">
                                                                Auswahl in anderen Warenkorb kopieren
                                                            </button>
                                                            <button type="button" class="responsive-table__batch-operations-dropdown-item">
                                                                Auswahl in anderen Warenkorb verschieben
                                                            </button>
                                                            <button type="button" class="responsive-table__batch-operations-dropdown-item">
                                                                Auswahl löschen
                                                            </button>
                                                        </div>

                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </th>
                                    <th class="responsive-table__th is-right-aligned is-index-column">
                                        Pos.
                                    </th>
                                    <th class="responsive-table__th">

                                    </th>
                                    <th class="responsive-table__th">
                                        Artikel
                                    </th>
                                    <th class="responsive-table__th">
                                        Inhaltsmenge
                                    </th>
                                    <th class="responsive-table__th is-centered">
                                        Lager
                                    </th>
                                    <th class="responsive-table__th">
                                        UVP
                                    </th>
                                    <th class="responsive-table__th">
                                        Preis
                                    </th>
                                    <th class="responsive-table__th is-right-aligned">
                                        Preis Total
                                    </th>
                                    <th class="responsive-table__th is-hidden-on-desktop">
                                        Anzahl
                                    </th>
                                    <th class="responsive-table__th is-hidden-on-desktop">
                                        Aktion
                                    </th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr class="responsive-table__tr">
                                    <td class="responsive-table__td is-left is-select-td">
                                        <div class="responsive-table__td-inner-container">
                                            <div class="checkbox--light is-initialized is-filled-in">
                                                <div class="checkbox__wrapper">
                                                    <input class="checkbox__input" id="multi-select-1" type="checkbox" name="&#x23;" value="1" data-multi-selectable="true" />

                                                    <label class="checkbox__label has-empty-label" for="multi-select-1">
                                                        <span>
                                                        </span>
                                                    </label>
                                                </div>

                                            </div>
                                        </div>

                                    </td>
                                    <td class="responsive-table__td is-right-aligned is-index-td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Pos.</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    1
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-top-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title"></div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <a href="#" class="image-cell__image-link">
                                                        <div class="image ">
                                                            <picture>
                                                                <img src="/example-assets/images/responsive-table/thumb.png" class="image__img image-cell__image is-loading" alt="Alt" title="Title" srcset="/example-assets/images/responsive-table/thumb.png 1x, /example-assets/images/responsive-table/thumb.png 2x" onload="this.classList.remove('is-loading')" />
                                                            </picture>
                                                        </div>

                                                    </a>

                                                    <div class="image-cell__specials">
                                                        <div class="specials">

                                                            <div class="specials--medium-horizontally-vertically  ">
                                                                <button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
                                                                    <span class="visually-hidden">Sale</span>
                                                                    <span class="image ">
                                                                        <picture>
                                                                            <img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
                                                                        </picture>
                                                                    </span>

                                                                </button>
                                                                <button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
                                                                    <span class="visually-hidden">New</span>
                                                                    <span class="image ">
                                                                        <picture>
                                                                            <img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
                                                                        </picture>
                                                                    </span>

                                                                </button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__td-inner-container">
                                            <h5 class="item-cell__title--with-attributes">
                                                <a href="#" class="item-cell__title-link">Bosch Gepäckträgerakku PowerPack 500 Performance Anthrazit</a>
                                            </h5>
                                            <div class="attributes--small-bold">
                                                <ul class="attributes__list">
                                                    <li class="attributes__list-item">
                                                        <div class="attributes__name">Art.-Nr.</div>
                                                        <div class="attributes__value " title="56.65563">
                                                            56.65563
                                                        </div>
                                                    </li>
                                                    <li class="attributes__list-item">
                                                        <div class="attributes__name">Gruppe</div>
                                                        <div class="attributes__value " title="Bosch eBike">
                                                            Bosch eBike
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>

                                            <div class="text-field--light text-field-placeholder--light is-initialized">
                                                <div class="text-field__wrapper text-field-placeholder__wrapper ">
                                                    <input class="text-field__input text-field-placeholder__input" id="comment-1" type="text" name="comment-1" placeholder="Kommentar" />
                                                    <label class="visually-hidden" for="comment-1">Kommentar
                                                    </label>
                                                </div>

                                            </div>
                                            <div class="item-cell__value-list">
                                                <ul class="value-list">
                                                    <li class="value-list__item--info">
                                                        <div class="value-list__label">Vorgezogene Recyclinggebühren:</div>
                                                        <div class="value-list__price">

                                                            <div class="price--extra-small">

                                                                <div class="price__row">
                                                                    <div class="price__column--regular-price">
                                                                        <div class="price-regular">
                                                                            <div class="price-regular__current">
                                                                                <div class="price-regular__current-price-inner">
                                                                                    <div class="price-regular__current-currency">CHF</div>
                                                                                </div>
                                                                                <div class="price-regular__current-price-inner">
                                                                                    <div class="price-regular__current-value">4.00</div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                        </div>
                                                        <div class="value-list__tooltip">
                                                            <button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Für das Recycling.">
                                                                <span class="visually-hidden">Information</span>
                                                            </button>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>

                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Inhaltsmenge</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="wysiwyg-content">
                                                        <p>10 Artikel / Box</p>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-centered">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Lager</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="stock">
                                                        <button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar">
                                                            <span class="visually-hidden">Verfügbar</span>
                                                        </button>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">UVP</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">24.90</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Preis</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">13.50</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Preis Total</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">13.50</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Anzahl</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="quantity-switcher--light">
                                                        <button type="button" class="quantity-switcher__minus">
                                                            <span class="quantity-switcher__minus-content">–</span>
                                                        </button>
                                                        <input class="quantity-switcher__quantity" type="number" id="quantity-1-918505086" min="1" max="99" name="quantity-1" value="5" />
                                                        <label class="visually-hidden" for="quantity-1-918505086">Anzahl</label>
                                                        <input type="hidden" name="productId" value="abcdefghijk-123" />
                                                        <button type="button" class="quantity-switcher__plus">
                                                            <span class="quantity-switcher__plus-content">+</span>
                                                        </button>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Aktion</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <button class="button-icon--icon-regular -icon-trash" type="button" name="test" value="testvalue">
                                                        <span class="visually-hidden">Artikel löschen</span>
                                                    </button>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="responsive-table__tr">
                                    <td class="responsive-table__td is-left is-select-td">
                                        <div class="responsive-table__td-inner-container">
                                            <div class="checkbox--light is-initialized is-filled-in">
                                                <div class="checkbox__wrapper">
                                                    <input class="checkbox__input" id="multi-select-2" type="checkbox" name="&#x23;" value="1" data-multi-selectable="true" />

                                                    <label class="checkbox__label has-empty-label" for="multi-select-2">
                                                        <span>
                                                        </span>
                                                    </label>
                                                </div>

                                            </div>
                                        </div>

                                    </td>
                                    <td class="responsive-table__td is-right-aligned is-index-td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Pos.</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    2
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-top-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title"></div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <a href="#" class="image-cell__image-link">
                                                        <div class="image ">
                                                            <picture>
                                                                <img src="/example-assets/images/responsive-table/thumb.png" class="image__img image-cell__image is-loading" alt="Alt" title="Title" srcset="/example-assets/images/responsive-table/thumb.png 1x, /example-assets/images/responsive-table/thumb.png 2x" onload="this.classList.remove('is-loading')" />
                                                            </picture>
                                                        </div>

                                                    </a>

                                                    <div class="image-cell__specials">
                                                        <div class="specials">

                                                            <div class="specials--medium-horizontally-vertically  ">
                                                                <button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
                                                                    <span class="visually-hidden">Sale</span>
                                                                    <span class="image ">
                                                                        <picture>
                                                                            <img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
                                                                        </picture>
                                                                    </span>

                                                                </button>
                                                                <button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
                                                                    <span class="visually-hidden">New</span>
                                                                    <span class="image ">
                                                                        <picture>
                                                                            <img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
                                                                        </picture>
                                                                    </span>

                                                                </button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__td-inner-container">
                                            <h5 class="item-cell__title--with-attributes">
                                                <a href="#" class="item-cell__title-link">Bosch Gepäckträgerakku PowerPack 500 Performance Anthrazit</a>
                                            </h5>
                                            <div class="attributes--small-bold">
                                                <ul class="attributes__list">
                                                    <li class="attributes__list-item">
                                                        <div class="attributes__name">Art.-Nr.</div>
                                                        <div class="attributes__value " title="56.65563">
                                                            56.65563
                                                        </div>
                                                    </li>
                                                    <li class="attributes__list-item">
                                                        <div class="attributes__name">Gruppe</div>
                                                        <div class="attributes__value " title="Bosch eBike">
                                                            Bosch eBike
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>

                                            <div class="text-field--light text-field-placeholder--light is-initialized">
                                                <div class="text-field__wrapper text-field-placeholder__wrapper ">
                                                    <input class="text-field__input text-field-placeholder__input" id="comment-2" type="text" name="comment-2" placeholder="Kommentar" />
                                                    <label class="visually-hidden" for="comment-2">Kommentar
                                                    </label>
                                                </div>

                                            </div>
                                            <div class="item-cell__value-list">
                                                <ul class="value-list">
                                                    <li class="value-list__item--info">
                                                        <div class="value-list__label">Vorgezogene Recyclinggebühren:</div>
                                                        <div class="value-list__price">

                                                            <div class="price--extra-small">

                                                                <div class="price__row">
                                                                    <div class="price__column--regular-price">
                                                                        <div class="price-regular">
                                                                            <div class="price-regular__current">
                                                                                <div class="price-regular__current-price-inner">
                                                                                    <div class="price-regular__current-currency">CHF</div>
                                                                                </div>
                                                                                <div class="price-regular__current-price-inner">
                                                                                    <div class="price-regular__current-value">4.00</div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                        </div>
                                                        <div class="value-list__tooltip">
                                                            <button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Für das Recycling.">
                                                                <span class="visually-hidden">Information</span>
                                                            </button>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>

                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Inhaltsmenge</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="wysiwyg-content">
                                                        <p>10 Artikel / Box</p>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-centered">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Lager</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="stock">
                                                        <button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar">
                                                            <span class="visually-hidden">Verfügbar</span>
                                                        </button>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">UVP</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">24.90</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Preis</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">13.50</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Preis Total</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">13.50</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Anzahl</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="quantity-switcher--light">
                                                        <button type="button" class="quantity-switcher__minus">
                                                            <span class="quantity-switcher__minus-content">–</span>
                                                        </button>
                                                        <input class="quantity-switcher__quantity" type="number" id="quantity-1-1949934485" min="1" max="99" name="quantity-1" value="5" />
                                                        <label class="visually-hidden" for="quantity-1-1949934485">Anzahl</label>
                                                        <input type="hidden" name="productId" value="abcdefghijk-123" />
                                                        <button type="button" class="quantity-switcher__plus">
                                                            <span class="quantity-switcher__plus-content">+</span>
                                                        </button>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Aktion</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <button class="button-icon--icon-regular -icon-trash" type="button" name="test" value="testvalue">
                                                        <span class="visually-hidden">Artikel löschen</span>
                                                    </button>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="responsive-table__tr">
                                    <td class="responsive-table__td is-left is-select-td">
                                        <div class="responsive-table__td-inner-container">
                                            <div class="checkbox--light is-initialized is-filled-in">
                                                <div class="checkbox__wrapper">
                                                    <input class="checkbox__input" id="multi-select-3" type="checkbox" name="&#x23;" value="1" data-multi-selectable="true" />

                                                    <label class="checkbox__label has-empty-label" for="multi-select-3">
                                                        <span>
                                                        </span>
                                                    </label>
                                                </div>

                                            </div>
                                        </div>

                                    </td>
                                    <td class="responsive-table__td is-right-aligned is-index-td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Pos.</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    3
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-top-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title"></div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <a href="#" class="image-cell__image-link">
                                                        <div class="image ">
                                                            <picture>
                                                                <img src="/example-assets/images/responsive-table/thumb.png" class="image__img image-cell__image is-loading" alt="Alt" title="Title" srcset="/example-assets/images/responsive-table/thumb.png 1x, /example-assets/images/responsive-table/thumb.png 2x" onload="this.classList.remove('is-loading')" />
                                                            </picture>
                                                        </div>

                                                    </a>

                                                    <div class="image-cell__specials">
                                                        <div class="specials">

                                                            <div class="specials--medium-horizontally-vertically  ">
                                                                <button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
                                                                    <span class="visually-hidden">Sale</span>
                                                                    <span class="image ">
                                                                        <picture>
                                                                            <img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
                                                                        </picture>
                                                                    </span>

                                                                </button>
                                                                <button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
                                                                    <span class="visually-hidden">New</span>
                                                                    <span class="image ">
                                                                        <picture>
                                                                            <img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
                                                                        </picture>
                                                                    </span>

                                                                </button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__td-inner-container">
                                            <h5 class="item-cell__title--with-attributes">
                                                <a href="#" class="item-cell__title-link">Bosch Gepäckträgerakku PowerPack 500 Performance Anthrazit</a>
                                            </h5>
                                            <div class="attributes--small-bold">
                                                <ul class="attributes__list">
                                                    <li class="attributes__list-item">
                                                        <div class="attributes__name">Art.-Nr.</div>
                                                        <div class="attributes__value " title="56.65563">
                                                            56.65563
                                                        </div>
                                                    </li>
                                                    <li class="attributes__list-item">
                                                        <div class="attributes__name">Gruppe</div>
                                                        <div class="attributes__value " title="Bosch eBike">
                                                            Bosch eBike
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>

                                            <div class="text-field--light text-field-placeholder--light is-initialized">
                                                <div class="text-field__wrapper text-field-placeholder__wrapper ">
                                                    <input class="text-field__input text-field-placeholder__input" id="comment-3" type="text" name="comment-3" placeholder="Kommentar" />
                                                    <label class="visually-hidden" for="comment-3">Kommentar
                                                    </label>
                                                </div>

                                            </div>
                                            <div class="item-cell__value-list">
                                                <ul class="value-list">
                                                    <li class="value-list__item--info">
                                                        <div class="value-list__label">Vorgezogene Recyclinggebühren:</div>
                                                        <div class="value-list__price">

                                                            <div class="price--extra-small">

                                                                <div class="price__row">
                                                                    <div class="price__column--regular-price">
                                                                        <div class="price-regular">
                                                                            <div class="price-regular__current">
                                                                                <div class="price-regular__current-price-inner">
                                                                                    <div class="price-regular__current-currency">CHF</div>
                                                                                </div>
                                                                                <div class="price-regular__current-price-inner">
                                                                                    <div class="price-regular__current-value">4.00</div>
                                                                                </div>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>

                                                            </div>
                                                        </div>
                                                        <div class="value-list__tooltip">
                                                            <button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Für das Recycling.">
                                                                <span class="visually-hidden">Information</span>
                                                            </button>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>

                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Inhaltsmenge</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="wysiwyg-content">
                                                        <p>10 Artikel / Box</p>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-centered">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Lager</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="stock">
                                                        <button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar">
                                                            <span class="visually-hidden">Verfügbar</span>
                                                        </button>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">UVP</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">24.90</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Preis</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">13.50</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Preis Total</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container--prevent-wrap">

                                                    <div class="price--small">

                                                        <div class="price__row">
                                                            <div class="price__column--regular-price">
                                                                <div class="price-regular">
                                                                    <div class="price-regular__current">
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-currency">CHF</div>
                                                                        </div>
                                                                        <div class="price-regular__current-price-inner">
                                                                            <div class="price-regular__current-value">13.50</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>

                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Anzahl</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <div class="quantity-switcher--light">
                                                        <button type="button" class="quantity-switcher__minus">
                                                            <span class="quantity-switcher__minus-content">–</span>
                                                        </button>
                                                        <input class="quantity-switcher__quantity" type="number" id="quantity-1-1220288782" min="1" max="99" name="quantity-1" value="5" />
                                                        <label class="visually-hidden" for="quantity-1-1220288782">Anzahl</label>
                                                        <input type="hidden" name="productId" value="abcdefghijk-123" />
                                                        <button type="button" class="quantity-switcher__plus">
                                                            <span class="quantity-switcher__plus-content">+</span>
                                                        </button>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                    <td class="responsive-table__td is-right-aligned">
                                        <div class="responsive-table__mobile-container">
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__mobile-column-title">Aktion</div>
                                            </div>
                                            <div class="responsive-table__mobile-column">
                                                <div class="responsive-table__td-inner-container">
                                                    <button class="button-icon--icon-regular -icon-trash" type="button" name="test" value="testvalue">
                                                        <span class="visually-hidden">Artikel löschen</span>
                                                    </button>
                                                </div>

                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                <tr class="responsive-table__tr" data-responsive-table-filter-no-match hidden>
                                    <td class="responsive-table__td" colspan="11">
                                        <div class="wysiwyg-content">
                                            <p class="responsive-table__no-match">Keine Ergebnisse gefunden</p>
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="b2b-cart__statement-of-cost" data-b2b-cart-statement-of-cost>
            <div class="statement-of-cost">
                <ul class="statement-of-cost__list">
                    <li class="statement-of-cost__list-item">
                        <div class="statement-of-cost__title-container">
                            <div class="statement-of-cost__title">Subtotal</div>
                        </div>
                        <div class="statement-of-cost__price">

                            <div class="price--small">

                                <div class="price__row">
                                    <div class="price__column--regular-price">
                                        <div class="price-regular">
                                            <div class="price-regular__current">
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-currency">CHF</div>
                                                </div>
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-value">2'259.90</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </li>
                    <li class="statement-of-cost__list-item">
                        <div class="statement-of-cost__title-container">
                            <div class="statement-of-cost__title">Rabatt</div>
                        </div>
                        <div class="statement-of-cost__price">

                            <div class="price--small">

                                <div class="price__row">
                                    <div class="price__column--regular-price">
                                        <div class="price-regular">
                                            <div class="price-regular__current">
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-currency">CHF</div>
                                                </div>
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-value">174.00</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </li>
                    <li class="statement-of-cost__list-item">
                        <div class="statement-of-cost__title-container">
                            <div class="statement-of-cost__title">Lieferkosten</div>
                        </div>
                        <div class="statement-of-cost__price">

                            <div class="price--small">

                                <div class="price__row">
                                    <div class="price__column--regular-price">
                                        <div class="price-regular">
                                            <div class="price-regular__current">
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-currency">CHF</div>
                                                </div>
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-value">9.00</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </li>
                    <li class="statement-of-cost__list-item">
                        <div class="statement-of-cost__title-container">
                            <div class="statement-of-cost__title">Transportzuschlag Gefahrengut</div>
                            <div class="statement-of-cost__tooltip">
                                <button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Lorem ipsum dolor sit amet">
                                    <span class="visually-hidden">Information</span>
                                </button>
                            </div>
                        </div>
                        <div class="statement-of-cost__price">

                            <div class="price--small">

                                <div class="price__row">
                                    <div class="price__column--regular-price">
                                        <div class="price-regular">
                                            <div class="price-regular__current">
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-currency">CHF</div>
                                                </div>
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-value">35.00</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </li>
                    <li class="statement-of-cost__list-item">
                        <div class="statement-of-cost__title-container">
                            <div class="statement-of-cost__title">MwSt. (7.7%)</div>
                        </div>
                        <div class="statement-of-cost__price">

                            <div class="price--small">

                                <div class="price__row">
                                    <div class="price__column--regular-price">
                                        <div class="price-regular">
                                            <div class="price-regular__current">
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-currency">CHF</div>
                                                </div>
                                                <div class="price-regular__current-price-inner">
                                                    <div class="price-regular__current-value">59.00</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="sticky-toolbar">
        <div class="sticky-toolbar__container">
            <form class="cart-toolbar">
                <div class="cart-toolbar__inner-container">
                </div>
                <div class="cart-toolbar__gtc">
                    <div class="checkbox--light is-initialized is-filled-in">
                        <div class="checkbox__wrapper">
                            <input class="checkbox__input" id="gtc" type="checkbox" name="gtc" value="1" data-b2b-cart-gtc="true" />

                            <label class="checkbox__label" for="gtc">
                                <span>Ich habe meine Liste geprüft und alle Angaben sind korrekt. Ich erkläre mich mit den Datenschutzbestimmungen und AGB einverstanden.
                                </span>
                            </label>
                        </div>

                    </div>
                </div>
                <div class="cart-toolbar__inner-container">
                    <div class="cart-toolbar__label-container">
                        <span class="counter-bubble" data-counter="27"></span>
                        <div class="cart-toolbar__label">Gesamtsumme inkl. MwSt.</div>
                    </div>
                    <div class="cart-toolbar__price">

                        <div class="price--large">

                            <div class="price__row">
                                <div class="price__column--regular-price">
                                    <div class="price-regular">
                                        <div class="price-regular__current">
                                            <div class="price-regular__current-price-inner">
                                                <div class="price-regular__current-currency">CHF</div>
                                            </div>
                                            <div class="price-regular__current-price-inner">
                                                <div class="price-regular__current-value">123'456.78</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="cart-toolbar__button--right">
                        <div class="cart-toolbar__button-wrapper">
                        </div>
                        <div class="cart-toolbar__button-wrapper">
                        </div>
                        <div class="cart-toolbar__button-wrapper">
                        </div>
                        <div class="cart-toolbar__button-wrapper">
                        </div>
                        <div class="cart-toolbar__button-wrapper">
                        </div>
                    </div>
                </div>
            </form>

        </div>
    </div>
</div>
{% include '@SharedComponents/modules/b2b-checkout/templates/cart/cart.twig' %}
{
  "heading": {
    "title": "Warenkorb «Händler»",
    "level": "3",
    "image": {
      "src": "/example-assets/images/cart/dealer.svg",
      "alt": "Händler"
    }
  },
  "statementOfCost": {
    "list": [
      {
        "title": "Subtotal",
        "price": {
          "variant": "small",
          "labels": {
            "from": "ab",
            "instead": "statt"
          },
          "price": {
            "currency": "CHF",
            "price": "2'259.90"
          }
        }
      },
      {
        "title": "Rabatt",
        "price": {
          "variant": "small",
          "labels": {
            "from": "ab",
            "instead": "statt"
          },
          "price": {
            "currency": "CHF",
            "price": "174.00"
          }
        }
      },
      {
        "title": "Lieferkosten",
        "price": {
          "variant": "small",
          "labels": {
            "from": "ab",
            "instead": "statt"
          },
          "price": {
            "currency": "CHF",
            "price": "9.00"
          }
        }
      },
      {
        "title": "Transportzuschlag Gefahrengut",
        "tooltip": {
          "variant": "small",
          "title": "Information",
          "content": "Lorem ipsum dolor sit amet"
        },
        "price": {
          "variant": "small",
          "labels": {
            "from": "ab",
            "instead": "statt"
          },
          "price": {
            "currency": "CHF",
            "price": "35.00"
          }
        }
      },
      {
        "title": "MwSt. (7.7%)",
        "price": {
          "variant": "small",
          "labels": {
            "from": "ab",
            "instead": "statt"
          },
          "price": {
            "currency": "CHF",
            "price": "59.00"
          }
        }
      }
    ]
  },
  "message": {
    "closeButton": {
      "variant": "icon-regular",
      "title": "Schliessen",
      "icon": "close",
      "type": "button",
      "role": "button",
      "name": "close-big-menu",
      "value": "yes"
    },
    "variant": "error",
    "isHidden": false,
    "labels": {
      "info": "Information message",
      "error": "Error message",
      "warning": "Warning message",
      "success": "Success message"
    },
    "message": "Bitte überprüfen Sie alle erforderlichen Felder",
    "container": false
  },
  "cartTable": {
    "include": "...cart-table--with-rrp"
  },
  "deliveryAndPayment": {
    "blocks": [
      {
        "title": "Lieferadresse",
        "template": {
          "path": "b2b-checkout/components/delivery-address/delivery-address",
          "data": {
            "addressForm": {
              "variant": "full-width",
              "fields": [
                {
                  "component": "text-field",
                  "variant": "light",
                  "id": "checkout-firstName",
                  "name": "firstName",
                  "label": "Vorname",
                  "required": true,
                  "value": "",
                  "disabled": false,
                  "type": "text",
                  "autocomplete": false,
                  "error": "Dieses Feld ist erforderlich."
                },
                {
                  "component": "text-field",
                  "variant": "light",
                  "id": "checkout-lastName",
                  "name": "lastName",
                  "label": "Nachname",
                  "required": true,
                  "value": "",
                  "disabled": false,
                  "type": "text",
                  "autocomplete": false,
                  "error": "Dieses Feld ist erforderlich."
                },
                {
                  "component": "text-field-street-number",
                  "variant": "light",
                  "id": "checkout-street",
                  "name": "street",
                  "label": "Strasse",
                  "required": true,
                  "value": "",
                  "disabled": false,
                  "type": "text",
                  "autocomplete": false,
                  "error": "Dieses Feld ist erforderlich."
                },
                {
                  "component": "text-field-street-number",
                  "variant": "light",
                  "id": "checkout-street-number",
                  "name": "street-number",
                  "label": "Nr.",
                  "required": true,
                  "value": "",
                  "disabled": false,
                  "type": "text",
                  "autocomplete": false,
                  "error": "Dieses Feld ist erforderlich."
                },
                {
                  "component": "text-field-zip-city",
                  "variant": "light",
                  "id": "checkout-zip",
                  "name": "zip",
                  "label": "PLZ",
                  "required": true,
                  "value": "",
                  "disabled": false,
                  "type": "text",
                  "autocomplete": false,
                  "error": "Dieses Feld ist erforderlich."
                },
                {
                  "component": "text-field-zip-city",
                  "variant": "light",
                  "id": "checkout-city",
                  "name": "city",
                  "label": "Ort",
                  "required": true,
                  "value": "",
                  "disabled": false,
                  "type": "text",
                  "autocomplete": false,
                  "error": "Dieses Feld ist erforderlich."
                },
                {
                  "component": "select",
                  "variant": "light",
                  "id": "checkout-country",
                  "name": "country",
                  "label": "Land",
                  "required": true,
                  "disabled": false,
                  "selected": "ch",
                  "options": {
                    "ch": "Schweiz",
                    "de": "Deutschland",
                    "fr": "Frankreich",
                    "it": "Italien",
                    "li": "Lichtenstein"
                  },
                  "choose": "Bitte wählen",
                  "error": "Dieses Feld ist erforderlich."
                }
              ]
            }
          }
        }
      },
      {
        "title": "Lieferart",
        "template": {
          "path": "b2b-checkout/components/delivery-method/delivery-method",
          "data": {
            "methodSelect": {
              "variant": "light",
              "id": "checkout-delivery-method",
              "name": "delivery-method",
              "label": "",
              "required": true,
              "disabled": false,
              "selected": "postEconomy",
              "options": {
                "postEconomy": "Post Economy: CHF 9.00",
                "postSameDay": "Post Same Day: CHF 64.00"
              },
              "choose": "Please choose",
              "error": "",
              "helper": ""
            },
            "methodCost": "Portofreie Lieferung (ab CHF 50.00)",
            "methodNote": "Bestellungen bis 18 Uhr erhalten Sie am folgenden Werktag, nach 18 Uhr am übernächsten Werktag. Portofreie Lieferung ab CHF 300.00 Warenwert (exkl. MwSt).",
            "desiredDatePicker": {
              "variant": "light",
              "language": "",
              "format": "",
              "minDate": "",
              "maxDate": "",
              "id": "checkout-desired-date",
              "name": "checkout-desired-date",
              "label": "Wunschtermin",
              "type": "text",
              "value": "2021-04-09",
              "required": false,
              "disabled": false,
              "error": "",
              "helper": ""
            },
            "deliveryInformation": {
              "variant": "light",
              "id": "checkout-delivery-information",
              "name": "delivery-information",
              "label": "Lieferinformationen",
              "required": false,
              "value": "",
              "disabled": false,
              "maxlength": 100,
              "rows": 2
            }
          }
        }
      },
      {
        "title": "Zahlungsart",
        "template": {
          "path": "b2b-checkout/components/payment-method/payment-method",
          "data": {
            "methodImage": {
              "alt": "Invoice",
              "src": "/example-assets/images/payment-method/invoice.svg"
            },
            "methodSelect": {
              "variant": "light",
              "id": "checkout-payment-method",
              "name": "payment-method",
              "required": true,
              "disabled": false,
              "selected": "invoice",
              "options": {
                "invoice": "Rechnung",
                "cashOnDelivery": "Nachnahme"
              },
              "choose": "Please choose",
              "error": "",
              "helper": ""
            },
            "billingAddress": {
              "title": "Rechnungsadresse",
              "company": "Speedy Gonzales GmbH",
              "firstName": "Daniel",
              "lastName": "Downhill",
              "street": "Im Grip",
              "streetNo": "10",
              "zip": "4242",
              "city": "Laufen",
              "country": "Schweiz"
            },
            "promoCode": {
              "variant": "light",
              "id": "checkout-promo-code",
              "name": "promo-code",
              "label": "Promo Code",
              "required": false,
              "value": "",
              "disabled": false,
              "type": "text",
              "autocomplete": "",
              "error": "",
              "helper": ""
            }
          }
        }
      },
      {
        "title": "Optionale Angaben",
        "template": {
          "path": "b2b-checkout/components/further-information/further-information",
          "data": {
            "ownOrderNo": {
              "variant": "light",
              "id": "checkout-own-order-no",
              "name": "own-order-no",
              "label": "Eigene Bestellnummer",
              "required": false,
              "value": "",
              "disabled": false,
              "type": "text",
              "autocomplete": "",
              "error": "",
              "helper": ""
            },
            "comment": {
              "variant": "light",
              "id": "checkout-comment",
              "name": "comment",
              "label": "Bemerkung",
              "required": false,
              "value": "",
              "disabled": false,
              "maxlength": 100,
              "rows": 2,
              "error": "",
              "helper": ""
            },
            "tonerReturn": {
              "variant": "light",
              "id": "checkout-toner-return",
              "name": "toner-return",
              "label": "Ich möchte Toner retournieren",
              "value": "1",
              "required": false,
              "disabled": false,
              "checked": false,
              "error": "",
              "helper": ""
            }
          }
        }
      }
    ]
  },
  "checkoutToolbar": {
    "toolbar": {
      "gtc": {
        "variant": "light",
        "id": "gtc",
        "name": "gtc",
        "label": "Ich habe meine Liste geprüft und alle Angaben sind korrekt. Ich erkläre mich mit den Datenschutzbestimmungen und AGB einverstanden.",
        "value": "1",
        "required": false,
        "disabled": false,
        "checked": false,
        "error": "",
        "helper": "",
        "attributes": {
          "data-b2b-cart-gtc": "true"
        }
      },
      "counterBubble": "27",
      "totalLabel": "Gesamtsumme inkl. MwSt.",
      "price": {
        "variant": "large",
        "labels": {
          "from": "ab",
          "instead": "statt"
        },
        "price": {
          "currency": "CHF",
          "price": "123'456.78"
        }
      },
      "rightButton": {
        "variant": "primary",
        "type": "button",
        "role": "submit",
        "title": "Jetzt kaufen",
        "disabled": false
      }
    }
  }
}
  • Content:
    import './cart.scss';
    import Cart, {selector as sel} from 'cando-cx-components-library/components/modules/b2b-checkout/templates/cart/cart';
    
    export default Cart;
    export const selector = sel;
  • URL: /components/raw/b2b-cart-template/cart.js
  • Filesystem Path: src/components/modules/b2b-checkout/templates/cart/cart.js
  • Size: 191 Bytes
  • Content:
    @import "~shared/base";
    @import "~cando-cx-components-library/components/modules/b2b-checkout/templates/cart/cart";
  • URL: /components/raw/b2b-cart-template/cart.scss
  • Filesystem Path: src/components/modules/b2b-checkout/templates/cart/cart.scss
  • Size: 115 Bytes

No notes defined.