input:disabled, textarea:disabled {
    pointer-events: none;
    /*opacity: 0.5;*/
    background-color: #e9ecef; /* Light gray background */
    color: #6c757d; /* Muted text color */
    border: 1px solid #ced4da;
    cursor: not-allowed;
}
button:disabled {
    pointer-events: none;
    opacity: 0.5;
    cursor: not-allowed;
}
.button_submit {
    width: 100%;
    padding: 10px 13px;
    background-color: rgb(55 125 255 / var(--tw-bg-opacity, 1));
    color: white;
    /*     background-color: #baf3e6;
  color: #004d5a; */
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 20px;
    margin-top: 2rem;
    margin-bottom: 10px;
    transition: all;
    transition-duration: 0.3s;
}

    .button_submit:hover {
        background-color: #113d75;
    }
/*     css class for datatables */

.table > :not(caption) > * > * {
    background-color: var(--huseinyahya-table-bg);
    border-bottom-width: 1px;
    box-shadow: inset 0 0 0 9999px var(--huseinyahya-table-accent-bg);
    padding: .75rem 1.5rem
}

.table > tbody {
    vertical-align: inherit
}

.table > thead {
    vertical-align: bottom
}

.table-group-divider {
    border-top: 2px solid #e2e8f0
}

.caption-top {
    caption-side: top
}

.table-sm > :not(caption) > * > * {
    padding: .3rem .6rem
}

.table-bordered > :not(caption) > * {
    border-width: 1px 0
}

    .table-bordered > :not(caption) > * > * {
        border-width: 0 1px
    }

.table-borderless > :not(caption) > * > * {
    border-bottom-width: 0
}

.table-borderless > :not(:first-child) {
    border-top-width: 0
}

.table-striped-columns > :not(caption) > tr > :nth-child(2n), .table-striped > tbody > tr:nth-of-type(odd) > * {
    --huseinyahya-table-accent-bg: var(--huseinyahya-table-striped-bg);
    color: var(--huseinyahya-table-striped-color)
}

.table-active {
    --huseinyahya-table-accent-bg: var(--huseinyahya-table-active-bg);
    color: var(--huseinyahya-table-active-color)
}

.table-hover > tbody > tr:hover > * {
    --huseinyahya-table-accent-bg: var(--huseinyahya-table-hover-bg);
    color: var(--huseinyahya-table-hover-color)
}

.table-primary {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #e3dcff;
    --huseinyahya-table-border-color: #ccc6e6;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-primary, .table-secondary {
    border-color: var(--huseinyahya-table-border-color);
    color: var(--huseinyahya-table-color)
}

.table-secondary {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #e0e3e8;
    --huseinyahya-table-border-color: #caccd1;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-success {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #d7ece1;
    --huseinyahya-table-border-color: #c2d4cb;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-info, .table-success {
    border-color: var(--huseinyahya-table-border-color);
    color: var(--huseinyahya-table-color)
}

.table-info {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #cfedfb;
    --huseinyahya-table-border-color: #bad5e2;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-warning {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #fdecce;
    --huseinyahya-table-border-color: #e4d4b9;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-danger, .table-warning {
    border-color: var(--huseinyahya-table-border-color);
    color: var(--huseinyahya-table-color)
}

.table-danger {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #f8d4d4;
    --huseinyahya-table-border-color: #dfbfbf;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-light {
    --huseinyahya-table-color: #000;
    --huseinyahya-table-bg: #f1f5f9;
    --huseinyahya-table-border-color: #d9dde0;
    --huseinyahya-table-striped-bg: #000;
    --huseinyahya-table-striped-color: #fff;
    --huseinyahya-table-active-bg: #000;
    --huseinyahya-table-active-color: #fff;
    --huseinyahya-table-hover-bg: #000;
    --huseinyahya-table-hover-color: #fff
}

.table-dark, .table-light {
    border-color: var(--huseinyahya-table-border-color);
    color: var(--huseinyahya-table-color)
}

.table-dark {
    --huseinyahya-table-color: #fff;
    --huseinyahya-table-bg: #0f172a;
    --huseinyahya-table-border-color: #272e3f;
    --huseinyahya-table-striped-bg: #fff;
    --huseinyahya-table-striped-color: #000;
    --huseinyahya-table-active-bg: #fff;
    --huseinyahya-table-active-color: #000;
    --huseinyahya-table-hover-bg: #fff;
    --huseinyahya-table-hover-color: #000
}

.table-responsive {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto
}

@media (max-width:575.98px) {
    .table-responsive-sm {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto
    }
}

@media (max-width:767.98px) {
    .table-responsive-md {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto
    }
}

@media (max-width:991.98px) {
    .table-responsive-lg {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto
    }
}

@media (max-width:1199.98px) {
    .table-responsive-xl {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto
    }
}

@media (max-width:1399.98px) {
    .table-responsive-xxl {
        -webkit-overflow-scrolling: touch;
        overflow-x: auto
    }
}

table.dataTable {
    clear: both;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    max-width: none !important
}

    table.dataTable td, table.dataTable th {
        box-sizing: content-box
    }

        table.dataTable td.dataTables_empty, table.dataTable th.dataTables_empty {
            text-align: center
        }

    table.dataTable.nowrap td, table.dataTable.nowrap th {
        white-space: nowrap
    }

    table.dataTable.table-striped > tbody > tr:nth-of-type(odd) {
        background-color: transparent
    }

div.dataTables_wrapper div.dataTables_length {
    padding: 16px 24px
}

    div.dataTables_wrapper div.dataTables_length label {
        font-weight: 400;
        text-align: right;
        white-space: nowrap
    }

    div.dataTables_wrapper div.dataTables_length select {
        display: inline-block;
        width: 80px
    }

div.dataTables_wrapper div.dataTables_filter {
    padding-bottom: .5rem;
    padding-left: 1.5rem;
    padding-top: .5rem;
    text-align: left
}

    div.dataTables_wrapper div.dataTables_filter label {
        font-weight: 400;
        text-align: right;
        white-space: nowrap
    }

    div.dataTables_wrapper div.dataTables_filter input {
        display: inline-block;
        margin-right: .5em;
        width: 20rem;
        font-size: .875rem;
        line-height: 1.25rem;
        border-radius: .5rem;
    }

div.dataTables_wrapper div.dataTables_info {
    padding: 1rem !important;
    padding-right: 1.5rem;
    white-space: nowrap
}

div.dataTables_wrapper div.dataTables_paginate {
    margin: 0;
    padding: .75rem;
    text-align: left;
    white-space: nowrap
}

    div.dataTables_wrapper div.dataTables_paginate ul.pagination {
        margin: 12px 24px;
        white-space: nowrap
    }

        div.dataTables_wrapper div.dataTables_paginate ul.pagination .page-item {
            margin-right: .25rem
        }

div.dataTables_wrapper div.dataTables_processing {
    margin-right: -100px;
    margin-top: -26px;
    padding: 1em 0;
    position: absolute;
    right: 50%;
    text-align: center;
    top: 50%;
    width: 200px
}

div.dataTables_scrollHead table.dataTable {
    margin-bottom: 0 !important
}

div.dataTables_scrollBody > table {
    border-top: none;
    margin-bottom: 0 !important;
    margin-top: 0 !important
}

    div.dataTables_scrollBody > table > thead .sorting:after, div.dataTables_scrollBody > table > thead .sorting_asc:after, div.dataTables_scrollBody > table > thead .sorting_desc:after {
        display: none
    }

    div.dataTables_scrollBody > table > tbody > tr:first-child > td, div.dataTables_scrollBody > table > tbody > tr:first-child > th {
        border-top: none
    }

div.dataTables_scrollFoot > .dataTables_scrollFootInner {
    box-sizing: content-box
}

    div.dataTables_scrollFoot > .dataTables_scrollFootInner > table {
        border-top: none;
        margin-top: 0 !important
    }

@media screen and (max-width:767px) {
    div.dataTables_wrapper div.dataTables_filter, div.dataTables_wrapper div.dataTables_info, div.dataTables_wrapper div.dataTables_length, div.dataTables_wrapper div.dataTables_paginate {
        text-align: center
    }
}

table.dataTable.table-condensed > thead > tr > th {
    padding-left: 20px
}

table.table-bordered.dataTable {
    border-left-width: 0
}

    table.table-bordered.dataTable td, table.table-bordered.dataTable th {
        border-right-width: 0
    }

        table.table-bordered.dataTable td:last-child, table.table-bordered.dataTable th:last-child {
            border-left-width: 1px
        }

    div.dataTables_scrollHead table.table-bordered, table.table-bordered.dataTable tbody td, table.table-bordered.dataTable tbody th {
        border-bottom-width: 0
    }

div.table-responsive > div.dataTables_wrapper > div.row {
    margin: 0
}

    div.table-responsive > div.dataTables_wrapper > div.row > div[class^=col-]:first-child {
        padding-right: 0
    }

    div.table-responsive > div.dataTables_wrapper > div.row > div[class^=col-]:last-child {
        padding-left: 0
    }

div.dataTables_wrapper div.dataTables_info {
    padding: 1rem !important;
    padding-right: 1.5rem;
    white-space: nowrap
}

div.dataTables_wrapper div.dataTables_paginate {
    margin: 0;
    padding: .75rem;
    text-align: left;
    white-space: nowrap
}

    div.dataTables_wrapper div.dataTables_paginate ul.pagination {
        margin: 12px 24px;
        white-space: nowrap
    }

        div.dataTables_wrapper div.dataTables_paginate ul.pagination .page-item {
            margin-right: .25rem
        }
.Haserr {
    border-color: #FF0000;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
}

/* Style the pagination container */
.dataTables_paginate {
    display: flex;
    justify-content: space-between;
    padding: 10px;
}

    /* Style the pagination links */
    .dataTables_paginate .paginate_button {
        padding: 0px .75rem;
        height: 2rem;
        display: flex;
        align-items: center;
        margin: 0px 5px 5px 5px;
        border-radius: 5px; /* Rounded corners */
        background-color: #fff; /* Background color */
        color: #667085; /* Text color */
        transition: background-color 0.3s, color 0.3s; /* Smooth transition */
        cursor: pointer;
    }

    .dataTables_paginate span {
        display: flex;
    }

        /* Style the active/inactive pagination links */
        .dataTables_paginate .paginate_button.current {
            background-color: #ebf2ff; /* Active background color */
            color: #377dff; /* Active text color */
        }

        /* Style hover effect */
        .dataTables_paginate .paginate_button:hover {
            background-color: #0056b3; /* Hover background color */
            color: #fff; /* Hover text color */
        }
        .previous, .next {
            border: 1px solid #d0d5dd;
            box-shadow: 0px 1.09px 2.18px 0px rgba(16, 24, 40, 0.05);
            position: relative;
            padding: 8px 16px;
        }
        
        
        .next::after {
            content: "←"; 
            margin-right: 8px;
        }
        
        
        .previous::before {
            content: "→"; 
            margin-left: 8px;
        }

        /* modal styles */
        .modal-input-container {
            overflow-y: auto;
            height: 26rem;
            padding: 1rem;;
        }


.text-gray {
    color: #5c6370 !important;
    font-weight: 500;
}

.thead-bg {
    background-color: #f0f0f0 !important;
}
.select2-container--default .select2-selection--single {
    border: 1px solid #d1d5db; /* Tailwind gray-300 */
    border-radius: 0.375rem; /* Tailwind rounded-md */
    padding: 0.5rem 1rem; /* Tailwind padding */
    height: 100%;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #374151; /* Tailwind gray-700 */
        line-height: 1.25rem; /* Tailwind leading-relaxed */
        font-size: 0.875rem
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 100%;
        right: 0.5rem; /* Tailwind mr-2 */
    }


/*================*/
.tooltip {
    position: relative;
    display: inline-block;
}

    .tooltip::after {
        content: attr(data-name);
        position: absolute;
        bottom: 100%; /* Position above the anchor */
        left: 50%;
        transform: translateX(-50%);
        background-color: rgba(0, 0, 0, 0.75);
        color: white;
        padding: 0.5rem; /* Increased padding for better appearance */
        border-radius: 0.5rem; /* Rounded corners */
        white-space: nowrap;
        opacity: 0;
        transition: opacity 0.2s;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); /* Optional shadow */
    }

    .tooltip:hover::after {
        opacity: 1;
    }