:root,
[data-bs-theme=light] {
	--bs-header-bg: #ffffff;
	--bs-header-item-color: var(--bs-header-item-color);
	--bs-header-item-sub-color: var(--bs-secondary-color);
	--bs-header-height: 70px;
	--bs-footer-height: 60px;
	--bs-footer-bg: #fafafa;
	--bs-footer-color: #5b626b;
	--bs-header-dark-bg: #2b3a4a;
	--bs-header-dark-item-color: #e9ecef;
	--bs-topbar-search-bg: #f8f9fa;
	--bs-dropdown-topbar: #f8f9fa;
	--bs-topnav-bg: #fff;
	--bs-topnav-item-color: #545b62;
	--bs-topnav-item-color-active: var(--bs-primary);
	--bs-header-item-color: #555b6d;
	--bs-navbar-header-bg: #2f3f50;
	--bs-boxed-body-bg: #e8e8e8;
	--bs-sidebar-bg: #ffffff;
	--bs-sidebar-menu-item-color: #79829c;
	--bs-sidebar-menu-sub-item-color: #79829c;
	--bs-sidebar-menu-item-icon-color: #7f8387;
	--bs-sidebar-menu-item-hover-color: #383c40;
	--bs-sidebar-menu-item-active-color: #7a6fbe;
	--bs-sidebar-menu-item-active-bg: #f5f5f5;
	--bs-sidebar-width: 240px;
	--bs-sidebar-collapsed-width: 70px;
	--bs-sidebar-width-sm: 160px
}

:root [data-topbar=light],
[data-bs-theme=light] [data-topbar=light] {
	--bs-topbar-search-bg: #f1f5f7
}


:root [data-sidebar=light],
[data-bs-theme=light] [data-sidebar=light] {
	--bs-sidebar-bg: #ffffff;
	--bs-sidebar-menu-item-color: #545a6d;
	--bs-sidebar-menu-sub-item-color: #545a6d;
	--bs-sidebar-menu-item-icon-color: #7f8387;
	--bs-sidebar-menu-item-hover-color: #383c40;
	--bs-sidebar-menu-item-active-color: #7a6fbe
}



:root,
[data-bs-theme=light] {
	--bs-blue: #7a6fbe;
	--bs-indigo: #564ab1;
	--bs-purple: #6f42c1;
	--bs-pink: #e83e8c;
	--bs-red: #ec536c;
	--bs-orange: #f1734f;
	--bs-yellow: #f5b225;
	--bs-green: #58db83;
	--bs-teal: #050505;
	--bs-cyan: #0dcaf0;
	--bs-black: #000;
	--bs-white: #fff;
	--bs-gray: #6c757d;
	--bs-gray-dark: #2a3142;
	--bs-gray-100: #f8f9fa;
	--bs-gray-200: #e9ecef;
	--bs-gray-300: #dee2e6;
	--bs-gray-400: #ced4da;
	--bs-gray-500: #adb5bd;
	--bs-gray-600: #6c757d;
	--bs-gray-700: #3a445b;
	--bs-gray-800: #2a3142;
	--bs-gray-900: #1f2431;
	--bs-primary: #7a6fbe;
	--bs-secondary: #6c757d;
	--bs-success: #58db83;
	--bs-info: #0dcaf0;
	--bs-warning: #f5b225;
	--bs-orange: #f1734f;
	--bs-danger: #ec536c;
	--bs-pink: #e83e8c;
	--bs-light: #f8f9fa;
	--bs-dark: #2a3142;
	--bs-purple: #6f42c1;
	--bs-primary-rgb: 122, 111, 190;
	--bs-secondary-rgb: 108, 117, 125;
	--bs-success-rgb: 88, 219, 131;
	--bs-info-rgb: 13, 202, 240;
	--bs-warning-rgb: 245, 178, 37;
	--bs-orange-rgb: 241, 115, 79;
	--bs-danger-rgb: 236, 83, 108;
	--bs-pink-rgb: 232, 62, 140;
	--bs-light-rgb: 248, 249, 250;
	--bs-dark-rgb: 42, 49, 66;
	--bs-purple-rgb: 111, 66, 193;
	--bs-primary-text-emphasis: #312c4c;
	--bs-secondary-text-emphasis: #2b2f32;
	--bs-success-text-emphasis: #235834;
	--bs-info-text-emphasis: #055160;
	--bs-warning-text-emphasis: #62470f;
	--bs-danger-text-emphasis: #5e212b;
	--bs-light-text-emphasis: #3a445b;
	--bs-dark-text-emphasis: #3a445b;
	--bs-primary-bg-subtle: #e4e2f2;
	--bs-secondary-bg-subtle: #e2e3e5;
	--bs-success-bg-subtle: #def8e6;
	--bs-info-bg-subtle: #cff4fc;
	--bs-warning-bg-subtle: #fdf0d3;
	--bs-danger-bg-subtle: #fbdde2;
	--bs-light-bg-subtle: #fcfcfd;
	--bs-dark-bg-subtle: #ced4da;
	--bs-primary-border-subtle: #cac5e5;
	--bs-secondary-border-subtle: #c4c8cb;
	--bs-success-border-subtle: #bcf1cd;
	--bs-info-border-subtle: #9eeaf9;
	--bs-warning-border-subtle: #fbe0a8;
	--bs-danger-border-subtle: #f7bac4;
	--bs-light-border-subtle: #e9ecef;
	--bs-dark-border-subtle: #adb5bd;
	--bs-white-rgb: 255, 255, 255;
	--bs-black-rgb: 0, 0, 0;
	--bs-font-sans-serif: "Poppins", sans-serif;
	--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
	--bs-body-font-family: var(--bs-font-sans-serif);
	--bs-body-font-size: 0.8125rem;
	--bs-body-font-weight: 400;
	--bs-body-line-height: 1.5;
	--bs-body-color: #1f2431;
	--bs-body-color-rgb: 31, 36, 49;
	--bs-body-bg: #f5f5f5;
	--bs-body-bg-rgb: 245, 245, 245;
	--bs-emphasis-color: #000;
	--bs-emphasis-color-rgb: 0, 0, 0;
	--bs-secondary-color: rgba(31, 36, 49, 0.75);
	--bs-secondary-color-rgb: 31, 36, 49;
	--bs-secondary-bg: #fff;
	--bs-secondary-bg-rgb: 255, 255, 255;
	--bs-tertiary-color: rgba(31, 36, 49, 0.5);
	--bs-tertiary-color-rgb: 31, 36, 49;
	--bs-tertiary-bg: #f8f9fa;
	--bs-tertiary-bg-rgb: 248, 249, 250;
	--bs-heading-color: inherit;
	--bs-link-color: #7a6fbe;
	--bs-link-color-rgb: 122, 111, 190;
	--bs-link-decoration: none;
	--bs-link-hover-color: #625998;
	--bs-link-hover-color-rgb: 98, 89, 152;
	--bs-code-color: #e83e8c;
	--bs-highlight-bg: #fcf8e3;
	--bs-border-width: 1px;
	--bs-border-style: solid;
	--bs-border-color: #dee2e6;
	--bs-border-color-translucent: rgba(0, 0, 0, 0.175);
	--bs-border-radius: 0.25rem;
	--bs-border-radius-sm: 0.25rem;
	--bs-border-radius-lg: 0.5rem;
	--bs-border-radius-xl: 1rem;
	--bs-border-radius-xxl: 2rem;
	--bs-border-radius-2xl: var(--bs-border-radius-xxl);
	--bs-border-radius-pill: 50rem;
	--bs-box-shadow: 0 -3px 31px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.02);
	--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
	--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
	--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
	--bs-focus-ring-width: 0.15rem;
	--bs-focus-ring-opacity: 0.25;
	--bs-focus-ring-color: rgba(122, 111, 190, 0.25);
	--bs-form-valid-color: #58db83;
	--bs-form-valid-border-color: #58db83;
	--bs-form-invalid-color: #ec536c;
	--bs-form-invalid-border-color: #ec536c
}

/* ------------------------------------------ Light Code End here ---------------------------------------------------------------- */

:root [data-topbar=dark],
[data-bs-theme=light] [data-topbar=dark] {
	--bs-header-bg: #2a3142;
	--bs-header-item-color: #f8f9fa;
	--bs-header-dark-item-color: #e9ecef
}

:root [data-sidebar=colored],
[data-bs-theme=light] [data-sidebar=colored] {
	--bs-topbar-search-bg: #f1f5f7
}



[data-bs-theme=dark] {
	--bs-light: #3a445b;
	--bs-light-rgb: 58, 68, 91;
	--bs-dark: #3a445b;
	--bs-dark-rgb: 58, 68, 91;
	--bs-header-bg: #7a6fbe;
	--bs-header-dark-bg: #2a3142;
	--bs-header-item-color: #ffffffb3;
	--bs-topbar-search-bg: #ffffff1a;
	--bs-navbar-header-bg: #2e3648;
	--bs-dropdown-topbar: #ffffff1a;
	--bs-topnav-bg: #323a4e;
	--bs-footer-bg: #323a4e;
	--bs-footer-color: #dee2e6;
	--bs-boxed-body-bg: #2d3447;
	--bs-sidebar-dark-bg: #2a3142;
	--bs-sidebar-dark-menu-item-color: #3f3c52;
	--bs-sidebar-dark-menu-sub-item-color: #5e5c6d;
	--bs-sidebar-dark-menu-item-icon-color: #8699ad;
	--bs-sidebar-dark-menu-item-hover-color: #ffffff;
	--bs-sidebar-dark-menu-item-active-color: #ffffff;
	--bs-sidebar-dark-menu-item-active-bg: #252b3a;
    --bs-sidebar-dark-menu-item-active-color-2:#00d4ff;
}

[data-bs-theme=dark] .table-light {
	--bs-table-color: white;
	--bs-table-bg: var(--bs-tertiary-bg);
	--bs-table-border-color: var(--bs-border-color);
	--bs-table-striped-bg: var(--bs-tertiary-bg);
	--bs-table-striped-color: white;
	--bs-table-active-bg: var(--bs-tertiary-bg);
	--bs-table-active-color: white;
	--bs-table-hover-bg: var(--bs-tertiary-bg);
	--bs-table-hover-color: white
}

[data-bs-theme=dark][data-topbar=light] {
	--bs-topbar-search-bg: #ffffff1a
}

[data-bs-theme=dark][data-sidebar=colored] {
	--bs-topbar-search-bg: #ffffff99
}

[data-bs-theme=dark][data-sidebar=dark] {
	--bs-sidebar-dark-bg: #2a3142;
	--bs-sidebar-dark-menu-item-color: #3f3c52;
	--bs-sidebar-dark-menu-sub-item-color: #5e5c6d;
	--bs-sidebar-dark-menu-item-icon-color: #8699ad;
	--bs-sidebar-dark-menu-item-hover-color: #ffffff;
	--bs-sidebar-dark-menu-item-active-color: #ffffff;
	--bs-sidebar-dark-menu-item-active-bg: #252b3a;
    --bs-sidebar-dark-menu-item-active-color-2:#00d4ff;
}




[data-bs-theme=dark] {
	color-scheme: dark;
	--bs-body-color: #adb5bd;
	--bs-body-color-rgb: 173, 181, 189;
	--bs-body-bg: #1f2431;
	--bs-body-bg-rgb: 31, 36, 49;
	--bs-emphasis-color: #fff;
	--bs-emphasis-color-rgb: 255, 255, 255;
	--bs-secondary-color: rgba(173, 181, 189, 0.75);
	--bs-secondary-color-rgb: 173, 181, 189;
	--bs-secondary-bg: #2a3142;
	--bs-secondary-bg-rgb: 42, 49, 66;
	--bs-tertiary-color: rgba(173, 181, 189, 0.5);
	--bs-tertiary-color-rgb: 173, 181, 189;
	--bs-tertiary-bg: #30384b;
	--bs-tertiary-bg-rgb: 48, 56, 75;
	--bs-primary-text-emphasis: #afa9d8;
	--bs-secondary-text-emphasis: #a7acb1;
	--bs-success-text-emphasis: #9be9b5;
	--bs-info-text-emphasis: #6edff6;
	--bs-warning-text-emphasis: #f9d17c;
	--bs-danger-text-emphasis: #f498a7;
	--bs-light-text-emphasis: #f8f9fa;
	--bs-dark-text-emphasis: #dee2e6;
	--bs-primary-bg-subtle: #312c4c;
	--bs-secondary-bg-subtle: #2b2f32;
	--bs-success-bg-subtle: #235834;
	--bs-info-bg-subtle: #055160;
	--bs-warning-bg-subtle: #62470f;
	--bs-danger-bg-subtle: #5e212b;
	--bs-light-bg-subtle: #2a3142;
	--bs-dark-bg-subtle: #151921;
	--bs-primary-border-subtle: #494372;
	--bs-secondary-border-subtle: #41464b;
	--bs-success-border-subtle: #35834f;
	--bs-info-border-subtle: #087990;
	--bs-warning-border-subtle: #936b16;
	--bs-danger-border-subtle: #8e3241;
	--bs-light-border-subtle: #3a445b;
	--bs-dark-border-subtle: #2a3142;
	--bs-heading-color: #fff;
	--bs-link-color: #afa9d8;
	--bs-link-hover-color: #bfbae0;
	--bs-link-color-rgb: 175, 169, 216;
	--bs-link-hover-color-rgb: 191, 186, 224;
	--bs-code-color: #f18bba;
	--bs-border-color: #3a445b;
	--bs-border-color-translucent: rgba(255, 255, 255, 0.15);
	--bs-form-valid-color: #9be9b5;
	--bs-form-valid-border-color: #9be9b5;
	--bs-form-invalid-color: #f498a7;
	--bs-form-invalid-border-color: #f498a7;
  
}



/* ------------------------------------------ Dark Code End here ----------------------------------------------------- */



[data-theme-mode=default] {
	--bs-danger: #ef6767 !important;
	--bs-danger-rgb: 239, 103, 103 !important;
    --login-term-condition:#b54acd!important;
    --regiter-bg-color:#dce345!important;
    --badge-soft-success-cust:#2e17c2!important;
}

[data-theme-mode=default] .anchor-tag {
    color: var(--login-term-condition);
}

[data-theme-mode=default] .loginparts {
    background-color: var(--regiter-bg-color);
}

[data-theme-mode=default] .badge-soft-success-cust {
    color: var(--badge-soft-success-cust)!important;
    background-color: rgb(88 219 131 / 0%)!important;

}





/* ----------------------------------------------------------------------------------------------------------------- */

[data-theme-mode=red] {
	--bs-primary: #d95a6f !important;
	--bs-primary-rgb: 217, 90, 111 !important;
	--bs-danger: #7a6fbe !important;
	--bs-danger-rgb: 122, 111, 190 !important;
	--bs-info: #f5b225 !important;
	--bs-info-rgb: 245, 178, 37 !important;
	--bs-warning: #0dcaf0 !important;
	--bs-warning-rgb: 13, 202, 240 !important;
    --login-term-condition:#a34b34!important;
    --regiter-bg-color:#fd4a5b!important;
    --badge-soft-success-cust:#ff5d48!important;
    
    
}
[data-theme-mode=red] .anchor-tag {

    color: var(--login-term-condition);
}

[data-theme-mode=red] .loginparts {
    background-color: var(--regiter-bg-color);

}

[data-theme-mode=red] .badge-soft-success-cust {
    color: var(--badge-soft-success-cust)!important;
    background-color: rgb(88 219 131 / 0%)!important;

}






[data-theme-mode=red] .btn-danger {
	background-color: var(--bs-danger);
	border-color: var(--bs-danger)
}

[data-theme-mode=red] .btn-danger.disabled,
[data-theme-mode=red] .btn-danger:active,
[data-theme-mode=red] .btn-danger:disabled,
[data-theme-mode=red] .btn-danger:focus,
[data-theme-mode=red] .btn-danger:hover {
	background-color: var(--bs-danger);
	border-color: var(--bs-danger)
}

[data-theme-mode=red] .btn-danger.disabled:focus,
[data-theme-mode=red] .btn-danger:active:focus,
[data-theme-mode=red] .btn-danger:disabled:focus,
[data-theme-mode=red] .btn-danger:focus:focus,
[data-theme-mode=red] .btn-danger:hover:focus {
	-webkit-box-shadow: 0 0 0 .15rem var(--bs-danger);
	box-shadow: 0 0 0 .15rem var(--bs-danger)
}

[data-theme-mode=red] .btn-outline-danger {
	color: var(--bs-danger);
	border-color: var(--bs-danger)
}

[data-theme-mode=red] .btn-outline-danger.disabled,
[data-theme-mode=red] .btn-outline-danger:active,
[data-theme-mode=red] .btn-outline-danger:disabled,
[data-theme-mode=red] .btn-outline-danger:focus,
[data-theme-mode=red] .btn-outline-danger:hover {
	background-color: var(--bs-danger);
	border-color: var(--bs-danger);
	color: #fff
}

[data-theme-mode=red] .btn-outline-danger.disabled:focus,
[data-theme-mode=red] .btn-outline-danger:active:focus,
[data-theme-mode=red] .btn-outline-danger:disabled:focus,
[data-theme-mode=red] .btn-outline-danger:focus:focus,
[data-theme-mode=red] .btn-outline-danger:hover:focus {
	-webkit-box-shadow: 0 0 0 .15rem var(--bs-danger);
	box-shadow: 0 0 0 .15rem var(--bs-danger)
}




/* ----------------------------------------------------------------------------------------------------------------- */


[data-theme-mode=teal] {
	--bs-primary: #3eb7ba !important;
	--bs-primary-rgb: 62, 183, 186 !important;
	--bs-info: #36508b !important;
	--bs-info-rgb: 54, 80, 139 !important;
    --login-term-condition:#f1be35!important;
    --regiter-bg-color: #45cd32!important;
    --badge-soft-success-cust:#000000!important;
}



[data-theme-mode=teal] .anchor-tag {
	
    color: var(--login-term-condition);
}

[data-theme-mode=teal] .loginparts {
    background-color: var(--regiter-bg-color);

}

[data-theme-mode=teal] .badge-soft-success-cust {
    color: var(--badge-soft-success-cust)!important;
    background-color: rgb(88 219 131 / 0%)!important;

}

:root [data-sidebar=dark],
[data-bs-theme=light] [data-sidebar=dark] {
	/* --bs-sidebar-dark-bg: #2b3a4a; */
    --bs-sidebar-dark-bg: #fff;
	--bs-sidebar-dark-menu-item-color: #3f3c52;
	--bs-sidebar-dark-menu-sub-item-color: #5e5c6d;
	--bs-sidebar-dark-menu-item-icon-color: #8699ad;
	/* --bs-sidebar-dark-menu-item-hover-color: #ffffff; */
    --bs-sidebar-dark-menu-item-hover-color: #1d2b38;
	--bs-sidebar-dark-menu-item-active-color: #ffffff;
	--bs-sidebar-dark-menu-item-active-bg: #263442;
    --bs-sidebar-dark-menu-item-active-color-2:#fff;
    /* --bs-sidebar-dark-menu-item-active-color-2:#263442!important; */
}


.waviy {
    position: relative;
    -webkit-box-reflect: below -1.25rem linear-gradient(transparent, rgba(0, 0, 0, 0.2)); }
  
  .waviy span {
    position: relative;
    display: inline-block;
    font-size: 2.5rem;
    color: #000;
    text-transform: uppercase;
    animation: waviy 1s infinite;
    animation-delay: calc(.1s * var(--i)); }
  
  @keyframes waviy {
    0%, 40%, 100% {
      transform: translateY(0); }
    20% {
      transform: translateY(-1.25rem); } }
  
  #preloader {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99999;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    background-color: #fff; }
  
  [data-theme-version="dark"] #preloader {
    background: #171622; }
  
  [data-theme-version="dark"] .waviy span {
    color: #fff; }

    .navbar-header{
        justify-content: unset!important;
    }

    .user-credencial{
        /*min-width: 155px;*/
    }

    .demos-show-btn {
        position: fixed;
        top: 50%;
        right: 0;
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        font-weight: 600;
        background-color: #ff5d48;
        color: #fff!important;
        line-height: 36px;
        padding: 15px 3px;
        border-radius: 6px 0 0 6px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        text-transform: uppercase;
        height: 155px;
    }


    .mdi-spin:before {
        -webkit-animation: mdi-spin 2s infinite linear;
        animation: mdi-spin 2s infinite linear
    }
    
    .color-setting .right-bar .right-bar-toggle {
        background-color: #444c54;
        height: 24px;
        width: 24px;
        line-height: 24px;
        color: #e9ecef;
        text-align: center;
        border-radius: 50%;
        
    }

    .color-setting .right-bar .rightbar-title {
        background-color: #64b0f2;
        padding: 24.5px;
        color: #fff;
        display: flex;
        justify-content: space-between;
    }

    .min-width-search{
        min-width: 130px;
    }

    .login-tc{
        font-weight: 100;
    }


    .exp_perform {
        padding: 20px 20px;
    }

    .exp_perform_title p {
        width: 100%;
        float: left;
        text-transform: uppercase;
        color: #fff;
        font-size: 10px;
        padding-bottom: 4px;
    }

    .exp_perform_title h4 {
        width: 100%;
        float: left;
        font-size: 16px;
        color: #fff;
        font-family: 'Rubik-Med',sans-serif;
    }

    .exp_perform_list {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-column-gap: 29px;
        grid-row-gap: 16px;
    }

    .fast_perform_point {
        display: flex;
    }
    .fast_perform_point img {
        width: 24px;
        height: 24px;
    }
    .fast_text {
        display: flex;
        flex-direction: column;
        padding-left: 12px;
    }

    .fast_text h5 {
        font-size: 12px;
        color: #fff;
        padding-bottom: 2px;
        text-transform: uppercase;
    }

    .fast_text p {
        font-size: 12px;
        color: #fff;
        width: 99%;
    }


    .loginparts {
        display: flex;
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 0;
        /* background-color: var(--regiter-bg-color); */
        background-color: #7a6fbe;
        /* border-radius: 8px; */
        position: relative;
    }


    @-webkit-keyframes mdi-spin {
        0% {
            -webkit-transform: rotate(0);
            transform: rotate(0)
        }
    
        100% {
            -webkit-transform: rotate(359deg);
            transform: rotate(359deg)
        }
    }
    
    @keyframes mdi-spin {
        0% {
            -webkit-transform: rotate(0);
            transform: rotate(0)
        }
    
        100% {
            -webkit-transform: rotate(359deg);
            transform: rotate(359deg)
        }
    }




    .chart-container {
        max-width: 400px;
        margin: 20px auto;
    }

    /* Style for the loan table */
    .loan-table {
        width: 80%;
        margin: 20px auto;
        border-collapse: collapse;
    }

    .loan-table th,
    .loan-table td {
        border: 1px solid #ddd;
        padding: 8px;
        text-align: left;
    }

    .loan-table th {
        background-color: #f2f2f2;
    }


.badge-soft-success-cust{
    color:var(--badge-soft-success-cust)
}

    .profile-user-dt{
        font-weight: 600;
        color:#fca742;
        padding: 8px;
    }

    .profile-user-value{
        padding: 8px;
    }

.bg-blue-img-1{
    --bs-bg-opacity: 1;
    /*background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;*/
}
.profile-img-bg{
    
    padding: 12px 0px;
    /*background: url(../images/bg-1.png);*/
    background-size: cover;
}


.profile-btn-ui{
    background-color: #7a6fbe;
    padding: 10px 0px;
    width: 100%;
    font-size: 14px;
    border-radius: 200px;
    color: #fff;
    font-weight: 500;

}
.profile-btn-ui:hover{
    border:1px solid #000!important;
    border-radius: 200px;
}






















    /* Style the OTP container */
        .otp-container {
            display: flex;
            justify-content: center;
            margin-top: 50px;
        }

        /* Style each OTP input */
        .otp-input {
            width: 40px;
            height: 40px;
            text-align: center;
            font-size: 24px;
            border: 2px solid #ccc;
            border-radius: 4px;
            margin: 0 5px;
        }

        /* Style when the input is focused */
        .otp-input:focus {
            outline: none;
            border-color: #007bff;
            box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
        }

		.c_name_id{
			font-size: 12px;
		}

		.bg-gray-color{
			background-color: #807c77;
    		text-align: center;
		}

		.loan-dt-titie{
			font-size: 16px;
			Color: #7a6ebe;
			font-weight: 400;
			margin-bottom: 0px;
		}

		.loan-dt-amt{
			font-size: 18px;
			Color:#000;
			font-weight: 600;
		}
		.loan-view-details{
			border: 1px dashed #0dcaf0;
    		padding: 10px 10px;
		}

		.view-dt-pg-linked-btn{
			display: block;
    		text-align: center;
		}

		.separate-border{
			border:1px dashed #0dcaf0;
			padding: 10px;
			align-items: center;
		}
		
		.model-header-bg-color{
			background-color: #27dbff;
		}

		.proceed-btn{
			padding: 0px!important;
		}

		.online-proceed-payment-gateway{
			border:3px solid #6c757d;
		
		}

		.trans-date-from{
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.cus-width-input{
			width: 180px;
		}

		.view-download-reset{
			padding: 7px 15px;
			/* border: 1px solid #000; */
			border-radius: 50px;
			border: 1px solid #0db0d0!important;
			color: #0db0d0;
			font-size: 12px;
			font-weight: 400;
		}
		.view-download-reset:hover{
			background-color: #0db0d0;
			color:#fff!important;
			
		}

		.loan-statment-download-icon{
			font-size: 30px;
			margin-left: 3px;
			margin-right: 3px;
			color: #939393;
		}

		.information-para-color{
			color:#4858ff;
		}

		.ok-sign-ico{
			color: #0caa0c;
    		font-size: 35px;
		}

		.flexi-left-cont{
			background-color: #e9e9e9;
    		padding: 20px;
		}
		.un-utilized-para-4{
			font-size: 15px;
			font-weight: 400;
			color: black;

		}

		.un-value-1{
			font-size: 15px;
			font-weight: 600;
			color: #cb5445;
		}

		.select-loan-account{
			display: flex;
			justify-content: end;
			width: 100%;
			margin-bottom: 20px;
		
		}

		.dotted-minage{
			display:flex;
			justify-content: space-between;
		}

		.checkboxui{
			width: 25px;
			height: 25px;
			border: 1px solid #700;
		}


		.flext-submit-btn{
			border: 1px solid #700;
			padding: 6px 30px;
			border-radius: 100px;
			font-size: 14px;
			font-weight: 500;
		}

		.flext-back-btn{
			border: 1px solid #700;
			padding: 6px 30px;
			border-radius: 100px;
			font-size: 14px;
			font-weight: 500;
		}

		.flext-back-btn:hover,.flext-submit-btn:hover {
			border: 1px solid #000!important;
			color: #700;
		}


		
		.know-more-btn{
			border: 1px solid #700;
			padding: 6px 30px;
			border-radius: 100px;
			font-size: 14px;
			font-weight: 500;
		}

		.apply-now-btn{
			border: 1px solid #700;
			padding: 6px 30px;
			border-radius: 100px;
			font-size: 14px;
			font-weight: 500;
		}

		.know-more-btn:hover, .apply-now-btn:hover {
			border: 1px solid #000!important;
			color: #700;
		}

		.loan-title{
			color: #0f2fb4;
			padding-bottom: 10px;
		}


		.otp-field {
			flex-direction: row;
			column-gap: 10px;
			display: flex;
			align-items: center;
			justify-content: center;
		  }
		  
		  .otp-field input {
			height: 45px;
			width: 42px;
			border-radius: 6px;
			outline: none;
			font-size: 1.125rem;
			text-align: center;
			border: 1px solid #ddd;
		  }
		  .otp-field input:focus {
			box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
		  }
		  .otp-field input::-webkit-inner-spin-button,
		  .otp-field input::-webkit-outer-spin-button {
			display: none;
		  }
		  
		  .resend {
			font-size: 12px;
		  }

		  .confirmed-5-box{
			display: flex;
			justify-content: center;
		  }
		  
		  .popup-header-bg-color{
			background-color:#00697e;
			color: #fff;
		  }

		  .btn-close-img{
			
			background-image: url("../images/nextbigbox/close-img-icon.svg")!important;
			opacity: 1;
		
		}
		 
		.hr-margin-0{
			margin-top:0px;
			margin-bottom: 0px;
		}


		.profile-user-point-dt{
			font-weight: 600;
			color: #0d0d0e;
		}
		

		.j_cards_content {
			float: left;
			width: 100%;
			height: 100%;
		}

		.j_tabination.active {
			display: block;
		}

		.j_tabination {
			float: left;
			width: 100%;
			display: none;
			height: 100%;
		}

		.j_card_selection {
			float: left;
			width: 100%;
			height: 275px;
			overflow-y: scroll;
			overflow-x: hidden;
			padding: 16px 20px 0 0;
		}

	

		.j_lf_main {
			padding-left: 30px;
			float: left;
			width: 100%;
			position: relative;
			margin-bottom: 12px;
		}

		.j_cus_checkbox {
			position: absolute;
			left: 0;
			top: 22px;
		}
		.checkupgrade {
			position: relative;
			float: left;
			cursor: pointer;
		}

		.checkupgrade input {
			transition: 0.3s;
			position: absolute;
			opacity: 0;
			cursor: pointer;
			height: 0;
			width: 0;
		}

		.j_loan_details {
			padding: 15px 15px 15px;
			border-radius: 8px;
			box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
			background-color: #fff;
			float: left;
			width: 100%;
		}

		.j_top_data {
			border-bottom: 1px solid #e5eaf7;
			padding-bottom: 5px;
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.j_loan_num {
			float: left;
		}

		.j_loan_num h3 {
			color: #172b4d;
			font-size: 16px;
			font-family: 'Rubik-Med', sans-serif;
			display: block;
			margin-bottom: 5px;
		}

		.j_btm_bank_details {
			display: flex;
			justify-content: space-between;
			align-items: flex-end;
			margin-top: 14px;
		}

		.j_bank_ac_details {
			display: grid;
			grid-template-columns: auto auto auto auto;
			grid-column-gap: 80px;
			float: left;
		}
		.j_bank_sep {
			display: flex;
			flex-direction: column;
		}
		.j_bank_sep div {
			color: #666666;
			font-size: 12px;
			margin-bottom: 8px;
		}
		.j_bank_sep p {
			color: #1a1a1a;
			font-size: 14px;
		}

		.j_loan_num p {
			font-size: 14px;
			color: #666666;
			display: block;
		}

		.j_tabination {
			float: left;
			width: 100%;
			display: none;
			height: 100%;
		}

		.j_no_data_div {
			text-align: center;
			float: left;
			width: 100%;
			padding: 45px 0 60px 0;
		}

		.j_no_data_div p {
			color: #666;
			font-size: 14px;
			margin-top: 20px;
		}
		.j_cus_checkbox .checkupgrade input ~ i::after {
			border-color: #fff;
			width: 6px;
			height: 10px;
			top: 3px;
		}

		.checkupgrade input:checked ~ i::after {
			opacity: 1;
			transform: scale(1) rotate(45deg);
		}
		.checkupgrade input ~ i::after {
			content: "";
			width: 7px;
			height: 11px;
			position: absolute;
			top: 2px;
			left: 7px;
			border-bottom: 2px solid #ff6700;
			border-right: 2px solid #ff6700;
			box-sizing: border-box;
			transform: scale(1) rotate(65deg);
			opacity: 0;
			transition: all 150ms ease;
		}
		.j_cus_checkbox .checkupgrade input ~ i::before {
			border-radius: 50%;
			border: 1px solid #ff6700;
		}

		.j_cus_checkbox .checkupgrade input:checked ~ i::before {
			background: #ff6700;
		}

		.checkupgrade input:checked ~ i::before {
			border: 2px solid #ff6700;
			box-sizing: border-box;
		}
		.checkupgrade input ~ i::before {
			content: "";
			width: 20px;
			height: 20px;
			border: 2px solid #999;
			border-radius: 4px;
			position: absolute;
			top: 0;
			left: 0;
			box-sizing: border-box;
			transition: all 150ms ease;
		}

		.checkupgrade input ~ i {
			font-size: 12px;
			color: #1a1a1a;
			border-radius: 12px;
			min-width: 70px;
			padding: 0px 22px;
			position: relative;
			line-height: 20px;
		}

		.checkupgrade i {
			float: left;
			font-style: normal;
		}


        .ds_board_card_bg_color{
            background-color:#737373;
            height: 100%;
        }


        .profile-img-bg .img-thumbnail{
            background-color: #fca742;
        }

       



		@media screen and (min-width: 1200px) and (max-width: 1450px){
			/*.mini-stat .mini-stat-img {*/
			/*	flex-direction: column;*/
			/*	justify-content: center;*/
			/*}*/
		}






		@media screen and (min-width: 320px) and (max-width: 767px){
			.j_btm_bank_details {
				margin-top: 8px;
				flex-direction: column;
			}
		}

		@media screen and (min-width: 320px) and (max-width: 767px){
			.j_top_data {
				padding-bottom: 8px;
			}
		}

		@media screen and (min-width: 320px) and (max-width: 767px){
			.j_bank_sep div {
				font-size: 10px;
				margin-bottom: 4px;
			}
		}

		@media screen and (min-width: 320px) and (max-width: 767px){
			.j_bank_ac_details {
				grid-column-gap: 20px;
				float: left;
				width: 100%;
				border-radius: 4px;
				background-color: #f2f4fb;
				padding: 8px 6px;
			}
		}

		@media screen and (min-width: 320px) and (max-width: 767px){
			.j_bank_sep p {
				width: 60px;
				word-wrap: break-word;
			}
		}

		@media screen and (min-width: 320px) and (max-width: 767px){
			.j_bank_sep p {
				font-size: 12px;
				color: #000;
			}
		}


		.login-t-c{
			color:blue;
		}


		.loan-account-no1{
			color: #fff;
			font-size: 17px;
			margin-bottom: 0px;
			font-weight: 100;
		}


		.third_card {
			/* border: 1px solid #c43d3d; */
			padding: 10px;
			border-radius: 5px;
			box-shadow: rgb(0 0 0 / 28%) 0px 1px 4px 0px;
		}
		.v_table_font_size {
			font-size: 14px;
			line-height: 20px;
		}
		
		.pay_btn {
			border: 1px solid #2f2d2d;
			background-color: #2f2d2d;
			color: #fff;
			padding: 3px 20px;
			display: inline-block;
			padding-top: 5px;
			border-radius: 4px;
		}

		.green_dott {
			content: "";
			width: 12px;
			height: 12px;
			background-color: #0dc40d;
			display: inline-block;
			border-radius: 50px;
			padding-top: 5px;
			position: relative;
			top: 1px;
		}

		.red_dott {
			content: "";
			width: 12px;
			height: 12px;
			background-color: #c43d3d;
			display: inline-block;
			border-radius: 50px;
			position: relative;
			top: 1px;
		}