.mailpit-email { min-width: 0; }
.mailpit-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.mailpit-heading h2 { margin: 0; }
.mailpit-heading > span { border: 1px solid #535e78; color: #bec4d4; font-size: 11px; padding: 7px 9px; line-height: 1.5; }
.mailpit-email > .nbi-muted, .mailpit-source p { max-width: 90ch; font-size: 13px; line-height: 1.6; }
.mailpit-transport { display: flex; gap: 7px 16px; flex-wrap: wrap; align-items: baseline; padding: 14px 0; border-bottom: 1px solid #46516c; font-size: 13px; }
.mailpit-transport > span { color: #b2bed6; font-size: 12px; }
.mailpit-transport > p { flex-basis: 100%; margin: 0; font-size: 12px; line-height: 1.6; }
.mailpit-fields { min-width: 0; margin: 18px 0; padding: 12px 16px; border: 1px solid #46516c; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 4px 20px; }
.mailpit-fields legend { color: #c3cadb; font-size: 13px; padding: 0 6px; }
.mailpit-check { min-height: 44px; display: flex; align-items: center; gap: 9px; font-size: 13px; line-height: 1.5; }
.mailpit-check input { accent-color: #56c0a7; width: 17px; height: 17px; flex-shrink: 0; }
.mailpit-enable { grid-column: 1/-1; font-weight: 500; }
.mailpit-kind-group { margin: 4px 0; padding: 10px 12px; min-width: 0; border: 1px solid #46516c; }
.mailpit-kind-group > p { color: #b2bed6; font-size: 12px; line-height: 1.5; margin: 2px 0 8px; }
.mailpit-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 14px 0; font-size: 13px; }
.mailpit-filter select { color: inherit; background: #252c43; border: 1px solid #535e78; border-radius: 4px; padding: 8px 10px; max-width: 100%; min-height: 44px; }
.mailpit-source { font-size: 13px; color: #b2bed6; }
.mailpit-source strong { color: #dce2ef; }
.mailpit-source p { margin: 7px 0; }
.mailpit-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin: 18px 0 24px; }
.mailpit-actions :is(button,a) { min-height: 44px; }
.mailpit-inbox { display: inline-flex; align-items: center; box-sizing: border-box; text-decoration: none; }
.mailpit-email h3 { font-size: 15px; margin: 22px 0 10px; }
.mailpit-records > p { font-size: 12px; line-height: 1.6; }
.mailpit-outbox { min-width: 0; width: 100%; border: 1px solid #46516c; border-radius: 4px; overflow: hidden; }
.mailpit-outbox table { width: 100%; border-collapse: collapse; font-size: 12px; table-layout: fixed; }
.mailpit-outbox th, .mailpit-outbox td { text-align: left; vertical-align: top; padding: 11px 12px; line-height: 1.5; border-bottom: 1px solid #3e4860; overflow-wrap: anywhere; }
.mailpit-outbox thead th { background: #252c43; color: #b8c3d9; font-weight: 500; font-size: 11px; }
.mailpit-outbox thead th:first-child { width: 29%; }
.mailpit-outbox tbody th { font-weight: 500; }
.mailpit-outbox small { display: block; color: #acb7cf; font-size: 10px; margin-top: 4px; overflow-wrap: anywhere; }
.mailpit-outbox tr:last-child > * { border-bottom: 0; }
.mailpit-outbox tbody tr:hover { background: #303b54; }
.mailpit-result { color: #d5ddef; }
.mailpit-result-captured { color: #82d6bd; }
.mailpit-result-unknown, .mailpit-result-failed_retryable { color: #e1c37e; }
.mailpit-recovery { margin: 16px 0; padding: 14px; border: 1px solid #7d714e; font-size: 13px; line-height: 1.6; }
.mailpit-recovery > p { margin: 7px 0 12px; }
.mailpit-empty { border: 1px dashed #556683; padding: 14px; font-size: 13px; line-height: 1.6; color: #b7c4db; }
.mailpit-empty p { margin: 7px 0 0; }
.mailpit-loading { min-height: 52px; padding: 14px 0; font-size: 13px; }
.mailpit-email :is(button,input,select,a):focus-visible { outline: 2px solid #6ad9be; outline-offset: 3px; }
.mailpit-email button:disabled, .mailpit-email fieldset:disabled { opacity: .55; }
.mailpit-inbox:hover { background: #303b54; }
.mailpit-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 639px) {
  .mailpit-fields { grid-template-columns: minmax(0,1fr); padding: 10px 12px; }
  .mailpit-actions :is(button,a) { flex: 1 1 auto; justify-content: center; }
  .mailpit-outbox thead { display: none; }
  .mailpit-outbox :is(table,tbody,tr,th,td) { display: block; width: auto; }
  .mailpit-outbox tr { padding: 12px; }
  .mailpit-outbox tr + tr { border-top: 1px solid #46516c; }
  .mailpit-outbox :is(th,td) { padding: 5px 0; border: 0; }
  .mailpit-outbox td::before { display: block; content: attr(data-label); color: #b8c3d9; font-size: 10px; margin-bottom: 3px; }
}
