:root {
    --bb-table-selected-row-hover-background-color: none !important;
    --bb-table-selected-row-hover-color: color: var(--atom-palette-white) !important;
}

.atom-table-container {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.atom-table {
    color: var(--atom-palette-text-primary);
    background: var(--atom-palette-table);
    font-size: 14px;
}

.atom-table-striped > tbody > tr,
.atom-table-striped > tbody > tr.atom-table-rows {
    background: var(--atom-palette-table);
    vertical-align: middle;
    transition: background-color 0.2s ease;
}

table.atom-table-collapsed.atom-table-striped > tbody > tr.atom-table-rows:nth-child(4n + 1):hover,
.atom-table-striped.atom-table-collapsed > tbody > tr.atom-table-rows:nth-child(odd):hover {
    background: var(--atom-palette-secondary-30) !important;
    color: var(--atom-palette-black) !important;
}

/* Custom background color for every fourth row in striped tables */
table.atom-table-collapsed.atom-table-striped > tbody > tr.atom-table-rows:nth-child(4n + 1) {
    background-color: var(--atom-palette-table-striped) !important;
}

.atom-table-striped.atom-table-collapsed > tbody > tr.atom-table-rows:nth-child(odd) {
    background-color: var(--atom-palette-table) !important;
}

.atom-table-striped > tbody > tr.atom-table-rows:nth-child(odd) {
    background-color: var(--atom-palette-table-striped) !important;
}

/* Custom background color for collapse and collapsing rows in striped tables */
.atom-table-striped > tbody > tr.collapse.show:nth-child(4n + 2),
.atom-table-striped > tbody > tr.collapsing:nth-child(4n + 2) {
    background: var(--atom-palette-table-striped);
}

.atom-table-striped.atom-table-collapsed > tbody > tr.collapse.show:nth-child(4n + 2),
.atom-table-striped.atom-table-collapsed > tbody > tr.collapsing:nth-child(4n + 2) {
    background: var(--atom-palette-table-striped);
}


/* Styling for table headers: background color, vertical alignment, and font size */
th {
    text-wrap: nowrap;
}

.atom-table-heading th {
    background-color: var(--atom-palette-table-thead) !important;
    vertical-align: middle;
    font-size: 16px;
}

.atom-table-heading.atom-heading-bordered th:not(:last-child) {
    border-right: 1px solid var(--atom-palette-table-lines) !important;
}

/* Make the first column sticky for horizontal scrolling */
/*.atom-table th:first-child,
.atom-table td:first-child {
    position: sticky;
    left: 0;
    background: inherit;
    min-width: 50px;
}*/

/* Make the second column sticky for horizontal scrolling */
/*.atom-table th:nth-child(2),
.atom-table td:nth-child(2) {
    position: sticky;
    left: 49px;
    background: inherit;
    min-width: 50px;
}*/

.atom-table > :not(caption) > * > * {
    padding: 10px;
    border: none;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 250px;
}

.atom-table td.freeze-column,
.atom-table td.freeze-column.freeze-column-active {
    box-shadow: none !important;
    background: inherit;
}

.atom-table tr th.freeze-column,
.atom-table tr th.freeze-column.freeze-column-active {
    box-shadow: none !important;
    background: inherit;
}

.atom-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked) {
    /*background: var(--atom-palette-secondary-30) !important;*/
    background: var(--atom-palette-secondary-lighten) !important; /*recently added edit as needed*/
    color: var(--atom-palette-text-primary) !important;
}

/*.atom-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked):hover,
.bb-table > tbody tr:has(input[type=checkbox].bb-grid-form-check-input:checked):hover {
    color: red !important;
}
*/

.atom-table-container::-webkit-scrollbar {
    height: 6px;
    border-radius: 100px;
}

.atom-table-container::-webkit-scrollbar-thumb {
    background-color: var(--atom-palette-table-scroll-thumb);
    border-radius: 100px;
}

.atom-table-container::-webkit-scrollbar-track {
    background: var(--atom-palette-table-scroll-track);
    border-radius: 100px;
}

.atom-table .form-check {
    display: flex;
    align-items: center;
    justify-content: center;
}

.atom-table .form-check-input[type=checkbox]:checked,
.atom-table .form-check-input[type=checkbox]:indeterminate {
    color: var(--atom-palette-primary) !important;
    background-color: var(--atom-palette-primary) !important;
    border-color: var(--atom-palette-lines-default) !important;
}

.atom-table .form-check-input:focus {
    outline: 0;
    border-color: none;
    box-shadow: none;
}

.atom-table-inline-inputfield {
    width: 100px;
}

.atom-column-editable {
    width: 100px;
}

/*Custom Table Row Selection*/
.atom-table-rows
/*Custom Table Row Selection*/
/*Table Pagination*/
ul.pagination li.page-item > a,
ul.pagination li.page-item > a.page-link {
    background-color: var(--atom-palette-dark-10);
    border-color: var(--atom-palette-lines-default);
    color: var(--atom-palette-text-secondary);
}


ul.pagination li.page-item.active > a {
    background-color: var(--atom-palette-primary) !important;
    border-color: var(--atom-palette-primary) !important;
    color: var(--atom-palette-white);
}

ul.pagination li.page-item.disabled > a {
    background-color: var(--atom-palette-dark-30) !important;
}

/*=======TABS COMPONENTS*=======*/
.nav.nav-tabs {
    gap: 6px !important;
    border-bottom: unset !important;
    font-weight: 500;
}

    .nav.nav-tabs button.nav-link.active {
        background: var(--atom-palette-primary) !important;
        color: var(--atom-palette-white) !important;
        border: unset !important;
    }

    .nav.nav-tabs button.nav-link {
        min-width: 100px;
        background: var(--atom-palette-gray-lighten) !important;
        color: var(--atom-palette-text-primary) !important;
        border: unset !important;
        flex: 1;
        padding: 10px 8px !important;
    }

/*======= UNDERLINE VARIANTS =======*/

.nav {
    --bs-nav-link-hover-color: var(--atom-palette-primary) !important;
}

.nav-link {
    min-width: 100px;
    display: block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-size: var(--bs-nav-link-font-size);
    font-weight: var(--bs-nav-link-font-weight);
    color: var(--atom-palette-text-primary);
    text-decoration: none;
    background: 0 0;
    border: 0;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
    padding-left: 10px;
    padding-right: 10px;
}

.nav-underline {
    --bs-nav-underline-link-active-color: var(--atom-palette-primary) !important;
}

    .nav-underline .nav-link {
        padding: 10px 12px 16px;
    }

        .nav-underline .nav-link.active {
            padding: 10px 12px 16px;
        }

        .nav-underline .nav-link.active, .nav-underline .show > .nav-link {
            font-weight: 700;
            color: var(--atom-palette-primary);
            z-index: 2;
            padding-left: 10px;
            padding-right: 10px;
            padding-bottom: 16px;
        }

.nav-line {
    position: relative;
}

    .nav-line::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 2px;
        background-color: var( --atom-palette-dark-40);
        z-index: 0;
    }

/*custom css*/

.w-board {
    padding: 20px;
    border-radius: 6px;
    background: var(--atom-palette-background-light);
}

.indent {
    margin-left: 20px;
}

.clear-btn {
    width: 26px;
    height: 26px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 4px;
    transition: background-color 0.3s ease;
    border-radius: 50px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(-25%, -50%);
    cursor: pointer;
}

    .clear-btn:hover {
        background-color: var(--atom-palette-gray-lighten);
    }

    .clear-btn .clear-icon {
        width: 18px;
        height: 18px;
    }

.clear-btn-filter {
    transform: translate(-35px, -50%);
}

.blazored-modal {
    background-color: var(--atom-palette-background) !important;
    border: 1px solid var(--atom-palette-header-line) !important;
    min-width: 500px !important;
}

    /*.blazored-modal span {
        color: var(--atom-palette-text-smallbanner-color) !important;
    }*/


.side-icon-container {
    position: relative;
}

    .side-icon-container
    .side-icon {
        position: absolute;
        /*background-color: #1A85CF;*/
        width: 50px;
        height: 45px;
        border-radius: 0px 7px 7px 0px;
        display: flex;
        padding: 10px;
        right: 0;
        top: 0;
    }

    .side-icon-container .password-tooltip{
        width: 100%;
        padding: 12px;
        border-radius: 12px;
        background-color: var(--atom-palette-header-background);
        box-shadow: 0px 4px 6px 8px rgba(0, 0, 0, 0.1);
    }

        .side-icon-container
        .password-tooltip
        .progress-container {
            background: #EDECEF;
            border-radius: 50rem;
            width: 100%;
            position: relative;
            height: 8px;
        }


            .side-icon-container
            .password-tooltip
            .progress-container
            .progress {
                background: #605D67;
                border-radius: 100%;
                height: 100%;
                position: absolute;
                left: 0;
            }

            .side-icon.primary-bg {
                background-color: #CEE2FF;
            }

/*action-icons*/
.action-icon {
    filter: grayscale(1);
    transition: 0.3s ease;
    cursor: pointer;
    opacity: 1;
}

    .action-icon:hover {
        filter: none;
        scale: 1.1 !important;
        opacity: 1;
    }

        .action-icon:hover.primary-icon {
            opacity: 1;
            filter: invert(1) brightness(.35) sepia() hue-rotate(189deg) saturate(6);
        }

    .action-icon.primary-icon {
        opacity: 0.5
    }

        .action-icon.primary-icon.active {
            filter: invert(1) brightness(.35) sepia() hue-rotate(85deg) saturate(6);
        }

.atom-search-icon {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(50%, -50%);
}
/*custom css*/

/*@media (max-width: 768px){
    .nav-line::after {
       height: 0;
    }
}

@media (min-width: 992px){
    .table-responsive.atom-table-container{
        overflow: visible !important;
    }
}


@media (max-width: 992px) {
    .table-responsive.atom-table-container {
        overflow: auto !important;
    }
}*/

@media (max-width: 575px) {
    .atom-table-container .atom-table thead.atom-table-heading tr > th:first-child,
    .atom-table-container .atom-table tbody tr > td:first-child {
        width: 110px !important;
        max-width: 110px !important;
        text-overflow: ellipsis !important;
        overflow: hidden !important;
    }
}