﻿.tableComponent .text {
  font-size: 18px;
  line-height: 24px;
  margin-bottom: 15px;
  /* override */
  /* override */
}
.tableComponent .text .data p {
  display: inline-block;
}
.tableComponent table {
  width: 100%;
  margin-bottom: 20px;
  margin-top: 20px;
  /* override */
  /* override */
}
.tableComponent table tr {
  /* override */
  /*.odd {
      background-color: #f0f8fd;
  }

  &:nth-child(2n + 1) {
      background-color: #f0f8fd;
  }

  &:nth-child(2n) {
      background-color: transparent;
  }*/
  /* override */
}
.tableComponent table tr th {
  padding: 12px;
  background: #e1f0fd;
  position: relative;
}
.tableComponent table tr th:not(:last-child)::after {
  content: " ";
  width: 2px;
  height: 20px;
  background-color: #d7e7f2;
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: calc(50% - 10px);
}
.tableComponent table tr th.hidden {
  display: none;
}
.tableComponent table tr th.lastShown::after {
  content: none;
}
.tableComponent table tr td.hidden {
  display: none;
}
.tableComponent table tr td.text {
  padding: 12px;
  position: relative;
}
.tableComponent table tr td.text:not(:last-child)::after {
  content: " ";
  width: 2px;
  height: 20px;
  background-color: #d7e7f2;
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: calc(50% - 10px);
}
.tableComponent table tr td.text.lastShown::after {
  content: none;
}
.tableComponent table tr table {
  table-layout: auto;
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 0;
  background-color: #f0f8fd;
}
.tableComponent table tr table tr {
  border-top: 1px solid #d7e7f2;
}
.tableComponent table tr table td {
  padding: 12px;
}
.tableComponent table tr table td:first-child {
  padding-inline-start: 60px;
}
.tableComponent table tr table td:first-child.insideTitle {
  color: var(--textColor);
  font-size: 20px;
  font-weight: 600;
  /* override */
  white-space: nowrap;
  /* override */
}
.tableComponent table tr table td:last-child {
  width: 100%;
}
.tableComponent table.striped-t tr {
  /* override */
  /*.odd {
      background-color: #f0f8fd;
  }*/
  /* override */
}
.tableComponent table.striped-t tr:nth-child(2n+1) {
  background-color: #f0f8fd;
}
.tableComponent table.striped-t tr:nth-child(2n) {
  background-color: transparent;
}
.tableComponent table thead.hidden {
  display: none;
}
.tableComponent table.visible-columns .collapse-col {
  display: none;
}
.tableComponent table.collapse-table tr {
  display: flex;
  flex-wrap: wrap;
}
.tableComponent table.collapse-table tr .dt-control {
  flex: 0 50px;
}
.tableComponent table.collapse-table tr .dt-control .btnTbl {
  border: none;
  background-color: transparent;
  width: 100%;
  height: 100%;
}
.tableComponent table.collapse-table tr .dt-control .btnTbl::before {
  content: "+";
  font-size: 24px;
  text-align: center;
  line-height: 17px;
  border-radius: 10px;
  width: 20px;
  height: 20px;
  background-color: #ffffff;
  position: absolute;
  inset: calc(50% - 10px);
  border: 1px solid black;
  inset-inline-end: calc(50% - 10px);
  inset-block-start: calc(50% - 10px);
  cursor: pointer;
}
.tableComponent table.collapse-table tr .dt-control.dt-hasChild .btnTbl::before {
  content: "-";
  line-height: 12px;
}
.tableComponent table.collapse-table tr td {
  /* override */
  flex: 1 1;
  /* override */
  /* override */
  /*&:not(.collapseable) {
      &:last-child {
          background: red;
      }
  }*/
  /* override */
}
.tableComponent table.collapse-table tr td.collapseable {
  display: none;
  /* override */
  /*flex: 1 auto;*/
  /* override */
}
.tableComponent table.collapse-table tr td.collapseable.reveal {
  display: block;
  width: 100%;
  flex: 1 auto;
}
.tableComponent table.collapse-table tr td.collapseable.reveal::after {
  display: none;
}
.tableComponent table.collapse-table tr td.collapseable.reveal .label {
  display: inline-block;
  /* override */
  margin-inline-end: 20px;
  /* override */
  /* override */
  /* override */
}
.tableComponent table.collapse-table tr td.collapseable.reveal .label p {
  display: inline-block;
}
.tableComponent table.collapse-table tr td .label {
  color: var(--textColor);
  display: none;
  /* override */
  /*font-size: 24px;
  line-height: 32px;
  font-weight: 400;*/
  /*min-width: 100px;*/
  font-weight: 600;
  /* override */
}
.tableComponent table.collapse-table tr th {
  flex: 1 auto;
}
.tableComponent table.collapse-table tr th:first-child {
  flex: 0 50px;
}
.tableComponent table.collapse-table.visible-columns tr {
  display: table-row;
}
.tableComponent table.collapse-table.visible-columns thead tr th.insideTitle p {
  white-space: nowrap;
}

@media screen and (max-width: 1199px) {
  table.collapse-table tbody tr {
    flex-wrap: wrap;
  }
  table.collapse-table thead tr {
    flex-wrap: nowrap !important;
  }
  table.collapse-table tr th:nth-child(n+3) {
    display: none;
  }
  table.collapse-table tr th::after {
    display: none;
  }
  table.collapse-table tr td {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    /* override */
    display: flex;
    flex: 1 auto;
    /* override */
    /* override */
    /* override */
    /* override */
  }
  table.collapse-table tr td:nth-child(n+3) {
    display: none;
  }
  table.collapse-table tr td:nth-child(n+3).reveal {
    /* override */
    /*display: block;*/
    display: flex;
    /* override */
    width: 100%;
    flex: 1 100%;
  }
  table.collapse-table tr td:nth-child(n+3).reveal .label {
    display: inline-block;
  }
  table.collapse-table tr td:nth-child(n+3)::after {
    display: none;
  }
  table.collapse-table tr td.text {
    margin-bottom: 0;
  }
  table.collapse-table tr td:nth-child(n+2).reveal .label {
    display: inline-block;
  }
  table.collapse-table tr td::after {
    display: none;
  }
  table.collapse-table tr td .label {
    margin-inline-end: 20px;
    display: inline-block;
  }
  table.collapse-table tr td.reveal {
    /* override */
    display: flex;
    gap: 20px;
  }
  table.collapse-table tr td.reveal.dt-control {
    border-bottom: none;
    /*margin-inline-end: 0;*/
  }
  table.collapse-table.visible-columns tr {
    display: flex;
  }
  /* override */
  .tableComponent {
    /* override */
    /* override */
  }
  .tableComponent table.collapse-table tr td.reveal {
    display: flex;
    gap: 20px;
  }
  .tableComponent table.collapse-table tr td.reveal.collapseable {
    display: flex;
    gap: 20px;
  }
  .tableComponent .text {
    margin-bottom: 0;
    /*           display: flex;
                gap: 20px;
    */
  }
  .tableComponent .text .data {
    flex-shrink: 2;
  }
  .tableComponent thead {
    display: none;
  }
  .tableComponent table.visible-columns .collapse-col {
    display: block;
  }
  /* override */
}
/* override */
.tableComponent .thead-hidden {
  display: none;
}

.tableComponent table.collapse-table thead tr th {
  flex: 1 1;
}
.tableComponent table.collapse-table thead tr th.insideTitle {
  font-size: 20px;
}
