:root {
    --primary-color: #2F2158!important;
    --secondary-color: #67E09C!important;
}

body {
    font-family: 'Sora', sans-serif!important;
    background-color: #F6F6F9;
    color: #2F2158;
}

p {
    color: #81789B;
}

a {
    text-decoration: none!important;
    color: #008753!important;
}


/*.navbar-dark{*/


/*background: var(--primary-color)!important;*/


/*}*/

.nav-link {
    font-size: 16px!important;
    color: #fff!important;
}


/*.nav-link svg{*/


/*margin-right: 8px!important;*/


/*}*/


/*.nav-link.active{*/


/*color: #67E09C!important;*/


/*border-bottom: 3px solid #67E09C!important;*/


/*padding-bottom: 10px!important;*/


/*}*/


/*.nav-link.active svg path{*/


/*fill: #67E09C!important;*/


/*}*/

.auth-aside {
    height: 100vh;
}


/*.btn-primary {*/


/*background: var(--secondary-color)!important;*/


/*border-color: var(--secondary-color)!important;*/


/*color: #2F2158!important;*/


/*}*/


/*.btn-outline-primary {*/


/*background: transparent!important;*/


/*border-color: var(--secondary-color)!important;*/


/*color: #fff!important;*/


/*}*/


/*.btn-dark{*/


/*background: #2F2158;*/


/*border-color: #2F2158;*/

/*}*/

.carousel h1 {
    font-weight: 600!important;
    font-size: 45px;
    line-height: 57px;
    color: #FFFFFF;
}

.carousel p {
    font-weight: 400;
    font-size: 16px;
    line-height: 140%;
    color: #DCD8E6;
}

.welcome {
    font-weight: 400;
    font-size: 26px;
    line-height: 34px;
    color: #797979;
}

.welcome h5 {
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #008753;
}

.components p {
    color: #303030!important;
    font-size: 36px;
}

.home-cta {
    background: #FFFFFF;
    box-shadow: 0px 4px 40px -2px rgba(0, 0, 0, 0.1);
}

.home-cta h3 {
    font-weight: 400;
    font-size: 24px;
    line-height: 30px;
    color: #3E3E3E;
}

.home-cta p {
    font-weight: 400;
    font-size: 16px;
    line-height: 25px;
    color: #3E3E3E;
}

.home-contact h3 {
    font-weight: 400;
    font-size: 24px;
    line-height: 26px;
    color: #575757;
}

.home-contact p {
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #797979;
}

.blog-item p {
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    color: #3E3E3E;
    margin-bottom: 6px;
}

.blog-item span {
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    color: #575757;
    margin-top: 5px!important;
}

.blog-item a {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: #008753;
    text-decoration: none;
}

.footer a {
    font-weight: 600;
    font-size: 20px;
    line-height: 25px;
    text-decoration: none!important;
    color: #FFFFFF!important;
}

.auth h4 {
    font-weight: 400;
    font-size: 30px;
    line-height: 38px;
    color: #252525;
    margin-bottom: 2px;
}

.auth span {
    font-weight: 300;
    font-size: 18px;
    line-height: 28px;
    color: #797979;
}

label {
    font-weight: 500;
    font-size: 14px;
    line-height: 14px;
    color: #81789B;
}

.form-label {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: rgba(29, 36, 51, 0.8);
}

.form-control {
    border: 1px solid #CBCBCB!important;
    border-radius: 4px!important;
    height: 56px!important;
    /*background: transparent!important;*/
}

.form-select {
    border: 1px solid #CBCBCB!important;
    border-radius: 4px!important;
    /*background: #FFFFFF!important;*/
    padding: 8px 14px!important;
    height: 56px;
}

.form-group {
    margin-bottom: 15px!important;
}

.btn-block {
    width: 100%;
}

.card {
    border: 1px solid #E1E6EF!important;
    border-radius: 12px!important;
}

.filter-toggle {
    display: flex;
    justify-content: space-around;
    align-items: center;
    background-color: var(--primary-color);
    border-radius: 30px;
    padding: 10px 15px;
    color: #fff;
    cursor: pointer;
    width: 129px;
}

.filter-toggle:hover {
    background-color: #1F51E5;
}

.filter-toggle.clear {
    background-color: #ef5350;
}

.filter-toggle.clear:hover {
    background-color: #ed3c39;
}

.flex-start {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

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

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

.flex-end {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.error-display {
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    background: #FEF1F2;
    border-radius: 4px;
    color: #1D2433;
    padding: 8px 12px;
    display: flex;
    justify-content: flex-start;
}

.badge {
    font-weight: 400!important;
    font-size: 12px!important;
    line-height: 14px!important;
    border-radius: 100px!important;
    padding: 5px 12px!important;
}

.badge-active {
    color: #08875D !important;
    background: #EDFDF8;
}

.badge-pending {
    color: #B35E09 !important;
    background: #FFF8EB;
}

.badge-inactive {
    color: #ef5350 !important;
    background: #FEF1F2;
}

.modal-header>button {
    border: 1px solid #E1E6EF;
    border-radius: 8px;
    padding: 14px!important;
    font-size: 12px!important;
}

.modal-header>h5 {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
}

.profilePhoto {
    height: 35px;
    width: 35px;
    border-radius: 50px;
    margin-right: 8px;
}

.tab-card {
    background: #FFFFFF;
    border-radius: 8px;
}

.tab-nav-wrap {
    border-bottom: 2px solid #F6F6F9;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    overflow-y: auto;
    cursor: pointer;
}

.tab-nav-wrap a {
    text-wrap: none!important;
    white-space: nowrap!important;
}

.tab-nav {
    padding: 15px 18px;
    color: rgba(29, 36, 51, 0.8);
    text-decoration: none!important;
}

.tab-nav.active {
    background: #F6FBF8;
    color: #2F2158;
    border-bottom: 2px solid #67E09C;
}

.tab-body {
    padding: 10px;
    display: none;
}

.tab-body.active {
    display: block;
}

.sub-card h4 {
    font-weight: 700;
    font-size: 19px;
    line-height: 24px;
    color: #2F2158;
}

.btn-default {
    background: #FFFFFF!important;
    border-radius: 4px;
    color: #575757;
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
}

.btn-outline-default {
    background: transparent;
    border-radius: 4px;
    color: #FFFFFF!important;
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    border: 1px solid #fff!important;
}


/* File Upload CSS */

.file-area {
    width: 100%;
    position: relative;
    font-size: 14px;
}

.file-area input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
}

.file-area .file-dummy {
    width: 100%;
    padding: 15px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px dashed #c8d2df;
    border-radius: 5px;
    /* text-align: center; */
    transition: background 0.3s ease-in-out;
}

.file-area .file-dummy .success {
    display: none;
}

.file-area:hover .file-dummy {
    background: rgba(255, 255, 255, 0.1);
}

.file-area input[type="file"]:focus+.file-dummy {
    outline: 2px solid rgba(255, 255, 255, 0.5);
    outline: -webkit-focus-ring-color auto 5px;
}

.file-area input[type="file"]:valid+.file-dummy {
    border-color: #6eb4e0;
    background-color: #ebf8fe;
}

.file-area input[type="file"]:valid+.file-dummy .success {
    display: inline-block;
}

.file-area input[type="file"]:valid+.file-dummy .default {
    display: none;
}

@media only screen and (max-width: 568px) {
    .step-wrapper {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        flex-direction: column;
    }
    .step-item {
        margin-bottom: 8px;
    }
    .step-line {
        display: none;
    }
    .date-item {
        font-size: 11px!important;
        padding: 6px 9px!important;
    }
    .date-item.active {
        background-color: #67E09C;
        border-radius: 15px;
        font-size: 12px;
        padding: 6px 9px;
    }
    .expert-name {
        flex-grow: 2;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .category-pane {
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 12px;
        overflow: auto;
        padding: 0px 10px!important;
    }
    .category-item:hover {
        border-right: none!important;
    }
    .category-item.active {
        background: #F6FBF8;
        border: none;
        border-bottom: 3px solid #67E09C;
        color: #2F2158!important;
    }
    .category-item {
        padding: 7px!important;
    }
    .category-item span {
        font-size: 12px!important;
    }
    .no-padding-sm {
        padding: 0px!important;
    }
    .header {
        margin-top: 40px;
    }
    .carousel h1 {
        font-weight: 600!important;
        font-size: 25px;
        line-height: 37px;
        color: #FFFFFF;
    }
    .btn-default {
        background: #FFFFFF;
        border-radius: 4px;
        color: #575757;
        font-weight: 400;
        font-size: 10px;
        line-height: 15px;
    }
    .btn-outline-default {
        background: transparent;
        border-radius: 4px;
        color: #FFFFFF;
        font-weight: 400;
        font-size: 10px;
        line-height: 15px;
        border: 1px solid #fff!important;
    }
    .carousel-item img {
        height: 350px!important;
    }
    .navbar-collapse {
        background-color: #000!important;
    }
    .components p {
        color: #303030!important;
        font-size: 22px;
    }
    .footer a {
        font-weight: 400;
        font-size: 15px;
        line-height: 25px;
        text-decoration: none!important;
        color: #FFFFFF!important;
    }
    .footer-logo {
        text-align: center
    }
}