/* Custom styles goes here */

:root{
    --bs-border-radius: 0.25rem;
}

body {
    box-sizing: border-box;
}

.menu-vertical .menu-item{
    font-weight: 500;
}
.menu-vertical .menu-item.open{
    font-weight: 600;
}
.dt-scroll-headInner{
    min-width: 100% !important;
}
div.dt-scroll-head table.dataTable {
    min-width: 100% !important;
}
.nav-item:has(.hide-arrow .bx-grid-alt) {
    display: none !important;
}
input{
    box-sizing: border-box;
}

input:focus{
    outline: none;
}

::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: rgba(179, 179, 179, 0.93);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #777676;
}

p {
    word-break: break-word; /* Ensures long words break */
    overflow-wrap: break-word; /* Alternative */
    white-space: normal; /* Allows text wrapping */
}


.required::after {
    content: "*";
    color: red;
    margin-left: 0.25em;
}

.app-brand-link.gap-2 img {
    width: 200px;
}


.btn{
    border-radius: .15em !important;
    --bs-btn-padding-y: 0.3375rem !important;
}

.btn-primary:hover {
    color: #fff !important;
    background-color: #14534F !important;
    border-color: #2a198cd9 !important;
}

.btn-list .btn-icon{
    border:none;
}

.btn .icon {
    width: var(--bs-btn-icon-size);
    height: var(--bs-btn-icon-size);
    min-width: var(--bs-btn-icon-size);
    vertical-align: bottom;
    color: inherit;
}




form .error:not(li):not(input) {
    margin-left: 4px;
}

.link-primary {
    color: var(--bs-primary) !important;
}


/*======== SPINER ===========*/

#fullPageSpinner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.8); /* Semi-transparent background */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.spinner {
    width: 50px;
    height: 50px;
    border: 5px solid rgba(0, 0, 0, 0.1);
    border-top: 5px solid var(--bs-primary);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/*======== NAV LINKS ===========*/
.nav-link.dropdown-toggle:after {
    transition: transform 0.3s ease;
}

.nav-link.dropdown-toggle[aria-expanded="true"]:after {
    transform: rotate(135deg);
}

.dropdown-item:hover{
    background-color: #e6e6ff !important;
    font-weight: 500;
}

.nav-link i{
    color:rgba(84, 79, 90, 0.7);
}

.nav-link.active i{
    color: #ffffff;
}
.nav-link-title{
    font-size: 1em;
    font-weight: 500;
    color:rgba(84, 79, 90, 1);
}

.layout-navbar.navbar-detached {
    /*box-shadow: unset !important;*/
    /*background-color: transparent !important;*/
    /*padding: 0 0 !important;*/
    border-radius: 0.375em;
}


.header-actions{
    /*background-color: #fff;*/
    /* box-shadow: var(--bs-box-shadow);*/
    /*padding: .6em 1.5em;
    padding-left: 0.75em !important;
    border-radius: 10em;*/
}
/*======== TABLER LAYOUT ===========*/

.table {
    --bs-table-bg: #fff;
}

.dt-column-order{
    right: 5px !important;
}

.page-action{
    margin-right: 1.7em;
    padding:unset !important;
}

@media (min-width: 768px) {
    .table-action .btn-primary,
    .page-action .btn-primary {
        min-width: 100px;
    }


}

@media screen and (max-width: 767px) {
    div.dt-buttons {
        float: unset !important;
        text-align: center;
        margin-bottom: unset !important;
        width: unset !important;
    }
}

@media screen and (max-width: 576px) {
    div.dt-buttons {
        min-height: 38px;
    }
}


.clear-search {
    display:none;
}

.clear-search.show{
    display:block;
}

table.table.dataTable.table-striped>tbody>tr:nth-of-type(2n+1)>* {
    box-shadow: inset 0 0 0 9999px rgb(0 0 0 / 0%) !important;
}

.table > :not(caption) > * > *, .markdown > table > :not(caption) > * > *{
    border-bottom: unset !important;
}


.table-striped.table:not(.table-borderless):not(.table-dark) > :not(caption) > *:not(.table-dark) > * {
    border-top-width: 0px !important;
}
table.table-striped thead th {
    background-color: rgba(148, 216, 188, 0.89) !important;
    padding: 1em !important;
    font-size: 1em !important;
    font-weight: 600 !important;
    text-transform: unset !important;
}

.table-striped > tbody > tr:nth-of-type(even) > * {
    background-color: var(--bs-body-bg) !important;
    border-style: unset !important;
    border-top-width: 0 !important;
}

.table-striped .btn-icon{
    border:unset !important;
    box-shadow: unset !important;
}

.table-striped .btn-icon .icon{
    width: 1.125em !important;
    height: 1.125em !important;
}


.table-striped .parent-row .form-check-input{
    width: 1.5em !important;
    height: 1.5em !important;
}

.table-striped .colstt{
    color:var(--bs-primary) !important;
    font-weight: bold !important;

}
.dataTables_scrollBody thead th{
    padding-top:1px !important;
    padding-bottom: 1px !important;
}

.table-striped > :not(caption) > * > * {
    color: #000000 !important;

}

.table-striped.dataTable tbody tr>.dtfc-fixed-start, table.dataTable tbody tr>.dtfc-fixed-end {
    background-color: #fefefe;
}

.table-striped.dataTable td{
    /* font-size: 14px !important;*/
    padding: 0.5rem 1.25rem !important;
    /*max-width: 200px !important;*/
    overflow: hidden !important;
}

.table-striped .form-check{
    margin: 0 !important;
}

.table-striped tr th:first-child {
    border-top-left-radius: .5em !important;
}

.table-striped tr th:last-child {
    border-top-right-radius: .5em !important;
}


/*========= TOM SELECT =======*/
.ts-control{
    color:#384551;
    background-color: #fff !important;
}

.ts-dropdown{
    margin: unset !important;
}

.tom-select .option{
    padding: .5em 1.25em;
}

.ts-dropdown .active{
    background-color: #e6e6ff !important;
    font-weight: 500;
}

.focus .ts-control {
    border-color: #14534F !important;
    outline: 0;
    box-shadow: unset !important;
    border-width: 1px !important;
}

/*
.form-control:focus {
    color: inherit;
    background-color: var(--bs-bg-forms);
    border-color: #e6e6ff !important;F
    outline: 0;
    box-shadow: 0 0 0 0.125rem rgba(78, 78, 152, 0.35) !important;
}*/

.input-group-flat:focus-within {
    box-shadow: unset !important;
}

/*========= INPUT =======*/
.form-control{
    background-color: #fff !important;
}

.col-form-label,
.form-label,
.form-check-label{
    /* font-size: .875em !important;*/
    font-weight: 500;
    cursor: pointer;
}


.ts-control{
    border-color: #ced1d5 !important;
}

.ts-dropdown,
.ts-control,
textarea,input{
    /*font-size: .9375em !important;*/
}

textarea::placeholder,
input::placeholder {
    font-style: italic;
}

.form-control:focus,
.input-group:focus-within .form-control,
.input-group:focus-within .input-group-text

{
    border-width: 2px; /* or 1px to match non-focused state */
    padding: 0.4375rem 0.75rem;
}

.clear-search svg{
    width: .8375em;
    height: .8375em;
}

.unClickable{
    pointer-events: none;
}

.ts-wrapper{
    min-height: 35px !important;
}

/*========= SUMMER NOTE =======*/

.note-editor.note-frame:focus-within{
    border-color: var(--bs-primary) !important;
    border-width: 2px;
    box-shadow: unset;
}

.note-editor.note-frame{
    border: 1px solid #ced1d5;
    border-radius: .375em;
}


/*========= CARD =======*/
.card-question .card-body{
    padding: .75em 1.5em !important;
}



/*========= ALERT =======*/
.alert {
    --tblr-alert-color: #656d77;
    border: 1px solid rgba(101,109,119,.16);
    border-left: .25rem solid var(--tblr-alert-color);
    box-shadow: rgba(35,46,60,.04) 0 2px 4px 0;
    background-color: #fff;
}

.alert > :last-child {
    margin-bottom: 0
}

.alert-important {
    border-color: transparent;
    background: var(--tblr-alert-color);
    color: #fff;
    font-weight: 500
}

.alert-important .alert-icon {
    color: inherit
}

.alert-link, .alert-link:hover {
    color: var(--tblr-alert-color)
}

.alert-primary {
    --tblr-alert-color: #206bc4
}

.alert-secondary {
    --tblr-alert-color: #656d77
}

.alert-success {
    --tblr-alert-color: #2fb344
}

.alert-info {
    --tblr-alert-color: #4299e1
}

.alert-warning {
    --tblr-alert-color: #f76707
}

.alert-danger {
    --tblr-alert-color: #d63939
}

.alert-light {
    --tblr-alert-color: #f4f6fa
}

.alert-dark {
    --tblr-alert-color: #232e3c
}

.alert-icon {
    color: var(--tblr-alert-color);
    width: 1.5rem !important;
    height: 1.5rem !important;
    margin: -.125rem 1rem -.125rem 0
}

.alert-title {
    font-size: .875rem;
    line-height: 1.4285714;
    font-weight: 600;
    margin-bottom: .25rem
}

.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
    color: #14534F;
}


/*========= MODAL =======*/
.modal-footer {
    padding: .75rem 1.5rem !important;
}

.modal-header {
    padding: .75rem 1.5rem !important;
}

.modal-body{
    background-color: var(--bs-body-bg) !important;
}

@media (max-width: 991px) {
    .modal-dialog {
        max-width: 100% !important; /* Full width */
        margin-left: 0 !important; /* Remove margins */
        margin-right: 0 !important; /* Remove margins */
    }

    .modal-content {
        height: 100%; /* Ensure the modal takes full height */
        display: flex;
        flex-direction: column;
    }
}

/*========= HEADER =======*/

.nav-pageTitle h4, .mobile-pageTitle h4{
    margin: 0 !important;
    padding: 0;
    font-weight: 400 !important;
}

/* Hide title on screens <= 768px */
@media (max-width: 567px) {
    .nav-pageTitle {
        display: none !important;
    }
    .mobile-pageTitle {
        display: block !important;
    }
    .modal-title{
        font-size: 1em !important;
        margin-bottom: 0 !important;
    }
}

/* Show title on screens > 768px */
@media (min-width: 567px) {
    .mobile-pageTitle{
        display: none;
    }
    .nav-pageTitle {
        display: block;
    }


}