/* -------------------------------- 

Tabela

-------------------------------- */

.table-responsive {
  border-radius: var(--ifht-sys-raio-borda-lg);
  margin-bottom: var(--ifht-sys-spacing-padding-md);
}

.table thead {
  background: var(--ifht-sys-cor-secundaria-dark);
  color:#fff;
}

.table-striped tbody tr {background: var(--ifht-ref-cor-marinho-99);}

.table-striped tbody tr:nth-of-type(2n+1) {background:var(--ifht-sys-cor-primaria-extralight);}

.table .grupo, .table-responsive .grupo {
  background: var(--ifht-ref-cor-marinho-99);
  /*table-layout: fixed;*/
  vertical-align: middle;
}
.table td, .table-responsive td {
  font-size: var(--ifht-sys-paragrafo);
  font-weight:400;
}

.table th {
  vertical-align: middle;
  font-family: var(--ifht-sys-txt-familia-titulo);
  text-transform: uppercase;
}

.table {
  margin-bottom:0;
  margin-top: 30px;
}

.table td, 
.table th,
.table thead th,
.table-bordered thead td {vertical-align: middle;}

.table td ul li {margin-bottom:10px;}

.table td ul li .svg-inline--fa {color:var(--ifht-sys-cor-secundaria-normal);}

.tabela .table-responsive td > a, .tabela .table-responsive td > a:visited {
    background-color: var(--ifht-sys-cor-secundaria-extradark-contrast);
    padding: 0 10px;
}


/* --------------------------------

Tabela em mobile (colunas viram linhas, em blocos de informação)

---------------------------------*/

@media only screen and (max-width: 800px) {
        
  /* Força a tabela a não se comportar como uma tabela*/
  .no-more-tables table, 
  .no-more-tables thead, 
  .no-more-tables tbody, 
  .no-more-tables th, 
  .no-more-tables td, 
  .no-more-tables tr { 
    display: block; 
  }

  /* Zebra striping */
  .no-more-tables tr:nth-of-type(odd) { 
  background: var(--ifht-ref-cor-marinho-99); 
}

.no-more-tables tr:nth-of-type(even) { 
  background: var(--ifht-sys-cor-primaria-extralight); 
}
 
  /* Esconde o header da tabela (mas não usa display:none; por causa da acessibilidade) */
  .no-more-tables thead tr { 
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
 
  .no-more-tables tr {border: 1px solid var(--ifht-sys-cor-secundaria-normal);}
 
  .no-more-tables td { 
    /* Faz a td se comportar como uma "row" */
    border: none;
    border-bottom: 1px solid var(--marinhoIFHT-pressed); 
    position: relative;
    padding-left: 50%; 
    white-space: normal;
    text-align:left;

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .no-more-tables tr:nth-of-type(odd) td {border-bottom: 1px solid var(--marinhoIFHT-pressed); }
 
  .no-more-tables td:before { 
    /* Faz a td:before se comportar como um header da tabela*/
    position: absolute;
    /* Top/left values mimic padding */
    /* top: 6px; */
    /* left: 5px; */
    left: 20px;
    width: 30%; 
    padding-right: 10px; 
    /* white-space: nowrap; */
    white-space: normal;
    text-align:center;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
  }
 
  /*Pega o atributo passado via data-nome-do-atributo*/
  .no-more-tables td:before { 
    content: attr(data-title); 
  }
}


/* -------------------------------- 
Tabelas-Colunagem
-------------------------------- */

.tabela-colunagem .row {margin:0;}

.tabela-colunagem [class*=row] {
border:1px solid var(--ifht-sys-cor-primaria-extralight);
margin-bottom:2rem;
}

.tabela-colunagem [class*=col-]{padding:0 15px;}

.tabela-colunagem [class*=col-md],
.tabela-colunagem [class*=col-lg] {border-left:1px solid var(--ifht-sys-cor-primaria-extralight);}

.tabela-colunagem img {margin-bottom: 1.5em;}

.tabela-colunagem .table-striped {
background: var(--ifht-sys-cor-primaria-extralight);
}

.tabela-colunagem .fa-chevron-right {color:var(--ifht-sys-cor-secundaria-normal);}


/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
.tabela-colunagem img {margin-bottom: 0;}
.tabela-colunagem [class*=col-]{padding:15px;}

.tabela-colunagem [class*=row] {margin-bottom:0;}
}

/* -------------------------------- 
Tabelas-Admin-Moodle
-------------------------------- */

.table-responsive .generaltable thead th,
.table-responsive .generaltable td {
  padding: var(--ifht-sys-spacing-padding-md) !important;
}