﻿.page-title {
    margin: 10px 0px 36px 0px;
}

.page-title-name {
    padding-top: 10px;
    font-family: Inter;
    font-size: 42px;
    white-space: nowrap;
}

.page-title-action > div {
    width: 35px;
    height: 35px;
    margin-left: 30px;
}
.page-title-action img {
    _height: 36px;
}

.page-table {
    _border: dashed 1px red;
    margin: 0 0 0 0;
    position: relative;
    padding-bottom: 100px;
    box-sizing: border-box;
    font-family: Inter;
    font-size: 14px;
}

/* FILTER */
.page-table-filter {

}

.page-table-filter .search {
    width: 253px;
}
.filter-input label {
    font-size: 14px;
    font-weight: normal;
    color: #828589;
    padding-left: 19px;
}
.filter-input.is-focused label {
    color: var(--color-active) !important;
}
.filter-input input {
    padding-left: 18px;
    outline: none;
}
.filter-input label:after {
    bottom: 12px;
    background-color: var(--color-active);
}

.filter-input .mdl-textfield__label__icon {
    position: absolute;
    right: 15px;
    top: 18px;
}
.filter-input .mdl-textfield__label__icon img {
    width: 18px;
    height: 18px;
}


.filter-search input {
    padding-right: 38px;
}

.page-table-applied-filter > div {
    display: inline-block;
    padding: 10px 15px 10px 15px;
    margin: 0 10px 7px 0;
    border-radius: 20px;
    background-color: #e3e4ea;
    color: var(--text-primary);
}
.page-table-applied-filter > div > img{
    cursor: pointer;
}

.filter-date, .filter-enum, .filter-dictionary {
    display: inline-block;
    color: var(--text-primary);
    padding-left: 17px;
}

.page-table-actions {
    padding-top: 20px;
    display: inline-block;
    float: right;
    padding-left: 17px;
}

.page-table-actions a {
    text-decoration: none;
}

.table-pagination a {
    cursor: pointer;
    width: 39px;
    height: 39px;
    padding-top: 7px;
    display: inline-block;
    text-align: center;
}

.table-pagination a.disabled {
    -webkit-filter: grayscale(200%);
    -moz-filter: grayscale(200%);
    -ms-filter: grayscale(200%);
    -o-filter: grayscale(200%);
    filter: grayscale(200%);
    cursor: auto;
}
.table-pagination a.current {
    border-radius: 100%;
    border: solid 2px #8bbb2b;
    background-color: #fff;
    cursor: default;
    color: rgb(33, 37, 41);
}

.table-length {
    color: #0366d6;
}
.table-length select {
    color: #0366d6;
    cursor: pointer;
}
.table-length select:focus-visible {
    outline: none;
}


/* DATA */
.page-table-data {
    _border: dashed 1px green;
    min-height: 50vh;
    _min-height: calc(100vh - 305px);
    _margin: 0 0 0 -15px;
}

.page-table-data table thead th, .page-table-data table thead td {
    border-bottom: 0; 
}
.page-table-data table  {
    _border-bottom: 0; 
    border-bottom: 1px solid var(--text-gray) !important;
}


.page-table-data th {
    color: var(--text-primary);
}
.page-table-data td {
    color: var(--text-black);
}


/* FOOTER */
.page-table-footer {
    _border: dashed 1px green;
    margin: 0 0 0 -22px;
    border-top: 1px solid var(--text-gray);
    width: 100%;
    _width: calc(100vw - 130px);
    position: absolute;
    padding-top: 7px;
    _position: fixed;
    bottom: 0;
    height: 56px;
    display: flex;
    justify-content: space-between;
}

.page-table-footer .left {
}

.page-table-footer .footer-right {
    white-space: nowrap;
}
.page-table-footer .footer-right div {
    display: inline-block;
    padding: 0 10px 0 10px;
}

.table-length select {
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-left: 5px;
    padding-right: 2px;
    text-overflow: '';
}
.table-length select::-ms-expand {
    display: none !important;
}


/* page-table */

.page-table {
    display: table;
}
.page-table-tbody {
    font-weight: 500;
    font-size: 14px;
}
.page-table-thead {
    font-weight: 300;
    font-size: 14px;
    background-color: #f5f5f5;
    cursor: pointer;
}

.page-table-row {
    display: table-row;
}
.page-table-divider {
    height: 7px;
}
.page-table-row > div:not(.empty) {
    margin-top: 5px;
    margin-bottom: 5px;
    display: table-cell;
    padding: 0.75rem;
}
.page-table-row > div:not(.empty):first-child, .page-table-row > div.first {
    _border-top-left-radius: 10px;
    _border-bottom-left-radius: 10px;
}
.page-table-row > div:last-child {
    _border-top-right-radius: 10px;
    _border-bottom-right-radius: 10px;
}
.page-table-row:not(.page-table-thead):hover {
    filter: drop-shadow(0 0 0.4rem rgba(0, 0, 0, 0.4));
    background-color: #fafafa;
}

.page-table-row-group {
    _background-color: #fafafa;
    cursor: pointer;
}

.page-table-thead > div.sorting {
    cursor: pointer;
    position: relative;
}
.page-table-thead > div.sorting:after {
    position: absolute;
    right: 5px;
    top: 10px;
}
.page-table-thead > div.sorting.asc:after {
    content: url('/images/sorting-down.svg');
}
.page-table-thead > div.sorting.desc:after {
    content: url('/images/sorting-down.svg');
    transform: rotate(180deg);
}

.page-table .download {
    position: absolute;
    right: 5px;
    top: 5px;
}