.tabulator {
    font-size: small;
}
.tabulator-row .tabulator-cell {
    border-right: 1px solid #3274ac;
}
.tabulator-row.tabulator-selectable:hover {
    background-color: #3274ac3d;
    }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element {
    border-right: 1px solid #3274ac;
}
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover {
    background-color: #3274ac3d;
}

/* Modal background */
  .w3-modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5); /* dark overlay */
  }

  /* Modal content box */
  .w3-modal-content {
    background-color: #fff;
    margin: 10% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 50%; /* Adjust width as needed */
    border-radius: 8px;
  }

  /* Close button */
  .w3-button {
    font-size: 20px;
    cursor: pointer;
  }

  /* Progress bar container */
.loading-bar {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.2);
  padding: 20px;
  border-radius: 5px;
  width: 250px;
}

.progress-container {
  width: 100%;
  background-color: #f3f3f3;
  border-radius: 5px;
  height: 20px;
  margin: 10px 0;
}

.progress {
  width: 0%;
  height: 100%;
  background-color: #3498db;
  border-radius: 5px;
}

#progress-text {
  font-size: 14px;
  color: #333;
}