/* MailPier Inbox: plain Bootstrap plus a few brand rules. Colours meet WCAG AA contrast on their backgrounds. */
.mp-top { background: #0b3d5c; }
.mp-brand { color: #fff; font-weight: 600; text-decoration: none; }
.mp-brand:hover, .mp-brand:focus { color: #d4ecff; }
.mp-logo { vertical-align: -6px; }
.mp-top .nav-link { color: #e6f3ff; }
.mp-top .nav-link:hover, .mp-top .nav-link:focus { color: #fff; text-decoration: underline; }
.mp-page { min-height: 100vh; display: flex; flex-direction: column; }
.mp-page > main { flex: 1 0 auto; }
.mp-footer { color: #595f66; border-top: 1px solid #dee2e6; }
.mp-footer a { color: #595f66; }
.mp-legal { max-width: 820px; }
.mp-legal h2 { font-size: 1.25rem; margin-top: 1.75rem; }
.mp-mail-list .list-group-item { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr) auto; gap: .75rem; align-items: baseline; }
.mp-mail-list .list-group-item:focus { outline: 3px solid #0b6bcb; outline-offset: -3px; }
.mp-mail-to, .mp-mail-from { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mp-mail-subject { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mp-when { color: #595f66; font-size: .875rem; white-space: nowrap; }
.mp-html-frame { width: 100%; min-height: 480px; border: 1px solid #dee2e6; border-radius: .375rem; background: #fff; }
.mp-code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1.25rem; letter-spacing: .1em; }
.mp-pre { background: #f6f8fa; padding: .75rem; border-radius: .375rem; white-space: pre-wrap; word-break: break-word; max-height: 480px; overflow: auto; }
.mp-key { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all; }
.mp-headers th { width: 9rem; font-weight: 600; color: #3b4148; }
.visually-hidden-focusable:focus { position: static !important; }
@media (max-width: 640px) { .mp-mail-list .list-group-item { grid-template-columns: 1fr; gap: .1rem; } }
#blazor-error-ui { background: lightyellow; bottom: 0; box-shadow: 0 -1px 2px rgba(0,0,0,.2); display: none; left: 0; padding: .6rem 1.25rem .7rem; position: fixed; width: 100%; z-index: 1000; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: .75rem; top: .5rem; }
