CSS to beautify HCL Verse webmail.

hcl-verse.css

:root {
  --main-blue: #146db3;
  --light-blue: #448ec8;
  --lighter-blue: #e8ebf4;
  --gray: #363636;
  --orange: #ff9d00;
  --red: #dd2b0b;
  --radius: 6px;
}

/*header*/

.ics-scbanner{
    background-color: var(--gray);
}

.ics-scbanner>.selected:after{
     border-color: var(--orange)
}

.seq-window .compose-button{
    background-color: var(--main-blue);
    border-radius: var(--radius) 0 0 var(--radius);
}

.seq-window .outgoing-button {
    background-color: var(--main-blue);
    border-radius: 0 var(--radius) var(--radius) 0;
}

.seq-window .compose-button:focus:before, .seq-window .compose-button:hover:before{
     border-radius: var(--radius) 0 0 var(--radius);
}

.seq-window.tray-open .outgoing-button{
    background-color: var(--main-blue);
}

.outgoing-tray{
    background-color: var(--main-blue);
    border-radius: 0 0 var(--radius) var(--radius);
}

.outgoing-msg-info {
    border-color: #448ec8 !important;
}

.set-base{
    border-radius: 10px;
    width: 34px !important;
    height: 34px !important;
    margin-top: 18px !important;
}

.set-icon{
    width: 15px !important;
    height: 15px !important;
}

.inbox-icon-sm{
    width: 10px !important;
    height: 10px !important;
    margin-left: -2px;
}

.onprem.itm-closed:not(.nomad) .seq-window .seq-header .itm-toggler{
    margin-right: 160px;
}

.onprem.itm-closed:not(.nomad) .seq-window .set-side-bar .set-base.keyset.inbox.show-focus-count .focus-count, .onprem.itm-closed:not(.nomad) .seq-window .set-side-bar .set-base.keyset.needs-attention.show-focus-count .focus-count, .onprem.itm-closed:not(.nomad) .seq-window .set-side-bar .set-base.keyset.waiting-for.show-focus-count .focus-count{
   border-radius:  0 0 10px 10px;
    width: 32px;
    margin-top: 16px;
    font-size: 10px;
    line-height: 16px;
    height: 15px
}

.onprem.itm-closed:not(.nomad) .seq-window .set-side-bar .set-base.keyset.inbox.selectedSet{
    margin-top: 13px;
}


.set-base.selectedSet{
    border-color: var(--main-blue);
    border-width: 1px;
}

.seq-window .seq-search-container, .seq-search-container .seq-search-bar {
    border-radius: var(--radius) !important; 
    padding-left: 4px;
}

/* Elenco messaggi */

.action-bar button{
    font-weight: bold;
}

.seq-msg-row.focused, .seq-msg-row:focus, .seq-msg-row:hover{
    border-color: var(--main-blue);
}

.seq-msg-row.selected:not(.checked):before{
    border-color: var(--main-blue);
}

.seq-mcv .resizable-divider{
    border: 0;
}

.seq-msg-row.selected{
    background-color: var(--lighter-blue)
}

.seq-msg-row>.avatar .initials {
    color: var(--main-blue);
}

.seq-msg-row .divider, .date-header{
    color: var(--main-blue) !important;
    font-weight: bold;
}

/* Messaggio */


.socmail-mailreadview .pim-mailread-subject h2 {
    font-weight: 600;
    color: var( --gray);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.socmail-calendarreadview .pimMailSubject {
    font-weight: bold !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.dockable.docked-compose.has-action-bar .title-and-content>.action-bar{
    background-color: var(--main-blue);
    border-radius: var(--radius) 0 0 0 !important;
}

.pim-mailread-recipient{
    opacity: 0.6;
}

.pim-mailread-sentdate{
    font-weight: bold;
}

.socpimAwareness{
    display: none
}

.socpimMailSenderLabel, .socpimToLabel, .socpimCcLabel{
    font-weight: bold
}

.socpimDiscard{
    border-radius: var(--radius) !important;
}

.socpimSend{
    border-radius: var(--radius) 0 0 var(--radius) !important;
}

.socpimComposeView .socpimComposeDialog .socpimDialogFooter .socpimBtn.socimSendOption{
    border-radius: 0 var(--radius) var(--radius) 0 !important;
}

/* Barra calendario sotto la mail */

.currentTimeBar{
    background-color: var(--red);
    width: 2px;
}

.nextMeetingLabel{
    color: var(--red);
}

/* Calendario */

.seq-window .seq-header .create-button, .seq-window .seq-header .create-button:focus:before, .seq-window .seq-header .create-button:hover:before {
    border-radius: var(--radius);
}