//*****************************************************************************
//*****************************************************************************
// Job View Version 1 Styles
//*****************************************************************************
//*****************************************************************************
.job-box {
    //border: 1px solid #ddd;

    .text-h6 {
        display:flex;
        color:#333;

        .section-title {
            //display: block;
            //float: left;
            color: #333 !important;
            border-bottom: none !important;

            &:after{
                content: "";
                display : block;
                background: #78a5dd;
                height: 2px;
                float: left;
                width: 100%;
                clear: both;
                margin-top: 5px;
                margin-left: -2px;
            }
        }
    }

    .job-top {
        border-bottom: 1px solid #ddd;

        .job-add-more {
            max-width: 200px;
        }

        .action-buttons {
            .q-btn {
                margin-bottom: 5px;
            }
            .q-btn-dropdown .q-btn {
                margin-bottom: 0;
            }
            @media (max-width: 480px) {
                margin-top: 10px;
            }
        }
    }

    .job-head {
        background: #f6f6f6;
        border-bottom: 1px solid #ddd;

        > div {
            border-left: 1px solid #ddd;

            span {
                color: #8f979f;
            }

            .job-head-icon {
                font-size: 2.125rem;
                color: #b0b0b0;
            }

            &:nth-child(4) {
                border-right: 1px solid #ddd;
            }
             &:last-child {
                border-right: 1px solid #ddd;
                border-bottom: 0;
            }

            @media (max-width: 991px) {
                &:nth-child(1),
                &:nth-child(2) {
                    border-bottom: 1px solid #ddd;
                }
            }

            @media (min-width: 768px) and (max-width: 991px) {
                &:nth-child(even) {
                    border-right: 1px solid #ddd;
                }
                &:nth-last-child(2),
                &:last-child {
                    border-bottom: 0;
                }
            }

            @media (min-width: 576px) and (max-width: 767px) {
                border-bottom: 1px solid #ddd;
                &:nth-child(even) {
                    border-right: 1px solid #ddd;
                }
                &:nth-last-child(2),
                &:last-child {
                    border-bottom: 0;
                }
            }

            @media (max-width: 575px) {
                & {
                    border-right: 1px solid #ddd;
                }
                &:last-child {
                    border-bottom: 0;
                }
            }

        }

        &.dual {
            @media (min-width: 1200px) {
                border-right: 1px solid #ddd;
            }
        }

        &.tri {
            > div {
                @media (min-width: 768px) and (max-width: 991px) {
                    &:first-child {
                        border-bottom: 0;
                    }
                    &:nth-last-child(2) {
                        border-right: 0;
                    }
                }
                @media (min-width: 576px) and (max-width: 767px) {
                    &:first-child {
                        border-bottom: 0;
                    }
                    &:nth-last-child(2) {
                        border-right: 0;
                    }
                }
            }
        }

        &.quad {
            > div {
                @media (max-width: 575px) {
                    border-bottom: 1px solid #ddd;
                    &:last-child {
                        border-bottom: 0;
                    }
                }
            }
        }
    }

    .job-body {

        padding: 30px 0;

        .job-data {
            padding: 0 10px;

            .job-data-detail {
                margin-bottom: 10px;
                padding-right: 15px;

                @media (max-width: 767px) {
                    padding-right: 0;
                }

                @media (min-width: 768px) {
                    &:nth-child(even) {
                        padding-left: 10px;
                    }
                }

                @media (min-width: 768px) and (max-width: 991px) {
                    &:nth-child(even) {
                        padding-right: 0;
                    }
                }
            }
        }

        .row > span:not(.label),
        .detail-line > span:not(.label) {
            border-bottom: 1px solid #ddd;
            width: 100%;
            padding-bottom: 10px;
            padding-top: 10px;
            color: #8f979f;

            span {
                border-bottom: 0;
            }
        }

        .job_details,
        .score_details {
            background: #f6f6f6;
            border: 1px solid #ddd;

            @media (max-width: 991px) {
                margin-right: 0;
                border-left: 0;
                border-right: 0;
            }

            .section-title {
                width: 100%;
            }
        }

        .job_details {
            .detail-line {
                border-bottom: 1px solid #ddd;

                > span {
                    width: 50%;
                    border-bottom: 0;

                    .label {
                        color: white;
                        padding: 3px 5px;
                    }
                }
            }
        }

        .score_details {
            span {
                width: 50%;
            }

            span,
            .score_desc {
                border-bottom: 1px solid #ddd;
                padding-bottom: 10px;
                padding-top: 10px;
                color: #8f979f;
            }

            .score_desc {
                clear: both;
                padding-bottom: 0px !important;
            }

            .score_desc_line {
                padding-top: 0px !important;
                margin-top: -2px;
                display: block;
            }

            div {
                //width: 100%;
            }
        }
    }

    .job-sub-modules {
        margin: 20px 10px;
    }

    .job-change-history {
        .q-table__container {
            margin-bottom: 20px;
        }
    }
}
.job-list-v3 {
    .q-drawer{
        .q-timeline {
            &__entry {
                &:first-child {
                    .q-timeline__title {
                        border-bottom: 1px solid #ccc;
                        padding-bottom: 20px;
                        margin-bottom: 0px;
                    }
                }
            }
            &__content {
                padding-bottom: 10px;
            }
            &__dot{
                bottom: -10px;
            }
        }
    }
}