@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
*{
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
}


body {
    background: #212125;
    font-size: 14px ;
}

form.auth input, form.auth input:focus, form.auth input:active{
    background: #d5d5d5;
    border: none;
    color: #000;
    padding: 10px;
}

label{
    color: #ffffff;
}

.modal input.form-control, .modal textarea.form-control, .modal input.form-control:focus, .modal textarea.form-control:focus, .modal select.form-control, .modal select.form-control:focus{
    border: none !important;
    background: #212125 !important;
    outline: none !important;
    box-shadow: none !important;
    margin-top: 5px;
}





.btn.btn-primary{
    background: #0ccd7c!important;
    border: none;
    color: #ffffff;
    font-weight: 400;
    font-size: 14px;
    padding-block: 10px;

}

.btn.btn-primary:hover{
    background: #10a769!important;
}

.btn.btn-primary:focus{
    background: #10a769!important;
}

.btn.btn-primary:active{
    background: #10a769!important;
    color: #181824 !important;
}



a{
    text-decoration: none;
    color: #0ccd7c ;
}

a:hover{
    text-decoration: none;
    color: #09814f ;
}


    
main{
    display: flex;
    height: 100vh;
    margin-left: 220px;
    transition: margin-left 0.3s ease-in-out;
}

.sidebar{
    width: 220px;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    transition: margin-left 0.3s ease-in-out;
    background: #18181d;
}

main.collapsed .sidebar{
    margin-left: -220px;
}

main.collapsed{
    margin-left: 0;
    overflow: auto !important;
}

.page-header-nav{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

main{
    overflow: hidden;
}

@media (max-width: 575px) {
    .page-header-nav{
        flex-direction: column;
        align-items: flex-start;
    }
    
    main.collapsed .sidebar{
        width: 0 !important;
    }

    main .sidebar{
        width: 100% !important;
    }

    main .sidebar .burger-wrapper{
        display: block !important;
    }

    .sidebar-heading{
        justify-content: space-between !important;
    }

    .sidebar .list-group{
        overflow: scroll !important;
    }
}


main .sidebar .burger-wrapper{
    display: none;
    transform: scaleX(-1);
}

.sidebar .list-group{
    overflow-y: auto;
    height: 100vh;
    padding-bottom: 200px;
}

.screen-filters {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 55px;
}

.screen-filters .dropdown-user {
    background: #18181d;
    color: white;
    padding: 10px;
    border-radius: 10px;
    padding-right: 80px;
    margin-right: 20px;
}


.user-img i{
    background-color: #01c569;
    background-image: linear-gradient(to right, #01c569, #03cb83 50%, #53d90e 100%);
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 14px;
    margin-right: 10px;
}

.dropdown a.btn {
    padding: 6px 15px;
    font-size: 14px;
    background: #1c1c2100 !important;
    color: white;
    text-align: left;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.dropdown a.btn:hover{
    background: #18181d !important;
}

.dropdown a.btn:focus{
    background: #1c1c21 !important;
}

.dropdown a.btn:active{
    background: #1c1c21 !important;
}

.dropdown a.btn::after{
    margin-left: 10px;
}

.userdrop-text{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}


.userdrop-text .balance{
    color: #0ea667;
    font-size: 12px;
    font-weight: 700;
    margin-top: 3px;
}


.sidenav-link{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    color: #676767;
    transition: all 0.3s ease-in-out;
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
    margin-left: 10px;
    margin-bottom: 3px;
    border-right: 0px solid #0ccd7c;
}

.sidenav-link .sidenav-icon{
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    padding-right: 0px;
}

.sidenav-link .sidenav-icon .sidenav-wrap{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    color: #676767;
    padding: 14px 10px;
    border-radius: 0px;
    transition: all 0.3s ease-in-out;
    font-weight: 600;
}

.sidenav-link.active .sidenav-icon .sidenav-wrap, .sidenav-link:hover .sidenav-icon .sidenav-wrap{
    color: #0ccd7c;
}

.sidenav-link .sidenav-icon i{
    color: #676767;
    width: 20px;
    height: 20px;
    border-radius: 8px;
    transition: all 0.3s ease-in-out;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-inline: 10px;
}


.sidenav-link:hover .sidenav-icon i, .sidenav-link.active .sidenav-icon i{
    color: #0ccd7c;
}

.sidenav-link:hover, .sidenav-link.active {
    color: #0ccd7c;
    background: #212125;
    border-right: 5px solid #0ccd7c;
}


.sidenav-divider-heading {
    padding-inline: 15px;
    color: #0ea667;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    margin-top: 20px;
    margin-bottom: 10px;
    text-align: center;
}

.main-content{
    width: 100%;
    height: 100%;
    overflow: auto;
}
.sidebar-heading{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.5rem;
    margin-top: 20px;
    margin-bottom: 20px;
}

.sidebar-heading img{
    width: 110px;
    object-fit: cover;
}

.menu-title{
    color: #878a99;
    font-size: 0.75rem;
    font-weight: 500;
    padding: 0.5rem 1.5rem;
    text-transform: uppercase;
}

nav{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    padding: 0px;
    position: relative;
}

nav .sidebar-heading, nav .topnav-toggle{
    position: absolute;
    left: 15px;
}

nav .buttons, nav .user-toggle{
    position: absolute;
    right: 15px;
}



.topnav-toggle{
    color: #ffffff;
    font-size: 1.25rem;
    cursor: pointer;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

main.collapsed .topnav-toggle i.collapsed{
    display: inline-block;
}

main.collapsed .topnav-toggle i.expanded{
    display: none;
}

.topnav-toggle i.expanded{
    display: inline-block;
}

.topnav-toggle i.collapsed{
    display: none;
}

.dropdown-menu {
    background: #1c1c21;
    color: #878a99;
    min-width: 200px;
    border: none;
    padding: 0;
    overflow: hidden;
}

.dropdown-item {
    font-size: 14px;
    padding-block: 8px;
    color: #a1a1a1;

}

.dropdown-item:hover {
    background: #18181d;
    color: #ffffff;
}

.dropdown-header{
    color: #878a99;
    font-size: 12px;
}

.sidebar li .sidenav-item {
    padding-left: 56px;
    width: 100%;
    margin: 2px 12px;
}

.sidebar li {
    margin-block: 10px;
}

.sidenav-item.collapsed .sidenav-arrow {
    transform: rotate(-90deg);
}



.sidenav-arrow {
    transition: all 0.3s ease;
}

.card {
    background: #18181d !important;
    color: white;
    border: none;
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border: none;
    background: #18181d;
}

.form-control, select, input[type="number"], input[type="number"]:focus, input[type="number"]:active, input[type="email"], input[type="email"]:focus, input[type="email"]:active, input[type="text"], input[type="text"]:focus, input[type="text"]:active
{
    background: #18181d !important;
    border: 2px solid #2a2d31;
    color: rgb(255, 255, 255) !important;
    padding: 10px !important;
    font-size: 14px !important;
}


.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover, .nav-tabs .nav-link.active {
background: #0ccd7c !important;
color: white !important;
border-color: rgba(255, 0, 0, 0) !important;

}

.nav-tabs .nav-link {
color: #878a99;
border-radius: 0;
}

#navbarSettings{
border-radius: 5px;
overflow: hidden;
border: 1px solid #2e2e3f;
}

.menu-title{
    margin: 0 12px;
    color: #0ccd7c;
    padding: 10px 16px;
    font-size: 12px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.menu-title span{
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 1.2px;
}

.menu-title p{
    margin: 0px;
    font-weight: 600;
    color: #878a99;
    font-size: 12px;
    text-transform: none;
}

.sidenav-subbox > .sidenav-item{
    padding-left: 50px;
}

.page-title {
    margin-top: 20px;
}

.page-link {
    margin-top: 20px;
}

.page-link a {
    color: #6c757d;
}

.page-link a:hover {
    color: #212529;
}

.page-link a:active {
    color: #212529;
}

.page-link a:focus {
    color: #212529;
}

.user-text h6{
    
    color: white;
    font-size: 14px;
    margin-bottom: 0;

}

.user-text p{
    margin: 0px;
    font-size: 12px;
    color: #9fa2aa;
    margin-top: 3px;
}

.breadcrumb-item+.breadcrumb-item::before {
    content: ">";
    color: #9fa2aa;
    font-size: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 24px;
}

.settings-nav .sidenav-item {
    margin: 0 0 0 0 !important;
    transition: all 0.3s ease-in-out;
}

.settings-nav .sidenav-item:hover, .settings-nav .sidenav-item.active {
    color: white;
    background: #2a2a38;
}

.card-header {
    border-color: #2a3243;
}

.card-header h5 {
    color: white;
    font-size: 1.2rem;

}

.card-header p {
    color: #a0a0a0;
    font-size: 0.9rem;
}

.alert-warning {
    border-color: #ffc700;
    color: #ffc700;
    background: #392f28;
}

.alert-success {
    color: #1ca162;
    border-color: #1ca162;
    background: #1a2c2f;
}

.alert-danger {
    color: #ff5b5b;
    border-color: #ff5b5b;
    background: #472935;
}

.alert-primary {
    color: #009ef7;
    border-color: #009ef7;
    background: #212e48;
}

.alert-info {
    color: #00cfe8;
    border-color: #00cfe8;
    background: #2a3b4a;
}

.page-header {
    padding-bottom: 1.5rem;
    align-items: flex-start;
    justify-content: space-between;
    display: flex;
    position: relative;
}

.burger-btn{
    background: none;
    border: none;
    padding: 0px;
}

.burger-btn svg{
    width: 25px;
}

.page-header-container {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.page-header-container .breadcrumbs {
    margin: 0;
    white-space: nowrap;
}

.page-header-container .page-title-n {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.page-header-container .breadcrumbs .breadcrumb-page {
    font-size: 13px;
    font-weight: 500;
    color: #777f89;
}

.page-header-container .page-title-n h1 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #ffffff;
}


.page-header-container .breadcrumbs i {
    margin: 0 0.5rem;
    color: #777f89;
    font-size: 10px;
}

i.txt{
    
    font-size: 14px;
    margin-right: 5px;

}

@media (max-width: 991px) {
    .mobile-hide {
        display: none;
    }
}

.table {
    background: #1c1c21;
    color: white;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    

}

.table thead tr th {
    background: #18181d !important;
    color: #0ea667;
    padding: 0.75rem 0.875rem !important;
    font-size: 14px;
    border-color: #18181d;
}


.table thead tr th:first-child {
    border-top-left-radius: 12px;
}

.table tbody tr td:first-child {
    text-align: left !important;
}


.table thead tr th:last-child {
    border-top-right-radius: 12px;
    text-align: right !important;
}

.table tbody tr td {
    padding: 0.75rem 0.875rem !important;
    font-size: 14px;
    font-weight: 500;
    border-color: #2a3243;
    vertical-align:middle;
    border: none;
}


.table tbody tr td:last-child{
    text-align: right !important;
}

/* even tr */
.table tbody tr:nth-child(even) {
    background: #18181d;
}

.image-cell img{
    width: 30px;
    height: 30px;
    border-radius: 10px;
    margin-right: 15px;
}
.image-cell{
    display: flex;
    align-items: center;
}


.product-actions > *:not(:last-child) {
    margin-right: 10px;
}

@media (max-width: 768px) {
    .table{
        width: 100%;
        overflow-y: scroll;
        display: block;
    }

    .steps {
        flex-direction: column;
        justify-content: center !important;
        align-items: flex-start !important;
        width: 100%;
        gap: 20px;
    }
    
}

.icon-btn {
    color: #6b6d78;
    background: none;
    border: none;
    padding: 0px;
    display: inline;
}

.icon-btn:hover {
    color: #fff;
}


.btn-group {
    background: #181824;
    border-radius: 0.375rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
}

.btn-group .btn {
    background: #181824;
    color: #9fa2aa;
    border: none;
}


.btn-check:checked+.btn,
.btn.active,
.btn.show,
.btn:first-child:active,
:not(.btn-check)+.btn:active,
.btn-check+.btn:hover {
    background-color: #2a2a38;
    color: #fff;
}

.modal-content{
    background: #18181d !important;
    color: white;
    border: none;
    padding: 20px;
}

.modal-icon{
    padding: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal-icon i{
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 25px;
    color: #ff5b5b;
    border-color: #ff5b5b;
    background: #472935;
}

.modal-header{
    border: none;
    padding-block: 0;
}

.btn-close {
    background: none;
    color: #c1c1c1;
    font-size: 12px;
    width: auto;
    height: auto;
}

.btn-close:hover {
    color: #fff;
}

.modal-header h6{
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 5px;
}

.form-control-static{
    color: #8b8b8b;
}
    
.modal-body .image-cell{
    width: 100%;
    background: #232334;
    padding: 20px;
    border-radius: 12px;
    justify-content: center;
}

.modal-footer{
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    flex-wrap: nowrap;
}

.modal-btn {
    width: 100%;
}

.btn-dark{
    background: #232334;
}

.btn-dark:hover{
    background: #1f1f30;
    border-color: #1f1f30;
}







.copy_input .success_btn{
    display: none;
}

.border-bottom, .border-top{
    border-color: #2a3243 !important;
}

.toggle {
    cursor: pointer;
    display: inline-block;
}

.toggle-switch {
    display: inline-block;
    background: #151521;
    border-radius: 16px;
    width: 58px;
    height: 32px;
    position: relative;
    vertical-align: middle;
    transition: background 0.25s;
}
.toggle-switch:before, .toggle-switch:after {
    content: "";
}
.toggle-switch:before {
    display: block;
    background: #2a3243;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 4px;
    left: 4px;
    transition: all 0.25s ease;

}

.toggle-checkbox:checked + .toggle-switch:before {
    left: 30px;
    background: #198754;
}

.toggle-checkbox {
    position: absolute;
    visibility: hidden;
}

.media {
    background: #1e1e2d;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
}
.box-icon {
    background: rgb(81 45 157);
    background: linear-gradient(45deg, rgb(81 45 157) 0%, rgb(175 47 82) 100%);
    height: 40px;
    width: 40px;
    min-height: 40px;
    min-width: 40px;
    margin-right: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    border-radius: 8px;
}

@media (max-width: 767px) {
    .main-content{
        padding: 0;
    }

    .page-header-container .page-title-n{
        justify-content: center;
    }
}


.stat-card {
display: flex;
    justify-content: space-between;
    align-items: center;
    color: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    padding: 20px;
    position: relative;
    background-size: 97.8px !important;
    background-position: right !important;
    transition: all 0.3s ease-in-out;
}

.stat-card::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #18181d;
    z-index: -1;
    left: 0;
    top: 0;
}

.stat-card .stat-card-icon i{
    width: 50px;
    height: 50px;
    background: #164032;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    color: #0ccd7c;
}

.stat-card .stat-card-text h1{
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 0;
}

.stat-card .stat-card-text p {
    font-size: 14px;
    font-weight: 200;
    margin-bottom: 8px;
}

.stat-card .stat-card-text p i{
    font-size: 12px;
    margin-right: 5px;
}



body:not(.landing) button.accordion-button.collapsed {
    outline: none;
    box-shadow: none !important;
    background: #18181d;
    color: white;
}

body:not(.landing) .accordion-item {
    border: none;
    background: #18181d;
}

body:not(.landing) .accordion-body {
    background: #18181d;
    color: #838383;
}

body:not(.landing) .accordion-button:not(.collapsed) {
    background: #12724d;
    color: white;
    border: none;
    box-shadow: none;
}

body:not(.landing) .accordion-button:not(.collapsed)::after{
    background-image: var(--bs-accordion-btn-icon) !important;
}

body:not(.landing) .accordion-button::after {
    filter: invert(100%);
}


.card-from{
    border-radius: 20px;
    height: 100%;
}

.from-side-img {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(../../assets/images/bg.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 20px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    box-shadow: 0px 0px 20px 0px #18181d9c;
}

.form-side-text{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-inline: 20px;
    text-align: center;
    padding-bottom: 100px;
}
.form-side-text .form-side-icon{
    width: 100px;
    margin-bottom: 40px;
}

.form-side-text .form-side-title{
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
    color: #fff;
    margin-block: 20px;
}

.form-side-text .form-side-desc{
    font-size: 14px;
    color: #bbb8d7;
}


.file-input-wrapper {
    background-color: #18181d!important;
    border: 1px dashed #2a2d31!important;
    padding: .75rem;
    border-radius: .5rem;
    text-align: center;
    transition: background-color .2s ease;
    width: 100%;
    min-height: 150px;
    position: relative;
}

.file-input-wrapper>input[type="file"] {
    font-size: 40px;
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.file-input-wrapper>.btn-file-input {
    background: #2a2d31a1;
    border-radius: 6px;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
    border: none;
    font-size: 14px;
    color: #b4aebc;
    margin: 0;
    font-weight: 400;
    padding: 40px;
}

.file-input-wrapper>.btn-file-input p{
    font-size: 14px;
    color: #b4aebc;
    margin-bottom: 5px;
    font-weight: 400;
}

.form-control:disabled {
    background-color: #e9ecef;
    opacity: 1;
    background: #212125 !important;
    border-color: #212125 !important;
    color: #7b7b7b !important;
}

@media (max-width: 767px) {
    .from-side-img{
        display: none;
    }

    .card-from{
        border-radius: 20px;
    }
}

.steps {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.steps-item {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding-inline: 20px;
}

.steps-item i {
    color: white;
}

.steps-item .steps-text {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}

.steps-item .steps-text .steps-title {
    color: #6f6f74;
}

.steps-item .steps-text .steps-desc {
    margin: 0px;
    color: #6f6f74;
}

.steps-number{
    width: 36px;
    height: 36px;
    color: #a3a3a3;
    background: #212125;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.steps-check{
    width: 36px;
    height: 36px;
    color: white;
    background: #0ccd7c;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: none;
}

.steps-item.done{
    color: #0ccd7c;
}

.steps-item.done .steps-number{
    display: none;
}

.steps-item.done .steps-check{
    display: flex;
}

.steps-item.done .steps-text .steps-title, .steps-item.active .steps-text .steps-title{
    color: #fff;
}

.steps-item.done .steps-text .steps-desc, .steps-item.active .steps-text .steps-desc{
    color: #0ea667;
}

.steps-item.active .steps-number{
    background: #0ccd7c;
    color: white;
}

.custom_radio_box {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    flex-direction: column;
    width: 100%;
    border-radius: 10px;
    padding: 20px;
    background: #212125;
    transition: all 0.3s ease;
    height: 100%;
    border: 2px solid #875cea00;
}
.custom_radio_box .text-line{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}


.custom_radio_box p{
    margin: 0px;
    color: #ffffff;
    font-size: 14px;
}

.custom_radio_box p.text-mute {
    color: #ababab;
}

.custom_radio:checked + .custom_radio_box {
    border: 2px solid #0ccd7c;
    background: #154334;
}

.custom_radio{
    display: none;
}

.custom_radio_box_logo {
    width: 60px;
    height: 60px;
    min-width: 60px;
    min-height: 60px;
    margin-left: 20px;
}

.custom_radio_box_logo img {
    width: 100%;
    height: auto;
}

.custom_radio_box .pricing {
    font-size: 14px;
    font-weight: 700;
    margin-block: 10px;
    padding: 6px 10px;
    background: #0ccd7c;
    border-radius: 9px;
    width: fit-content;
    color: white;
}

.options-title{
    color: #0ccd7c;
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 600;
    border-top: 1px solid #212125;
    padding-top: 20px;
    margin-top: 30px;
}

.options-title.first-item{
    border-top: none;
    padding-top: 0px;
    margin-top: 0px;
}


.sidebar .list-group::-webkit-scrollbar {
  display: none;
}

::-webkit-scrollbar {
    width: 5px;
}
::-webkit-scrollbar-thumb {
    background: #0ccd7c;
    border-radius: 10px;
}
::-webkit-scrollbar-track {
    background: #18181d;
}

::-webkit-scrollbar-thumb:hover {
    background: #128f5b;
} 


.stat-card.stat-1{
    background: url(../images/wave_blue.png) no-repeat;
}

.stat-card.stat-2{
    background: url(../images/wave_green.png) no-repeat;
}

.stat-card.stat-3{
    background: url(../images/wave_purple.png) no-repeat;
}


.items-list {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.item-element {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #18181d;
    border-radius: 7px;
    padding: 15px;
    margin-bottom: 10px;
}

.item-element .left {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 15px;
}

.item-element .left p {
    margin: 0px;
    color: #c3c3c3;
    font-size: 14px;
}

.item-element .left i {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 18px;
}

.item-element .left i.danger{
    background: #5b272f;
    color: #dc3545;
}

.item-element .left i.success{
    background: #1c4939;
    color: #0ccd7c;
}

.item-element .left i.warning{
    background: #4a3c1b;
    color: #ffc107;
}

.cardy-header , .cardy-body{
    color: #fff;
}

.form-check-input:checked {
    background-color: #0ccd7c;
    border-color: #0ccd7c;
}

.text-primary {
    color: #0ccd7c !important;
}

.stat-card:hover {
    background-size: 650px !important;
}