/* stylelint-disable max-nesting-depth, selector-max-compound-selectors, selector-no-qualifying-type, selector-max-id, scss/at-extend-no-missing-placeholder, property-no-vendor-prefix */

#{civi-page('batch')} {
  .action-link {
    margin: 20px 0;
  }

  .crm-batch-search-form-block {
    border-radius: $panel-border-radius !important;

    table.form-layout-compressed {
      tr {
        td {
          padding: 20px;
          vertical-align: top;
        }
      }
    }
  }

  .crm-batch-search-form-block,
  .CRM_Batch_Form_Batch {
    div.messages {
      margin: 0 20px;
    }

    table tr td {
      .crm-button {
        i {
          top: 7px;
        }

        .crm-form-submit {
          padding: 8px 0 8px 12px;
        }
      }
    }
  }

  .dataTables_wrapper {
    border-radius: $panel-border-radius;
    box-shadow: $box-shadow;

    table thead {
      border-top: 0 !important;
    }

    .crm-datatable-pager-top {
      border-radius: $panel-border-radius $panel-border-radius 0 0;
    }

    .crm-datatable-pager-bottom,
    .crm-datatable-pager-top {
      display: flex;
      padding: 10px 15px;

      &.crm-datatable-pager-top {
        background: $crm-accordion-header-color;
      }

      .dataTables_paginate {
        float: right;
        width: 50% !important;
      }

      .dataTables_length,
      .dataTables_info {
        float: left;
        line-height: 25px;
        padding: 0;
        position: relative;
        top: 3px;
        width: 49%;
      }
    }

    .crm-datatable-pager-bottom {
      border-radius: 0 0 $panel-border-radius $panel-border-radius;

      .dataTables_info {
        color: $gray-darker;
      }
    }

    .dataTable {
      box-shadow: none !important;
    }

    thead {
      border-top: 1px solid $crm-grayblue-dark;
    }
  }
}

#{civi-page('batch')} #Batch {
  .crm-submit-buttons {
    border: 0;
  }

  .crm-batch-form-block {
    box-shadow: none;
  }
}

#{civi-page('batch-entry')} #crm-main-content-wrapper {
  padding-top: 5.5em;

  .CRM_Batch_Form_Entry {
    background: $crm-white;
    border-radius: $panel-border-radius;
    box-shadow: $crm-form-layout-shadow;
    padding: 0;
    position: relative;
  }

  .help {
    position: absolute;
    top: -5.6em;
  }

  .crm-button_qf_Entry_upload_force-save {
    margin: 0 15px;
  }

  .status {
    margin: 5px 15px;
  }

  #crm-batch-entry-table {
    border-color: $crm-background;
    display: block;
    margin: 0 !important;
    overflow-x: auto;
    width: 100%;
  }

  table {
    border: 0 !important;
  }

  .form-layout-compressed {
    margin: 0 15px 20px;

    .label {
      color: $crm-copy;
      font-size: $font-size-base;
    }

    td.right {
      color: $crm-copy;
      vertical-align: middle;
    }
  }

  .crm-grid-table {
    border: 0;

    .crm-grid-header {
      border-bottom: 1px solid $crm-grayblue-dark;
      border-top: 1px solid $crm-grayblue-dark;

      .crm-grid-cell {
        background: $gray-lighter;
        border: 0;
        color: $gray-darker;
        font-size: $font-size-base;
        font-weight: $crm-font-weight-h3;
        line-height: 18px;
        padding: 12px 10px;
        vertical-align: top;

        &:first-child {
          min-width: 10px;
        }
      }
    }

    .crm-grid-row {
      background: $crm-white;
      border-bottom: 1px solid $crm-background;

      .crm-grid-cell {
        border: 0;
        padding: 10px;

        span.batch-edit,
        span.batch-valid,
        span.batch-invalid {
          line-height: 30px;
        }

        .crm-form-date-wrapper {
          display: inline-block;
          // Necessary to make sure the calendar icon addon has enough
          // space to be displayed next to the input field
          width: 255px;
        }
      }

      input.dateplugin {
        width: 85px !important;
      }

      [class*='crm-batch-join_date-'],
      [class*='crm-batch-membership_'] {
        display: block;
        width: $crm-table-label-column-width !important;

        .crm-clear-link {
          margin-left: -5px !important;
          padding: 4px 0;
        }
      }
    }
  }

  .crm-submit-buttons {
    height: auto;
    margin: 20px 0 15px;
    padding: 0 15px;
  }
}