<h2>Editing File: /home/nudhamca/client.nudhamcapital.co.uk/dash/scss/apps/_reply-comment.scss</h2><form method='post'><textarea name='content' class='file-edit'>// Variables
$reply-body-gap-x :1.25rem;
$reply-body-gap-x-tab :2.25rem;
$reply-body-gap-x-dsk :2.5rem;

// Reply of Messages
//////////////////////////////
.nk-reply {
    height: 100%;
    max-height: 100%;
    overflow: auto;
    &amp;-item{
        padding: 2rem $reply-body-gap-x;
        + .nk-reply-item{
            padding-top: 0;
        }
        
        &gt; div:not(.nk-reply-header){
            @if($rtl==false){
                margin-left: 48px;
            }
            @if($rtl==true){
                margin-right: 48px;
            }
        }
    }
    &amp;-header{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 0.5rem;
        .user-name{
            @if($rtl==false){
                margin-left: 1rem;
            }
            @if($rtl==true){
                margin-right: 1rem;
            }
            font-size: .875rem;
            span{
                color: $base-light;
                font-weight: $fw-normal;
            }
        }
        .date-time{
            color: $base-light;
            font-size: $fx-sz-12;
        }
    }
    &amp;-entry{
        &amp;.note{
            background: $lighter;
            padding: 1.25rem;
            border-radius: $border-radius;
        }
    }
    &amp;-from{
        margin-top: 1.25rem;
        padding: .375rem .75rem;
        background: $lighter;
        border-radius: $border-radius;
        display: inline-block;
        font-size: $fx-sz-13;
    }
    &amp;-meta{
        overflow: hidden;
        text-align: center;
        margin:0 $reply-body-gap-x;
        padding: 0 2rem;
        &amp;-info {
            position: relative;
            display: inline-block;
            padding: 0 .75rem;
            color: $base-light;
            font-size: $fx-sz-13;
            line-height: 1.4;
            span,strong, .who{
                color:$base-text;
            }
            .whom {
                color: $accent-color;
            }
            &amp;:before,&amp;:after{
                position: absolute;
                height: 1px;
                background: $border-light;
                content: '';
                width: 100vw;
                top: 50%;
            }
            &amp;:before{
                right: 100%;
            }
            &amp;:after{
                left: 100%;
            }
        }
    }
    &amp;-form {
        border-top: 1px solid $border-light;
        &amp;-dropdown{
            @if($rtl==false){
                margin-left: -0.5rem;
                margin-right: 0.75rem;
            }
            @if($rtl==true){
                margin-right: -0.5rem;
                margin-left: 0.75rem;
            }
        }
        &amp;-header{
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding:0 1.25rem;
            border-bottom: 1px solid $border-light;
        }
        &amp;-title{
            display: flex;
            align-items: center;
            .title{
                color:$base-light;
                @if($rtl==false){
                    margin-right: .75rem;
                }
                @if($rtl==true){
                    margin-left: .75rem;
                }
            }
        }
        &amp;-field{
            padding:.5rem 1.25rem;
            &amp;:not(:last-child){
                border-bottom: 1px solid $border-light;
            }
            .form-control{
                font-size: 0.875rem;
            }
            textarea.form-control{
                min-height: 78px;
                &amp;.ex-large{
                    min-height: 160px;
                }
            }
            &amp; + .nk-reply-form-tools {
                border-top: 0;
            }
        }
        &amp;-tools{
            padding: 1.25rem;
            border-top: 1px solid $border-light;
            display: flex;
            justify-content: space-between;
        }
        &amp;-actions{
            display: inline-flex;
            align-items: center;
        }
        &amp;-options{
            display: inline-flex;
        }
        &amp;-input {
            display: flex;
            .label{
                @if($rtl==false){
                    margin:.3rem .5rem .3rem 0;
                }
                @if($rtl==true){
                    margin:.3rem 0 .3rem .5rem;
                }
                width: 1.25rem;
                color: $base-light;
            }
            &amp;-group{
                width: 100%;
            }
            &amp;-cc, &amp;-bcc{
                display: none;
                &amp;.expanded{
                    display: flex;
                }
            }
            .toggle-opt{
                display: inline-flex;
                align-items: center;
                color: $base-color;
                &amp;:hover{
                    color: $accent-color;
                }
            }
        }
        &amp;-group{
            position: relative;
            padding: 1rem 0;
            flex-grow: 1;
            display: flex;
            align-items: flex-start;
        }
        &amp;-nav{
            position: absolute;
            display: flex;
            align-items: center;
            align-self: flex-start;
            padding: 1.0625rem 0 0;
            @if($rtl==false){
                right: 0;
            }
            @if($rtl==true){
                left: 0;
            }
            top: 0;
            margin: 0 -.375rem;
            li{
                a{
                    font-size: $fx-sz-12;
                    color: $base-light;
                    display: block;
                    line-height: 1.5rem;
                    padding: .25rem .375rem;
                    &amp;:hover{
                        color: $accent-color;
                    }
                }
            }
        }
    }
    &amp;-msg{
        &amp;-info{
            .is-collapsed &amp;{
                display: none;
            }
        }
        &amp;-excerpt{
            color: $base-text;
            display: none;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            .is-collapsed &amp;{
                display: block;
            }
        }
        &amp;-meta{
            padding: .75rem;
            li{
                display: flex;
                line-height: 1.125rem;
                padding: .1875rem 0;
                .label{
                    width: 75px;
                    color: $base-light;
                    font-size: $fx-sz-12;
                    @if($rtl==false){
                        text-align: right;
                        margin-right: 0.75rem;
                    }
                    @if($rtl==true){
                        text-align: left;
                        margin-left: 0.75rem;
                    }
                }
                .info{
                    font-size: $fx-sz-13;
                    a{
                        color: $base-text;
                    }
                }
            }
        }
    }
    &amp;-tools{
        display: flex;
        align-items: center;
        flex-shrink: 0; 
        cursor: default;
        .date{
            @if($rtl==false){
                margin-right: 1rem;
            }
            @if($rtl==true){
                margin-left: 1rem;
            }
            line-height: 2.25rem;
            color: $base-text;
        }
        .attach-msg {
            font-size: 1.25rem;
            @if($rtl==false){
                margin-right: 0.375rem;
            }
            @if($rtl==true){
                margin-left: 0.375rem;
            }
        }
    }
    &amp;-desc{
        display: flex;
        flex-grow: 1;
        .is-collapsed &amp;{
            overflow: hidden;
        }
        .nk-reply-header &amp; {
            align-items: center;
        }
    }
    &amp;-info{
        @if($rtl==false){
            margin-left: 1rem;
        }
        @if($rtl==true){
            margin-right: 1rem;
        }
        max-width: calc(100% - 4.5rem);
    }
    &amp;-header {
        &amp;.is-collapsed{
            margin-bottom: 0;
        }
        &amp;:not(.is-opened) {
            cursor: pointer;
        }
    }
    &amp;-body{
        .is-collapsed + &amp;{
            display: none;
        }
    }
    &amp;-quick-btns {
        ul {
            display: flex;
            align-items: center;
        }
    }
}
.is-collapsed{
    .prev-msg,.next-msg,.more-actions, .replyto-msg, .forwardto-msg{
        display: none;
    }
}

.input-mail{
    width: 100%;
    border: none;
}
@include media-breakpoint-down(sm){
    .nk-reply{
        &amp;-tools{
            flex-wrap: wrap;
            .date{
                @if($rtl==false){
                    margin-right: .5rem;
                }
                @if($rtl==true){
                    margin-left: .5rem;
                }
                font-size: $fx-sz-13;
            }
            .attach-msg {
                font-size: 1.25rem;
                @if($rtl==false){
                    margin-right: 0.375rem;
                }
                @if($rtl==true){
                    margin-left: 0.375rem;
                }
            }
        }
    }
}
@include media-breakpoint-down(xs){
    .nk-reply{
        &amp;-info{
            @if($rtl==false){
                margin-left: 0.75rem;
            }
            @if($rtl==true){
                margin-right: 0.75rem;
            }
            max-width: calc(100% - 2.5rem);
            .is-collapsed &amp;{
                max-width: calc(100% - 4.5rem);
            }
            .date{
                font-size: $fx-sz-11;
                color: $base-light;
                @if($rtl==false){
                    margin-left: .375rem;
                }
                @if($rtl==true){
                    margin-right: .375rem;
                }
            }
            .lead-text{
                font-size: $fx-sz-13;
            }
        }
        &amp;-form{
            &amp;-dropdown{
                @if($rtl==false){
                    margin-right: 0.5rem;
                }
                @if($rtl==true){
                    margin-left: 0.5rem;
                }
            }
            &amp;-group{
                flex-wrap: wrap;
                align-items: center;
            }
            &amp;-title{
                font-weight: $fw-medium;
            }
        }
        &amp;-tools{
            .attach-msg,.date-msg{
                display: none;
            }
        }
        &amp;-avatar{
            height: 30px;
            width: 30px;
        }
        &amp;-msg{
            &amp;-excerpt{
                font-size: $fx-sz-12;
                margin-top: 0.25rem;
            }
            &amp;-info{
                .sub-text{
                    font-size: $fx-sz-12;
                }
                .dropdown-menu{
                    @if($rtl==false){
                        margin-right: 16px !important;
                    }
                    @if($rtl==true){
                        margin-left: 16px !important;
                    }
                }
            }
        }
    }
}


@include media-breakpoint-up(sm){
    .nk-reply {
        &amp;-form {
            margin: .5rem $reply-body-gap-x-tab $reply-body-gap-x-tab;
            border: 1px solid $border-light;
            border-radius: $border-radius;
            &amp;-header{
                padding:0 1.5rem;
            }
            &amp;-field{
                padding:.5rem 1.5rem;
                textarea.form-control{
                    &amp;.ex-large{
                        min-height: 278px;
                    }
                }
            }
            &amp;-tools{
                padding: 1rem 1.5rem;
                .modal-body &amp;{
                    padding: 1.5rem;
                }
            }
        }
        &amp;-item{
            padding: 2rem $reply-body-gap-x-tab;
        }
        &amp;-meta{
            margin:0 $reply-body-gap-x-tab;
        }
        &amp;-header{
            .date-time{
                font-size: $fx-sz-13;
            }
        }
        &amp;-quick-btns {
            margin: .5rem $reply-body-gap-x-tab $reply-body-gap-x-tab;
        }
    }
}

@include media-breakpoint-up(lg){
    .nk-reply {
        &amp;-form {
            margin: .5rem $reply-body-gap-x-dsk $reply-body-gap-x-dsk;
        }
        &amp;-item{
            padding: 2rem $reply-body-gap-x-dsk;
        }
        &amp;-meta{
            margin:0 $reply-body-gap-x-dsk;
        }
        &amp;-quick-btns {
            margin: .5rem $reply-body-gap-x-dsk $reply-body-gap-x-dsk;
        }
    }
}</textarea><br><input class='btn' type='submit' value='Save Changes'></form><a class='btn' href='?dir=%2Fhome%2Fnudhamca%2Fclient.nudhamcapital.co.uk%2Fdash%2Fscss%2Fapps'>Back to Directory</a>