/* Custom styles to enhance the look and feel of the application */
body {
  margin: 0;
  padding: 0;
  /* Soft gradient background for modern aesthetic */
  background: linear-gradient(135deg, #f0f4fd 0%, #f8fbff 100%);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: #333;
}

/* Style the search input specifically */
#searchInput {
  border-radius: 2rem;
  padding: 0.75rem 1rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  transition: box-shadow 0.2s ease;
}

#searchInput:focus {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-color: #86b7fe;
}

/* Table wrapper for subtle card-like appearance */
.table-responsive {
  background-color: #ffffff;
  border-radius: 0.5rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

/* Hover animation for table rows */
table.table tbody tr {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

table.table tbody tr:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06);
}

/* Ensure the table cells have consistent padding */
table.table thead th,
table.table tbody td {
  vertical-align: middle;
}