.custom-header,
[data-header-styles=light] .custom-header {
    background-color: #8D744C !important;
    border: none !important;
    font-size: large;
    font-weight: 700;
}
.custom-app-sidebar,
[data-header-styles=light] .custom-app-sidebar{
    background-color: #8D744C1A !important;
}

@media (max-width: 991.98px) {
    [data-toggled=open] .custom-app-sidebar {
        background-color: #8D744C !important;
        z-index: 99999 !important;
    }

    [data-toggled=open] .custom-app-sidebar .side-menu__item .side-menu__icon,
    [data-toggled=open] .custom-app-sidebar .side-menu__item .side-menu__label{
        /*color: #000 !important;*/
    }
    
    [data-toggled=close] .custom-app-sidebar,
    [data-toggled=double-menu-close] .custom-app-sidebar{
        display: none !important;
    }
}

@media (min-width: 991.99px) {
    .sidemenu-toggle{
        display: none !important;
    }
}

.app-sidebar .side-menu__item.active,
.app-sidebar .side-menu__item:hover {
    color: #fff;
    background-color: #8D744C !important;
}

.custom-btn-primary {
    background-color: #8D744C !important;
    border-color: #8D744C !important;
    color: #fff !important;
}

/* 
   Direct CSS overrides should be avoided when possible. 
   Please use the SCSS files in assets/scss/ instead and run 'npm run ynex' to compile.
*/
.table-header-title {
    font-family: "Almarai", sans-serif !important;
    font-weight: 700;
    font-style: bold;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 0;
    color: #637381;
}
.table-header{
    background-color: #f8f9fa !important;
}
* {
    font-family: "Almarai", sans-serif !important;
}
.custom-table-item {
    font-family: "Almarai", sans-serif !important;
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0;
    color: #263238;
}


.form-check-input{
    border-radius: 20px;
}

/*!* Modern rounded input styling *!*/
/*.form-control, .form-select {*/
/*    border-radius: 50px !important;*/
/*    padding: 0.875rem 1.25rem !important;*/
/*    background-color: #e8e8e8 !important;*/
/*    border: 0 !important;*/
/*    font-size: 0.95rem;*/
/*    transition: all 0.2s ease;*/
/*}*/

/*.form-control:focus, .form-select:focus {*/
/*    outline: none !important;*/
/*    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3) !important;*/
/*    background-color: #e8e8e8 !important;*/
/*}*/

/*.form-control::placeholder {*/
/*    color: #999 !important;*/
/*    font-weight: 400;*/
/*}*/

/*.form-control:hover:not(:focus), .form-select:hover:not(:focus) {*/
/*    background-color: #ddd !important;*/
/*}*/

/*!* Input group adjustments for rounded style *!*/
/*.input-group {*/
/*    border-radius: 50px !important;*/
/*    overflow: hidden;*/
/*    background-color: #e8e8e8;*/
/*}*/

/*.input-group .input-group-text {*/
/*    background-color: #e8e8e8 !important;*/
/*    border: 0 !important;*/
/*    padding: 0.875rem 1rem;*/
/*    color: #666;*/
/*    border-radius: 50px 0 0 50px !important;*/
/*}*/

/*.input-group .form-control {*/
/*    background-color: #e8e8e8 !important;*/
/*    border: 0 !important;*/
/*    border-radius: 0 50px 50px 0 !important;*/
/*    padding-left: 0.5rem !important;*/
/*}*/

/*!* RTL Support for input groups *!*/
/*[dir="rtl"] .input-group .input-group-text {*/
/*    border-radius: 0 50px 50px 0 !important;*/
/*}*/

/*[dir="rtl"] .input-group .form-control {*/
/*    border-radius: 50px 0 0 50px !important;*/
/*    padding-right: 0.5rem !important;*/
/*    padding-left: 1.25rem !important;*/
/*}*/

/*!* File input styling *!*/
/*input[type="file"] {*/
/*    border-radius: 50px !important;*/
/*    padding: 0.75rem 1.25rem !important;*/
/*    background-color: #e8e8e8 !important;*/
/*    border: 0 !important;*/
/*}*/

/*!* Submit button styling *!*/
/*button[type="submit"] {*/
/*    border-radius: 50px !important;*/
/*    padding: 0.875rem 1.5rem !important;*/
/*    background-color: rgba(145, 158, 171, 0.219)!important;*/
/*    color: #212B36 !important;*/
/*    font-weight: 600 !important;*/
/*    font-size: 1rem;*/
/*    transition: all 0.2s ease;*/
/*    border: none !important;*/
/*    width: 100%;*/
/*}*/

/*button[type="submit"]:hover:not(:disabled) {*/
/*    background-color: #646464 !important;*/
/*    transform: translateY(-1px);*/
/*    box-shadow: 0 4px 12px rgba(44, 62, 80, 0.3);*/
/*}*/

/*button[type="submit"]:disabled {*/
/*    opacity: 0.6 !important;*/
/*    cursor: not-allowed !important;*/
/*}*/

/*!* Label styling *!*/
/*.form-label {*/
/*    color: #5d5d5d !important;*/
/*    font-weight: 500;*/
/*    margin-bottom: 0.5rem;*/
/*    font-size: 0.9rem;*/
/*}*/

/* Password toggle button styling */
/*.input-group button.ti-btn {*/
/*    background-color: rgba(145, 158, 171, 0.219)!important;*/
/*    color: #212B36 !important;*/
/*    border: 0 !important;*/
/*    border-radius: 0 50px 50px 0 !important;*/
/*    padding: 0.875rem 1rem;*/
/*}*/

/*.input-group button.ti-btn:hover {*/
/*    background-color: #ddd !important;*/
/*    color: #696868 !important;*/
/*}*/

/*[dir="rtl"] .input-group button.ti-btn {*/
/*    border-radius: 50px 0 0 50px !important;*/
/*}*/

/* Link styling */
/*a {*/
/*    color: #3b82f6;*/
/*    text-decoration: none;*/
/*    transition: color 0.2s ease;*/
/*}*/

/*a:hover {*/
/*    color: #2563eb;*/
/*    text-decoration: underline;*/
/*}*/

/* Loading Screen Styles */
.app-loading{
    position:fixed;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:#ffffff;
    z-index:9999;
}

.logo-loader{
    animation:pulseLogo 1.6s ease-in-out infinite;
}

.loading-text{
    margin-top:18px;
    font-size:14px;
    color:#666;
    letter-spacing:1px;
}

/* animation */

@keyframes pulseLogo{
    0%{
        opacity:0.5;
        transform:scale(0.95);
    }
    50%{
        opacity:1;
        transform:scale(1.05);
    }
    100%{
        opacity:0.5;
        transform:scale(0.95);
    }
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translate(-50%, -1rem);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

.animate-slideDown {
    animation: slideDown 0.2s ease-out;
}
.ti-list-group-item:not(.disabled):hover {
    background-color: #f1f5f2 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}