Измените классы и имена полей формы оформления заказа

Я пытаюсь понять, как настроить форму оформления заказа, изменив классы, потому что я хочу стилизовать ее с помощью начальной загрузки вместо стилей Magento по умолчанию. Я нигде не вижу, чтобы они были определены, и, читая и просматривая документацию разработчика Magento, похоже, что они динамически генерируются http://devdocs.magento.com/guides/v2.0/howdoi/checkout/checkout_new_field.html Но в этой документации не похоже, что есть какой-либо способ добавления пользовательских классов к элементам оболочки или чего-либо еще.

Это вывод по умолчанию для первого имени:

<div class="field _required" data-bind="visible: visible, attr: {'name': element.dataScope}, css: additionalClasses" name="billingAddresscheckmo.firstname">

    <label class="label" data-bind="attr: { for: element.uid }" for="DPGHTAP">
        <!-- ko if: element.label -->
        <span data-bind="text: element.label">First Name</span>
        <!-- /ko -->
    </label>

    <div class="control" data-bind="css: {'_with-tooltip': element.tooltip}">
        <!-- ko ifnot: element.hasAddons() -->
            <!-- ko template: element.elementTmpl -->
<input class="input-text" type="text" data-bind="
    value: value,
    valueUpdate: 'keyup',
    hasFocus: focused,
    attr: {
        name: inputName,
        placeholder: placeholder,
        'aria-describedby': noticeId,
        id: uid,
        disabled: disabled
    }" name="firstname" placeholder="" aria-describedby="notice-DPGHTAP" id="DPGHTAP">
<!-- /ko -->
        <!-- /ko -->

        <!-- ko if: element.hasAddons() --><!-- /ko -->

        <!-- ko if: element.tooltip --><!-- /ko -->

        <!-- ko if: element.notice --><!-- /ko -->

        <!-- ko if: element.error() --><!-- /ko -->

        <!-- ko if: element.warn() --><!-- /ko -->
    </div>
</div>

Я бы предпочел, чтобы результат был похож на этот:

<div class="form-group field _required" data-bind="visible: visible, attr: {'name': element.dataScope}, css: additionalClasses" name="billingAddresscheckmo.firstname">

    <label class="label" data-bind="attr: { for: element.uid }" for="DPGHTAP">
        <!-- ko if: element.label -->
        <span data-bind="text: element.label">First Name</span>
        <!-- /ko -->
    </label>

    <div class="control" data-bind="css: {'_with-tooltip': element.tooltip}">
        <!-- ko ifnot: element.hasAddons() -->
            <!-- ko template: element.elementTmpl -->
<input class="form-control input-text" type="text" data-bind="
    value: value,
    valueUpdate: 'keyup',
    hasFocus: focused,
    attr: {
        name: inputName,
        placeholder: placeholder,
        'aria-describedby': noticeId,
        id: uid,
        disabled: disabled
    }" name="firstname" placeholder="" aria-describedby="notice-DPGHTAP" id="DPGHTAP">
<!-- /ko -->
        <!-- /ko -->

        <!-- ko if: element.hasAddons() --><!-- /ko -->

        <!-- ko if: element.tooltip --><!-- /ko -->

        <!-- ko if: element.notice --><!-- /ko -->

        <!-- ko if: element.error() --><!-- /ko -->

        <!-- ko if: element.warn() --><!-- /ko -->
    </div>
</div>

Обратите внимание, как теперь есть form-group и form-control добавлен класс.

Как это сделать, если все генерируется динамически?