<div class="card a-accordion-card a-collapsePanel {{{ styleModifier }}}">
  <div class="card-header a-js-index-heading a-collapsePanel-heading collapsed {{isExpanded}}" id="{{ collapse-panel-header-id }}" role="tab">
    <a href="#" data-toggle="collapse" data-target="#{{{ collapseID }}}" aria-expanded="false" aria-controls="{{ collapseID }}">
      {{# collapseHeader }}
        {{> felles-komponenter-ikon-tekst }}
      {{/ collapseHeader }}
    </a>
  </div>
  <div id="{{ collapseID }}" class="a-collapsePanel-body collapse {{{ isVisibleFromStart }}}" {{# dataParent }}data-parent="{{{dataParent}}}"{{/ dataParent }} role="tabpanel" aria-labelledby="{{ collapse-panel-header-id }}">
    <div class="a-collapsePanel-body-content">
      {{# my-contact-for }}
        <div id="myContactFor">
          <div class="row">
            <div class="col-12">
              <h3 class="a-fontBold a-fontSizeM">
                {{ header }}
              </h3>
            </div>
            <div class="col-12 col-md-4 mb-1 mb-lg-0">
              {{# first-input }}
                {{> felles-komponenter-tekst-input }}
              {{/ first-input }}
              {{# first-input-varsel }}
                {{> felles-komponenter-varsel:mt-0 }}
              {{/ first-input-varsel }}
            </div>
            <div class="col-12 col-md-8">
              {{# second-input }}
                {{> felles-komponenter-tekst-input }}
              {{/ second-input }}
              {{# second-input-varsel }}
                {{> felles-komponenter-varsel:mt-0 }}
              {{/ second-input-varsel }}
            </div>
          </div>
          <div class="row">
            <div class="col mt-2">
              {{# link }}
                {{> felles-komponenter-link }}
              {{/ link }}
            </div>
          </div>
          <div class="row">
            <div class="col mt-3">
              {{# save-btn }}
                {{> felles-komponenter-knapp }}
              {{/ save-btn }}
            </div>
          </div>
        </div>
      {{/ my-contact-for }}

      {{# my-alert-settings }}
        <div id="myAlertSettings" style="display: none">
          <div class="row">
            <div class="col-12">
              <h3 class="a-fontBold a-fontSizeM">
                {{ header }}
              </h3>
            </div>
          </div>
          <div class="row">
            <div class="col-12">
              {{# checkbox }}
                {{> felles-komponenter-avkrysningsboks }}
              {{/ checkbox }}
            </div>
          </div>
          <div class="row">
            <div class="col mt-2">
              {{# link }}
                {{> felles-komponenter-link }}
              {{/ link }}
            </div>
          </div>
          <div class="row">
            <div class="col mt-3">
              {{# save-btn }}
                {{> felles-komponenter-knapp }}
              {{/ save-btn }}
              {{# cancel-btn }}
                {{> felles-komponenter-link }}
              {{/ cancel-btn }}
            </div>
          </div>
        </div>
      {{/ my-alert-settings }}

      {{# alerts-individual-services }}
        <div id="alertsIndividualServices" style="display: none">
          {{> organismer-varsling-enkelttjenester }}
        </div>
      {{/ alerts-individual-services }}
    </div>
  </div>
</div>
