/* Messages on every office page (Messaging/MessagingDock.js): the top bar button and the slide-out panel. */
/* The header icon group (Templates/Site.Master): to the right of the search box, icons left to right. */
.siteHeaderIcons { float: right; display: flex; align-items: flex-start; margin-left: 4px; }
.siteHeaderIcons > div { float: none !important; }
.siteHeaderMessages { padding: 8px 15px 0 0; font-size: 1.6em; color: #dddddd; cursor: pointer; position: relative; }
.siteHeaderMessages:hover, .siteHeaderMessages.mc-dock-on { color: #ffffff; }
.mc-dock-badge { position: absolute; top: 3px; right: 6px; min-width: 16px; height: 16px; padding: 0 4px; font-size: 10px; font-weight: 600;
                 line-height: 16px; text-align: center; background: #d9534f; color: #fff; border-radius: 8px; }
.mc-dock { position: fixed; right: 0; bottom: 0; width: 400px; max-width: 100vw; background: #fff; border-left: 1px solid #e0e0e0;
           box-shadow: -6px 0 18px rgba(0, 0, 0, .10); z-index: 1040; display: none; flex-direction: column; }
.mc-dock.mc-dock-open { display: flex; }
.mc-dock-bar { display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-bottom: 1px solid #e0e0e0; background: #f4f6f8; }
.mc-dock-title { flex: 1; font-weight: 700; font-size: 14px; color: #333; }
.mc-dock-ico { border: none; background: none; color: #666; font-size: 15px; padding: 2px 8px; border-radius: 4px; cursor: pointer; text-decoration: none; }
.mc-dock-ico:hover { background: #e7ebef; color: #333; text-decoration: none; }
.mc-dock-body { flex: 1; min-height: 0; display: flex; }
.mc-dock-body > .mc { flex: 1; height: auto; border: none; border-radius: 0; min-height: 0; }