.borderless-custom {
  border-collapse: separate;
  border-spacing: 4px;
}

.custom-cell {
  height: 3.4rem; /* increased height for better fill */
  background-color: #f8f9fa;
  border: 1px solid #ced4da;
  border-radius: 0.3rem;
}


div[style*="background-color: black"] .custom-cell {
  background-color: #343a40;
}


/* Override custom cell color inside grey box */
.pure-white {
  background-color: #ffffff !important;
}


.middle-section-container {
  display: flex;
  gap: 1rem;
  height: 49vh;
  width: 100%;
}

/* Desktop view (default) */
.main-table {
  width: 60%;
}

.transaction-summary {
  width: 40%;
}

.borderless-custom {
  border-collapse: separate;
  border-spacing: 4px;
}

.custom-cell {
  height: 3.4rem;
  background-color: #f8f9fa;
  border: 1px solid #ced4da;
  border-radius: 0.3rem;
}

div[style*="background-color: black"] .custom-cell {
  background-color: #343a40;
}

.pure-white {
  background-color: #ffffff !important;
}

/* Responsive layout for tablet and mobile */
@media (max-width: 800px) {
  .middle-section-container {
    flex-direction: column;
    align-items: center;
    height: auto;
    overflow-y: auto;
    padding-bottom: 1rem;
  }

  .transaction-summary,
  .main-table {
    width: 80% !important;
    margin-bottom: 1rem;
  }
}
