@media screen and (max-width: 767px) {
  table, thead, tbody, th, td, tr {
    display: block;
    width: 100% !important; }
  /* Optional: Hide table headers on mobile if they look messy when stacked */
  thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px; }
  tr {
    border: 1px solid #ccc;
    margin-bottom: 10px; }
  td {
    border: none;
    position: relative; } }