@import '../variable';

.table_horizontale_scrollable {
  overflow-x: auto;
  width: 100%;
}

.table {
  border-collapse: collapse;
  font-family: Circe;
  font-size: 1rem;
  font-weight: normal;
  table-layout: fixed;
  min-width: 100%;
}

th,
td {
  padding: 12px 8px;
  vertical-align: top;
}

.td {
  &_border {
    border-left: 1px solid #ededed;
    border-right: 1px solid #ededed;
  }
}

.th {
  &_border {
    border-left: 1px solid #ededed;
    border-right: 1px solid #ededed;
  }
}

td.action {
  width: 40px;
  min-width: 40px;
}

.th {
  color: $color-main-grey-text;
}

.tr {
  border: 1px solid #ededed;
  background-color: $table-striped-background-even;

  &_striped:nth-child(odd) {
    background-color: $table-striped-background-odd;
    transition: 200ms;
  }

  &_striped:hover:nth-child(odd) {
    background-color: $table-striped-background-hover;
    transition: 200ms;
  }

  &_striped:nth-child(even) {
    background-color: $table-striped-background-even;
    transition: 200ms;
  }

  &_striped:hover:nth-child(even) {
    background-color: $table-striped-background-hover;
    transition: 200ms;
  }
}
