.container {
    max-width: 1000px;
    margin: 3rem auto; /* Added margin for spacing */
    padding: 2rem; /* Fixed padding */
    background-color: #ffffff;
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05); /* Softer shadow */
  }
  
  table {
    width: 100%;
    border-collapse: collapse;
    background-color: #fafafa; /* Light background for table */
    border-radius: 6px;
    overflow: hidden;
  }
  
  th, td {
    padding: 14px 16px; /* More space */
    text-align: left;
    border-bottom: 1px solid #e0e0e0; /* Lighter border */
    font-size: 15px;
    color: #333;
  }
  
  th {
    background-color: #f2f4f6; /* Softer header background */
    font-weight: 600;
  }
  
  tr:hover {
    background-color: #f5f5f5; /* Hover effect for rows */
  }
  
  .btn-delete {
    background-color: white;
    color: #ffffff;
    border: none;
    padding: 8px 14px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 14px;
    transition: background-color 0.3s ease;
  }
  
  .btn-delete:hover {
    background-color: white;
  }
  .icon-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
    margin: 0 5px;
    vertical-align: middle;
  }
  .icon-btn svg {
    width: 20px;
    height: 20px;
    fill: #555;
    transition: fill 0.2s;
  }
  .icon-btn:hover svg {
    fill: #007BFF;
  }