.dashboard-container[data-v-3c8c34cc] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    
    padding-top: 57px;
    margin-left: 60px;

    width: calc(100% - 60px);
    height: 100vh;
}
.dashboard-titlebar[data-v-3c8c34cc] {
    width: 100%;
    border-bottom: 1px solid #96979b3d;
}
.dashboard-bottom[data-v-3c8c34cc] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    width: 100%;
    height: calc(100vh - 151px);
}
/* dashboard left side  */
.dashboard-left-side[data-v-3c8c34cc] {
    width: 50%;
    height: 100%;
    overflow: auto;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    gap: 18px;
    padding-top: 18px;
    padding-bottom: 18px;
}

/* ------ dashboard left side */

/* dashboard right side  */
.dashboard-right-side[data-v-3c8c34cc] {
    width: 50%;
    height: 100%;
    background-color: #FFFFFF;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    gap: 30px;
    padding: 29px 24px 24px 24px;
}
.right-side-title-container[data-v-3c8c34cc] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2px;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.right-side-title[data-v-3c8c34cc] {
    font-size: 24px;
    font-weight: 500;
    color: #203154;
}
.right-side-sub-title[data-v-3c8c34cc] {
    font-size: 12px;
    font-weight: 500;
    color: #333333DE;
}
.right-side-items-container[data-v-3c8c34cc] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    /* display: flex;
    gap: 12px;
    align-items: flex-start;
    justify-content: flex-start; */
    width: 100%;
    height: auto;

    /* flex-wrap: wrap; */
}

/* ------ dashboard right side */
.date-modal h5[data-v-3c8c34cc] {
    font-size: 24px;
    font-weight: 500;
    color: #515365;
}
.date-modal span[data-v-3c8c34cc] {
    font-size: 14px;
    letter-spacing: 0.24px;
    color: #53606DB3;
}
.date-options-con[data-v-3c8c34cc] {
    border: 1px solid #e8e8e8;
    border-left: none;
    background: #fff;
    padding: 10px;
    gap: 15px;
    font-size: 13px;
}
.date-options[data-v-3c8c34cc] {
    border: 1px solid #e8e8e8;
    border-radius: 0;
    padding: 10px;
    color: #73879c;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-transition: all 0.14s ease-in-out;
    transition: all 0.14s ease-in-out;
}
.date-options:not(.disabled).active[data-v-3c8c34cc] {
    background: #1284e7;
    color: #fff;
}
.date-options[data-v-3c8c34cc]:not(.disabled):not(.active):hover {
    background: rgba(18, 132, 231, 0.1);
    color: #73879c;
}
.date-options.disabled[data-v-3c8c34cc] {
    opacity: 0.5;
    pointer-events: none;
}
.date-custom-header[data-v-3c8c34cc] {
    border: 1px solid #e8e8e8;
    border-bottom: none;
    background: #fff;
    padding: 10px;
    gap: 15px;
    font-size: 13px;
    text-align: right;
}
.date-custom-header .custom-control-label[data-v-3c8c34cc] {
    font-size: 13px;
    color: #73879c;
}

/* Target Date Picker */
/* * >>> .cell.active {
    border-radius: 100%;
    width: 32px !important;
}
* >>> .mx-date-row .cell {
    width: 32px;
} */


#cm-dashboard-change-date-modal .mx-btn.mx-btn-text.mx-btn-shortcut {
    text-align: center;
    width: 100%;
    border: 1px solid;
    margin-bottom: 6px;
}
#cm-dashboard-change-date-modal .mx-datepicker.noYear {
    width: auto !important;
}
#cm-dashboard-change-date-modal .mx-datepicker.noYear .mx-calendar.mx-calendar-panel-year {
    width: 0;
    overflow: hidden;
    padding: 0;
}
#cm-dashboard-change-date-modal .mx-datepicker.noYear .mx-datepicker-sidebar+.mx-datepicker-content {
    border-left: none;
}