
.member-table {
  width: 100%;
  border-collapse: collapse; 
  border: none;       
}


.member-table th,
.member-table td {
  border: none;            
  padding: 8px 12px;        }

.member-table th {
  color: #535953;
  font-family: "Hanken Grotesk";
  font-size: 9px;
  font-weight: 600;
  line-height: normal;
  border: none; 
 
} 

.member-table th:nth-child(3),
.member-table td:nth-child(3) {
  width: 150px;           /* whatever you need */
}

/* prevent wrapping in that email cell */
.member-table td:nth-child(3) .detail {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; /* optional, will show “…” if it overflows */
} 

.column-counter {
  color: #535953;
  font-family: "Hanken Grotesk";
  font-size: 6px;
  font-weight: 400;
  line-height: normal;
}
.member-name {
  color: #000;
  font-family: "Hanken Grotesk";
  font-size: 10.5px;
  font-weight: 600;
  line-height: normal; 
}
.member-tag {
  display: flex;
  width: 42px;
  height: 12px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  border-radius: 3px;
  background: #99D6EA;
  font-family: "Hanken Grotesk";
  font-size: 6px;
  line-height: normal;
}
.status-tag {
  display: flex;
  width: 65.25px;
  height: 13.5px;
  flex-direction: column;
  justify-content: center;
  flex-shrink: 0;
  text-align: center;
  font-family: "Hanken Grotesk";
  font-size: 10.5px;
  font-weight: 400;
  line-height: normal;
}
.status-tag.active {
  color: #419D4B;
}
.status-tag.inactive {
  color: #E42929;
}
.detail {
  display: flex;
  width: 104px;
  height: 15px;
  flex-direction: column;
  justify-content: center;
  flex-shrink: 0;
  color: #000;
  text-align: center;
  font-family: "Hanken Grotesk";
  font-size: 10.5px;
  font-weight: 400;
  line-height: normal;
}
.payment-tag {
  display: flex;
  width: 48px;
  height: 18px;
  padding: 6px 12px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  border-radius: 11.25px;
  font-family: "Hanken Grotesk";
  font-size: 7.5px;
  font-weight: 600;
  line-height: normal;
}
.payment-tag.paid {
  background: #A4DEAA;
  color: #077712;
}
.payment-tag.due {
  background: #DEA4A4;
  color: #E60000;
}
.btn {
  display: flex;
  width: 120px;
  height: 24px;
  padding: 6px 12px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  font-family: "Hanken Grotesk";
  font-size: 10.5px;
  font-weight: 500;
  line-height: normal;
  cursor: pointer;
}
.btn-invoice {
  width: auto !important;
  height: 40px !important;
  padding: 0 20px !important;
  border-radius: 30px !important;
  border: 1.5px solid #1B459C !important;
  background: transparent !important;
  color: #1B459C !important;
  font-size: 16px !important;
  line-height: 1 !important;
} 
.btn-reminder {
  display: flex;
  width: 120px;
  height: 24px;
  padding: 6px 12px 6px 3px;
  justify-content: center;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  border-radius: 30px;
  background: #1B459C;
  color: #FFF;
  font-family: "Hanken Grotesk";
  font-size: 10.5px;
  font-weight: 500;
  line-height: normal;
}
