/* classes for styling dbc.Table*/


/*############*/
/* page MAPS */
/*############*/

.p1-table-wrapper {
  position: relative;
}

.p1-table-wrapper > table > thead {
  position: sticky;
  top: 0;
  background: #ffffff;
  z-index: 2;
}

/*make sure borders in table do not disappear on scroll*/
.p1-table-wrapper > table {
    border-collapse: separate;
	border-spacing: 0;
}

/*style olumn headers*/
.p1-table-wrapper > table > thead > tr > th {
	background-color: #eeeeee;
    text-align: center;
	vertical-align: middle;
    max-width: 350px;
    min-width: 200px;
    word-wrap: break-word;
	font-weight: normal;
	border-top: 1px solid;
	border-right: 1 px solid;
	border-bottom: 1px solid;
	border-left: 1px solid;
	color: black;
}

/*style cells*/
.p1-table-wrapper > table > tbody > tr > td {
	border-top: 0px solid;
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-left: 0px solid;
	text-align: right;
	color: #595959;
}

/*#############*/
/* page TABLES */
/*############*/

/* make column headers stick to the top 
main source: https://community.plotly.com/t/scrollable-dbc-table-with-max-height-and-sticky-header/62405/3
further reading: https://css-tricks.com/a-table-with-both-a-sticky-header-and-a-sticky-first-column/
*/

.p4-table-wrapper {
  position: relative;
}

.p4-table-wrapper > table > thead {
  position: sticky;
  top: 0;
  background: #ffffff;
  z-index: 2;
}


/*make sure borders in table do not disappear on scroll*/
.p4-table-wrapper > table {
    border-collapse: separate;
	border-spacing: 0;
}


/*style first column header*/
.p4-table-wrapper > table > thead > tr > th:first-child {
    text-align: center;
	vertical-align: middle;
    max-width: 350px;
    min-width: 250px;
    word-wrap: break-word;
	font-weight: normal;
	border-top: 1px solid;
	border-right: 1 px solid;
	border-bottom: 1px solid;
	border-left: 1px solid;
	color: black;
}


/*style column headers (all except first)*/
.p4-table-wrapper > table > thead > tr > th:not(:first-child) {
	background-color: #eeeeee;
    text-align: center;
	vertical-align: middle;
    max-width: 350px;
    min-width: 250px;
    word-wrap: break-word;
	font-weight: normal;
	border-top: 1px solid;
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-left: 0px solid;
	color: black;
}


/*style column headers (second)*/
.p4-table-wrapper > table > thead > tr > th:nth-of-type(2) {
	background-color: #eeeeee;
	border-top: 1px solid;
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-left: 1px solid;
	color: black;
}


/* make first column head stick to the left */
.p4-table-wrapper > table > thead > tr > th:nth-of-type(1) {
  position: sticky;
  left: 0;
  background: #ffffff;
  z-index: 1;
}


/* make first column stick to the left */
.p4-table-wrapper > table > tbody > tr > td:nth-of-type(1) {
  position: sticky;
  left: 0;
  background: #ffffff;
  z-index: 1;
}


/* style cells in first column */
.p4-table-wrapper > table > tbody > tr > td:nth-of-type(1) {
	background-color: #eeeeee;
	border-top: 0px solid;
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-left: 1px solid;
	color: black;
}


/*style cells except first column*/
.p4-table-wrapper > table > tbody > tr > td:not(:first-child) {
	border-top: 0px solid;
	border-right: 1px solid;
	border-bottom: 1px solid;
	border-left: 0px solid;
	text-align: right;
	color: #595959;
}

/*#####################*/
/* page ERLAEUTERUNGEN */
/*####################*/

.p6-industrie-table-wrapper {
	width: 50%;
}

/*style column headers*/
.p6-industrie-table-wrapper > table > thead > tr > th{
	color: black;
	width: 60px;
	word-wrap: break-word;
	border: 1px solid;
	color: black;
	font-weight: bold;
}

/*style cells*/
.p6-industrie-table-wrapper > table > tbody > tr > td {
	border: 1px solid;
	color: black;
}

/*center data in cells*/
.p6-industrie-table-wrapper > table > tbody > tr > td:not(:first-child) {
	text-align: center;
}