<div class="b2b-cart">
    <div class="b2b-cart__container">
        <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__customer-switch">
                                <div class="customer-switch">
                                    <div class="customer-switch__item">
                                        <div class="customer-switch__title">99999 - Administration</div>
                                        <a href="#" class="customer-switch__link">Kundennummer wechseln</a>
                                    </div>
                                    <div class="customer-switch__item">
                                        <div class="customer-switch__title">98765 - Filiale Schaffhausen</div>
                                        <a href="#" class="customer-switch__link">Kostenstelle wechseln</a>
                                    </div>
                                </div>
                            </div>
                            <div class="delivery-address__own-cost-center-reference">
                                <div class="text-field--light is-initialized">
                                    <div class="text-field__wrapper">
                                        <input class="text-field__input" id="checkout-own-cost-center-reference" type="text" name="checkout-own-cost-center-reference" />
                                        <label class="text-field__label" for="checkout-own-cost-center-reference">Kostenstellen-Referenz
                                        </label>
                                    </div>

                                </div>
                            </div>
                            <div class="delivery-address__address">
                                <address class="address">
                                    <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>
                                    <a href="#" class="address__address-link">Lieferadresse ändern</a>
                                </address>
                            </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-centered 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>

                                    </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--offline" data-info-tooltip-content="Information derzeit nicht abrufbar">
                                                            <span class="visually-hidden">Information derzeit nicht abrufbar</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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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-517748292" min="1" max="99" name="quantity-1" value="5" />
                                                        <label class="visually-hidden" for="quantity-1-517748292">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>

                                    </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--offline" data-info-tooltip-content="Information derzeit nicht abrufbar">
                                                            <span class="visually-hidden">Information derzeit nicht abrufbar</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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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-1995813028" min="1" max="99" name="quantity-1" value="5" />
                                                        <label class="visually-hidden" for="quantity-1-1995813028">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>

                                    </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--offline" data-info-tooltip-content="Information derzeit nicht abrufbar">
                                                            <span class="visually-hidden">Information derzeit nicht abrufbar</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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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__status-container">
                                                            <button type="button" class="price__offline" data-info-tooltip-content="Nicht abrufbar.">
                                                                <span class="visually-hidden">Nicht abrufbar.</span>
                                                            </button>
                                                        </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-444836886" min="1" max="99" name="quantity-1" value="5" />
                                                        <label class="visually-hidden" for="quantity-1-444836886">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>
</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": null,
  "cartTable": {
    "include": "...cart-table--lost-connection"
  },
  "deliveryAndPayment": {
    "blocks": [
      {
        "title": "Lieferadresse",
        "template": {
          "path": "b2b-checkout/components/delivery-address/delivery-address",
          "data": {
            "address": {
              "company": "Speedy Gonzales GmbH",
              "firstName": "Daniel",
              "lastName": "Downhill",
              "street": "Im Grip",
              "streetNo": "10",
              "zip": "4242",
              "city": "Laufen",
              "country": "Schweiz",
              "link": {
                "title": "Lieferadresse ändern",
                "href": "#"
              }
            },
            "customerSwitch": {
              "list": [
                {
                  "title": "99999 - Administration",
                  "link": {
                    "href": "#",
                    "title": "Kundennummer wechseln"
                  }
                },
                {
                  "title": "98765 - Filiale Schaffhausen",
                  "link": {
                    "href": "#",
                    "title": "Kostenstelle wechseln"
                  }
                }
              ]
            },
            "ownCostCenterReference": {
              "variant": "light",
              "id": "checkout-own-cost-center-reference",
              "name": "checkout-own-cost-center-reference",
              "label": "Kostenstellen-Referenz",
              "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": null
}
  • 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.