@use "../anna-common-scss/fonts" as fonts;
@use "../anna-common-scss/colors" as colors;

@mixin no-data-to-display-gt($tableHeight, $rowHeight, $noDataMarginTop) {
    .table-container {
        height: calc($tableHeight) !important;

        table {
            border: solid 1px #d4d4d4;

            thead {
                th {
                    cursor: default;
                    box-shadow: none !important;
                    border: solid 1px #d4d4d4 !important;
                }
            }

            tbody {
                tr.no-border-tr:first-of-type {
                    height: $rowHeight !important;

                    td {
                        box-shadow: none !important;
                    }
                }

                tr:nth-child(n + 1) {
                    td {
                        box-shadow: none !important;
                    }
                }
            }
        }
    }

    .no-data {
        margin-top: $noDataMarginTop !important;
    }
}

@mixin resetFilterStyle() {
    padding: 0;
    border: none;
    display: block;
    text-align: right;
    margin-left: auto;
    width: fit-content;
    background-color: transparent;
    text-decoration: underline;
    color: #268bff;
    line-height: 1 !important;
    font-size: var(--reset-all-filter-fs) !important;
    letter-spacing: normal !important;
    font-weight: normal !important;

    &:hover:enabled {
        color: #268bff;
    }

    &:disabled {
        color: #4a4a4a;
        opacity: 0.5;
        cursor: not-allowed;
    }
}

@mixin tableDataLink() {
    a {
        cursor: pointer !important;
        color: #268bff !important;
        text-decoration: underline !important;

        &.disabled {
            color: #b7b6b6;
            pointer-events: none;
            text-decoration: none;
        }
    }
}

@mixin table-ellipses {
    div {
        text-overflow: ellipsis !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        //  width: 99.5%;
    }
}

@mixin table-input-box($height, $borderColor) {
    border: solid 1px $borderColor;
    height: $height;
    width: 99%;
    text-overflow: ellipsis;
    overflow: hidden;
}

@mixin table-input-box-disabled($height, $borderColor, $bgColor, $color) {
    border: solid 1px $borderColor;
    height: $height;
    background-color: $bgColor;
    pointer-events: none !important;
    cursor: default !important;
    color: $color;
}

@mixin table-ellipses-only-on-text-span {
    span {
        text-overflow: ellipsis !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        display: inline-block !important;
        max-width: 92%;
        width: fit-content;
    }
}

@mixin noBorderTableHeader($bgColor) {
    background: $bgColor !important;
    box-shadow: none !important;
}

@mixin genericTableHeaderShadow($columnNumber) {
    .scroll-left-shadow-effect .header-row th:nth-of-type(#{$columnNumber}) {
        border: none !important;
        filter: drop-shadow(2px 0 2px colors.$lightGray-4);
    }
}

@mixin genericTableTotalRowShadow($columnNumber) {
    .scroll-left-shadow-effect .total-row td:nth-of-type(#{$columnNumber}) {
        filter: drop-shadow(2px 0 2px colors.$lightGray-4);
    }
}

@mixin genericTableTableDataShadow($columnNumber) {
    .scroll-left-shadow-effect td:nth-of-type(#{$columnNumber}) {
        filter: drop-shadow(2px 0 1px colors.$lightGray-4);
    }
}

@mixin genericTableOverrideHeaderShadow($columnNumber) {
    .scroll-left-shadow-effect .header-row th:nth-of-type(#{$columnNumber}) {
        box-shadow: none !important;
        border: none !important;
        filter: none;
    }
}

@mixin genericTableOverrideTableDataShadow($columnNumber) {
    .scroll-left-shadow-effect td:nth-of-type(#{$columnNumber}) {
        filter: none;
    }
}

@mixin genericTableHeaderShadow($columnNumber) {
    .scroll-left-shadow-effect .header-row th:nth-of-type(#{$columnNumber}) {
        border: none !important;
        filter: drop-shadow(2px 0 2px colors.$lightGray-4);
    }
}

@mixin genericTableTotalRowShadow($columnNumber) {
    .scroll-left-shadow-effect .total-row td:nth-of-type(#{$columnNumber}) {
        filter: drop-shadow(2px 0 2px colors.$lightGray-4);
    }
}

@mixin genericTableTableDataShadow($columnNumber) {
    .scroll-left-shadow-effect td:nth-of-type(#{$columnNumber}) {
        filter: drop-shadow(2px 0 1px colors.$lightGray-4);
    }
}

@mixin genericTableOverrideHeaderShadow($columnNumber) {
    .scroll-left-shadow-effect .header-row th:nth-of-type(#{$columnNumber}) {
        box-shadow: none !important;
        border: none !important;
        filter: none;
    }
}

@mixin genericTableOverrideTableDataShadow($columnNumber) {
    .scroll-left-shadow-effect td:nth-of-type(#{$columnNumber}) {
        filter: none;
    }
}

@mixin overrideEmptyTrBorders($startIndex) {
    tr.no-border-tr:first-of-type {
        td:nth-of-type(#{$startIndex}) {
            box-shadow: inset 1px 0px 0px 0px #d4d4d4 !important;
        }

        td:nth-child(n + #{$startIndex + 1}) {
            box-shadow: none !important;
        }

        td:last-of-type {
            box-shadow: inset -1px 0px 0px 0px #d4d4d4 !important;
        }
    }
}

@mixin overrideEmptyTrBorders($startIndex) {
    tr.no-border-tr:first-of-type {
        td:nth-of-type(#{$startIndex}) {
            box-shadow: inset 1px 0px 0px 0px #d4d4d4 !important;
        }

        td:nth-child(n + #{$startIndex + 1}) {
            box-shadow: none !important;
        }

        td:last-of-type {
            box-shadow: inset -1px 0px 0px 0px #d4d4d4 !important;
        }
    }
}