/* =============================
Name : style.css
Version 1.0
================================
01.Theme default css
02.header
03.index
04.footer

=============================*/

/* ==== Theme default css ====*/
:root {
    --dark-mode: #1C1C1C;
    --light-mode: #ffffff;
    --light-gray:#E6E6E6;
    --dark-gray:#333333;
    --light-blue: #ADD8E6;
    --blue: #274C77;
    --purple:#6A0DAD;
    --yellow:#FFD700;

}
a{
    text-decoration: none;
}
body.dark{
    background: var(--dark-mode);
}
body.light{
    background: var(--light-mode);
}
/*overflow*/
.overflow-nowrap-1 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    -moz-line-clamp: 1;
    -moz-box-orient: vertical;
}
input:focus-visible {
    outline: unset!important;
}
.btn-close:focus{
    box-shadow: none;
}

::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-track {
    background: rgba(59, 59, 69, 0.5);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb {
    background: #85858e;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #747479;
}
/* ==== Theme default css ====*/
/* ==== header css ====*/
header{
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    /*padding: 10px;*/
}
.dark header{
    background: linear-gradient(0deg, rgba(22, 22, 24, 0.32) 0%, rgba(22, 22, 24, 0.32) 100%), rgba(255, 255, 255, 0.08);
}
.light header{
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0.30) 100%), rgba(0, 0, 0, 0.08);
}
.logo{
    /*width: 240px;*/
    height: 42px;
}
.nav-item{
    padding-right: 60px;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
}
.nav-link.active{
    margin-right: 0!important;
}
.dark .nav-link{
    color: #F1F1F1!important;
}
.light .nav-link{
    color: var(--dark-gray);
}
.mode-img{
    background-size:cover;
    width: 24px;
    height: 24px;
    display: block;
    margin-left: 12px;
}
.light .mode-img{
    background: url("../img/svg/moon.svg")no-repeat;
    margin-top: 4px;

}
.dark .mode-img{
    background: url("../img/svg/sun.svg")no-repeat;

}
.text-login{
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    margin-left: 12px;
}
.light .text-login{
    color: var(--dark-gray);

}
.dark .text-login{
    color: var(--light-mode);

}
.text-register{
    color: #F4E7FD;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    height: 38px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    box-shadow: 0 0 0 3.7px rgba(190, 202, 234, 0.03);
    padding: 7px 24px;
}
.dark .text-register{
    background: var(--purple);
}
.light .text-register{
    background: linear-gradient(98deg, #6A0DAD 1.48%, #2C0547 99.96%);
}
.navbar-nav .nav-link.active{
border-bottom:1px solid #6A0DAD!important;
}
.dropdown-menu{
    border-radius: 10px;
    padding: 20px;
    margin-top: 13px!important;
}
.light .dropdown-menu{
    border: 1px solid #E6E6E6;
    background: #F2F2F2!important;
    /*box-shadow: 0 4px 4px 0 rgba(195, 195, 195, 0.25), 0 8px 23px -3px #E8E8E8;*/
}
.dark .dropdown-menu{
    border: 1px solid  #44444A;
    background:  #333;
    box-shadow: 0 14px 22px -9px rgba(255, 255, 255, 0.06) inset, 0 16px 20px -6px rgba(0, 0, 0, 0.65);
}
.dropdown-item{
    font-size: 14px;
    font-weight: 500;
}
.dropdown-menu li:not(:last-child){
    margin-bottom: 20px;
}
.light .dropdown-item{
    color: #333;
}
.dark .dropdown-item{
    color: #fff!important;
}
.dropdown-item.active, .dropdown-item:active {
    color: unset;
    background-color: unset;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: unset;
    background-color: unset;
}
.menu-mobile{
    width: 24px;
    height: 24px;
    display: block;
}
.light .menu-mobile{
    background: url("../img/svg/menu-light.svg")no-repeat;
}
.dark .menu-mobile{
    background: url("../img/svg/menu-dark.svg")no-repeat;
}
.light .offcanvas {
background: #FFFFFF;
}
.dark .offcanvas {
background: #0D0D0D;
}
.btn-close {
    width: 24px;
    height: 24px;
    display: block;
    opacity: unset;
}
.light .btn-close{
    --bs-btn-close-bg: url('../img/svg/close-light.svg');

}
.dark .btn-close{
    --bs-btn-close-bg: url('../img/svg/add-dark.svg');

}
.offcanvas-title{
    font-size: 16px;
    font-weight: 500;
}
.light .offcanvas-title{
    color:#333;
}
.dark .offcanvas-title{
    color:#fff;
}
.offcanvas-body .nav-item{
    padding-right: 0!important;
    margin-bottom: 34px;
}
.offcanvas-body .nav-link{

    font-size: 20px;
    font-weight: 500;
}
.light .offcanvas-body .nav-link{
color: #7D7888!important;
}
.dark .offcanvas-body .nav-link{
    color: #ACB5BB!important;
}
.offcanvas-body .navbar-nav .nav-link.active{
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 20px;
    font-weight: 500;
    border: 1px solid #F6F7FA!important;
}
.light .offcanvas-body .navbar-nav .nav-link.active{
    color: #333!important;
    background:  #F2F2F2;
    box-shadow: 0 4px 4px 0 rgba(195, 195, 195, 0.25), 0 8px 23px -3px #E8E8E8;
}
.dark .offcanvas-body .navbar-nav .nav-link.active{
    background:  #1C1C1C;
    color: #FFFFFF!important;
    box-shadow: 0 8px 23px -3px #000, 0 -5px 10px 0 rgba(255, 255, 255, 0.10) inset;
}
.light .offcanvas-header{
    border-bottom: 1px solid #E6E6E6;
}
.dark .offcanvas-header{
    border-bottom: 1px solid #2C2C30;
}
.header-notification{
    width: 24px;
    height: 24px;
    display: block;
}
.light .header-notification{
    background: url("../img/svg/notification-light.svg")no-repeat;
}
.dark .header-notification{
    background: url("../img/svg/notification-dark.svg")no-repeat;
}
.header-notification:after{
    display: none!important;
}
.notification{
    padding-right: 12px!important;
    font-size: unset!important;
}
.notification .dropdown-menu[data-bs-popper] {
    left: 0;
    right: unset;
}
.header-text1{
    font-size: 16px;
    font-weight: 600;
}
.light .header-text1{
    color: var(--dark-gray);
}
.dark .header-text1{
    color: var(--light-mode);
}
.header-text2{
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
}
.light .header-text2{
    color: #6A0DAD;
}
.dark .header-text2{
    color: #BD71F4;
}
.icon-notification{
    border-radius: 8px;
    background: #49351F;
    width: 32px;
    height: 32px;
    align-content: center;
}
.icon-notification img{
    width: 32px;
    height: 32px;
    display: block;
    margin: auto;
}
.notification-icon{
    width: 12px!important;
    height: 12px!important;
    margin-right: 0!important;
    margin-left: 0!important;
    margin-top: -9px!important;

}
.view-all{
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    display: block;
}
.light .view-all{
    color: #6A0DAD;
}
.dark .view-all{
    color: #BD71F4;
}
.header-text3{
    font-size: 14px;
    font-weight: 500;
    margin-right: 12px;
}
.light .header-text3{
    color: var(--dark-gray);
}
.dark .header-text3{
    color: var(--light-mode);
}
.header-text4{
    font-size: 12px;
    font-weight: 400;
    margin-right: 12px;
}
.light .header-text4{
    color: #7D7888;
}
.dark .header-text4{
    color: #ACB5BB;
}
.user{
    padding-right: 12px;
    font-size: unset;
}
.user .header-user img{
    width: 40px;
    height: 40px;
    border-radius: 50%;
}
.user:after{
    display: none!important;
}
.user .dropdown-menu{
    width: 170px;
}
.custom-link{
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 23px;
    display: block;
}
.light .custom-link{
    color: var(--dark-gray);
}
.dark .custom-link{
    color: var(--light-mode);
}
.custom-link:last-child{
    margin-bottom: 0;
}
.custom-link .icon{
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 12px;
}
.light .custom-link .referral-link-icon{
background: url("../img/svg/arrowup2-light.svg")no-repeat;
}
.dark .custom-link .referral-link-icon{
    background: url("../img/svg/arrowup2-dark.svg")no-repeat;
}
.light .custom-link .settings-icon{
background: url("../img/svg/setting2-light.svg")no-repeat;
}
.dark .custom-link .settings-icon{
    background: url("../img/svg/setting2-dark.svg")no-repeat;
}
.light .custom-link .change-password-icon{
background: url("../img/svg/unlock-light.svg")no-repeat;
}
.dark .custom-link .change-password-icon{
    background: url("../img/svg/unlock-dark.svg")no-repeat;
}
.light .custom-link .logout-icon{
background: url("../img/svg/logout-light.svg")no-repeat;
}
.dark .custom-link .logout-icon{
    background: url("../img/svg/logout-dark.svg")no-repeat;
}
.responsive-header:not(.active){
    margin-right: 14px !important;
}
.responsive-header .icon{
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 14px;
}
.light .dashboard-icon{
    background: url("../img/svg/category-light.svg")no-repeat;
}
.dark .dashboard-icon{
    background: url("../img/svg/category-dark.svg")no-repeat;
}
.light .portfolio-icon{
    background: url("../img/svg/portfolio-light.svg")no-repeat;
}
.dark .portfolio-icon{
    background: url("../img/svg/portfolio-dark.svg")no-repeat;
}
.light .transactions-icon{
    background: url("../img/svg/line-chart-light.svg")no-repeat;
}
.dark .transactions-icon{
    background: url("../img/svg/line-chart-dark.svg")no-repeat;
}
.light .ticket-icon{
    background: url("../img/svg/ticket-light.svg")no-repeat;
}
.dark .ticket-icon{
    background: url("../img/svg/ticket-dark.svg")no-repeat;
}
.light .wallet-icon{
    background: url("../img/svg/wallet-light.svg")no-repeat;
}
.dark .wallet-icon{
    background: url("../img/svg/wallet-dark.svg")no-repeat;
}
.light .market-analysis-icon{
    background: url("../img/svg/business-report-light.svg")no-repeat;
}
.dark .market-analysis-icon{
    background: url("../img/svg/business-report-dark.svg")no-repeat;
}
.light .educational-videos-icon{
    background: url("../img/svg/video-file-light.svg")no-repeat;
}
.dark .educational-videos-icon{
    background: url("../img/svg/video-file-dark.svg")no-repeat;
}
.light .referral-link-icon{
    background: url("../img/svg/arrow-up-right3-light.svg")no-repeat;
}
.dark .referral-link-icon{
    background: url("../img/svg/arrow-up-right3-dark.svg")no-repeat;
}
.light .unlock-icon{
    background: url("../img/svg/unlock2-light.svg")no-repeat;
}
.dark .unlock-icon{
    background: url("../img/svg/unlock-dark.svg")no-repeat;
}
.light .settings-icon{
    background: url("../img/svg/setting3-light.svg")no-repeat;
}
.dark .settings-icon{
    background: url("../img/svg/setting3-dark.svg")no-repeat;
}
.light .logout-icon{
    background: url("../img/svg/logout2-light.svg")no-repeat;
}
.dark .logout-icon{
    background: url("../img/svg/logout2-dark.svg")no-repeat;
}
.profile-box{
    padding: 12px;
    height: 60px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.03);
    display: flex;
    justify-content: right;
    align-items: center;
}
.light .profile-box{
    background: #F2F2F2;
    box-shadow: 0 4px 4px 0 rgba(195, 195, 195, 0.25), 0 8px 23px -3px #E8E8E8;
}
.dark .profile-box{
    background: #1C1C1C;
    box-shadow: 0 -6px 4px 0 rgba(0, 0, 0, 0.12) inset, 0 8px 10px -4px rgba(19, 30, 50, 0.10), 0 6px 4px -4px rgba(0, 0, 0, 0.25);
}
.profile-box img{
    width: 40px;
    height: 40px;
}
.header-text5{
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 0;
}
.light .header-text5{
    color: #333;
}
.dark .header-text5{
    color:#FFF;
}
.header-text6{
    font-size: 14px;
    font-weight: 400;
    color: #6C7278;
    margin-bottom: 0;
}
.logo2{
    width: 200px;
    display: block;
    height: 57px;
    background-size: cover!important;
}
.light .logo2{
    background: url("../img/svg/logo2-light.svg")no-repeat;
}
.dark .logo2{
    background: url("../img/svg/logo2-dark.svg")no-repeat;
}
/* ==== /header css ====*/
/* ==== footer css ====*/
footer{
    margin-top: 100px;
    margin-bottom: 20px;
}
.logo-footer{
    width: 240px;
    height: 48px;
    display: block;
    margin-bottom: 53px;
    margin-left: auto;
    margin-right: auto;
}
.light .logo-footer{
    background: url("../img/svg/logo2-light.svg")no-repeat;
}
.dark .logo-footer{
    background: url("../img/svg/logo2-dark.svg")no-repeat;
}
.item-link{
    font-size: 16px;
    font-weight: 500;
}
.light .item-link{
color: #7D7888;
}
.dark .item-link{
    color: #ACB5BB;
}
.circle-bg{
    border-radius: 50%;
    width: 6px;
    height: 6px;
    background: #6C7278;
    align-self: center;
    margin: 0 10px;

}
.social-network-box{
    border-radius: 16px;
    border: 1px solid #404044;
    padding: 16px 32px;
    background: transparent;
}
.footer-text1{
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    margin-bottom: 24px;
}
.light .footer-text1{
    color: var(--dark-mode);

}
.dark .footer-text1{
    color: var(--light-mode);
}
.social-box{
    width: 48px;
    height: 48px;
    border-radius: 50%;
    box-shadow: 0 7.4px 18.5px 0 rgba(255, 255, 255, 0.11) inset;
    align-content: center;
    margin-right: 12px;
}
.light .social-box{
    border: 1px solid #D9D9D9;
    background:  #E6E6E6;
}
.dark .social-box{
    border: 1px solid  #44444A;
    background:#1C1C1C;
}
.icon-whatsapp{
    width: 24px;
    height: 24px;
    margin: auto;
    display: block;
}
.light .icon-whatsapp{
background: url("../img/svg/whatsapp-light.svg")no-repeat;
}
.dark .icon-whatsapp{
    background: url("../img/svg/whatsapp-dark.svg")no-repeat;
}
.icon-telegram{
    width: 24px;
    height: 24px;
    margin: auto;
    display: block;
}
.light .icon-telegram{
background: url("../img/svg/telegram-light.svg")no-repeat;
}
.dark .icon-telegram{
    background: url("../img/svg/telegram-dark.svg")no-repeat;
}
.icon-twitter{
    width: 24px;
    height: 24px;
    margin: auto;
    display: block;
}
.light .icon-twitter{
    background: url("../img/svg/twitter-light.svg")no-repeat;
}
.dark .icon-twitter{
    background: url("../img/svg/twitter-dark.svg")no-repeat;
}
.icon-instagram{
    width: 24px;
    height: 24px;
    margin: auto;
    display: block;
}
.light .icon-instagram{
background: url("../img/svg/instagram-light.svg")no-repeat;
}
.dark .icon-instagram{
    background: url("../img/svg/instagram-dark.svg")no-repeat;
}
.icon-pinterest{
    width: 24px;
    height: 24px;
    margin: auto;
    display: block;
}
.light .icon-pinterest{
    background: url("../img/svg/pinterest-dark.svg")no-repeat;
}
.dark .icon-pinterest{
    background: url("../img/svg/pinterest-dark.svg")no-repeat;
}
.icon-facebook{
    width: 24px;
    height: 24px;
    margin: auto;
    display: block;
}
.light .icon-facebook{
    background: url("../img/svg/facebook-light.svg")no-repeat;
}
.dark .icon-facebook{
    background: url("../img/svg/facebook-dark.svg")no-repeat;
}
.line{
    border-bottom:1px solid #2C2C30;
    margin: 50px 0;
}
.privacy-text{
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
}
.light .privacy-text{
    color:  #7D7888;
}
.dark .privacy-text{
color: #ACB5BB;
}
/* ==== /footer css ====*/



.custom-pagination{
    display: flex;
    justify-content: center;
    margin-top: 16px;
}
.pagination{
    --bs-pagination-bg: transparent!important;
    --bs-pagination-border-color:unset!important;
}
.custom-pagination .page-item{
    padding-right: 12px;
    padding-left: 12px;
}
.custom-pagination .page-link{
    font-size: 12px;
    font-weight: 800;
    padding: 0!important;
    background-color:unset ;
    border: unset;
}
.light .custom-pagination .page-link{
    color: #7D7888;
}
.dark .custom-pagination .page-link{
color: #6C7278;
}
.custom-box-next{
    border-radius: 8px!important;
    width: 32px;
    height: 32px;
    align-content: center;
}
.light .custom-box-next{
border: 1px solid #B3B3B3;
}
.dark .custom-box-next{
border: 1px solid #44444A;
}
.custom-box-next .icon{
    width: 16px;
    height: 16px;
    display: block;
    margin: auto;
}
.light .custom-box-next .icon{
    background: url("../img/svg/arrow-left2-light.svg")no-repeat;
}
.dark .custom-box-next .icon{
    background: url("../img/svg/arrow-left2-dark.svg")no-repeat;
}
.custom-box-previous{
    width: 32px;
    height: 32px;
    align-content: center;
}
.light .custom-box-previous{
border: 1px solid #B3B3B3;
}
.dark .custom-box-previous{
border: 1px solid #44444A;
}
.custom-box-previous .icon{
    width: 16px;
    height: 16px;
    display: block;
    margin: auto;
}
.light .custom-box-previous .icon{
    background: url("../img/svg/arrow-right2-light.svg")no-repeat;
}
.dark .custom-box-previous .icon{
    background: url("../img/svg/arrow-right2-dark.svg")no-repeat;

}
.page-item:first-child .page-link {
border-radius: 8px!important;
}
.page-item:last-child .page-link {
border-radius: 8px!important;
}
.pagination .page-link.active{
    border-radius: 10px;
    width: 32px;
    height: 32px;
    padding: 5px 15px;
    font-size: 12px;
    font-weight: 800;
    display: block;
    text-align: center;
    align-content: center;
}
.light .pagination .page-link.active{
    background:  #E6E6E6!important;
    color: #333333;
}
.dark .pagination .page-link.active{
    background:  #44444A!important;
    color: #FFFFFF;
}

.active>.page-link, .page-link.active {
    background-color: unset;
}
.page-link:focus {
    box-shadow: unset;
    background-color: unset;
}
.page-link:hover{
    background-color: unset!important;
    border-color:unset!important;
}
a:hover {
    color: #fff;
}
.custom-input2{
    /*padding-top: 27px;*/
    /*padding-bottom: 27px;*/
    padding-right: 12px;
    padding-left: 12px;
    border-radius: 6px;
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    height: 46px;

}
.light .custom-input2{
    border: 1px solid  #7D7888;
    background:  #E6E6E6;
    color: #333;
}
.dark .custom-input2{
    border: 1px solid  #44444A;
    background:  #2C2C30;
    color: #FFF;
}

.custom-title2{
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 0;
}
.light .custom-title2{
    color: #333;
}
.dark .custom-title2{
    color: #fff;
}
.cs-btn{
    height: 46px;
    padding: 13px 24px;
    align-items: center;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background:  #6A0DAD;
    width: 100%;
    color:  #E6E6E6;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
}
.custom-textarea{
    height: 200px;
}
.custom-textarea:focus,.custom-textarea:focus-visible{
    outline: 0;
    box-shadow: unset;
}
.contact-text{
    font-size: 18px;
    margin-bottom: 10px;
}
.light .contact-text,.light .contact-text a{
    color: #333;
}
.dark .contact-text,.dark .contact-text a{
    color: #fff;
}
.contact-text a{
    text-decoration: underline;
}

/* ==== alerts css ====*/
.success-notification{
    border-radius: 8px;
    background: #3C6E63;
    padding: 20px 24px;
}
.error-notification{
    border-radius: 8px;
    background: #8E2A4E;
    padding: 20px 24px;
}
.warning-notification{
    border-radius: 8px;
    background: #ECAC31;
    padding: 20px 24px;
}
.custom-text20{
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    margin-bottom: 0;
}
.icon-error{
    width: 104px;
    height: 104px;
    margin-bottom: 24px;
    display: block;
    margin-right: auto;
    margin-left: auto;
}
.custom-title8{
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 12px;
    text-align: center;
}
.light .custom-title8{
    color: #333;
}
.dark .custom-title8{
    color: #FFF;
}
.custom-text21{
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    margin-bottom: 24px;
    text-align: center;
}
.light .custom-text21{
    color:#7D7888 ;
}
.dark .custom-text21{
    color: #ACB5BB;
}