/*PORTAL*/
/*>>> ANY modifications here will likely need to be done in the portal's messageCenter.css <<< */

/*Icons For Files - Shared between Doc Imaging and Message Center*/
.Unknown-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 300;
    font-size: 1.25rem;
    color: darkslategray;
    content: "\f15b";
}

.PDF-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #cf0000;
    content: "\f1c1";
}

.Word-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #2b579a;
    content: "\f1c2";
}

.Excel-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #217346;
    content: "\f1c3";
}

.Powerpoint-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #d24726;
    content: "\f1c4";
}

.Text-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: darkgray;
    content: "\f15c";
}

.Image-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #092771;
    content: "\f1c5";
}

.Archive-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: brown;
    content: "\f1c6";
}

.Audio-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #092771;
    content: "\f1c7";
}

.Email-icon::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1.25rem;
    color: #0072c6;
    content: "\f658";
}

/*Conversations ---- Message Center Related*/

.card-mc {
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
    margin-bottom: 1rem;
}

.col-mc-title {
    display: inline-block;
}

.container-mc-title {
    display: flex;
    width: 100%;
    padding: 1rem;
}

.container-mc-title button {
    padding: .25rem .5rem;
    position: relative;
    top: 0.6rem;
}

.container-mc-title button:hover {
    border: 1px solid #063256;
    border-radius: .25rem;
}

.container-mc-title h4 {
    display: inline-block;
    margin: 0;
    margin: 0 1rem;
    padding: 0;
    line-height: 2.7rem;
    font-size: 1.25rem;
}

.container-mc-title h5 {
    display: inline-block;
    margin: 0;
    margin: 0;
    padding: 0;
    line-height: 2.7rem;
    font-size: 1rem;
}

.rounded-mc-title {
    min-width: 3rem;
    height: 3rem;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 50%;
    padding: 0.60rem;
    line-height: 1.6rem;
    text-align: center;
    font-size: 1.4rem;
}

.container-mc-first-msg {
    padding: 0.75rem 1.5rem;
    padding-top: 0;
    font-size: 1rem;
}

.container-mc-convo {
    display: block;
    width: 100%;
    padding: 0.75rem 1.5rem;
    font-size: 0.8rem;
    border-top: 1px solid rgba(0,0,0,.125);
}

.container-msg-mc {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: .25rem;
    margin-bottom: 0.5rem;
}

.container-mc-more-replies {
    display: inline-block;
    margin-bottom: 0.5rem;
    color: darkblue;
}

.container-mc-more-replies a{
    color: #092771 !important;
}

.container-mc-more-replies a:hover, a:active {
    text-decoration: underline !important;
}

.from-mc {
    background-color: rgba(0,0,0,.125);
}


.container-mc-rounded {
    display: inline;
    float: left;
    max-width: 5rem;
    height: 100%;
}

.mc-rounded {
    min-width: 2rem;
    height: 2rem;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 50%;
    padding: 0.35rem;
    text-align: center;
}

.container-msg-mc-content {
    padding-left: 2.5rem;
    width: auto !important;
}

.container-msg-mc-content h4 {
    display: inline;
    width: auto;
    margin: 0;
    padding: 0;
    font-size: 0.8rem;
}

.container-msg-mc-content h5 {
    display: inline;
    margin: 0;
    margin-left: 0.5rem;
    padding: 0;
    font-size: 0.75rem;
}

.msg-mc {
    font-size: 1rem;
}

.container-mc-convo-reply {
    display: block;
    width: 100%;
}

.container-mc-convo-reply textarea {
    margin: 0;
    padding: 0.25rem 0.5rem;
    height: 2.15rem;
    max-height: 300px;
    border: 0;
    border-radius: 0;
    resize: vertical;
    overflow-y: auto;
    font-size: 0.85rem;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0;
    border-bottom-left-radius: 0.25rem;
    border-top-left-radius: 0.25rem;
}

.container-mc-convo-reply button {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    resize: none;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 0;
    border-bottom-right-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    min-width: 5rem;
}
@media(max-width: 767px) {
    .container-mc-convo-reply button {
        padding: 1rem;
        border-radius: 0;
    }
    .container-mc-convo-reply textarea {
        min-height: 4rem;
    }
}

.file-mc {
    margin: 0.25rem;
    font-size: 0.8rem;
}

.file-mc i {
    color: gray;
}

.table-mc {
    margin: 1rem;
    font-size: 0.8rem;
    line-height: 1;
}

.table-mc tr {
    padding-right: .25rem;
    line-height: 1;
    border-bottom: 1px solid rgba(0,0,0,.125);
}

.table-mc tr:last-child {
    border-bottom: none;
}


.table-mc button:hover {
    border-radius: .25rem;
}

@media(max-width: 767px) {
    .table-mb {
        box-sizing: border-box;
        margin: 0;
    }
}

.system-message-mc{
    opacity: 0.7;
    font-style: italic;
}