body {
    font-family: Arial, sans-serif;
    margin: 20px;
    text-align: center;
}
h1 {
    text-align: center;
}
form {
    margin-bottom: 20px;
    text-align: center;
}
table {
    width: 100%;
    border-collapse: collapse;
}
/* Контейнер пагинации */
#pagination {
    position: sticky;    /* Фиксируется в верхней части окна */
    top: 0;
    background-color: #f2f2f2;
    z-index: 2;
    padding: 10px;
    padding-bottom: 14px;
    display: flex;       /* Для горизонтального выравнивания */
    gap: 10px;           /* Расстояние между кнопками */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  
  /* Таблица и фиксированный заголовок */
  table {
    width: 100%;
    border-collapse: collapse;
  }
  
  thead th {
    position: sticky;
    top: 50px;           /* Отступ вниз, чтобы не перекрывать #pagination */
    background-color: #9a9c98;
    z-index: 2;
    text-align: left;
    padding: 8px;
    border-bottom: 1px solid #ddd;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }
  
  /* Пример общего стиля ячеек */
  tbody td {
    padding: 8px;
    border-bottom: 1px solid #ddd;
  }
  
  /* Пример стилизации кнопок пагинации */
  .button {
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 6px 12px;
    cursor: pointer;
    border-radius: 4px;
  }
  #pagination button:hover {
    background-color: #0069d9;
  }

#shipmentCount {
    text-align: left;
    padding: 5px;
}  

th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: center;
    transition: all 0.1s ease 0.5s;

}
/* Подсветка при наведении (не обязательно) */
tbody tr:hover {
    background-color: #d9f09e;
    transition: all 0.1s ease 0.5s;

}
/* Цвет фона по умолчанию */
.default {
    background-color: #ffffff;
}
/* Цвет для чередующихся строк */
.alternate {
    background-color: #eef7ff;
}

.spinner {
    margin: 0 auto;
    width: 48px;
    height: 48px;
    border: 6px solid #ccc;
    border-top-color: #007bff; /* синий верх */
    border-radius: 50%;
    animation: spin 1s linear infinite;
  }
  
  /* Анимация вращения */
  @keyframes spin {
    to { transform: rotate(360deg); }
  }
  select {
    width: 200px;
  }