@media only screen and (max-width: 600px) {
    table.dataTable td:first-child,
    table.dataTable th:first-child {
      white-space: normal;
      word-wrap: break-word;
      /* overflow-wrap: break-word; */
      max-width: 300px; /* Keep the column from expanding too much */
    }
  }
  
  /* For tablet sizes (including iPad portrait, ~600px to 1024px) */
  @media only screen and (min-width: 601px) and (max-width: 1024px) {
    table.dataTable td:first-child,
    table.dataTable th:first-child {
      white-space: normal;
      word-wrap: break-word;
      overflow-wrap: break-word;
      max-width: 500px; /* A bit more room for text on larger screens */
    }
  }
  
  /* For larger screens, let autoWidth do its job */
  @media only screen and (min-width: 1025px) {
    table.dataTable td:first-child,
    table.dataTable th:first-child {
      /* Remove or relax constraints so the column can size naturally */
      max-width: 95%;
    }
  }
  table.dataTable tbody td {
    border-top: 1px solid blue;
  }

.twnnWorkbook .cellHeaderLabel {
    font-size: 10px;
    display: flex;
    justify-content: center;
    color: #05fa46;
    margin-top: 5px;
    margin-bottom: 5px;
    width: fit-content; /* Changed from auto */
    margin-left: auto;  /* These center the block horizontally */
    margin-right: auto;
}
.twnnWorkbook .cellHeaderField {
border: 1px solid blanchedalmond;
padding: 5px;
   border-radius: 8px;
}


.twnnWorkbook thead th {
padding: 10px;
}

.twnnWorkbook td {
    padding: 8px 10px;
}



.twnnWorkbook .showWorksheetButton{
  background-color: green;
border-radius: 8px;
font-size: 10;
}


table.dataTable tr.child td.child {
    text-align: center !important;
}

table.dataTable tr.child td.child .dtr-details {
    display: inline-block;     /* so it can center */
    text-align: left;          /* keep text left inside the box */
    margin: 0 auto !important; /* center horizontally */
}

/* optional: style the detail box */
table.dataTable tr.child td.child .dtr-details {
    border: 1px solid #ddd;
    padding: 6px 10px;
    border-radius: 4px;
}