.notificationHeaderContainer {
    min-height: 2.5rem;
}

.notificationHeader {
    white-space: nowrap;
}

.pagination .page-item a span {
    font-size: 1.5rem;
}

@media (width > 1819px) {
    .notificationHeaderContainer{
        padding-left: .5rem;
    }
}

/* ------------------------
Notification table
------------------------ */

.notificationTable {
    margin: 0 auto;
    max-width: 1920px;
    overflow-x: auto;
    -ms-overflow-style: auto;
}

.notificationTable th:not(:last-child){
    box-shadow: var(--table-border-color-header);
}

.notificationTable tr td:not(:last-child){
    box-shadow: var(--table-border-color-body);
}

.notificationTable th,
.notificationTable td {
    padding-left: .2rem;
    white-space: nowrap;
    vertical-align: middle;

    & a {
        text-decoration: none;
    }
}

.notificationTable td:not(:last-child):not(:nth-child(6)),
.notificationTable th:not(:last-child):not(:nth-child(6)),
.notificationTable td:not(:last-child):not(:nth-child(8)),
.notificationTable th:not(:last-child):not(:nth-child(8)) {
    max-width: var(--table-column-max-width);
}


.notificationTable .lpHead,
.notificationTable td:nth-child(6) {
    max-width: 220px !important;
}

.notificationTable td:nth-child(8),
.notificationTable th:nth-child(8) {
    max-width: 100px;
}

.notificationTable td:not(:last-child):not(:nth-child(8)) span {
    display: inline-block;
    max-width: var(--table-column-max-width);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.notificationTable td:nth-child(8) span {
    display: inline-block;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tooltip-notice {
    position: relative;
    cursor: pointer;
}

@media (max-width: 1600px) {
    .notificationContainer {
        padding: 0;
    }
}

@media (max-width: 1819px) {
    .notificationTable {
        margin: 0 auto;
    }
}

@media (min-width: 1915px) {
    .notificationTable {
        max-width: 100dvw;
        overflow: hidden; /* Hide the scrollbar */
        -ms-overflow-style: none; /* Internet Explorer 10+ */
        scrollbar-width: none; /* Firefox */
    }

    .notificationTable::-webkit-scrollbar {
        display: none; /* Safari and Chrome */
    }
}

@media (min-width: 2047px) {
    .notificationTable td:not(:last-child):not(:nth-child(8)),
    .notificationTable th:not(:last-child):not(:nth-child(8)) {
        max-width: var(--table-column-max-width-2K);
    }

    .notificationTable td:not(:last-child):not(:nth-child(8)) span {
        max-width: var(--table-column-max-width-2K);
    }
}

@media (max-width: 1914px) {
    .notificationTable td:not(:last-child):not(:nth-child(8)),
    .notificationTable th:not(:last-child):not(:nth-child(8)),
    .notificationTable td:not(:last-child):not(:nth-child(8)) span {
        max-width: none;
    }
}

.notificationTable tbody tr:hover td{
    transition: background-color 0.2s ease-in-out;
}

.notificationTable tbody tr:nth-child(odd) td {
    background-color: rgba(234, 234, 234, 0.37);
}

.notificationTable tbody tr:nth-child(even) td {
    background-color: #ffffff;
}

.notificationTable tbody tr:nth-child(odd):hover td {
    background-color: rgba(183, 223, 255, 0.44);
}

.notificationTable tbody tr:nth-child(even):hover td {
    background-color: rgba(182, 222, 255, 0.29);
}
