.member-card {
    padding: 32px 24px;
}

.view-toggle {
    display: flex;
    align-items: center;
    justify-content: right;
    height: 54px;
    overflow: hidden;
}

    .view-toggle .view-btn {
        width: 54px;
        height: 54px;
        padding: 12px;
        border: 1px solid var(--bs-gray-300);
        color: var(--bs-gray-500);
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 1.125rem;
    }

        .view-toggle .view-btn:first-child {
            border-radius: 8px 0px 0px 8px;
        }

        .view-toggle .view-btn:last-child {
            border-radius: 0px 8px 8px 0px;
        }

        .view-toggle .view-btn.active {
            background-color: var(--bs-primary);
            border-color: var(--bs-primary);
            color: var(--bs-white);
        }


.UserGridProfileImg img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.table-responsive .table {
    border: 0;
}

    .table-responsive .table tr th {
        background-color: var(--bs-gray-50) !important;
        color: var(--bs-gray-600) !important;
    }

    .table-responsive .table tr th, .table-responsive .table tr td {
        font-size: 0.875rem;
        border-bottom: 0;
        padding: 14px 16px;
        vertical-align: middle;
    }

        .table-responsive .table tr th a {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            color: var(--bs-gray-600) !important;
            font-size: 0.875rem;
        }

            .table-responsive .table tr th a:hover {
                color: var(--nail-text-dark) !important;
            }

            .table-responsive .table tr th a i {
                font-size: 0.75rem;
            }

    .table-responsive .table tr td {
        border-bottom: 1px solid var(--bs-gray-200);
    }

        .table-responsive .table tr th:first-child, .table-responsive .table tr td:first-child {
            border-top-left-radius: 10px;
            border-bottom-left-radius: 10px;
        }



        .table-responsive .table tr th:last-child, .table-responsive .table tr td:last-child {
            border-top-right-radius: 10px;
            border-bottom-right-radius: 10px
        }

.btnrow {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .btnrow i {
        line-height: 1;
        font-size: 12px;
    }

.btn-view-row {
    background-color: var(--bs-success);
    color: var(--bs-white);
}

    .btn-view-row:hover {
        background-color: var(--bs-success-dark);
        color: var(--bs-white);
    }

.bs-pagination table td {
    border-bottom: 0 !important;
    padding: 8px !important;
}

    .bs-pagination table td span, .bs-pagination table td a {
        width: 30px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 2px;
        border-radius: 8px;
        line-height: 1;
        font-size: 12px;
    }

    .bs-pagination table td a {
        background-color: var(--nail-bg-light);
        border: 1px solid var(--bs-gray-300);
        color: var(--nail-text-dark);
        font-weight: 500;
    }

        .bs-pagination table td span, .bs-pagination table td a:hover {
            background-color: var(--bs-secondary-light);
            border: 1px solid var(--bs-secondary);
            color: var(--bs-secondary);
            font-weight: 700;
        }
