.table-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 1rem;
      overflow: hidden;     
      padding: 0px;
    }
    

.table-grid-wide {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
      gap: 1rem;
      overflow: hidden;     
      padding: 0px;
    }

.table-grid-participate {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 1rem;
      overflow: hidden;     
      padding: 5px;
      background: rgba(255,255,255,0);
      border-radius: 22px;
      margin: 0px;
    }    


    .table-row {
      display: contents;
    }

    .cell {
      padding: 0.75rem 1rem;
      border: 1px solid #ddd;
      border-radius: 12px;
      background: rgba(255,255,255,1);
      word-break: break-word;
      margin-bottom: 10px !important;
    }
    
    .cell-transparent {
      padding: 0.75rem 1rem;
      border: 0;
      border-radius: 12px;
      background: rgba(255,255,255,0);
      word-break: break-word;
      margin-bottom: 10px !important;
    }
    
    .cell-blur {
      padding: 0.75rem 1rem;
      border: 1px solid rgba(255,255,255,0.2);
      border-radius: 12px;
      background: rgba(255,255,255,0.2);
      word-break: break-word;
      margin-bottom: 10px !important;
      color: rgba(255,255,255,1) !important;
    }    
    

    /* Responsive mobile view */
    @media (max-width: 600px) {
      .table-grid {
        display: block;
      }

      .table-row {
        display: flex;
        flex-direction: column;
     
      }

      .cell {
        display: flex;
        justify-content: space-between;
        padding: 0.5rem 1rem;
        margin: 10px;
        border: none;
        border: 1px solid #eee;
      }
      
      .cell-blur {
      padding: 0;
      }

      .cell::before {
        content: attr(data-label);
        font-weight: bold;
        color: #555;
      }
    }