@import "~/../../../../../src/index.scss";

.status-grid {
  margin-top: .625rem;
  // --bs-gutter-x: 0rem !important;
  margin-bottom: 0.625rem;
}

// .table-container {
//   // height: 60.5vh;
//   overflow: auto;
// }

.grid-item {
  padding: .625rem;
  border: .0625rem solid #ddd;
  text-align: center;
}

.header {
  background-color: #3498db;
  color: #fff;
  border-left: 0.5px solid #ddd;
  border-right: 0.5px solid #ddd;
  padding-left: .625rem;
  padding-right: .625rem;
  padding-top: .9375rem;
  padding-bottom: .9375rem;
  align-items: center;
  display: flex;
  justify-content: center;
}

.header-2 {
  background-color: #fff;
  color: #000;
  border-left: 0.5px solid #ddd;
  border-right: 0.5px solid #ddd;
  padding-left: .625rem;
  padding-right: .625rem;
  padding-top: .9375rem;
  padding-bottom: .9375rem;
  font-size: .875rem;
  font-weight: 600;
  text-align: center;
}

.header-3 {
  background-color: #d0d9de;
  color: #000;
  padding-left: .625rem;
  padding-right: .625rem;
  padding-top: .9375rem;
  padding-bottom: .9375rem;
  align-items: flex-start;
  display: flex;
  justify-content: center;
  flex-direction: column;
  flex: 1;
}

.header-4 {
  background-color: #8992c7;
  color: #000;
  padding-left: .625rem;
  padding-right: .625rem;
  padding-top: .9375rem;
  padding-bottom: .9375rem;
  margin-left: -0.3125rem;
  margin-right: -0.3125rem;
  font-size: 0.85rem;
  font-weight: 600;
}

td {
  max-width: 9.375rem;
  overflow: hidden;
}

.my-row {
  font-size: .75rem;
  font-weight: 500;
  vertical-align: middle;

  // max-height: 3.6em;
  position: relative;
}

.my-row-status {

  text-align: center;
  vertical-align: middle;
  font-size: 0.75rem;

  .icon {
    font-size: 0.75rem;
    font-weight: 500;
  }
}

.ellipsis-text {
  white-space: normal;
  margin: 0;
  line-height: 1.9em;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.my-row:hover .ellipsis-text {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  display: block;
}

.no-data {
  align-items: center;
  display: flex;
  justify-content: center;
  font-weight: bolder;
  font-size: 1.25rem;
}

.table> :not(caption)>*>* {
  background-color: #29b5ea17;
}