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

    .dashboard_top_info{
        font-size: 14px;
    
        span{
            font-size: 14px;
        }
    }

    .dashboard_top_filters{
        display: flex;
        align-items: center;

        .filter_setting{
            margin-left: 16px;
            font-size: 14px;

            select.dropdown{
                width: auto;
                margin: 0 0 0 8px;
            }

            .filter_time_profile{
                cursor: pointer;

                padding: 4px 16px;

                font-size: 14px;
                line-height: 18px;

                border: 1px solid $gray;
                border-radius: 2px;

                transition: 0.2s;

                .faicon{
                    margin-right: 8px;
                    color: $blue;
                }

                &:hover{
                    background-color: $light-gray;
                }
            }
        }
    }
}


.dashboard_boxes{
    display: flex;
    flex-wrap: wrap;
    box-sizing: border-box;

    margin-top: 32px;

    .dashboard_box{
        position: relative;
        box-sizing: border-box;
        width: 430px;
        max-width: 100%;

        padding: 32px 16px;
        margin: 0 32px 32px 0;

        font-size: 14px;

        border: 1px $gray solid;

        &:nth-child(3),
        &:nth-child(6){
            margin-right: 0;
        }

        .box_title{
            position: absolute;
            top: -10px;
            left: 16px;

            padding: 0 16px;

            font-size: 14px;
            font-weight: bold;
            color: $blue;
            text-transform: uppercase;
            line-height: 18px;

            background-color: $white;
        }

        .box_top_settings{
            display: flex;
            align-items: center;

            margin-bottom: 8px;

            span,
            label{
                font-size: 14px;
            }

            select.dropdown{
                width: auto;
                margin: 0 0 0 8px;
            }
        }

        table{
            width: 100%;
            margin: 0 0 16px 0;

            &:last-of-type{
                margin-bottom: 0;
            }

            tr{
                height: auto;

                &.row1{

                    td{
                        padding: 8px 16px 8px 8px;

                        font-weight: 600;

                        background-color: $light-gray;
                    }
                }
                
                &.row_sum{
                    td{
                        font-weight: 600;
                    }
                }

                td{
                    padding: 4px 16px 4px 8px;

                    font-size: 14px;

                    border-top: 1px $gray solid;
                    border-bottom: 1px $gray solid;

                    strong{
                        font-weight: 600;
                    }

                    span{
                        font-size: 14px;
                    }

                    .graph_db {
                        float: left; 
                        height: 16px;
                        margin-top: 1px;

                        background-color: $blue;
                    }
                    .graph_text {
                        margin-left: 8px;
                        font-size: 14px;
                    }
                }
            }
        }

        // Box 1
        &#div_statistic_info{

            table tr td{
                padding: 0 0 8px 0;
                border: 0;

                &:first-child{
                    width: 100px;
                    font-weight: 600;
                }

                &:nth-child(2){
                    max-width: 290px;
                    overflow: hidden;
                }

                &:nth-child(3){
                    font-weight: 600;
                }
            }
        }

        // Box 2
        &#div_statistic_status{

            table tr{

                td{

                    &:first-child{
                        padding-left: 16px;
                    }
    
                    &:nth-child(2),
                    &:nth-child(3){   
                        text-align: right;
                    }
                }

                &.row1{

                    td:first-child{
                        padding-left: 8px;
                    }
                }
            }
        }

        // Box 3
        &#div_statistic_answer_state{

            table tr td{

                &:nth-child(2),
                &:nth-child(3){
                    width: 80px;
                    text-align: right;
                }
            }
        }

        // Box 4
        &#div_statistic_referals{

            table tr td{

                &:first-child{
                    width: 140px;
                }

                &:nth-child(2){
                    max-width: 290px;
                    overflow: hidden;
                }
            }

            #referal_detail{
                display: flex;
                flex-direction: column;

                margin-top: 16px;

                span{
                    margin-bottom: 8px;

                    &.dashboard_title{
                        font-weight: 600;
                    }

                    font-size: 14px;

                    a{
                        text-decoration: none;
                    }
                }

                table{
                    margin-bottom: 16px;

                    tr{

                        td{

                            &:first-child{
                                width: 90px;
                            }
                        }
                    }
                }
            }
        }

        // Box 5
        &#div_statistic_visit{

            .box_top_settings{

                >div{
                    select.dropdown{
                        width: 130px;
                    }
                }

                &:nth-child(3){
                    justify-content: space-between;
                }
            }

            table tr td{

                &:first-child{
                    width: 140px;
                }
            }
        }

        // Box 6
        &#div_statistic_pages_state{

            table tr td{

                &:first-child{
                    width: 140px;
                }
            }
        }
    }
}


.survey_referals_tbl {
	width: 100%;
	border-spacing: 0px;
	padding: 0px;
	margin: 0px;
	border-collapse: collapse;
	margin-top: 8px;
	td {
		padding: 3px 0px;
	}
	th {
		text-align: left;
		white-space: nowrap;
		font-weight: normal;
		padding-right: 5px;
	}
}
#div_statistic_float_div {
	position: fixed;
	width: 620px;
	max-height: 600px;
	z-index: 90;
	padding: 10px;
	border: 1px solid $red;
	background-color: white;
	margin: auto auto;
	.list {
		margin-left: 20px;
		padding-top: 3px;
	}
}






.dashboard_status_span {
	display: inline-block;
	width: 200px;
	padding: 2px 0px;
}
#div_statistic_status {
	span {
		display: inline-block;
		padding: 2px 0px;
	}
}
.opt_bold {
	font-weight: 600;
}