.com-view {
    height: 88vh;
    width: 100%;
    position: relative;
}

/**
    HEADER SECTION
**/

.com-view__header {
    display: flex;
    justify-content: flex-start;
    max-height: 45px;
    flex-direction: row;
    margin: 4px;
}

.row-reverse-ar {
    flex-direction: row-reverse;
}

.direction-ar {
    direction: rtl;
}

.com-view_header_data_sources_filters {
    /*background-color: palevioletred;*/
    display: flex;
    max-width: 30vw;
}

.com-view__header-select {
    width: 10vw;
    margin: 5px;
}

.com-view__header-select-large {
    width: 18vw;
    margin: 5px;
}

.com-view__header-title-component {
    flex: 1;
    /*background-color: red;*/
}

.com-view__header-title-component-metric-name {
    margin: auto;
    color: white;
    align-self: center;
    text-align: center;
    font-size: 18px;
    font-family: 'Open Sans';
    display: block;
}

.com-view__header-reset-component {
    /*background-color: yellow;*/
    display: flex;
}

.label-description {
    color: white;
    padding: 2px;
    margin-top: 2px;
    margin-right: 2px;
}

.btn-email {
    background-color: white;
    color: rgb(51,122,183);
    font-family: Montserrat;
    width: 6vw;
    height: 3vh;
    right: 1vw;
    padding: 0;
}

.btn-image {
    background-color: transparent;
    border: none;
}

    .btn-image img {
        width: 30px;
        height: 30px;
    }

/**
    CHART SECTION
**/

.com-view__chart {
    width: 92vw;
    height: 50vh;
    display: flex;
    align-content: center;
    flex-direction: column;
    flex-basis: auto;
}

.com-view__chart-graph {
    height: 50vh;
}

.com-view__chart-status_filters {
    display: flex;
    margin: auto;
    justify-content: space-evenly;
    align-items: center;
    color: white;
    align-content: center;
    width: 40vw;
}

.filter {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    padding: 5px;
    color: white;
}

.filter-description {
    display: flex;
    margin-top: 5px;
    font-size: 12px;
    font-family: 'Open Sans';
}

.filter-selected {
    background-color: #3D77AE;
    border-radius: 15px;
    opacity: 1;
}

.services-counter {
    border-radius: 10px;
    color: white;
    margin-left: 5px;
    margin-right: 5px;
    background-color: #3167A0;
    width: 40px;
    text-align: center;    
}

.small-box {
    width: 20px;
    height: 20px;
    margin: 3px;
}

.on-time-color {
    background-color: #13B74D;
}

.delayed-color {
    background-color: #F79425;
}

.not-submitted-color {
    background-color: #D51624;
}

.alert-color {
    background-color: #FFC400;
}

.neutral-color {
    background-color: #999999;
}

.com-view__chart {
    width: 92vw;
    height: 50vh;
}

.content-compliance-title {
    display: flex;
    margin: auto;
    color: white;       
    align-self: center;
    text-align: center;
    font-size: 18px;
    font-family: 'Open Sans';
    display: block;
    text-transform: uppercase;
    padding: 5px;
}

.monitor-table-arabic-ar {
    direction: rtl;
}

.text-position-ar {
    text-align: right !important;
}

.flex-table-text-float-ar {
    float: right;
}

.com-raw-message-section {
    display: flex;
    margin: auto;
    justify-content: center;
    align-items: center;
    width: inherit;
}

.com-raw-message-section-ar {
    direction: rtl;
}