.button-row {
  display: flex;
  gap: 10px;
  align-items: center;
}

.tab {
  background-color: #04AA6D;
  border: black, 4px, solid;
  cursor: pointer;
  border-radius: 8px;
  color: white;
  margin: 8px;
  padding: 2px;
}

.button {
  background-color: #04AA6D;
  color: white;
  padding: 14px 20px;
  margin: 8px;
  
  border: black, 4px, solid;
  cursor: pointer;
  width: 100%;
}

/*/* Add a hover effect for buttons */
.button:hover {
  opacity: 0.8;
}

.tab:hover {
  opacity: 0.6;
}



.round {
   border-radius: 12px;
}




.blue {
  background-color: blue;
  border-radius: 12px;
}

.orange {
  background-color: orange;
  border-radius: 12px;
}

.brown {
  background-color: sandybrown;
}
.purple {
  background-color: purple;
}


.button-wrapper {
  padding: 15px;

}


.table-btn { 
  padding: 4px 10px; 
  font-size: 0.875rem; 
  border: 2px solid #ccc; 
  border-radius: 4px; 
  background: #f5f5f5; 
  cursor: pointer; 
} 
.table-btn:hover { background: #e5e5e5; }