@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Belanosima:wght@400;600;700&display=swap');


*,
body {
    font-weight: 400 !important;
}

.belanosima-bold {
    font-family: "Belanosima", serif;
    font-weight: 700;
    font-style: normal;
}

.poppins-regular,
body {
    font-family: "Poppins", serif;
    font-weight: 400;
    font-style: normal;
}

/*ScorolBar On Sidebar*/
.sidebar>.sidebar-body>.scrollbar-track-y>.scrollbar-thumb-y,
.sidebar>.sidebar-body>.scrollbar-track-y {
    width: 4px !important;
}

/* .sidebar>.sidebar-body>.scrollbar-track-x{
    display: none !important;
    overflow: hidden !important;
}

.sidebar-mini>.sidebar-body>.scroll-content>.sidebar-list>.iq-main-menu>li>.nav-link, .sidebar-mini>.sidebar-body{
    transform: none !important;
    width: 60px !important;
} */

.sidebar-mini>.sidebar-body>.scroll-content>.sidebar-list>ul>li>a>.item-name,
.sidebar-mini>.sidebar-body>.scroll-content>.sidebar-list>ul>li>a>.right-icon {
    display: none !important;
}

.btn-select:active {
    background: rgb(255, 255, 255) !important;
}

.btn-select:hover {
    background: rgb(255, 255, 255) !important;
}


.side-nones {
    overflow-x: hidden !important;
}

body {
    background: #F5F6FA;
}

/*Login BackgroundImage*/
.bg-img-Auth {
    background-image: url('../../images/dashboard/back-img-log.avif');
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

/*Fonts*/
.f-10 {
    font-size: 10px !important;
}

.f-12 {
    font-size: 12px !important;
}

.f-14 {
    font-size: 14px !important;
}

.f-16 {
    font-size: 16px !important;
}

.f-18 {
    font-size: 18px !important;
}

.f-20 {
    font-size: 20px !important;
}

.f-22 {
    font-size: 22px !important;
}

.f-24 {
    font-size: 24px !important;
}

.f-26 {
    font-size: 26px !important;
}

.f-28 {
    font-size: 28px !important;
}

.f-30 {
    font-size: 30px !important;
}


/* Remove outline on button */
.btn:focus,
.btn:active {
    outline: none !important;
    box-shadow: none !important;
}


/*Border*/
.bor-4 {
    border-radius: 4px !important;
}

.bor-6 {
    border-radius: 6px !important;
}

.bor-15 {
    border-radius: 15px !important;
}

.btn-primary-s {
    background: #044ff0 !important;
    color: white !important;
}

.btn-primary-s:hover {
    background: white !important;
    color: #044ff0 !important;
    border: 1px solid #044ff0 !important;
}


.mt-n10 {
    margin-top: -215px !important;
}

.mt-n11 {
    margin-top: -225px !important;
}

.ps-8 {
    padding-left: 38% !important;
}

/*Icons margine get mid*/
.mes-1 {
    margin-left: -1px !important;
}

.msr-2{
     margin-right: 2px !important;
}

.w-60 {
    width: 60% !important;
}

.w-80 {
    width: 80% !important;
}

.w-90 {
    width: 90% !important;
}


.w-40 {
    width: 40% !important;
}

.normal-page-size {
    min-height: calc(100vh - 180px) !important;
}


.bg-light-blue {
    background: rgb(192, 215, 255) !important;
}

.bg-light-text-blue {
    color: #bfd3ff;
}

.color-grey {
    color: rgb(109, 109, 109) !important;
}


.bor-color-grey {
    border: 1px solid #d6d6d6;
}


/*List Show Select*/
.select2-dropdown>.select2-results>.select2-results__options>.select2-results__option {
    margin: 2px 4px 2px 4px !important;
    padding: 12px 15px 12px 15px !important;
    border-radius: 4px !important;
}

.select2-search>.select2-search__field {
    border-radius: 4px !important;
    padding: 10px 10px !important;
}


/*AnimationDuration*/
.animation_time {
    transition: 0.3s all ease-in-out !important;
}


/*Set Backgrounds*/
.auth-back-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.breadcrumb {
    list-style-type: none;
    /* Removes default list markers */
    padding-left: 0;
    /* Optional: remove any padding */
    display: flex !important;
}

.breadcrumb-item {
    display: inline-block;
    /* Ensures breadcrumb items are inline */
    display: flex !important;
}

#nav-tab>.active {
    background: #044ff0 !important;
    color: white !important;
    transition: 0.3s all ease-in-out !important;
}

#nav-tab>.nav-link {
    transition: 0.3s all ease-in-out !important;
}

.bg-input-grey,
.bg-input-grey>input,
.bg-input-grey>select {
    background: #F1F1F1 !important;
    border: none !important;
    color: #707070 !important;
    border-radius: 4px !important;
}

.lines-vr {
    background: #044ff0 !important;
    width: 4px !important;
}

.btn-size-70 {
    min-width: 70px !important;
}


.input-container-te {
    position: relative;
}

.input-container-te>.select2 {
    width: 100% !important;
}

.input-te {
    height: 48px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 16px;
}

.input-te-s {
    height: 48px;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 16px;
}

.label,
.label-n {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 16px;
    display: flex;
    align-items: center;
    pointer-events: none;
}

.input-te,
.label .text,
.label-n {
    font-size: 16px;
}

.label .text,
.label-n {
    transition: all 0.15s ease-out;
    color: #7a7a7a;
}

.input-te:focus {
    outline: none;
    border: 2px solid #044ff0;
}

.input-te:focus+.label .text,
:not(.input-te[value=""])+.label .text {
    font-size: 12px;
    transform: translate(-8px, -140%);
    background-color: white;
    padding-left: 4px;
    padding-right: 4px;
}

.input-te-r {
    height: auto;
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 16px;
    resize: none !important;
}

.label-r {
    position: absolute;
    top: -136px;
    left: 16px;
    display: flex;
    align-items: center;
    pointer-events: none;
}

.input-te-r:focus+.label-r .text,
:not(.input-te[value=""])+.label-r .text {
    font-size: 12px;
    transform: translate(-8px, -140%);
    background-color: white;
    padding-left: 4px;
    padding-right: 4px;
}

.input-te:focus+.label .text {
    color: #044ff0;
}

.btn-rounds-size {
    height: 34px !important;
    display: flex !important;
    justify-content: center;
    align-items: center;
    border-radius: 6px !important;
}

/*Backgrounds Colors*/
.bg-light-grey {
    background: #f5f5f5 !important;
}

.is-invalid {
    border-color: #b90000;
}

.bg-light-red {
    background-color: #ffdfdf !important;
}

.bg-light-green {
    background-color: #c4f0c4 !important;
}

.bg-lights-blue {
    background-color: #c4d6f0 !important;
}

.light-green-hover:hover {
    background-color: #c4e6c4 !important;
    transition: transform 0.3s ease-in-out;
}

.light-red-hover:hover {
    background-color: #f0bbbb !important;
    transition: transform 0.3s ease-in-out;
}

#generateDataExel:hover img,
#generateDataPdf:hover img {
    transform: scale(1.1);
    transition: transform 0.3s ease-in-out;
}

.light-grey-hover {
    background-color: #e8e8e8 !important;
}

.light-grey-hover:hover {
    background-color: #cacaca !important;
    transition: transform 0.3s ease-in-out;
}


.light-green-hover,
.light-red-hover,
.light-grey-hover {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.light-green-hover:focus,
.light-green-hover:active,
.light-red-hover:focus,
.light-red-hover:active,
.light-grey-hover:focus,
.light-grey-hover:active {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/*Buttons*/
.light-grey-btn {
    background: #f5f5f5 !important;
    border: none !important;
}

.light-grey-btn:hover {
    background: #e4e4e4 !important;
}


/*List-show*/
.show-list {
    width: 180px !important;
    position: absolute !important;
    left: -90px !important;
    margin-top: 8px !important;
}

#drop-dwn>ul>li>a {
    border-bottom: 1px solid #d8d8d8 !important;
}

#drop-dwn>ul>li>a:last-child {
    border-bottom: none !important;
}


/*Searchs */
.dt-search>.dt-input {
    margin-left: 10px !important;
    height: 32px !important;
    padding-left: 15px !important;
    min-width: 250px !important;
    border-radius: 10px !important;
    background: rgb(243, 243, 243) !important;
}

/*Length*/
.dt-length>.dt-input {
    -webkit-appearance: none;
    /* Chrome, Safari */
    -moz-appearance: none;
    /* Firefox */
    appearance: none;
    /* Standard syntax */
    background: none;
    /* Optional: Remove default background */
    border: 1px solid #ccc;
    /* Optional: Customize the border */
    padding-right: 20px;
    width: 50px !important;
    height: 32px !important;
    text-align: center !important;
    border-radius: 10px !important;
    background: rgb(243, 243, 243) !important;
}

.dt-length>.dt-input.dt-length>.dt-input,
.dt-length>label {
    display: none !important;
}

.dt-input option {
    padding: 8px 12px;
}

/* Hide elements on mobile (max-width: 576px) */
.d-none-mb {
    display: block !important;
    /* or use your preferred display type */
}

.d-none {
    display: none !important;
}


/* Fixed position input */
.fixed-select-input {
    width: 350px !important;
    max-height: 250px !important;
    overflow-y: scroll !important;
    z-index: 10000 !important;
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3) !important;
}

.round-size {
    width: 9px;
    height: 9px;
}

/*Active Inactive */
.acIn-mar {
    margin-top: 2px !important;
}

/* Resetting styles */
input,
button,
select,
textarea {
    position: unset !important;
}

.box-width-range {
    min-width: 110px !important;
}



.input-container-te>button {
    background: white !important;
}

.selection>.select2-selection,
.selection>.select2-selection>.select2-selection__arrow {
    height: 48px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding-right: 3em !important;
}

.selection>.select2-selection {
    border: 1px solid #d6d6d6;
}

.selection>.select2-selection>.select2-selection__rendered {
    width: 100% !important;
    padding-right: 5px !important;
    padding-left: 16px !important;
}


/*Icons size*/
.size-i-1>.iconsax>svg {
    width: 20px !important;
}

/*Data Table Column Size*/
.td-item {
    width: 100px !important;
}

.td-min-item {
    width: 120px !important;
}

.td-max-item {
    width: 140px !important;
}

/*Vr width Fix Last Update User*/
.vr-w-4 {
    width: 4px !important;
}

/*Nav Items Show*/
.max-nav-item-size {
    min-width: 200px !important;
}

.z-index-set-nav {
    z-index: 100 !important;
}

#navbarSet>.btn-select>.dropdown-item {
    white-space: normal !important;
}

#navbarSet>.btn-select>.dropdown-item>a {
    border-radius: 6px !important;
}

#navbarSet>.btn-select:last-child>form {
    border-radius: 0 !important;
}

#navbarSet>.btn-select>.dropdown-item>a:hover,
#navbarSet>.btn-select:last-child>form:hover {
    background: #f5f5f5;
}

.show>ul>li>a>div>h6,
.show>ul>li>a>div>p {
    color: white !important;
    padding: 0 4em !important;
}

/*Table Scoroly Fixes */
.column-size-fixed {
    white-space: normal !important;
    max-width: 90px !important;
}

#nextDayCheck,
#nextDayCheck_up {
    width: 40px !important;
    height: 25px !important;
}

.model-table-size {
    max-height: 250px !important;
}

.select2-dropdown {
    min-width: 180px !important;
}

#newAttendancyTable_wrapper>.dt-layout-table>.dt-layout-full>.dt-scroll>.dt-scroll-head>.dt-scroll-headInner,
#newAttendancyTable_wrapper>.dt-layout-table>.dt-layout-full>.dt-scroll>.dt-scroll-head>.dt-scroll-headInner>.dataTable,
#newAttendancyTable_wrapper>.dt-layout-table>.dt-layout-full>.dt-scroll>.dt-scroll-foot>.dt-scroll-footInner,
#newAttendancyTable_wrapper>.dt-layout-table>.dt-layout-full>.dt-scroll>.dt-scroll-foot>.dt-scroll-footInner>.dataTable {
    width: 100% !important;
}

.td-btn {
    width: 70px !important;
}

.select2-container--open {
    z-index: 1800 !important;
}

.size-con-rollout-icon {
    width: 24px !important;
    height: 24px !important;
}

.bor-danger {
    border: 1px solid #b90000 !important;
}

.overflow-hidden {
    overflow: hidden !important;
}

/* Hide the element specifically for mobile (max-width: 576px) */
@media (max-width: 576px) {
    .d-none-mb {
        display: none !important;
    }

    .fix-select-input {
        width: 60vw !important;
    }
}


@media (max-width:1200px) {
    .apply-toglet {
        width: 100% !important;
    }

    .custom-drop>.dropdown-menu-end {
        position: absolute !important;
        height: auto !important;
    }

    #navbarSupportedContent>ul>li>ul>li {
        padding-top: 0px !important;
        padding-right: 0px !important;
    }

    #navbarSupportedContent>ul>li>ul>li:nth-last-child(1) {
        padding: 10px 0 10px 0 !important;
    }
}


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

/* Tooltip text */
.tooltip-panel {
    visibility: hidden;
    width: 120px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 125%;
    /* Position above the button */
    left: 50%;
    margin-left: -60px;
    /* Center the tooltip */
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 20000 !important;
}

/* Tooltip arrow */
.tooltip-panel::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
    z-index: 20000 !important;
}

/* Show the tooltip on hover */
.tooltip-container:hover .tooltip-panel {
    visibility: visible;
    opacity: 1;
    z-index: 20000 !important;
}

#attendenceTb>tbody>tr:nth-child(1)>td>.tooltip-container>.tooltip-panel {
    top: 110% !important;
    /* Position above the button */
    left: 50% !important;
    max-height: 75px !important;
    min-height: 50px !important;
}

#attendenceTb>tbody>tr:nth-child(1)>td>.tooltip-container>.tooltip-panel::after {
    top: -10px !important;
    left: 50% !important;
    transform: rotate(180deg) !important;
}

/*Table Posstion Loading Set*/
.pos-set {
    position: absolute !important;
    inset: 0 !important;
}

.loading-page-size {
    width: 100% !important;
    height: 100% !important;
}

.img-size-set-loading {
    width: 250px !important;
    height: 200px !important;
}

/*Report Button Size Cover*/
.btn-size-cover {
    height: 48px !important;
    width: 48px !important;
}

#attendenceSheetTb>tbody>tr>td {
    max-width: 130px !important;
}

#attendenceSheetTb>tbody>tr>td:last-child {
    max-width: 200px !important;
    white-space: normal !important;
}


/*Operation Download PDF & EXEL buttons*/
.btn-size-ops {
    height: 55px !important;
    width: 55px !important;
}



/*Select select 2 multiple*/

.select2-selection--multiple {
    display: flex !important;
    align-items: center !important;
    /* overflow: hidden !important; */
    overflow-x: scroll !important;
    overflow-y: hidden !important;
    height: 42px !important;
    width: 100% !important;
    padding: 0px !important;
}

.select2-selection--multiple>.select2-selection__rendered {
    display: flex !important;
    align-items: center !important;
    padding-left: 12px !important;
    height: 42px !important;
}

.select2-selection--multiple>.select2-selection__rendered>.select2-selection__choice {
    display: flex !important;
    align-items: center !important;
    border: 4px !important;
    height: 30px !important;
    padding: 6px 10px 6px 10px !important;
    margin: 0px 4px !important;
    transform: translateY(4px) !important;
}

.select2-selection--multiple>.select2-selection__rendered>.select2-selection__choice>.select2-selection__choice__remove {
    margin-right: 5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 15px !important;
    height: 15px !important;
    background-color: #ffdddd !important;
    color: #b90000 !important;
    border-radius: 50px !important;
}

.select2-container--default>.selection {
    display: flex !important;
    align-items: center !important;
    justify-content: start !important;
}

.select2-selection--single {
    width: 100% !important;
}


/* Apply margin to the last row when there are 1 or 2 rows in the table */
#attendenceTb tbody tr:nth-last-child(1):last-child,
#attendenceTb tbody tr:nth-last-child(2):last-child {
    margin-bottom: 60px;
}

#commonModal>div {
    background: rgba(0, 0, 0, 0.3) !important;
}

.size-fixed-card-status {
    max-width: 155px !important;
}

.tbcard-size-s {
    width: 25px !important;
    height: 25px !important;
}


/*Button Border Set Home pages*/
.btn-r-tb-bor-6 {
    border-radius: 0 6px 6px 0 !important;
}

.btn-l-tb-bor-6 {
    border-radius: 6px 0 0 6px !important;
}

/**/
.btn-primary-1 {
    background: #00489b !important;
    color: white !important;
}

.btn-success-1 {
    background: #006d24 !important;
    color: white !important;
}

.btn-danger-1 {
    background: #9b0000 !important;
    color: white !important;
}


/*Table Styles Updates*/
/*Salary Advanced Approve Table Style Update*/
#empDataTb_wrapper>.dt-layout-table>.dt-layout-full,
#salStDb_wrapper>.dt-layout-table>.dt-layout-full,
#salAdTb_wrapper>.dt-layout-table>.dt-layout-full,
#attendenceTb_wrapper>.dt-layout-table>.dt-layout-full,
#attendenceTb_wrapper>.dt-layout-table>.dt-layout-full,
#leveDattbl_wrapper>.dt-layout-table>.dt-layout-full,
#attendenceSheetTb_wrapper>.dt-layout-table>.dt-layout-full,
#attendenceSummmerySheetTb_wrapper>.dt-layout-table>.dt-layout-full,
#dailyslrytbl_wrapper>.dt-layout-table>.dt-layout-full,
#staffLoanTb_wrapper>.dt-layout-table>.dt-layout-full {
    min-height: 450px !important;
}

#lAttendanceLogTB_wrapper>.dt-layout-table>.dt-layout-full,
#dailybreakdownTb_wrapper>.dt-layout-table>.dt-layout-full {
    min-height: calc(100vh - 400px) !important;
}

#newAttendancyTable_wrapper>.dt-layout-table>.dt-layout-full {
    min-height: calc(55vh - 200px) !important;
}

#businessUnitTb_wrapper>.dt-layout-table>.dt-layout-full,
#attendencePaySheetSheetTb_wrapper>.dt-layout-table>.dt-layout-full,
#SpecialPaymentTb_wrapper>.dt-layout-table>.dt-layout-full,
#SpecialDeductionTb_wrapper>.dt-layout-table>.dt-layout-full,
#mealRequestTb_wrapper>.dt-layout-table>.dt-layout-full,
#mealPreviewTable_wrapper>.dt-layout-table>.dt-layout-full,
#attendenceDaySummmerySheetTb_wrapper>.dt-layout-table>.dt-layout-full {
    min-height: calc(100vh - 260px) !important;
}

#viewCover, #viewCover>div {
    min-height: calc(100vh - 180px) !important;
}

.col-name-width {
    max-width: 160px !important;
    white-space: normal !important;
}

.notify-record {
    width: 45px !important;
    height: 45px !important;
}

.td-width-50 {
    width: 50px !important;
}

#salAdTb>tbody>tr>td:nth-child(7),
#salAdTb>thead>tr>th:nth-child(7) {
    width: 50px !important;
    padding: 5px !important;
    margin: 0 !important;
}


.child>.child>.dtr-details {
    width: 100% !important;
}

.child>.child>.dtr-details>li {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.child>.child>.dtr-details>.td-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.notify-record {
    padding: 0.375rem 0.75rem;
    position: relative;
    display: inline-flex;
}

.notify-record .badge {
    transform: translate(25%, -25%);
    padding: 0.25em 0.4em;
}

.size-i-1 {
    display: flex;
    align-items: center;
    justify-content: center;
}

.badge {
    margin-top: 10px !important;
}


.ops-1 {
    background: rgb(0, 0, 0, 0.3) !important;
}

#loanSheduleAdjustmentTb_wrapper,
#loanSheduleAdjustmentTb_wrapper>.dt-layout-table>.dt-layout-full>.dt-scroll>.dt-scroll-body {
    min-height: 400px !important;
}

.text-gray {
    color: rgb(79, 79, 79) !important;
}

.dt-paging>nav>.dt-paging-button {
    border: 1px solid #cacaca !important;
    border-radius: 4px !important;
}

.dt-paging>nav>.current {
    background: #cacaca !important;
    width: 33px !important;
}