/*.wp-block-table {

    font: var(--font-p-s);
    color: var(--color-terra);

    @media(max-width:600px){
        font-size: 12px;
        margin-left: -30px;
        margin-right: -30px;
    }
    
    td {
        border: solid 1px var(--color-terra);
        text-align: center;      
        vertical-align: middle;  
    }

    tr:first-child td {
        background-color: var(--color-terra);
        color: white;
    }

    tr:not(:first-child):nth-child(even) {
        background-color: var(--color-armosa);
    }
    tr:not(:first-child):nth-child(odd) {
        background-color: var(--color-beige);
    }
}
*/


/* this is scroll version*/
.wp-block-table {
    
    font: var(--font-p-s);
    color: var(--color-terra);
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    
    table {
        width: 100%;
        table-layout: auto !important; 
        
        @media(max-width:600px){
            min-width: 580px; 
        }


        tr:first-child td {
            background-color: var(--color-terra);
            color: white;
            text-align: center;
        }
    
        tr:not(:first-child):nth-child(even) { background-color: var(--color-armosa); }
        tr:not(:first-child):nth-child(odd) { background-color: var(--color-beige); }

        td {
            border: solid 1px var(--color-terra);
            text-align: left;      
            vertical-align: middle;
            padding: 8px 8px; 
            word-break: keep-all !important;
       
            @media(max-width:600px){
                font-size: 12px;
                hyphens: none;
            }
        }
            
    }
}