<div class="tab-pane fade show active" id="tab-domains" role="tabpanel" aria-labelledby="tab-domains">
  <div class="card mb-4">
    <div class="card-header d-flex fs-5">
      <button class="btn d-sm-block d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-domains" data-bs-toggle="collapse" aria-controls="collapse-tab-domains">
        {{ lang.mailbox.domains }} <span class="badge bg-info table-lines"></span>
      </button>
      <span class="d-none d-md-block">{{ lang.mailbox.domains }} <span class="badge bg-info table-lines"></span></span>
      
      <div class="btn-group ms-auto d-flex">
        <button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_domain_table" data-table="domain_table">{{ lang.admin.refresh }}</button>
      </div>
    </div>
    <div id="collapse-tab-domains" class="card-body collapse show" data-bs-parent="#mail-content">
      {#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}      
      <div class="mass-actions-mailbox mb-4 d-none d-sm-block">
        <div class="btn-group">
          <button class="btn btn-sm btn-xs-half btn-secondary" id="toggle_multi_select_all" data-id="domain" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</button>
          <button class="btn btn-sm btn-xs-half btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</button>
          <ul class="dropdown-menu">
            {% if mailcow_cc_role == 'admin' %}
              <li><a class="dropdown-item" data-action="edit_selected" data-id="domain" data-api-url='edit/domain' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
              <li><a class="dropdown-item" data-action="edit_selected" data-id="domain" data-api-url='edit/domain' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
              <li><hr class="dropdown-divider"></li>
              <li><a class="dropdown-item" data-action="delete_selected" data-id="domain" data-api-url='delete/domain' href="#">{{ lang.mailbox.remove }}</a></li>
              <li class="table_collapse_option"><hr class="dropdown-divider"></li>
            {% endif %}
            <li class="table_collapse_option"><a class="dropdown-item" data-datatables-expand="domain_table">{{ lang.datatables.expand_all }}</a></li>
            <li class="table_collapse_option"><a class="dropdown-item" data-datatables-collapse="domain_table">{{ lang.datatables.collapse_all }}</a></li>
          </ul>
          {% if mailcow_cc_role == 'admin' %}
          <button class="btn btn-sm btn-success" data-bs-toggle="modal" data-bs-target="#addDomainModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_domain }}</button>
          {% endif %}
        </div>
      </div>
      <table id="domain_table" class="table table-striped dt-responsive w-100"></table>
      <div class="mass-actions-mailbox mt-4">
        <div class="btn-group">
          <button class="btn btn-sm btn-xs-lg btn-xs-half btn-secondary" id="toggle_multi_select_all" data-id="domain" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</button>
          <button class="btn btn-sm btn-xs-lg btn-xs-half btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</button>
          <ul class="dropdown-menu">
            {% if mailcow_cc_role == 'admin' %}
              <li><a class="dropdown-item" data-action="edit_selected" data-id="domain" data-api-url='edit/domain' data-api-attr='{"active":"1"}' href="#">{{ lang.mailbox.activate }}</a></li>
              <li><a class="dropdown-item" data-action="edit_selected" data-id="domain" data-api-url='edit/domain' data-api-attr='{"active":"0"}' href="#">{{ lang.mailbox.deactivate }}</a></li>
              <li><hr class="dropdown-divider"></li>
              <li><a class="dropdown-item" data-action="delete_selected" data-id="domain" data-api-url='delete/domain' href="#">{{ lang.mailbox.remove }}</a></li>
              <li class="table_collapse_option"><hr class="dropdown-divider"></li>
            {% endif %}
            <li class="table_collapse_option"><a class="dropdown-item" data-datatables-expand="domain_table">{{ lang.datatables.expand_all }}</a></li>
            <li class="table_collapse_option"><a class="dropdown-item" data-datatables-collapse="domain_table">{{ lang.datatables.collapse_all }}</a></li>
          </ul>
          {% if mailcow_cc_role == 'admin' %}
            <button class="btn btn-sm btn-xs-lg btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addDomainModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_domain }}</button>
          {% endif %}
        </div>
      </div>
    </div>
  </div>
</div>