


.service-desk__wrapper {
    .service-desk-content__wrapper {
        padding:12px;
        .add__new-request--grid {
            text-align: right;
            padding: 12px 12px 5px;
            margin-bottom: 5px;
        }
        .add__new-request--grid__wrapper {
            padding:  5px 12px 12px;
            .fig_basic_grid-wrapper {
                .tableColumn {
                    padding: 3px 0 3px 7px;
                    .flexbox();
                    .flex-align-items(center);
                    &.fig-ticketkey {
                        flex: 0 0 100px;
                    }
                    &.fig-action {
                        flex: 0 0 130px;
                    }
                    &.fig-status {
                        flex: 0 0 130px;
                        &.status-chip {
                            span {
                                display: inline-block;
                                text-align: center;
                                padding:0px 10px ;
                                background-color: #e0e0e0;
                                margin: 2px 4px;
                                border-radius: 16px;
                                height: 20px;
                                font-size: 0.75rem;
                                font-weight: 500;
                                line-height: 20px;
                                &.blue-gray {
                                    color: #F76161;
                                    background-color: #FFD7D1;
                                }
                                &.medium-gray, &.yellow {
                                    color: #F78A1C;
                                    background-color: rgb(252, 225, 198);
                                }
                                &.green {
                                    color: #6ABC6A;
                                    background-color: #C9EBCD;
                                }
                            }
                        }
                    }
                    &.fig-requesttype{
                        flex: 0 0 135px;
                    }
                    &.fig-requestsubtype{
                        flex: 0 0 135px;
                    }
                    &.fig-description{
                        flex: 0 0 calc(50% - 320px);
                        max-width:calc(50% - 320px) ;
                        
                       @media @minimal-desktop-and-below  {
                            flex-basis: calc(100% - 270px);
                            max-width: calc(100% - 270px);
                            padding: 5px 0 5px 5px;
                       }
                       @media @mobile {
                        flex:0 0 100%;
                        max-width: 100%;
                        padding: 5px 0 5px 5px;
                    }
                    }
                    &.fig-summary {
                        font-weight: 500;
                        flex: 0 0 calc(50% - 320px);
                        max-width:calc(50% - 320px) ;
                        
                        @media @minimal-desktop-and-below  {
                                flex-basis: calc(100% - 370px);
                                max-width: calc(100% - 370px);
                                padding: 5px 0 5px 5px;
                        }
                        @media @mobile {
                            flex:0 0 100%;
                            max-width: 100%;
                            padding: 5px 0 5px 5px;
                        }
                    }
                }
                .fig_basic_grid-header {
                    //padding: 7px 0;
                    .tableColumn {
                        color: #575962;
                        font-size: .875rem;
                        &.fig-action {
                            padding-left:10px;
                        }
                    }
                }
                .tableRow.dataTable__row{
                    min-height: 40px;
                    .tableColumn {
                        &.fig-ticketkey {
                            color:@gray-light;
                        }
                        &.fig-requesttype{
                            color: @brand-primary;
                        }
                        &.fig-requestsubtype{
                            flex: 0 0 135px;
                        }
                        &.fig-description{
                            flex: 0 0 calc(50% - 320px);
                            max-width:calc(50% - 320px) ;
                            white-space: pre-wrap;
                            word-break: break-all;
                            word-break: break-word;
                            padding-left: 0px;
                            
                           @media @minimal-desktop-and-below  {
                                flex-basis: calc(100% - 270px);
                                max-width: calc(100% - 270px);
                                padding: 5px 0 5px 5px;
                           }
                           @media @mobile {
                            flex:0 0 100%;
                            max-width: 100%;
                            padding: 5px 0 5px 5px;
                        }
                        }
                        &.fig-summary {
                            font-weight: 500;
                            flex: 0 0 calc(50% - 320px);
                            max-width:calc(50% - 320px) ;
                            white-space: normal;
                            word-break: break-all;
                            word-break: break-word;
                            
                            @media @minimal-desktop-and-below  {
                                    flex-basis: calc(100% - 370px);
                                    max-width: calc(100% - 370px);
                                    padding: 5px 0 5px 5px;
                            }
                            @media @mobile {
                                flex:0 0 100%;
                                max-width: 100%;
                                padding: 5px 0 5px 5px;
                            }
                        }
                        &.fig-action {
                            button {
                                color:@gray-light;
                                &:hover {
                                    color:@gray;
                                }
                            }
                        }
                    }
                }
                .total-records-content__row {
                    display: none;
                }
            }
        }
    }
    &.ticket-detail_page {
        .page-title__container {
            .go-back--link {
                font-size: 30px;
                margin-right: 10px;
                color: @gray-darker;
                &:hover {
                    color: @gray-base;
                }
            }
        }
        .Status-text__container {
            .status-title {
                color: #939393;
            }
            span.status-chip {
                display: inline-block;
                text-align: center;
                padding:0px 10px ;
                background-color: #e0e0e0;
                margin: 2px;
                border-radius: 16px;
                height: 22px;
                font-weight: 500;
                font-size: 0.75rem;
                &.blue-gray {
                    color: #F76161;
                    background-color: #FFD7D1;
                }
                &.medium-gray, &.yellow {
                    color: #F78A1C;
                    background-color: rgb(252, 225, 198);
                }
                &.green {
                    color: #6ABC6A;
                    background-color: #C9EBCD;
                }
            }
        }
        .ticket-header-content__wrapper {
            padding: 5px 12px 12px;
            .Summary-text__container{
                p {
                    white-space: normal;
                    word-break: break-word;
                }
            }
            .Description-text__container{
                p{
                    white-space: normal;
                    word-break: break-word;
                }
            }
        }
        .ticket-main-content__wrapper{
            padding: 12px;
            border-top: 1px solid @border-color;
            .comments__container {
                p {
                    white-space: normal;
                    word-break: break-word;
                }
            }
            .ticket-comment-section__row{
                display: flex;
                flex-direction: row;
                .text-comment__container{
                    // flex: 0 0 94%;
                    flex: 0 0 calc(100% - 80px);

                }
                .action-button__container{
                    display: flex;
                    align-items: center;
                    margin: 5px 0 5px 15px;
                    width: 65px;
                    
                }
                .action-button__container button {
                    color: @accent-white;
                    background-color: @brand-primary;
                    height: 35px;
                    margin-top: 20px;
                }
            }
        }
        /* .action-button__container {
            text-align: right;
            button{
                margin: 5px 0 5px 10px;
            }
        }
        .action-button__container {
            text-align: right;
            button{
                margin: 5px 0 5px 10px;
            }
        } */
        .service-desk--comment__list{
            .flexbox();
            padding: 11px 0;
            .service-desk--comment__left {
                .flexbox();
                .avatar__wrapper {
                    color: @gray-base;
                    background-color: #CFCFCF;
                    margin: 0 20px 10px 0;
                }
                .service-desk--comment__baloon {
                    //flex: 0 0 calc(100% - 60px);
                    padding: 15px;
                    margin:0 0 5px;
                    background-color:@tag-bg-base ;
                    border-radius: 0 12px 12px 12px;
                    flex-grow: 0;
                    flex-basis: auto;
                    .service-desk--comment-body__left{
                        text-align: left;
                    }
                }
            }
            .service-desk--comment-timestamp__left {
                margin: 0 0 0 60px;
                text-align: left;
                color: #CFCFCF;
                font-size: 12px;
            }
            .service-desk--comment__right {
                .flexbox();
                .flexbox-direction(row-reverse);
                .avatar__wrapper {
                    margin: 0 0px 10px 20px;
                }
                .service-desk--comment__baloon {
                   //flex: 0 0 calc(100% - 60px);
                    padding: 15px;
                    margin:0 0 5px;
                    background-color:@brand-primary;
                    border-radius: 12px 0 12px 12px;
                    flex-grow: 0;
                    flex-basis: auto;
                    .service-desk--comment-body__right{
                        text-align: right;
                        color: @accent-white;
                    }
                }
            }
            .service-desk--comment-timestamp__right {
                margin: 0 60px 0 0;
                text-align: right;
                color: #CFCFCF;
                font-size: 12px;
            }
        }
    }
}

.service-desk__dialog {
    div[role="document"]{
        > div {
            width: 100%;
            .service-desk__dialog-content__row {
                overflow-y: auto;
            }
        }
    }
    .service-desk__dialog-title {
        padding: 15px 24px;
        .service-desk__dialog-heading{
            float: right;
            .dialog-content__label {
                color: #848484;
                font-size: 0.9rem;
                .dialog-content__mandatory{
                    color: red;
                }
            }
        }
    }
    .service-desk__dialog-content {
        padding-top: 15px;
        padding-bottom: 0;
        padding-left: 32px;
        padding-right: 32px; 
        .service-desk-grid_content {
            .service-desk-grid_request-type {
                display: flex;
                width: 100%;
            }
            form.rjsf{
                .field-object {
                    #root__description {
                        padding: 10px;
                        background-color: @tag-bg-warning;
                        color: #ff6262;
                        text-align: center;
                        margin: 0 0 25px;
                        border-radius: 3px;
                        >div{
                            >svg {
                                margin-right: 10px;
                                color: red;
                            }
                        }
                    }
                    .form-group{
                        &.field-string {
                            .flexbox();
                            flex-direction: column;
                            padding: 0 0 10px;
                            margin:0 0 10px;
                            label.control-label {
                                .flexbox();
                                .flex-align-items(center);
                                // flex: 0 0 150px;
                                .required {
                                    color: red;
                                    padding-left: 2px;
                                }
                            }
                            div{
                                width: 100%;
                                margin: 0;
                                padding-right: 0;
                                &:empty{
                                    display: none;
                                }
                                > label {
                                    display: none;
                                }
                            }
                            textarea {
                                font-family: @main-font;
                                width: 100%;
                                margin: 0;
                                border-width: 0;
                                color: rgba(0, 0, 0, 0.87);
                                cursor: text;
                                font-size: 1rem;
                                line-height: 1.1875em;
                                transition: rgba(0, 0, 0, 0.42) 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
                                border-bottom: 1px solid rgba(0, 0, 0, 0.42);
                                position: relative;
                                padding: 6px 0 7px 0;
                                box-shadow: inherit;
                            }
                        }
                    }
                }
            }
        }
    }
    .service-desk__dialog-actions {
        margin: 21px;
        .service-desk__dialog-actions--create {
            margin-left: 22px;
            margin-right: 2px;
        }
        .service-desk__dialog-actions--cancel {
            margin-right: 0;
        }
    }
}
