/* The mail tools: input form, delivery path, message text, links and recommendations. */
.mail-raw { width: 100%; min-height: 170px; }
.mail-form { border-radius: 14px; transition: outline-color .15s; }
.mail-form.dragover { outline: 2px dashed var(--ink-2); outline-offset: 8px; }
.mail-file .input { padding: 9px 12px; }
.privacy-note { margin: 4px 0 0; }
.get-headers { margin-top: 4px; }
.get-headers ul { margin: 8px 0 0; padding-left: 20px; display: grid; gap: 8px; font-size: 13.5px; color: var(--ink-2); }

.wait { display: flex; align-items: center; gap: 8px; min-width: 120px; }
.wait-track { flex: none; width: 56px; height: 6px; background: var(--panel-3); border-radius: 3px; overflow: hidden; }
.wait-bar { display: block; height: 100%; min-width: 2px; background: var(--info); border-radius: 3px; }
.wait-bar.neg { background: var(--warn); }

.mail-body {
  margin: 0; padding: 14px 16px; max-height: 560px; overflow: auto;
  white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px;
  font-family: var(--font-sans); font-size: 14.5px; line-height: 1.6; color: var(--ink);
}
.mail-body:focus-visible { outline: 2px solid var(--ink-2); outline-offset: 2px; }
.body-toggle { display: inline-flex; gap: 4px; padding: 3px; background: var(--field); border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px; }
.body-toggle button { font: inherit; font-size: 13px; padding: 6px 12px; border: 0; border-radius: 7px; background: transparent; color: var(--ink-2); cursor: pointer; }
.body-toggle button[aria-pressed="true"] { background: var(--ink); color: var(--bg); }
.body-toggle button:focus-visible { outline: 2px solid var(--ink-2); outline-offset: 1px; }

.linklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.linklist li { border-top: 1px solid var(--line); padding-top: 10px; display: grid; gap: 4px; min-width: 0; }
.link-note { font-size: 13px; }
.link-actions { display: flex; flex-wrap: wrap; gap: 8px; }

.tag { font-size: 10.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); border: 1px solid var(--line-2); border-radius: 4px; padding: 0 5px; white-space: nowrap; }
.chips-col, .links-col { display: grid; gap: 6px; justify-items: start; }
.plain-summary { margin: 0 0 12px; line-height: 1.6; white-space: pre-line; overflow-wrap: anywhere; }
.requester-line { margin: 0; }

.recs { margin: 0; padding-left: 22px; display: grid; gap: 16px; }
.recs li > strong { display: block; margin-bottom: 4px; }
.recs ol, .recs ul { margin: 8px 0 0; padding-left: 20px; display: grid; gap: 4px; color: var(--ink-2); font-size: 13.5px; }
.enrich { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.reg-cell { font-size: 13px; }
