.DashTopProducts th,
.barCardTitle,
.cardTitle,
.cardValue,
.chatright_msg .chatmsg_row span,
.dash-h2,
.dzf-Name,
.dzf-size,
.headpageTitle,
.innerSub_title,
.notiTitle,
.orderNumberIn,
.subTitles,
body,
span.tittle,
table {
    font-family: Poppins, sans-serif
}

.dash_nav_item a.active,
.dash_nav_item.active a,
.dash_nav_item:hover a {
    background: #ff6000;
    box-shadow: 0 20px 50px rgba(55, 69, 87, .1);
    color: #fff
}

.Account-Summary,
.Week’s-Activity-view-all,
.dashbord-courses .View-details {
    text-decoration: underline
}

body {
    background-color: #fafbfc
}

.password-icon {
    position: absolute;
    top: 50px;
    right: 30px
}

.changePassword {
    font-weight: 500;
    font-size: 14px;
    color: #f7941d
}

.BtnRow {
    display: flex;
    justify-content: center;
    column-gap: 30px;
    margin-top: 15px
}

.form-control {
    border: 1px solid rgba(255, 255, 255, .3);
    padding: 16px
}

.dash_nav_item a,
.dash_nav_item a.active {
    border-radius: 16px
}

.form-control:active,
.form-control:focus {
    background-color: #fff;
    outline: 0;
    box-shadow: none;
    border-color: #f7941d;
    color: #3a3a3c
}

.Active-Classes-accordion .accordion-item,
.Learn-Program-accodiaon .accordion-item,
.Learn-Program-outer-box,
.reportDataCard,
.side_nav {
    box-shadow: .5px 3px 10px rgba(119, 119, 119, .1)
}

.dash_header {
    background: #fff;
    height: 100px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1030;
    display: flex
}

.side_nav {
    width: 300px;
    background-color: #fff;
    z-index: 1000;
    top: 100px;
    bottom: 0;
    position: fixed;
    transition: .2s;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -o-transition: .2s;
    -ms-transition: .2s
}

.expanded-btn.onlymobileView .notFolded,
.preview-container #previews .zdrop-delete svg {
    height: 20px
}

.expanded-btn.onlymobileView {
    color: #fff;
    margin: 0 8px 0 15px;
    display: none
}

.page_container {
    min-height: 100vh;
    padding-left: 300px;
    transition: .2s;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -o-transition: .2s;
    -ms-transition: .2s
}

.chatmsg_row,
.create_order,
.dash_userProfile,
.filterSortBx,
.logo-box-hide,
.makeAvaiDash,
.notiListCard,
.notiRow,
.showing_order {
    display: flex;
    align-items: center
}

.MarkCompleteBTn .dropdown-menu::after,
.activatCheckBanner.show .switch-inactive,
.btn-action-filter~.dropdown-menu::after,
.dash_logo .logo_fold,
.dekstop-search-btn-none,
.dropdown-toggle::after,
.folded,
.is-folded .notFolded,
.list-view table tbody td.offer-dtl-col::before,
.list-view table thead,
.mobile-title-show,
.switch-active,
.uploadFileImages input {
    display: none
}

.main_content {
    padding: calc(90px + 45px) 24px 10px 48px;
    min-height: 100vh
}

.dash_logo img {
    max-height: 40px;
    min-width: 25px
}

.dash_header .dash_logo {
    width: 285px;
    display: flex;
    padding-left: 10px;
    background: #fff;
    align-items: center;
    transition: .2s;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -o-transition: .2s;
    -ms-transition: .2s;
    margin-left: 15px
}

.side_nav .side_nav_inner {
    position: relative;
    height: 100%
}

.side_nav .side_nav_inner .sideNav_menu {
    position: relative;
    list-style: none;
    margin: 0;
    overflow: auto;
    height: calc(100vh - 90px);
    padding: 15px 20px 0;
    display: flex;
    flex-direction: column
}

.nav_right_langugae {
    margin-right: 25px
}

.side_nav .side_nav_inner .sideNav_menu::-webkit-scrollbar {
    width: 5px;
    height: 5px
}

.side_nav .side_nav_inner .sideNav_menu::-webkit-scrollbar-thumb {
    background: #aaa;
    border-radius: 5px
}

.side_nav .side_nav_inner .sideNav_menu::-webkit-scrollbar-track {
    background: 0 0
}

.dash_nav_item a {
    display: flex;
    align-items: center;
    padding: 14px 15px;
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s;
    white-space: nowrap;
    font-weight: 500;
    font-size: 17px;
    line-height: 27px;
    color: #737791
}

.dash_nav_item a .icon_holder svg {
    width: 19px
}

.dash_nav_item a .icon_holder {
    display: inline-block;
    flex: 0 0 40px;
    line-height: .8
}

li.dash_nav_item {
    margin: 2px 0
}

.dash_nav_item a .title_dash_nav {
    display: block;
    flex: 1;
    position: relative
}

.dash_nav_item .active svg path,
.dash_nav_item a:hover svg path,
.dash_nav_item.active .icon_holder svg path {
    fill: #fff
}

.dash_nav_item a svg path {
    transition: .3s;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    -ms-transition: .3s
}

.nav_dash_wrap {
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 30px 15px 0
}

.dash_userProfile img {
    box-shadow: 0 5px 10px 6px rgba(41, 72, 152, .14);
    border-radius: 10px;
    width: 100%;
    flex: 0 0 48px;
    max-width: 48px
}

.prfDash_userContent {
    flex: 0 0 calc(100% - 48px);
    max-width: calc(100% - 48px);
    padding-left: 15px
}

.topPRfNameUser {
    font-weight: 500;
    font-size: 15px;
    line-height: 1;
    color: #0d1118;
    margin-bottom: 5px
}

.makeAvaiDash span {
    font-weight: 300;
    font-size: 13px;
    line-height: 17px;
    color: rgba(13, 17, 24, .6);
    margin-right: 6px
}

.statusDash_tag {
    font-weight: 400;
    font-size: 13px;
    line-height: 17px;
    color: #0d1118;
    margin-left: 6px
}

.cardTitle,
.cardValue,
.carddataCount,
.exportBtn,
.minQtyDes,
.notiHeaderTopHeading i,
.rightMenuBtn {
    font-weight: 500
}

.showing_order.active,
.statusDash_tag.available {
    color: #0cab50
}

.statusDash_tag.notAvailable {
    color: #ee0909
}

.switch-style-1 {
    line-height: 0
}

.switch-style-1 input[type=checkbox],
.switch-style-1 input[type=radio] {
    appearance: none;
    width: 24px;
    height: 14px;
    border-radius: 30px;
    background: #d3d3d3;
    background: linear-gradient(90deg, #3ecd7b 50%, #d3d3d3 50%);
    margin: 0 6px;
    position: relative;
    cursor: pointer;
    transition: .3s;
    background-size: 100px;
    background-position: -70px 0;
    outline: 0;
    box-shadow: none
}

.switch-style-1 input[type=checkbox]::before,
.switch-style-1 input[type=radio]::before {
    background: #fff;
    box-shadow: 3px 1px 4px rgba(0, 0, 0, .1);
    width: 15px;
    height: 15px;
    border-radius: 50%;
    position: absolute;
    content: "";
    left: -3px;
    top: 50%;
    transform: translateY(-50%);
    transition: .3s
}

.switch-style-1 input[type=checkbox]:checked::before,
.switch-style-1 input[type=radio]:checked::before {
    left: 11px
}

.switch-style-1 input[type=checkbox]:checked,
.switch-style-1 input[type=radio]:checked {
    background-position: -20px 0
}

.dash_header .user_dropdown>a {
    margin-right: 0
}

.nav-link:focus,
.nav-link:hover {
    color: #f7941d
}

.user_dropdown .fa-chevron-down {
    font-size: 10px
}

.dropdown-menu.vendor-user-drop {
    transform: translate(0, 42px) !important
}

.notiHeader_top {
    padding: 15px 25px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #dee2e6
}

.notiHeader_top .viewBtn {
    color: #fff;
    background-color: #1a73e8;
    border: 1px solid #1a73e8;
    padding: .35rem 1rem;
    height: auto;
    line-height: 1.25;
    font-size: .875rem;
    border-radius: 5px
}

.ceartBtn i,
.notiHeader_top i {
    padding-right: 5px
}


.notilistul,
ul.subMenuSide {
    padding: 0;
    margin: 0;
    list-style: none
}

.notificationListDrop {
    max-height: 250px;
    overflow: auto
}

.notificationListDrop::-webkit-scrollbar {
    width: 5px;
    height: 5px
}

.notificationListDrop::-webkit-scrollbar-thumb {
    background: #aaa;
    border-radius: 5px
}

.notificationListDrop::-webkit-scrollbar-track {
    background: 0 0
}

.notificationListDrop .dropdown-item {
    padding: 15px
}

.notificationListDrop li:not(:last-child) .dropdown-item {
    border-bottom: 1px solid #edf2f9
}

.notificationListDrop .dropdown-item:hover {
    background: #fafafa
}

.notiListCard .notiListImg {
    flex: 0 0 30px;
    max-width: 30px;
    width: 100%
}

.notiListCard .notiListImg img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover
}

.notiListCard .notiListContent p {
    color: #2a2a2a;
    font-size: 14px;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    display: flex;
    text-overflow: ellipsis
}

.notiListCard .notiListContent p span {
    color: #1a73e8
}

.notiListCard .notiListContent small {
    display: block;
    color: #72849a
}

.notiListCard .notiListContent {
    flex: 0 0 calc(100% - 30px);
    max-width: calc(100% - 30px);
    width: 100%;
    padding-left: 15px
}

.notiHeaderTopHeading {
    color: #212529;
    font-weight: 500
}

.nav_dash_wrpRight {
    display: flex;
    align-items: center;
    width: 50%;
    justify-content: end
}

.me-20 {
    margin-right: 16px
}

.rightMenuBtn {
    color: #53535f;
    padding: 10px;
    display: flex;
    line-height: 1;
    align-items: center;
    justify-content: center;
    position: relative;
    font-size: 22px;
    background: #fffaf1;
    border-radius: 8px;
    width: 44px
}

.rightMenuBtn:hover {
    top: 1px
}

.rightMenuBtn.newNotiMsg::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #eb5757;
    position: absolute;
    right: 4px;
    top: 5px
}

.rightMenuBtn.langDropBtn {
    min-width: 48px;
    width: auto;
    padding: 10px 15px
}

.form-select:before,
.searchFilteHome .form-control {
    padding: 15px 22px;
    font-weight: 500;
    color: #0d1118;
    font-size: 18px
}

.rightMenuBtn.langDropBtn img {
    height: 14px;
    width: auto;
    margin-right: 10px
}

.walletSearchRow .searchRow_col {
    flex: 0 0 70%;
    max-width: 70%;
    width: 100%
}

.walletSearchRow .walletRow_col {
    flex: 0 0 30%;
    max-width: 30%;
    width: 100%
}

.dashIconFold,
.nav_dash_wrpLeft {
    align-items: center;
    width: 100%;
    display: flex
}

.searchFilteHome {
    background: #1a73e8;
    border: 1px solid #f3f2f2;
    border-radius: 10px;
    padding: 20px 25px
}

.searchFilteHome .form-control {
    background: url(../img/search\ icon.svg) 98% no-repeat #f7f7f9;
    border-radius: 10px
}

.form-select:before {
    content: "";
    border-radius: 10px;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMTQiIHZpZXdCb3g9IjAgMCAyMSAxNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTAuMjA5Mzc3IDMuMTE5MDRMOS45ODQ2OSAxMi44OTM3QzEwLjEyNDQgMTMuMDMzNSAxMC4yODUgMTMuMTAzNSAxMC40NjY4IDEzLjEwMzVDMTAuNjQ4NiAxMy4xMDM1IDEwLjgwOTUgMTMuMDMzNSAxMC45NDkzIDEyLjg5MzdMMjAuNzIzOCAzLjExOTAzQzIwLjg2MzggMi45NzkgMjAuOTMzNiAyLjgxODMzIDIwLjkzMzYgMi42MzY0OUMyMC45MzM2IDIuNDU0NzMgMjAuODYzNiAyLjI5MzgzIDIwLjcyMzggMi4xNTQxTDE5LjY3NTIgMS4xMDU2MkMxOS41MzU0IDAuOTY1ODEyIDE5LjM3NDUgMC44OTU5NDMgMTkuMTkyOCAwLjg5NTk0M0MxOS4wMTEgMC44OTU5NDMgMTguODUwMSAwLjk2NTgxMiAxOC43MTAzIDEuMTA1NjJMMTAuNDY2OCA5LjM0ODk3TDIuMjIzMDEgMS4xMDUxMUMyLjA4MzI3IDAuOTY1Mjk5IDEuOTIyMyAwLjg5NTg3MiAxLjc0MDgzIDAuODk1ODcyQzEuNTU4NzggMC44OTU4NzIgMS4zOTc4OCAwLjk2NTc0MSAxLjI1ODE0IDEuMTA1MTFMMC4yMDk0NTEgMi4xNTQwM0MwLjA2OTcxMyAyLjI5Mzc2IDAuMDAwMjgzNjEzIDIuNDU0NzMgMC4wMDAyODM2MjMgMi42MzY0MkMwLjAwMDIwOTI0NiAyLjgxODMzIDAuMDY5NjM4NyAyLjk3OTIzIDAuMjA5Mzc3IDMuMTE5MDRaIiBmaWxsPSIjNjk3Njg3Ii8+Cjwvc3ZnPgo=);
    background-position: 98%;
    background-repeat: no-repeat
}

.searchFilteHome .form-control::placeholder {
    font-weight: 400;
    font-size: 18px;
    line-height: 23px;
    color: #0d1118;
    opacity: .5
}

ul.subMenuSide li a {
    font-weight: 400;
    font-size: 15px;
    color: #8a8b9f;
    padding: 15px 25px 15px 65px
}

ul.subMenuSide li a span {
    width: 25px;
    display: inline-block
}

.Learn-Program-accodiaon,
.MarkCompleteBTn .MarkCompletebea,
.chat-body,
.chatFooterBox,
.chatMsg,
.chat_bodyBox form,
.chat_messages,
.chatsearch,
.img_profile_banner,
.listingSearchblock,
.subMenuLink,
.subject-search-icon,
.videocover {
    position: relative
}

.arrowIconSubmenu {
    position: absolute;
    right: 35px;
    line-height: 30px;
    transition: 50ms ease-in;
    -webkit-transition: 50ms ease-in;
    top: 18px
}

.subMenuLink .arrowIconSubmenu::after,
.subMenuLink .arrowIconSubmenu::before,
.subMenuLink.collapsed .arrowIconSubmenu::before {
    content: "";
    position: absolute;
    background: 0 0;
    background-image: linear-gradient(to right, rgba(42, 42, 42, .75), rgba(42, 42, 42, .75));
    border-radius: 2px;
    width: 6px;
    height: 1.5px;
    top: 13px;
    transition: background .3s cubic-bezier(.645, .045, .355, 1), transform .3s cubic-bezier(.645, .045, .355, 1), top .3s cubic-bezier(.645, .045, .355, 1), -webkit-transform .3s cubic-bezier(.645, .045, .355, 1);
    transform: rotate(-135deg) translateX(2px);
    -webkit-transform: rotate(-135deg) translateX(2px)
}

.subMenuLink .arrowIconSubmenu::after,
.subMenuLink.collapsed .arrowIconSubmenu::after {
    transform: rotate(-45deg) translateX(2px);
    -webkit-transform: rotate(-45deg) translateX(2px)
}

.subMenuLink:not(.collapsed) .arrowIconSubmenu::before {
    transform: rotate(-225deg) translateX(2px);
    -webkit-transform: rotate(-225deg) translateX(2px)
}

.subMenuLink:not(.collapsed) .arrowIconSubmenu::after {
    transform: rotate(45deg) translateX(2px);
    -webkit-transform: rotate(45deg) translateX(2px)
}

.dashIconFold svg {
    transition: .2s
}

.dashIconFold {
    height: 100%;
    justify-content: center
}

.editIcnCenter .ProfileEditBtn {
    right: 44%
}

.nav_dash_wrpLeft {
    justify-content: space-between
}

.headpageTitle {
    font-weight: 600;
    font-size: 32px;
    line-height: 140%;
    color: #151d48
}

.deshbord-search {
    width: 50%
}

.chatFooterBox,
.is-folded .folded {
    display: block
}

.sideBar_bx {
    background: #4fd1c5;
    border-radius: 10px;
    padding: 30px;
    position: relative;
    margin-bottom: 30px
}

.sideBar_bx>* {
    z-index: 2;
    position: relative
}

li.dash_nav_item.sidebar-SubscribeCard {
    margin-top: auto
}

.sideBarinnIcon {
    min-height: 48px;
    min-width: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    width: 48px;
    height: 48px;
    background: #fff;
    border-radius: 16px
}

.dash_nav_item a.documenBtn {
    background: #fff;
    border-radius: 12px;
    padding: 12px 15px;
    display: block;
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #66c6c2
}

.barCardTitle {
    font-weight: 800;
    font-size: 20px;
    text-align: center;
    color: #fff;
    margin: 15px 0 30px;
    line-height: 28px
}

.dashBoard_chatoverLay,
.dashBoard_overLay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .4);
    z-index: 50;
    visibility: hidden;
    opacity: 0;
    transition: .3s
}

.sideBar_bx {
    background-image: url(../img/subcribe-BG.png);
    background-repeat: no-repeat;
    background-size: cover
}

.logo-titel {
    font-size: 30px;
    font-weight: 700;
    vertical-align: middle;
    margin-left: 16px
}

.select-row,
table tr th {
    vertical-align: top
}

.deshbord-search {
    margin: 0 !important
}

.folded i,
.notFolded i {
    font-size: 22px;
    font-weight: 400
}

.deshbord-search .form-control {
    padding-left: 60px;
    height: 60px;
    background: #f9fafb;
    border-radius: 6px
}

.dashboardSearchIcon {
    position: absolute;
    top: 17px;
    left: 24px
}

.deshbord-search .form-control::-webkit-input-placeholder {
    font-weight: 500;
    font-size: 18px;
    color: #737791
}

.students-info {
    list-style: none;
    display: flex;
    padding: 0;
    flex-wrap: wrap;
    --gap: 30px
}

.students-info-item {
    flex-basis: 50%;
    max-width: 50%;
    width: 100%;
    width: calc(50% - var(--gap)/ 2)
}

.students-score-info {
    display: flex;
    justify-content: space-between;
    padding: 15px 20px;
    align-items: center
}

.gren-clr {
    background-color: #71d875;
    color: #fff
}

.org-clr {
    background-color: #ff9800
}

.blue-clr {
    background-color: #00aff0
}

.yello-clr {
    background-color: #ffc107
}

.red-clr {
    background-color: #ff5274
}

.begni-clr {
    background-color: #d57ff8
}

.students-item1 p {
    color: #fff;
    margin-bottom: 0
}

.students-score {
    font-size: 35px;
    font-weight: 800
}

.students-score-about {
    font-size: 18px;
    font-weight: 500
}

.students-score-icon {
    background-color: #fff;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-bottom: 0
}

.deshbord-sub-heading {
    font-weight: 800;
    font-size: 22px;
    color: #464a53;
    margin-bottom: 25px
}

.date-information p,
.deshbord-sub-title {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #464a53
}

.Active-Classes-accordion .accordion-item {
    background-color: #fff;
    border: 0;
    margin: 0 0 10px
}

.Learn-Program-accodiaon .accordion-item,
.Learn-Program-outer-box {
    border-radius: 10px;
    background-color: #fff
}

.Active-Classes-accordion .accordion-button:not(.collapsed) {
    background-color: #fef4e8;
    color: #f7941d;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125)
}

.Active-Classes-accordion .accordion-button:focus {
    z-index: 3;
    border-color: none;
    outline: 0;
    box-shadow: none
}

.Active-Classes-accordion .accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='17' viewBox='0 0 18 17' fill='none'%3E%3Cpath d='M13.1797 9.32031H9.82031V12.6797H8.17969V9.32031H4.82031V7.67969H8.17969V4.32031H9.82031V7.67969H13.1797V9.32031ZM9 0.179688C6.63021 0.231771 4.66406 1.03906 3.10156 2.60156C1.53906 4.16406 0.731771 6.13021 0.679688 8.5C0.731771 10.8698 1.53906 12.8359 3.10156 14.3984C4.66406 15.9609 6.63021 16.7682 9 16.8203C11.3698 16.7682 13.3359 15.9609 14.8984 14.3984C16.4609 12.8359 17.2682 10.8698 17.3203 8.5C17.2682 6.13021 16.4609 4.16406 14.8984 2.60156C13.3359 1.03906 11.3698 0.231771 9 0.179688Z' fill='%23F7941D'/%3E%3C/svg%3E")
}

.Learn-Program-accodiaon .accordion-button::after,
.faqAccordion .accordion-button::after {
    transition: transform .2s ease-in-out;
    background-image: none;
    font-family: Font-Awesome-5-Pro
}

.faqAccordion,
.walletSearchRow {
    margin-top: 20px
}

.chatright_inner,
.deshbord-inner-container {
    display: flex;
    flex-direction: column;
    height: 100%
}

.cover-space,
.dashbord-courses .grade_Tarea-inner,
.date-information,
.dpz-info {
    flex: 1
}

.subMenuLink:not(.collapsed),
.subMenuLink:not(.collapsed).subMenuLink svg {
    color: #a0a0b1
}

.deshbord-search.open {
    width: 100%;
    display: block;
    position: absolute;
    top: 70px;
    left: 0
}

.deshbord-search.open .form-control:active,
.deshbord-search.open .form-control:focus {
    background: #fff;
    outline: 0;
    box-shadow: none;
    border-color: #fff;
    color: #3a3a3c
}

.toggle_search {
    font-size: 20px;
    color: #53535f
}

.Account-information {
    display: flex;
    flex-direction: column
}

.date-information p {
    padding-bottom: 20px
}

.Account-Summary {
    font-size: 16px;
    display: block;
    font-weight: 600;
    color: #f7941d;
    margin-top: auto
}

.Topic-Attempted-heading,
.Topic-Learned-heading {
    font-weight: 700;
    padding: 20px 18px;
    font-size: 16px
}

.Topic-Learned ul,
.Topics-Attempted ul {
    list-style: none;
    padding: 20px 18px
}

.Topic-Learned ul li,
.Topics-Attempted ul li {
    color: #464a53;
    padding-bottom: 10px;
    font-size: 16px;
    font-weight: 600
}

.Topic-Learned-heading {
    background-color: #99d67c;
    color: #fff;
    margin: 0
}

.Topic-Attempted-heading {
    background-color: #fd9292;
    color: #fff;
    margin: 0
}

.Topic-Learned-box {
    display: flex;
    justify-content: space-between;
    gap: 25px
}

.Topic-Learned,
.Topics-Attempted {
    flex-basis: 50%;
    background-color: #f2f2f2
}

.Week’s-Activity-time {
    display: flex;
    justify-content: space-between;
    padding-bottom: 20px
}

.Week’s-Activity-time p {
    font-size: 16px;
    font-weight: 500;
    color: #464a53;
    margin: 0
}

.Week’s-Activity-view-all {
    font-size: 16px;
    font-weight: 600;
    color: #f7941d;
    margin-left: 15px
}

.Week’s-Activity-date {
    font-size: 16px;
    font-weight: 700;
    color: #464a53;
    padding-bottom: 20px
}

.Topics-name-title,
.Topics-tile,
.dashbord-courses .subject-name {
    font-weight: 400
}

.outer-container {
    background-color: #fff;
    padding: 30px
}

.dashbord-courses h6 {
    font-size: 16px;
    font-weight: 600;
    color: #354c68;
    padding-bottom: 15px;
    margin: 0
}

.dashbord-courses .grade_block {
    display: flex;
    height: 100%;
    flex-direction: column
}

.dashbord-courses .grade_Tarea {
    display: flex;
    flex-direction: column;
    flex: 1
}

.expanded-btn.onlyDesktopView {
    color: #fff;
    width: 19px;
    height: 61px;
    background: #ff6000;
    border-radius: 0;
    position: absolute;
    right: -19px;
    top: 50%;
    transform: translateY(-50%)
}

.dashIconFold .folded svg {
    transform: rotate(180deg)
}

.expanded-btn i {
    font-size: 22px
}

.Topics-tile {
    font-size: 18px;
    color: #adadad
}

.total-time-Program {
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: #3a3a3a;
    padding-top: 5px
}

.Learn-Program-accodiaon .accordion-item {
    margin-bottom: 30px;
    border: none;
    position: relative
}

.Learn-Program-accodiaon .accordion-button.collapsed {
    border-radius: 10px !important
}

.Learn-Program-accodiaon .accordion-button {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 800;
    color: #3a3a3a;
    padding-left: 73px;
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important
}

.Learn-Program-accodiaon .accordion-button:focus {
    border-color: unset;
    box-shadow: none
}

.accordion-button:not(.collapsed) {
    color: #3a3a3a;
    background-color: #fff;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125)
}

.Learn-Program-accodiaon .accordion-button::after,
.Topics-name-title::before,
.Topics-take-quiz::before {
    position: absolute;
    background-color: #d8d8d8;
    left: 23px
}

.about-Program-subject {
    background: #f6f6f6;
    border-radius: 10px;
    padding: 15px 20px 15px 73px;
    margin-bottom: 12px;
    position: relative
}

.Learn-Program-accodiaon ul {
    list-style: none;
    padding: 0;
    position: relative;
    margin-bottom: 0
}

.Topics-name-title {
    font-size: 18px;
    color: #3a3a3a
}

.Topics-take-quiz {
    padding-top: 15px;
    display: block
}

.Learn-Program-accodiaon .accordion-body {
    padding: 30px 10px
}

.Learn-Program-accodiaon .accordion-button::after {
    content: "\f067";
    font-size: 20px;
    font-weight: 500;
    width: 34px;
    height: 34px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 50%;
    top: 30px;
    z-index: 3
}

.Download-PDF-btn,
.Learn-Program-accodiaon .accordion-item.active .accordion-button::before,
.about-Program-subject.active::before,
.about-Program-subject.topicDone::before,
.accordion-item.active::after,
.accordion-item.topicDone::after,
.check-topic.Topics-name-title::after,
.check-topic.Topics-name-title::before,
.check-topic.Topics-take-quiz::after,
.check-topic.about-Program-subject::before,
.lessonquizli.check-quiz::after,
.lessonquizli.check-quiz::before,
.title-brack-line {
    background-color: #f7941d
}

.Learn-Program-accodiaon .accordion-button:not(.collapsed)::after,
.faqAccordion .accordion-button:not(.collapsed)::after {
    content: "\f2d1";
    display: block;
    text-align: center;
    background-color: #f7941d
}

.Topics-name-title::before {
    content: "";
    width: 17px;
    height: 17px;
    border: 4px solid #f6f6f6;
    border-radius: 50%;
    z-index: 5
}

.about-Program-subject.active .Topics-name-title::before,
.about-Program-subject.active .Topics-take-quiz::before {
    border: 4px solid rgb(253 234 210)
}

.Topics-take-quiz::before {
    content: "";
    width: 17px;
    height: 17px;
    border: 4px solid #f6f6f6;
    border-radius: 50%;
    z-index: 6
}

.check-topic.Topics-take-quiz::before {
    background-color: #62bdf3
}

.Learn-Program-accodiaon .accordion-button::before,
.Topics-name-title::after,
.Topics-take-quiz::after {
    width: 6px;
    background-color: #d8d8d8;
    position: absolute
}

.Topics-name-title::after {
    content: "";
    height: calc(100% - 50px);
    top: 24px;
    left: 29px;
    z-index: 4
}

.Learn-Program-accodiaon .accordion-item:last-child .accordion-body ul li:last-child .Topics-take-quiz::after,
.Learn-Program-accodiaon .accordion-item:last-child .accordion-button:before {
    content: none
}

.Learn-Program-accodiaon .accordion-item.active:last-child .accordion-button:before {
    content: ""
}

.Learn-Program-accodiaon .accordion-button::before {
    content: "";
    height: calc(100% - 20px);
    top: 72px;
    left: 39px;
    z-index: 3
}

.Topics-take-quiz::after {
    content: "";
    height: calc(100% - 40px);
    left: 29px;
    z-index: 5
}

.about-Program-subject.active {
    background: rgb(247 148 29 / 20%)
}

a.lessonquizli {
    padding: 18px 20px 0 73px;
    position: relative;
    display: inline-block;
    font-weight: 500;
    font-size: 18px;
    color: #3a3a3a
}

.lessonquizli::before {
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    background-color: #d8d8d8;
    border: 4px solid #fff;
    border-radius: 50%;
    left: 21px;
    z-index: 6
}

.lessonquizli::after {
    content: "";
    position: absolute;
    width: 6px;
    height: calc(100% + 45px);
    background-color: #d8d8d8;
    top: 40px;
    left: 29px;
    z-index: 9
}

.Learn-Program-accodiaon .accordion-button {
    padding-top: 30px;
    padding-bottom: 30px
}

.topic-Download-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

.live-class-title {
    font-size: 40px;
    font-weight: 900;
    text-align: center;
    color: #3a3a3a;
    text-transform: capitalize;
    margin: 0;
    padding-bottom: 10px
}

.title-brack-line {
    display: block;
    width: 58px;
    height: 4px;
    margin: auto
}

.live-class-header-part {
    padding-bottom: 30px
}

.topic-description p {
    font-weight: 400;
    font-size: 18px;
    color: #354c68
}

.live-class-banner img,
.videocover video {
    box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
    border-radius: 10px;
    width: 100%;
    object-fit: cover;
    margin-bottom: 22px
}

.play-button {
    position: absolute;
    z-index: 9999;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 90px;
    height: 90px;
    background: #f7941d;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    transition: .5s;
    line-height: 82px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center
}

.Download-PDF-btn svg {
    margin-left: 8px
}

.Download-PDF-btn {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    padding: 11px 20px;
    border-radius: 37px;
    display: flex;
    align-items: center;
    margin-left: 15px
}

.fileUpload,
.fileUpload:active,
.fileUpload:focus,
.fileUpload:hover {
    background: #f09323;
    cursor: pointer
}

.chatright_msg.myContact .chatmsg_row span.uploadIcons,
.usermyimg {
    margin-left: 0
}

.deshbord-inn-heading {
    font-weight: 800;
    font-size: 22px;
    color: #464a53
}

.usermyimg {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    position: relative;
    margin-top: 30px;
    margin-bottom: 35px
}

.fileUpload {
    width: 30px;
    min-width: 30px;
    height: 30px;
    border-radius: 50%;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 76px;
    right: 3px
}

.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    opacity: 0;
    width: 148px;
    height: 46px;
    cursor: pointer
}

.custom-file-upload {
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer
}

.faqAccordion .accordion-button::after {
    content: "\f067";
    font-size: 17px;
    font-weight: 500;
    width: 34px;
    height: 34px;
    display: flex;
    background-color: #d8d8d8;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}

.faqAccordion .accordion-button:focus {
    border-color: transparent;
    box-shadow: none
}

.faqAccordion .accordion-item {
    background-color: #fff;
    border: 0 solid rgba(0, 0, 0, .125);
    box-shadow: 0 2px 10px rgb(0 0 0 / 10%);
    border-radius: 10px;
    margin-bottom: 25px;
    overflow: hidden
}

.faqAccordion .accordion-button:not(.collapsed) {
    box-shadow: inset 0 0 0 rgb(0 0 0 / 13%);
    padding-bottom: 5px
}

.faqAccordion .accordion-button {
    font-weight: 800;
    font-size: 18px;
    color: #3a3a3a
}

.faqAccordion p {
    font-weight: 400;
    font-size: 16px;
    color: #354c68;
    margin-bottom: 0
}

.faqAccordion .accordion-body {
    padding: 8px 1.25rem 20px
}

.subscriStatus {
    font-weight: 600;
    font-size: 14px;
    display: inline-block;
    margin-left: 13px;
    color: #aaa
}

.subscriStatus.active {
    color: #2dc61f
}

.subscriPlanDTLList {
    padding: 0;
    margin: 0 0 30px;
    list-style: none
}

.DeliveryDetailsBlock,
.specifications,
.subscriPlanDTL {
    margin-top: 30px
}

.subscriPlanDTLList li {
    font-weight: 400;
    font-size: 20px;
    color: #000;
    margin-bottom: 18px
}

.subscriPlanDTLList .planDataValue {
    font-weight: 600;
    margin-left: 12px
}

.notilistul li {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
    border-radius: 10px;
    margin-bottom: 15px;
    padding: 15px
}

.notiINNrow {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.notiImg {
    margin: 0;
    position: relative
}

.notiStaus {
    background: #f7941d;
    border: 2px solid #fff;
    display: inline-block;
    position: absolute;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    top: 4px;
    right: 13px
}

.notiImg img {
    width: 42px;
    height: 42px;
    min-width: 42px;
    min-height: 42px;
    border-radius: 50%;
    margin-right: 15px;
    object-fit: cover
}

.notiTitle {
    font-weight: 700;
    font-size: 14px;
    color: #3a3a3c
}

.notiDtl {
    font-weight: 400;
    font-size: 12px;
    color: #354c68
}

.notiTime {
    font-weight: 500;
    font-size: 12px;
    color: #3a3a3c;
    margin-left: 10px
}

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

.filterTitle {
    font-weight: 800;
    font-size: 16px;
    color: #464a53
}

.FSinput {
    width: 240px;
    margin-left: 22px
}

.filterSortBx select {
    height: 41px;
    border-radius: 5px;
    background-color: #f3f3f3;
    border: none;
    padding: 3px 15px;
    font-weight: 500;
    font-size: 15px;
    color: #aaa
}

.reportDataCard {
    display: flex;
    align-items: center;
    justify-content: start;
    border-radius: 8px;
    padding: 15px;
    height: 100%
}

.DataCard-value {
    font-weight: 800;
    font-size: 20px;
    color: #fff
}

.DataCard-Title {
    font-weight: 500;
    font-size: 16px;
    color: #fff
}

.reportDataCard:hover {
    opacity: .8
}

.cardBg-green {
    background: #71d875
}

.cardBg-orange {
    background: #ff8423
}

.cardBg-pink {
    background: #ff5274
}

.cardBg-purple {
    background: #d57ff8
}

.cardBg-yellow {
    background: #ffc107
}

.chatUser,
.chatuser {
    background-size: cover;
    background-repeat: no-repeat
}

.reportBox {
    margin: 30px 0 0
}

.chatWrap {
    position: relative;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: 5px;
    overflow: hidden
}

.chatBx-shadow {
    background-color: #fff;
    box-shadow: .5px 3px 10px rgb(119 119 119 / 10%);
    margin: 0 0 20px;
    padding: 0;
    border-radius: 10px;
    height: 100%
}

.chatUser,
.chatuser,
.usermsgCount {
    border-radius: 50%
}

.chatUserLeft-search,
.chatUserLeft-tag,
.deshbord-inn-heading {
    padding: 12px
}

.chatsearch::before {
    content: "\f002";
    top: 10px;
    left: 20px;
    position: absolute;
    font-family: Font-Awesome-5-Pro;
    font-weight: 300;
    font-size: 14px;
    color: #aaa
}

.chatTypebox,
.chatmsg_row .msgBubble,
.chatright_msg {
    position: relative;
    display: flex
}

.chatsearch input {
    padding-left: 45px;
    font-weight: 500;
    font-size: 15px
}

.chatsearch input.form-control::-webkit-input-placeholder {
    color: #aaa
}

.userstaus {
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 16px;
    color: #3a3a3a;
    margin-top: 5px
}

.userstaus.active .statusDot {
    background-color: #27ae60;
    width: 8px;
    height: 8px;
    display: block;
    border-radius: 50%;
    margin-right: 8px
}

.chatleft {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 350px;
    flex: 0 1 350px;
    max-width: 350px;
    width: 100%;
    border-right: 1px solid;
    margin-right: 30px
}

.chatleft_scroll {
    height: 100%;
    max-height: 500px;
    overflow-y: auto
}

.chatleft ul>li>a {
    display: flex;
    place-content: center flex-start;
    align-items: center;
    letter-spacing: normal;
    padding: 12px;
    transition: .5s
}

.chatUser {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    -ms-flex: 0 0 42px;
    overflow: hidden
}

.chatUser_msg {
    flex: 1;
    -ms-flex: 1;
    padding-left: 12px
}

.chatUser_msg h4 {
    font-weight: 700;
    font-size: 14px;
    letter-spacing: -.01em;
    color: #3a3a3c
}

.chatUser_msg h6 {
    font-weight: 500;
    font-size: 12px;
    text-align: right;
    color: #3a3a3c
}

.chatUser_msg p {
    font-weight: 400;
    font-size: 14px;
    letter-spacing: -.01em;
    color: #08080a
}

.usermsgCount {
    width: 17px;
    height: 17px;
    background-color: #f7941d;
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    justify-content: center;
    margin-left: auto
}

.chatright {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 calc(100% - 380px);
    flex: 0 1 calc(100% - 380px);
    max-width: calc(100% - 380px);
    width: 100%;
    height: 500px;
    max-height: 500px
}

.chatright_head {
    padding: 12px;
    border-bottom: 1px solid;
    display: flex;
    align-items: center
}

.chatright_head h4 {
    margin-left: 14px;
    font-weight: 800;
    font-size: 22px;
    color: #3a3a3a
}

.chatright_body {
    flex: 1;
    -ms-flex: 1;
    padding: 20px 15px 0;
    max-height: calc(100% - 134px);
    overflow-y: auto;
    overflow-x: hidden
}

.chatright_msg {
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 0 20px;
    align-items: flex-end;
    text-align: right
}

.myContact .chatmsg_row .msgBubble {
    border-radius: 24px 24px 24px 0
}

.chatmsg_row .msgBubble {
    background: #fef4e8;
    border-radius: 24px 24px 0;
    align-items: center;
    justify-content: center;
    padding: 10px 15px;
    max-width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: #3a3a3a
}

.chatmsg_row span {
    font-size: 12px;
    margin-right: 4px
}

.chatright_msg.myContact {
    align-items: flex-start;
    text-align: left
}

.chatright_msg.myContact .msgBubble {
    background-color: #f3f3f3
}

.chatright_msg .chatmsg_row span {
    margin-right: 10px;
    margin-left: 0;
    font-weight: 500;
    font-size: 12px;
    color: #3a3a3a
}

.chatright_msg.myContact .chatmsg_row span {
    margin-right: 0;
    margin-left: 10px
}

.chatuser {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    -ms-flex: 0 0 42px;
    overflow: hidden;
    margin-right: 10px
}

.chatright_foot {
    padding: 20px 15px;
    display: flex;
    background-color: #fff;
    align-items: center;
    width: 100%;
    box-shadow: 0 -8px 80px rgba(0, 0, 0, .05)
}

.chatTypebox {
    flex-wrap: wrap;
    width: 100%
}

.chatTypebox textarea {
    width: 100%;
    overflow: hidden;
    resize: none;
    border: none;
    background: #f3f3f3;
    border-radius: 23px;
    padding: 5px 60px 5px 23px;
    font-size: 12px;
    outline: 0
}

.chatTypebox .sendmsg,
.uploadfile {
    border: 0;
    background-color: #f7941d
}

.logUserNme,
.user-filterTag a {
    font-size: 14px;
    font-weight: 500
}

.chatTypebox .sendmsg {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    padding: 0;
    line-height: normal;
    font-size: 15px;
    color: #fff;
    width: 28px;
    height: 28px;
    text-align: center;
    border-radius: 50%
}

.form-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px
}

.uploadFileImages label,
.uploadfile,
.user-filterTag {
    margin-right: 15px
}

.chatleft ul>li.active {
    background: #fef4e8
}

.user-filterTag.active a {
    color: #08080a
}

.user-filterTag a {
    color: #bbb5b5
}

.uploadfile {
    padding: 0;
    min-width: 36px;
    width: 36px;
    height: 36px;
    border-radius: 50%
}

.uploadFileImages .uploadIcons {
    border: 0;
    padding: 0;
    width: 46px;
    height: 46px;
    background-color: #f7941d;
    margin-right: 15px;
    display: flex;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.DashcoutTag,
.ceartBtn,
.check-col,
.uploadFileImages label {
    text-align: center
}

.chatright_msg.myContact .chatmsg_row span.uploadTitle {
    font-weight: 500;
    font-size: 11px;
    color: #343434;
    margin-left: auto
}

.chatright_msg.myContact .msgBubble.uploadFileImages {
    background: #fff;
    mix-blend-mode: normal;
    box-shadow: 2px 2px 20px rgba(0, 0, 0, .1);
    border-radius: 32px 32px 32px 0
}

.uploadedImages {
    max-width: 290px
}

.uploadedImages img {
    border-radius: 12px
}

.user_dropdown img,
.user_dropdown svg {
    height: 40px;
    border-radius: 50%;
    width: 40px
}

.uploadedImages.onePlusImg {
    display: flex;
    gap: 20px
}

.uploadedImages.onePlusImg img {
    width: 134px
}

.onePlusImg span {
    position: relative;
    margin-left: 0 !important
}

.chatright_msg .chatmsg_row .onePlusImg .imgPlusCount {
    position: absolute;
    font-weight: 700;
    font-size: 32px;
    color: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.onePlusImg>span:last-child::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #0006;
    left: 0;
    right: 0;
    top: 0;
    position: absolute;
    border-radius: 12px
}

.question_no h3 {
    color: #354c68;
    font-size: 18px;
    font-weight: 400
}

.minQtyDes span,
.question_no h3 span,
table tr th {
    font-weight: 600
}

.Questioncard {
    padding: 30px;
    background-color: #f6f6f6;
    border-radius: 10px;
    margin-top: 15px
}

.Question h4 {
    font-size: 20px;
    font-weight: 700;
    color: #3a3a3a
}

.Question_option ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    align-items: center;
    column-gap: 50px
}

.Question_option {
    padding: 15px 0 0 20px
}

.Question_option .form-check-input {
    background-color: #d9d9d9;
    border-color: #d9d9d9;
    height: 23px;
    width: 23px;
    margin-right: 10px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center
}

.Question_option .form-check-input:focus {
    box-shadow: 0 0 0 .25rem rgb(247 148 29 / 44%)
}

.Question_option .form-check-label {
    font-size: 18px;
    color: #354c68;
    font-weight: 400
}

.topbtn_space {
    padding-top: 20px;
    text-align: right
}

.Question_option .form-check-input:checked[type=radio]::after {
    position: absolute;
    height: 11px;
    width: 11px;
    background-color: #f09323;
    content: "";
    border-radius: 50%;
    background-image: none
}

.user_dropdown img {
    min-width: 40px;
    min-height: 40px
}

.user_dropdown .flag_ico img {
    height: 20px;
    width: 20px;
    min-height: 20px;
    min-width: 20px
}

.logUserNme {
    position: relative;
    color: #151d48;
    padding-right: 20px
}

.logUserNme i {
    position: absolute;
    top: 5px;
    right: 0;
    color: #000;
    font-size: 10px !important
}

.logUserNme span {
    display: block;
    font-weight: 400;
    font-size: 13px;
    color: #737791
}

.user_dropdown>a {
    display: flex;
    align-items: center;
    gap: 14px
}

.user_dropdown>a.userActionBtn {
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: #374557;
    gap: 8px
}

.vendorProfileTab.nav-tabs .nav-link.active {
    background-color: transparent;
    font-weight: 700
}

.vendorProfileTab.nav-tabs li.nav-item {
    width: 25%
}

.vendorProfileTab.nav-tabs.nav-tabs {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
    margin-bottom: 20px
}

.vendorProfileTab.nav-tabs .nav-link {
    font-weight: 500;
    font-size: 20px;
    border: 0;
    color: #13101e;
    width: 100%;
    text-align: left;
    padding-left: 0;
    position: relative
}

.vendorProfileTab.nav-tabs .nav-link.active:after {
    content: "";
    bottom: 0;
    left: 0;
    border-bottom: 3px solid #ff6000;
    display: block;
    position: absolute;
    width: 90%
}

.innerSub_title {
    font-weight: 500;
    font-size: 16px;
    letter-spacing: .01em;
    color: #697687
}



.InnCardTitle {
    font-weight: 700;
    font-size: 20px;
    color: #05004e;
    margin: 0
}

.innCardSubTitle {
    margin-top: 12px;
    display: block;
    font-weight: 500;
    font-size: 16px;
    color: #737791
}

.dataCardsView {
    margin-top: 40px
}

.dashCard {
    margin: 0 0 20px;
    padding: 30px;
    height: 100%;
    background: #fff;
    border: 1px solid #f8f9fa;
    box-shadow: 0 4px 20px rgba(238, 238, 238, .501967);
    border-radius: 10px
}

.cardIcn,
.lightPingBg .cardIcn,
.progressRed .progress-bar {
    background: #ff3232
}

.exportBtn svg {
    margin-right: 7px
}

.exportBtn {
    border: 1px solid #c3d3e2;
    border-radius: 8px;
    padding: 10px 15px;
    font-size: 14px;
    color: #0f3659;
    display: inline-flex;
    align-items: center
}

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

.headerPadding {
    padding: 30px
}

.cardValue {
    font-size: 24px;
    color: #151d48;
    line-height: normal;
    margin: 15px 0 10px
}

.cardTitle {
    font-size: 16px;
    color: #425166;
    margin-bottom: 10px;
    line-height: normal
}

.carddataCount {
    font-size: 12px;
    color: #5a7ef9
}

.cardIcn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}

.lightPingBg {
    background: #ffe2e5
}

.lightYellowBg {
    background: #fff4de
}

.lightBlueBg {
    background: #dcfcfa
}

.lightOrangeBg {
    background: #fff0e8
}

.lightYellowBg .cardIcn,
.progressYellow .progress-bar {
    background: #f7cb50
}

.lightBlueBg .cardIcn,
.progressBlue .progress-bar {
    background: #66c6c2
}

.lightOrangeBg .cardIcn {
    background: #ff6000
}

.dashProProgressBar {
    height: 4px;
    border-bottom: 10px
}

.dataCards {
    border-radius: 16px;
    padding: 20px;
    margin-bottom: 20px;
    display: inline-table;
    width: 100%
}

.progressYellow {
    background: #fff173
}

.progressBlue {
    background: #8cf3fa
}

.progressRed {
    background: #ffa8b8
}

.progressOrange {
    background: #ffd5a4
}

.progressOrange .progress-bar {
    background: #ff8f0d
}

.DashTopProducts th:first-child {
    width: 8%
}

.DashTopProducts th:nth-child(2) {
    width: 52%
}

.DashTopProducts th:nth-child(3) {
    width: 30%
}

.DashTopProducts th:nth-child(4) {
    width: 10%
}

.DashTopProducts td {
    font-weight: 700;
    font-size: 14px;
    color: #444a6d;
    vertical-align: middle
}

.DashcoutTag {
    background: #fffaf4;
    border: 1px solid #f7cb50;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
    color: #f7cb50;
    padding: 4px 10px;
    max-width: 42px
}

.DashTopProducts th {
    font-weight: 400;
    font-size: 13px;
    color: #96a5b8
}

.lang_dropdown .flag_ico {
    margin-right: 5px;
    display: inline-flex
}

.profile_information_banner .form-control[type=password]::-webkit-input-placeholder {
    height: 18px !important
}

.dataTableCardsView {
    padding: 0 24px
}

.offre_listing_section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative
}

.showingTitle {
    display: flex;
    align-items: center;
    margin: 0;
    color: #a4a4a4;
    font-size: 18px;
    font-weight: 500
}

.menuShowing {
    padding-right: 4px
}

.ceartBtn {
    background-color: #ff6000;
    color: #fff;
    font-size: 16px;
    padding: 10px 16px;
    border-radius: 6px;
    text-decoration: none;
    margin-right: 25px;
    margin-bottom: 20px
}

.ceartBtn:hover {
    background-color: #4fd1c5;
    color: #fff
}

.listingCategoryInput .form-control {
    background-color: #eff0f0;
    padding: 12px 10px;
    font-size: 14px
}

.listingCategoryInput .form-select {
    padding: 12px 33px 12px 15px;
    border: 0;
    color: #626262;
    background-color: #eff0f0;
    font-size: 14px
}

.filterCategoryLabel {
    color: #737791;
    align-items: center;
    font-size: 18px
}

.PlatformMarketplace {
    display: flex;
    align-items: center;
    gap: 24px;
    width: 100%
}

.blackFridaySale {
    width: 100%;
    white-space: normal;
    min-width: 180px
}

.list-view .fridaySaleTitle {
    padding-right: 70px
}

.fridaySaleTitle {
    font-size: 16px;
    margin: 0;
    font-weight: 700;
    color: #444a6d
}

.action_radios .form-group label,
.btn-action-filter~.dropdown-menu .dropdown-item,
.tbodyContent,
table tr th {
    font-size: 14px
}

.platformdes,
table tr td {
    color: #697687;
    font-size: 14px
}

.platformdes {
    padding: 0;
    margin: 3px 0 7px;
    font-weight: 500
}

.blackFridayImg img {
    border-radius: 8px;
    width: 96px;
    height: 96px;
    object-fit: cover
}

.tbodyContent {
    color: #697687 !important;
    font-weight: 700
}

.tabelOfferBennar,
table tr th {
    color: #96a5b8
}

.activatCheckBanner {
    display: flex;
    gap: 10px;
    justify-content: center
}

.form-check-input:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0 rgba(13, 110, 253, .25)
}

.listingContainer {
    background-color: #f9fafb !important
}

.tbodyContent {
    background-color: #fff;
    box-shadow: 3px 2px 20px 0 #3333332f
}

tbody,
td,
tfoot,
th,
thead,
tr {
    border: 0
}

.RedemptionCheckBanner {
    display: flex;
    justify-content: space-between;
    margin-right: 15px
}

.listingMenuRedemption i {
    font-size: 25px;
    color: #979797
}

.table-border-spacing {
    border-spacing: 0 15px;
    border-collapse: unset
}

.table-border-spacing .shadow-effect {
    background: #fff;
    border: 1px solid #f8f9fa;
    box-shadow: 0 4px 20px rgba(238, 238, 238, .501967);
    border-radius: 10px
}

table tr th {
    text-transform: uppercase;
    padding: 20px;
    white-space: nowrap
}

.btn-action-filter {
    color: #979797;
    background: 0 0;
    border: 0;
    font-size: 23px
}

.btn-action-filter~.dropdown-menu {
    box-shadow: 0 4px 40px rgba(0, 0, 0, .1);
    border-radius: 10px;
    border: 0
}

.form-check-input:checked {
    background-color: rgba(241, 160, 85, .4);
    border-color: rgba(241, 160, 85, .4)
}

.form-check-input {
    background-color: rgba(85, 112, 241, .12);
    border: 1px solid rgba(85, 112, 241, .12)
}

.form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23FF6000'/%3e%3c/svg%3e")
}

.table-borderless>:not(caption)>*>* {
    border-bottom-width: 0;
    padding: 13px 11px
}

.activatCheckBanner,
.form-check.form-switch {
    cursor: pointer
}

.activatCheckBanner.show .switch-active {
    display: inline-block
}

.menuShowing svg {
    color: #b6b6b6
}

.menuShowing.active svg {
    color: #fff;
    background-color: #ff6000
}

.list-view table .action-col {
    position: absolute;
    top: 12px;
    right: 11px
}

.list-view table tbody {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    gap: 10px
}

.list-view table tbody td,
.list-view table tbody tr {
    display: block;
    border: 0
}

.list-view table tbody td {
    padding: 4px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 20px
}

.list-view table tbody td::before {
    content: attr(data-name);
    width: 117px;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 600;
    text-align: left;
    white-space: normal
}

.list-view table .blackFridayImg img {
    width: 114px;
    height: 114px
}

.list-view table tbody td.select-row {
    position: absolute;
    top: 6px;
    right: 39px;
    z-index: 1;
    width: 24px;
    padding: 0;
    gap: 0
}

tr.shadow-effect .custom_checkbox.position-relative.check-type2 {
    margin-top: 18px
}

.list-view table tbody tr {
    position: relative;
    width: calc(25% - 14px);
    border: 1px solid #e7e7e7;
    padding: 10px;
    background-color: #fff
}

.blackFridayImg,
.videoBlock {
    width: 100%
}

.list-grid-toggle i {
    color: #b6b6b6;
    padding: 4px 5px;
    font-size: 20px
}

.list-grid-toggle i.active {
    background: #ff6000;
    color: #fff
}

.AddNewProductBox .Warehouse_button,
.contactName h4,
.contactName p,
.custom_checkbox.check-type2 input[type=checkbox] {
    margin: 0
}

.check-col {
    width: 30px
}

.listingCategorySelect {
    display: flex;
    align-items: center;
    gap: 22px
}

.dataTableCardsView .Recent_Orders_item:not(:last-child) {
    border-bottom: 2px solid #f1f3f9;
    margin-bottom: 12px
}

.Recent_Orders_item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 14px;
    gap: 20px
}

.product_img img {
    width: 50px;
    height: 50px;
    border-radius: 10px
}

.product_img {
    position: absolute;
    left: 0;
    top: 0
}

.product_detail {
    position: relative;
    padding-left: 70px
}

.product_status_date {
    font-weight: 500;
    font-size: 12px;
    color: #a6a8b1;
    padding-bottom: 5px
}

.productItem_name {
    font-weight: 500;
    font-size: 14px;
    color: #45464e;
    padding-bottom: 5px
}

.productItem_modal {
    font-weight: 500;
    font-size: 14px;
    color: #33343a
}

.product_status_type {
    width: auto;
    padding: 3px 15px;
    border-radius: 14px;
    font-size: 12px;
    font-weight: 400;
    display: inline-block
}

.bg-danger {
    background-color: rgba(245, 126, 119, .12) !important
}

.bg-success {
    background-color: rgba(50, 147, 111, .12) !important
}

.bg-primary {
    background: rgba(64, 117, 255, .16) !important;
    color: #2d9cdb
}

.shipping_about_heading {
    font-weight: 600;
    font-size: 14px;
    color: #000;
    line-height: normal
}

.shipping_about_content {
    font-weight: 500;
    font-size: 14px;
    color: #697687
}

.dash-titles {
    margin: 0 0 30px
}

.dash-h2 {
    font-weight: 400;
    font-size: 26px;
    color: #151d48
}

.subTitles {
    font-weight: 600;
    font-size: 18px;
    color: #05004e;
    margin: 0 0 22px
}

.fileuploader #upload-label {
    border: 1px dashed #5a7ef9;
    background: #eff9ff;
    border-radius: 4px;
    padding: 50px 30px;
    color: #000;
    text-align: center;
    transition: .2s;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -o-transition: .2s;
    -ms-transition: .2s;
    cursor: pointer
}

.fileuploader #upload-label:hover,
.fileuploader.active #upload-label {
    border: 1px dashed #ff6000;
    background: #fff9f5
}

.fileuploader #upload-label:hover span.tittle,
.preview-container #previews .zdrop-delete:hover {
    color: #ff6000
}

.fileuploader #upload-label:hover .material-icons svg path {
    fill: #ff6000
}

.fileuploader #upload-label span.title {
    font-size: 1em;
    font-weight: 700;
    display: block
}

span.tittle {
    position: relative;
    font-size: 14px;
    display: block;
    margin: 11px auto 0;
    color: #5aa3f9
}

.preview-container {
    position: relative;
    bottom: 0;
    width: auto;
    margin: auto;
    top: 10px;
    visibility: hidden
}

.preview-container #previews .zdrop-delete {
    color: #93aac5
}

.valign-wrapper {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.preview-data .preview-item {
    background-color: #fff;
    padding: 10px 15px;
    margin: 10px auto;
    border: 1px dashed #93aac5;
    border-radius: 4px;
    width: 100%;
    justify-content: space-between
}

.preview-container #previews.preview-data .actions a {
    width: 1.5em;
    height: 1.5em;
    line-height: 1
}

.preview-container #previews.preview-data .actions a i {
    font-size: 1em;
    line-height: 1.6
}

.preview-container #previews.preview-data .dz-error-message {
    font-size: 11px;
    margin-top: -12px;
    font-family: Poppins, sans-serif;
    color: #f44336
}

.preview img {
    border-radius: 8px;
    width: 75px;
    height: 75px;
    object-fit: contain;
    object-position: center;
    background-color: #f5f5f5;
    padding: 3px
}

.variantBody .meCard a {
    display: block;
    border: 2px solid transparent;
    border-radius: 5px;
    overflow: hidden
}

.variantBody .meCard a.active {
    border-color: #ff6000
}

.preview-container .progress {
    position: relative;
    height: 6px;
    display: block;
    width: 100%;
    background-color: #c4c4c4;
    border-radius: 32px;
    margin: .5rem 0 1rem;
    overflow: hidden
}

.action_radios .form-group,
.chatMsg p {
    margin-bottom: 8px
}

.preview-container .progress .determinate {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background-color: #66c6c2;
    transition: width .3s linear
}

.zdrop-info {
    display: flex;
    width: 100%;
    gap: 19px;
    padding-right: 6px
}

.dzf-Name {
    font-weight: 600;
    font-size: 13px;
    color: #444a6d
}

.dzf-size {
    display: block;
    font-weight: 400;
    font-size: 12px;
    color: #697687
}

.upload-section {
    margin: 0 0 40px
}

.add-variant-btn {
    color: #ff6000;
    font-size: 24px;
    top: 2px;
    position: relative;
    margin: 0 0 0 10px
}

.productRating {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px
}

.productRating i {
    color: #ffae5d
}

.productInventory {
    display: flex;
    justify-content: center;
    gap: 10px
}

.products_inventory_pen {
    color: #5a7ef9;
    font-size: 16px
}

.products_inventory_plus {
    color: #f7cb50;
    font-size: 16px
}

.products_inventory_delit {
    color: #ff3232;
    font-size: 16px
}

.orderClothing {
    background-color: #f2f2f2;
    color: #697687;
    padding: 8px 15px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 500
}

.menorderClothing {
    margin: 15px 0;
    display: block
}

.orderDateli,
.orderIdli,
.orderNumberli {
    font-size: 16px;
    font-weight: 500;
    color: #45464e #000
}

.MarkAsComplete,
.cancelBtn {
    padding: 10px 20px;
    color: #fff;
    text-align: center
}

.orderDateli span,
.orderIdli span,
.orderNumberli span {
    font-weight: 600;
    color: #8b8d97
}

.OrderNumberDetail {
    display: flex;
    gap: 24px;
    margin-bottom: 20px
}

.OrderNumberDetail i {
    color: #5570f1;
    padding-left: 10px
}

.markDropBtn {
    display: flex;
    justify-content: end;
    gap: 30px
}

.MarkAsComplete {
    position: relative;
    border: 0
}

.MarkAsComplete:hover {
    background-color: #039b56
}

.MarkAsComplete::before {
    position: absolute;
    width: 1px;
    height: 80%;
    background-color: #fff;
    top: 5px;
    right: 2px;
    bottom: 5px;
    content: ""
}

.cancelBtn {
    background-color: #ff3232;
    font-size: 14px;
    font-weight: 500;
    border-radius: 5px;
    cursor: pointer
}

.cancelBtn:hover {
    background-color: #fc6247
}

.offerHeaderTitle {
    color: #000;
    font-weight: 500
}

.offer_check_content {
    display: flex;
    gap: 34px
}

.btn-close {
    width: auto;
    height: auto;
    opacity: 1;
    padding: 0 !important
}

.btn-close:focus {
    outline: 0;
    box-shadow: none;
    opacity: 1
}

.vendor-offer-checkBody {
    gap: 15px
}

.vendor-popup-block {
    padding: 20px 30px
}

.modal-xxl {
    max-width: 85%
}

.productFileImgPopup {
    display: flex;
    justify-content: center
}

.vendor_product_images {
    display: flex;
    text-align: left;
    border: 1px solid #e1e2e9;
    padding: 0;
    max-width: 491px;
    background-color: #f4f5fa;
    width: 100%;
    height: 302px;
    justify-content: center;
    align-items: center
}

.Upload_img_des {
    color: #ff6000;
    padding: 10px 0
}

.vendor_product_images>.label {
    white-space: normal;
    font-weight: 500
}

.modal-header {
    border-bottom: 0
}

.modal-footer {
    border-top: 0
}

.btn-secondary {
    padding: 8px 36px 10px;
    border: 2px solid #ff6000;
    color: #ff6000;
    background-color: #fff;
    border-radius: 6px;
    font-size: 20px
}

select.form-control {
    padding-right: 40px
}

.DashboardProfile .form-control {
    background-color: #f2f3f5
}

.DashboardProfile {
    margin: 0 0 36px
}

.select2.select2-container {
    width: 100% !important
}

.select2.select2-container .select2-selection {
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    height: 34px;
    margin-bottom: 15px;
    outline: 0;
    transition: .15s ease-in-out
}

.select2.select2-container .select2-selection .select2-selection__rendered {
    color: #333;
    line-height: 32px;
    padding-right: 33px
}

.select2.select2-container .select2-selection .select2-selection__arrow {
    background: #f8f8f8;
    border-left: 1px solid #ccc;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;
    height: 32px;
    width: 33px
}

.select2.select2-container.select2-container--open .select2-selection.select2-selection--single {
    background: #f8f8f8
}

.select2.select2-container.select2-container--open .select2-selection.select2-selection--single .select2-selection__arrow {
    -webkit-border-radius: 0 3px 0 0;
    -moz-border-radius: 0 3px 0 0;
    border-radius: 0 3px 0 0
}

.select2.select2-container.select2-container--focus .select2-selection,
.select2.select2-container.select2-container--open .select2-selection.select2-selection--multiple {
    border: 0
}

.select2.select2-container .select2-selection--multiple {
    height: auto;
    min-height: 56px;
    background-color: #f5f6f8;
    font-weight: 500;
    border: 0;
    font-size: 16px;
    border-radius: 6px;
    color: #3a3a3c;
    margin: 0
}

.select2.select2-container .select2-selection--multiple .select2-search--inline .select2-search__field {
    margin-top: 0;
    height: 32px
}

.select2.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: block;
    padding: 11px 18px;
    line-height: 29px
}

.select2.select2-container .select2-selection--multiple .select2-selection__choice {
    background-color: #e9eef2;
    border: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 14px;
    margin: 4px 4px 0 0;
    padding: 1px 6px 8px 26px;
    height: 27px;
    line-height: 25px;
    font-size: 13px;
    position: relative
}

.select2-container--default .select2-selection--multiple .select2-selection__clear {
    font-weight: 700;
    margin-top: -10px;
    margin-right: 0;
    position: absolute
}

.select2.select2-container .select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove {
    position: absolute;
    top: 0;
    left: 0;
    height: 22px;
    width: 22px;
    margin: 0 0 0 5px;
    text-align: center;
    color: #979797;
    font-weight: 700;
    font-size: 16px
}

.select2-container .select2-dropdown {
    background: 0 0;
    border: none;
    margin-top: -5px
}

.select2-container .select2-dropdown .select2-results,
.select2-container .select2-dropdown .select2-search {
    padding: 0
}

.select2-container .select2-dropdown .select2-search input {
    outline: 0;
    border: 1px solid #34495e;
    border-bottom: none;
    padding: 4px 6px
}

.select2-container .select2-dropdown .select2-results ul {
    background: #fff;
    box-shadow: 0 4px 50px rgba(0, 0, 0, .1);
    border-radius: 5px;
    padding: 17px;
    color: #697687
}

.select2-container .select2-dropdown .select2-results ul .select2-results__option--highlighted[aria-selected] {
    background-color: #fff2e8;
    color: #697687
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: transparent
}

.select2-results__option {
    padding-right: 20px;
    vertical-align: middle
}

.btn-danger,
.btn-primary {
    padding: 15px 48px;
    color: #fff
}

.select2-results__option::before {
    content: "";
    display: inline-block;
    position: relative;
    height: 20px;
    width: 20px;
    border: 2px solid #626262;
    border-radius: 2px;
    background-color: #fff;
    margin-right: 20px;
    vertical-align: middle
}

.select2-results__option[aria-selected=true]:before {
    font-family: Font-Awesome-5-Pro;
    content: "\f00c";
    color: #fff;
    background-color: #f60;
    border: 0;
    display: inline-block;
    padding-left: 3px;
    font-size: 14px
}

.CustomersDetails.custom_checkbox label {
    margin-left: 10px
}

.addSpecificationsbtn {
    text-align: end;
    margin-bottom: 10px
}

.PaymentTypeBox,
.contact_Name_icon,
.draftProductButtons {
    display: flex;
    gap: 15px
}

.draftProductButtons .btn-primarys {
    padding: 8px 36px 10px;
    background: #4fd1c5;
    border-radius: 6px;
    color: #fff;
    font-size: 20px;
    border: 2px solid #4fd1c5
}

.draftProductButtons .btn-primarys:hover {
    background: #ff6000;
    border: 1px solid #ff6000
}

.btn-primary {
    background: #f37d28;
    border-radius: 12px;
    font-size: 14px;
    border: 1px solid #e9690d
}

.btn-danger {
    border: 1px solid #dc3545;
    background-color: #dc3545;
    border-radius: 12px;
    font-size: 14px
}

.btn-primary:hover,
.btn-secondary:hover {
    background-color: #fff;
    color: #f37d28;
    border: 1px solid #f37d28
}

.OrderSearchIcon {
    position: absolute;
    top: 15px;
    left: 11px
}

.OrderSearchIcon svg {
    height: 18px
}

.form-control.orderSearchInput {
    padding: 18px 15px 17px 40px
}

.AddNewProductBox {
    display: flex;
    gap: 20px;
    align-items: center
}

.Export_listing_top {
    text-align: end;
    margin-bottom: 20px
}

.ExportBtns {
    border: 1px solid rgba(148, 148, 148, .502);
    padding: 6px 17px;
    border-radius: 50px;
    background: #fff;
    font-size: 16px;
    display: inline-block
}

.MarkCompleteBTn,
.detail_customer_title,
.download_lableFlex,
.emi_value_box,
.modal_btn,
.orderDetailsBlock,
.order_ndi,
.separate_select .form-group {
    display: flex;
    display: flex
}

.ExportBtns:hover {
    border: 1px solid #f60;
    color: #f60
}

.DeliveryDetailsTitle h4,
.contactName h4 {
    color: #8b8d97;
    font-size: 14px
}

@media (max-width:575.98px) {
    .addSpecificationsbtn {
        text-align: left
    }

    .draftProductButtons {
        flex-direction: column
    }

    .draftProductButtons .btn-primarys {
        padding: 10px;
        font-size: 18px
    }
}

.action_radios {
    padding: 0 14px
}

.vendor_product_images .dropzone {
    border: 0;
    background: 0 0;
    padding: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap
}

.offerHeaderTitle {
    font-size: 25px
}

.modal-header {
    align-items: baseline
}

.ProductMetaInpurBlock {
    margin-top: 22px
}

.specifications-row {
    margin-bottom: 25px;
    border-bottom: 1px solid #eee;
    padding-bottom: 19px
}

.specifications-row:last-child {
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0
}

.orderDetailsBlock {
    justify-content: space-between;
    align-items: center
}

.order_ndi {
    gap: 25px;
    align-items: center
}

.orderNumberIn {
    color: #45464e;
    font-size: 16px;
    font-weight: 400
}

.orderNumberIn .ndi_dis {
    color: #8b8d97
}

.orderNumberIn .ndi_dis i {
    color: #5570f1;
    padding-left: 5px
}

.MarkCompleteBTn {
    align-items: center;
    gap: 20px
}

.deleveryPendingBtn .form-group {
    margin-bottom: 0
}

.MarkCompleteBTn .btn-primary {
    padding: 9px 65px 10px 25px;
    background: #219653;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
    border: 0;
    border-left: 1px solid #ffffff60;
    color: #fff
}

.MarkCompleteBTn .btn-primary:hover {
    background-color: #ff6000;
    color: #fff
}

.orderCancelBtn .btn-primary {
    padding: 8px 25px;
    background: #ff3232;
    border-radius: 6px;
    font-size: 16px;
    border: 2px solid #ff3232
}

.orderCancelBtn .btn-primary:hover {
    background-color: #ff6000;
    color: #fff;
    border: 2px solid #ff6000
}

.MarkCompleteBTn .dropdown-toggle::before {
    content: "";
    background-color: #caded2;
    height: 50%;
    position: absolute;
    width: 1px;
    top: 16px;
    bottom: 12px;
    right: 46px
}

.MarkCompleteBTn .dropdown-toggle::after {
    border: 0;
    content: "\f107";
    position: absolute;
    font-size: 20px;
    font-family: Font-Awesome-5-Pro;
    font-weight: 500;
    color: #fff;
    z-index: 3;
    right: 17px;
    top: 16px;
    display: inline-block
}

.deleveryPendingBtn .form-control {
    padding-right: 28px
}

.CustomerDetails {
    margin: 0 0 20px;
    padding: 23px 23px 14px;
    background: #fff;
    border: 1px solid #f8f9fa;
    box-shadow: 0 4px 20px rgba(238, 238, 238, .501967);
    border-radius: 10px;
    height: calc(100% - 20px)
}

.DeliveryDetailsDis {
    color: #45464e;
    font-size: 14px;
    margin: 0
}

.deleveryPendingBtn .bg-danger {
    background-color: #fff2e2 !important;
    color: #1c1d22 !important
}

.deleveryPendingBtn .product_status_type {
    padding: 3px 15px;
    border-radius: 8px
}

.contactName span {
    color: #2c2d33
}

.detail_customer_title {
    justify-content: space-between;
    justify-content: space-between;
    padding-bottom: 15px
}

.DeliveryDetailsbox {
    height: 100%
}

.separate_select .form-group {
    margin: 0;
    justify-content: center
}

.separate_select .form-control {
    padding: 5px 30px 5px 10px;
    border-radius: 14px;
    font-size: 12px;
    margin: 0;
    width: auto;
    background-size: 9px 11px
}

.deleveryPendingBtn .form-control {
    background-color: #fff;
    color: #bec0ca;
    border-radius: .375rem;
    border: none
}

.MarkCompleteBTn .drop-list .btn-group {
    padding: 10px 0
}

.MarkCompleteBTn .product_status_type {
    width: auto;
    padding: 4px;
    border-radius: 14px;
    max-width: 125px;
    display: block;
    text-align: center
}

.col-lg-5.w-38 {
    width:200px
}

.col-lg-7.w-61 {
    width: calc(100% - 201px);
}

.modal_btn {
    flex-direction: column;
    gap: 15px
}

.new-clear.new_btn {
    border-radius: 10px !important;
    box-shadow: none;
    border: 0;
    padding: 7px 30px !important
}

.new-clear.new_btn:hover {
    background-color: #4fd1c5 !important;
    color: #fff
}

.list-view .video_deropIcon {
    color: #fff;
    font-size: 18px
}

.reels_page_header .css-qbdosj-Input {
    grid-area: 1/1/2/1;
    grid-template-columns: unset
}

.Warehouse_button,
.reels_page_header .css-1jqq78o-placeholder {
    white-space: nowrap
}

.OfferDetailsBlock.vendar_orders.list-view table tbody tr {
    width: calc(50% - 14px)
}

.OfferDetailsBlock.vendar_orders.list-view table tbody tr .blackFridayImg {
    width: auto
}

.PaymentTypeBox>* {
    flex: 1 1 50%
}

.emi_value_box {
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 10px
}

.emi_value_box input {
    margin-top: 8px
}

.notiHeader_top .viewOfrBtn {
    padding: 7px 13px;
    border-radius: 3px
}

.search-places-DropDown {
    color: #000;
    box-shadow: rgba(149, 157, 165, .2) 0 8px 24px
}

.search-places-DropDown .autocomDropdown {
    font-size: 14px;
    padding-inline: 16px;
    margin-bottom: 10px;
    padding-bottom: 10px
}

.search-places-DropDown .autocomDropdown:not(:last-child) {
    border-bottom: 1px solid #f1f1f1
}

.nav_right_notification .notiListCard .notiListContent {
    flex: 1;
    max-width: 100%;
    width: 100%;
    padding-left: 0
}

.download_lableFlex {
    align-items: center;
    gap: 20px;
    justify-content: end
}

.listViewCard.list-view table tbody td {
    padding: 6px;
    font-weight: 500
}

.listViewCard.list-view table tbody td::before {
    width: 280px;
    font-weight: 700
}

.chatMsg {
    display: inline-block;
    width: 100%;
    margin-bottom: 20px
}

.chat_rightMsg {
    text-align: end
}

.chat-body {
    height: calc(800px - 75px);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    justify-content: end
}

.chat_messages {
    padding: 10px 10px 0;
    overflow-y: auto
}

.chatMsg p {
    color: #212529;
    font-weight: 400;
    font-size: 16px
}

.chatMsg h4 {
    color: #000;
    font-weight: 600;
    font-size: 17px;
    margin-bottom: 5px
}

.chatMsg span {
    font-size: 14px;
    color: #383838;
    display: block;
    font-weight: 300
}

.chatUpload_icon {
    position: absolute;
    right: 64px;
    top: 18px
}

.send_messsageBtn {
    position: absolute;
    right: 21px;
    border: 0;
    background: 0 0;
    top: 18px
}

.chatFooterBox input.form-control {
    padding-right: 93px
}

.chatMsg_bg {
    width: 100%;
    display: block;
    padding: 9px;
    position: relative;
    border-radius: 10px;
    background: #efefef
}

.chatMsg.chat_rightMsg .chatMsg_bg {
    background: #c7c9d3
}

.tripDltDash .addressNumber {
    display: flex;
    margin-bottom: 15px;
    gap: 20px
}

.AddressDtl.tripDltDash {
    max-width: 100%
}

.AddressDtl.tripDltDash .addressNumber p {
    flex: 0 0 50%;
    margin: 0
}

.tripDltDash .addressNumber span {
    color: #000;
    word-break: break-all;
    font-size: 16px
}

.searchFLexBox {
    display: flex;
    gap: 15px;
    padding-right: 21px;
    align-items: center;
    margin-bottom: 15px
}

.searchFLexBox .form-control.orderSearchInput {
    padding: 13px 15px 13px 40px;
    height: 47px
}

.searchFLexBox .OrderSearchIcon {
    top: 11px
}

.imageUploadBox img {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    object-fit: cover
}

.chatUPloadImage {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
    bottom: 56px;
    background: #fff;
    width: 100%;
    border-radius: 10px 10px 0 0;
    max-height: 120px;
    overflow-y: auto;
    box-shadow: rgba(99, 99, 99, .2) 0 0 8px 0
}

.imageUploadBox {
    position: relative;
    padding: 5px 8px;
    width: 100%
}

.imageChatDelete {
    position: absolute;
    top: -7px;
    right: -7px;
    border: 0;
    background: 0 0
}

.maxHeight0 {
    max-height: 800px;
    overflow-y: auto
}


/*  */
.fill-button {
    background: #f37d28;
    border-radius: 16px;
    font-size: 18px;
    font-weight: 500;
    padding: 21px 51px;
    color: var(--white-color);
    transition: 0.3s;
    border: 1px solid #f37d28
}

.fill-button:hover {
    background: transparent;
    color: #f37d28;
    border: 1px solid #f37d28
}

.delete-button {
    background: transparent;
    border-radius: 16px;
    font-size: 18px;
    font-weight: 500;
    padding: 21px 51px;
    transition: 0.3s;
    color: #FB3748;
    border: 1px solid #FB3748;
}

.delete-button:hover {
    color: #FB3748;
    opacity: .6;
}

.dash_button_box {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 16px;
    margin-top: 16px;
}

.main-dash-block {
    margin-top: 48px;
}

.dashboard .form-group {
    margin-bottom: 16px;
}

.password-padd-icon input {
    padding-right: 50px;
}

/*  */

.address-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    border: 1px solid #eee;
    border-radius: 12px;
    padding: 20px;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    position: relative;
    gap: 16px;
    transition: box-shadow 0.3s ease;
}

.address-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.address-icon span {
    font-size: 40px;
}

.address-content {
    flex-grow: 1;
}

.address-title {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: #333;
}

.address-subtext {
    margin: 4px 0;
    color: #999;
    font-size: 14px;
}

.address-location {
    font-size: 15px;
    font-weight: 500;
    color: #444;
}

.address-actions {
    display: flex;
    flex-direction: row;
    gap: 10px;
}

.action-btn {
    border: none;
    padding: 10px;
    border-radius: 8px;
    cursor: pointer;
}

.delete-btn {
    background-color: #fef2f2;
    color: #dc2626;
}

.edit-btn {
    background-color: #fff7ed;
    color: #ea580c;
}

.action-btn i {
    font-size: 16px;
}

.profile-address-box {
    position: relative;
}

.profile-address-box .edit_title {
    position: absolute;
    top: 32px;
    right: 32px;
}

.add_new_link {
    color: #F37D28;
    font-size: 18px;
    font-weight: 500;
    border: 0;
    background-color: transparent;
}

.add_new_link:hover {
    color: #d16112;
}

/*  */
.notification-list {
    padding: 0;
    list-style: none;
    margin-bottom: 16px;
}

.notification-icon {
    display: flex;
    width: 72px;
    min-width: 72px;
    height: 72px;
    padding: 14px;
    justify-content: center;
    align-items: center;
    border-radius: 16px;
    background: rgba(245, 146, 75, 0.10);
}

.notification-title {
    color: #4A4A4A;
    font-size: 18px;
    font-weight: 500;
    line-height: 27px;
    margin-bottom: 4px;
}

.notification-description {
    color: #A4A4A4;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    margin: 0;
}

.notification-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid #E8E8E8;
}

.noti-content-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: auto;
    gap: 16px;
}

.notification-toggle .form-switch .form-check-input {
    width: 24px;
    margin-left: 0;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23A4A4A4'/%3e%3c/svg%3e");
    background-color: transparent;
    background-size: 9px;
    background-position: left 1px center;
    border: 2px solid #A4A4A4;
    height: 15px;
    cursor: pointer;
}

.notification-toggle .form-switch .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
    background-color: #F37D28;
    background-position: right 1px center;
    border: 2px solid #F37D28;
}

/*  */



.add-filter-box {
    border-radius: 4px;
    border: 1px solid #E8E8E8;
    background: #fff;
    color: #333;
    font-size: 16px;
    font-weight: 400;
    padding: 7px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.add-filter-box:hover {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/*  */
.previous-order-item {
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #E8E8E8;
    padding-bottom: 24px;
    margin-bottom: 18px;
}


.previous-order-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.previous-order-info {
    flex: 1;
}

.previous-order-id {
    margin-bottom: 8px;
    color: #4A4A4A;
    font-size: 18px;
    font-weight: 500;
}

.previous-order-details {
    display: flex;
    flex-direction: column;
    gap: 4px;
}



.order-label-name,
.order-value-name {
    color: #A4A4A4;
    font-size: 16px;
    padding-right: 2px;
    font-weight: 400;
}

.order-value-name {
    color: #4A4A4A;
}

.total-payment-value {
    color: #F37D28;
}

.previous-order-actions {
    display: flex;
    gap: 16px;
    align-items: center;
    padding-top: 30px;
}

.status-badge {
    padding: 12px 16px;
    border-radius: 1000px;
    background: rgba(31, 193, 107, 0.10);
    color: #1FC16B;
    font-size: 16px;
    font-weight: 400;
}

.view-details-btn {
    color: #F37D28;
    font-size: 16px;
    font-weight: 400;
    border: 0;
    background-color: transparent;
    line-height: 24px;
    text-decoration: underline;
    transition: color 0.2s ease;
}

.view-details-btn:hover {
    color: #dd6e1e;
    text-decoration: none;
}

.previous-order-products {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-block: 8px;
}

.product-item-image {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    border: 1px solid #E8E8E8;
    overflow: hidden;
}

.product-item-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 8px;
    transition: all 0.3s ease;
    padding: 5px;
}

.product-item-image:hover img {
    transform: scale(1.06);
}

.products-delivered {
    color: #A4A4A4;
    font-size: 16px;
    font-weight: 400;
}

/*  */




.order-cart-title {
    color: #000;
    font-size: 18px;
    line-height: 27px;
    margin-bottom: 24px;
}

.order-cart-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 12px;
}
.order-cart-item-wrapper{
    border-bottom: 1px solid #e9ecef;
    padding-bottom: 16px;
    margin-bottom: 24px;
}
.order-item-main {
    display: flex;
    align-items: center;
}

.order-cart-item:last-child {
    margin-bottom: 0;
}

.order-cart-container {
    max-height: 500px;
    overflow: auto;
}


.order-item-image {
    margin-bottom: 16px;
    width: 65px;
    min-width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    position: relative;
}

.order-item-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}


.order-item-name {
    color: #4A4A4A;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

.order-item-description {
    font-size: 14px;
    color: #718096;
}


.order-pricing-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px 40px;
}


.order-price-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.order-price-label {
    margin-bottom: 4px;
    color: #A4A4A4;
    font-size: 14px;
    font-weight: 400;
}

.order-price-value {
    font-size: 16px;
    font-weight: 400;
    color: #000;
    white-space: nowrap;
}

.dash-right-filter {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Coupons */
.coupons-off-box {
    border-radius: 16px;
    display: flex;
    align-items: center;
    padding: 20px;
    justify-content: center;
    font-size: 22px;
    font-weight: 700;
    line-height: 33px;
    height: 143px;
    flex: 0 0 187px;
}

.green-coupon {
    color: #546E01;
    background: #CAE8D1;
}

.red-coupon {
    color: #7D105B;
    background: #F1CAC5;
}

.blue-coupon {
    color: #214B7C;
    background: #BCCFE9;
}

.coupons-main-item {
    border-bottom: 1px solid #E8E8E8;
    padding-bottom: 24px;
    margin-bottom: 24px;
    display: flex;
    gap: 32px;
}

.coupons-content h3 {
    color: #4A4A4A;
    font-size: 18px;
    font-weight: 500;
    line-height: 27px;
    margin-bottom: 8px;
}

.coupons-info-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.coupons-content-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: auto;
}

.coupons-item {
    color: #A4A4A4;
    font-size: 16px;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 18px;
}

.coupons-item:last-child {
    padding-bottom: 0;
}

.coupons-show-details {
    display: flex;
    align-items: center;
    gap: 12px;
}

.coupons-show-details button {
    border: 0;
    color: #F37D28;
    padding: 0;
    font-size: 14px;
    background-color: transparent;
}

.couponDetailsDesc p {
    font-size: 16px;
    color: #A4A4A4;
    font-weight: 400;
}

/*  */
.reviews-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #E8E8E8;
}

.reviews-image-box {
    width: 100px;
    height: 100px;
    min-width: 100px;
}

.reviews-image-box img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.reviews-content p {
    color: #4A4A4A;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 10px;
}

.reviews-content h3 {
    color: #000;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 0;
}

.reviews-content-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: auto;
}

.reviews-show-details button {
    border: 0;
    background: transparent;
    color: #F37D28;
    font-size: 18px;
    font-weight: 500;
    padding: 0;
    white-space: nowrap;
}

/*  */

.modal-footer {
    padding-inline: 0;
}

.modal-footer .modal-btn {
    background: var(--primary-color);
    border-radius: 12px;
    font-size: 18px;
    border: 1px solid var(--primary-color);
    font-weight: 500;
    color: var(--white-color);
    padding: 21px 31px;
    margin-inline: 0;
}

.modal-btn:hover {
    background-color: #fff;
    color: #f37d28;
    border: 1px solid #f37d28
}

.filter-drop-profile .dropdown-menu {
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0px 70px 20px 0px rgba(173, 173, 173, 0.00), 0px 45px 18px 0px rgba(173, 173, 173, 0.01), 0px 25px 15px 0px rgba(173, 173, 173, 0.05), 0px 11px 11px 0px rgba(173, 173, 173, 0.09), 0px 3px 6px 0px rgba(173, 173, 173, 0.10);
    border: 0;
    padding: 16px;
    inset: unset !important;
    transform: unset !important;
    right: 0 !important;
}

.filter-drop-profile .form-check-label {
    color: #A4A4A4;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
}

.filter-drop-profile .form-check-input:checked {
    background-color: #F37D28;
    border-color: #F37D28;
}

.filter-drop-profile .form-check-input {
    background-color: transparent;
    border: 2px solid #A4A4A4;
}

.filter-drop-profile .dropdown-menu li .form-check {
    margin-bottom: 12px;
}

.filter-drop-profile .dropdown-menu li:last-child .form-check {
    margin-bottom: 0;
}


/* .trackStatus {
    overflow-x: auto;
    min-height: 170px;
    padding-inline: 20px;
} */


/* Order Track */


.trackMyoder2 {
  width: 100%;
}

.trackMyoder2 .step-1 {
  width: 100%;
}

.trackMyoder2 .orderprogress-bar {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 20px 0;
}



.trackMyoder2 .step::after {
  content: "";
  position: absolute;
  top: 22px; 
  left: 50%; 
  right: -50%;
  height: 2px; 
  background: #e0e0e0;
  z-index: -1;
  transition: width 0.5s ease;
  width: 100%; 
}
.trackMyoder2 .step.active::after {
  background: #F37D28;
}

.trackMyoder2 .step:last-child::after {
 width: 0%; 
}



.trackMyoder2 .step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1;
  position: relative;
  z-index: 3; 
}

.trackMyoder2 .step .fa {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: white;
    border: 2px solid #e0e0e0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    font-size: 15px;
    font-weight: 500;
    color: #e0e0e0;
    transition: all 0.3s ease;
    position: relative;
}



.trackMyoder2 .step.active .fa {
  background: #F37D28;
  border-color: #F37D28;
  color: white;
}

.trackMyoder2 .step.active .fa.opaque {
  opacity: 1;
}

.trackMyoder2 .step-label {
  max-width: 120px;
  font-size: 14px;
  font-weight: 600;
  color: #2c3e50;
  line-height: 1.3;
  padding-inline: 5px;
}

.trackMyoder2 .step-label span {
  display: block;
  font-size: 12px;
  font-weight: 400;
  color: #7f8c8d;
  margin-top: 5px;
  line-height: 1.2;
}

.trackMyoder2 .step-label span span {
  font-size: 11px;
  color: #95a5a6;
  margin-top: 2px;
}

.trackMyoder2 .step .fa:hover {
  transform: scale(1.05);
}

.trackMyoder2 .step.active .fa:hover {
  box-shadow: 0 0 0 8px rgba(255, 107, 53, 0.1);
}

.trackMyoder2 .step.active .fa {
  animation: completedPulse 2s ease-in-out;
}

@keyframes completedPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(255, 107, 53, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 107, 53, 0);
  }
}

@media (max-width: 767.98px) {
.trackMyoder2 .step::after{
    display: none;
}
.trackMyoder2 .step.active::after {
    display: none;
}


  .trackMyoder2 .orderprogress-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px 0;
  }

  .trackMyoder2 .orderprogress-bar::before,
  .trackMyoder2 .orderprogress-bar::after {
    display: none;
  }

  .trackMyoder2 .step {
    flex-direction: row;
    text-align: left;
    align-items: flex-start;
    position: relative;
    padding: 12px 0;
    margin: 0;
  }

 
  .trackMyoder2 .step:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 17px; 
    top: 42px; 
    width: 2px;
    height:100%;
    background: #e0e0e0;
    z-index: 1;
    transition: background 0.3s ease;
  }

 

  .trackMyoder2 .step.active:not(:last-child)::before {
    background: #F37D28;
  }


  .trackMyoder2 .step .fa {
    margin-right: 10px; 
    margin-bottom: 0;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    width: 35px;
    height: 35px;
    font-size: 13px;
}


  .trackMyoder2 .step-label {
    max-width: none;
    flex: 1;
  }

  .trackMyoder2 .step-label span {
    font-size: 13px;
    margin-top: 4px;
  }

  .trackMyoder2 .step-label span span {
    font-size: 12px;
    margin-top: 2px;
  }
}

@media (max-width: 575px) {
  


  .trackMyoder2 .step {
    padding: 10px 0;
  }

 .trackMyoder2 .step .fa {
    width: 30px;
    height: 30px;
    margin-right: 12px;
    font-size: 12px;
}

  .trackMyoder2 .step:not(:last-child)::before {
    left: 14px;
    top: 35px; 
  }

}


/*  */